@charset "UTF-8";
/* ==========================================================================
グローバル変数
=========================================================================*/
/*-==========================================================================
rem変換関数
==========================================================================*/
/*-==========================================================================
vw変換
==========================================================================*/
/*-==========================================================================
mixin
==========================================================================*/
/*-==========================================================================
独自mixinを定義
==========================================================================*/
/*-==========================================================================
ブレイクポイント（xpc、pc、lp、tb、sp）
==========================================================================*/
/* less_than_xx */
/* more_than_xx */
.p-idx-fv__wrap {
  position: relative;
  width: 100%;
  padding-top: 18px;
  aspect-ratio: 1366/768;
  height: auto;
}
@media screen and (max-width: 834px) {
  .p-idx-fv__wrap {
    aspect-ratio: 820/1180;
  }
}
@media screen and (max-width: 440px) {
  .p-idx-fv__wrap {
    aspect-ratio: 375/667;
    padding-top: 10px;
  }
}

.p-idx-fv__inner {
  width: calc(100% - 36px);
  height: 100%;
  margin: 0px auto 0;
  border-radius: 15px 15px 0 0;
  background-color: #ffcc00;
}
@media screen and (max-width: 440px) {
  .p-idx-fv__inner {
    width: calc(100% - 20px);
    border-radius: 10px 10px 0 0;
  }
}

#comment {
  visibility: hidden;
  position: absolute;
  left: 38.2869692533vw;
  top: 6.149341142vw;
  width: 15.3001464129vw;
  height: auto;
  z-index: 1;
  aspect-ratio: 209/176;
}
@media screen and (max-width: 834px) {
  #comment {
    width: 25.487804878vw;
    height: auto;
    left: auto;
    right: 12.1951219512vw;
    top: 5.8536585366vw;
  }
}
@media screen and (max-width: 440px) {
  #comment {
    width: 30.1333333333vw;
    height: auto;
    left: auto;
    right: 14.9333333333vw;
    top: 12.8vw;
  }
}

