@charset "UTF-8";
:root {
  --base-value: 750;
  --base-value02: 1400;
}

html {
  scrollbar-gutter: stable;
}

body {
  margin: 0;
}

.pc {
  display: block;
}

img {
  /* image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.l-container {
  padding-bottom: 30px;
  width: 100%;
}

.sp-footer {
  margin-top: 0;
}

/* =========================================================
   ▼ 全体レイアウト（左右2カラムスプリット構造）
========================================================= */
.l-container #feature {
  width: auto;
  padding: 0;
  margin: 0 auto;
  max-width: 100%;
  text-align: center;
  overflow: clip;
  font-family: "Yu Gothic", "游ゴシック", "YuGothic", "游ゴシック体", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN", sans-serif;
  font-weight: 400;
  font-style: normal;
  color: #555;
  font-feature-settings: "palt";
  background-color: #fef2e8;
  display: flex;
}

.l-container #feature > .hero.pc {
  min-width: 50%;
  width: 50%;
  margin-bottom: 0;
  position: sticky;
  height: calc(100dvh - 80px);
  left: 0;
  top: 80px;
  z-index: 2;
}

/* 👇 ✨変更：hero__inner と、h1タグである hero__img の両方に height: 100% を適用 */
.l-container #feature > .hero.pc .hero__inner,
.l-container #feature > .hero.pc .hero__img {
  height: 100%;
  margin: 0;
}

.l-container #feature > .hero.pc .hero__inner img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  object-position: top;
}

.l-container #feature > .hero.pc .hero_txt {
  width: calc(100% - 130px);
  max-width: 729px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 315px;
}

/* 右側：スクロールするコンテンツの外枠 */
.feature__sub-wrap {
  width: 50%;
  background-color: #fef2e8;
}

.feature__sub-wrap-body {
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  padding: 0 20px;

}

/* =========================================================
   ▼ 共通基本ルール
========================================================= */
.l-container #feature a {
  display: block;
}

.l-container #feature img {
  width: 100%;
  height: auto;
  display: block;
  /* image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

.l-container #feature picture {
  display: block;
}

/* =========================================================
   ▼ クレジット（商品詳細リンク）のPC用固定配置
========================================================= */
.l-container #feature .default-credit {
  width: 100%;
  font-size: 12.8px;
  letter-spacing: 0.05em;
  line-height: 1.25;
  margin-top: 10px;
  text-align: left;
  position: absolute;
  left: 50%;
  bottom: -22.4px;
  transform: translate(-50%, 100%);
  z-index: 2;
}

.l-container #feature .default-credit .credit {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-start;
  gap: 10.24px 12.8px;
}

.l-container #feature .default-credit li a {
  font-family: "haboro-condensed", serif;
  font-weight: 400;
  font-style: normal;
  text-decoration: none;
  width: fit-content;
  color: #777;
  font-size: 14.08px;
  position: relative;
  white-space: nowrap;
}

.l-container #feature .default-credit li a::after {
  content: "";
  width: 100%;
  left: 0;
  right: 0;
  bottom: -1px;
  position: absolute;
  height: 1px;
  display: block;
  background-color: #777;
}

/* =========================================================
   ▼ ボタン・共通装飾
========================================================= */
.l-container #feature .feature__btn {
  width: 100%;
  max-width: 256px;
  padding-top: 76.8px;
  margin: 0 auto 0;
}

.l-container #feature .feature__btns {
  width: 100%;
  max-width: 358.4px;
  margin: 76.8px auto 0;
  display: flex;
  flex-direction: column;
  gap: 14.08px 6.4px;
}

.l-container #feature .feature__logo {
  width: 100%;
  max-width: 248.32px;
  margin: 76.8px auto 0;
}

.l-container #feature .feature-btn {
  width: 100%;
  max-width: 268.8px;
  margin: 130.56px auto 0;
}

.l-container #feature .bg-circle {
  position: absolute;
  z-index: 1;
  pointer-events: none;
}

.l-container #feature .bg-circle::before {
  content: "";
  display: block;
  width: 640px;
  height: 640px;
  position: relative;
  background: url(../img/bg_circle.svg) no-repeat center center/contain;
  mix-blend-mode: multiply;
}

.l-container #feature .hero {
  position: relative;
  width: 100%;
  margin-bottom: 0;
  background-color: #fef2e8;
}

