/* =========================================================
   LIFIX GYM 秋のボディメイクキャンペーン LP
   スマホファースト：メディアクエリなし＝スマホ（1024px以下。タブレットも含む）
   @media (min-width:1025px)＝PC。メディアクエリはこの2つだけ。
   単位：スマホは vw（基準幅375px。vw＝px÷375×100）、PCは px。
   スマホ側の各値の後ろのコメントは、基準幅375pxでの元のpx。
   文字サイズ：スマホ 13/16/18/24/48px（をvw換算）、PC 14/18/20/32/56px。PCの中身の幅は最大1200px。
   ========================================================= */
:root{
  --orange:#B4501C;
  --orange-light:#F6B27A;
  --cream:#F7F1E8;
  --cream-2:#EFE3D3;
  --line:#E6D9C7;
  --brown:#2B1D16;
  --text:#2B1D16;
  --text-2:#4A3A30;
  --text-3:#6B5A4E;
  --accent-pale:#FFE1B0;
  --green:#06873F;
  --white:#FFFFFF;
  --col:100vw;
  --bar-h:20.5vw; /* 77px */
  --vh:100vh;
  --f-round:"Zen Maru Gothic","Hiragino Maru Gothic ProN",sans-serif;
  --f-num:"Montserrat",sans-serif;
  --f-base:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Noto Sans CJK JP",Meiryo,sans-serif;
  --outline-2:0.534vw 0 0 #fff,-0.534vw 0 0 #fff,0 0.534vw 0 #fff,0 -0.534vw 0 #fff,0.534vw 0.534vw 0 #fff,-0.534vw 0.534vw 0 #fff,0.534vw -0.534vw 0 #fff,-0.534vw -0.534vw 0 #fff; /* 2px 0 0 #fff,-2px 0 0 #fff,0 2px 0 #fff,0 -2px 0 #fff,2px 2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff */
  --outline-3:0.8vw 0 0 #fff,-0.8vw 0 0 #fff,0 0.8vw 0 #fff,0 -0.8vw 0 #fff,0.534vw 0.534vw 0 #fff,-0.534vw 0.534vw 0 #fff,0.534vw -0.534vw 0 #fff,-0.534vw -0.534vw 0 #fff; /* 3px 0 0 #fff,-3px 0 0 #fff,0 3px 0 #fff,0 -3px 0 #fff,2px 2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff */
}
@supports (height:100svh){
  :root{
    --vh:100svh;
  }
}
*,
*::before,
*::after{
  box-sizing:border-box;
}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth; /* JSが動かないときの保険。ページ内リンクの移動は main.js の setupSmoothScroll が行う */
}
/* 日本語組版の調整：禁則処理・行間・見出しの約物詰め・改行させない語 */
body{
  margin:0;
  font-family:var(--f-base);
  color:var(--text);
  background:#1F1611;
  -webkit-font-smoothing:antialiased;
  line-height:1.7;
  line-break:strict;
  text-wrap:pretty;       /* 最後の行が1〜2文字だけになるのを防ぐ（対応ブラウザのみ） */
}
img{
  max-width:100%;
  display:block;
}
a{
  color:inherit;
}
h1,
h2,
h3,
p,
ul,
ol,
dl,
dd,
figure,
blockquote{
  margin:0;
  padding:0;
}
ul,
ol{
  list-style:none;
}
em{
  font-style:normal;
}
.visually-hidden{
  position:absolute!important;
  width:0.267vw; /* 1px */
  height:0.267vw; /* 1px */
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
}
.page{
  position:relative;
  width:100%;
  margin:0 auto;
  background:var(--cream);
  padding-bottom:var(--bar-h);
  overflow:clip;
}
/* =============================== FV =============================== */
.fv{
  position:sticky;
  top:0;
  z-index:0;
  height:var(--vh);
  min-height:149.3vw; /* 560px */
  overflow:hidden;
  background:var(--cream);
}
/* FV：秋の写真（人物は元写真のまま、背景・もみじ・光を合成）。写真の中で位置合わせ済みなので、上端から敷き詰める */
.fv__photo{
  position:absolute;
  left:0;
  width:100%;
  top:0;
  height:100%;
  object-fit:cover;
  object-position:center top;
}
.fv__shade-top{
  position:absolute;
  inset:0 0 auto;
  height:32vw; /* 120px */
  background:linear-gradient(180deg,rgba(43,29,22,.72) 0%,rgba(43,29,22,.35) 55%,rgba(43,29,22,0) 100%);
}
.fv__shade-bottom{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:calc(var(--vh) * .64);
  background:linear-gradient(180deg,rgba(247,241,232,0) 0%,rgba(247,241,232,.85) 32%,var(--cream) 48%);
  display:none;
}
.fv__header{
  position:absolute;
  inset:0 0 auto;
  height:13.8vw; /* 52px */
  padding:0 4.2vw; /* 0 16px */
  display:flex;
  align-items:center;
}
.fv__logo img{
  height:10.6vw; /* 40px */
  width:auto;
}
.fv__body{
  position:absolute;
  left:0;
  right:0;
  bottom:calc(var(--bar-h) + 5vw); /* calc(var(--bar-h) + 19px) */
  padding:0 4vw; /* 0 15px（タイトル画像を幅いっぱいの345pxで見せ、小さい文字も読めるように） */
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3.7vw; /* 14px */
}
/* タイトル（画像。締切スタンプ・吹き出し・見出し・帯を1枚にまとめたもの） */
.lockup{
  width:100%;
}
.lockup__img{
  display:block;
  width:100%;
  height:auto;
}
.fv__cue{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.5vw; /* 2px */
  padding:1vw 4.2vw; /* 4px 16px */
  text-decoration:none;
  color:var(--orange);
  font-size:3.4vw; /* 13px */
  font-weight:900;
  letter-spacing:.08em;
}
.fv__cue svg{
  width:5.8vw; /* 22px */
  height:5.8vw; /* 22px */
  fill:none;
  stroke:var(--orange);
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  animation:cue 1.6s ease-in-out infinite;
}
@keyframes cue{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(4px); } }
/* ============================ 本文 ============================ */
.content{
  position:relative;
  z-index:1;
  background:var(--cream);
}
.sec{
  padding:11.7vw 5.3vw 11.7vw; /* 44px 20px 44px */
  display:flex;
  flex-direction:column;
  gap:5.3vw; /* 20px */
}
.sec--white{
  background:#fff;
}
.sec--bleed{
  padding-left:0;
  padding-right:0;
}
.sec--bleed .sec__head{
  padding:0 5.3vw; /* 0 20px */
}
.sec__head{
  text-align:center;
  display:flex;
  flex-direction:column;
  gap:1.6vw; /* 6px */
}
.sec__en{
  font-family:var(--f-num);
  font-size:3.4vw; /* 13px */
  font-weight:700;
  letter-spacing:.2em;
  color:var(--orange);
}
.sec__title{
  font-family:var(--f-round);
  font-size:8vw; /* 30px ⑤セクション見出し */
  font-weight:900;
  line-height:1.45;
}
.sec__note{
  font-size:3.4vw; /* 13px */
  line-height:1.6;
  color:var(--text-3);
}
/* 2画面目:FVの上に重なって上がってくる */
/* 2画面目の背景：上＝もみじ（下へ向けて暗く）、下＝ジムの小物（上端を暗くなじませる） */
/* 上下の余白を揃える（上36px＝下36px） */
.sec--campaign{
  position:relative;
  margin-top:-6.4vw; /* -24px */
  padding-top:9.6vw; /* 36px */
  scroll-margin-top:0;
  color:#fff;
  box-shadow:0 -2.1vw 6.4vw rgba(43,29,22,.25); /* 0 -8px 24px rgba(43,29,22,.25) */
  background:linear-gradient(180deg, rgba(43,29,22,.25) 0%, rgba(43,29,22,.35) 69.3vw, rgba(43,29,22,.85) 112vw, var(--brown) 133.3vw) center top / 100% 133.3vw no-repeat,
  linear-gradient(180deg, var(--brown) 0%, rgba(43,29,22,.55) 35%, rgba(43,29,22,0) 60%) center bottom / 100% 66.6vw no-repeat,
  url("../img/opt/camp-bg-bottom.webp") center bottom / 100% auto no-repeat,
  url("../img/opt/camp-bg-autumn.webp") center top / 100% auto no-repeat,
  var(--brown); /* linear-gradient(180deg, rgba(43,29,22,.25) 0%, rgba(43,29,22,.35) 260px, rgba(43,29,22,.85) 420px, var(--brown) 500px) center top / 100% 500px no-repeat,
  linear-gradient(180deg, var(--brown) 0%, rgba(43,29,22,.55) 35%, rgba(43,29,22,0) 60%) center bottom / 100% 250px no-repeat,
  url("../img/opt/camp-bg-bottom.webp") center bottom / 100% auto no-repeat,
  url("../img/opt/camp-bg-autumn.webp") center top / 100% auto no-repeat,
  var(--brown) */
  padding-bottom:9.6vw; /* 36px */
}
.sec--campaign .sec__en{
  color:var(--orange-light);
}
.sec--campaign .sec__title{
  color:#fff;
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.sec--campaign .offer__main{
  color:#fff;
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.sec--campaign .offer__main b{
  color:#FFC58F;
  background:linear-gradient(transparent 70%, rgba(180,80,28,.75) 70%);
}
.sec--campaign .offer__main span{
  color:#FFC58F;
}
/* 2画面目「秋のキャンペーン内容」(C案) */
.offer{
  display:flex;
  flex-direction:column;
  align-items:center;
  margin-top:-1vw; /* -4px */
  gap:0.5vw; /* 2px */
}
.offer__main{
  font-family:var(--f-round);
  font-weight:900;
  font-size:4.8vw; /* 18px */
  color:var(--text);
  line-height:1.2;
  white-space:nowrap;
}
.offer__main b{
  font-family:var(--f-num);
  font-weight:800;
  font-size:12.8vw; /* 48px */
  color:var(--orange);
  margin:0 0.5vw; /* 0 2px */
  padding:0 0.5vw; /* 0 2px */
  background:linear-gradient(transparent 68%, rgba(246,178,122,.55) 68%);
}
.offer__main span{
  color:var(--orange);
  margin-left:0.5vw; /* 2px */
}
.inapp-note{
  font-size:3.4vw; /* 13px */
  line-height:1.7;
  color:var(--text-2);
  background:#fff;
  border-radius:2.6vw; /* 10px */
  padding:3.7vw 4.2vw; /* 14px 16px */
}
.inapp-note a{
  font-weight:700;
  color:var(--orange);
}
/* 不安への回答 */
/* 特典の中身 */
.perks{
  display:flex;
  flex-direction:column;
  gap:4.2vw; /* 16px */
}
.perk{
  background:#fff;
  border-radius:3.7vw; /* 14px */
  overflow:hidden;
  display:flex;
  flex-direction:column;
  scroll-margin-top:4.2vw; /* 16px */
}
.perk img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:cover;
  background:var(--cream-2);
}
/* キャンペーン詳細：番号・見出しを大きく、元値→特典価格→おトク額を縦に積んで強調 */
.perk > div{
  display:flex;
  flex-direction:column;
  padding:5.3vw 5.3vw 5.8vw; /* 20px 20px 22px */
  gap:2.1vw; /* 8px */
}
.perk__no{
  font-family:var(--f-num);
  font-size:4.2vw; /* 16px */
  font-weight:800;
  letter-spacing:.04em;
  color:var(--orange);
}
.perk__title{
  font-family:var(--f-round);
  font-size:4.2vw; /* 16px */
  font-weight:900;
  line-height:1.45;
}
/* ご紹介特典：ラベルを枠線の上の中央にバッジとして載せ、目立たせる */
.perk-plus{
  background:#fff;
  border:0.534vw dashed var(--orange-light); /* 2px dashed var(--orange-light) */
  border-radius:3.7vw; /* 14px */
  display:flex;
  gap:3.2vw; /* 12px */
  align-items:flex-start;
  position:relative;
  margin-top:9vw; /* 34px */
  padding:10.1vw 4vw 5.3vw; /* 38px 15px 20px（左右を18→15pxにして本文の1行を19文字に。「Derma Medico」が行をまたがず、行末も揃う） */
}
.deo{
  display:flex;
  flex-direction:column;
  gap:2.1vw; /* 8px */
  margin-top:3.2vw; /* 12px */
}
/* 文字サイズ5段階化に伴い、制汗剤の品名が折り返さないよう余白を詰める */
.deo li{
  display:flex;
  align-items:center;
  background:var(--cream);
  border-radius:2.6vw; /* 10px */
  padding:2.1vw 4.2vw 2.1vw 2.1vw; /* 8px 16px 8px 8px */
  gap:2.6vw; /* 10px */
  padding-right:3.2vw; /* 12px */
}
.deo img{
  width:17vw; /* 64px */
  height:17vw; /* 64px */
  flex-shrink:0;
  border-radius:2.1vw; /* 8px */
  mix-blend-mode:multiply;
}
.deo p{
  display:flex;
  flex-direction:column;
  gap:0.2vw; /* 1px */
}
.deo b{
  font-family:var(--f-num);
  font-size:4.2vw; /* 16px */
  font-weight:800;
}
.deo__pick{
  position:relative;
  background:#FFF8F1 !important;
  box-shadow:inset 0 0 0 0.534vw var(--orange); /* inset 0 0 0 2px var(--orange) */
}
.deo__badge{
  margin-left:auto;
  display:inline-flex;
  align-items:center;
  gap:0.8vw; /* 3px */
  font-style:normal;
  font-size:3.4vw; /* 13px */
  font-weight:900;
  color:#fff;
  background:var(--orange);
  border-radius:266.4vw; /* 999px */
  box-shadow:0.5vw 0.5vw 0 var(--brown); /* 2px 2px 0 var(--brown) */
  white-space:nowrap;
  line-height:1.4;
  padding:1.8vw 3.7vw 1.8vw 3.2vw; /* 7px 14px 7px 12px */
}
.deo__badge svg{
  width:3.2vw; /* 12px */
  height:3.2vw; /* 12px */
  fill:#fff;
}
.deo span{
  font-size:3.4vw; /* 13px */
  color:var(--text-2);
  white-space:nowrap;
}
.perk__text{
  font-size:4.2vw; /* 16px */
  line-height:1.7;
  color:var(--text-2);
}
/* LINEボタン */
.btn-line{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:2.1vw; /* 8px */
  height:14.4vw; /* 54px */
  border-radius:266.4vw; /* 999px */
  background:var(--green);
  color:#fff;
  border:0.8vw solid #fff; /* 3px solid #fff（右下の丸ボタンと同じ白い縁取り） */
  text-decoration:none;
  font-size:4.8vw; /* 18px */
  font-weight:900;
  box-shadow:0 1vw 3.2vw rgba(43,29,22,.25); /* 0 4px 12px rgba(43,29,22,.25)（白い縁が白背景でも見えるよう焦げ茶の影） */
}
.btn-line svg{
  width:5.8vw; /* 22px */
  height:5.8vw; /* 22px */
  fill:none;
  stroke:currentColor; /* 文字と同じ色（ホバーで文字と一緒に緑になる） */
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.btn-line:active{
  transform:translateY(0.2vw); /* translateY(1px) */
}
.btn-line--lg{
  height:14.9vw; /* 56px */
}
/* 会員の変化 */
.cases{
  display:flex;
  gap:3.2vw; /* 12px */
  overflow-x:auto;
  padding:0 5.3vw 1.6vw; /* 0 20px 6px */
  scroll-snap-type:x mandatory;
  scroll-padding:0 5.3vw; /* 0 20px */
  -webkit-overflow-scrolling:touch;
}
.case{
  width:74.6vw; /* 280px */
  flex-shrink:0;
  scroll-snap-align:start;
  background:#fff;
  border-radius:4.2vw; /* 16px */
  padding:3.2vw; /* 12px */
  display:flex;
  flex-direction:column;
  gap:2.1vw; /* 8px */
}
.sec__note--pad{
  padding:0 5.3vw; /* 0 20px */
}
.case__photo{
  position:relative;
  border-radius:2.6vw; /* 10px */
  overflow:hidden;
  background:var(--cream-2);
}
.case img{
  display:block;
  width:100%;
  aspect-ratio:520/514;
  height:auto;
  object-fit:cover;
}
.case__tag{
  position:absolute;
  bottom:0;
  left:0;
  width:calc(50% - 0.4vw); /* calc(50% - 1.5px) */
  padding:1vw 0; /* 4px 0 */
  text-align:center;
  font-family:var(--f-num);
  font-size:3.4vw; /* 13px */
  font-weight:800;
  letter-spacing:.12em;
  color:#fff;
  background:rgba(43,29,22,.85);
}
.case__tag--after{
  left:auto;
  right:0;
  background:var(--orange);
}
.case__body{
  text-align:center;
  padding:1.6vw 0 1vw; /* 6px 0 4px */
  display:flex;
  flex-direction:column;
  gap:1.6vw; /* 6px */
}
.case__who{
  font-size:4.2vw; /* 16px */
  font-weight:700;
  color:var(--text-2);
}
.case__num{
  color:var(--orange);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  line-height:1;
}
.case__num b{
  font-family:var(--f-num);
  font-weight:800;
  font-size:12.8vw; /* 48px */
  letter-spacing:-.02em;
}
.case__kg{
  font-size:4.2vw; /* 16px */
  font-weight:700;
  color:var(--text-2);
}
.case__kg b{
  font-family:var(--f-num);
  font-size:4.8vw; /* 18px */
  color:var(--text);
}
.case__kg span{
  color:var(--orange);
  font-size:3.4vw; /* 13px */
  margin:0 1vw; /* 0 4px */
}
/* 声 */
.voice{
  background:var(--cream);
  border-radius:4.2vw; /* 16px */
  padding:5.3vw 5.8vw; /* 20px 22px */
  display:flex;
  flex-direction:column;
  gap:2.6vw; /* 10px */
}
.voice blockquote{
  font-size:4.2vw; /* 16px */
  line-height:1.75;
}
.voice strong{
  font-weight:900;
}
.voice figcaption{
  font-size:3.4vw; /* 13px */
  color:var(--text-3);
}
/* トレーナー(横スワイプ) */
/* トレーナー紹介:店内写真(オレンジのネオン)を暗く沈めた背景 */
.sec--trainers{
  color:#fff;
  background:linear-gradient(180deg, rgba(43,29,22,.55) 0%, rgba(43,29,22,.45) 40%, rgba(43,29,22,.8) 100%),
    url("../img/opt/trainer-bg.webp") center / cover no-repeat, var(--brown);
}
.sec--trainers .sec__en{
  color:var(--orange-light);
}
.sec--trainers .sec__title{
  color:#fff;
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.sec--trainers .trainer{
  color:var(--text);
  box-shadow:0 2.1vw 6.4vw rgba(0,0,0,.35); /* 0 8px 24px rgba(0,0,0,.35) */
}
.trainers{
  display:flex;
  gap:3.2vw; /* 12px */
  overflow-x:auto;
  padding:0 5.3vw 1.6vw; /* 0 20px 6px */
  scroll-snap-type:x mandatory;
  scroll-padding:0 5.3vw; /* 0 20px */
  -webkit-overflow-scrolling:touch;
}
.trainer{
  width:61.3vw; /* 230px */
  flex-shrink:0;
  background:#fff;
  border-radius:4.2vw; /* 16px */
  overflow:hidden;
  scroll-snap-align:start;
}
.trainer img{
  width:100%;
  height:auto;
  aspect-ratio:3/4;
  object-fit:cover;
  object-position:center top;
  background:var(--cream-2);
}
.trainer__body{
  padding:4.2vw 4.8vw 5.3vw; /* 16px 18px 20px */
  display:flex;
  flex-direction:column;
  gap:1vw; /* 4px */
}
.trainer__body h3{
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
}
.trainer__body p{
  font-size:4.2vw; /* 16px */
  line-height:1.6;
  color:var(--text-2);
}
.trainer__body .trainer__meta{
  font-size:3.4vw; /* 13px */
  font-weight:700;
  color:var(--orange);
}
/* スマホは資格・実績と「トレーナー歴」を2段に（区切りの「|」は隠す） */
.trainer__meta > span{
  display:block;
}
.trainer__meta > .trainer__sep{
  display:none;
}
/* 料金 */
/* 料金欄「秋限定」タグを、16回・24回の「おすすめ」バッジと同じ見た目で枠線の上に載せる */
/* 料金プラン：3枚とも中央揃え・縦積み。バッジは枠線の上の中央、値段は大きく */
.trial-card{
  border:0.534vw solid var(--orange); /* 2px solid var(--orange) */
  border-radius:4.2vw; /* 16px */
  display:flex;
  flex-direction:column;
  background:#FFF8F1;
  box-shadow:1vw 1vw 0 var(--brown); /* 4px 4px 0 var(--brown) */
  position:relative;
  margin-top:2.6vw; /* 10px */
  align-items:center;
  text-align:center;
  padding:9vw 5.3vw 5.8vw; /* 34px 20px 22px */
  gap:1vw; /* 4px */
}
.trial-card__price b{
  line-height:1;
  font-family:var(--f-num);
  font-weight:800;
  font-size:12.8vw; /* 48px */
  letter-spacing:-.01em;
}
.plans{
  display:flex;
  flex-direction:column;
  gap:9.6vw; /* 36px */
  margin-top:5.3vw; /* 20px */
}
.plan{
  position:relative;
  grid-template-columns:1fr auto;
  border:0.267vw solid var(--line); /* 1px solid var(--line) */
  border-radius:4.2vw; /* 16px */
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:0.5vw; /* 2px */
  padding:9vw 5.3vw 5.3vw; /* 34px 20px 20px */
}
.plan--main{
  border:0.534vw solid var(--orange); /* 2px solid var(--orange) */
  background:#FFF8F1;
  box-shadow:1vw 1vw 0 var(--brown); /* 4px 4px 0 var(--brown) */
}
.plan__badge{
  position:absolute;
  top:-4.5vw; /* -17px */
  font-size:3.4vw; /* 13px */
  font-weight:900;
  color:var(--text);
  background:var(--cream-2);
  padding:1.6vw 4.2vw; /* 6px 16px */
  border-radius:266.4vw; /* 999px */
  line-height:1.4;
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
}
.plan__badge--main{
  color:#fff;
  background:var(--orange);
  border:0.534vw solid #fff; /* 2px solid #fff */
  padding:1.3vw 4.2vw; /* 5px 16px */
  box-shadow:0.5vw 0.5vw 0 var(--brown); /* 2px 2px 0 var(--brown) */
}
.plan h3{
  font-weight:900;
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  line-height:1.4;
}
.plan__price{
  font-weight:700;
  margin:0.5vw 0 1.6vw; /* 2px 0 6px */
  font-size:4.8vw; /* 18px */
  text-align:center;
  line-height:1.1;
}
.plan__price b{
  font-family:var(--f-num);
  font-weight:800;
  font-size:12.8vw; /* 48px */
}
.plan__meta{
  grid-column:1/-1;
  color:var(--text-2);
  font-size:4.2vw; /* 16px */
  line-height:1.6;
}
.plan__perk{
  grid-column:1/-1;
  line-height:1.6;
  font-weight:700;
  color:var(--orange);
  border-top:0.267vw dashed var(--line); /* 1px dashed var(--line) */
  width:100%;
  white-space:normal;
  font-size:4.2vw; /* 16px */
  margin-top:2.6vw; /* 10px */
  padding-top:3.2vw; /* 12px */
}
.flow__total{
  font-weight:700;
  color:var(--orange);
  text-align:center;
  margin:-1vw 0 0; /* -4px 0 0 */
  margin-top:2.1vw; /* 8px */
  font-size:4.2vw; /* 16px */
}
/* FAQ */
.faq details{
  border-bottom:0.267vw solid var(--line); /* 1px solid var(--line) */
}
.faq summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:3.2vw; /* 12px */
  padding:3.7vw 0; /* 14px 0 */
  min-height:14.9vw; /* 56px */
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px ③小見出し（FAQの質問） */
  font-weight:900;
  line-height:1.5;
}
.faq summary::-webkit-details-marker{
  display:none;
}
/* 開閉アイコン(＋/−)。文字ではなく線で描いて、質問文と縦の中心を揃える */
.faq summary::after{
  content:"";
  flex-shrink:0;
  width:3.7vw; /* 14px */
  height:3.7vw; /* 14px */
  background:linear-gradient(var(--orange),var(--orange)) center/3.7vw 0.5vw no-repeat, linear-gradient(var(--orange),var(--orange)) center/0.5vw 3.7vw no-repeat; /* linear-gradient(var(--orange),var(--orange)) center/14px 2px no-repeat, linear-gradient(var(--orange),var(--orange)) center/2px 14px no-repeat */
}
.faq details[open] summary::after{
  background:linear-gradient(var(--orange),var(--orange)) center/3.7vw 0.5vw no-repeat; /* linear-gradient(var(--orange),var(--orange)) center/14px 2px no-repeat */
}
.faq details p{
  font-size:4.2vw; /* 16px */
  line-height:1.8;
  color:var(--text-2);
  padding:0 0 3.7vw; /* 0 0 14px */
}
/* アクセス */
.map{
  border-radius:3.7vw; /* 14px */
  overflow:hidden;
  aspect-ratio:16/10;
  background:var(--cream-2);
}
.map iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
}
/* アクセス：項目名の下に内容を縦に積む（左揃え・項目名は本文より大きく） */
.info{
  grid-template-columns:19.2vw minmax(0,1fr); /* 72px minmax(0,1fr) */
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:0;
  text-align:left;
  font-size:4.2vw; /* 16px */
  line-height:1.7;
}
.info a{
  font-weight:700;
  color:var(--orange);
}
/* 紹介特典 */
/* 最終CTA */
.final{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:var(--brown);
  color:#fff;
  padding:12.8vw 5.3vw 14.9vw; /* 48px 20px 56px */
  display:flex;
  flex-direction:column;
  gap:4.2vw; /* 16px */
  text-align:center;
}
/* 「秋の入会特典」と同じ秋の背景を左右反転して敷き、下ほど暗くしてボタンを読ませる */
.final::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  transform:scaleX(-1);
  background:url("../img/opt/camp-bg-autumn.webp") center top / cover no-repeat;
}
.final::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg, rgba(43,29,22,.35) 0%, rgba(43,29,22,.55) 45%, rgba(43,29,22,.9) 100%);
}
.final__lead{
  font-size:4.2vw; /* 16px */
  line-height:1.7;
  color:var(--line);
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.final__title{
  font-family:var(--f-round);
  font-size:8vw; /* 30px ⑤セクション見出し */
  font-weight:900;
  line-height:1.5;
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.final__title em{
  color:var(--orange-light);
}
/* 最終CTAの訴求文：枠のない文章。1行目が誘いかけ、2行目が価格（価格は6段階の例外で大きく。スマホは元値と特典価格を縦に積む） */
.final__offer{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:2.1vw; /* 8px */
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.final__invite{
  font-family:var(--f-round);
  font-size:6.4vw; /* 24px ④見出し */
  font-weight:900;
  line-height:1.5;
}
.final__deal{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1vw; /* 4px */
  margin:1vw 0; /* 4px 0 */
}
.final__deal .final__was{
  font-size:4.8vw; /* 18px ③小見出し */
  color:#F2E6D8;
}
.final__arrow{
  display:none;
}
.final__num{
  color:var(--orange-light); /* 焦げ茶の背景でも読めるよう明るいオレンジ */
  font-weight:900;
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:0.5vw; /* 2px */
  font-family:var(--f-round);
  font-size:8vw; /* 30px ⑤（「円」） */
  line-height:1.1;
}
.final__num b{
  font-family:var(--f-num);
  font-weight:800;
  letter-spacing:-.01em;
  font-size:17vw; /* 64px（6段階の例外：最終CTAの価格だけ⑥数字より大きく。data-type-exception） */
}
.final__num small{
  margin-left:0.5vw; /* 2px */
  font-size:4.2vw; /* 16px */
}
.final__tel{
  font-size:4.2vw; /* 16px */
  font-weight:700;
  line-height:1.6;
  color:#F2E6D8;
  text-shadow:0 0.2vw 1.6vw rgba(0,0,0,.5); /* 0 1px 6px rgba(0,0,0,.5) */
}
.final__tel a{
  color:#fff;
  font-weight:900;
  text-underline-offset:0.8vw; /* 3px */
}
.final__tel b{
  font-family:var(--f-num);
  font-size:4.8vw; /* 18px */
  font-weight:800;
  letter-spacing:.02em;
}
/* フッター：リンクは縦に積む（PCは横並び） */
.footer{
  background:var(--brown);
  color:#D9C7B2;
  border-top:0.267vw solid rgba(255,255,255,.1); /* 1px solid rgba(255,255,255,.1) */
  padding:4.2vw 5.3vw 5.3vw; /* 16px 20px 20px */
  display:flex;
  justify-content:space-between;
  font-size:3.4vw; /* 13px */
  flex-direction:column;
  align-items:center;
  gap:2.1vw; /* 8px */
  text-align:center;
}
.footer a{
  color:#fff;
}
/* 固定予約バー */
.cta-bar{
  position:fixed;
  z-index:20;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:100%;
  padding:2.6vw 4.2vw calc(3.2vw + env(safe-area-inset-bottom)); /* 10px 16px calc(12px + env(safe-area-inset-bottom)) */
  background:rgba(247,241,232,.96);
  border-top:0.267vw solid var(--line); /* 1px solid var(--line) */
  display:flex;
  flex-direction:column;
  gap:1.3vw; /* 5px */
  -webkit-backdrop-filter:blur(1.6vw); /* blur(6px) */
  backdrop-filter:blur(1.6vw); /* blur(6px) */
}
.u-sr{
  position:absolute;
  width:0.267vw; /* 1px */
  height:0.267vw; /* 1px */
  overflow:hidden;
  clip:rect(0 0 0 0);
  white-space:nowrap;
}
/* 横スワイプ箇所のスクロールバーを非表示(スワイプ操作はそのまま) */
/* ビフォーアフター・トレーナー：横スワイプ（1枚ずつ吸着） */
.cases,
.trainers{
  scrollbar-width:none;
  -ms-overflow-style:none;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-padding:0 5.3vw; /* 0 20px */
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}
.cases::-webkit-scrollbar,
.trainers::-webkit-scrollbar{
  display:none;
}
.footer small{
  font-size:3.4vw; /* 13px */
}
.offer__lead{
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  color:#FFC58F;
  text-shadow:0 0.5vw 3.2vw rgba(0,0,0,.5); /* 0 2px 12px rgba(0,0,0,.5) */
}
.cp-box{
  background:var(--orange);
  border:0.8vw solid #fff; /* 3px solid #fff */
  border-radius:4.8vw; /* 18px */
  padding:3.7vw; /* 14px */
  display:flex;
  flex-direction:column;
  gap:2.1vw; /* 8px */
  box-shadow:1.3vw 1.3vw 0 rgba(0,0,0,.35); /* 5px 5px 0 rgba(0,0,0,.35) */
}
.cp-cell{
  background:#fff;
  color:var(--text);
  border-radius:3.2vw; /* 12px */
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.cp-icon{
  border-radius:50%;
  background:#FBEADB;
  fill:none;
  stroke:var(--orange);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.cp-label{
  font-family:var(--f-round);
  font-weight:900;
}
.cp-note{
  font-size:3.4vw; /* 13px */
  color:var(--text-3);
}
.cp-price{
  color:var(--orange);
  font-family:var(--f-round);
  font-weight:900;
  display:flex;
  align-items:baseline;
  justify-content:center;
  gap:0.5vw; /* 2px */
}
.cp-price b{
  font-family:var(--f-num);
  font-weight:800;
}
.cp-text{
  font-family:var(--f-round);
  font-weight:900;
  color:var(--orange);
}
/* 特典は2列。体験パーソナルだけ横幅いっぱい。3段(アイコン・項目名・おトク情報)の高さを固定して位置を揃える */
.cp-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:2.1vw; /* 8px */
}
.cp-grid .cp-cell{
  padding:4.2vw 2.6vw; /* 16px 10px */
  justify-content:flex-start;
  gap:1vw; /* 4px */
}
.cp-grid .cp-icon{
  width:12.8vw; /* 48px */
  height:12.8vw; /* 48px */
  padding:2.6vw; /* 10px */
  flex-shrink:0;
}
.cp-grid .cp-label{
  height:6.9vw; /* 26px */
  line-height:6.9vw; /* 26px */
  font-size:4.8vw; /* 18px */
  white-space:nowrap;
}
.cp-grid .cp-label b{
  font-family:var(--f-num);
  font-weight:800;
  font-size:4.8vw; /* 18px */
  line-height:6.9vw; /* 26px */
  letter-spacing:.03em;
  margin-left:0.5vw; /* 2px */
}
.cp-grid .cp-price,
.cp-grid .cp-text{
  height:11.7vw; /* 44px */
  line-height:11.7vw; /* 44px */
  white-space:nowrap;
}
.cp-grid .cp-price{
  font-size:4.8vw; /* 18px */
}
.cp-grid .cp-price b{
  font-size:12.8vw; /* 48px */
  line-height:11.7vw; /* 44px */
}
.cp-grid .cp-text{
  font-size:6.4vw; /* 24px */
}
.cp-grid .cp-cell--wide{
  grid-column:1 / -1;
}
.cp-cell--wide .cp-icon{
  width:12.8vw; /* 48px */
  height:12.8vw; /* 48px */
}
.cp-grid .cp-cell--wide .cp-label{
  font-size:4.8vw; /* 18px */
}
.cp-grid .cp-cell--wide .cp-price{
  height:14.4vw; /* 54px */
  line-height:14.4vw; /* 54px */
}
.cp-grid .cp-cell--wide .cp-price b{
  font-size:12.8vw; /* 48px */
  line-height:14.4vw; /* 54px */
}
.cp-cell--wide .cp-note{
  margin-top:-1.6vw; /* -6px */
}
.cp-more{
  font-size:3.4vw; /* 13px */
  padding:0.5vw 1vw 0; /* 2px 4px 0 */
  line-height:1.6;
  color:rgba(255,255,255,.9);
}
/* 次のセクションへの誘導（ボタンではなく文字＋矢印） */
.cp-cue{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0;
  min-height:12.8vw; /* 48px */
  padding:1vw 4.2vw 0; /* 4px 16px 0 */
  text-decoration:none;
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  letter-spacing:.06em;
  color:var(--accent-pale);
  text-shadow:0 0.5vw 2.6vw rgba(0,0,0,.4); /* 0 2px 10px rgba(0,0,0,.4) */
}
.cp-cue:hover{
  color:var(--accent-pale);
}
.cp-cue svg{
  width:7.4vw; /* 28px */
  height:7.4vw; /* 28px */
  fill:none;
  stroke:var(--accent-pale);
  stroke-width:2.5;
  stroke-linecap:round;
  stroke-linejoin:round;
  animation:cp-cue 1.6s ease-in-out infinite;
}
@keyframes cp-cue{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}
.perk .perk__title{
  font-family:var(--f-round);
  font-size:6.4vw; /* 24px */
  line-height:1.35;
}
/* キャンペーン詳細：おトク情報の箱の高さを5枚でそろえる（体験パーソナルの金額表示に合わせる） */
.perk__deal{
  margin:1vw 0 0.5vw; /* 4px 0 2px */
  padding:4.2vw 4.8vw; /* 16px 18px */
  background:#FFF4EA;
  border-radius:3.2vw; /* 12px */
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:1.6vw; /* 6px */
  min-height:30.1vw; /* 113px */
  justify-content:center;
}
.perk__was{
  font-size:4.2vw; /* 16px */
  color:var(--text-3);
  line-height:1.4;
}
.perk__now{
  color:var(--orange);
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  line-height:1.1;
  display:flex;
  align-items:baseline;
  gap:0.5vw; /* 2px */
}
.perk__now b{
  font-family:var(--f-num);
  font-weight:800;
  font-size:12.8vw; /* 48px */
  letter-spacing:-.01em;
}
.perk__now small{
  font-size:3.4vw; /* 13px */
  margin-left:0.5vw; /* 2px */
}
.perk__now--text{
  font-size:6.4vw; /* 24px */
  line-height:1.25;
}
.perk .perk__text{
  font-size:4.2vw; /* 16px */
  line-height:1.75;
}
.perk__note{
  font-size:3.4vw; /* 13px */
  line-height:1.7;
  color:var(--text-3);
  padding-top:2.1vw; /* 8px */
  border-top:0.267vw dashed var(--line); /* 1px dashed var(--line) */
}
.trial-card__tag{
  position:absolute;
  top:-4.5vw; /* -17px */
  align-self:auto;
  font-size:3.4vw; /* 13px */
  font-weight:900;
  color:#fff;
  background:var(--orange);
  border:0.534vw solid #fff; /* 2px solid #fff */
  padding:1.3vw 4.2vw; /* 5px 16px */
  border-radius:266.4vw; /* 999px */
  line-height:1.4;
  box-shadow:0.5vw 0.5vw 0 var(--brown); /* 2px 2px 0 var(--brown) */
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
}
.trial-card__name{
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  line-height:1.4;
}
.trial-card__was{
  margin-top:1vw; /* 4px */
  font-size:4.2vw; /* 16px */
  color:var(--text-3);
}
.trial-card__price{
  color:var(--orange);
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  display:flex;
  flex-direction:row;
  white-space:nowrap;
  align-items:baseline;
  justify-content:center;
  gap:0.5vw; /* 2px */
  line-height:1.1;
}
.trial-card__price small{
  font-size:4.2vw; /* 16px */
  margin-left:0.5vw; /* 2px */
}
.plan__price small{
  font-size:4.2vw; /* 16px */
  margin-left:0.5vw; /* 2px */
}
.final__was{
  font-size:4.2vw; /* 16px */
  color:var(--text-3);
}
/* そのほかのコースは公式サイトの料金ページへ誘導（文字リンク） */
.price-more{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1.6vw; /* 6px */
  min-height:12.8vw; /* 48px */
  margin-top:1vw; /* 4px */
  text-align:center;
  font-family:var(--f-round);
  font-size:4.2vw; /* 16px */
  font-weight:900;
  line-height:1.5;
  color:var(--orange);
  text-decoration:underline;
  text-underline-offset:1vw; /* 4px */
}
.price-more svg{
  width:4.8vw; /* 18px */
  height:4.8vw; /* 18px */
  flex-shrink:0;
  fill:none;
  stroke:var(--orange);
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
/* 体験の流れ：1ステップ＝1枚のカード。バッジは枠線の上の中央、カードの間は下向き矢印でつなぐ */
.flow2{
  display:flex;
  flex-direction:column;
  gap:13.8vw; /* 52px */
  margin-top:4.2vw; /* 16px */
}
.flow2__step{
  position:relative;
  background:#fff;
  border:0.534vw solid var(--line); /* 2px solid var(--line) */
  border-radius:4.2vw; /* 16px */
  padding:8vw 5.3vw 5.3vw; /* 30px 20px 20px */
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:1vw; /* 4px */
}
.flow2__badge{
  position:absolute;
  top:-4.2vw; /* -16px */
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  font-family:var(--f-num);
  font-size:3.4vw; /* 13px */
  font-weight:800;
  letter-spacing:.08em;
  line-height:1.4;
  color:#fff;
  background:var(--orange);
  border:0.534vw solid #fff; /* 2px solid #fff */
  padding:1.3vw 4.8vw; /* 5px 18px */
  border-radius:266.4vw; /* 999px */
  box-shadow:0.5vw 0.5vw 0 var(--brown); /* 2px 2px 0 var(--brown) */
}
.flow2__step h3{
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  line-height:1.4;
}
.flow2__text{
  font-size:4.2vw; /* 16px */
  line-height:1.6;
  color:var(--text-2);
}
.flow2__step:not(:last-child)::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:-6.6vw; /* -25px */
  width:3.7vw; /* 14px */
  height:3.7vw; /* 14px */
  border-right:0.8vw solid var(--orange); /* 3px solid var(--orange) */
  border-bottom:0.8vw solid var(--orange); /* 3px solid var(--orange) */
  transform:translateX(-50%) rotate(45deg);
}
.perk-plus .perk__no{
  position:absolute;
  top:-5vw; /* -19px */
  left:50%;
  transform:translateX(-50%);
  white-space:nowrap;
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  letter-spacing:.04em;
  line-height:1.4;
  color:#fff;
  background:var(--orange);
  border:0.534vw solid #fff; /* 2px solid #fff */
  padding:1.6vw 5.3vw; /* 6px 20px */
  border-radius:266.4vw; /* 999px */
  box-shadow:0.5vw 0.5vw 0 var(--brown); /* 2px 2px 0 var(--brown) */
}
.perk-plus .perk__title{
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  line-height:1.45;
  text-align:center;
  margin-bottom:1.6vw; /* 6px */
}
.info dt{
  font-family:var(--f-round);
  font-size:4.8vw; /* 18px */
  font-weight:900;
  line-height:1.5;
  color:var(--orange);
  letter-spacing:.04em;
  padding-top:3.7vw; /* 14px */
}
.info dd{
  padding:0.5vw 0 3.7vw; /* 2px 0 14px */
  border-bottom:0.267vw dashed var(--line); /* 1px dashed var(--line) */
}
.info dd:last-child{
  border-bottom:0;
}
.case,
.trainer{
  scroll-snap-align:start;
}
.nw{
  white-space:nowrap;
}
.sec__title,
.perk__title,
.final__title,
.final__invite,
.trial-card__name,
.plan h3,
.flow2__step h3,
.trainer__body h3,
.faq summary,
.offer__lead,
.cp-label,
.perk__no,
.plan__badge,
.trial-card__tag,
.flow2__badge,
.info dt{
  font-feature-settings:"palt" 1;
}
.footer__links{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:1.6vw; /* 6px */
}
/* EAA：通常の値段の代わりに「期間中のご入会限定」を強調して見せる */
.perk__was.perk__lim{
  color:var(--orange);
  font-weight:900;
  font-family:var(--f-round);
}
/* 会員さまの変化：前後（キャンペーン詳細＝クリーム、お客様の声＝白）と色を変えて、区切りを見せる */
.sec--cases{
  background:#F8DFC6;
}
/* 背景画像側で文字の下を明るくしているので、白いもやは重ねない */
/* =========================================================
   PC版（1025px以上）：単位はpx
   ========================================================= */
@media (min-width:1025px){
  /* ---------- PCの文字サイズ6段階：画面幅1025px→1920pxで、最小値→最大値へ伸び縮みする（clamp） ---------- */
  :root{
    --fs-note:clamp(14px, 11.709px + 0.2235vw, 16px); /* 14px（1025px）→16px（1920px） */
    --fs-body:clamp(16px, 11.419px + 0.4469vw, 20px); /* 16px（1025px）→20px（1920px） */
    --fs-sub:clamp(20px, 15.419px + 0.4469vw, 24px); /* 20px（1025px）→24px（1920px） */
    --fs-head:clamp(30px, 18.547px + 1.1173vw, 40px); /* 30px（1025px）→40px（1920px） */
    --fs-sec:clamp(38px, 21.966px + 1.5642vw, 52px); /* 38px（1025px）→52px（1920px） ⑤セクション見出し */
    --fs-num:clamp(48px, 29.676px + 1.7877vw, 64px); /* 48px（1025px）→64px（1920px） */
  }
  /* ---------- スマホ用のvwの値を、PCでは基準幅375pxのときのpxに戻す ---------- */
  :root{
    --bar-h:77px;
    --outline-2:2px 0 0 #fff,-2px 0 0 #fff,0 2px 0 #fff,0 -2px 0 #fff,2px 2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff;
    --outline-3:3px 0 0 #fff,-3px 0 0 #fff,0 3px 0 #fff,0 -3px 0 #fff,2px 2px 0 #fff,-2px 2px 0 #fff,2px -2px 0 #fff,-2px -2px 0 #fff;
  }
  h1,
  h2,
  h3,
  p,
  ul,
  ol,
  dl,
  dd,
  figure,
  blockquote{
    margin:0;
    padding:0;
  }
  .visually-hidden{
    width:1px;
    height:1px;
  }
  .fv__shade-top{
    height:120px;
  }
  .lockup{
    width:clamp(480px, 239.497px + 23.4637vw, 690px);
  }
  .fv__cue{
    gap:2px;
    padding:4px 16px;
    margin-top:24px;
    font-size:var(--fs-body);
  }
  .fv__cue svg{
    width:22px;
    height:22px;
  }
  .sec__head{
    gap:6px;
  }
  .sec__en{
    font-size:var(--fs-note);
  }
  .sec__title{
    font-size:var(--fs-sec);
  }
  .sec__note{
    font-size:var(--fs-note);
  }
  .sec--campaign{
    box-shadow:0 -8px 24px rgba(43,29,22,.25);
  }
  .sec--campaign .sec__title{
    text-shadow:0 2px 12px rgba(0,0,0,.5);
    font-size:clamp(39.9px, 11.154px + 2.8045vw, 65px); /* ⑤セクション見出し×1.05（1025px）→×1.25（1920px） */
  }
  .sec--campaign .offer__main{
    text-shadow:0 2px 12px rgba(0,0,0,.5);
  }
  .offer{
    margin-top:clamp(-5px, -3.284px - 0.0894vw, -4.2px);
    gap:clamp(2.1px, 1.642px + 0.0447vw, 2.5px);
  }
  .offer__main b{
    margin:0 clamp(2.1px, 1.642px + 0.0447vw, 2.5px);
    padding:0 clamp(2.1px, 1.642px + 0.0447vw, 2.5px);
    font-size:clamp(84px, 65.676px + 1.7877vw, 100px);
  }
  .offer__main span{
    margin-left:clamp(2.1px, 1.642px + 0.0447vw, 2.5px);
  }
  .inapp-note{
    font-size:var(--fs-note);
    border-radius:10px;
    padding:14px 16px;
  }
  .perk{
    border-radius:14px;
    scroll-margin-top:16px;
    grid-column:span 2;
  }
  .perk > div{
    padding:20px clamp(16px, 1.112px + 1.4525vw, 29px) 22px; /* PCは中身の幅を狭める。左右の余白16px（1025px）→29px（1920px）。1025pxでこれ以上広げると料金の箱の文字、1920pxで30px以上にすると見出し「24時間ジム・ヨガ」が折り返す */
    gap:8px;
  }
  .perk__no{
    font-size:var(--fs-body);
  }
  .perk__title{
    font-size:var(--fs-body);
  }
  .perk-plus{
    border:2px dashed var(--orange-light);
    border-radius:14px;
    gap:12px;
    margin-top:34px;
    max-width:1200px;
    width:100%;
    margin-inline:auto;
    padding:48px 40px 32px;
  }
  .deo{
    gap:8px;
    margin-top:12px;
  }
  .deo li{
    border-radius:10px;
    padding:8px 16px 8px 8px;
    gap:10px;
    padding-right:12px;
  }
  .deo img{
    width:64px;
    height:64px;
    border-radius:8px;
  }
  .deo p{
    gap:1px;
  }
  .deo b{
    font-size:var(--fs-body);
  }
  .deo__pick{
    box-shadow:inset 0 0 0 2px var(--orange);
  }
  .deo__badge{
    gap:3px;
    font-size:var(--fs-note);
    border-radius:999px;
    box-shadow:2px 2px 0 var(--brown);
    padding:7px 14px 7px 12px;
  }
  .deo__badge svg{
    width:12px;
    height:12px;
  }
  .deo span{
    font-size:var(--fs-note);
  }
  .perk__text{
    font-size:var(--fs-body);
  }
  .btn-line{
    gap:8px;
    height:54px;
    border-radius:999px;
    font-size:var(--fs-sub);
    border:4px solid #fff;
    box-shadow:0 6px 18px rgba(43,29,22,.25);
    width:400px;
    max-width:100%;
    align-self:center;
    margin-inline:auto;
  }
  .btn-line svg{
    width:22px;
    height:22px;
  }
  .btn-line:active{
    transform:translateY(1px);
  }
  .btn-line--lg{
    height:56px;
  }
  /* ---------- ビフォーアフター・トレーナー：スワイプをやめて並べる ---------- */
  .cases{
    scroll-padding:0 20px;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px;
    max-width:1200px;
    width:100%;
    margin-inline:auto;
    padding:0;
    overflow:visible;
  }
  .case{
    border-radius:16px;
    padding:12px;
    gap:8px;
    width:auto;
  }
  .case__photo{
    border-radius:10px;
  }
  .case__tag{
    width:calc(50% - 1.5px);
    padding:4px 0;
    font-size:var(--fs-note);
  }
  .case__body{
    padding:6px 0 4px;
    gap:6px;
  }
  .case__who{
    font-size:var(--fs-body);
  }
  .case__num{
    font-size:var(--fs-sub);
  }
  .case__num b{
    font-size:var(--fs-num);
  }
  .case__kg{
    font-size:var(--fs-body);
  }
  .case__kg b{
    font-size:var(--fs-sub);
  }
  .case__kg span{
    font-size:var(--fs-note);
    margin:0 4px;
  }
  .voice{
    border-radius:16px;
    padding:20px 22px;
    gap:10px;
  }
  .voice blockquote{
    font-size:var(--fs-body);
  }
  .voice figcaption{
    font-size:var(--fs-note);
  }
  .sec--trainers .sec__title{
    text-shadow:0 2px 12px rgba(0,0,0,.5);
  }
  .sec--trainers .trainer{
    box-shadow:0 8px 24px rgba(0,0,0,.35);
  }
  .trainers{
    scroll-padding:0 20px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
    max-width:1200px;
    width:100%;
    margin-inline:auto;
    padding:0;
    overflow:visible;
  }
  .trainer{
    border-radius:16px;
    width:auto;
  }
  .trainer__body{
    padding:16px clamp(16px, 13.709px + 0.2235vw, 18px) 20px; /* 左右16px（1025px）→18px（1920px）。1025pxで18pxだと「延べ7,000本以上の指導|トレーナー歴7年」が折り返す */
    gap:4px;
  }
  .trainer__body h3{
    font-size:var(--fs-sub);
  }
  .trainer__body p{
    font-size:var(--fs-body);
  }
  .trainer__body .trainer__meta{
    font-size:var(--fs-note);
  }
  .trainer__meta > span,
  .trainer__meta > .trainer__sep{
    display:inline;
  }
  .trial-card{
    border:2px solid var(--orange);
    border-radius:16px;
    box-shadow:4px 4px 0 var(--brown);
    padding:34px 12px 22px;
    gap:4px;
    margin-top:20px;
    justify-content:center;
  }
  .trial-card__price b{
    font-size:var(--fs-num);
  }
  .plan{
    border:1px solid var(--line);
    border-radius:16px;
    gap:2px;
    padding:34px 12px 20px;
  }
  .plan--main{
    border:2px solid var(--orange);
    box-shadow:4px 4px 0 var(--brown);
  }
  .plan__badge{
    top:-17px;
    font-size:var(--fs-note);
    padding:6px 16px;
    border-radius:999px;
    left:50%;
  }
  .plan__badge--main{
    border:2px solid #fff;
    padding:5px 16px;
    box-shadow:2px 2px 0 var(--brown);
  }
  .plan h3{
    font-size:var(--fs-sub);
  }
  .plan__price{
    margin:2px 0 6px;
    font-size:var(--fs-sub);
  }
  .plan__price b{
    font-size:var(--fs-num);
  }
  .plan__meta{
    font-size:var(--fs-body);
  }
  .plan__perk{
    border-top:1px dashed var(--line);
    font-size:var(--fs-body);
    margin-top:10px;
    padding-top:12px;
  }
  .flow__total{
    margin:-4px 0 0;
    margin-top:8px;
    font-size:var(--fs-body);
  }
  .faq details{
    border-bottom:1px solid var(--line);
  }
  .faq summary{
    gap:12px;
    padding:14px 0;
    min-height:56px;
    font-size:var(--fs-sub);
  }
  .faq summary::after{
    width:14px;
    height:14px;
    background:linear-gradient(var(--orange),var(--orange)) center/14px 2px no-repeat, linear-gradient(var(--orange),var(--orange)) center/2px 14px no-repeat;
  }
  .faq details[open] summary::after{
    background:linear-gradient(var(--orange),var(--orange)) center/14px 2px no-repeat;
  }
  .faq details p{
    font-size:var(--fs-body);
    padding:0 0 14px;
  }
  .map{
    border-radius:14px;
    aspect-ratio:4/3;
  }
  .info{
    grid-template-columns:72px minmax(0,1fr);
    font-size:var(--fs-body);
  }
  .final__lead{
    font-size:var(--fs-body);
    text-shadow:0 2px 12px rgba(0,0,0,.5);
  }
  .final__title{
    font-size:var(--fs-sec);
    text-shadow:0 2px 12px rgba(0,0,0,.5);
  }
  .final__offer{
    gap:10px;
    text-shadow:0 2px 12px rgba(0,0,0,.5);
  }
  .final__invite{
    font-size:var(--fs-head);
  }
  .final__deal .final__was{
    font-size:var(--fs-sub);
  }
  .final__deal{ /* PCは「通常 → 1,000円」を1行に */
    flex-direction:row;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:8px 18px;
    margin:6px 0;
  }
  .final__arrow{
    display:block;
    font-size:var(--fs-sec);
    font-weight:900;
    color:#F2E6D8;
  }
  .final__num{
    gap:2px;
    font-size:var(--fs-sec);
  }
  .final__num b{
    font-size:clamp(72px, 44.514px + 2.6816vw, 96px); /* 72px（1025px）→96px（1920px）。⑥数字（48→64px）の1.5倍の例外 */
  }
  .final__num small{
    margin-left:2px;
    font-size:var(--fs-body);
  }
  .final__tel{
    font-size:var(--fs-body);
    text-shadow:0 1px 6px rgba(0,0,0,.5);
  }
  .final__tel a{
    text-underline-offset:3px;
  }
  .final__tel b{
    font-size:var(--fs-sub);
  }
  /* ---------- フッター・固定バー ---------- */
  .footer{
    border-top:1px solid rgba(255,255,255,.1);
    font-size:var(--fs-note);
    gap:8px;
    padding:20px max(48px,calc((100% - 1200px) / 2));
    flex-direction:row;
    justify-content:space-between;
  }
  /* 予約ボタン：下の帯はやめて、右下に追従する円形のボタンにする（1440px幅では本文の外側に収まる） */
  .cta-bar{
    gap:clamp(4.25px, 2.818px + 0.1397vw, 5.5px);
    left:auto;
    right:clamp(24px, 14.838px + 0.8939vw, 32px);
    bottom:clamp(24px, 14.838px + 0.8939vw, 32px);
    transform:none;
    width:auto;
    padding:0;
    background:none;
    border:0;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  .u-sr{
    width:1px;
    height:1px;
  }
  .cases,
  .trainers{
    scroll-padding:0 20px;
  }
  .footer small{
    font-size:var(--fs-note);
  }
  .offer__lead{
    text-shadow:0 2px 12px rgba(0,0,0,.5);
    font-size:clamp(29.4px, 22.987px + 0.6257vw, 35px);
  }
  .cp-box{
    border:3px solid #fff;
    gap:clamp(8.4px, 6.568px + 0.1788vw, 10px);
    box-shadow:5px 5px 0 rgba(0,0,0,.35);
    width:100%;
    margin-inline:auto;
    max-width:1200px;
    padding:clamp(21px, 16.419px + 0.4469vw, 25px);
    border-width:clamp(4.2px, 3.284px + 0.0894vw, 5px);
    border-radius:clamp(25.2px, 19.703px + 0.5363vw, 30px);
  }
  .cp-cell{
    border-radius:clamp(12.6px, 9.851px + 0.2682vw, 15px);
  }
  .cp-note{
    font-size:clamp(14.7px, 11.493px + 0.3128vw, 17.5px);
  }
  .cp-price{
    gap:clamp(2.1px, 1.642px + 0.0447vw, 2.5px);
  }
  .cp-grid .cp-label b{
    margin-left:clamp(2.1px, 1.642px + 0.0447vw, 2.5px);
    font-size:clamp(27.3px, 21.345px + 0.5810vw, 32.5px);
    line-height:clamp(39.9px, 31.196px + 0.8492vw, 47.5px);
  }
  .cp-cell--wide .cp-icon{
    width:clamp(50.4px, 39.406px + 1.0726vw, 60px);
    height:clamp(50.4px, 39.406px + 1.0726vw, 60px);
  }
  .cp-more{
    padding:clamp(2.1px, 1.642px + 0.0447vw, 2.5px) clamp(4.2px, 3.284px + 0.0894vw, 5px) 0;
    text-align:center;
    font-size:clamp(18.9px, 14.777px + 0.4022vw, 22.5px);
  }
  .cp-cue{
    min-height:clamp(50.4px, 39.406px + 1.0726vw, 60px);
    padding:clamp(4.2px, 3.284px + 0.0894vw, 5px) clamp(16.8px, 13.135px + 0.3575vw, 20px) 0;
    text-shadow:0 2px 10px rgba(0,0,0,.4);
    font-size:clamp(27.3px, 21.345px + 0.5810vw, 32.5px);
  }
  .perk .perk__title{
    font-size:var(--fs-head);
  }
  .perk__deal{
    margin:4px 0 2px;
    padding:14px 10px;
    border-radius:12px;
    gap:6px;
    min-height:113px;
  }
  .perk__was{
    font-size:var(--fs-body);
  }
  .perk__now{
    font-size:var(--fs-sub);
    gap:2px;
  }
  .perk__now b{
    font-size:var(--fs-num);
  }
  .perk__now small{
    font-size:var(--fs-note);
    margin-left:2px;
  }
  .perk__now--text{
    font-size:var(--fs-head);
  }
  .perk .perk__text{
    font-size:var(--fs-body);
  }
  .perk__note{
    font-size:var(--fs-note);
    padding-top:8px;
    border-top:1px dashed var(--line);
  }
  .trial-card__tag{
    top:-17px;
    font-size:var(--fs-note);
    border:2px solid #fff;
    padding:5px 16px;
    border-radius:999px;
    box-shadow:2px 2px 0 var(--brown);
    left:50%;
  }
  .trial-card__name{
    font-size:var(--fs-sub);
  }
  .trial-card__was{
    margin-top:4px;
    font-size:var(--fs-body);
  }
  .trial-card__price{
    font-size:var(--fs-sub);
    gap:2px;
  }
  .trial-card__price small{
    font-size:var(--fs-body);
    margin-left:2px;
  }
  .plan__price small{
    font-size:var(--fs-body);
    margin-left:2px;
  }
  .final__was{
    font-size:var(--fs-body);
  }
  .price-more{
    gap:6px;
    min-height:48px;
    margin-top:4px;
    font-size:var(--fs-body);
    text-underline-offset:4px;
  }
  .price-more svg{
    width:18px;
    height:18px;
  }
  /* ---------- 体験の流れ：5ステップを横に並べ、右向きの矢印でつなぐ ---------- */
  /* 体験の流れ：3列＋2列の2段。下段は中央寄せ、STEP3のあとの矢印は消す（STEP番号で順序が分かる） */
  .flow2{
    margin-top:16px;
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    grid-auto-rows:1fr; /* 上段・下段の箱をすべて同じ高さに（いちばん高い箱＝STEP5に揃う） */
    gap:48px 40px;
  }
  .flow2__step{
    border:2px solid var(--line);
    border-radius:16px;
    gap:4px;
    grid-column:span 2;
    min-width:0;
    padding:32px 8px 20px;
    justify-content:center; /* 高さを揃えた箱の中で、見出しと本文を上下中央に */
  }
  .flow2__badge{
    top:-16px;
    left:50%;
    font-size:var(--fs-note);
    border:2px solid #fff;
    padding:5px 18px;
    border-radius:999px;
    box-shadow:2px 2px 0 var(--brown);
  }
  .flow2__step h3{
    font-size:var(--fs-sub);
  }
  .flow2__text{
    font-size:var(--fs-body);
  }
  .flow2__step:nth-child(4){
    grid-column:2 / span 2;
  }
  .flow2__step:nth-child(3)::after{
    display:none;
  }
  .flow2__step:not(:last-child)::after{
    width:14px;
    height:14px;
    border-right:3px solid var(--orange);
    border-bottom:3px solid var(--orange);
    left:auto;
    right:-28px;
    top:50%;
    bottom:auto;
    transform:translateY(-50%) rotate(-45deg);
  }
  .perk-plus .perk__no{
    top:-19px;
    left:50%;
    font-size:var(--fs-sub);
    border:2px solid #fff;
    padding:6px 20px;
    border-radius:999px;
    box-shadow:2px 2px 0 var(--brown);
  }
  .perk-plus .perk__text{
    width:25em; /* PCは1行25文字に固定し、どの画面幅でも同じ位置で折り返す（「Derma Medico」が行をまたがず、行末も揃う） */
    max-width:100%;
  }
  .perk-plus .perk__title{
    font-size:var(--fs-sub);
    margin-bottom:6px;
    grid-column:1;
  }
  .info dt{
    font-size:var(--fs-sub);
    padding-top:14px;
  }
  .info dd{
    padding:2px 0 14px;
    border-bottom:1px dashed var(--line);
  }
  .info dd:last-child{
    border-bottom:0;
  }
  /* ---------- ここからPC専用レイアウト ---------- */
  /* ---------- 全体：1列表示をやめ、横幅いっぱいに。中身は最大1200pxで中央 ---------- */
  body::before{
    display:none;
  }
  .page{
    max-width:none;
    box-shadow:none;
    padding-bottom:0;
  }
  .sec{
    padding:88px max(48px,calc((100% - 1200px) / 2));
    gap:32px;
  }
  .sec--bleed{
    padding-left:max(48px,calc((100% - 1200px) / 2));
    padding-right:max(48px,calc((100% - 1200px) / 2));
  }
  .sec--bleed .sec__head{
    padding:0;
  }
  .sec__note--pad{
    padding:0;
  }
  /* ---------- FV：上に焦げ茶のヘッダー、左にタイトルロゴ、右に写真 ---------- */
  .fv{
    height:clamp(640px,var(--vh),820px);
    min-height:0;
    background:var(--cream);
  }
  .fv__header{
    height:72px;
    padding:0 max(48px,calc((100% - 1200px) / 2));
    background:var(--brown);
    z-index:2;
  }
  .fv__logo img{
    height:48px;
  }
  .fv__shade-top,
  .fv__shade-bottom{
    display:none;
  }
  .fv__body{
    top:72px;
    bottom:0;
    left:0;
    right:46%;
    padding:0 40px;
    justify-content:center;
    gap:0;
  }
  /* ---------- 2画面目：見出しの下に、体験(大)＋特典4つを横に並べる ---------- */
  .sec--campaign{
    margin-top:0;
    padding-top:clamp(75.6px, 59.108px + 1.6089vw, 90px);
    padding-bottom:clamp(50.4px, 39.406px + 1.0726vw, 60px);
    background:linear-gradient(180deg,rgba(43,29,22,.45) 0%,rgba(43,29,22,.6) 45%,rgba(43,29,22,.92) 75%,var(--brown) 100%),
  url("../img/opt/camp-bg-autumn.webp") center 30% / cover no-repeat,var(--brown);
  }
  .cp-grid{
    grid-template-columns:1.25fr 1fr 1fr;
    gap:clamp(16.8px, 13.135px + 0.3575vw, 20px);
  }
  .cp-grid .cp-cell--wide{
    grid-column:1;
    grid-row:1 / 3;
    justify-content:center;
  }
  /* ---------- キャンペーン詳細：上段3枚・下段2枚、ご紹介特典は左に説明・右に商品 ---------- */
  /* キャンペーン詳細（PC）：5枚とも同じ幅・同じ高さに。下段の2枚は中央に寄せる */
  .perks{
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    gap:20px;
    grid-auto-rows:1fr;
  }
  .perk-plus > div{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    column-gap:40px;
    align-items:center;
  }
  .perk-plus .perk__text{
    grid-column:1;
  }
  .perk-plus .deo{
    grid-column:2;
    grid-row:1 / 4;
    margin-top:0;
  }
  .sec--bleed .sec__note--pad{
    max-width:1200px;
    margin-inline:auto;
  }
  /* ---------- お客様の声：3列 ---------- */
  .sec--voice{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:32px 24px;
    align-items:stretch;
  }
  .sec--voice .sec__head,
  .sec--voice .sec__note{
    grid-column:1 / -1;
  }
  .sec--voice .sec__note{
    text-align:center;
  }
  /* ---------- 料金：体験・16回・24回を横に3枚 ---------- */
  #price{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    column-gap:20px;
    row-gap:32px;
    align-items:stretch;
  }
  #price .sec__head,
  #price .price-more,
  #price .sec__note{
    grid-column:1 / -1;
  }
  #price .sec__note{
    text-align:center;
  }
  .plans{
    grid-column:2 / 4;
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
    margin-top:20px;
  }
  /* ---------- FAQ：読みやすい幅に ---------- */
  .faq{
    max-width:1200px;
    width:100%;
    margin-inline:auto;
  }
  /* ---------- アクセス：左に地図、右に情報 ---------- */
  #access{
    display:grid;
    grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);
    column-gap:48px;
    row-gap:32px;
    align-items:start;
  }
  #access .sec__head{
    grid-column:1 / -1;
  }
  .info dt:first-child{
    padding-top:0;
  }
  /* ---------- 最終CTA ---------- */
  .final{
    padding:96px max(48px,calc((100% - 1200px) / 2)) 96px;
    gap:20px;
    align-items:center;
  }
  .cta-bar .btn-line{
    width:clamp(150px, 92.737px + 5.5866vw, 200px); /* 直径150px（1025px）→200px（1920px） */
    height:clamp(150px, 92.737px + 5.5866vw, 200px);
    border-radius:50%;
    flex-direction:column;
    gap:clamp(6px, 3.709px + 0.2235vw, 8px);
    padding:0;
    font-size:var(--fs-sub);
    line-height:1.35;
    letter-spacing:.04em;
    text-align:center;
    border:4px solid #fff;
    box-shadow:0 12px 32px rgba(43,29,22,.35);
  }
  .cta-bar .btn-line > span{ /* 「LINEで」「体験予約」を必ず2行に分け、円の中に余白を残す */
    display:flex;
    flex-direction:column;
    align-items:center;
  }
  .cta-bar .btn-line svg{
    width:clamp(32px, 22.838px + 0.8939vw, 40px);
    height:clamp(32px, 22.838px + 0.8939vw, 40px);
  }
  .footer__links{
    flex-direction:row;
    gap:24px;
  }
  /* 秋のキャンペーン（PC）：余白に対して小さく見えるため、アイコン・文字をすべて拡大 */
  .sec--campaign{
    gap:clamp(29.4px, 22.987px + 0.6257vw, 35px);
  }
  .sec--campaign .sec__en{
    font-size:clamp(18.9px, 14.777px + 0.4022vw, 22.5px);
  }
  .offer__main{
    font-size:clamp(29.4px, 22.987px + 0.6257vw, 35px);
  }
  .cp-grid .cp-cell{
    padding:clamp(33.6px, 26.27px + 0.7151vw, 40px) clamp(16.8px, 13.135px + 0.3575vw, 20px);
    gap:clamp(10.5px, 8.209px + 0.2235vw, 12.5px);
    border-radius:clamp(16.8px, 13.135px + 0.3575vw, 20px);
  }
  .cp-grid .cp-icon{
    width:clamp(79.8px, 62.392px + 1.6983vw, 95px);
    height:clamp(79.8px, 62.392px + 1.6983vw, 95px);
    padding:clamp(17.85px, 13.956px + 0.3799vw, 21.25px);
  }
  .cp-grid .cp-label{
    height:clamp(39.9px, 31.196px + 0.8492vw, 47.5px);
    line-height:clamp(39.9px, 31.196px + 0.8492vw, 47.5px);
    font-size:clamp(27.3px, 21.345px + 0.5810vw, 32.5px);
  }
  .cp-grid .cp-price,
  .cp-grid .cp-text{
    height:clamp(75.6px, 59.108px + 1.6089vw, 90px);
    line-height:clamp(75.6px, 59.108px + 1.6089vw, 90px);
  }
  .cp-grid .cp-price{
    font-size:clamp(27.3px, 21.345px + 0.5810vw, 32.5px);
  }
  .cp-grid .cp-price b{
    font-size:clamp(75.6px, 59.108px + 1.6089vw, 90px);
    line-height:clamp(75.6px, 59.108px + 1.6089vw, 90px);
  }
  .cp-grid .cp-text{
    font-size:clamp(39.9px, 31.196px + 0.8492vw, 47.5px);
  }
  .cp-cell--wide .cp-icon,
  .cp-grid .cp-cell--wide .cp-icon{
    width:clamp(105px, 82.095px + 2.2346vw, 125px);
    height:clamp(105px, 82.095px + 2.2346vw, 125px);
    padding:clamp(23.1px, 18.061px + 0.4916vw, 27.5px);
  }
  .cp-grid .cp-cell--wide .cp-label{
    height:clamp(48.3px, 37.764px + 1.0279vw, 57.5px);
    line-height:clamp(48.3px, 37.764px + 1.0279vw, 57.5px);
    font-size:clamp(35.7px, 27.912px + 0.7598vw, 42.5px);
  }
  .cp-grid .cp-cell--wide .cp-price{
    height:clamp(117.6px, 91.946px + 2.5028vw, 140px);
    line-height:clamp(117.6px, 91.946px + 2.5028vw, 140px);
    font-size:clamp(35.7px, 27.912px + 0.7598vw, 42.5px);
  }
  .cp-grid .cp-cell--wide .cp-price b{
    font-size:clamp(109.2px, 85.379px + 2.3240vw, 130px);
    line-height:clamp(117.6px, 91.946px + 2.5028vw, 140px);
  }
  .cp-cell--wide .cp-note{
    margin-top:0;
    font-size:clamp(21px, 16.419px + 0.4469vw, 25px);
  }
  .cp-cue svg{
    width:clamp(37.8px, 29.554px + 0.8045vw, 45px);
    height:clamp(37.8px, 29.554px + 0.8045vw, 45px);
  }
  .perk:nth-child(n+4){
    grid-column:span 2;
  }
  .perk:nth-child(4){
    grid-column:2 / span 2;
  }
  .fv__shade-bottom{
    top:72px;
    bottom:0;
    left:auto;
    right:0;
    width:56%;
    height:auto;
    background:linear-gradient(90deg,var(--cream) 0%,rgba(247,241,232,.85) 4%,rgba(247,241,232,.45) 8%,rgba(247,241,232,.12) 11%,rgba(247,241,232,0) 13%);
    display:none;
  }
  /* FV（PC）：秋の合成写真を全面に敷く（左＝もみじのボケ、右＝人物）。境目のぼかしは画像に焼き込み済み */
  .fv__photo{
    left:0;
    right:0;
    width:100%;
    top:72px;
    height:calc(100% - 72px);
    object-fit:cover;
    object-position:right 20%;
  }
}

