@charset "utf-8";
/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
/*------------------------------------------------*/
/*★ ＝＝ headerArea ＝＝ ★*/
/*mv*/
.mv {
  .mv__inner {
    position: relative;
    height: var(--mv-size-h);
    background: var(--mv-bg) no-repeat center center / cover;
  }
  .mv__title, .mv__title--picture {
    width: 100%;
    height: 100%;
  }
  .mv__title--image {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
  }
  @media(width < 861px) {
    --mv-size-h: calc((1420vw/ 7.5));
    --mv-bg: url("../images/mv_bg_sp.webp");
  }
  @media(width >=861px) {
    --mv-size-h: 900px;
    --mv-bg: url("../images/mv_bg_pc.webp");
    --mv-bg-size: 1920px;
    @media(width <=1120px) {
      --mv-size-h: calc((900vw/ 11.2));
      --mv-bg-size: calc((1920vw/ 11.2));
    }
  }
}
/*------------------------------------------------*/
/*★ ＝＝ mainArea ＝＝ ★*/
/*section*/
.section__wrapper {
  background: var(--section-bg) no-repeat center 0 / var(--section-bg-size);
  @media(width < 861px) {
    --section-bg: url("../images/intro_bg_sp.webp");
    --section-bg-size: max(100%, (750vw / 7.5));
  }
  @media(width >=861px) {
    --section-bg: url("../images/intro_bg_pc.webp");
    --section-bg-size: max(100%, 1920px);
  }
}
.section__inner {
  width: var(--default-width);
  margin: auto;
  padding: min((100vw / 7.5), 100px) 0;
}
.section__title {
  width: min((670vw / 7.5), 670px);
  @media(width >=861px) {
    width:  min((820vw / 11.04), 820px);
  }
  text-align: center;
  margin: 0 auto min((90vw / 7.5), 80px);
}
.section__title--image {
  width: 100%;
  height: 100%;
}
/*introduction*/
#introduction {
  .section__inner {
    width: min((700vw / 7.5), var(--default-width-pc));
    padding: min((110vw / 7.5), 120px) 0 min((140vw / 7.5), 90px);
  }
}
.introduction {
  font-family: "Zen Old Mincho";
  font-weight: 900;
  text-align: center;
}
.introduction__lead {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: min((45vw / 7.5), 36px);
  &::after {
    content: '';
    width: 5em;
    height: min((5vw / 7.5), 5px);
    background-color: var(--default-color-orange);
    margin-top: min((25vw / 7.5), 15px);
  }
}
.introduction__text {
  display: flex;
  flex-direction: column;
  gap: min((100vw / 7.5), 64px);
  margin-top: min((120vw / 7.5), 80px);
  line-height: var(--default-font-lh-l);
}
.introduction__text--item--main {
  font-size: min((36vw / 7.5), 24px);
}
.introduction__other {
  line-height: var(--default-font-lh-l);
  margin-top: min((100vw / 7.5), 64px);
  position: relative;
  &::before {
    display: block;
    content: '';
    width: min((136vw / 7.5), 158px);
    height: min((124vw / 7.5), 145px);
    background: url("../images/intro_kazari.png") no-repeat 0 0 / contain;
    position: absolute;
    @media(width < 861px) {
      top :max((-90vw / 7.5), -50px);
      right: 0;
    }
    @media(width >=861px) {
      bottom: -45px;
      right: min((116vw / 9.92), 116px);
    }
  }
}
.introduction__button {
  margin-top: min((120vw / 7.5), 80px);
}
/*campaign*/
#campaign {
  .section__title {
    height: min((248vw / 7.5), 248px);
    @media(width >=861px) {
      height: min((154vw / 11.04), 154px);
    }
  }
}
.campaign__wapper {
  background: #c7dddd;
  border: 1px solid #166161;
  padding: min((40vw / 7.5), 30px) min((20vw / 7.5), 30px);
}
.campaign__lineup {
}
.campaign__lineup--item {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(to right, #166161 60%, transparent 60%) repeat-x left bottom / 10px 1px;
  padding: min((60vw / 7.5), 40px) 0;
  &:first-child {
    padding-top: 0;
  }
  &.is-lineup-02 {
    padding-bottom: min((120vw / 7.5), 60px);
  }
  &.is-lineup-op {
    display: grid;
    grid-template-areas:
    "ttl"
    "txt"
    "img"
    "btn";
    gap: min((50vw / 7.5), 50px);
    align-items: start;
    justify-items: center;
    color: #166161;
    @media(width < 861px) {
      padding: min((50vw / 7.5), 30px) min((20vw / 7.5), 20px);
    }
    @media(width >=861px) {
      grid-template-areas:
      "ttl ttl"
      "txt img"
      "btn btn";
      gap: 20px;
      grid-template-columns: min((590vw / 11.04), 590px) min((320vw / 11.04), 320px);
    }
    .optional__title {
      grid-area: ttl;
      width: min((517vw / 7.5), 383px);
      height: min((70vw / 7.5), 51px);
      .optional__title--image {
        width: 100%;
        height: 100%;
      }
    }
    .optional__texts {
      display: flex;
      flex-direction: column;
      grid-area: txt;
      position: relative;
      @media(width < 861px) {
        padding-bottom: min((150vw / 7.5), 150px);
      }
      &::after {
        content: "";
        width: min((164vw / 7.5), 164px);
        height: min((144vw / 7.5), 144px);
        background: url("../images/cpn_op_kazari.png") no-repeat 0 0 / contain;
        position: absolute;
        @media(width < 861px) {
          bottom: 0;
          right: 0;
        }
        @media(width >=861px) {
          top: 0;
          right: 30px;
          width: min((92vw / 11.04), 92px);
          height: min((81vw / 11.04), 81px);
        }
      }
    }
    .optional__texts--title--sub {
      font-family: "Zen Old Mincho";
      font-size: min((32vw / 7.5), 24px);
      font-weight: 900;
    }
    .optional__texts--title--main {
      font-family: "Zen Old Mincho";
      font-size: min((42vw / 7.5), 32px);
      font-weight: 900;
      @media(width >=861px) {
        font-size: min((32vw / 11.04), 32px);
      }
    }
    .optional__texts--detail {
      font-weight: 500;
      margin-top: 1em;
    }
    .optional__image {
      grid-area: img;
      width: min((590vw / 7.5), 590px);
      height: min((380vw / 7.5), 380px);
      @media(width >=861px) {
        width: min((320vw / 11.04), 320px);
        height: min((214vw / 11.04), 214px);
      }
      .optional__image--photo {
        width: 100%;
        height: 100%;
      }
    }
    .optional__button {
      text-align: center;
      grid-area: btn;
    }
  }
}
.campaign__lineup--image--wapper {
  width: min((630vw / 7.5), 630px);
  @media(width >=861px) {
    width: min((930vw /11.04), 930px);
  }
  .is-lineup-01 & {
    height: min((808vw / 7.5), 808px);
    @media(width >=861px) {
      height: min((507vw / 11.04), 507px);
    }
  }
  .is-lineup-02 & {
    height: min((180vw / 7.5), 180px);
    @media(width >=861px) {
      height: min((142vw / 11.04), 142px);
    }
  }
  .is-lineup-more & {
    height: min((230vw / 7.5), 230px);
    @media(width >=861px) {
      height: min((174vw / 11.04), 174px);
    }
  }
}
.campaign__lineup--image {
  width: 100%;
  height: 100%;
}
.coupon__list {
  display: flex;
  gap: min((30vw / 7.5), 35px);
  justify-content: center;
  margin-top: min((50vw / 7.5), 50px);
  @media(width < 861px) {
    flex-direction: column;
    align-items: center;
  }
}
.coupon__list--item {
  width: min((590vw / 7.5), 590px);
  height: min((214vw / 7.5), 214px);
  @media(width >=861px) {
    width: min((440vw / 11.04), 440px);
    height: min((162vw / 11.04), 162px);
  }
}
.coupon__list--image {
  width: 100%;
  height: 100%;
}
.campaign__notes {
  border: 1px solid #166161;
  background: #fff;
  padding: min((30vw / 7.5), 20px) min((20vw / 7.5), 20px);
  margin-top: min((50vw / 7.5), 45px);
}
.campaign__notes--title {
  font-size: min((36vw / 7.5), 18px);
  font-weight: 700;
  text-align: center;
  color: #166161;
  margin-bottom: min((40vw / 7.5), 20px);
}
.notes__list {
  display: flex;
  flex-direction: column;
  gap: .3em;
  font-size: min((28vw / 7.5), 14px);
}
.notes__list--item {
  text-indent: -1em;
  padding-left: 1em;
}
/*location*/
#location {
  .section__title {
    height: min((194vw / 7.5), 194px);
    @media(width >=861px) {
      height: min((82vw / 11.04), 82px);
    }
  }
}
.location__image {
  width: min((670vw / 7.5), 670px);
  height: min((1400vw / 7.5), 1400px);
  margin: auto;
  @media(width >=861px) {
    width: min((992vw / 11.04), 992px);
    height: min((474vw / 11.04), 474px);
  }
}
.location__image--photo {
  width: 100%;
  height: 100%;
}
.location__info {
  display: flex;
  --location-img-w: min((670vw / 7.5), 670px);
  --location-img-h: min((446vw / 7.5), 446px);
  --location-gap: min((65vw / 7.5), 60px);
  gap: var(--location-gap);
  margin-top: min((100vw / 7.5), 55px);
  @media(width < 861px) {
    flex-direction: column;
    align-items: center;
  }
  @media(width >=861px) {
    --location-img-w: min((440vw / 11.04), 440px);
    --location-img-h: min((294vw / 11.04), 294px);
  }
  .location__info--texts {
    @media(width >=861px) {
      width: calc(100% - (var(--location-gap) + var(--location-img-w)));
    }
  }
  .location__info--texts--title {
    font-family: "Zen Old Mincho";
    font-size: min((38vw / 7.5), 24px);
    font-weight: 900;
    margin-bottom: 1em;
  }
  .location__info--image {
    width: var(--location-img-w);
    height: var(--location-img-h);
    .location__info--image--photo {
      width: 100%;
      height: 100%;
    }
  }
}
.recommend__tour {
  margin-top: min((95vw / 7.5), 55px);
  background: #24377c;
  padding: min((45vw / 7.5), 25px) min((40vw / 7.5), 20px);
}
.recommend__title {
  font-size: min((44vw / 7.5), 30px);
  font-family: "Zen Old Mincho";
  font-weight: 900;
  text-align: center;
  color: #fff;
  margin-bottom: 1em;
  position: relative;
  &::before, &::after  {
    content: "";
    background: url("../images/location_recommend_kazari.png") no-repeat 0 0 / contain;
    width: var(--recommend-kazar-w);
    --recommend-kazar-w: min((130vw / 7.5), 121px);
    height: min((109vw / 7.5), 102px);
    position: absolute;
    top:max((-30vw / 7.5), -25px);
  }
  &::before {
    left: 0;
    transform: scaleX(-1);
    @media(width < 861px) {
      left: max((-30vw / 7.5), -15px);
    }
  }
  &::after {
    right: 0;
    @media(width < 861px) {
      right: max((-30vw / 7.5), -15px);
    }
  }
}
.recommend__lead {
  font-weight: bold;
  line-height: var(--default-font-lh-l);
  color: #fff;
  margin-bottom: 1em;
  @media(width >=861px) {
    text-align: center;
  }
}
.recommend__tour {
  .product__list--item {
    background: #fff;
    border: 1px solid #000;
  }
  .product__list--inner {
    text-decoration: none;
    display: grid;
    padding: min((20vw / 7.5), 20px);
    grid-template-columns: min((220vw / 7.5), 220px) 1fr;
    gap: min((18vw / 7.5), 20px);
    color: #000;
    @media(width >=861px) {
      grid-template-columns: 246px 1fr;
    }
  }
  .product__list--image {
    width: 100%;
    height: min((146vw / 7.5), 164px);
    aspect-ratio: 944 / 628;
    object-fit: cover;
  }
  .product__list--type {
    background: #000;
    color: #fff;
    text-align: center;
    padding: .2em .2em .25em;
    font-size: min((20vw / 7.5), 14px);
    font-weight: bold;
    align-content: center;
  }
  /*.product__list--item[class*="brandT"] {
    @media(width < 861px) {
      .product__list--image::before {
        width: 100%;
        text-align: center;
        content: "添乗員同行";
        background: #ac4bb0;
        color: #fff;
        padding: 1px 1em 3px;
        font-size: calc(12em / var(--default-font-size-pc-val));
        display: inline-block;
      }
    }
    @media(width >=861px) {
      .product__list--texts::before {
        content: "添乗員同行";
        background: #ac4bb0;
        color: #fff;
        padding: 1px 1em 3px;
        font-size: calc(12em / var(--default-font-size-pc-val));
        display: inline-block;
        margin-bottom: .25em;
      }
    }
  }*/
  .product__list--texts {
    @media(width < 861px) {
      line-height: 1.4;
    }
  }
  .product__list--title {
    font-weight: bold;
    font-size: min((24vw / 7.5), 16px);
    margin-bottom: .75em;
  }
  .product__list--detail {
    color: #333;
    font-size: min((20vw / 7.5), 12px);
  }
  .product__list--price {
    margin-top: 1em;
    color: #333;
    font-size: min((20vw / 7.5), 12px);
    @media(width >=861px) {
      margin-top: 20px;
      font-size: 12px;
      text-align: right;
      display: flex;
      flex-wrap: wrap;
      gap: 0 .5em;
      justify-content: flex-end;
      align-items: baseline;
    }
  }
  .product__list--minmax {
    font-weight: bold;
    color: #e70000;
    font-size: min((28vw / 7.5), 18px);
    @media(width >=861px) {
      order: 3;
    }
  }
}

