@charset "utf-8";

@font-face {
  font-family: 'Material Symbols Rounded';
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
  src: url(/tyo/common/font/MaterialSymbolsRounded.woff2) format('woff2');
}

/*★ リセット ★*/
.main {
  div:not([class])::after {
    content: none;
  }
  a {
    text-decoration: none;
    &:not(#searchArea a) {
      color: var(--default-color-black);
    }
  }
  .is-em {
    font-weight: bold;
  }
}
#topbuttonApp, #searchArea {
  position: relative;
  z-index: 1;
}

.no-scroll {
  overflow: hidden;
}
.no-scroll,
.no-scroll html {
  scroll-behavior: auto;
}

/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
#hisApp {
  position: relative;
  overflow: hidden;
}
:root {
  --default-color-black: #000;
  --default-color-red: #DA2E2E;
  --default-color-blue: #10069F;
  --default-font-size-pc: 16px;
  --default-font-size-sp: calc(16vw / 3.75);
  --default-font-size: min(var(--default-font-size-sp), var(--default-font-size-pc));
  --default-font-lh: 1.5;
  --default-font-lh2: 1.2;
  --default-width-sp-val: 355;
  --default-width-pc-val: 1104;
  --default-width-sp: (355vw / 3.75);
  --default-width-pc: 1104px;
  --default-width: min(var(--default-width-sp), var(--default-width-pc));
  --default-width2: min(100%, var(--default-width-pc));
  --default-bg-width-pc: max(100%, 1920px);
  --default-ff-icon: "Material Symbols Rounded";
  --default-ico-arrow-r: "\e5e1";
  --default-ico-blank: "\e89e";
  --default-hover-speed: .5s;
  --default-hover-opacity: .7;
  --default-hover-transition-opacity: opacity var(--default-hover-speed);
  --default-hover-transition-background: background var(--default-hover-speed);
  --default-hover-transition-color: color var(--default-hover-speed);
}
.material-symbols-rounded {
  font-family: var(--default-ff-icon);
  font-weight: normal;
  font-style: normal;
  font-size: 1em;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}
