@charset "utf-8";
/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
/*------------------------------------------------*/
/*★ ＝＝ navArea ＝＝ ★*/
#navArea {
  position: sticky;
  top: 0;
  z-index: 10;
  display: grid;
  background: var(--default-color-white);
  grid-template-columns: repeat(2, auto);
  gap: var(--nav-gap);
  align-items: center;
  justify-content: center;
  padding: var(--default-gap-16-12) 10px;
  --nav-gap: 2.25px;
  .is-size-pc & {
    --nav-gap: 50px;
  }
}
/*page-navi*/
#page-navi {
  .page-navi-lineup {
    display: flex;
    align-items: center;
    gap: var(--nav-gap);
    .is-size-sp & {
      /* max-width: 375px; */
      justify-content: space-between;
      .page-navi-lineup__item--text {
        width: 100%;
      }
      .page-navi-lineup__item--image {
        width: 100%;
        height: 100%;
        object-fit: contain;
      }
    }
  }
  .page-navi-lineup__item {
    width: var(--page-navi-lineup-item-size-w);
    --page-navi-lineup-item-size-w: clamp(60px, (60vw / 3.75), 84px);
    &.is-top {
      --page-navi-lineup-item-size-w: clamp(78px, (78vw / 3.75), 156px);
    }
    .is-size-pc & {
      --page-navi-lineup-item-size-w: 84px;
      &.is-top {
        --page-navi-lineup-item-size-w: 156px;
      }
    }
  }
  .page-navi-lineup__item--inner {
    display: block;
    position: relative;
    &.page-navi-lineup__has-sub {
      height: 100%;
    }
  }
  .page-navi-lineup__item--image {
    &.is-on {
      position: absolute;
      top: 0;
      left: 0;
      opacity: 0;
    }
    .page-navi-lineup__item.is-active &,
    .page-navi-lineup__has-sub:has(.js-modal-content.is-open) & {
      &.is-off {
        opacity: 0;
      }
      &.is-on {
        opacity: 1;
      }
    }
    transition: var(--default-transition-opacity);
  }
  .page-navi-lineup__item--text {
    width: 100%;
    height: 100%;
  }
  .page-navi-lineup__item--sub {
    left: 50%;
    translate: -50% 0;
    margin-top: 5px;
    width: max-content;
    max-width: 90vw;
    background: var(--default-color-white);

    /* アニメーション設定 */
    opacity: 0;
    transition:
      opacity 0.3s ease,
      translate 0.3s ease,
      display 0.3s allow-discrete,
      overlay 0.3s allow-discrete;

    &.is-open {
      opacity: 1;
      @starting-style {
        opacity: 0;
        translate: -50% -10px;
      }
    }
    .page-navi-lineup__item--sub--item {
      font-size: var(--default-font-size-12);
      text-align: center;
      &.is-active {
        .page-navi-lineup__item--sub--link {
          background: var(--default-color-pink);
          color: var(--default-color-white);
        }
      }
      &:not(:last-child) {
        border-bottom: 1px solid var(--default-color-dummy);
      }
    }
    .page-navi-lineup__item--sub--link {
      display: block;
      padding: var(--default-gap-8-4);
      .is-size-sp & {
        padding-block: clamp(6px, (6vw / 3.75), 8px);
      }
    }
  }
}
/*portal-navi*/
#portal-navi {
  line-height: var(--default-font-lh-130);
  display: grid;
  justify-items: center;
  gap: 8px;
  --portal-navi-toggle-size-w: clamp(88px, (88vw / 3.75), 138px);
  .portal-navi-active {
    font-size: var(--default-font-size-16-14);
    color: var(--default-color-pink);
    text-align: center;
  }
  &:has(#portal-navi-lineup.is-open) {
    .portal-navi-toggle {
      border-radius: var(--default-radius-4) var(--default-radius-4) 0 0;
      --portal-navi-toggle--icon-rotate: -90deg;
    }
  }
  .portal-navi-contents {
    position: relative;
  }
  .portal-navi-toggle {
    background: var(--default-color-pink);
    color: var(--default-color-white);
    font-size: var(--default-font-size-14-12);
    border-radius: var(--default-radius-4);
    border: 2px solid var(--default-color-pink);
    padding: 4px var(--default-gap-12-8);
    width: var(--portal-navi-toggle-size-w);
    align-items: center;
    .is-size-sp & {
      display: flex;
      justify-content: center;
      gap: 4px;
      padding: 4px 0;
    }
    .is-size-pc & {
      display: grid;
      grid-template-columns: 1fr auto;
      padding: var(--default-gap-4-2) 12px;
    }
    &::after {
      content: var(--default-icon-arrow-right);
      font-family: var(--default-icon-ff);
      font-weight: var(--default-font-weight-normal);
      rotate: var(--portal-navi-toggle--icon-rotate, 90deg);
      translate: 0 0.05em;
      transition: rotate var(--default-hover-speed);
    }
  }
  #portal-navi-lineup {
    font-size: var(--default-font-size-14-12);
    width: var(--portal-navi-toggle-size-w);
    transition:
      opacity 0.3s ease,
      display 0.3s allow-discrete,
      overlay 0.3s allow-discrete;
    opacity: 0;
    &.is-open {
      opacity: 1;
      @starting-style {
        opacity: 0;
      }
    }
    .portal-navi-lineup__item {
      .is-size-pc & {
        &:last-child {
          .portal-navi-lineup__item--inner {
            border-radius: 0 0 var(--default-radius-8) var(--default-radius-8);
          }
        }
      }
      &:not(:last-child) {
        &::after {
          content: '';
          display: block;
          width: 100%;
          background: #fff;
          border-bottom: 1px dashed var(--default-color-pink);
        }
      }
      .portal-navi-lineup__item--inner {
        background: var(--default-color-white);
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: baseline;
        padding: 6px 4px;
        .is-size-pc & {
          padding: 4px 8px;
          --portal-navi-lineup-item-icon-size: 1em;
        }
        &::before {
          content: var(--default-icon-arrow-right);
          font-family: var(--default-icon-ff);
          translate: 0 0.05em;
          font-size: var(--portal-navi-lineup-item-icon-size, 0.8em);
        }
      }
    }
  }
}
/*------------------------------------------------*/
/*★ ＝＝ headerArea ＝＝ ★*/
.mv {
  position: relative;
  background: url(../images/mv_bg.webp) repeat center top / 400px;
  --mv-logo-size-w: min((350vw / 3.75), 634px);
  --mv-lead-gap: var(--default-gap-24-20);
  --mv-lead-size-w: min((335vw / 3.75), 913px);
  .is-size-pc & {
    --mv-lead-gap: 17px 60px 17px 55px;
  }
  padding: 82px 0 30px;
  .is-size-pc & {
    padding: 0 0 19px;
  }
  .is-page-top & {
    --mv-logo-size-w: min((349vw / 3.75), 667px);
    --mv-lead-size-w: min((335vw / 3.75), 675px);
    padding: 105px 0 29px;
    .is-size-pc & {
      padding: 97px 0 73px;
    }
  }
  .mv__bg {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 100%;
    height: 100%;
    max-width: 1900px;
    .is-page-top & {
      max-width: 1914px;
    }
    .base-picture__image {
      height: 100%;
      object-position: center top;
      object-fit: cover;
    }
  }
  .mv__inner {
    position: relative;
    z-index: 1;
  }
  .mv__logo {
    width: var(--mv-logo-size-w);
    margin: auto;
    .is-page-top & {
      position: relative;
      .is-size-sp & {
        padding-bottom: min((111vw / 3.75), 212px);
        --mv-logo-kazari-01-size-w: min((170.61vw / 3.75), 326px);
        --mv-logo-kazari-01-size-h: min((116vw / 3.75), 222px);
        --mv-logo-kazari-02-size-w: min((148vw / 3.75), 283px);
        --mv-logo-kazari-02-size-h: min((91vw / 3.75), 174px);
        &::before {
          translate: min((24vw / 3.75), 46px) max((-12vw / 3.75), -23px);
        }
        &::after {
          translate: max((-7vw / 3.75), -13px) max((-18vw / 3.75), -34px);
        }
      }
      .is-size-pc & {
        --mv-logo-kazari-01-size-w: 391px;
        --mv-logo-kazari-01-size-h: 286px;
        --mv-logo-kazari-02-size-w: 311px;
        --mv-logo-kazari-02-size-h: 187px;
        &::before {
          translate: -100% 0;
        }
        &::after {
          translate: 100% -116px;
        }
      }
      &::before {
        --mv-logo-kazari-size-w: var(--mv-logo-kazari-01-size-w);
        --mv-logo-kazari-size-h: var(--mv-logo-kazari-01-size-h);
        --mv-logo-kazari-bg: url(../images/top/mv_kazari_01.webp);
        left: 0;
      }
      &::after {
        --mv-logo-kazari-bg: url(../images/top/mv_kazari_02.webp);
        --mv-logo-kazari-size-w: var(--mv-logo-kazari-02-size-w);
        --mv-logo-kazari-size-h: var(--mv-logo-kazari-02-size-h);
        right: 0;
      }
      &::before,
      &::after {
        content: '';
        display: block;
        position: absolute;
        bottom: 0;
        width: var(--mv-logo-kazari-size-w);
        height: var(--mv-logo-kazari-size-h);
        background: var(--mv-logo-kazari-bg) no-repeat center center / contain;
      }
    }
  }
  .mv__lead {
    width: var(--mv-lead-size-w);
    margin: auto;
    background: rgba(255, 255, 255, 0.7);
    padding: var(--mv-lead-gap);
  }
}
/*------------------------------------------------*/
/*★ ＝＝ mainArea ＝＝ ★*/
#mainArea {
  .is-size-sp & {
    --main-bg: url(../images/bg_kazari_main_area_sp.png);
    --main-bg-size: 100%;
    --main-bg-posi-y: 0;
    &:has(#campaign-contents) {
      --main-bg-posi-y: 32px;
    }
  }
  .is-size-pc & {
    --main-bg: url(../images/bg_kazari_main_area_pc.png);
    --main-bg-size: 1495px;
    --main-bg-posi-y: 28px;
  }
  background:
    var(--main-bg) no-repeat center var(--main-bg-posi-y) / var(--main-bg-size),
    var(--default-color-background-color);
}
#campaign-contents {
  .section:nth-child(1 of .section) {
    margin-top: 0;
    position: relative;
    .section__inner {
      position: relative;
      z-index: 1;
    }
    .is-size-sp & {
      --campaign-contents-bg: url(../images/bg_kazari_campaign_contents_sp.png);
      --campaign-contents-bg-size-w: 100%;
      --campaign-contents-bg-size-h: calc(200vw / 3.75);
      --campaign-contents-bg-posi-y: -26.65px;
    }
    .is-size-pc & {
      --campaign-contents-bg: url(../images/bg_kazari_campaign_contents_pc.png);
      --campaign-contents-bg-size-w: 1515px;
      --campaign-contents-bg-size-h: 196px;
      --campaign-contents-bg-posi-y: 13.5px;
    }
    &::after {
      content: '';
      position: absolute;
      width: 100%;
      height: var(--campaign-contents-bg-size-h);
      background: var(--campaign-contents-bg) no-repeat center bottom / var(--campaign-contents-bg-size-w);
      bottom: var(--campaign-contents-bg-posi-y);
      left: 0;
    }
  }
}
#default-contents {
  background: var(--default-contents-bg) repeat-y center top / var(--default-contents-bg-size);
  .is-size-sp & {
    --default-contents-bg: url(../images/bg_kazari_default_contents_sp.png);
    --default-contents-bg-size: 100%;
  }
  .is-size-pc & {
    --default-contents-bg: url(../images/bg_kazari_default_contents_pc.png);
    --default-contents-bg-size: 1500px;
  }
}
/*section*/
.section {
  padding: var(--default-gap-section) 0;
  &:where(#staff, #voice) {
    background: #fff7ca;
  }
  &:has(.splide) {
    .section__inner {
      width: 100%;
    }
  }
  .section__inner {
    width: var(--default-width);
    margin: auto;
  }
}
/*section-title and subtitle*/
.section-title {
  margin-bottom: var(--default-gap-section-gap);
  #campaign-contents & {
    --campaign-section-title-gap: 12px;
    --campaign-section-title-kazari-size-h: min((56.5vw / 3.75), 74px);
    font-size: var(--default-font-size-16);
    display: grid;
    gap: var(--campaign-section-title-gap);
    .is-size-pc & {
      --campaign-section-title-gap: 8px;
    }
    .section#campaign & {
      --campaign-section-title-kazari-bg: url(../images/top/campaign/ttl_text_campaign.svg);
    }
    .section#movie & {
      --campaign-section-title-kazari-bg: url(../images/top/campaign/ttl_text_movie.svg);
    }
    &::before {
      content: '';
      width: 100%;
      height: var(--campaign-section-title-kazari-size-h);
      background: var(--campaign-section-title-kazari-bg) no-repeat center center / contain;
    }
    .base-title__inner {
      display: grid;
      gap: 12px;
      justify-items: center;
      .is-size-pc & {
        gap: 8px;
      }
    }
  }
  #default-contents & {
    .section:not(#staff, #voice, #advice, #belongings) & {
      background: url(../images/ttl_border_nami.svg) no-repeat center bottom / 116px;
      padding-bottom: 14.79px;
    }
    .base-title__lead-text {
      font-size: var(--default-font-size-20-16);
    }
    .base-title__main-text {
      font-size: var(--default-font-size-36-28);
    }
  }
}
.section-subtitle {
  margin-bottom: var(--default-gap-section-gap);
  .base-title__main-text {
    font-size: var(--default-font-size-32-24);
  }
}
.section-title,
.section-subtitle {
  text-align: center;
  .base-title__inner {
    display: grid;
  }
}
.section[id*='product'] .section-subtitle {
  display: grid;
  gap: 13px;
  &::before {
    content: '';
    width: 100%;
    height: 40px;
    background: var(--default-color-world-main);
    mask: url(../images/ttl_kazari_top.svg) no-repeat center center / contain;
  }
}
.section:is(#staff, #voice, #advice) .section-title,
.section:not([id*='product']) .section-subtitle {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  &::before,
  &::after {
    content: '';
    width: var(--section-subtitle-icon-size-w);
    height: var(--section-subtitle-icon-size-h);
    background: var(--section-subtitle-icon) no-repeat center center / contain;
  }
  &::before {
    --section-subtitle-icon-size-w: min((61vw / 3.75), 128px);
    --section-subtitle-icon-size-h: min((56vw / 3.75), 118px);
    --section-subtitle-icon: url(../images/ttl_kazari_left.svg);
  }
  &::after {
    --section-subtitle-icon-size-w: min((50vw / 3.75), 91px);
    --section-subtitle-icon-size-h: min((52vw / 3.75), 95px);
    --section-subtitle-icon: url(../images/ttl_kazari_right.svg);
  }
}

/*section-nav*/
.section-nav {
  .section-nav-lineup {
    --section-nav-lineup-item-border-color: #ffa7b7;
    margin: auto;
    flex-wrap: wrap;
    background: var(--default-color-pink);
    color: var(--default-color-white);
    line-height: var(--default-font-lh-130);
    .is-size-sp & {
      width: var(--default-width);
      border-radius: var(--default-radius-8);
      padding: 16px;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
      --section-nav-lineup-item-link-gap: 8px;
      .section-nav-lineup__item {
        display: grid;
        align-items: center;
        border-bottom: 1px dashed var(--section-nav-lineup-item-border-color);
      }
      .section-nav-lineup__item--link {
        padding-bottom: 8px;
      }
    }
    .is-size-pc & {
      width: fit-content;
      max-width: var(--default-width);
      border-radius: var(--default-radius-button);
      padding: var(--default-gap-24-20) 40px;
      display: flex;
      gap: 8px;
      justify-content: center;
      align-items: center;
      --section-nav-lineup-item-link-gap: 4px;
      .section-nav-lineup__item {
        display: flex;
        align-items: center;
        gap: var(--default-gap-16-12);
        padding-left: var(--default-gap-16-12);
        &:not(:last-child) {
          &::after {
            content: '';
            width: 1px;
            height: 16px;
            background: var(--section-nav-lineup-item-border-color);
          }
        }
      }
    }
    .section-nav-lineup__item--link {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: var(--section-nav-lineup-item-link-gap);
      &::after {
        content: var(--default-icon-arrow-right);
        font-family: var(--default-icon-ff);
        font-weight: var(--default-font-weight-normal);
        rotate: 90deg;
      }
    }
  }
}
/*campaign-contents*/
#campaign-contents {
  .campaign-image {
    display: block;
    max-width: var(--campaign-image-max-size-w, 670px);
    margin-inline: auto;
    .is-size-pc & {
      --campaign-image-max-size-w: 960px;
    }
  }
}
/*default-contents*/
#default-contents {
  padding-top: var(--default-gap-section);
}
/*product*/
[id*='product'] {
  .product {
    + .product {
      margin-top: var(--default-gap-section);
    }
    #product-hotel & {
      .splide__track {
        --slider-item-w: min(100%, 335px);
      }
      @media (width > 1185px) {
        .splide__track {
          --slider-item-w: 352px;
        }
      }
    }
  }
  .ui-static-tab {
    padding: 0;
    margin-bottom: var(--default-gap-section-gap);
    .ui-static-tab-button-list {
      width: fit-content;
      margin-inline: auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: var(--default-gap-24-20) var(--default-gap-16-12);
      .is-size-pc & {
        gap: 4px;
      }
    }
    .ui-static-tab-button {
      border: 2px solid var(--default-color-blue);
      background: var(--default-color-blue);
      font-size: var(--default-font-size-16);
      color: var(--default-color-white);
      line-height: var(--default-font-lh-130);
      text-align: center;
      padding: 16px;
      min-width: 150px;
      border-radius: var(--default-radius-4);
      &.is-active {
        background: var(--default-color-white);
        color: var(--default-color-blue);
      }
    }
  }
  .product-lineup {
    font-family: var(--default-font-family-noto);
    &:not(.splide__list) {
      --gap: min((30vw / 3.75), 24px);
      display: grid;
      gap: min((12vw / 3.75), 48px) var(--gap);
      --col-num: 1;
      @media (width > 640px) {
        --col-num: 2;
        grid-template-columns: repeat(auto-fit, calc((100% - var(--gap) * (var(--col-num) - 1)) / var(--col-num)));
        justify-content: center;
      }
      .is-size-pc & {
        --col-num: 4;
        @media (width < 1200px) {
          --col-num: 3;
        }
        #product-hotel & {
          --col-num: 3;
        }
      }
    }
    .product-lineup__item {
      padding: 4px; /*スライダー時のshadow確保用*/
    }
    .product-lineup__item--link {
      height: 100%;
      display: grid;
      align-content: start;
      grid-template-rows: repeat(2, auto) 1fr;
      background: var(--default-color-white);
      color: inherit;
      font-weight: var(--default-font-weight-normal);
      border-radius: var(--default-radius-8);
      box-shadow: 1px 1px 4px 1px rgba(0, 0, 0, 0.15);
      overflow: hidden;
      :is(.product-kaigai-tour, .product-kokunai-tour) & {
        @media (width <= 640px) {
          padding: 8px;
          gap: 0 8px;
          grid-template-columns: 138px 1fr;
          grid-template-rows: auto 1fr;
          grid-template-areas:
            'photo text'
            'type text';
          .product-lineup__item--photo {
            grid-area: photo;
          }
          .product-lineup__item--type {
            grid-area: type;
            align-self: start;
            font-size: var(--default-font-size-12);
          }
          .product-lineup__item--text-wrapper {
            grid-area: text;
            gap: 8px;
          }
          .product-lineup__item--detail,
          .product-lineup__item--more {
            padding: 0;
          }
        }
      }
    }
    .product-lineup__item--photo--item {
      aspect-ratio: var(--product-lineup__item--photo-aspect-ratio, 944 / 628);
      object-fit: cover;
      object-position: right bottom;
    }
    .product-lineup__item--type {
      background: var(--default-color-black);
      color: var(--default-color-white);
      text-align: center;
      font-size: clamp(12px, (12vw / 3.75), 14px);
      font-weight: var(--default-font-weight-bold);
      padding: 2px 8px;
    }
    .product-lineup__item--text-wrapper {
      display: grid;
      align-content: space-between;
      .product-lineup__item--detail,
      .product-lineup__item--more {
        padding: clamp(8px, (8vw / 3.75), 16px);
        &.product-lineup__item--more {
          padding-top: 0;
        }
      }
      .product-lineup__item--title {
        font-size: clamp(14px, (14vw / 3.75), 16px);
        line-height: var(--default-font-lh-130);
        font-weight: var(--default-font-weight-bold);
        margin-bottom: 4px;
        &:has(.product-lineup__item--title--rank) {
          display: grid;
          gap: 8px;
          .product-lineup__item--title--rank .is-hotel-rank {
            display: block;
            width: 100%;
            height: min((12vw / 3.75), 14px);
            object-fit: contain;
            object-position: left center;
          }
        }
      }
      .product-lineup__item--point {
        font-size: var(--default-font-size-14-12);
      }
      .product-lineup__item--labels {
        display: flex;
        flex-wrap: wrap;
        gap: 4px;
        margin-top: clamp(8px, (8vw / 3.75), 16px);
        .product-lineup__item--label {
          font-size: var(--default-font-size-12);
          line-height: var(--default-font-lh-130);
          font-weight: bold;
          color: var(--product-lineup-item-label-font-color, var(--default-color-white));
          background: var(--product-lineup-item-label-bg, var(--default-color-notice));
          padding: 4px 8px;
          border-radius: var(--default-radius-4);
          &.is-type-airport {
            --product-lineup-item-label-bg: var(--default-color-world-main);
            --product-lineup-item-label-font-color: var(--default-color-white);
          }
          &.is-type-category {
            --product-lineup-item-label-bg: var(--default-color-world-sub);
            --product-lineup-item-label-font-color: var(--default-color-world-main);
          }
          &[class*='is-type-aw'] {
            --product-lineup-item-label-bg: var(--default-color-pink);
            --product-lineup-item-label-font-color: var(--default-color-white);
          }
          &.is-type-normal {
            --product-lineup-item-label-bg: #f0f7ff;
            --product-lineup-item-label-font-color: #0063b0;
          }
          &.is-type-support {
            --product-lineup-item-label-bg: #fffcd5;
            --product-lineup-item-label-font-color: #697180;
          }
        }
      }
      .product-lineup__item--price {
        text-align: right;
      }
      .product-lineup__item--minmax {
        color: var(--default-color-pink-dark);
        font-size: clamp(16px, (16vw / 3.75), 22px);
        line-height: var(--default-font-lh-130);
        color: #df0d00;
        font-weight: var(--default-font-weight-bold);
        .is-en,
        .is-kara {
          font-size: calc(14em / 22);
        }
      }
      .product-lineup__item--dep,
      .product-lineup__item--notes {
        font-size: var(--default-font-size-12);
        color: #697180;
      }
    }
    #product-op & {
      --product-lineup__item--photo-aspect-ratio: 600 / 400;
      .product-lineup__item--link {
        border: 1px solid #c0c5cc;
        border-radius: var(--default-radius-4);
        padding: 24px;
        gap: 8px;
        font-weight: var(--default-font-weight-bold);
      }
      .product-lineup__item--texts {
        display: grid;
        gap: 8px;
        line-height: var(--default-font-lh-130);
      }
      .product-lineup__item--area {
        font-size: var(--default-font-size-12);
        color: var(--default-color-white);
        background: var(--default-color-world-main);
        justify-self: start;
        padding: 4px 8px;
      }
      .product-lineup__item--title {
        font-size: 20px;
      }
    }
  }
  .product-buttons {
    margin-top: var(--default-gap-section-gap);
  }
  .ui-static-tab-container:has(.ui-static-tab-content-item.is-active .product-buttons) {
    + .product-buttons {
      margin-top: 24px;
    }
  }
}
/*dst*/
#dst {
  .dst-link__lineup {
    display: grid;
    gap: var(--default-gap-40-32);
    margin-inline: auto;
    .is-size-sp & {
      max-width: 450px;
    }
    .is-size-pc & {
      width: min(100%, 962px);
      grid-template-columns: repeat(2, 1fr);
      gap: var(--default-gap-80-64);
    }
  }
  .dst-detail__lineup {
    display: grid;
    --dst-detail-lineup-gap-col: 0;
    --dst-detail-lineup-gap-row: var(--default-gap-32-24);
    --dst-detail-lineup-item-gap: 16px;
    gap: var(--dst-detail-lineup-gap-row) var(--dst-detail-lineup-gap-col);
    @media (width > 640px) {
      --dst-detail-lineup-gap-col: 24px;
      --dst-detail-lineup-gap-row: 31px;
      --dst-detail-lineup-col-num: 2;
      grid-template-columns: repeat(
        auto-fit,
        calc((100% - var(--dst-detail-lineup-gap-col) * (var(--dst-detail-lineup-col-num) - 1)) / var(--dst-detail-lineup-col-num))
      );
      justify-content: center;
      .dst-detail__lineup--item.is-type-recommend {
        grid-column: span var(--dst-detail-lineup-col-num);
      }
    }
    @media (width > 1140px) {
      --dst-detail-lineup-col-num: 3;
    }
    .dst-detail__lineup--item {
      background: var(--default-color-white);
      border-radius: var(--default-radius-16);
      --dst-detail-lineup-world-main-color: var(--default-color-world-main);
      --dst-detail-lineup-world-sub-color: var(--default-color-world-sub);
      .dst-detail__lineup--item--name {
        .base-title__inner {
          display: grid;
        }
        .base-title__sub-text {
          color: var(--dst-detail-lineup-world-main-color);
        }
      }
      &:not(.is-type-recommend) {
        padding: 24px;
        padding-top: 10px;
        display: flex;
        flex-direction: column;
        gap: var(--dst-detail-lineup-item-gap);
        .dst-detail__lineup--item--name {
          text-align: center;
          .base-title__main-text {
            font-size: var(--default-font-size-32-24);
            line-height: 1.2;
            .is-disney & {
              line-height: 1.1;
              .is-inline-block:first-child {
                display: block;
              }
            }
          }
          .base-title__sub-text {
            font-size: var(--default-font-size-16);
            line-height: var(--default-font-lh-130);
          }
        }
        .dst-detail__lineup--item--main--photo {
          margin-bottom: var(--dst-detail-lineup-item-gap);
        }
        .dst-detail__lineup--item--buttons {
          margin-top: auto;
          --base-buttons-gap: var(--dst-detail-lineup-item-gap);
        }
      }
      &.is-type-recommend {
        padding-inline: var(--default-gap-32-24);
        padding-block: var(--default-gap-32-24) 40px;
        .is-size-pc & {
          padding-block-start: var(--default-gap-24-20);
        }
        .dst-detail__lineup--item--name {
          line-height: var(--default-font-lh-130);
          display: grid;
          gap: 10px 38px;
          align-items: center;
          margin-bottom: clamp(32px, (32vw / 3.75), 40px);
          &::before {
            content: '';
            width: min((92vw / 3.75), 124px);
            height: min((70vw / 3.75), 94px);
            background: url(../images/dst_icon_recommend.svg) no-repeat center center / contain;
          }
          .is-size-sp & {
            justify-items: center;
            text-align: center;
          }
          .is-size-pc & {
            grid-template-columns: auto 1fr;
          }
          .base-title__main-text {
            font-size: clamp(28px, (28vw / 3.75), 40px);
          }
          .base-title__sub-text {
            font-size: clamp(18px, (18vw / 3.75), 20px);
          }
        }
        .dst-detail__lineup--item--main {
          display: grid;
          gap: 12px;
          .is-size-pc & {
            grid-template-columns: 304px 1fr;
          }
          .dst-detail__lineup--item--main--lead {
            font-size: clamp(16px, (16vw / 3.75), 28px);
            color: var(--dst-detail-lineup-world-main-color);
            line-height: var(--default-font-lh-130);
            margin-bottom: 8px;
          }
          .dst-detail__lineup--item--main--text {
            font-weight: var(--default-font-weight-normal);
          }
          .dst-detail__lineup--item--main--info {
            margin-top: var(--dst-detail-lineup-item-gap);
          }
        }
        .dst-detail__lineup--item--more {
          margin-top: 32px;
          .dst-detail__lineup--item--more--title {
            font-size: clamp(18px, (18vw / 3.75), 32px);
            text-align: center;
            line-height: var(--default-font-lh-130);
            margin-bottom: var(--dst-detail-lineup-item-gap);
            display: grid;
            grid-auto-flow: column;
            justify-content: center;
            align-items: end;
            gap: 24px;
            &::before,
            &::after {
              content: '';
              width: clamp(2px, (2vw / 3.75), 4px);
              height: calc(25em / 18);
              background: var(--default-color-pink);
            }
            &::before {
              rotate: -25deg;
            }
            &::after {
              rotate: 25deg;
            }
          }
        }
        .dst-detail__lineup--item--info {
          background: var(--dst-detail-lineup-world-sub-color);
          border-radius: var(--default-radius-16);
          padding: 26px clamp(12px, (12vw / 3.75), 24px);
          --dst-detail__lineup--item--info-gap: var(--default-gap-16-12);
          .is-size-pc & {
            --dst-detail__lineup--item--info-gap: 10px;
          }
          &:nth-child(n + 2 of .dst-detail__lineup--item--info) {
            margin-top: 32px;
          }
          &.is-type-special {
            background: #ffedf0;
            .dst-detail__lineup--item--info--title {
              color: var(--default-color-pink);
              display: grid;
              place-items: center;
              gap: 12px 10px;
              .is-size-sp & {
                margin: auto;
              }
              .is-size-pc & {
                grid-template-columns: auto 1fr;
              }
              &::before {
                content: '';
                width: 64px;
                height: 52px;
                background: url(../images/dst_icon_special.svg) no-repeat center center / contain;
              }
            }
          }
          &:has(.dst-detail__lineup--item--info--photo) {
            display: grid;
            gap: var(--dst-detail__lineup--item--info-gap);
            .is-size-pc & {
              grid-template-columns: 1fr 304px;
            }
          }
          .dst-detail__lineup--item--info--texts {
            display: grid;
            justify-items: start;
            align-content: start;
            gap: var(--dst-detail__lineup--item--info-gap);
          }
          .dst-detail__lineup--item--info--title {
            font-size: var(--default-font-size-20-16);
            line-height: var(--default-font-lh-130);
          }
          .dst-detail__lineup--item--info--text {
            font-weight: var(--default-font-weight-normal);
          }
        }
        .dst-detail__lineup--item--buttons {
          margin-top: 40px;
        }
      }
    }
  }
}
/*information*/
#information {
  .section__inner {
    container-type: inline-size;
  }
  .information-page__lineup {
    display: grid;
    --information-page-lineup-gap: var(--default-gap-32-24);
    gap: var(--information-page-lineup-gap);
    padding-bottom: var(--information-page-lineup-padding-bottom);
    @container (min-width: 1000px) {
      padding-inline: 23px;
    }
    .is-size-sp & {
      --information-page-lineup-padding-bottom: 100px;
      max-width: 580px;
      margin-inline: auto;
    }
    .is-size-pc & {
      --information-page-lineup-gap: 40px;
      --information-page-lineup-col-num: 2;
      --information-page-lineup-padding-bottom: 88px;
      justify-content: center;
      grid-template-columns: repeat(
        auto-fit,
        calc((100% - var(--information-page-lineup-gap) * (var(--information-page-lineup-col-num) - 1)) / var(--information-page-lineup-col-num))
      );
    }
    .information-page__lineup--item {
      position: relative;
    }
    .information-page__lineup--item--link {
      display: block;
      border-radius: min((20vw / 3.75), 32px);
      border: 8px solid var(--default-color-dummy);
      overflow: hidden;
      /* background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 100%); */
    }
    .information-page__lineup--item--texts {
      display: grid;
      gap: min((4vw / 3.75), 10px);
      width: 100%;
      height: 100%;
      align-content: center;
      position: absolute;
      top: 0;
      left: 0;
      color: var(--default-color-white);
      text-align: center;
      padding: 18px;
      .information-page__lineup--item--lead {
        font-size: var(--default-font-size-20-16);
      }
      .information-page__lineup--item--name {
        font-size: var(--default-font-size-26-18);
        line-height: var(--default-font-lh-130);
      }
    }
    .information-page__lineup--item--kazari {
      position: absolute;
      bottom: 0;
      width: var(--information-page-lineup-item-kazari-size-w);
      height: var(--information-page-lineup-item-kazari-size-h);
      translate: var(--information-page-lineup-item-kazari-translate);
      .is-advice & {
        --information-page-lineup-item-kazari-size-w: min((103.97vw / 3.75), 171px);
        --information-page-lineup-item-kazari-size-h: min((95.45vw / 3.75), 157.02px);
        --information-page-lineup-item-kazari-translate: 1px 12.68px;
        left: 0;
        .is-size-pc & {
          --information-page-lineup-item-kazari-size-w: min((171vw / 12), 171px);
          --information-page-lineup-item-kazari-size-h: min((157.02vw / 12), 157.02px);
          --information-page-lineup-item-kazari-translate: max((-42vw / 12), -42px) min((40vw / 12), 40px);
        }
      }
      .is-select & {
        --information-page-lineup-item-kazari-size-w: min((168.16vw / 3.75), 257px);
        --information-page-lineup-item-kazari-size-h: min((85.67vw / 3.75), 131px);
        --information-page-lineup-item-kazari-translate: 1.84px 21.78px;
        right: 0;
        .is-size-pc & {
          --information-page-lineup-item-kazari-size-w: min((257vw / 12), 257px);
          --information-page-lineup-item-kazari-size-h: min((131vw / 12), 131px);
          --information-page-lineup-item-kazari-translate: min(49vw / 12, 49px) min(35.67vw / 12, 35.67px);
        }
      }
    }
  }
  .information-support__lineup {
    display: grid;
    gap: 24px;
    @media (width > 640px) {
      grid-template-columns: repeat(2, 1fr);
      gap: var(--default-gap-40-32);
      .is-size-pc & {
        grid-template-columns: repeat(3, 1fr);
      }
    }
    .information-support__lineup--item {
      display: flex;
      flex-direction: column;
      gap: 16px;
      background: var(--default-color-white);
      border-radius: var(--default-radius-32);
      padding: 32px 16px;
      font-weight: var(--default-font-weight-normal);
    }
    .information-support__lineup--item--icon {
      width: 160px;
      margin-inline: auto;
    }
    .information-support__lineup--item--title {
      text-align: center;
      font-size: 20px;
      &::after {
        content: '';
        display: block;
        width: 100%;
        height: 7px;
        background: url(../images/ttl_border_hexagon.svg) no-repeat center center / contain;
        margin-top: 8px;
      }
    }
    .information-support__lineup--item--buttons {
      margin-top: auto;
      --base-buttons-gap: 16px;
    }
  }
}
/*voice*/
#voice {
  .voice {
    --slider-max-width: 1053px;
    --slider-item-w: 335px;
  }
  .splide__arrow {
    --slider-arrow-icon-posi-x: calc((var(--slider-arrow-size) * 1.25) * -1);
  }
  .voice-lineup__item {
    background: var(--default-color-white);
    padding: 8px;
    border-radius: var(--default-radius-8);
    font-weight: var(--default-font-weight-normal);
    display: flex;
    flex-direction: column;
    gap: 8px;
    .voice-lineup__item--detail {
      margin-top: auto;
      align-self: end;
      display: flex;
      align-items: center;
      gap: 40px;
      .voice-lineup__item--detail--text {
        display: grid;
      }
      .voice-lineup__item--detail--icon {
        width: 60px;
        border-radius: 100%;
        border: 1px solid #c0c5cc;
        overflow: hidden;
      }
    }
  }
  .voice-buttons {
    margin-top: var(--default-gap-section-gap);
  }
}
/*article*/
#article {
  .article {
    --article-item-shadow-size: 4px;
    .is-size-sp & {
      --slider-item-w: 200px;
    }
  }
  /* .splide__arrow {
    --slider-arrow-icon-posi-y: 90px;
    --slider-arrow-icon-posi-ty: 0;
  } */
  .article__item {
    padding: 0 var(--article-item-shadow-size) var(--article-item-shadow-size) 0;
    .article__link {
      background: var(--default-color-white);
      border-radius: var(--default-radius-4);
      overflow: hidden;
      box-shadow: var(--article-item-shadow-size) var(--article-item-shadow-size) 0 0 rgba(0, 0, 0, 0.2);
      height: 100%;
      display: grid;
      grid-template-rows: auto 1fr;
    }
    .article__detail {
      padding: 20px 10px;
    }
    .article__detail--text {
      font-size: var(--default-font-size-16);
    }
    .article__label {
      margin-top: 16px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      .article__label--item {
        font-size: var(--default-font-size-12);
        line-height: var(--default-font-lh-130);
        color: var(--default-color-white);
        border-radius: var(--default-radius-4);
        padding: 4px 8px;
        background: var(--default-color-world-primary);
      }
    }
  }
}
/*staff*/
#staff {
  .staff-portal-name {
    font-weight: var(--default-font-weight-normal);
    text-align: center;
    font-size: 24px;
    margin-bottom: 16px;
  }
  .staff-texts {
    margin-bottom: 16px;
    display: grid;
    gap: 8px;
  }
  .staff-lineup {
    display: grid;
    --col-num: 2;
    --col-gap: 20px;
    --row-gap: var(--default-gap-40-32);
    gap: var(--row-gap) var(--col-gap);
    grid-template-columns: repeat(auto-fit, calc((100% - var(--col-gap) * (var(--col-num) - 1)) / var(--col-num)));
    justify-content: center;
    @media (width > 750px) {
      --col-num: 3;
      --col-gap: 24px;
    }
    @media (width > 960px) {
      --col-num: 4;
    }
    .staff-lineup__item {
      display: flex;
      flex-direction: column;
      gap: var(--default-gap-16-12);
      @media (width > 750px) {
        gap: 20px;
      }
    }
    .staff-lineup__item--photo {
      order: -1;
      .base-img__item {
        aspect-ratio: 1;
        object-fit: cover;
      }
    }
    .staff-lineup__item--texts {
      display: grid;
      gap: var(--default-gap-8-4);
      text-align: center;
      font-size: var(--default-font-size-16-14);
      line-height: var(--default-font-lh-130);
      .staff-lineup__item--comment {
        order: -1;
      }
      .staff-lineup__item--name {
        color: var(--default-color-orange);
        font-size: clamp(14px, (14vw / 3.75), 20px);
      }
      .staff-lineup__item--branch {
        font-size: var(--default-font-size-14-12);
        background: var(--default-color-white);
        border: 2px solid var(--default-color-background-color);
        padding: 4px 8px;
      }
    }
    .staff-lineup__item--button {
      margin-top: auto;
      margin-inline: auto;
      --base-button-font-size: var(--default-font-size-16-14);
    }
  }
}
/*faq*/
#faq {
  .faq-lineup {
    display: grid;
    gap: clamp(16px, (16vw / 3.75), 24px);
    --faq-lineup-base-color: #f0f7ff;
    --faq-lineup-border: 2px solid var(--faq-lineup-base-color);
    --faq-lineup-icon-posi: 14px;
    --faq-lineup-icon-font-size: var(--default-font-size-20-16);
    --faq-lineup-padding-left: clamp(34px, (34vw / 3.75), 39px);
    .is-size-pc & {
      --faq-lineup-border: 5px solid rgba(0, 124, 221, 0.1);
      --faq-lineup-icon-posi: 11px;
      --faq-lineup-padding-left: 39px;
    }
    .ui-static-accordion {
      border: var(--faq-lineup-border);
      &:focus-within {
        padding: 0;
        margin: 0;
      }
    }
    .ui-static-accordion-trigger {
      background: var(--faq-lineup-base-color);
      color: #004097;
      padding-left: var(--faq-lineup-padding-left);
      gap: 8px;
      .is-size-pc & {
        &::before {
          content: 'Q.';
        }
      }
      &::before {
        font-family: var(--default-font-family-zen);
        color: inherit;
        font-size: var(--faq-lineup-icon-font-size);
        line-height: var(--default-font-lh-130);
        left: var(--faq-lineup-icon-posi);
        translate: 0 -0.07em;
      }
      .ui-static-icon {
        color: #697180;
      }
      .ui-static-accordion-text {
        color: inherit;
        display: grid;
        grid-template-columns: auto max-content;
        align-items: center;
        justify-content: start;
        gap: 8px;
      }
      .ui-static-accordion-text--labels {
        display: flex;
        gap: 8px;
        .ui-static-accordion-text--label {
          font-size: var(--default-font-size-12);
          color: var(--default-color-white);
          border-radius: var(--default-radius-4);
          padding: 4px 8px;
          background: var(--default-color-world-primary);
        }
      }
    }
    .ui-static-accordion-content {
      border: none;
      background: var(--default-color-white);
      .ui-static-accordion-content-inner {
        border-top: var(--faq-lineup-border);
        .is-size-pc & {
          padding-left: var(--faq-lineup-padding-left);
          position: relative;
          &::before {
            content: 'A.';
            font-size: var(--faq-lineup-icon-font-size);
            line-height: var(--default-font-lh-130);
            position: absolute;
            top: var(--faq-lineup-icon-posi);
            left: var(--faq-lineup-icon-posi);
          }
        }
      }
      .ui-static-accordion-content-text {
        font-weight: var(--default-font-weight-normal);
      }
      .ui-static-accordion-content-links {
        margin-top: 8px;
      }
    }
  }
}
/*belongings*/
#belongings {
  .section-title {
    .base-title__main-text {
      display: flex;
      align-items: end;
      justify-content: center;
      gap: 5px;
      font-size: clamp(18px, (18vw / 3.75), 28px);
    }
    .base-title__main-text--image {
      width: clamp(48px, (48vw / 3.75), 88px);
    }
  }
  .belongings-lineup {
    display: grid;
    gap: var(--default-gap-32-24) 24px;
    .is-size-pc & {
      grid-template-columns: repeat(2, 1fr);
    }
    .belongings-lineup__item {
      background: var(--default-color-white);
      border-radius: var(--default-radius-16);
      padding: var(--default-gap-32-24) 16px;
      border: 1px solid #e0e0e0;
      display: grid;
      grid-template-columns: auto 1fr;
      gap: var(--default-gap-16-12);
    }
    .belongings-lineup__item--texts {
      display: grid;
      gap: 8px;
    }
    .belongings-lineup__item--title {
      font-size: clamp(18px, (18vw / 3.75), 20px);
      line-height: var(--default-font-lh-130);
    }
    .belongings-lineup__item--text {
      font-weight: var(--default-font-weight-normal);
    }
    .belongings-lineup__item--images {
      width: clamp(100px, (100vw / 3.75), 120px);
      order: -1;
    }
    .belongings-lineup__item--label {
      display: grid;
      gap: 4px;
      margin-top: 8px;
      justify-items: center;
      .belongings-lineup__item--label--item {
        background: var(--default-color-pink);
        font-size: var(--default-font-size-12);
        color: var(--default-color-white);
        font-weight: var(--default-font-weight-normal);
        padding: 2px 8px 4px 4px;
        border-radius: var(--default-radius-4);
        display: flex;
        align-items: center;
        &.is-icon-air {
          --belongings-lineup-item-label-item-icon: '\e6ca';
        }
        &::before {
          content: var(--belongings-lineup-item-label-item-icon);
          font-family: var(--default-icon-ff);
          font-weight: 300;
          font-size: 1.5em;
          line-height: 1;
          translate: 0 0.05em;
        }
      }
    }
  }
}
/*advice*/
#advice {
  .advice-lineup {
    display: grid;
    --col-gap: 27px;
    gap: min((24vw / 3.75), 48px) var(--col-gap);
    @media (width > 640px) {
      --col-num: 2;
      grid-template-columns: repeat(auto-fit, calc((100% - var(--col-gap) * (var(--col-num) - 1)) / var(--col-num)));
      justify-content: center;
      .is-size-pc & {
        --col-num: 3;
      }
    }
    .advice-lineup__item {
      background: var(--default-color-white);
      border-radius: var(--default-radius-16);
      padding: 24px;
      border: 1px solid #e0e0e0;
      display: grid;
      gap: var(--default-gap-16-12);
      align-content: start;
    }
    .advice-lineup__item--texts {
      display: grid;
      gap: var(--default-gap-16-12);
    }
    .advice-lineup__item--title {
      font-size: var(--default-font-size-20-16);
      text-align: center;
      line-height: var(--default-font-lh-130);
    }
    .advice-lineup__item--text {
      font-weight: var(--default-font-weight-normal);
    }
    .advice-lineup__item--images {
      order: -1;
      width: 203px;
      justify-self: center;
    }
  }
}
/*choice-age*/
#choice-age {
  .choice-age-lineup {
    display: grid;
    gap: var(--default-gap-80-64);
    .choice-age-lineup__item {
      display: grid;
      gap: var(--default-gap-16-12) 47px;
      .is-size-pc & {
        grid-template-columns: calc((552 / var(--default-width-pc-val)) * 100%) 1fr;
      }
    }
    .choice-age-lineup__item--texts {
      display: grid;
      gap: clamp(12px, (12vw / 3.75), 22px);
      align-content: start;
      .is-size-pc & {
        padding-top: var(--default-gap-24-20);
      }
    }
    .choice-age-lineup__item--sub-title {
      display: grid;
      gap: var(--default-gap-8-4) 14px;
      font-size: var(--default-font-size-26-18);
      line-height: var(--default-font-lh-130);
      .is-size-sp & {
        justify-items: center;
      }
      .is-size-pc & {
        grid-template-columns: 75px 1fr;
        align-items: center;
      }
      .choice-age-lineup__item--sub-title--icon {
        width: min((60vw / 3.75), 75px);
      }
    }
    .choice-age-lineup__item--text {
      font-size: var(--default-font-size-20-16);
      font-weight: var(--default-font-weight-normal);
    }
    .choice-age-lineup__item--point {
      font-weight: var(--default-font-weight-normal);
    }
  }
}
/*choice-type*/
#choice-type {
  .choice-type-lineup {
    display: grid;
    gap: var(--default-gap-96-72);
    .is-size-pc & {
      gap: var(--default-gap-section-gap);
    }
    .choice-type-lineup__item {
      display: grid;
      gap: var(--default-gap-40-32) calc((((var(--default-width-pc-val) - (380 * 2) - 122) / 2) / var(--default-width-pc-val)) * 100%);
      place-items: center;
      .is-size-sp & {
        .choice-type-lineup__item--or {
          width: 85px;
        }
        .choice-type-lineup__item--block {
          max-width: 450px;
        }
      }
      .is-size-pc & {
        grid-template-columns: 1fr calc((122 / var(--default-width-pc-val)) * 100%) 1fr;
      }
    }
    .choice-type-lineup__item--block {
      container-type: inline-size;
      width: 100%;
      .choice-type-lineup__item--block--inner {
        min-height: calc((676 / 760) * 100cqw);
        position: relative;
      }
      .choice-type-lineup__item--block--texts {
        position: relative;
        z-index: 1;
        padding-top: 10px;
        --choice-type-lineup-item-block-gap: calc((147 / 380) * 100cqw);
      }
      .choice-type-lineup__item--block--title {
        font-size: var(--default-font-size-40-32);
        line-height: var(--default-font-lh-130);
        text-align: center;
        margin-bottom: var(--default-gap-24-20);
      }
      .choice-type-lineup__item--block--text {
        font-size: var(--default-font-size-16);
        .is-type-A & {
          padding-left: var(--choice-type-lineup-item-block-gap);
        }
        .is-type-B & {
          padding-right: var(--choice-type-lineup-item-block-gap);
        }
      }
      .choice-type-lineup__item--block--bg {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        .base-img__item {
          object-position: center top;
        }
      }
    }
  }
}
/*choice-experience*/
#choice-experience {
  .choice-experience-lineup {
    display: grid;
    gap: 80px;
    .choice-experience-lineup__item {
      display: grid;
      gap: var(--default-gap-32-24);
      .is-size-pc & {
        grid-template-columns: calc((400 / var(--default-width-pc-val)) * 100%) 1fr;
      }
    }
    .choice-experience-lineup__item--detail,
    .choice-experience-lineup__item--texts {
      display: grid;
      gap: var(--default-gap-16-12);
    }
    .choice-experience-lineup__item--title {
      font-size: var(--default-font-size-32-24);
    }
    .choice-experience-lineup__item--text {
      font-size: var(--default-font-size-20-16);
    }
    .choice-experience-lineup__item--recommend {
      .choice-experience-lineup__item--recommend--title {
        font-size: var(--default-font-size-26-18);
        text-align: center;
        display: grid;
        grid-auto-flow: column;
        justify-content: center;
        align-items: end;
        gap: 0.75em;
        margin-bottom: var(--default-gap-16-12);
        &::before,
        &::after {
          content: '';
          width: clamp(2px, (2vw / 3.75), 2.5px);
          height: 1.25em;
          background: currentColor;
          border-radius: var(--default-radius-button);
        }
        &::before {
          rotate: -45deg;
        }
        &::after {
          rotate: 45deg;
        }
      }
      .choice-experience-lineup__item--recommend--list {
        display: grid;
        gap: 13px;
        grid-template-columns: repeat(2, 1fr);
        .choice-experience-lineup__item--recommend--list--item {
          background: var(--default-color-world-sub);
          border: 1px solid var(--default-color-world-main);
          padding: var(--default-gap-16-12) var(--default-gap-8-4);
          border-radius: var(--default-radius-8);
          display: grid;
          align-content: start;
          gap: var(--default-gap-16-12);
          .is-size-pc & {
            padding-block: 11px;
          }
        }
        .choice-experience-lineup__item--recommend--list--item--title {
          color: var(--default-color-white);
          background: var(--default-color-world-main);
          display: inline-block;
          border-radius: var(--default-radius-button);
          padding: 3px 23px;
          justify-self: center;
          .is-size-pc & {
            justify-self: start;
          }
        }
        .choice-experience-lineup__item--recommend--list--item--lineup {
          color: var(--default-color-world-main);
        }
      }
    }
    .choice-experience-lineup__item--image {
      order: -1;
    }
  }
}
/*banner*/
#banner {
  &:not(:has(#reco-banner)) {
    display: none;
  }
  #reco-banner {
    &:not(.splide),
    .is-size-sp & {
      --slider-item-w: 100%;
      --slider-gap: 0;
      --col-num: 2;
      --gap: min((20vw / 3.75), 24px);
      .reco-banner__list {
        display: grid;
        grid-template-columns: repeat(auto-fit, calc((100% - var(--gap) * (var(--col-num) - 1)) / var(--col-num)));
        justify-content: center;
        gap: var(--gap);
        width: 100%;
        margin: auto !important; /*splide.cssの設定に勝つためのimportant*/
        .is-size-pc & {
          --col-num: 4;
        }
        .is-size-sp & {
          max-width: 476px;
        }
        .reco-banner__link,
        .reco-banner__image {
          display: block;
        }
        .reco-banner__image {
          object-fit: contain;
        }
      }
    }
  }
}