/* ---------- ページ途中のLINEボタン（PCのみ）：横長の大きな長方形にして目立たせる。左端にアイコン、中央に文字、右端に「＞」。
   スマホは従来の丸みのあるボタンのまま（.btn-line--wide はPCでだけ効く） ---------- */
@media (min-width:1025px){
  .btn-line--wide{
    position:relative;
    width:clamp(760px, 599.665px + 15.6425vw, 900px); /* 760px（1025px）→900px（1920px） */
    height:clamp(160px, 137.095px + 2.2346vw, 180px); /* 160px（1025px）→180px（1920px） */
    padding:0 clamp(88px, 60.514px + 2.6816vw, 112px);
    border-radius:clamp(20px, 15.419px + 0.4469vw, 24px);
    font-size:var(--fs-sec); /* ⑤セクション見出しの大きさ（38→52px） */
    letter-spacing:.04em;
  }
  .btn-line--wide svg{ /* アイコンは左端に置き、文字はボタンの中央に（右端の「＞」と左右対称） */
    position:absolute;
    left:clamp(32px, 18.257px + 1.3408vw, 44px);
    top:50%;
    transform:translateY(-50%);
    width:clamp(48px, 29.676px + 1.7877vw, 64px);
    height:clamp(48px, 29.676px + 1.7877vw, 64px);
    stroke-width:2.2;
  }
  .btn-line--wide::after{ /* 右端の「＞」。文字と同じ色なので、ホバーで一緒に緑になる */
    content:"";
    position:absolute;
    right:clamp(40px, 26.257px + 1.3408vw, 52px);
    top:50%;
    width:clamp(18px, 11.128px + 0.6704vw, 24px);
    height:clamp(18px, 11.128px + 0.6704vw, 24px);
    border-top:4px solid currentColor;
    border-right:4px solid currentColor;
    transform:translateY(-50%) rotate(45deg);
  }
}
/* 最終CTAの横長ボタン（PCのみ）：価格の箱・電話の案内との間に上下の余白をしっかり取る（gap 20pxに加えて） */
@media (min-width:1025px){
  .final .btn-line--wide{
    margin:clamp(20px, 6.257px + 1.3408vw, 32px) 0 clamp(12px, 2.838px + 0.8939vw, 20px);
  }
}
/* ---------- ホバー演出（PCのみ）：1025px以上で、マウスなどホバーできる端末だけに付ける。
   スマホ・タブレット（タッチ操作）では、タップ後にホバー状態が残る不具合を避けるため付けない。
   押せる部品（ボタン・リンク・FAQ）にだけ付け、押せないカードには付けない（押せると誤解させないため）。
   端末の「アニメーションを減らす」設定に関係なく、どの環境でも同じ演出にする（依頼者の指示） ---------- */