.main {
  font-family: "Noto Sans JP", sans-serif;
  font-size: var(--default-font-size);
  color: var(--default-color-black);
  line-height: var(--default-font-lh);
  padding-bottom: 0 !important;
  > :not(#searchArea) { 
    a[class*="link"] {
      color: inherit;
    }
  }
}
.is-inline-block {
  display: inline-block;
}
.is-indent-1, .section [class*="notes--item"] {
  text-indent: -1em;
  padding-left: 1em;
}
.is-sp .is-dsp-pc, .is-pc .is-dsp-sp {
  display: none !important;
}
.js-accordion-button {
  cursor: pointer;
  + * {
    display: none;
  }
}
/*.float-button*/
.float-button {
  width: min((87vw / 3.75), 130px);
  height: min((87vw / 3.75), 130px);
  position: fixed;
  top: min((20vw / 3.75), 33px);
  right: 14px;
  translate: var(--floatbtn-posi-x, 200%) 0;
  transition: translate .7s;
  z-index: 10;
  &.is-fixed:not(.is-over) {
    --floatbtn-posi-x: 0
  }
}
.float-button__link {
  display: block;
}
.float-button__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/*.base-button*/
.base-button__wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: min((20vw / 3.75), 15px);
  margin-top: min((50vw / 3.75), 50px);
  #shopping & {
    margin-top: min((20vw / 3.75), 20px);
  }
}
.base-button {
  width: 100%;
  color: #fff;
    #shopping & {
      width: min((240vw / 3.75), 240px);
    }
  @media(width >=741px) {
    :is(#product-air, #product-airhotel) & {
      width: min((573vw / 11.04), 573px);
    }
    :is(#product-hotel, #product-op) & {
      width: min((514vw / 11.04), 514px);
    }
    #shopping & {
      width: min((240vw / 11.04), 240px);
    }
  }
  .ui-static-button {
    width: 100%;
    min-width: 100%;
    font-size: 14px;
    background: var(--default-color-red);
    border-radius: 100px;
    @media(width <861px) {
      height: min((56vw / 3.75), 56px);
      font-size: var(--default-font-size);
      .ui-static-icon-size-small {
        font-size: min((24vw / 3.75), 24px);
        [target="_blank"] & {
          font-size: min((16vw / 3.75), 16px);
        }
      }
      #shopping & {
        height: min((40vw / 3.75), 40px);
        font-size: min((14vw / 3.75), 14px);
      }
    }    
    @media(width >=861px) {
      :is(#product-air, #product-airhotel) & {
        font-size: min((20vw / 11.04), 20px);
        &.ui-static-button-large {
          height: 56px;
          .ui-static-icon-size-small {
            font-size: 24px;
          }
        }
      }
    }
  }
}
.base-button__link {
  width: 100%;
}
.base-button__text {
  text-align: center;
  line-height: var(--default-font-lh2)
}
/*.base-textlink*/
.base-textlink__texts {
  display: flex;
  align-items: center;
  gap: .25em;
  color: var(--ui-static-unleash-blue-100);
  line-height: var(--default-font-lh2);
  .ui-static-icon {
    color: inherit;
  }
}
/*------------------------------------------------*/
/*★ ＝＝ headerArea ＝＝ ★*/
/*------------------------------------------------*/
/*★ ＝＝ mainArea ＝＝ ★*/
/*section*/
.section {
  padding: min((50vw / 3.75), 100px) 0;
  background: var(--sec-bg) no-repeat center top / 100%;
  &[id*="product-"] {
    &#product-air {
      @media(width <861px) {
        --sec-bg: url("../images/air_bg_sp.webp");
      }
      @media(width >=861px) {
        --sec-bg: url("../images/air_bg_pc.webp");
      }
    }
    &#product-airhotel {
      @media(width <861px) {
        --sec-bg: url("../images/ah_bg_sp.webp");
      }
      @media(width >=861px) {
        --sec-bg: url("../images/ah_bg_pc.webp");
      }
    }
    &#product-hotel {
      padding-bottom: min((25vw / 3.75), 50px);
      @media(width <861px) {
        --sec-bg: url("../images/hotel_bg_sp.webp");
      }
      @media(width >=861px) {
        --sec-bg: url("../images/hotel_bg_pc.webp");
      }
    }
    &#product-op {
      padding-top: min((25vw / 3.75), 50px);
    }
  }
  &#shopping {
    padding-bottom: min((25vw / 3.75), 50px);
    @media(width <861px) {
      --sec-bg: url("../images/shopping_bg_sp.webp");
    }
    @media(width >=861px) {
      --sec-bg: url("../images/shopping_bg_pc.webp");
    }
  }
  &:is(#banner-useful, #article) {
    padding: min((25vw / 3.75), 50px) 0;
  }
  &#banner-reco {
    padding-top: min((25vw / 3.75), 50px);
  }
}
.section__inner {
  width: var(--default-width);
  margin: auto;  
  #article & {
    @media(width >=861px) {
      width: min((980vw / 11.04), 980px);
    }
  }
  #banner-reco & {
    @media(width >=861px) {
      width: min((965vw / 11.04), 965px);
    }
  }
}
.section__title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: .6em;
  color: #1f1f1f;
  font-weight: bold;
  text-shadow: 1px 1px 0 #fff, -1px -1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, 0px 1px 0 #fff, 0 -1px 0 #fff, -1px 0 0 #fff, 1px 0 0 #fff;
  margin-bottom: min((50vw / 3.75), 50px);
  .base-title--text {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: .4em;
    font-size: min((32vw / 3.75), 36px);
    font-feature-settings: "palt";
    letter-spacing: .05em;
    #product-op & {
      @media(width <861px) {
        font-size: min((30vw / 3.75), 36px);
      }
    }
    &::before, &::after {
      content: "";
      width: .8em;
      height: min((5vw / 3.75), 5px);
      background: currentColor;
      border: 1px solid #fff;
    }
  }
  .base-title--text--sub {
    font-size: var(--default-font-size);;
    line-height: 1.6;
    text-align: center;
  }
}