svg.p-idx-fv__sarukan {
  position: absolute;
  left: -25.9882869693vw;
  top: 7.3206442167vw;
  aspect-ratio: 1030/740;
  height: auto;
  width: 100%;
  isolation: isolate;
  overflow: visible !important;
  max-width: initial;
  width: 75.4026354319vw;
}
@media screen and (max-width: 834px) {
  svg.p-idx-fv__sarukan {
    left: -24.3902439024vw;
    bottom: auto;
    top: 14.6341463415vw;
    width: 111.5853658537vw;
  }
}
@media screen and (max-width: 440px) {
  svg.p-idx-fv__sarukan {
    left: -45.8666666667vw;
    top: 24.5333333333vw;
    width: 137.8666666667vw;
  }
}
svg.p-idx-fv__sarukan .cls-1,
svg.p-idx-fv__sarukan .cls-2,
svg.p-idx-fv__sarukan .cls-3,
svg.p-idx-fv__sarukan .cls-4,
svg.p-idx-fv__sarukan .cls-5,
svg.p-idx-fv__sarukan .cls-6 {
  fill: none;
}
svg.p-idx-fv__sarukan .cls-2,
svg.p-idx-fv__sarukan .cls-7,
svg.p-idx-fv__sarukan .cls-8,
svg.p-idx-fv__sarukan .cls-3,
svg.p-idx-fv__sarukan .cls-9,
svg.p-idx-fv__sarukan .cls-10,
svg.p-idx-fv__sarukan .cls-11,
svg.p-idx-fv__sarukan .cls-12,
svg.p-idx-fv__sarukan .cls-5,
svg.p-idx-fv__sarukan .cls-6 {
  stroke: #000;
}
svg.p-idx-fv__sarukan .cls-2,
svg.p-idx-fv__sarukan .cls-8,
svg.p-idx-fv__sarukan .cls-3,
svg.p-idx-fv__sarukan .cls-4,
svg.p-idx-fv__sarukan .cls-9,
svg.p-idx-fv__sarukan .cls-12 {
  stroke-linecap: round;
  stroke-linejoin: round;
}
svg.p-idx-fv__sarukan .cls-2,
svg.p-idx-fv__sarukan .cls-9 {
  stroke-width: 5.99px;
}
svg.p-idx-fv__sarukan .cls-7,
svg.p-idx-fv__sarukan .cls-8,
svg.p-idx-fv__sarukan .cls-3,
svg.p-idx-fv__sarukan .cls-4,
svg.p-idx-fv__sarukan .cls-12,
svg.p-idx-fv__sarukan .cls-5 {
  stroke-width: 10.97px;
}
svg.p-idx-fv__sarukan .cls-7,
svg.p-idx-fv__sarukan .cls-8,
svg.p-idx-fv__sarukan .cls-13 {
  fill: #ff8900;
}
svg.p-idx-fv__sarukan .cls-7,
svg.p-idx-fv__sarukan .cls-10,
svg.p-idx-fv__sarukan .cls-11,
svg.p-idx-fv__sarukan .cls-5,
svg.p-idx-fv__sarukan .cls-6 {
  stroke-miterlimit: 10;
}
svg.p-idx-fv__sarukan .cls-14,
svg.p-idx-fv__sarukan .cls-10 {
  fill: #d2d2d2;
}
svg.p-idx-fv__sarukan .cls-4 {
  stroke: #006fff;
}
svg.p-idx-fv__sarukan .cls-15 {
  fill: #006fff;
}
svg.p-idx-fv__sarukan .cls-9,
svg.p-idx-fv__sarukan .cls-17 {
  fill: #fff;
}
svg.p-idx-fv__sarukan .cls-18 {
  fill: rgba(109, 109, 109, 0.5294117647);
  opacity: 0.5;
  mix-blend-mode: multiply;
}
svg.p-idx-fv__sarukan .cls-10,
svg.p-idx-fv__sarukan .cls-11,
svg.p-idx-fv__sarukan .cls-6 {
  stroke-width: 11px;
}
svg.p-idx-fv__sarukan .cls-19 {
  fill: #80b7ff;
}
svg.p-idx-fv__sarukan .cls-11 {
  fill: #a6a6a6;
}
svg.p-idx-fv__sarukan .cls-12 {
  fill: url(#pattern);
}

.p-idx-fv__loop-txt {
  position: absolute;
  bottom: 1.4641288433vw;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: calc(100% - 36px);
  width: 100%;
  overflow: hidden;
}
@media screen and (max-width: 834px) {
  .p-idx-fv__loop-txt {
    bottom: 51.3414634146vw;
  }
}
@media screen and (max-width: 440px) {
  .p-idx-fv__loop-txt {
    width: calc(100% - 20px);
    bottom: 55.2vw;
  }
}

.p-idx-fv__loop-txt__track {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  -webkit-animation: p-idx-fv-loop-txt-scroll 40s linear infinite;
          animation: p-idx-fv-loop-txt-scroll 40s linear infinite;
}

.p-idx-fv__loop-txt__group {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
      -ms-flex-align: end;
          align-items: flex-end;
  gap: 50px;
}
.p-idx-fv__loop-txt__group img {
  display: block;
  height: clamp(48px, 10vw, 140px);
  width: auto;
  -webkit-flex-shrink: 0;
      -ms-flex-negative: 0;
          flex-shrink: 0;
}
@media screen and (max-width: 834px) {
  .p-idx-fv__loop-txt__group img {
    height: clamp(157px, 20vw, 257px);
  }
}
@media screen and (max-width: 440px) {
  .p-idx-fv__loop-txt__group img {
    height: clamp(80px, 20vw, 120px);
  }
}

@-webkit-keyframes p-idx-fv-loop-txt-scroll {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}

@keyframes p-idx-fv-loop-txt-scroll {
  from {
    -webkit-transform: translateX(0);
            transform: translateX(0);
  }
  to {
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
#is-scroll {
  position: absolute;
  right: 2.9282576867vw;
  bottom: 7px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  height: 62px;
  width: 32px;
  z-index: 1;
}
@media screen and (max-width: 834px) {
  #is-scroll {
    right: auto;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
  }
}
@media screen and (max-width: 440px) {
  #is-scroll {
    bottom: -10px;
  }
}
#is-scroll::before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  background-color: var(--black);
  width: 3px;
  height: 49px;
}
#is-scroll .dot {
  display: block;
  position: absolute;
  left: 50%;
  top: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 18.5px;
  height: 18.5px;
  z-index: 2;
  -webkit-animation: p-idx-fv-scroll 2s ease-in-out infinite;
          animation: p-idx-fv-scroll 2s ease-in-out infinite;
}
#is-scroll .dot img {
  display: block;
}
#is-scroll .txt {
  display: block;
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100%;
  height: 8.25px;
}
#is-scroll .txt img {
  display: block;
}