.l-container #feature .default-mini-btn {
  max-width: 83.84px;
  margin: -139.52px 0 0 auto;
}

/* =========================================================
   ▼ スライダー・動画ブロックの可変（レスポンシブ）対応
========================================================= */
.l-container #feature .slideFig {
  position: relative;
  margin: 0 auto 0;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 3;
}

/* 各要素の横幅を max-width に変更し、固定の height は一括削除 */
.l-container #feature .slideFig.-item01-02 { max-width: 384px; }
.l-container #feature .slideFig.-item03-04 { max-width: 384px; }
.l-container #feature .slideFig.-item17-18 { max-width: 428.8px; }
.l-container #feature .slideFig.-item25-26 { max-width: 412.8px; }
.l-container #feature .slideFig.-item28-29 { max-width: 480px; }
.l-container #feature .slideFig.-item31-32 { max-width: 435.2px; }
.l-container #feature .slideFig.-item37-38 { max-width: 384px; }
.l-container #feature .slideFig.-item40-41 { max-width: 384px; }
.l-container #feature .slideFig.-item43-44 { max-width: 398.08px; }
.l-container #feature .slideFig.-item49-50 { max-width: 415.4px; aspect-ratio: 415.4 / 681.6; } /* 個別最適比率 */
.l-container #feature .slideFig.-item57-58 { max-width: 421.12px; }
.l-container #feature .slideFig.-item60-61 { max-width: 421.12px; }
.l-container #feature .slideFig.-item64-65 { max-width: 384px; }

.l-container #feature .default-video-play-toggle {
  border: 0;
  background: none;
  position: absolute;
  top: 15.36px;
  right: 14.08px;
  z-index: 3;
}

.l-container #feature .default-video-play-toggle .default-img.-sound-off,
.l-container #feature .default-video-play-toggle .default-img.-sound-on {
  width: auto;
  height: 12.16px;
}

.l-container #feature .default-video-play-toggle .default-img.-sound-off { display: block; }
.l-container #feature .default-video-play-toggle .default-img.-sound-on { display: none; }
.l-container #feature .default-video-play-toggle.is-sound-active .default-img.-sound-off { display: none; }
.l-container #feature .default-video-play-toggle.is-sound-active .default-img.-sound-on { display: block; }

.l-container #feature .default-video-body {
  overflow: hidden;
  position: relative;
  z-index: 2;
}

.l-container #feature .default-video {
  margin: 0 auto 0;
  position: relative;
  z-index: 2;
  width: 100%;
  height: auto;
  aspect-ratio: 9 / 16;
}

.l-container #feature .default-video video {
  display: block;
  width: 100%;
  height: auto;
}

/* 各動画の横幅を max-width に変更し、固定の height は一括削除 */
.l-container #feature .default-video.-video01 { max-width: 380.16px; margin-top: 25.6px; margin-right: 0; }
.l-container #feature .default-video.-video02 { max-width: 345.6px; margin-top: 25.6px; margin-left: 0; }
.l-container #feature .default-video.-video03 { max-width: 345.6px; margin-top: 25.6px; margin-left: 0; }
.l-container #feature .default-video.-video04 { max-width: 375.04px; margin-top: 64px; margin-left: 0; }
.l-container #feature .default-video.-video05 { max-width: 345.6px; margin-top: 64px; }
.l-container #feature .default-video.-video06 { max-width: 345.6px; margin-top: 199.68px; margin-right: 0; }

/* =========================================================
   ▼ アイテム個別配置・余白コントロール
========================================================= */
.l-container #feature .default-fig {
  width: 100%;
  margin: 0 auto 0;
  position: relative;
}