/*mv*/
.mv-contents {
  position: relative;
  height: var(--mv-size-h);
  background: var(--mv-bg) no-repeat center center / cover;
  --portal-color-main: #FFFD4E;
  --portal-color-active: #FFF5AC;
  @media(width <861px) {
    --mv-size-h: min((495vw / 3.75), 670px);
    --mv-bg: url("../images/mv_sp.webp");
  }
  @media(width >=861px) {
    --mv-size-h: 602px;
    --mv-bg: url("../images/mv_pc.webp");
  }
  .mv__inner {
    position: relative;
    width: min((360vw / 3.75), var(--default-width-pc));
    margin: auto;
  }
  .mv-portal.ui-static-accordion {
    width: max-content;
    min-width: min((135vw / 3.75), 150px);
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 0;
    --radius: min((9vw / 3.75), 10px);
    @media(width <861px) {
      left: min((6vw / 3.75), 6px);
    }
    &:focus-within {
      margin: 0;
      padding: 0;
    }
    .ui-static-accordion-trigger {
      background: var(--portal-color-main);
      border-radius: 0 0 var(--radius) var(--radius);
      gap: min((5vw / 3.75), 5px);
      padding: min((9vw / 3.75), 10px) min((16vw / 3.75), 20px) min((9vw / 3.75), 10px) min((20vw / 3.75), 21px);
      cursor: pointer;
      .ui-static-icon {
        color: var(--default-color-black);
        font-size: 1.25em;
      }
      .ui-static-accordion-text {
        font-size: min((13vw / 3.75), 14px);
        font-weight: bold;
        color: var(--default-color-black);
      }
      &[data-state=closed] {
      border-radius: 0 0 var(--radius) var(--radius);
      }
      &[data-state=open] {
        border-radius: 0 0 var(--radius) var(--radius);
      }
      &:hover, &:active {
        background: var(--portal-color-main);
      }
    }
    .ui-static-accordion-content {
      border: none;
      background: none;
      font-size: min((13vw / 3.75), 14px);
      font-weight: bold;
    }
    .ui-static-accordion-content-inner {
      padding: 0;
    }
    .mv-portal__list {
      background: #fff;
      text-align: center;
      border-radius: var(--radius);
      padding: min((14vw / 3.75), 14px) min((10vw / 3.75), 10px);
      margin-top: min((10vw / 3.75), 16px);
    }
    .mv-portal__list--item:not(:first-child) {
      margin-top: min((8vw / 3.75), 8px);
    }
    .mv-portal__list--link {
      display: block;
      padding: .2em .5em;
      background: var(--bg);
      &.is-active {
        --bg: var(--portal-color-active);
      }
    }
  }
  .mv-content__title {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-top: min((130vw / 3.75), 130px);
    @media(width >=861px) {
      padding-top: 60px;
    }
    .mv-content__title--logo {
      width: 100%;
      height: min((250vw / 3.75), 396px);
      object-fit: contain;
    }
    .mv-content__title--portal {
      width: max-content;
      min-width: min((230vw / 3.75), 260px);
      font-size: min((18vw / 3.75), 22px);
      font-weight: bold;
      text-align: center;
      line-height: var(--default-font-lh2);
      background: var(--portal-color-main);
      margin: min((16vw / 3.75), 26px) auto 0;
      padding: .25em .75em .4em;
    }
  }
}
/*section-nav*/
.section-nav {
  height: min((132vw / 3.75), 170px);
  background: var(--default-color-red);
  position: relative;
  @media(width <861px) {
    &:has(.section-nav__item:nth-child(-n+3):last-child){
      height: min((66vw / 3.75), 85px);
    }
    &:has(.section-nav__item:nth-child(4)){
      height: min((132vw / 3.75), 170px);
    }
  }
  @media(width >=861px) {
    height: 55px;
    @media(width <1110px) {
      height: 135px;
    }
  }
}
.section-nav__list {
  width: min((358vw / 3.75), var(--default-width-pc));
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: min((6vw / 3.75), 15px);
  position: absolute;
  top: max((-40vw / 3.75), -33px);
  left: 0;
  right: 0;
}
.section-nav__item {
  width: min((115vw / 3.75), 200px);
  min-height: min((74vw / 3.75), 74px);
  font-size: min((var(--default-font-size-sp)), 18px);
  font-weight: bold;
  position: relative;
  @media(width >=861px) {
    min-height: 66px;
  }
  &::before, &::after {
    content: "";
    border-radius: min((10vw / 3.75), 10px);
    box-shadow: min((2vw / 3.75), 4px) min((4vw / 3.75), 8px) 0px max((-1vw / 3.75), -2px) rgb(0 0 0 / .25);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transition: opacity 0.5s ease;
    @media(width >=861px) {
      border-radius: 100px;
    }
  }
  &::before {
    background: linear-gradient(to bottom, #fff, #ECE9E6);
  }
  &::after {
    background: linear-gradient(to right, #1488CC, #2B32B2);
    opacity: 0;
  }
}
.section-nav__link {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: min((12vw / 3.75), 20px) min((5vw / 3.75), 5px) 0;
  background: transparent;
  z-index: 1;
  position: relative;
  &::after {
    content: var(--icon, var(--default-ico-arrow-r));
    font-family: var(--default-ff-icon);
    rotate: 90deg;
    width: max-content;
    z-index: 2;
    @media(width >=861px) {
      margin: 4px 0 -4px;
    }
  }
  .section-nav__link--text {
    display: flex;
    height: 100%;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    line-height: 1.1;
    z-index: 2;
  }
}
/*product-〇〇*/
.product__list {
  display: flex;
  justify-content: center;
  --item-col: 3;
  --item-gap-tate: min((15vw / 3.75), 15px);
  --item-gap-yoko: min((15vw / 3.75), 15px);
  gap: var(--item-gap-tate) var(--item-gap-yoko);
  @media(width <861px) {
    flex-direction: column;
  }
  @media(width >=861px) {
    --item-gap-tate: 36px;
    --item-gap-yoko: 10px;
    flex-wrap: wrap;
    #product-air & {
      &:has(> :nth-child(4n):last-child) {
        justify-content: flex-start;
      }
    }
    :is(#product-airhotel, #product-hotel) & {
      &:has(> :nth-child(3n+1):last-child:not(:first-child)) {
        justify-content: flex-start;
      }
    }
    #product-op & {
      --item-col: 4;
      &:has(> :nth-child(4n+1):last-child:not(:first-child)) {
        justify-content: flex-start;
      }
    }
  }
  @media(741px <= width < 861px) {
    flex-direction: row;
    flex-wrap: wrap;
  }
}
.product__list--item {
  @media(width >=861px) {
    width: calc((100% - (var(--item-gap-yoko) * calc(var(--item-col) - 1))) / var(--item-col));
    #product-air & {
      &:nth-child(n+4) {
        --item-col: 4;
        @media(width <1020px) {
          --item-col: 3;
        } 
      }
    }
  }
  @media(741px <= width < 861px) {
    width: calc((100% - (var(--item-gap-yoko) * calc(var(--item-col) - 1))) / var(--item-col));
    --item-col: 2;
  }
}
.product__list--data {
  height: 100%;
}
.product__list--inner {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: min((1vw / 3.75), 1px) solid rgb(0 0 0 / .5);
  padding: min((15vw / 3.75), 15px) min((15vw / 3.75), 15px) min((35vw / 3.75), 35px);
  position: relative;
  #product-air & {
    .product__list--item:nth-child(-n+3) & {
      background: #FFFBDA url(../images/icon_recommend.png) no-repeat top right min((10vw / 3.75), 10px)  / min((70vw / 3.75), 70px) min((57vw / 3.75), 57px);
      @media(width >=861px) {
        padding-bottom: 22px;
          @media(width <1170px) {
            background-size: min((65vw / 3.75), 65px) min((53vw / 3.75), 53px);
            @media(width <1120px) {
              background-size: min((60vw / 3.75), 60px) min((49vw / 3.75), 49px);
              background-position: top right min((5vw / 3.75), 5px);
            @media(width <1030px) {
              background-size: min((55vw / 3.75), 55px) min((45vw / 3.75), 45px);
              background-position: top right;
            }
          }
        }
      }
      @media(width <861px) {
        border-color: #F64F07;
      }
    }
    .product__list--item:nth-child(n+4) & {
      @media(861px <= width <= 1021px) {
        padding: min((15vw / 3.75), 15px) min((10vw / 3.75), 10px) min((35vw / 3.75), 35px);
      }
    }
  }
  #product-hotel & {
    gap: min((10vw / 3.75), 10px);
  }
  #product-op & {
    gap: min((15vw / 3.75), 15px);
    align-items: flex-start;
  }
  @media(width >=861px) {
    border-width: 7px;
    border-color: #f2f2f2;
    align-items: center;
  }
  &::after {
    content: '';
    width: min((20vw / 3.75), 20px);
    height: min((20vw / 3.75), 20px);
    background: var(--default-color-red);
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    position: absolute;
    bottom: min((5vw / 3.75), 6px);
    right: min((5vw / 3.75), 6px);
  }
}
.product__list--inner--top {
  width: 100%;
  display: flex;
  gap: min((20vw / 3.57), 20px);
  @media(width <861px) {
    align-items: center;
  }
  @media(width >=861px) {
    flex-direction: column;
    gap: 10px
  }
}
.product__list--inner--middle {
  width: 100%;
  display: flex;
  gap: min((10vw / 3.75), 10px);
  margin-top: min((10vw / 3.75), 10px);
  @media(width <861px) {
    align-items: center;
  }
  @media(width >=861px) {
    flex-direction: column;
    gap: 3px;
    margin-top: 6px;
  }
}
.product__list--image--wrapper {
  width: min((130vw / 3.75), 130px);
  @media(width >=861px) {
    width: 100%;
  }
}
.product__list--image {
  width: 100%;
  height: auto;
  padding-top: calc((420 / 600) * 100%);
  position: relative;
  .product__list--image--photo {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
  }
}
.product__list--label {
  display: flex;
  flex-direction: column;
  gap: min((10vw / 7.5), 5px);
  flex-wrap: wrap;
  min-height: 1em;
  @media(width <861px) {
    #product-air & {
      &:has(.product__list--label--item) {
        margin-bottom: min((10vw / 3.75), 10px);
      }
    }
    #product-airhotel & {
      &:has(.is-seat-W) {
        width: min((190vw / 3.75), 190px);
      }
    }
  }
  @media(width >=861px) {
  align-items: center;
    #product-air & {
      margin-bottom: 5px;
    }
    #product-airhotel & {
      order: 0;
    }
  }
  > [class*="product__list--label--"] {
    width: fit-content;
    height: min((20vw / 3.75), 20px);
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: min((12vw / 3.75), 12px);
    font-weight: bold;
    color: #fff;
    background: var(--label-bg);
    border-radius: 100px;
    padding: .1em .8em .2em;
    @media(width >=861px) {
      padding: .1em 1.2em .2em;
      @media(width <1170px) {
        padding: .1em .8em .2em;
      }
    }
    &.is-seat-OL {
      --label-bg: #fff;
      border: 1px solid var(--default-color-red);
      color: var(--default-color-red);
    }
    &.is-seat-C {
      --label-bg: #1F1F1F;
    }
    &.is-seat-W {
      --label-bg: #355BBA;
    }
    &.is-seat-F {
      --label-bg: #9F8B3A;
    }
  }
  &:not(:has([class*="product__list--label--"])) {
    @media(width <861px) {
      margin-bottom: 0;
    }
    @media(width >=861px) {
      height: min((20vw / 3.75), 20px);
    }
  }
}
.product__list--top--text {
  display: flex;
  flex-direction: column;
}
.product__list--rank {
  #product-hotel & {
    width: min((78vw / 3.75), 78px);
    height: min((10vw / 3.75), 10px);
    margin-bottom: min((5vw / 3.75), 5px);
    .is-hotel-rank {
      display: block;
    }
  }
}
.product__list--title {
  @media(width >=861px) {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  #product-airhotel & {
    width: calc(100% - (min((130vw / 3.75), 130px) + min((20vw / 3.75), 20px)));
    @media(width >=861px) {
      width: 100%;
    }
  }
  #product-op & {
    font-size: var(--default-font-size);
    font-weight: bold;
    line-height: var(--default-font-lh2);
  }
}
.product__list--title--airline {
  display: flex;
  align-items: center;
  gap: min((3vw / 3.75), 5px);
  @media(width <861px) {
    #product-airhotel & {
      /*width: calc(100% - (min((190vw / 3.75), 190px) + min((10vw / 3.75), 10px)));*/
    }
  }
  @media(width >=861px) {
    #product-airhotel & {
      order: 1;
    }
  }
  .product__list--title--airline--image {
    width: min((37vw / 3.75), 37px);
    height: min((24vw / 3.75), 24px);
  }
  .product__list--title--airline--text {
    font-size: var(--default-font-size);;
    font-weight: bold;
  }
  .product__list--title--airline--dep {
    font-size: min((14vw / 3.75), 14px);
    @media(width <861px) {
      margin-left: min((10vw / 3.75), 10px);
    }
  }
}
.product__list--title--main {
  display: flex;
  align-items: center;
  line-height: var(--default-font-lh2);
  font-weight: bold;
  #product-air & {
    margin-top: min((10vw / 7.5), 5px);
  }
  #product-hotel & {
    gap: min((10vw / 3.75), 10px);
  }
  @media(width <861px) {
    justify-content: space-between;
    #product-air & {
      gap: min((10vw / 3.75), 10px);
    }
    #product-airhotel & {
      flex-direction: column;
      align-items: flex-start;
      gap: min((5vw / 3.75), 5px);
    }
    #product-hotel & {
      flex-direction: column;
    }
  }
  @media(width >=861px) {
    flex-direction: column;
  }
  .product__list--title--main--text {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    text-align: center;
    @media(width <861px) {
      #product-air & {
        width: calc(100% - (min((10vw / 3.75), 10px) + 9em));
      }
      #product-airhotel & {
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
      }
    }
  }
  .product__list--title--main--text--city {
    font-size: min((24vw / 3.75), 24px);
    #product-airhotel & {
      font-size: min((20vw / 3.75), 24px);
    }
  }
  .product__list--title--main--text--days {
    font-size: min((20vw / 3.75), 24px);
  }
  .product__list--title--main--text--airport {
    font-size: min((16vw / 3.75), 18px);
  }
  .product__list--title--main--discount {
    display: flex;
    align-items: center;
    gap: min((10vw / 3.75), 10px);
    font-weight: normal;
    .product__list--title--main--discount--label {
      color: var(--default-color-red);
      border: 1px solid var(--default-color-red);
      font-size: min((12vw / 3.75), 12px);
      padding: .2em .8em;
    }
    .product__list--title--main--discount--price {
      font-size: var(--default-font-size);
      text-decoration: line-through;
    }
  }
  .product__list--title--main--price {
    #product-air & {
      @media(width <861px) {
        width: 9em;
        text-align: right;
      }
    }
    #product-hotel & {
      margin-top: max((-8vw / 3.75), -8px);
    }
    .product__list--title--main--price--text {
      font-size: min((26vw / 3.75), 26px);
      font-weight: bold;
      color: var(--default-color-red);
      #product-airhotel & {
        font-size: min((24vw / 3.75), 26px);
      }
      .is-en, .is-kara {
        font-size: var(--default-font-size);;
      }
    }
  }
  .product__list--title--main--notes {
    font-size: min((12vw / 3.75), 12px);
    font-weight: normal;
    #product-hotel & {
      margin-top: max((-5vw / 3.75), -5px);
    }
  }
}
.product__list--title--airport {
  font-size: 12px;
  text-align: center;
}
.product__list--more {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: min((3vw / 3.75), 3px);
  font-size: min((12vw / 3.75), 12px);
  margin-top: min((18vw / 3.75), 15px);
  @media(width >=861px) {
    #product-air & {
      .product__list--item:nth-child(-n+3) & {
        padding: 0px calc(23vw / 11.04);
        @media(width <1020px) {
          padding: 0;
        } 
      }
      .product__list--item:nth-child(n+4) & {
        @media(width <1020px) {
          padding: 0;
        } 
      }
    }
  }
  #product-airhotel & {
    margin-top: min((10vw / 3.75), 5px);
  }
  #product-hotel & {
    margin-top: 0;
  }
  &:is(.is-hotel, .is-intro) {
    border-top: 1px solid #4B4B4B;
    margin-top: min((5vw / 3.75), 5px);
    padding-top: min((10vw / 3.75), 10px);
  }
  .product__list--more--item {
    display: flex;
    align-items: baseline;
    gap: min((5vw / 3.75), 5px);
    .product__list--more--title {
      width: 6.3em;
      text-align: center;
      background: #fff;
      border: 1px solid #B4B4B4;
      padding: .1em .3em;
    }
    .product__list--more--text {
      width: min((245vw / 3.75), 245px);
      font-weight: bold;
      .is-hotel & {
        display: flex;
        flex-direction: column;
        font-size: min((15vw / 3.75), 14px);
        .is-room {
          font-size: min((12vw / 3.75), 12px);
          font-weight: normal;
        }
      }
      @media(width >=861px) {
        width: calc(100% - 6.3em);
      }
    }
  }
  .product__list--more--tokuten {
    display: flex;
    flex-direction: column;
    gap: min((3vw / 3.75), 3px);
    margin-top: min((3vw / 3.75), 3px);
  }
}
.product__list--point {
  width: 100%;
  color: var(--default-color-red);
  font-size: min((12vw / 3.75), 12px);
  text-align: center;
  background: #fff;
  border: 1px solid var(--default-color-red);
  padding: .2em .3em;
  margin-top: min((3vw / 3.75), 3px);
  #product-airhotel & {
    text-align: left;
    margin-top: min((15vw / 3.75), 15px);
    padding: .8em;
  }
}
.product__list--dst {
  width: fit-content;
  font-size: min((12vw / 3.75), 12px);
  background: #E5E5E5;
  padding: .3em 2em;
  #product-hotel & {
    padding: .3em .5em;
  }
}
.product__others {
  margin-top: min((50vw / 3.75), 50px);
}
.product__notes {
  color: #4B4B4B;
  margin-top: min((50vw / 3.75), 50px);
  .product__notes--item {
    font-size: min((12vw / 3.75), 12px);
    text-indent: -1em;
    padding-left: 1em;
    &::before {
      content: "※";
    }
  }
}