@media (min-width:1025px) and (hover:hover){
  .btn-line,
  .fv__cue,
  .cp-cue,
  .price-more,
  .price-more svg,
  .faq summary,
  .faq summary::after,
  .fv__logo,
  .info a,
  .final__tel a,
  .inapp-note a,
  .footer a{
    transition:transform .25s ease, box-shadow .25s ease, background-color .2s ease, border-color .2s ease, color .2s ease, opacity .2s ease, text-decoration-color .2s ease;
  }
  /* LINEボタン（ページ内・右下の丸ボタン共通）：色が入れ替わる。緑の背景→白、白い縁・アイコン・文字→緑。あわせて少し浮き上がる */
  .btn-line:hover{
    background:#fff;
    border-color:var(--green);
    color:var(--green);
    transform:translateY(-3px);
    box-shadow:0 10px 24px rgba(43,29,22,.3);
  }
  .btn-line:active{
    transform:translateY(0);
  }
  /* 右下の丸い予約ボタン：浮き上がりの代わりに少し拡大 */
  .cta-bar .btn-line:hover{
    transform:scale(1.06);
    box-shadow:0 16px 40px rgba(43,29,22,.42);
  }
  .cta-bar .btn-line:active{
    transform:scale(1.02);
  }
  /* FV「キャンペーンをチェック」：色を濃く（矢印はもともと上下に動いているので、ホバーでは動かさない） */
  .fv__cue:hover{
    color:var(--brown);
  }
  /* 秋のキャンペーン「詳細はこちら」：文字を白く */
  .cp-cue:hover{
    color:#fff;
  }
  /* 料金「そのほかのコースは…」：下線を消し、矢印を右へ */
  .price-more:hover{
    text-decoration-color:transparent;
  }
  .price-more:hover svg{
    transform:translateX(4px);
  }
  /* FAQ：質問の文字をオレンジに、閉じているときの＋を回転（開いているときの－は回さない） */
  .faq summary:hover{
    color:var(--orange);
  }
  .faq details:not([open]) summary:hover::after{
    transform:rotate(90deg);
  }
  /* ロゴ・文中のリンク：少し薄く */
  .fv__logo:hover,
  .info a:hover,
  .final__tel a:hover,
  .inapp-note a:hover,
  .footer a:hover{
    opacity:.7;
  }
}

