@charset "utf-8";

body {
  font-family: 'Noto Sans', sans-serif;
}

/* ----------
common
---------- */
@media screen and (768px <= width) {
  .linkBtn {
    width: 300px;
  }
}

/* ----------
header
---------- */
/* --- hamburgerMenu --- */
.hamburgerMenu-list > li:nth-child(1) > a {
  width: calc((499px / 2) + 25px);
}
.hamburgerMenu-list > li:nth-child(1) > a img {
  aspect-ratio: 499 / 103;
}
.hamburgerMenu-list > li:nth-child(2) > a {
  width: calc((570px / 2) + 25px);
}
.hamburgerMenu-list > li:nth-child(2) > a img {
  aspect-ratio: 570 / 56;
}
.hamburgerMenu-list > li:nth-child(3) > a {
  width: calc((389px / 2) + 25px);
}
.hamburgerMenu-list > li:nth-child(3) > a img {
  aspect-ratio: 389 / 98;
}
.hamburgerMenu-list > li:nth-child(4) > a {
  width: calc((362px / 2) + 25px);
}
.hamburgerMenu-list > li:nth-child(4) > a img {
  aspect-ratio: 362 / 43;
}
@media screen and (768px <= width) {
  .hamburgerMenu-list > li:nth-child(1) > a {
    width: calc((499px / 1.2) + 50px);
  }
  .hamburgerMenu-list > li:nth-child(2) > a {
    width: calc((570px / 1.2) + 50px);
  }
  .hamburgerMenu-list > li:nth-child(3) > a {
    width: calc(560px + 50px);
  }
  .hamburgerMenu-list > li:nth-child(3) > a img {
    aspect-ratio: 560 / 47;
  }
  .hamburgerMenu-list > li:nth-child(4) > a {
    width: calc((362px / 1.2) + 50px);
  }
}
@media screen and (1000px <= width) {
  .hamburgerMenu-list > li:nth-child(1) > a {
    width: calc(781px + 50px);
  }
  .hamburgerMenu-list > li:nth-child(1) > a img {
    aspect-ratio: 781 / 45;
  }
}

.hamburgerMenu-usefulTtl {
  width: calc(359px / 2);
}
.hamburgerMenu-usefulTtl img {
  aspect-ratio: 359 / 53;
}
@media screen and (768px <= width) {
  .hamburgerMenu-usefulTtl {
    width: calc(359px / 1.2);
  }
}

.hamburgerMenu-usefulList > li > a {
  padding: 0.5em;
}

.hamburgerMenu-site p {
  line-height: 1.5;
}

/* ----------
introduction
---------- */
.introduction-ttl {
  width: calc(777px / 2);
}
.introduction-ttl img {
  aspect-ratio: 777 / 280;
}
@media screen and (768px <= width) {
  .introduction-ttl {
    width: 829px;
  }
  .introduction-ttl img {
    aspect-ratio: 829 / 259;
  }
}

/* ----------
pickup
---------- */
.pickup-ttl {
  width: calc(558px / 2);
}
.pickup-ttl img {
  aspect-ratio: 558 / 199;
}
@media screen and (768px <= width) {
  .pickup-ttl {
    width: 725px;
  }
  .pickup-ttl img {
    aspect-ratio: 725 / 118;
  }
}

/* --- pickupGourmet --- */
.pickupGourmet-bubble {
  right: calc(50% - 140px);
  width: calc(702px / 2);
  aspect-ratio: 702 / 96;
}
.pickupGourmet-ttl {
  top: -20%;
  width: calc(374px / 2);
}
.pickupGourmet-ttl img {
  aspect-ratio: 374 / 111;
}
@media screen and (768px <= width) {
  .pickupGourmet-bubble {
    right: 50%;
    width: calc(702px / 1.5);
  }
  .pickupGourmet-ttl {
    width: calc(374px / 1.5);
  }
}

/* --- pickupYtSection --- */
/* _play */
._play .pickupYtSection-bubble {
  top: -50px;
  width: calc(698px / 2);
  aspect-ratio: 698 / 137;
}
._play .pickupYtSection-ttl {
  width: calc(704px / 2);
  translate: -2% 10%;
}
._play .pickupYtSection-ttl img {
  aspect-ratio: 704 / 129;
}
@media screen and (768px <= width) {
  ._play .pickupYtSection-bubble {
    top: -110px;
    width: calc(698px / 1.5);
  }
  ._play .pickupYtSection-ttl {
    width: calc(704px / 1.5);
  }
}