/*shopping*/
.shopping__lineup {
  display: flex;
  flex-wrap: wrap;
  gap: min((15vw / 3.75), 24px);
  .shopping__lineup--item {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background: #fff;
    border: 1px solid rgb(0 0 0 / .2);
    border-radius: min((10vw / 3.75), 10px);
    box-shadow: 0px 2px 8px 0 rgb(0 0 0 / .1);
    padding: min((28vw / 3.75), 25px) min((16vw / 3.75), 18px) min((20vw / 3.75), 50px);
    @media(width >=741px) {
      width: calc((100% - 24px) / 2);
    }
    .shopping__lineup--item--title {
      width: 100%;
      font-size: min((22vw / 3.75), 22px);
      font-weight: bold;
      text-align: center;
      margin-bottom: min((30vw / 3.75), 30px);
      position: relative;
      &::after {
        content: "";
        display: block;
        width: min((312vw / 3.75), 312px);
        height: 1px;
        background: #E7E7E7;
        position: absolute;
        bottom: max((-20vw / 3.75), -20px);
        left: 0;
        right: 0;
        margin: auto;
      }
    }
    .shopping__lineup--item--lead {
      font-size: var(--default-font-size);
      font-weight: bold;
      color: var(--default-color-red);
    }
    .shopping__lineup--item--image {
      width: min((238vw / 3.75), 238px);
      height: min((160vw / 3.75), 160px);
      margin-top: min((20vw / 3.75), 20px);
      .shopping__lineup--item--image--photo {
        width: 100%;
        height: 100%;
      }
    }
    .shopping__lineup--item--text {
      font-size: min((14vw / 3.75), 14px);
      margin-top: min((20vw / 3.75), 20px);
    }
    .shopping__lineup--item--button {
      margin-top: min((20vw / 3.75), 20px);
    }
    .shopping__lineup--item--pdf {
      font-size: min((12vw / 3.75), 12px);
      margin-top: min((5vw / 3.75), 5px);
    }
  }
}