.l-container #feature .default-fig.-item00 { max-width: 440.32px; margin-top: 12.16px; }
.l-container #feature .-item01-02 { max-width: 384px; margin-top: 28.8px; margin-left: 46.72px; }
.l-container #feature .-item03-04 { max-width: 384px; margin-top: 194.56px; margin-left: 20.48px; }
.l-container #feature .default-fig.-item05 {
  max-width: 480px;
  margin-top: 52.48px;
}
.l-container #feature .default-fig.-item06 { max-width: 430.08px; margin-top: 195.2px; margin-left: 24.32px; }
.l-container #feature .default-fig.-item07 { max-width: 480px; margin-top: 24.96px; }
.l-container #feature .default-fig.-item08 { max-width: 331.52px; margin-top: 38.4px; }
.l-container #feature .default-fig.-item09 { max-width: 403.2px; margin-top: 197.12px; margin-left: 0; }
.l-container #feature .default-fig.-item10 { max-width: 352px; margin-top: 12.8px; margin-left: 127.36px; }
.l-container #feature .default-fig.-item11 { 
  max-width: 100%;
}
.l-container #feature .default-fig.-item12 { max-width: 273.92px; margin-top: 129.28px; margin-left: 20.48px; }
.l-container #feature .default-fig.-item13 { max-width: 100%; margin-top: 195.84px; }

.l-container #feature .-item13_text {
  position: absolute;
  top: -72.84px;
  left: -5.12px;
  width: 103%;
}

.l-container #feature .default-fig.-item14 { max-width: 371.2px; margin-top: 51.2px; }
.l-container #feature .default-fig.-item15 { max-width: 371.2px; margin-top: 12.8px; }
.l-container #feature .default-fig.-item16 { max-width: 307.2px; margin-top: 195.84px; margin-left: 172.16px; }
.l-container #feature .-item17-18 { max-width: 428.8px; margin-top: 165.76px; margin-left: 0; }
.l-container #feature .default-fig.-item19 { max-width: 372.48px; margin-top: 25.6px; margin-left: 108.8px; }
.l-container #feature .default-fig.-item20 { max-width: 100%; margin-top: 223.36px; }
.l-container #feature .default-fig.-item21 { max-width: 416px; margin-top: 49.92px; margin-left: 64px; }
.l-container #feature .default-fig.-item22 { max-width: 384px; margin-top: 14.08px; margin-left: 0; }
.l-container #feature .default-fig.-item23 { max-width: 397.44px; margin-top: 193.92px; }
.l-container #feature .default-fig.-item24 { max-width: 371.84px; margin-top: 25.6px; margin-left: 108.16px; }
.l-container #feature .-item25-26 { max-width: 412.8px; margin-top: 26.88px; }
.l-container #feature .default-fig.-item27 { max-width: 417.28px; margin-top: 225.92px; margin-left: 63.36px; }
.l-container #feature .-item28-29 {
  max-width: 100%;
}
.l-container #feature .default-fig.-item30 { max-width: 384px; margin-top: 193.28px; margin-left: 19.2px; }
.l-container #feature .-item31-32 { max-width: 435.2px; margin-top: 25.6px; margin-left: 44.8px; }
.l-container #feature .default-fig.-item33 { max-width: 440.96px; margin-top: 195.84px; margin-left: 0; }
.l-container #feature .default-fig.-item34 { max-width: 440.96px; margin-top: 12.8px; margin-left: 0; }
.l-container #feature .default-fig.-item35 { max-width: 416.64px; margin-top: 38.4px; margin-left: 63.36px; }
.l-container #feature .default-fig.-item36 { max-width: 448px; margin-top: 195.84px; }
.l-container #feature .-item37-38 {
  max-width: 384px;
  margin-top: 25.6px;
}
.l-container #feature .default-fig.-item39 { max-width: 100%; margin-top: 196.48px; }
.l-container #feature .-item40-41 { max-width: 384px; margin-top: 51.84px; margin-right: 77.44px; }
.l-container #feature .default-fig.-item42 { max-width: 424.32px; margin-top: 23.04px; margin-left: 56.32px; }
.l-container #feature .-item43-44 { max-width: 398.08px; margin-top: 49.92px; }
.l-container #feature .default-fig.-item45 { max-width: 371.84px; margin-top: 195.2px; margin-right: 117.12px; }

.l-container #feature .-item45_text {
  position: absolute;
  top: 3.96px;
  right: -84.8px;
  width: 17.7%;
}