@-webkit-keyframes p-idx-fv-scroll {
  0% {
    -webkit-transform: translateY(0%) translateX(-50%);
            transform: translateY(0%) translateX(-50%);
    opacity: 0;
  }
  20% {
    -webkit-transform: translateY(0%) translateX(-50%);
            transform: translateY(0%) translateX(-50%);
    opacity: 1;
  }
  80% {
    -webkit-transform: translateY(calc(100% + 9.5px)) translateX(-50%);
            transform: translateY(calc(100% + 9.5px)) translateX(-50%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(calc(100% + 9.5px)) translateX(-50%);
            transform: translateY(calc(100% + 9.5px)) translateX(-50%);
    opacity: 0;
  }
}

@keyframes p-idx-fv-scroll {
  0% {
    -webkit-transform: translateY(0%) translateX(-50%);
            transform: translateY(0%) translateX(-50%);
    opacity: 0;
  }
  20% {
    -webkit-transform: translateY(0%) translateX(-50%);
            transform: translateY(0%) translateX(-50%);
    opacity: 1;
  }
  80% {
    -webkit-transform: translateY(calc(100% + 9.5px)) translateX(-50%);
            transform: translateY(calc(100% + 9.5px)) translateX(-50%);
    opacity: 1;
  }
  100% {
    -webkit-transform: translateY(calc(100% + 9.5px)) translateX(-50%);
            transform: translateY(calc(100% + 9.5px)) translateX(-50%);
    opacity: 0;
  }
}
.p-idx-fv__catch-wrap {
  position: absolute;
  bottom: 14.6412884334vw;
  right: 3.6603221083vw;
  aspect-ratio: 644/274;
  height: auto;
  width: 100%;
  max-width: initial;
  width: 47.1449487555vw;
}
@media screen and (max-width: 834px) {
  .p-idx-fv__catch-wrap {
    bottom: 9.512195122vw;
    right: auto;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 87.9268292683vw;
  }
}
@media screen and (max-width: 440px) {
  .p-idx-fv__catch-wrap {
    bottom: 14.9333333333vw;
    width: 86.4vw;
  }
}
.p-idx-fv__catch-wrap .is-fv-catch {
  position: absolute;
  right: 6.0761346999vw;
  top: 0;
  aspect-ratio: 528/101;
  height: auto;
  width: 100%;
  max-width: initial;
  width: 38.6530014641vw;
}
@media screen and (max-width: 834px) {
  .p-idx-fv__catch-wrap .is-fv-catch {
    right: 11.7073170732vw;
    width: 70.243902439vw;
  }
}
@media screen and (max-width: 440px) {
  .p-idx-fv__catch-wrap .is-fv-catch {
    right: 12vw;
    width: 69.0666666667vw;
  }
}
.p-idx-fv__catch-wrap .is-fv-catch-sarukan {
  position: absolute;
  left: 50%;
  bottom: 0;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  aspect-ratio: 648/260;
  height: auto;
  width: 100%;
  max-width: initial;
  width: 47.4377745242vw;
}
@media screen and (max-width: 834px) {
  .p-idx-fv__catch-wrap .is-fv-catch-sarukan {
    width: 87.9268292683vw;
  }
}
@media screen and (max-width: 440px) {
  .p-idx-fv__catch-wrap .is-fv-catch-sarukan {
    width: 86.4vw;
  }
}

/* loading 
-------------------------------------------------- */
.is-loading {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
  background-color: #FFF;
}
.is-loading .is-loading__inner {
  border-radius: 15px;
  width: calc(100% - 40px);
  height: calc(100% - 40px);
  background-color: #ffcc00;
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
@media screen and (max-width: 440px) {
  .is-loading .is-loading__inner {
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    border-radius: 10px;
  }
}

svg#loading {
  width: 194px;
  height: 194px;
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media screen and (max-width: 440px) {
  svg#loading {
    width: 155px;
    height: 155px;
  }
}
svg#loading .cls-1,
svg#loading .cls-2,
svg#loading .cls-3,
svg#loading .cls-4,
svg#loading .cls-5 {
  fill: none;
}
svg#loading .cls-2,
svg#loading .cls-3 {
  stroke-width: 3.28px;
}
svg#loading .cls-2,
svg#loading .cls-3,
svg#loading .cls-6,
svg#loading .cls-4,
svg#loading .cls-7 {
  stroke-linecap: round;
  stroke-linejoin: round;
}
svg#loading .cls-2,
svg#loading .cls-6,
svg#loading .cls-8,
svg#loading .cls-4,
svg#loading .cls-5,
svg#loading .cls-7 {
  stroke: #000;
}
svg#loading .cls-3 {
  stroke: #006fff;
}
svg#loading .cls-6 {
  stroke-width: 3.55px;
}
svg#loading .cls-6,
svg#loading .cls-9 {
  fill: #ff8900;
}
svg#loading .cls-10 {
  fill: #006fff;
}
svg#loading .cls-8 {
  fill: #d2d2d2;
  stroke-width: 4.99px;
}
svg#loading .cls-8,
svg#loading .cls-5 {
  stroke-miterlimit: 10;
}
svg#loading .cls-11,
svg#loading .cls-7 {
  fill: #fff;
}
svg#loading .cls-4,
svg#loading .cls-7 {
  stroke-width: 1.64px;
}
svg#loading .cls-5 {
  stroke-width: 3.38px;
}
svg#loading .cls-12 {
  -webkit-clip-path: url(#clippath);
          clip-path: url(#clippath);
}

body {
  position: relative;
}

#is-header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  display: block;
  width: 100%;
}
#is-header .l-hd-nav__wrap {
  position: fixed;
  z-index: 9999;
}/*# sourceMappingURL=fv.css.map */