/* ---------- スクロールに合わせて下からふわっと表示（main.js の setupReveal が .reveal を付ける） ----------
   transform ではなく translate を使い、ボタンのホバー（transform）とぶつからないようにする。
   JSが動かないときは .js-reveal が付かないので、最初から表示される。
   ※端末の「アニメーションを減らす」設定（Windowsの「アニメーション効果」オフ、リモートデスクトップ接続など）でも動かす（依頼者の指示）。 */
.js-reveal .reveal{
  opacity:0;
  translate:0 32px;
  transition:opacity .8s ease, translate .8s cubic-bezier(.2,.7,.2,1);
  transition-delay:var(--reveal-delay,0s);
}
.js-reveal .reveal.is-shown{
  opacity:1;
  translate:0 0;
}

/* ---------- 追従する予約ボタン：最終CTAに来たらふわっと消す（main.js の setupBarHide が .is-hidden を付ける） ----------
   translate で少し下げながら透明に。消えたあとは visibility:hidden にして、押せない・Tabでも移動しない状態にする。 */
.cta-bar{
  transition:opacity .4s ease, translate .4s ease, visibility 0s linear 0s;
}
.cta-bar.is-hidden{
  opacity:0;
  translate:0 24px;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .4s ease, translate .4s ease, visibility 0s linear .4s;
}