.l-container #feature .default-fig.-item46 { max-width: 410.24px; margin-top: 25.6px; }
.l-container #feature .default-fig.-item47 {
  max-width: 100%;
}
.l-container #feature .default-fig.-item48 { max-width: 267.52px; margin-top: 222.72px; }
.l-container #feature .-item49-50 { max-width: 454.4px; margin-top: 168.32px; margin-left: -18.16px; }
.l-container #feature .default-fig.-item51 { max-width: 100%; margin-top: 35.84px; }
.l-container #feature .default-fig.-item52 { max-width: 384px; margin-top: 198.4px; }
.l-container #feature .default-fig.-item53 { max-width: 384px; margin-top: 12.8px; }
.l-container #feature .default-fig.-item54 { max-width: 358.4px; margin-top: 37.12px; margin-left: 0; }
.l-container #feature .default-fig.-item55 {
  max-width: 320px;
  margin-top: 192px;
  margin-right: 0;
}
.l-container #feature .default-fig.-item56 { max-width: 345.6px; margin-top: 169.6px; }
.l-container #feature .-item57-58 { max-width: 421.12px; margin-top: 24.32px; }
.l-container #feature .default-fig.-item59 { max-width: 326.4px; margin-top: 199.68px; margin-right: 0; }
.l-container #feature .-item60-61 { max-width: 421.12px; margin-top: 25.6px; margin-left: 0; }
.l-container #feature .default-fig.-item62 { max-width: 371.84px; margin-top: 197.12px; margin-right: 0; }
.l-container #feature .default-fig.-item63 { max-width: 371.2px; margin-top: 14.08px; margin-right: 0; }
.l-container #feature .-item64-65 { max-width: 384px; margin-top: 53.76px; }

/* =========================================================
   ▼ クレジット余白のピクセル個別変換（最新SP完全同期版）
========================================================= */
.l-container #feature .-credit01 { width: 109%; }
.l-container #feature .-credit01 .credit .item:nth-of-type(1) { margin-left: 104.32px; }
.l-container #feature .-credit01 .credit .item:nth-of-type(3) { margin-left: 6.4px; }

.l-container #feature .-credit02 .credit .item:nth-of-type(1) { margin-left: 64px; }
.l-container #feature .-credit02 .credit .item:nth-of-type(4) { margin-left: 51.84px; }

.l-container #feature .-credit03 .credit .item:nth-of-type(1) { margin-left: 97.28px; margin-right: 96px; }
.l-container #feature .-credit03 .credit .item:nth-of-type(2) { margin-left: 58.88px; }

.l-container #feature .-credit04 .credit .item:nth-of-type(1) { margin-left: 110.08px; }

.l-container #feature .-credit04_2 .credit .item:nth-of-type(1) { margin-left: 173.44px; }

.l-container #feature .-credit05 .credit .item:nth-of-type(1) { margin-left: 27.52px; }
.l-container #feature .-credit05 .credit .item:nth-of-type(3) { margin-left: 21.12px; }

.l-container #feature .-credit07 .credit .item:nth-of-type(1) { margin-left: 171.52px; }
.l-container #feature .-credit07 .credit .item:nth-of-type(3) { margin-left: 173.44px; }

.l-container #feature .-credit08 .credit .item:nth-of-type(1) { margin-left: 79.36px; }
.l-container #feature .-credit08 .credit .item:nth-of-type(3) { margin-left: 119.68px; }
.l-container #feature .-credit08 .credit .item:nth-of-type(4) { margin-left: 60.16px; }

/* .l-container #feature .-credit09 .credit .item:nth-of-type(1) { margin-left: 133.12px; }
.l-container #feature .-credit09 .credit .item:nth-of-type(2) { margin-right: 12.8px; }
.l-container #feature .-credit09 .credit .item:nth-of-type(3) { margin-left: 83.84px; } */

/* =========================================================
   -credit09 を動的かつ綺麗にセンタリングする設定（PC・共通確定版）
========================================================= */

/* 1. 古い固定マージン（133.12px等）やパディングをすべて綺麗にリセット */
.l-container #feature .-credit09 .credit .item {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* 2. クレジット全体の横幅を設定 */
.l-container #feature .-credit09 {
  width: 100% !important;
  max-width: 480px;
  margin: 10px auto 0;
}

/* 3. 親コンテナを行ごと中央寄せにする設定 */
.l-container #feature .-credit09 .credit {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important; /* 2行目を中央寄せにする */
  gap: 10.24px 0 !important;          /* 横の隙間は個別制御するため一旦0にする */
}