/*------------------------------------------------*/
/*★ ＝＝ footerArea ＝＝ ★*/
#footerArea {
  /*search*/
  #search {
    font-family: var(--default-font-family-noto);
    font-weight: var(--default-font-weight-normal);
    .section {
      padding: 0;
    }
    @media (width >= 741px) {
      padding: 50px 0;
      background: url(../images/search_bg_pc.webp) no-repeat center top / var(--default-bg-width-pc);
    }
  }
}

/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover: hover) and (pointer: fine) {
  #page-navi {
    .page-navi-lineup__item:not(.is-active) {
      .page-navi-lineup__item--inner:hover {
        .page-navi-lineup__item--image {
          &.is-off {
            opacity: 0;
          }
          &.is-on {
            opacity: 1;
          }
        }
      }
    }
    .page-navi-lineup__item--sub--link {
      transition: var(--default-hover-transition-background), var(--default-hover-transition-color);
      &:hover {
        color: var(--default-color-white);
        background: var(--default-color-pink);
      }
    }
  }
  #portal-navi {
    &:not(:has(#portal-navi-lineup:popover-open)) {
      .portal-navi-toggle {
        transition: var(--default-hover-transition-background), var(--default-hover-transition-color);
        &:hover {
          color: var(--default-color-pink);
          background: var(--default-color-white);
        }
      }
    }
    .portal-navi-lineup__item--inner {
      transition:
        var(--default-hover-transition-color),
        box-shadow var(--default-transition-speed) ease;
      &:hover {
        color: var(--default-color-pink);
        box-shadow: 0px 0px 0px 2px currentColor inset;
      }
    }
  }
  .section-nav-lineup__item--link {
    &:hover {
      .section-nav-lineup__item--text {
        text-decoration: underline;
        text-underline-offset: var(--default-hover-underline-offset);
      }
    }
  }
  .product-lineup__item--link,
  .dst-link__lineup--item--link,
  .article__link,
  .reco-banner__link {
    transition: var(--default-transition-opacity);
    &:hover {
      opacity: var(--default-hover-opacity);
    }
  }
  .information-page__lineup--item--link {
    .information-page__lineup--item--bg {
      transition: var(--default-transition-transform);
    }
    &:hover {
      .information-page__lineup--item--bg {
        transform: scale(1.05);
      }
    }
  }
  [id*='product'] .ui-static-tab .ui-static-tab-button {
    transition: var(--default-hover-transition-background), var(--default-hover-transition-color);
    &:hover {
      color: var(--default-color-blue);
      background: var(--default-color-white);
    }
  }
}
