@charset "utf-8";
/*------------------------------------------------*/
/*★ ページスタイル設定 ★*/
/*------------------------------------------------*/
/*★ ＝＝ headerArea ＝＝ ★*/
#mv {
  --mv-h: min((400vw / 3.75), 400px);
}
/*------------------------------------------------*/
/*★ ＝＝ mainArea ＝＝ ★*/
.section:last-child:not([id^="product_"]) {
  padding-bottom: var(--sec-yohaku1);
}
/*is-page-season*/
.is-page-season {
  #season {
    .section__inner {
      width: 100%;
    }
    .season-calendar__wrapper {
      width: 100%;
      overflow-x: auto;
      --yohaku-yoko: min((16vw / 3.75), 16px);
      padding: 4px var(--yohaku-yoko) 10px;
    }
    .season-calendar {
      --table-color: #bba27a;
      width: max-content;
      max-width: calc(var(--default-width-pc) + (var(--yohaku-yoko) * 2));
      margin: auto;
      background: #fff;
      border-collapse: collapse;
      -webkit-transform: translateZ(0); /*WebKit（Safariのレンダリングエンジン）のレンダリングバグ解消用*/
      line-height: 1;
      .season-calendar__title {
        background: var(--default-color-brown);
        color: #fff;
        .season-calendar__title--name, .season-calendar__title--month {
          font-weight: normal;
          padding: .7em 0 .75em;
        }
        .season-calendar__title--name {
          width: min((190vw / 3.75), 300px);
        }
        .season-calendar__title--month {
          width: min((41vw / 3.75), 68px);
          border-left: 1px solid;
          .season-calendar__title--month--num {
            font-size: min((14vw / 3.75), 20px);
          }
          .season-calendar__title--month--jp {
            font-size: min((12vw / 3.75), 16px);
          }
        }
      }
      .season-calendar__item {
        --table-border: 1px dashed #E0D2B2;
        border: var(--table-border);
        background: #F8F7F4;
        .season-calendar__item--inner:not(:first-child) {
          border-top: var(--table-border);
        }
        .season-calendar__item--name {
          font-size: min((14vw / 3.75), 18px);
          padding: min((10vw / 3.75), 14.5px) min((8vw / 3.75), 15px);
          border-right: var(--table-border);
          color: #917944;
          background: var(--default-color-brown-light);
          .season-calendar__item--name--sub {
            font-size: min((12vw / 3.75), 12px);
          }
        }
        .season-calendar__item--month {
          &:not(:last-child) {
            border-right: var(--table-border);
          }
          &.is-active {
            background: var(--main-color);
          }
        }
      }
    }
    .season-detail {
      width: var(--default-width);
      margin: min((26vw / 3.75), 63px) auto 0;
      display: grid;
      line-height: var(--default-font-lh);
      .is-sp & {
        gap: min((19vw / 3.75), 19px);
      }
      .is-pc & {
        grid-template-columns: repeat(2, 1fr);
        gap: min((48vw / 3.75), 48px) calc((80 / var(--default-width-pc-val)) * 100%);
        .season-detail__item {
          display: grid;
          grid-template-rows: subgrid;
          grid-row: span 2;
          gap: 0;
          .season-detail__item--title {
            align-content: center;
          }
        }
      }
      .season-detail__item--title {
        font-size: min((20vw / 3.75), 24px);
        line-height: 2;
        color: var(--sub-color1);
        border-bottom: 1px solid;
        margin-bottom: min((16vw / 3.75), 16px);
        .is-num {
          font-size: min((30vw / 3.75), 34px);
        }
      }
    }
  }
}
/*is-page-ranking*/
.is-page-ranking {
  .area-lineup {
    .area-lineup__item {
      .is-sp & {
        grid-template-areas:
          "ranking"
          "photo"
          "main"
          "kazari";
        .area-lineup__item--ranking {
          grid-area: ranking;
          justify-content: center;
          margin-bottom: min((12vw / 3.75), 12px);
        }
      }
      .is-pc & {
        .area-lineup__item--title {
          position: relative;
          .area-lineup__item--ranking {
            position: absolute;
            bottom: 11px;
            right: 15px;
          }
        }
      }
    }
    .area-lineup__item--ranking {
      display: flex;
      align-items: end;
      color: var(--sub-color1);
      line-height: 1;
      font-weight: 400;
      .area-lineup__item--ranking--icon {
        width: min((45vw / 3.75), 45px);
        height: min((47vw / 3.75), 47px);
        object-fit: contain;
      }
      .area-lineup__item--ranking--text {
        .ie-en {
          font-family: var(--default-ff-en);
          font-size: min((28vw / 3.75), 28px);
        }
        .ie-num {
          font-family: var(--default-ff-num);
          font-size: min((80vw / 3.75), 80px);
          line-height: .5;
        }
      }
    }
  }
}
/*is-page-budget*/
.is-page-budget {
  .budget-lineup {
    --sec-ttl-mb: 0;
    --sec-ttl-gap: min((31vw / 3.75), 31px);
    .section-title__en--icons {
      display: flex;
      justify-content: center;
      gap: min((24vw / 3.75), 24px);
      .section-title__en--icon {
        width: min((63vw / 3.75), 63px);
        height: min((61vw / 3.75), 61px);
        object-fit: contain;
      }
    }
    .section-title__jp {
      font-size: min((20vw / 3.75), 24px);
    }
    .budget-lineup__item:not(:first-child) {
      margin-top: min((120vw / 3.75), 150px);
    }
    .budget-lineup__item--detail {
      display: grid;
      justify-content: center;
      margin-bottom: min((56vw / 3.75), 80px);
      &::before {
        content: "";
        width: min((28vw / 3.75), 28px);
        height: min((24vw / 3.75), 24px);
        background: var(--default-color-brown-light);
        clip-path: polygon(50% 0, 100% 100%, 0 100%);
        margin: auto;
      }
      .budget-lineup__item--detail--texts {
        max-width: 860px;
        background: var(--default-color-brown-light);
        font-size: min((14vw / 3.75), 18px);
        line-height: 1.5;
        color: #94825B;
        border-radius: min((8vw / 3.75), 8px);
        padding: min((12vw / 3.75), 16px) min((16vw / 3.75), 20px);
        margin-top: max((-8vw / 3.75), -8px);
      }
    }
    .area-lineup {
      .is-pc & {
        --item-gap: 47px
      }
    }
  }
  #teach_point {
    --sec-pt: min((100vw / 3.75), 210px);
    .is-sp & {
      padding-bottom: 0;
      .section__inner {
        width: 100%;
      }
    }
    .teach-point {
      --kazari-size-w: min((131vw / 3.75), 214px);
      background: #ECE5D2;
      padding: min((32.48vw / 3.75), 32.48px) min((18vw / 3.75), 18px) min((26vw / 3.75), 26px);
      position: relative;
      .is-pc & {
        padding: 29.75px 24px 12.25px;
      }
      .teach-point__title {
        color: var(--default-color-brown-dark);
        font-size: min((24vw / 3.75), 28px);
        line-height: 1.3;
        width: calc(100% - var(--kazari-size-w));
        margin-bottom: min((24vw / 3.75), 30px);
        .is-pc & {
          width: calc(100% - (var(--kazari-size-w) * 2));
          text-align: center;
          margin-left: auto;
          margin-right: auto;
        }
      }
      .teach-point__list {
        display: grid;
        gap: min((24vw / 3.75), 24px) 18px;
        .is-pc & {
          grid-template-columns: repeat(3, 1fr);
          align-items: start;
          --dan-yohaku: 32px;
          .teach-point__list--item {
            &:nth-child(2) {
              margin-top: var(--dan-yohaku);
            }
            &:nth-child(3) {
              margin-top: calc(var(--dan-yohaku) * 2);
            }
          }
        }
        .teach-point__list--item {
          position: relative;
          background: #fff;
          border: 1px solid var(--default-color-brown);
          border-radius: min((8vw / 3.75), 8px);
          padding: min((14vw / 3.75), 20px) min((16vw / 3.75), 24px);
        }
        .teach-point__list--item--title {
          color: var(--sub-color1);
          font-size: min((20vw / 3.75), 24px);
          line-height: calc(28 / 24);
          margin-bottom: min((8vw / 3.75), 8px);
          .is-sp & {
            display: flex;
            gap: min((16vw / 3.75), 16px);
          }
        }
        .teach-point__list--item--title--num {
          font-family: var(--default-ff-num);
          line-height: .5;
          font-size: min((56vw / 3.75), 70px);
          font-weight: 400;
          color: var(--main-color);
          .is-pc & {
            color: var(--default-color-brown);
            position: absolute;
            top: 0;
            left: .25em;
            translate: 0 -100%;
          }
        }
      }
    }
  }
}
.is-pc .teach-point__list--item:last-child, .is-sp .teach-point__list--item:first-child {
  &::before {
    content: "";
    display: block;
    background: url("../images/budget/point_kazari.png") no-repeat 0 0/ contain;
    width: var(--kazari-size-w);
    height: min((137vw / 3.75), 219px);
    position: absolute;
    top: 0;
    right: 0;
    translate: 0 calc(-100% - 1px);
  }
}
/*is-page-impresso*/
.is-page-impresso {
  #mv {
    position: relative;
    --logo-size: min((115vw / 3.75), 165.75px);
    .is-pc & {
      --logo-size: 221px;
    }
    &::before {
      content: "";
      width: var(--default-width2);
      height: 100%;
      display: block;
      position: absolute;
      top: 0;
      left: 50%;
      translate: -50% 0;
      background: url("../images/impresso/logo.webp") no-repeat right min((10vw / 3.75), 10px) bottom min((9vw / 3.75), 20px) / var(--logo-size);
      z-index: 1;
    }
  }
}
/*------------------------------------------------*/
/*★ ＝＝ footerArea ＝＝ ★*/
#page-fnav {
  background: url("../images/fnav_bg.webp") no-repeat center center / cover;
  min-height: min((430vw / 3.75), 610px);
  padding: min((40vw / 3.75), 60px) 0;
  color: #fff;
  text-align: center;
  .page-fnav__title {
    font-size: min((16vw / 3.75), 24px);
    line-height: 2;
    margin-bottom: min((4vw / 3.75), 12px);
    &:not(:first-child) {
      margin-top: min((40vw / 3.75), 40px);
    }
  }
  .page-fnav__content {
    --gap: min((16vw / 3.75), 24px);
    overflow-x: auto;
    padding: 4px var(--gap) 10px;
  }
  .page-fnav__lineup {
    width: max-content;
    max-width: calc(var(--default-width-pc) + (var(--gap) * 2));
    margin: auto;
    display: flex;
    gap: var(--gap);
    .page-fnav__lineup--item--link {
      width: min((88vw / 3.75), 160px);
      display: grid;
      justify-items: center;
      gap: min((6vw / 3.75), 8px);
      color: inherit;
      font-size: min((12vw / 3.75), 14px);
      line-height: var(--lh, calc(14 / 10));
      .is-pc & {
        --lh: calc(22 / 14);
      }
    }
    .page-fnav__lineup--item--icon {
      order: -1;
      border-radius: 100%;
      overflow: hidden;
      --size: min((88vw / 3.75), 120px);
      width: var(--size);
      height: var(--size);
      gap: min((6vw / 3.75), 8px);
      outline: 1px solid #fff;
    }
  }
}
/*------------------------------------------------*/
/*★ ＝＝ hover ＝＝ ★*/
@media (hover : hover) and (pointer : fine) {
  .page-fnav__lineup--item--link {
    .page-fnav__lineup--item--icon--image {
      scale: var(--scale, 1);
      transition: var(--default-hover-transition-scale);
    }
    &:hover {
      --scale: 1.175;
    }
  }