/* 4. 1行目（1番目・2番目）を50%ずつにして、中央の境界線に引き寄せる */
.l-container #feature .-credit09 .credit .item:nth-of-type(1) {
  width: 50% !important;
  display: flex !important;
  justify-content: flex-end !important; /* 右寄せにして中央に集める */
  padding-right: 6.4px !important;      /* 中央にできる隙間の半分 */
}

.l-container #feature .-credit09 .credit .item:nth-of-type(2) {
  width: 50% !important;
  display: flex !important;
  justify-content: flex-start !important; /* 左寄せにして中央に集める */
  padding-left: 6.4px !important;       /* 中央にできる隙間の半分 */
}

/* 5. 2行目（3番目以降）は文字幅のまま、アイテム同士の隙間を作って並べる */
.l-container #feature .-credit09 .credit .item:nth-of-type(n + 3) {
  width: auto !important;
  display: block !important;
  margin-left: 15.4px !important;        /* アイテム同士の横の隙間(計12.8px)を作る */
  margin-right: 5.4px !important;
}

.l-container #feature .-credit10 .credit .item:nth-of-type(3) { margin-right: 32px; }

.l-container #feature .-credit12 .credit .item:nth-of-type(1) { margin-left: 61.44px; }
.l-container #feature .-credit12 .credit .item:nth-of-type(2) { margin-right: 27.52px; }
.l-container #feature .-credit12 .credit .item:nth-of-type(3) { margin-left: 137.6px; }

.l-container #feature .-credit13 { width: 109%; }
.l-container #feature .-credit13 .credit .item:nth-of-type(1) { margin-left: 58.88px; }
.l-container #feature .-credit13 .credit .item:nth-of-type(4) { margin-left: 16px; }

.l-container #feature .-credit14 .credit .item:nth-of-type(1) { margin-left: 68.48px; }
.l-container #feature .-credit14 .credit .item:nth-of-type(4) { margin-left: 61.44px; }
.l-container #feature .-credit14 .credit .item:nth-of-type(6) { margin-left: 119.04px; }

.l-container #feature .-credit15 { width: 128%; }

.l-container #feature .-credit16 .credit .item:nth-of-type(1) { margin-left: 192px; margin-right: 21.12px; }
.l-container #feature .-credit16 .credit .item:nth-of-type(2) { margin-left: 40.32px; }

.l-container #feature .-credit17 { width: 104%; }
.l-container #feature .-credit17 .credit .item:nth-of-type(1) { margin-left: 30.08px; }
.l-container #feature .-credit17 .credit .item:nth-of-type(2) { margin-right: 21.12px; }
.l-container #feature .-credit17 .credit .item:nth-of-type(3) { margin-left: 30.72px; }

.l-container #feature .-credit19 .credit .item:nth-of-type(1) { margin-left: 68.48px; }
.l-container #feature .-credit19 .credit .item:nth-of-type(3) { margin-left: 60.16px; }

.l-container #feature .-credit20 .credit .item:nth-of-type(1) { margin-left: 208px; }
.l-container #feature .-credit20 .credit .item:nth-of-type(3) { margin-left: 214.4px; }

.l-container #feature .-credit21 .credit .item:nth-of-type(1) { margin-left: 32px; }
.l-container #feature .-credit21 .credit .item:nth-of-type(4) { margin-left: 137.6px; }

/* =========================================================
   ▼ リード文章（アコーディオン）エリアのPC化
========================================================= */
.l-container #feature .lead-box {
  padding: 124.8px 0 52.48px;
  background-color: #fef2e8;
  position: relative;
}

.l-container #feature .lead-box .bg-circle.-circle01::before {
  content: "";
  display: block;
  width: 480px;
  height: 365.44px;
  position: relative;
  background: url(../img/bg_circle_hero.png) no-repeat center center/contain;
}

.l-container #feature .lead-box-heading img {
  width: 345.6px;
  margin: -32px 0 0 66.56px;
}

.l-container #feature .lead-box--txtWrap {
  padding: 0;
  margin: 39.68px 0 0;
  color: #563e34;
  text-align: center;
  position: relative;
  z-index: 2;
}