/*product*/
.product__wrapper {
  background: #fff7e7;
}
#product {
  .section__inner {
    display: flex;
    flex-direction: column;
    position: relative;
    &::before {
      content: "";
      width: min((300vw / 7.5), 353px);
      height: min((264vw / 7.5), 310px);
      background: url("../images/tour_kazari_right.png") no-repeat 0 0 / contain;
      position: absolute;
      top: min((80vw / 7.5), 40px);
      right: max((-124vw / 7.5), -124px);
      @media(width >=861px) {
        top: 145px;
        right: -360px;
      }
    }
    &::after {
      content: "";
      width: min((667vw / 7.5), 976px);
      height: min((385vw / 7.5), 564px);
      background: url("../images/tour_kazari_left.png") no-repeat 0 0 / contain;
      position: absolute;
      bottom: 0;
      left: max((-40vw / 7.5), -40px);
      @media(width >=861px) {
        left: -245px;
      }
    }
  }
  .product__list {
    display: grid;
    color: #000;
    z-index: 2;
    @media(width >=861px) {
      --gap: 14px;
      --col-num: 4;
      grid-template-columns: repeat(auto-fit, calc((100% - var(--gap) * (var(--col-num) - 1)) / var(--col-num)));
      justify-content: center;
      gap: var(--gap);
    }
  }
  .product__list--inner {
    font-size: min((20vw / 7.5), 12px);
    line-height: 1.4;
    color: inherit;
    font-weight: normal;
    background: #fff;
    border: 1px solid #e3d0a8;
    display: grid;
    grid-template-columns: min((243.5vw / 7.5), 280px) 1fr;
    gap: min((10vw / 7.5), 10px) min((20vw / 7.5), 30px);
    position: relative;
  }
  .product__list--image {
    aspect-ratio: 944 / 628;
    object-fit: cover;
    height: min((162vw / 7.5), 186px);
  }
  .product__list--type {
    background: #000;
    color: #fff;
    text-align: center;
    padding: .2em .2em .25em;
    font-weight: bold;
    align-content: center;
  }
  .product__list--label-wrapper:has(.product__list--label.is-economy) {
    display: none;
  }
  .product__list--label {
    font-size: min((20vw / 7.5), 11px);
    line-height: 1.2;
    color: #fff;
    padding: .5em .75em;
    font-weight: bold;
    background: var(--product-label-bg, #000);
    &.is-business {
      --product-label-bg: #001a4b;
    }
  }
  .product__list--title {
    font-weight: bold;
  }
  .product__list--minmax {
    color: #e70000;
    font-weight: bold;
  }
  .product__list--title, .product__list--minmax {
    font-size: min((24vw / 7.5), 16px);
  }
  .product__list--detail, .product__list--price {
    color: #333;
  }
  .product__list--detail, .product__list--minmax ~ [class^="product__list--"] {
    margin-top: .25em;
  }
  @media(width < 861px) {
    .product__list--item:not(:first-child) {
      --yohaku: min((10vw / 7.5), 15px);
      margin-top: var(--yohaku);
    }
    .product__list--inner {
      padding: min((18vw / 7.5), 15px);
      grid-template-areas:
        "img label"
        "img txt";
      grid-template-rows: max-content 1fr;
      &:has(.product__list--label.is-economy) {
        grid-template-areas: "img txt";
      }
    }
    .product__list--image-wrapper {
      grid-area: img;
    }
    .product__list--label-wrapper {
      grid-area: label;
      display: flex;
      flex-wrap: wrap;
      gap: min((10vw / 7.5), 8px);
    }
    .product__list--text-wrapper {
      grid-area: txt;
    }
    .product__list--detail {
      margin-top: min((15vw / 7.5), 15px);
    }
    .product__list--price {
      margin-top: min((20vw / 7.5), 20px);
    }
  }
  @media(width >=861px) {
    .product__list--item, .product__list--data {
      display: contents;
    }
    .product__list--inner {
      grid-template-columns: 1fr;
      grid-template-rows: subgrid;
      grid-row: span 2;
      gap: 0;
      border: 1px solid #b1b9c4;
    }
    .product__list--label-wrapper {
      position: absolute;
      top: 0;
      left: 0;
      display: grid;
    }
    .product__list--image-wrapper {
      display: grid;
      grid-template-rows: auto 1fr;
      .product__list--image {
        width: 100%;
        height: auto;
      }
    }
    .product__list--type {
      padding: .5em;
    }
    .product__list--text-wrapper {
      padding: 8px 10px 10px;
      display: grid;
      align-content: space-between;
      gap: 1em;
    }
  }
}

.product__button {
  margin-top: min((70vw / 7.5), 60px);
  z-index: 2;
}
/*bannerApp*/
.reco-banner {
  width: var(--default-width);
  text-align: center;
  margin: auto;
  padding-bottom: min((80vw / 7.5), 80px);
}
/*------------------------------------------------*/
/*★ ＝＝ searchArea ＝＝ ★*/
#searchArea {
  padding-bottom: min((50vw / 7.5), 60px);
  @media (width >=861px) {
    padding: 60px 0;
    background: url("../images/search_bg_pc.webp") no-repeat center bottom / var(--default-bg-width-pc);
  }
}
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  .product__list--inner {
    > [class$="-wrapper"] {
      transition: var(--default-hover-transition-opacity);
      .product__list--inner:hover & {
        opacity: var(--default-hover-opacity);
      }
    }
  }
  .reco-banner__link {
      transition: var(--default-hover-transition-opacity);
      &:hover {
        opacity: var(--default-hover-opacity);
      }
  }
}