/*article__list*/
.article__list {
  --article-waku-yohaku-tate: min((15vw / 3.75), 25px);
  --article-waku-yohaku-yoko: min((15vw / 3.75), 25px);
  @media(width >=992px) {
    --article-waku-yohaku-yoko: min((40vw / 3.75), 40px);
  }
}
.article__item {
  background: #F9F9F9;
  box-shadow: 0 min((2vw / 3.75), 4px) min((2vw / 3.75), 4px) 0 rgba(0, 0, 0, 0.25);
  position: relative;
  &::after {
    content: '';
    width: min((16vw / 3.75), 32px);
    height: min((16vw / 3.75), 32px);
    background: #F9D51C;
    clip-path: polygon(100% 0, 0% 100%, 100% 100%);
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .article__link {
    border: none;
    --article-yohaku: min((16vw / 3.75), 16px);
  }
  .article__image {
    --article-photo-height: min((120vw / 3.75), 150px);
  }
  .article__detail--title {
    font-size: min((13vw / 3.75), 18px);
    line-height: var(--default-font-lh);
  }
  .article__detail--text {
    font-size: min((12vw / 3.75), 14px);
  }
}

/*reco-banner__list*/
.reco-banner__list {
  display: grid;
  gap: var(--bnr-gap);
  margin: auto;
  #product-air & {
    grid-template-columns: 1fr;
    --bnr-gap: min((40vw / 7.5), 30px);
    margin-bottom: min((50vw / 7.5), 50px);
    justify-self: center;
    /*@media(width >=861px) {
      grid-template-columns: repeat(auto-fit, calc((100% - var(--bnr-gap) * (var(--bnr-col) - 1)) / var(--bnr-col)));
      --bnr-col: 2;
      &:has(> :nth-child(-n+1):last-child) {
        --bnr-col: 1;
        justify-self: center;
        text-align: center;
      }
    } PCサイズ時、上部バナー枠複数バナー設置の際 2カラムにする場合*/
    .banner__list--item--image {
      width: 100%;
      height: 100%;
    }
  }
  #banner-reco & {
    grid-template-columns: repeat(var(--bnr-col, 2), 1fr);
    --bnr-gap: min((15vw / 3.75), 15px);
    @media(width >=861px) {
      --bnr-col: 4;
      --bnr-gap: min((55vw / 11.04), 55px);
    }
  }
  #banner-useful & {
    grid-template-columns: repeat(var(--bnr-col, 2), 1fr);
    --bnr-gap: min((15vw / 3.75), 26px);
    @media(width >=861px) {
      --bnr-col: 5;
    }
  }
}