.l-container #feature .lead-box--txtWrap > button {
  padding: 20.48px 0;
  margin: 21.76px auto 23.68px;
  display: inline-block;
  font-family: "quasimoda", sans-serif;
  font-weight: 300;
  font-style: normal;
  background: none;
  border: none;
  position: relative;
  font-size: 17.92px;
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(1) {
  display: inline-block;
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(1)::after {
  content: "";
  display: block;
  width: 19.2px;
  height: 16.64px;
  background: url(../img/icon_arrow.svg) no-repeat center center/contain;
  position: absolute;
  bottom: -4.48px;
  left: 50%;
  transform: translateX(-50%);
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(1) > .moreTxt {
  display: inline-block;
  position: relative;
  line-height: 1;
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(1) > .moreTxt img {
  width: 192px;
  margin: -32px 0 -5.12px -0.64px;
}

.l-container #feature .lead-box--txtWrap.is-open > button:nth-of-type(1)::after {
  display: none;
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(2) {
  display: none;
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(2)::after {
  content: "";
  display: block;
  width: 19.2px;
  height: 16.64px;
  background: url(../img/icon_arrow.svg) no-repeat center center/contain;
  position: absolute;
  top: -4.48px;
  bottom: auto;
  left: 50%;
  transform: translateX(-50%) scale(-1.1);
}

.l-container #feature .lead-box--txtWrap > button:nth-of-type(2) > .closeTxt {
  display: inline-block;
  position: relative;
  line-height: 1;
  font-size: 14.72px;
  font-family: "haboro-condensed", serif;
  font-weight: 500;
  font-style: normal;
}

.l-container #feature .lead-box--txtWrap.is-open > button:nth-of-type(2) {
  display: inline-block;
  margin-top: 42.88px;
}

.l-container #feature .lead-box--txt {
  font-family: "source-han-serif-japanese", serif;
  font-weight: 500;
  font-style: normal;
  margin: 0;
  font-size: 15.36px;
  letter-spacing: 0.05em;
  line-height: 2;
}

.l-container #feature .lead-box--img {
  width: 115.2px;
  margin: 24.32px auto 0;
}

.l-container #feature .lead-box--txt + .lead-box--txtSubWrap,
.l-container #feature .lead-box--txt + .lead-box--txt {
  margin-top: 23.04px;
}

.l-container #feature .lead-box--txtSubWrap > .lead-box--txt:nth-of-type(5),
.l-container #feature .lead-box--txtSubWrap > .lead-box--txt:nth-of-type(6) {
  margin-top: 23.04px;
}
.l-container #feature .lead-box--txtSubWrap { display: none; }

/* =========================================================
   ▼ キャンペーン情報・月別リンクのPC化
========================================================= */
.l-container #feature .campaign-box {
  background-color: #fef2e8;
  padding: 0 28.16px 0;
}

.l-container #feature .campaign-box > .innerWrap {
  padding: 26.88px 0 44.8px;
  width: 100%;
  background: #fdfefe;
}

.l-container #feature .campaign-box p {
  padding: 0;
  margin: 0;
}

.l-container #feature .campaign-box .campaign-box-dateTxt {
  font-family: "haboro-condensed", serif;
  font-weight: 500;
  font-style: normal;
  font-size: 25.04px;
  color: #ef8eaa;
  text-align: center;
  line-height: 1.4;
  margin-top: 10px;
}

.l-container #feature .campaign-box .campaign-box-dateTxt > span {
  font-size: 17.408px;
}

.l-container #feature .campaign-box .campaign-box-heading {
  display: block;
  margin: 28.16px auto 0;
  text-align: center;
  font-family: "quasimoda", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 21.76px;
  color: #563e34;
  position: relative;
}

.l-container #feature .campaign-box .campaign-box-heading::before {
  content: "";
  display: block;
  width: 320px;
  height: 1px;
  background: #563e34;
  position: relative;
  margin: 0 auto 0;
}

.l-container #feature .campaign-box .campaign-box-heading > .subTxt {
  display: block;
  font-family: "haboro-condensed", serif;
  font-weight: 400;
  font-style: normal;
  line-height: 1;
  letter-spacing: 0.05em;
  margin-top: 49.92px;
  font-size: 16.64px;
  color: #563e34;
}

.l-container #feature .campaign-box .campaign-box-heading > .mainTxt {
  display: block;
  font-size: 26.88px;
  margin-top: 19.84px;
  line-height: 1;
  letter-spacing: 0.01em;
  font-family: "haboro-condensed", serif;
  font-weight: 500;
  font-style: normal;
  color: #563e34;
}