/* --- pickupSpot --- */
.pickupSpot-bubble {
  right: calc(50% - 155px);
  width: calc(721px / 2);
  aspect-ratio: 721 / 137;
}
@media screen and (768px <= width) {
  .pickupSpot-bubble {
    right: 50%;
    width: calc(721px / 1.5);
  }
}

/* --- slider-spot --- */
/* _sauna */
._sauna .sliderSpot-ttl {
  width: calc(291px / 2);
  aspect-ratio: 291 / 97;
}
/* _kidsarea */
._kidsarea .sliderSpot-ttl {
  width: calc(458px / 2);
  aspect-ratio: 458 / 103;
}
/* _hotel */
._hotel .sliderSpot-ttl {
  width: calc(256px / 2);
  aspect-ratio: 256 / 99;
}
/* _virtualbatting */
._virtualbatting .sliderSpot-ttl {
  left: -20px;
  width: calc(639px / 2);
  aspect-ratio: 639 / 178;
}
@media screen and (768px <= width) {
  ._virtualbatting .sliderSpot-ttl {
    width: calc(587px / 2);
    aspect-ratio: 587 / 180;
  }
}

/* ----------
enjoy
---------- */
.enjoy-ttl {
  width: calc(676px / 2);
}
.enjoy-ttl img {
  aspect-ratio: 676 / 199;
}
@media screen and (768px <= width) {
  .enjoy-ttl {
    width: 840px;
  }
  .enjoy-ttl img {
    aspect-ratio: 840 / 108;
  }
}

/* ----- rules ----- */
.rules-bubble {
  width: calc(695px / 2);
}
.rules-bubble img {
  aspect-ratio: 695 / 96;
}
.rulesCard-ttl {
  height: calc(6em + 5px * 2);
  border-radius: 1em;
}
@media screen and (768px <= width) {
  .rules-bubble {
    width: 477px;
  }
  .rules-bubble img {
    aspect-ratio: 477 / 76;
  }
}

/* ----------
howto
---------- */
.howto-ttl {
  width: calc(682px / 2);
}
.howto-ttl img {
  aspect-ratio: 682 / 228;
}
@media screen and (768px <= width) {
  .howto-ttl {
    width: min(100%, 1026px);
  }
  .howto-ttl img {
    aspect-ratio: 1026 / 171;
  }
}

/* _step01 */
._step01 .howtoStep-ttl {
  width: calc(546px / 2);
}
._step01 .howtoStep-ttl img {
  aspect-ratio: 546 / 45;
}
/* _step02 */
._step02 .howtoStep-ttl {
  margin-bottom: 10px;
  width: calc(370px / 2);
}
._step02 .howtoStep-ttl img {
  aspect-ratio: 370 / 78;
}
/* _step03 */
._step03 .howtoStep-ttl {
  margin-bottom: 10px;
  width: calc(537px / 2);
}
._step03 .howtoStep-ttl img {
  aspect-ratio: 537 / 83;
}
/* _step04 */
._step04 .howtoStep-ttl {
  margin-bottom: 20px;
  width: calc(553px / 2);
}
._step04 .howtoStep-ttl img {
  aspect-ratio: 553 / 139;
}
/* _step05 */
._step05 .howtoStep-ttl {
  width: calc(507px / 2);
}
._step05 .howtoStep-ttl img {
  aspect-ratio: 507 / 93;
}

@media screen and (768px <= width) {
  /* _step01 */
  ._step01 .howtoStep-ttl {
    width: calc(546px / 1.3);
  }
  /* _step02 */
  ._step02 .howtoStep-ttl {
    margin-bottom: 0;
    width: 521px;
  }
  ._step02 .howtoStep-ttl img {
    aspect-ratio: 521 / 31;
  }
  /* _step03 */
  ._step03 .howtoStep-ttl {
    margin-bottom: 0;
    width: 531px;
  }
  ._step03 .howtoStep-ttl img {
    aspect-ratio: 531 / 33;
  }
  /* _step04 */
  ._step04 .howtoStep-ttl {
    width: 568px;
  }
  ._step04 .howtoStep-ttl img {
    aspect-ratio: 568 / 72;
  }
  /* _step05 */
  ._step05 .howtoStep-ttl {
    margin-bottom: 0;
    width: 708px;
  }
  ._step05 .howtoStep-ttl img {
    aspect-ratio: 708 / 33;
  }
}

/* ----------
bottomMenu
---------- */
.bottomMenu li a {
  padding-inline: 0.5em;
}