/*searchArea*/
#searchArea {
  padding-bottom: 40px;
  @media(width >740px) {
    padding: 50px 0;
    /*background: url("../images/search_bg_pc.webp") no-repeat center top / var(--default-bg-width-pc);*/
    background: url("../images/search_bg_pc.webp") no-repeat center top / cover;
  }
  .rn-searchMod__buttonSearch::before {
    top: 19px;
    left: 55px;
  }
  .rn-searchMod__formDomLink::after, .rn-searchMod__formOvsLink::after {
    top: 13px;
  }
  .rn-searchMod__formDomLink, .rn-searchMod__formOvsLink {
    @media(width <=740px) {
      font-size: .8rem;
    }
  }
}
/*------------------------------------------------*/
/*★ ＝＝ footerArea ＝＝ ★*/
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  .base-textlink__link {
    &:hover {
      .base-textlink__text {
        text-decoration: underline;
        text-underline-offset: .2em;
      }
    }
  }
  .mv-portal__list--link {
    transition: var(--default-hover-speed);
    &:hover {
      --bg: var(--portal-color-active);
    }
  }
  .section-nav__item {
    transition: var(--default-hover-speed);
    &:hover {
      color: #fff;
      &::before {
        opacity: 0;
      }
      &::after {
        opacity: 1;
      }
    }
  }
  .product__list--inner {
    transition: var(--default-hover-speed);
    &:hover {
      border-color: #EDA5A5;
    }
  }
  .float-button__link, .banner__reco--inner, .article__link {
    transition: var(--default-hover-transition-opacity);
    &:hover {
      opacity: var(--default-hover-opacity);
    }
  }
  .base-button .ui-static-button {
    transition: var(--default-hover-speed);
    &:hover {
      background: var(--default-color-blue);
    }
  }
}