.l-container #feature .campaign-box .campaign-box-heading > .mainTxt > span {
  letter-spacing: 0.1em;
  font-size: 33.28px;
}

.l-container #feature .campaign-box .campaign-box-txt {
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 15.36px;
  line-height: 2;
  letter-spacing: 0.05em;
}

.l-container #feature .campaign-box .campaign-box-txt:nth-of-type(n + 2) {
  margin-top: 12.8px;
}

.l-container #feature .campaign-box .campaign-box-note {
  margin-top: 25.6px;
  font-family: "dnp-shuei-gothic-gin-std", sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 12.8px;
  color: #563e34;
  line-height: 1.95;
}

.l-container #feature .campaign-box .campaign-box-txtWrap {
  margin-top: 32px;
  color: #563e34;
}

.l-container #feature .delivery-date-box {
  padding: 66.56px 0 118.4px;
  background-color: #fef2e8;
}

.l-container #feature .delivery-date-box--heading {
  font-family: "cabrito-didone-condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin: 0 auto 0;
  font-size: 44.8px;
  line-height: 1;
  color: #563e34;
}

.l-container #feature .delivery-date-box--lead {
  margin: 15.36px auto 0;
  font-family: "source-han-serif-japanese", serif;
  font-weight: 500;
  font-style: normal;
  color: #563e34;
  font-size: 15.36px;
  line-height: 1;
}

.l-container #feature .delivery-date-box--txtWrap {
  margin: 40.32px auto 0;
  font-family: "quasimoda", sans-serif;
  font-weight: 400;
  font-style: normal;
  display: flex;
  justify-content: center;
  gap: 12.8px 30.08px;
}

.l-container #feature .delivery-date-box--txtWrap > a {
  width: 51.2px;
  font-size: 17.92px;
  color: #563e34;
  position: relative;
  font-family: "haboro-condensed", serif;
  font-weight: 400;
  font-style: normal;
  text-decoration: none;
}

/* =========================================================
   ▼ その他の共通モジュール
========================================================= */
.l-container #feature .desc-box { padding: 0; margin: 43.52px 0 0; font-family: "jaf-bernina-sans", sans-serif; }
.l-container #feature .desc-box__heading { font-size: 20.48px; letter-spacing: 0.12em; font-weight: 500; }
.l-container #feature .desc-box__color-info > dt { font-size: 14.08px; letter-spacing: 0.12em; position: relative; }
.l-container #feature .desc-box__color-info > dd { font-size: 15.36px; letter-spacing: 0.12em; margin-top: 12.8px; }
.l-container #feature .desc-box__color-info__new { margin-top: 30.08px; color: #aa5a50; }
.l-container #feature .desc-box__color-info__new > dt::after { content: ""; display: block; width: 103.68px; height: 1px; background: #aa5a50; left: 0; right: 0; bottom: 0; margin: 0 auto; }
.l-container #feature .desc-box__color-info__basic { margin-top: 19.2px; }
.l-container #feature .desc-box__color-info__basic > dt::after { content: ""; display: block; width: 103.68px; height: 1px; background: #555; left: 0; right: 0; bottom: 0; margin: 0 auto; }
.l-container #feature .desc-box__size-info { margin-top: 20.48px; font-size: 15.36px; letter-spacing: 0.08em; }
.l-container #feature .desc-box__price { margin-top: 9.6px; font-size: 15.36px; letter-spacing: 0.1em; }
.l-container #feature .item-box__txt { max-width: 422.4px; margin: 30.72px auto 0; font-size: 15.36px; font-weight: 500; color: #555; text-align: justify; line-height: 2; letter-spacing: 0.05em; }
.l-container #feature .item-box__txt.-item01 { margin-top: 26.24px; }
.l-container #feature .item-box:nth-of-type(n + 2) { margin-top: 94.08px; }
.l-container #feature .item-box.-item02 { margin-top: 93.44px; }
.l-container #feature .item-box.-item04 { margin-top: 64px; }

/* =========================================================
   ▼ GSAPスタッキング（スクロール連動・重なり制御）のPC化
========================================================= */
#feature section.sec1,
#feature section.sec2,
#feature section.sec3,
#feature section.sec4 {
  position: sticky;
  z-index: 10;
  background-color: #fef2e8;
  overflow: hidden;
}

#feature section.sec1 {
  top: calc(var(--sticky-top-sec1) + 100dvh);
  padding: 0 0 25.6px;
}

#feature section.sec1 .slideFigWrap { position: relative; }
#feature section.sec1 .slideFig { z-index: 2; }
#feature section.sec1 .bg-circle.-circle01 { top: -275.2px; left: -240px; }
#feature section.sec1 .bg-circle.-circle01::before { background-image: url(../img/bg_circle_01.png); }
#feature section.sec1 .bg-circle.-circle02 { bottom: -275.2px; right: -240px; z-index: 1; }
#feature section.sec1 .bg-circle.-circle02::before { background-image: url(../img/bg_circle_02.png); }

#feature section.sec2 {
  padding-bottom: 25.6px;
  top: calc(var(--sticky-top-sec2) + 100dvh);
}
#feature section.sec2 .heading-box.-heading01 { margin-top: 60.16px; white-space: nowrap; }
#feature section.sec2 .heading-box > .headingTxt { font-size: 38.4px; font-family: "presti-display", serif; color: #335999; line-height: 1; margin: 0 auto 0; letter-spacing: 0.025em; }
#feature section.sec2 .heading-box > .itemWrap { padding: 0 41.6px 0; display: flex; align-items: center; justify-content: space-between; gap: 25.6px; margin-top: 14.08px; }
#feature section.sec2 .heading-box > .itemWrap > .hb-item { width: 51.2px; }
#feature section.sec2 .heading-box > .itemWrap > .hb-item.-snidel { width: 48.64px; }
#feature section.sec2 .heading-box > .itemWrap > .hb-item.-year { top: 1.92px; position: relative; margin-left: 30.08px; width: 58.24px; }
#feature section.sec2 .heading-box > .itemWrap > .hb-item.-breeze { width: 78.08px; }

#feature section.sec3 {
  padding: 0 0 25.6px;
  top: calc(var(--sticky-top-sec3) + 100vh);
}

#feature section.sec4 {
  padding-bottom: 64px;
  top: calc(var(--sticky-top-sec4) + 100dvh);
}

/* =========================================================
   ▼ その他のシステムパーツ
========================================================= */
.feature-wave-txt { overflow: hidden; white-space: nowrap; }
.feature-wave-txt__txt { display: inline-block; white-space: nowrap; }
.feature-wave-txt__txt-inner { display: inline-block; white-space: nowrap; }

html, body { width: 100%; height: auto; }
html { font-size: 62.5%; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; height: -webkit-fill-available; }
body { color: #000; font-family: "century-old-style-std", serif; font-size: 1rem; line-height: 1.5rem; -webkit-text-size-adjust: 100%; height: 100%; min-height: 100vh; min-height: -webkit-fill-available; left: 0px; top: 0px; }
body.loaded { position: static; overflow: scroll; }
body.looking { overflow: hidden; }
body.looking .sec { pointer-events: none; }

.l-container #feature .js-anime.-fade01 { opacity: 0; transition: 0.8s ease-in-out 0.3s; }
.l-container #feature .js-anime.-fade01.is-animete-active { opacity: 1; }
.l-container #feature .js-anime.-fadeToUp { opacity: 0; transition: 0.8s ease-in-out 0.3s; transform: translateY(40px); }
.l-container #feature .js-anime.-fadeToUp.is-animete-active { transform: translateY(0); opacity: 1; }


.l-container #feature .fadeUp-hidden {
  opacity: 0;
  transform: translateY(40px);
  transition: 0.8s ease-in-out 0.3s;
}
.l-container #feature .animate-active {
  opacity: 1;
  transform: translateY(0);
}

/* ▼ PC版でJSの判定を強制的に発火させるための透明トリガー設定 */
@media screen and (min-width: 769px) {
  .l-container #feature .js-anime.-fadeToUp {
    position: relative;
  }
  
  .l-container #feature .js-anime.-fadeToUp::before {
    content: "";
    display: block;
    position: absolute;
    top: -80vh;
    left: 0;
    width: 100%;
    height: 80vh;
    pointer-events: none;
    z-index: -1;
  }
}

@media screen and (min-width: 769px) {
  .l-container #feature .js-anime.-fadeToUp {
    transform: translateY(80px);
    transition: all 0.8s ease-in-out 1.0s;
  }
}