@charset "utf-8";
/* ==========================================================================
   Hidenori流 根本マスターパッケージ LP
   SP縦1本デザイン。PCはSPをそのまま拡大表示（max-width: 34.375rem）
   ========================================================================== */

/* ---------- tokens ---------- */
:root{
  --bg:        #0a0806;
  --bg-2:      #120d08;
  --card:      #14100a;
  --gold:      #d9b45b;
  --gold-l:    #f3e3b0;
  --gold-d:    #a6791f;
  --grad-gold: linear-gradient(180deg, #f3e3b0 0%, #b98b33 100%);
  --grad-cta:  linear-gradient(90deg, #f5dfa0 0%, #d9a93f 50%, #b07e22 100%);
  --grad-orange: linear-gradient(90deg, #f6a93c 0%, #e9701b 100%);
  /* 下向き矢印バンドの色。ゴールドにする場合は var(--grad-gold) に差し替え */
  --band: linear-gradient(180deg, #ea5a22 0%, #c9270f 100%);
  /* Before の縦矢印（寒色） */
  --band-blue: linear-gradient(180deg, #2f66a8 0%, #16406f 55%, #0e2b4d 100%);
  --yellow:    #ffd83d;   /* 強調用のパキッとした黄色 */
  --cream:     #ebe2ce;
  --txt:       #e2dbcf;
  --muted:     #c6bead;
  --dim:       #b3ab9c;
  --ivory:     #f8f3e7;
  --ivory-txt: #4a4339;
  --ivory-head:#2b2013;

  --serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --sans:  "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;

  --pad: 1.5rem;
  --max: 550px;
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  /* 390pxのSPカンプを基準に、340〜550pxの範囲でそのまま拡縮する */
  font-size:calc(max(min(100vw, 550px), 340px) / 390 * 16);
}
body{
  margin:0;
  background:#000;
  color:var(--txt);
  font-family:var(--sans);
  font-size:0.875rem;
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block;}
ul,ol,dl,dd{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,p,figure,blockquote{margin:0;}
a{color:inherit;}
hr{border:0;margin:0;}
details summary::-webkit-details-marker{display:none;}

/* ---------- layout ---------- */
.wrap{
  max-width:var(--max);
  margin-inline:auto;
  background:var(--bg);
  overflow:hidden;
  position:relative;
}
.sec{
  position:relative;
  padding:2.125rem var(--pad) 2.5rem;
  background:linear-gradient(180deg, var(--bg-2) 0%, #080605 100%);
  overflow:hidden;
}
.sec__inner{position:relative;z-index:2;}
.sec__bg{position:absolute;inset:0;z-index:0;pointer-events:none;}
.sec__bg--top{inset:0 0 auto 0;height:26.25rem;}
.sec__bg .ph--bg{width:100%;height:100%;opacity:.2;}
.sec--fv .sec__bg .ph--bg{opacity:.4;}
.sec--profile .sec__bg .ph--bg{opacity:.4;}
.sec--final .sec__bg .ph--bg{opacity:.32;}
.sec__veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(10,8,6,.25) 0%, rgba(10,8,6,.8) 60%, rgba(10,8,6,1) 100%);
}

/* ---------- 画像プレースホルダ（素材が届いたら <img> に差し替え） ---------- */
.ph{
  position:relative;
  background:linear-gradient(180deg,#2a2115 0%,#100c08 100%);
  border:1px solid rgba(217,180,91,.18);
  border-radius:6px;
  overflow:hidden;
}
.ph::after{
  content:attr(data-ph);
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  padding:0.375rem;
  font-size:0.5625rem;line-height:1.4;color:var(--gold);opacity:.6;text-align:center;
  white-space:pre-line;
}
.ph--bg{border:0;border-radius:0;}
.ph--bg::after{display:none;}   /* 背景写真の指示ラベルは表示しない */

/* ---------- 共通パーツ ---------- */
.head{
  font-family:var(--serif);font-weight:900;font-size:1.625rem;line-height:1.55;
  color:#fff;letter-spacing:-.01em;
}
.head--center{text-align:center;font-size:1.5rem;line-height:1.58;}
.head em{font-style:normal;color:var(--gold-l);}
.head em.xl{font-size:1.4em;}

/* 斜めに切った帯の見出し */
.head--band{
  position:relative;
  margin:0 calc(var(--pad) * -1) 1.5rem;
  padding:0.9375rem 1.5rem 1.0625rem;
  text-align:center;font-size:1.375rem;line-height:1.55;color:#fff;
  background:
    linear-gradient(180deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 45%),
    linear-gradient(180deg, #a8391a 0%, #7d1e0a 55%, #5d1405 100%);
  text-shadow:0 1px 2px rgba(0,0,0,.45);
}
.head--band em{color:var(--yellow);}

.subhead{
  font-family:var(--serif);font-weight:900;font-size:1.25rem;line-height:1.5;
  color:#fff;text-align:center;
}
.subhead--left{text-align:left;font-size:0.96875rem;}
.subhead em{font-style:normal;color:var(--gold-l);}
.subhead em.big{font-size:1.3em;}

.lead{font-size:0.875rem;line-height:1.95;color:#c6bdac;font-weight:500;}
.lead--center{text-align:center;}
.lead em{font-style:normal;color:var(--gold-l);}
.body{font-size:0.84375rem;line-height:2;color:#dbd4c7;}
.body em{font-style:normal;color:var(--gold-l);}
.body + .body{margin-top:1rem;}
.note{font-size:0.6875rem;line-height:1.6;color:var(--dim);}
.note--center{text-align:center;}
.is-gold{color:var(--gold-l);}

.rule{height:1px;background:linear-gradient(90deg,rgba(217,180,91,0),rgba(217,180,91,.7),rgba(217,180,91,0));}
.rule--left{background:linear-gradient(90deg,rgba(217,180,91,.6),rgba(217,180,91,0));}

/* 見出し飾り（両サイド罫） */
.ornament-head{display:flex;align-items:center;gap:0.875rem;}
.ornament-head::before,.ornament-head::after{content:"";flex:1;height:1px;}
.ornament-head::before{background:linear-gradient(90deg,rgba(217,180,91,0),rgba(217,180,91,.8));}
.ornament-head::after{background:linear-gradient(90deg,rgba(217,180,91,.8),rgba(217,180,91,0));}
.ornament-head span{
  font-family:var(--serif);font-weight:900;font-size:1.125rem;color:var(--gold-l);letter-spacing:.1em;
}
.ornament-label{display:flex;align-items:center;justify-content:center;gap:0.625rem;}
.ornament-label span{font-family:var(--serif);font-weight:700;font-size:0.8125rem;color:var(--gold-l);letter-spacing:.06em;}
.ornament-label::before,.ornament-label::after{content:"";width:1.875rem;height:1px;background:rgba(217,180,91,.7);}
.ornament-label b{font-size:1.0625rem;}

/* ---------- ボタン ---------- */
.btn{
  position:relative;display:flex;align-items:center;justify-content:center;
  width:100%;min-height:4.125rem;padding:0 3.5rem;
  border-radius:999px;text-decoration:none;
  font-family:var(--serif);font-weight:900;font-size:1.375rem;letter-spacing:.02em;color:#fff;
  transition:transform .2s ease, filter .2s ease;
}
.btn--gold{background:var(--grad-cta);box-shadow:0 0.375rem 1.125rem rgba(217,166,64,.35);}
.btn--orange{background:var(--grad-orange);box-shadow:0 0.5rem 1.375rem rgba(230,115,26,.4);min-height:4.25rem;font-size:1.4375rem;}
.btn:hover{transform:translateY(-2px);filter:brightness(1.05);}
.btn:active{transform:translateY(0);}
.btn__arrow{
  position:absolute;right:1.25rem;top:50%;transform:translateY(-50%);
  width:2.125rem;height:2.125rem;border-radius:50%;background:rgba(255,255,255,.9);
}
.btn--orange .btn__arrow{background:none;width:auto;height:auto;right:1.625rem;}
.btn__arrow::after{
  content:"";position:absolute;top:50%;left:50%;
  transform:translate(-35%,-50%);
  border-style:solid;border-width:6px 0 6px 9px;
  border-color:transparent transparent transparent #b07e22;
}
.btn--orange .btn__arrow::after{
  position:static;transform:none;display:block;
  border-color:transparent transparent transparent #fff;
}
.btn--sm{min-height:3.375rem;font-size:1.1875rem;}

/* 上辺にラベルが乗るボタン */
.btn__tag{
  position:absolute;left:50%;top:-0.6875rem;transform:translateX(-50%);
  padding:0.1875rem 1.0625rem 0.25rem;border-radius:999px;
  background:#fff;border:1px solid #f58224;
  font-family:var(--sans);font-weight:700;font-size:0.75rem;line-height:1.35;
  color:#d9560a;letter-spacing:.02em;white-space:nowrap;
}
.btn--tagged .btn__arrow{
  width:2.375rem;height:2.375rem;right:1.125rem;
  background:#fff;
}
.btn--tagged .btn__arrow::after{
  position:absolute;top:50%;left:50%;transform:translate(-35%,-50%);
  display:block;border-color:transparent transparent transparent #f58224;
}

/* ---------- CTAのバウンスループ ---------- */
@keyframes ctaBounce{
  0%, 55%, 100%{transform:translateY(0);}
  63%{transform:translateY(-0.4375rem);}
  71%{transform:translateY(0);}
  78%{transform:translateY(-0.1875rem);}
  85%{transform:translateY(0);}
}
.fv__cta,
.btn--orange,
.plan__cta{animation:ctaBounce 2.8s ease-in-out infinite;}
.fixedcta .btn{animation:none;}            /* 追従バーは動かさない */

/* ---------- 見出しのスクロールアニメーション（JSで .reveal を付与） ---------- */
.reveal{opacity:0;transform:translateY(1.125rem);}
.reveal.is-in{
  opacity:1;transform:none;
  transition:opacity .7s ease, transform .75s cubic-bezier(.22,.8,.3,1);
}

/* ---------- アイコン ---------- */
.yt-icon{
  flex:0 0 auto;position:relative;
  width:2.625rem;height:1.875rem;border-radius:0.4375rem;background:var(--grad-gold);
}
.yt-icon::after{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-40%,-50%);
  border-style:solid;border-width:6px 0 6px 10px;
  border-color:transparent transparent transparent #12100b;
}
.ico-shield{
  display:inline-block;width:1rem;height:1.125rem;margin-right:0.5rem;vertical-align:-0.1875rem;
  background:var(--gold);
  clip-path:polygon(50% 0,100% 18%,100% 62%,50% 100%,0 62%,0 18%);
}
.ico-round{
  flex:0 0 auto;display:flex;align-items:center;justify-content:center;
  width:2.375rem;height:2.375rem;border-radius:50%;border:1px solid rgba(217,180,91,.6);
  color:var(--gold-l);
}
.ico-round svg{width:1.25rem;height:1.25rem;display:block;}

/* ==========================================================================
   01 FV  ── Figmaデザイン（430px基準）を390px基準のremへ換算（÷17.641）
   ========================================================================== */
.fv{
  position:relative;background:#0d0d0f;
  font-family:"Shippori Mincho B1","Noto Serif JP",serif;
}
.fv__hero{
  position:relative;height:38.347rem;overflow:hidden;
  background:linear-gradient(180deg,#171414 0%,#08080a 100%);
}
.fv__photo{position:absolute;left:1.7006rem;top:-8.2761rem;width:24.9418rem;height:39.2529rem;overflow:hidden;}
.fv__photo img{position:absolute;left:-26.46%;top:0;width:207.9%;max-width:none;height:100%;object-fit:cover;}
.fv__veil-l{
  position:absolute;left:0;top:0;width:17.0058rem;height:38.347rem;
  background:linear-gradient(90deg, rgba(8,8,10,.92) 0%, rgba(8,8,10,.4) 70%, rgba(8,8,10,0) 100%);
}
.fv__veil-d{
  position:absolute;left:-1.0771rem;top:-0.5102rem;width:35.7122rem;height:36.6454rem;
  background:linear-gradient(151.97deg, rgb(0,0,0) 31.121%, rgba(0,0,0,0) 85.763%);
}

/* キッカー */
.fv__kicker{                                /* FV最上部にぴったり付ける */
  position:absolute;left:0;right:0;top:0;z-index:3;
  height:2.75rem;
  background:var(--band);border:0;border-radius:0;
}
.fv__kicker-inner,.fv__corner{display:none;}
.fv__kicker-txt{
  display:flex;align-items:center;justify-content:center;height:100%;padding:0 0.75rem;
  font-weight:700;font-size:0.7936rem;color:#fff;letter-spacing:.0454rem;text-align:center;
  text-shadow:0 1px 2px rgba(0,0,0,.3);
}

/* 見出し */
.fv__title{
  position:absolute;left:0.6802rem;top:4rem;width:22.674rem;
  font-weight:800;line-height:1.26;color:#f5f5f2;
}
.fv__title span{display:block;}
.fv__title-l1{font-size:1.9273rem;}
.fv__title-l1 b{font-weight:800;font-size:3.5146rem;}
.fv__title-l1 i{font-style:normal;font-size:2.6076rem;}
.fv__title-l2{font-size:2.2675rem;color:#d1a34f;}
.fv__title-l3{font-size:2.2675rem;}

.fv__body{
  position:absolute;left:1.0204rem;top:15.7908rem;width:17.0058rem;
  font-family:var(--sans);font-weight:700;font-size:0.907rem;line-height:1.65;
  color:#f5f5f2;letter-spacing:.0272rem;
}
.fv__body em{font-style:normal;color:#d1a34f;}
.fv__rule{position:absolute;left:1.1337rem;top:20.9186rem;width:6.8023rem;height:0.085rem;background:#807359;}
.fv__sub{
  position:absolute;left:1.0204rem;top:21.8255rem;width:17.0058rem;
  font-family:var(--sans);font-weight:500;font-size:0.7653rem;line-height:1.72;color:#bdb8ad;
}

/* 講師 */
.fv__portrait{
  position:absolute;left:1.7006rem;top:25.875rem;width:5.2151rem;height:5.2151rem;
  object-fit:cover;
}
.fv__namebar{position:absolute;left:7.3692rem;top:26.8954rem;width:0.1134rem;height:3.1744rem;background:#dbad59;border-radius:0.0567rem;}
.fv__name{position:absolute;left:8.0494rem;top:26.4986rem;white-space:nowrap;}
.fv__name-role{font-family:var(--sans);font-weight:500;font-size:0.6236rem;line-height:1.4;color:#dbad59;letter-spacing:.0283rem;}
.fv__name-main{margin-top:0.1134rem;font-weight:700;font-size:1.4739rem;line-height:1.25;color:#f5edd9;letter-spacing:.0283rem;}
.fv__name-sub{margin-top:0.1134rem;font-family:var(--sans);font-weight:400;font-size:0.5952rem;line-height:1.4;color:#b8b2a3;letter-spacing:.0113rem;}
.fv__package{
  position:absolute;z-index:5;left:18.1395rem;top:25.1947rem;width:4.9391rem;height:6.5701rem;
  display:flex;align-items:center;justify-content:center;
}
.fv__package img{
  width:4.3648rem;height:6.1789rem;object-fit:cover;transform:rotate(5.52deg);
  box-shadow:0.1134rem 0.2268rem 0.2268rem rgba(0,0,0,.55);
}

/* 金のバッジ */
.fv__badge{
  position:absolute;left:0.6802rem;top:31.1469rem;
  display:flex;align-items:center;gap:0.5102rem;
  padding:0.4535rem 1.0204rem 0.4535rem 0.4535rem;border-radius:1.3605rem;
  background:#d1a34f;
}
.fv__badge-logo{width:1.984rem;height:1.984rem;border-radius:50%;object-fit:cover;}
.fv__badge span{font-weight:600;font-size:0.7936rem;color:#331f0a;letter-spacing:.017rem;white-space:nowrap;}
.fv__badge b{font-weight:800;font-size:0.9637rem;color:#db211c;}

/* サムネイル3枚 */
.fv__thumbs{position:absolute;left:0.907rem;top:34.6047rem;display:flex;gap:0.6802rem;}
.fv__thumbs li{width:7.029rem;height:3.7413rem;overflow:hidden;background:#0d0d0f;}
.fv__thumbs img{width:100%;height:100%;object-fit:cover;display:block;}

/* CTA */
.fv__lower{
  display:flex;flex-direction:column;
  padding:1.7006rem 1.1337rem 1.0204rem;
}
.fv__cta{
  position:relative;display:flex;align-items:center;justify-content:center;
  padding:1.2471rem 1.3605rem;border-radius:2.4942rem;text-decoration:none;
  background:linear-gradient(180deg,#f58224 0%,#f58224 45%,#bf540f 100%);
  border:0.068rem solid #f58224;
  box-shadow:0 0.2268rem 0.6802rem rgba(191,84,15,.4);
  font-weight:700;font-size:1.3038rem;line-height:1.1;color:#fff;letter-spacing:.0567rem;
  text-shadow:0 1px 2px rgba(191,84,15,.55);
  transition:transform .2s ease, filter .2s ease;
}
.fv__cta:hover{transform:translateY(-2px);filter:brightness(1.04);}
.fv__cta-tag{                               /* ボタン上辺にまたがるラベル */
  position:absolute;left:50%;top:-0.7369rem;transform:translateX(-50%);
  padding:0.1701rem 1.0204rem 0.2268rem;border-radius:999px;
  background:#fff;border:0.068rem solid #f58224;
  font-family:var(--sans);font-weight:700;font-size:0.7086rem;line-height:1.35;
  color:#d9560a;letter-spacing:.0283rem;white-space:nowrap;text-shadow:none;
}
.fv__cta-arrow{
  position:absolute;right:0.6802rem;top:50%;transform:translateY(-50%);
  display:flex;align-items:center;justify-content:center;
  width:2.6076rem;height:2.6076rem;border-radius:50%;background:#fff;
  font-style:normal;font-weight:800;font-size:1.1337rem;color:#f58224;text-shadow:none;
}
/* 実績 */
.fv__stats-wrap{padding:0.3401rem 1.1337rem 1.4739rem;}
.fv__stats{
  display:flex;align-items:stretch;
  padding:0.907rem 0.5669rem;border-radius:0.4535rem;
  background:#171614;border:1px solid #4d4230;
}
.fv__stat{flex:1 0 0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:0.2268rem;padding:0 0.1701rem;}
.fv__stat dt{
  display:flex;align-items:center;gap:0.2834rem;
  font-family:var(--sans);font-weight:700;font-size:0.7086rem;line-height:1.4;color:#fff;white-space:nowrap;
}
.fv__stat dd{
  font-family:"Shippori Mincho B1",serif;font-weight:800;line-height:1.1;color:#d1a34f;white-space:nowrap;
}
.fv__stat dd b{font-weight:800;font-size:1.25rem;}
.fv__stat dd small{font-size:0.625rem;}
.fv__stat-div{width:1px;background:#474033;align-self:stretch;}
.fv__ico-yt{
  display:flex;align-items:center;justify-content:center;
  width:1.0204rem;height:0.7369rem;border-radius:0.1701rem;background:#d1a34f;
  font-style:normal;font-weight:700;font-size:0.3968rem;color:#171412;
}
.fv__ico-dot{width:0.3968rem;height:0.3968rem;display:block;}
.fv__ico-star{font-style:normal;font-size:0.7936rem;color:#d1a34f;}

/* ==========================================================================
   02 共感・問題提起
   ========================================================================== */
/* 矢印バンドと③を重ねて地続きに見せる（矢印の先端が③に食い込む） */
.sec--problem{padding-bottom:0;z-index:2;}
.sec--konpon{z-index:1;margin-top:-0.75rem;padding-top:1rem;}

/* 写真モザイク：写真を左右交互にフルブリード。切り替えは斜めカット */
.mosaic{
  --slant:2.5rem;                   /* 斜めの深さ（大きいほど傾きが強い） */
  position:relative;overflow:hidden;
  margin:1.625rem calc(var(--pad) * -1) 0;   /* 枠をやめて画面端まで断ち切り */
  background:linear-gradient(180deg,#151109 0%,#0b0906 100%);
}
.mz{position:relative;display:flex;align-items:center;min-height:8.5rem;}
.mz + .mz{margin-top:-0.5rem;}     /* 斜めの切り替えを噛み合わせる */
.mz:nth-child(2){z-index:2;}
.mz:nth-child(3){z-index:3;}
.mz:nth-child(4){z-index:4;}

.mz__photo{
  position:absolute;top:0;bottom:0;width:64%;overflow:hidden;
}
.mz__photo img{
  position:absolute;inset:0;z-index:0;
  width:100%;height:100%;object-fit:cover;
  filter:grayscale(.32) contrast(1.06) brightness(.78);
}
.mz__photo::before{content:"";position:absolute;inset:0;z-index:1;}

/* 写真＝左：右辺を斜めに切る（下に向かって左へ傾く） */
.mz--photoL .mz__photo{
  left:0;
  clip-path:polygon(0 0, 100% 0, calc(100% - var(--slant)) 100%, 0 100%);
}
.mz--photoL .mz__photo::before{
  background:linear-gradient(100deg, rgba(11,9,6,0) 6%, rgba(11,9,6,.55) 34%, rgba(11,9,6,.9) 60%, #0b0906 80%);
}

/* 写真＝右：左辺を同じ向きに斜めに切る（＝切り替え線が全段で平行になる） */
.mz--photoR .mz__photo{
  right:0;
  clip-path:polygon(var(--slant) 0, 100% 0, 100% 100%, 0 100%);
}
.mz--photoR .mz__photo::before{
  background:linear-gradient(260deg, rgba(11,9,6,0) 6%, rgba(11,9,6,.55) 34%, rgba(11,9,6,.9) 60%, #0b0906 80%);
}

/* 高さ・幅を少しずつ変えて“モザイク”らしい揺らぎを出す */
.mz:nth-child(2){min-height:7.75rem;}
.mz:nth-child(2) .mz__photo{width:60%;}
.mz:nth-child(3) .mz__photo{width:67%;}
.mz:nth-child(4){min-height:9.75rem;}
.mz:nth-child(4) .mz__photo{width:61%;}

.mz:nth-child(1) .mz__photo img{object-position:26% 46%;}
.mz:nth-child(2) .mz__photo img{object-position:62% 50%;}
.mz:nth-child(3) .mz__photo img{object-position:18% 58%;}
.mz:nth-child(4) .mz__photo img{object-position:78% 40%;}

.mz__txt{position:relative;z-index:2;width:68%;padding:1rem 1.5rem;}
.mz--photoL .mz__txt{margin-left:auto;}
.mz--photoR .mz__txt{margin-right:auto;}
.mz__sub{
  font-size:0.84375rem;font-weight:500;line-height:1.6;color:#d5ccbb;
  text-shadow:0 1px 3px rgba(0,0,0,.9);
}
.mz__main{
  margin-top:0.25rem;
  font-family:var(--serif);font-weight:900;font-size:1.3125rem;line-height:1.45;
  color:#fff;letter-spacing:-.015em;
  text-shadow:0 2px 6px rgba(0,0,0,.95), 0 0 1.25rem rgba(0,0,0,.7);
}

/* 下向き矢印バンド（セクション③の結論を先出し） */
.arrowband{
  position:relative;margin:0 calc(var(--pad) * -1);padding:1.25rem 1.5rem 1.75rem;text-align:center;
  background:var(--band);
  clip-path:polygon(0 0,100% 0,100% 76%,50% 100%,0 76%);
}
.arrowband__sub{
  font-family:var(--serif);font-weight:700;font-size:1rem;line-height:1.5;color:rgba(255,255,255,.92);
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.arrowband__main{
  margin-top:0.25rem;
  font-family:var(--serif);font-weight:900;font-size:1.3125rem;line-height:1.45;color:#fff;
  letter-spacing:-.01em;text-shadow:0 2px 4px rgba(0,0,0,.4);
}

/* ==========================================================================
   03 根本
   ========================================================================== */
.sec--konpon .lead{margin-top:1.125rem;}
.konpon-lead{
  position:relative;z-index:1;margin-top:0;text-align:center;
  font-family:var(--serif);font-weight:700;font-size:1.0625rem;line-height:1.85;
  color:#e4dac4;letter-spacing:.01em;
}
/* 背後の放射線 */
.konpon-burst{
  position:absolute;left:50%;top:72%;z-index:-1;
  width:30rem;aspect-ratio:1;transform:translate(-50%,-50%);pointer-events:none;
  background:repeating-conic-gradient(from 0deg,
    rgba(217,180,91,.26) 0deg 5deg,
    rgba(217,180,91,0)   5deg 10deg);
  -webkit-mask-image:radial-gradient(circle, #000 6%, rgba(0,0,0,.6) 34%, transparent 66%);
  mask-image:radial-gradient(circle, #000 6%, rgba(0,0,0,.6) 34%, transparent 66%);
}
/* 根本の下：本文と講師の切り抜きを横並び */
.konpon-row{
  position:relative;z-index:1;
  display:flex;align-items:center;gap:0.25rem;
  margin-top:1rem;
}
/* 本文の背景に敷く黒。右辺を斜めに切って人物の下へ潜り込ませる */
.konpon-row::before{
  content:"";position:absolute;z-index:-1;
  top:-0.875rem;bottom:-0.875rem;
  left:calc(var(--pad) * -1);   /* 左は画面端までブリード */
  right:1.25rem;                /* 人物の下まで伸ばす */
  background:linear-gradient(90deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.82) 68%, rgba(0,0,0,.74) 100%);
  /* 人物に向かって上下から絞り、先細りさせる */
  clip-path:polygon(0 0, 100% 26%, 100% 74%, 0 100%);
}
.konpon-row .lead{flex:1;margin-top:0;text-align:left;font-size:1rem;line-height:1.85;}
.konpon-row .lead .hl{
  font-weight:700;font-size:1.0625rem;color:var(--yellow);
}
.konpon-figure{
  position:relative;z-index:0;flex:0 0 10rem;
  width:10rem;margin:0 -1.5rem -0.75rem -2.5rem;
}
.konpon-figure img{
  display:block;width:100%;height:auto;
  filter:drop-shadow(0 0.5rem 1.5rem rgba(0,0,0,.65));
}

/* メタリックな「根本」 */
.konpon-word{
  position:relative;display:block;margin-top:0.375rem;
  font-style:normal;font-weight:900;font-size:7rem;line-height:1.12;letter-spacing:.03em;
  background:linear-gradient(180deg,
    #fffdf6  0%,
    #f8ecc4 20%,
    #dfc274 40%,
    #a2731a 51%,
    #e8d494 60%,
    #fff8e4 74%,
    #c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  filter:
    drop-shadow(0 0.125rem 0.1875rem rgba(0,0,0,.75))
    drop-shadow(0 0 2rem rgba(217,180,91,.5));
}

.strip{display:flex;gap:0.5rem;margin-top:1.375rem;}
.strip .ph{flex:1;}

/* 根本の要素：金属質のグラデーション正円を少し重ねて並べる */
.orbs{
  display:flex;justify-content:center;align-items:flex-start;
  margin:1rem 0 0;padding-bottom:0;
}
.orb{
  position:relative;flex:0 0 5rem;
  aspect-ratio:1 / 1;border-radius:50%;
  display:flex;align-items:center;justify-content:center;text-align:center;
  background:
    radial-gradient(circle at 34% 24%, rgba(255,255,255,.55) 0%, rgba(255,255,255,0) 44%),
    linear-gradient(155deg, #fbf1cb 0%, #e3c574 22%, #b98b33 50%, #f4e5b2 72%, #a5771f 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,250,230,.92),
    inset 0 -0.375rem 0.875rem rgba(110,72,8,.45),
    0 0.4375rem 0.875rem rgba(0,0,0,.55);
}
.orb + .orb{margin-left:-0.25rem;}
.orb:nth-child(even){margin-top:0.75rem;}
.orb:nth-child(1){z-index:4;}
.orb:nth-child(2){z-index:3;}
.orb:nth-child(3){z-index:2;}
.orb:nth-child(4){z-index:1;}
.orb span{
  font-family:var(--serif);font-weight:900;font-size:0.875rem;line-height:1.3;
  color:#3b2a0c;text-shadow:0 1px 0 rgba(255,246,214,.55);
}
.ph--sq{aspect-ratio:1/1;border-radius:0.25rem;}
.ph--wide{aspect-ratio:9/8;border-radius:0.375rem;}
.sec--konpon .subhead{margin-top:1.125rem;}
/* 4つの力：金縁メダル＋2行コピーを2×2で */
.forces{
  display:grid;grid-template-columns:1fr 1fr;
  column-gap:0.75rem;row-gap:1.25rem;
  margin-top:1.25rem;
}
.force{display:flex;align-items:center;gap:0.5rem;}
.medal{
  position:relative;flex:0 0 3.25rem;width:3.25rem;height:3.25rem;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1;
  background:linear-gradient(160deg,#fdf3cf 0%,#dcb75f 30%,#8c6a28 62%,#f2e2ab 84%,#a5771f 100%);
  box-shadow:0 0.25rem 0.5rem rgba(0,0,0,.6);
}
.medal::before{
  content:"";position:absolute;inset:0.1875rem;border-radius:50%;
  background:radial-gradient(circle at 50% 28%, #2c2c36 0%, #101015 72%);
  box-shadow:inset 0 0 0 1px rgba(255,244,206,.55);
}
.medal b{
  position:relative;z-index:1;color:#fff;
  font-family:var(--serif);font-weight:900;font-size:1.5rem;line-height:1;
}
.force p{display:flex;flex-direction:column;gap:0.125rem;min-width:0;}
.force__sub{font-size:0.75rem;line-height:1.4;font-weight:500;color:#cfc6b5;}
.force__main{
  font-family:var(--serif);font-weight:900;font-size:0.9375rem;line-height:1.35;
  color:var(--yellow);letter-spacing:-.01em;
}

/* Before：写真2枚を中央の下向き矢印で分断 */
.ba{
  position:relative;display:flex;align-items:flex-start;gap:0;
  width:85%;margin:1.75rem auto 0;
}
.ba__col{flex:1;min-width:0;}
.ba__photo{position:relative;aspect-ratio:1 / 1;overflow:hidden;}
.ba__photo img{
  width:100%;height:100%;object-fit:cover;object-position:40% 44%;
  filter:grayscale(.3) contrast(1.05) brightness(.82);
}
.ba__col--r .ba__photo img{object-position:54% 46%;}
.ba__photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(10,8,6,.15) 0%, rgba(10,8,6,.1) 55%, rgba(10,8,6,.85) 100%);
}
.ba__arrow{
  position:absolute;z-index:3;left:50%;top:0;
  width:3rem;height:calc(100% + 2.75rem);
  transform:translateX(-50%);
  background:var(--band-blue);
  clip-path:polygon(0 0, 100% 0, 100% 84%, 50% 100%, 0 84%);
  display:flex;justify-content:center;
  padding-top:1rem;
  box-shadow:0 0 1.5rem rgba(0,0,0,.5);
}
.ba__arrow span{
  writing-mode:vertical-rl;text-orientation:upright;
  font-family:var(--serif);font-weight:900;font-size:0.9375rem;line-height:1.2;
  color:#fff;letter-spacing:.1em;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
/* After：矢印の先に置く1枚 */
.after{margin:3.5rem 0 0;}   /* 矢印の突き出し分を空けて重なりを避ける */
.after__photo{position:relative;width:100%;margin:0.875rem 0 0;overflow:hidden;}
.after__photo img{display:block;width:100%;height:auto;filter:saturate(1.06) contrast(1.04);}
.after__photo::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(10,8,6,.55) 0%, rgba(10,8,6,0) 34%, rgba(10,8,6,.2) 70%, rgba(10,8,6,.9) 100%);
}
.after__label{
  position:absolute;z-index:2;top:0.5rem;right:0.5rem;
  padding:0.125rem 0.5rem;background:rgba(0,0,0,.55);
  font-family:var(--serif);font-weight:700;font-size:0.6875rem;color:var(--gold-l);letter-spacing:.1em;
}
.after__title{
  text-align:center;
  font-family:var(--serif);font-weight:900;font-size:1.25rem;line-height:1.5;color:var(--gold-l);
}
.after__cap{
  margin-top:0.875rem;text-align:center;
  font-size:0.8125rem;line-height:1.7;color:#d9cdb4;
}

.sec--selftaught{background:#070a12;padding-top:1.25rem;}
.sec__bg--polygon{
  background:
    linear-gradient(180deg, rgba(4,6,14,.42) 0%, rgba(4,6,14,.62) 55%, rgba(4,6,14,.8) 100%),
    url("../images/section04-bg.jpg") center / cover no-repeat;
  clip-path:polygon(0 3.25rem, 100% 0, 100% 100%, 0 100%);
}

/* ==========================================================================
   04 独学の限界
   ========================================================================== */
/* 限界ボックス：左に講師の切り抜き、右にコピー。背景は人物に向かって先細り */
.limitbox{
  position:relative;z-index:1;
  display:flex;align-items:center;gap:0.5rem;
  margin-top:0;
}
.limitbox__figure{
  position:relative;z-index:0;flex:0 0 9rem;
  width:9rem;margin:0 0 -0.75rem -1.5rem;
}
.limitbox__figure img{
  display:block;width:100%;height:auto;
  filter:drop-shadow(0 0.5rem 1.25rem rgba(0,0,0,.65));
}
.limitbox__txt{flex:1;min-width:0;}
.limitbox__sub{
  font-family:var(--serif);font-weight:500;font-size:0.8125rem;line-height:1.6;
  color:#e4dac4;letter-spacing:.04em;
}
.limitbox__main{
  margin-top:0.125rem;
  display:flex;flex-direction:column;align-items:flex-start;width:100%;
  font-family:var(--serif);font-weight:900;
  color:var(--gold-l);letter-spacing:.01em;
}
.limitbox__l2{
  padding-left:0.75rem;
  font-size:1.5rem;line-height:1.1;
}
.limitbox__l2 b{font-size:3.5rem;line-height:1;letter-spacing:.02em;}
.limitbox__l3{
  align-self:flex-end;margin-top:0.125rem;
  font-size:1.5rem;line-height:1.3;
}

/* 独学の限界カード：白地＋青の見出し帯 */
.rcard{
  margin-top:1.625rem;border-radius:0;
  background:linear-gradient(180deg,#f8f3e7 0%,#ece2cf 100%);
  border:1px solid rgba(217,180,91,.5);
  box-shadow:0 0.5rem 1.25rem rgba(0,0,0,.45);
  overflow:hidden;
}
.rcard + .rcard{margin-top:0.875rem;}
.rcard__head{
  display:flex;align-items:center;gap:0.75rem;
  padding:0.625rem 0.875rem;
  background:var(--band-blue);
}
.rcard__ico{
  flex:0 0 2.375rem;height:2.375rem;display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  background:linear-gradient(180deg,#f0dda0 0%,#a6791f 100%);
  border:1px solid rgba(255,250,230,.75);
  color:#2b2013;
}
.rcard__ico svg{width:1.25rem;height:1.25rem;display:block;}
.rcard__title{
  min-width:0;
  font-family:var(--serif);font-weight:900;font-size:1rem;line-height:1.45;color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.3);
}
.rcard__title em{font-style:normal;color:var(--yellow);}
.rcard__inner{padding:0.875rem;}
.rcard__body{font-size:0.84375rem;line-height:1.85;color:var(--ivory-txt);}

/* キラーフレーズ：白カードの中に敷く濃色ブロック */
.killer{
  margin-top:0.75rem;padding:0.8125rem 0.875rem;text-align:center;border-radius:0;
  background:linear-gradient(180deg,#241a0a 0%,#120c05 100%);
  font-family:var(--serif);font-weight:900;font-size:0.84375rem;line-height:1.7;color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.3);
}
.killer em{font-style:normal;color:var(--yellow);}

.closing{
  margin-top:1.625rem;text-align:center;
  font-family:var(--serif);font-weight:700;font-size:0.9375rem;line-height:1.75;color:#fff;
}
.closing em{font-style:normal;color:var(--gold-l);}

/* ==========================================================================
   05 ピラミッド
   ========================================================================== */
/* 上達の土台図：頂点のある三角、段は金のラインで分ける */
.pyramid{
  position:relative;width:84%;margin:2rem auto 0;
  filter:drop-shadow(0 0.75rem 1.5rem rgba(0,0,0,.55))
         drop-shadow(0 0 1.5rem rgba(217,180,91,.22));
}
/* 外周の金縁（タイルより2px大きい三角を背面に敷く） */
.pyramid__rim{
  position:absolute;inset:-2px;z-index:0;
  background:linear-gradient(180deg,#f7e7b4 0%,#d9b45b 45%,#8c6a28 100%);
  clip-path:polygon(50% 0, 100% 100%, 0 100%);
}
.pyramid__tier{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;
}
.pyramid__tier p{font-family:var(--serif);font-weight:700;line-height:1.35;}
.pyramid__tier b{display:block;font-family:var(--serif);font-weight:900;line-height:1.2;letter-spacing:.04em;}
.pyramid__tier small{
  display:block;margin-top:0.1875rem;
  font-family:var(--sans);font-weight:500;font-size:0.65625rem;line-height:1.4;
}
.pyramid__tier--1{
  height:6.25rem;justify-content:flex-end;padding-bottom:0.9375rem;
  background:linear-gradient(180deg,#45454d 0%,#2b2b32 100%);
  clip-path:polygon(50% 0, 71.75% 100%, 28.25% 100%);
}
.pyramid__tier--1 b{font-size:1.25rem;color:#e8e4dc;}
.pyramid__tier--1 small{color:#a8a49c;}
.pyramid__tier--2{
  height:4.0625rem;
  background:linear-gradient(180deg,#3b3b43 0%,#252529 100%);
  clip-path:polygon(28.25% 0, 71.75% 0, 85.85% 100%, 14.15% 100%);
}
.pyramid__tier--2 b{font-size:1.375rem;color:#fff;}
.pyramid__tier--2 small{color:#b6b2aa;}
.pyramid__tier--3{
  height:4.375rem;
  background:linear-gradient(180deg,#fdf3d2 0%,#e6c97d 32%,#c69f43 66%,#9c6f1c 100%);
  clip-path:polygon(14.15% 0, 85.85% 0, 100% 100%, 0 100%);
}
.pyramid__tier--3 b{font-size:1.75rem;color:#20160a;}
.pyramid__tier--3 small{font-weight:700;color:#4a3512;}
/* 段の区切り線 */
.pyramid__line{
  position:absolute;z-index:2;left:50%;transform:translateX(-50%);height:1px;
  background:linear-gradient(90deg,rgba(217,180,91,.15),rgba(255,246,214,.95),rgba(217,180,91,.15));
}
.pyramid__line--1{top:6.25rem;width:43.5%;}
.pyramid__line--2{top:10.3125rem;width:71.7%;}
.pyramid__note{
  margin-top:1rem;text-align:center;
  font-size:0.78125rem;line-height:1.75;color:#c6bead;
}
.pyramid__note em{font-style:normal;color:var(--gold-l);}

.keybox{
  margin-top:1.75rem;padding:1.125rem;text-align:center;border-radius:0.375rem;
  background:linear-gradient(180deg,#211809 0%,#100b06 100%);
  border:1px solid rgba(217,180,91,.7);
  font-family:var(--serif);font-weight:700;font-size:0.84375rem;line-height:1.9;color:#f0e7d4;
}
.keybox em{font-style:normal;color:var(--gold-l);}

/* 結論フレーム：赤茶の外枠＋金の二重罫の黒箱＋講師の切り抜き */
.cframe{
  margin:1.75rem calc(var(--pad) * -1) 0;
  padding:1.25rem 1rem 1.375rem;
  background:linear-gradient(180deg,#6a1a07 0%,#430f03 100%);
}
.cframe__lead{
  position:relative;margin-bottom:1.5rem;text-align:center;
  font-family:var(--serif);font-weight:900;font-size:1.125rem;line-height:1.55;color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.45);
}
.cframe__lead::after{
  content:"";position:absolute;left:50%;bottom:-0.9375rem;transform:translateX(-50%);
  border-style:solid;border-width:0.6875rem 0.8125rem 0 0.8125rem;
  border-color:rgba(255,255,255,.85) transparent transparent transparent;
}
.cframe__box{
  position:relative;
  padding:1.25rem 1rem 1.25rem 8.25rem;
  background:linear-gradient(180deg,#12100c 0%,#050403 100%);
  border:1px solid rgba(217,180,91,.9);
  box-shadow:inset 0 0 0 0.25rem #050403, inset 0 0 0 0.3125rem rgba(217,180,91,.55);
}
.cframe__figure{
  position:absolute;z-index:2;left:-1.75rem;bottom:-0.5rem;
  width:9rem;margin:0;
}
.cframe__figure img{
  display:block;width:100%;height:auto;
  filter:drop-shadow(0 0.5rem 1.25rem rgba(0,0,0,.7));
}
.cframe__main{
  font-family:var(--serif);font-weight:900;font-size:1.125rem;line-height:1.5;color:#fff;
}
.cframe__main em{
  display:block;margin-top:0.125rem;font-style:normal;
  font-size:2.125rem;line-height:1.2;letter-spacing:.02em;
  background:linear-gradient(180deg,#fffdf6 0%,#f8ecc4 24%,#dfc274 46%,#a2731a 56%,#f0dda0 74%,#c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.cframe__note{
  margin-top:0.75rem;padding-top:0.75rem;border-top:1px solid rgba(217,180,91,.28);
  font-size:0.6875rem;line-height:1.75;color:#c6bead;
}
.sec--foundation{padding-top:0;}
.sec--foundation .closing{margin-top:1.625rem;}
.sec--foundation .note{margin-top:0.875rem;}

/* ==========================================================================
   06 教材との出会い
   ========================================================================== */
/* 見出し右側に演奏カットをオーバーレイ */
.storybg{
  position:absolute;z-index:-1;top:0;right:0;bottom:0;
  width:74%;
  background:url("../images/story-bg-guitar.jpg") 26% center / cover no-repeat;
}
.storybg::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg, #120d08 0%, rgba(18,13,8,.9) 22%, rgba(18,13,8,.34) 60%, rgba(18,13,8,.1) 100%),
    linear-gradient(180deg, rgba(18,13,8,.28) 0%, rgba(18,13,8,.12) 38%, rgba(18,13,8,.55) 76%, rgba(18,13,8,.78) 100%);
}
.sec--story{border-top-right-radius:3rem;padding-top:0;background:#0b0805;}
/* 黒のブロック：前面に置き、左下を丸くして赤を下から出す */
.storytop{
  position:relative;z-index:2;overflow:hidden;
  margin:0 calc(var(--pad) * -1);
  padding:2.125rem var(--pad) 2.25rem;
  background:linear-gradient(180deg,#120d08 0%,#0b0805 100%);
  border-bottom-left-radius:3rem;
}
.sec--story .head{margin-top:1.125rem;}
/* メタリックな「根本」（③と同じ質感） */
.head em.metal{
  font-style:normal;font-size:1.55em;line-height:1.15;letter-spacing:.02em;
  background:linear-gradient(180deg,#fffdf6 0%,#f8ecc4 22%,#dfc274 44%,#a2731a 55%,#f0dda0 74%,#c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.sec--story .lead{margin-top:1.25rem;}

/* 気づき：吹き出し＋特大コピー */
.verdict{margin:1.375rem 0 0;text-align:left;}
.verdict__bubble{
  position:relative;display:inline-block;
  padding:0.4375rem 1rem;border-radius:1rem;
  background:#3d3d3f;
  font-family:var(--sans);font-weight:700;font-size:0.875rem;line-height:1.45;
  color:#fff;letter-spacing:.06em;
}
.verdict__bubble::after{
  content:"";position:absolute;right:1.125rem;bottom:-0.5625rem;
  width:0.875rem;height:0.625rem;background:#3d3d3f;
  clip-path:polygon(0 0, 100% 0, 100% 100%);
}
.verdict__main{
  margin-top:0.9375rem;text-align:center;
  font-family:var(--serif);font-weight:900;font-size:2.375rem;line-height:1.25;
  letter-spacing:-.01em;white-space:nowrap;
  background:linear-gradient(180deg,#fffdf6 0%,#f8ecc4 22%,#dfc274 44%,#a2731a 55%,#f0dda0 74%,#c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 0.125rem 0.1875rem rgba(0,0,0,.7));
}
.verdict__tail{
  margin-top:0.375rem;text-align:center;
  font-family:var(--serif);font-weight:700;font-size:1rem;line-height:1.5;color:#e4dac4;
}

/* 商品名フレーム：赤茶の外枠＋金二重罫 */
/* コンクリート地：赤パネルの左右マージンから覗かせる */
.pfwrap{
  position:relative;z-index:1;
  margin:-2.5rem calc(var(--pad) * -1) 0;   /* 黒ブロックの下へ潜り込ませる */
  padding:0 var(--pad);
  background:#6e6e6e url("../images/cement.jpg") center / cover no-repeat;
}
/* コンクリート地はレッスンカットまで伸ばす */
.pfwrap__top{position:relative;z-index:1;}
.pfwrap__lower{
  position:relative;z-index:1;
  margin:0 calc(var(--pad) * -1);
  padding:1.75rem var(--pad) 2rem;          /* 赤枠の直下からグラデ開始 */
  background:linear-gradient(180deg,
    rgba(10,8,6,0) 0,
    rgba(10,8,6,.45) 1.75rem,
    rgba(10,8,6,.80) 4.5rem,
    rgba(10,8,6,.88) 100%);
}
.pfwrap::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, rgba(20,18,16,.5) 0%, rgba(20,18,16,.34) 45%, rgba(20,18,16,.5) 100%);
}
/* 紙吹雪（金箔）：透過PNGを上下2枚で散らす */
.confetti{position:absolute;inset:0 -1.875rem;z-index:2;overflow:hidden;pointer-events:none;}
.confetti img{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  display:block;width:112%;max-width:none;height:auto;
}

.productframe{
  position:relative;z-index:1;
  padding:4.25rem 1rem 1.75rem;             /* 潜った分を中身で戻す */
  background:linear-gradient(180deg,#6a1a07 0%,#430f03 100%);
  box-shadow:0 0.75rem 1.5rem rgba(0,0,0,.45);
}
.productframe__label{
  margin-bottom:0.4375rem;
  font-family:var(--serif);font-weight:700;font-size:0.8125rem;line-height:1.4;
  color:var(--gold-l);letter-spacing:.08em;
}
.productframe__label b{font-size:1.25rem;}
.productframe__box{
  position:relative;overflow:visible;
  display:flex;align-items:center;
  padding:1rem;
  background:linear-gradient(180deg,#12100c 0%,#050403 100%);
  border:1px solid rgba(217,180,91,.9);
  box-shadow:inset 0 0 0 0.25rem #050403, inset 0 0 0 0.3125rem rgba(217,180,91,.55);
}
.productframe__txt{flex:1;min-width:0;padding-right:6rem;}
.productframe__name{
  font-family:var(--serif);font-weight:900;font-size:1rem;line-height:1.5;color:#fff;
}
.productframe__name em{
  display:block;margin-top:0.125rem;font-style:normal;font-size:1.25rem;line-height:1.35;
  background:linear-gradient(180deg,#fffdf6 0%,#f6e8ba 26%,#d9b45b 52%,#a2731a 62%,#f0dda0 82%,#c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.productframe__pkg{
  position:absolute;z-index:2;right:0.25rem;top:-0.75rem;
  width:8rem;transform:rotate(8deg);
}
.productframe__pkg img{
  width:100%;height:auto;display:block;
  filter:drop-shadow(0 0.5rem 1rem rgba(0,0,0,.7));
}

.sec--story .body{margin-top:1.5rem;}
.body--center{text-align:center;}

/* たどり着いた答え＋写真 横並び */
.conclusion{margin-top:1.75rem;}
.conclusion__lead{
  font-family:var(--sans);font-size:0.8125rem;font-weight:700;letter-spacing:.06em;
  color:var(--gold);text-align:center;
}
.conclusion__lead::after{
  content:"";display:block;width:1px;height:1.125rem;margin:0.375rem auto 0;
  background:linear-gradient(180deg,var(--gold) 0%,rgba(217,180,91,0) 100%);
}
.conclusion__row{
  display:flex;flex-direction:row-reverse;align-items:center;gap:0.5rem;margin-top:0.625rem;
}
.conclusion__main{
  flex:1;min-width:0;
  font-family:var(--serif);font-weight:800;font-size:1.25rem;line-height:1.6;
  letter-spacing:.01em;color:var(--ivory);
  text-shadow:0 0.125rem 0.5rem rgba(0,0,0,.6);
}
.conclusion__figure{
  flex:0 0 38%;margin:0;
}
.conclusion__figure img{display:block;width:100%;height:auto;}

/* 20年 → 根本：金の正円バッジ */
/* ---------- 20年間の縦軸タイムライン ---------- */
.tl{margin-top:1.875rem;}
.tl__main{display:flex;align-items:stretch;}

/* 左：レッスン写真のコラージュ */
.tl__photos{flex:0 0 40%;padding:0.25rem 0;}
.tl__ph{
  margin:0;aspect-ratio:3 / 2;overflow:hidden;
  background:#f2efe8;border:0;border-radius:0;
  box-shadow:0 0.375rem 0.875rem rgba(0,0,0,.6);
}
.tl__ph img{display:block;width:100%;height:100%;object-fit:cover;}
.tl__ph:nth-child(1){transform:rotate(-3deg);margin-right:2.5rem;}
.tl__ph:nth-child(2){                       /* 2枚目：対面レッスンの縦長カット */
  aspect-ratio:3 / 4;
  transform:rotate(2.5deg);margin:0.25rem 0 0 4rem;
}
.tl__ph:nth-child(3){                       /* 3枚目：オンラインレッスンの縦長カット */
  aspect-ratio:13 / 18;
  transform:rotate(-1.75deg);margin:0.25rem 4.25rem 0 0;
}

/* 右：20年間の軸 */
.tl__axis{
  position:relative;flex:1;min-width:0;
  margin-left:2rem;padding:0.25rem 0 0 1.375rem;
}
.tl__axis::before{                          /* 軸そのもの＝20年間 */
  content:"";position:absolute;left:0.25rem;top:0.5rem;bottom:0;width:2px;
  background:linear-gradient(180deg,
    rgba(217,180,91,0) 0%, var(--gold) 6%, var(--gold) 90%, rgba(217,180,91,0) 100%);
}
.tl__steps{list-style:none;}
.tl__step{position:relative;font-size:0.84375rem;line-height:1.7;color:var(--txt);}
.tl__step + .tl__step{margin-top:1.25rem;}
.tl__step::before{                          /* 軸上のノード */
  content:"";position:absolute;left:-1.4375rem;top:0.5em;
  width:0.75rem;height:0.75rem;border-radius:50%;
  background:linear-gradient(155deg,#fbf1cb 0%,#e3c574 30%,#b98b33 70%,#a5771f 100%);
  box-shadow:0 0 0 0.1875rem rgba(10,8,6,.9), 0 0 0.5rem rgba(217,180,91,.55);
}
.tl__yr{
  display:block;margin-bottom:0.0625rem;
  font-family:var(--sans);font-weight:900;font-size:0.9375rem;letter-spacing:.02em;
  color:var(--gold-l);
}

/* 到達点：根本 */
.tl__goal{position:relative;margin-top:0.75rem;padding-top:1rem;text-align:center;}
.tl__goal::before{                          /* 軸から降りる▼ */
  content:"";position:absolute;left:calc(40% + 2.3125rem);top:-0.125rem;transform:translateX(-50%);
  width:0;height:0;border-style:solid;
  border-width:0.5rem 0.5625rem 0 0.5625rem;
  border-color:var(--gold) transparent transparent transparent;
}
.tl__goal-cap{font-size:0.8125rem;line-height:1.6;color:var(--gold);letter-spacing:.02em;}
.tl__goal-title{
  margin-top:0.25rem;
  font-family:var(--serif);font-weight:900;font-size:1.5rem;line-height:1.4;
  color:var(--gold-l);
}

/* 締め：金の二重罫の黒箱＋パッケージ（枠からはみ出し） */
.storyclose{
  position:relative;display:flex;align-items:center;gap:1rem;
  margin-top:2rem;padding:1.25rem 1.125rem;
  background:linear-gradient(180deg,#12100c 0%,#050403 100%);
  border:1px solid rgba(217,180,91,.9);
  box-shadow:inset 0 0 0 0.25rem #050403, inset 0 0 0 0.3125rem rgba(217,180,91,.55);
}
.storyclose__pkg{position:relative;flex:0 0 6rem;align-self:stretch;}
.storyclose__pkg img{
  position:absolute;left:-1.5rem;top:50%;
  transform:translateY(-50%) rotate(-6deg);
  display:block;width:8rem;max-width:none;height:auto;
  filter:drop-shadow(0 0.5rem 1rem rgba(0,0,0,.7));
}
.storyclose__txt{flex:1;min-width:0;}
.storyclose__lead{
  font-family:var(--serif);font-weight:700;font-size:0.875rem;line-height:1.7;color:#e4dac4;
}
.storyclose__main{
  margin-top:0.5rem;
  font-family:var(--serif);font-weight:900;font-size:1rem;line-height:1.6;color:#fff;
}
.storyclose__main em{font-style:normal;color:var(--gold-l);}

/* ==========================================================================
   07 教材の中身
   ========================================================================== */
/* 白いタグカード（上に穴） */
.volumes{display:flex;gap:0.5rem;margin-top:1.5rem;align-items:stretch;}
.volume{
  position:relative;flex:1;display:flex;align-items:center;justify-content:center;
  padding:2.25rem 0.375rem 1.125rem;text-align:center;
  background:linear-gradient(180deg,#fdfbf6 0%,#efe9dc 100%);
  border:0;border-radius:0;
  box-shadow:0 0.375rem 0.875rem rgba(0,0,0,.45);
}
.volume::before{                            /* パンチ穴 */
  content:"";position:absolute;top:0.875rem;left:50%;transform:translateX(-50%);
  width:0.875rem;height:0.875rem;border-radius:50%;
  background:#0c0906;
  box-shadow:inset 0 0.09375rem 0.1875rem rgba(0,0,0,.95),
             0 0.0625rem 0 rgba(255,255,255,.75);
}
.volume__title{font-family:var(--serif);font-weight:700;font-size:0.75rem;line-height:1.6;color:#2b2013;}
.volume__title b{font-size:1.0625rem;color:#b8340d;}

.sec--contents .subhead{margin-top:1.75rem;}

/* 下向き矢印が一体化したボックスを積む */
.steps{margin-top:1rem;display:flex;flex-direction:column;gap:0.375rem;}
.step{
  position:relative;display:flex;align-items:center;gap:0.875rem;
  padding:0.9375rem 1.25rem 1.875rem 1.75rem;
  background:linear-gradient(180deg,#fdfbf6 0%,#e7dfcd 100%);
  clip-path:polygon(
    0 0, 100% 0,
    100% calc(100% - 0.875rem),
    calc(50% + 1.625rem) calc(100% - 0.875rem),
    50% 100%,
    calc(50% - 1.625rem) calc(100% - 0.875rem),
    0 calc(100% - 0.875rem));
  filter:drop-shadow(0 0.25rem 0.5rem rgba(0,0,0,.55));
}
.step:last-child{                           /* 最後は矢印なし */
  padding-bottom:0.9375rem;
  clip-path:none;
}
.step__no{
  flex:0 0 1.5rem;text-align:center;
  font-family:var(--serif);font-weight:900;font-size:1.75rem;line-height:1;color:#b8340d;
}
.step p{font-size:0.9375rem;font-weight:700;line-height:1.5;color:#2b2013;}
.sec--contents .note{margin-top:0.875rem;}
/* ポイント：写真＋白パネルを左右交互に */
.point{position:relative;margin-top:2.5rem;}
.point + .point{margin-top:2.75rem;}
.point__photo{
  position:relative;z-index:3;margin:0;
  width:calc(56% + var(--pad));margin-left:calc(var(--pad) * -1);
  aspect-ratio:3 / 2;overflow:hidden;
  border:0;border-radius:0;
  box-shadow:0 0.625rem 1.5rem rgba(0,0,0,.55);
}
.point__photo img{display:block;width:100%;height:100%;object-fit:cover;}
.point--rev .point__photo{margin-left:auto;margin-right:calc(var(--pad) * -1);}
.point__body{
  position:relative;z-index:2;
  width:80%;margin:-2.25rem 0 0 auto;
  padding:3.375rem 1.125rem 1.375rem;
  background:linear-gradient(180deg,#fdfbf6 0%,#f1ebdf 100%);
  box-shadow:0 0.625rem 1.5rem rgba(0,0,0,.45);
}
.point--rev .point__body{margin:-2.25rem auto 0 0;}
.point__label{
  position:absolute;z-index:0;top:0.5rem;right:1.125rem;
  display:flex;align-items:center;
  font-family:var(--serif);line-height:1;pointer-events:none;
}
.point--rev .point__label{right:auto;left:1.125rem;}
.point__label span{
  position:relative;z-index:1;margin-right:-0.625rem;
  font-size:0.9375rem;font-weight:600;font-style:italic;letter-spacing:.16em;
  color:#c2a969;
}
.point__label b{font-size:2.875rem;font-weight:400;letter-spacing:.01em;color:#e9dfc7;}
.point__title{
  position:relative;z-index:1;
  font-family:var(--serif);font-weight:900;font-size:1rem;line-height:1.65;
  color:#8a6412;
}
.point__title em{font-style:normal;color:#b8340d;}
.point__txt{
  position:relative;z-index:1;margin-top:0.625rem;
  font-size:0.78125rem;line-height:1.85;color:#4a4339;
}

/* ==========================================================================
   08 受講生の声
   ========================================================================== */
.sec--voices .head--center{font-size:1.3125rem;}
.voice{
  position:relative;margin-top:1.5rem;overflow:hidden;
  background:linear-gradient(180deg,#fdfbf6 0%,#f1ebdf 100%);
  border-radius:0;
  box-shadow:0 0.5rem 1.25rem rgba(0,0,0,.5);
}
.voice__photo{position:relative;z-index:1;width:84%;aspect-ratio:16 / 9;}
.voice--rev .voice__photo{margin-left:auto;}
.voice__photo img{display:block;width:100%;height:100%;object-fit:cover;}
.voice__title{                              /* 写真に被せる帯文字（行ごとに段違い） */
  position:absolute;z-index:2;right:-1.75rem;bottom:0.5rem;
  font-family:var(--serif);font-weight:900;font-size:1.0625rem;line-height:1.55;
  letter-spacing:.01em;
}
.voice__title span{
  display:table;margin-left:auto;
  padding:0.375rem 1.125rem;
  background:rgba(10,8,5,.9);
  box-shadow:0 0.25rem 0.75rem rgba(0,0,0,.45);
  color:#fdf7e6;
}
.voice__title span + span{margin-top:0.3125rem;margin-right:2.75rem;}
.voice--rev .voice__title{right:auto;left:-1.75rem;}
.voice--rev .voice__title span{margin-left:0;margin-right:auto;}
.voice--rev .voice__title span + span{margin-left:2.75rem;margin-right:auto;}
.voice__body{padding:1.125rem 1.25rem 1.25rem;}
.voice__txt{font-size:0.8125rem;line-height:1.9;color:var(--ivory-txt);}
.voice__meta{
  display:flex;align-items:center;gap:0.5rem;margin-top:0.75rem;
  font-size:0.75rem;font-weight:500;color:#6e6553;
}
.stars{color:#c29028;font-weight:700;font-size:0.875rem;letter-spacing:.06em;}

/* ==========================================================================
   09 講師プロフィール
   ========================================================================== */
.sec--profile{padding-top:1.875rem;}

/* 写真＋ネームプレート＋見出し */
.intro{display:flex;align-items:center;gap:0.75rem;}
.intro__photo{position:relative;z-index:2;flex:0 0 40%;margin:0;aspect-ratio:3 / 4;overflow:hidden;}
.intro__side{flex:1;min-width:0;}
.intro__photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:41% center;}
.intro__plate{                              /* 写真の下から出てくる座布団 */
  position:relative;z-index:1;
  margin-left:-2rem;
  padding:0.5rem 0.9375rem 0.625rem 2.25rem;
  text-align:center;border:0;
  background:linear-gradient(90deg,#04060a 0%,#0e2b4d 38%,#1c4e83 72%,#2f66a8 100%);
  box-shadow:0 0.25rem 0.75rem rgba(0,0,0,.5);
}
.intro__role{font-size:0.625rem;font-weight:700;letter-spacing:.14em;color:#cfe0f2;}
.intro__name{
  margin-top:0.125rem;
  font-family:var(--serif);font-weight:900;font-size:1.5rem;line-height:1.15;color:#fff;
  text-shadow:0 0.125rem 0.375rem rgba(0,0,0,.5);
}
.intro__rule{
  display:block;width:2rem;height:1px;margin:0.3125rem auto;
  background:linear-gradient(90deg,rgba(217,180,91,0),var(--gold),rgba(217,180,91,0));
}
.intro__ruby{font-family:var(--serif);font-weight:700;font-size:0.875rem;color:#e8dfca;}
.intro__catch{
  margin-top:0.625rem;
  font-family:var(--serif);font-weight:900;font-size:0.9375rem;line-height:1.6;color:#fff;
}
.intro__catch em{font-style:normal;font-size:1.125rem;color:var(--yellow);}
.intro__txt{margin-top:1.125rem;font-size:0.84375rem;line-height:1.95;color:#d6cec0;}

.chrono{
  margin-top:1.25rem;padding:0.25rem 0.75rem;border-radius:0.375rem;
  background:rgba(0,0,0,.25);border:1px solid rgba(217,180,91,.22);
}
.chrono > div{display:flex;gap:0.5rem;padding:0.4375rem 0;}
.chrono > div + div{border-top:1px solid rgba(217,180,91,.16);}
.chrono dt{
  flex:0 0 2.375rem;font-family:var(--serif);font-weight:700;font-size:0.875rem;line-height:1.6;color:var(--gold-l);
}
.chrono dd{flex:1;font-size:0.75rem;line-height:1.6;color:#c4bba9;position:relative;padding-left:0.75rem;}
.chrono dd::before{
  content:"";position:absolute;left:0;top:0.4375rem;width:0.3125rem;height:0.3125rem;border-radius:50%;background:var(--gold);
}

/* ==========================================================================
   10 価格
   ========================================================================== */
.sec--price{padding-top:1.875rem;}
.remain{                                    /* ＼ 残り○日 ／ */
  display:flex;align-items:center;justify-content:center;gap:0.625rem;
  margin-bottom:0.4375rem;
  font-family:var(--sans);font-weight:900;font-size:0.9375rem;letter-spacing:.04em;
  color:var(--gold-l);
}
.remain b{font-family:var(--serif);font-weight:900;font-size:1.375rem;margin:0 0.125rem;}
.remain::before,.remain::after{
  content:"";width:2px;height:1.25rem;border-radius:1px;
  background:var(--gold-l);
}
.remain::before{transform:rotate(-20deg);}
.remain::after{transform:rotate(20deg);}

.offer{
  padding:0;border:0;background:none;text-align:center;
  font-family:var(--serif);font-weight:900;font-size:1.5rem;line-height:1.4;
  color:#ff4b33;letter-spacing:.01em;
  text-shadow:0 0.125rem 0.5rem rgba(0,0,0,.65);
}
.offer small{
  display:block;margin-top:0.4375rem;
  font-family:var(--sans);font-size:0.8125rem;font-weight:700;color:#ffb0a2;
}
/* 価格カルーセル */
.plans{margin:1.25rem calc(var(--pad) * -1) 0;}
.plans__track{
  display:flex;gap:0.75rem;padding:0 var(--pad) 0.5rem;
  overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;cursor:grab;
}
.plans__track::-webkit-scrollbar{display:none;}
.plan{
  flex:0 0 86%;scroll-snap-align:center;
  display:flex;flex-direction:column;align-items:center;
  padding:0.9375rem 1rem 1rem;text-align:center;border-radius:0.5rem;
  background:linear-gradient(180deg,#17130d 0%,#0d0a07 100%);
  border:1px solid rgba(74,68,56,.8);
}
.plan--rec{
  background:linear-gradient(180deg,#241a0a 0%,#120c05 100%);
  border:2px solid rgba(217,180,91,.95);
}
.plan__badge{
  display:flex;align-items:baseline;gap:0.0625rem;
  margin:-0.25rem 0 0.4375rem;padding:0.25rem 1rem 0.3125rem;border-radius:999px;
  background:var(--grad-gold);
  box-shadow:0 0.25rem 0.625rem rgba(0,0,0,.45);
  font-family:var(--sans);font-weight:900;font-size:0.8125rem;letter-spacing:.02em;color:#1a1206;
}
.plan__badge b{font-family:var(--serif);font-weight:900;font-size:1.1875rem;line-height:1;letter-spacing:-.01em;}
.plan__name{
  font-family:var(--serif);font-weight:900;font-size:1.125rem;line-height:1.35;color:#fff;
}
.plan--rec .plan__name{color:var(--gold-l);}
.plan__name small{display:block;font-size:0.75rem;font-weight:700;color:var(--dim);}
.plan--rec .plan__name small{color:#d9cdb4;}
.plan__pkg{margin-top:0.5rem;}
.plan__pkg img{
  width:auto;height:4.5rem;display:block;
  filter:drop-shadow(0 0.375rem 0.75rem rgba(0,0,0,.65));
}
.plan__was{
  margin-top:0.625rem;font-size:0.875rem;font-weight:500;color:#8d8477;
  text-decoration:line-through;text-decoration-color:rgba(200,60,40,.85);text-decoration-thickness:2px;
}
.plan__was small{font-size:0.75rem;}
.plan__now{
  margin-top:0.25rem;
  font-family:var(--serif);font-weight:900;font-size:1.125rem;line-height:1.2;color:var(--gold-l);
}
.plan__now b{font-size:1.75rem;letter-spacing:-.01em;}
.plan__now small{display:block;margin-top:0.125rem;font-family:var(--sans);font-size:0.75rem;font-weight:500;color:var(--dim);}
.plan__txt{
  margin-top:0.6875rem;padding-top:0.6875rem;border-top:1px solid rgba(217,180,91,.22);
  font-size:0.8125rem;line-height:1.7;color:#cdc4b3;text-align:left;
}
.plan__txt em{font-style:normal;font-weight:700;color:var(--yellow);}

.plan__online{
  display:flex;align-items:center;gap:0.5rem;
  width:100%;margin-top:0.625rem;padding:0.4375rem 0.625rem;
  background:linear-gradient(180deg,#fdfbf6 0%,#efe9dc 100%);border:0;
  font-size:0.75rem;line-height:1.5;color:#4a4339;text-align:left;
}
.plan__online b{font-weight:900;color:#b8340d;}
.plan__online-ico{flex:0 0 auto;display:flex;color:#b8340d;}
.plan__online-ico svg{display:block;width:1.25rem;height:1.25rem;}
.plan__note{margin-top:0.375rem;font-size:0.6875rem;line-height:1.5;color:var(--dim);text-align:left;}
.plan__cta{
  display:flex;align-items:center;justify-content:center;
  width:100%;margin-top:0.8125rem;padding:0.75rem 0.75rem;border-radius:999px;
  background:var(--grad-orange);
  box-shadow:0 0.375rem 0.75rem rgba(0,0,0,.45);
  font-family:var(--sans);font-weight:900;font-size:1rem;color:#fff;
  text-decoration:none;letter-spacing:.02em;
}
.plans__nav{
  display:flex;align-items:center;justify-content:center;gap:1rem;margin-top:0.875rem;
}
.plans__arrow{
  display:flex;align-items:center;justify-content:center;
  width:2.25rem;height:2.25rem;padding:0 0 0.125rem;
  border:1px solid rgba(217,180,91,.55);border-radius:50%;
  background:rgba(0,0,0,.45);
  font-size:1.375rem;line-height:1;color:var(--gold-l);
  cursor:pointer;-webkit-appearance:none;appearance:none;
}
.plans__arrow:disabled{opacity:.3;}
.plans__dots{display:flex;align-items:center;gap:0.5rem;}
.plans__dots button{
  width:0.5rem;height:0.5rem;padding:0;border:0;border-radius:50%;
  background:rgba(217,180,91,.32);cursor:pointer;-webkit-appearance:none;appearance:none;
  transition:background .2s, transform .2s;
}
.plans__dots button.is-on{background:var(--gold-l);transform:scale(1.25);}

/* 返金保証 */
.guarantee{
  margin-top:1.5rem;padding:1.125rem 1rem 1.25rem;
  background:#050403;border:1px solid rgba(217,180,91,.55);border-radius:0;
}
.guarantee__title{
  text-align:center;
  font-family:var(--serif);font-weight:900;font-size:1.75rem;line-height:1.3;letter-spacing:.02em;
  background:linear-gradient(180deg,#fffdf6 0%,#f8ecc4 22%,#dfc274 44%,#a2731a 56%,#f0dda0 74%,#c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
.guarantee__rule{
  display:block;height:1px;margin:0.75rem 0 0.875rem;
  background:linear-gradient(90deg,rgba(217,180,91,0),rgba(217,180,91,.75),rgba(217,180,91,0));
}
.guarantee__lead{font-size:0.75rem;line-height:1.85;color:#ded6c8;}
.guarantee__lead em{font-style:normal;font-weight:900;color:#fff;}

.guarantee__flowhead{
  margin-top:1rem;
  font-family:var(--serif);font-weight:900;font-size:0.875rem;color:var(--gold-l);letter-spacing:.04em;
}
.gflow{margin-top:0.375rem;list-style:none;counter-reset:gflow;}
.gflow li{
  position:relative;padding-left:1.25rem;
  font-size:0.75rem;line-height:1.75;color:#cdc4b3;
}
.gflow li + li{margin-top:0.125rem;}
.gflow li::before{
  counter-increment:gflow;content:counter(gflow) ".";
  position:absolute;left:0;top:0;
  font-family:var(--serif);font-weight:700;color:var(--gold);
}

/* ==========================================================================
   11 FAQ
   ========================================================================== */
.faq{margin-top:1.625rem;display:flex;flex-direction:column;gap:0.875rem;}
.qa{
  border-radius:0;padding:0.875rem;
  background:#f6f1e5;
  border:1px solid rgba(217,180,91,.6);
}
.qa summary{
  display:flex;align-items:center;gap:0.625rem;cursor:pointer;list-style:none;
  font-family:var(--serif);font-weight:700;font-size:0.84375rem;line-height:1.6;color:var(--ivory-head);
}
.qa summary::after{
  content:"";flex:0 0 auto;margin-left:auto;
  width:0.5rem;height:0.5rem;border-right:1.6px solid #8a8070;border-bottom:1.6px solid #8a8070;
  transform:rotate(45deg) translateY(-2px);transition:transform .25s ease;
}
.qa[open] summary::after{transform:rotate(-135deg) translateY(-2px);}
.qa__q{
  flex:0 0 1.625rem;height:1.625rem;display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:linear-gradient(180deg,#e7ce8b 0%,#a6791f 100%);
  font-family:var(--serif);font-weight:900;font-size:0.8125rem;color:#fff;
}
.qa__a{
  display:flex;gap:0.625rem;margin-top:0.75rem;padding-top:0.75rem;
  border-top:1px solid rgba(201,190,163,.8);
}
.qa__a span{
  flex:0 0 1.625rem;height:1.625rem;display:flex;align-items:center;justify-content:center;
  border-radius:50%;background:#d8cbae;
  font-family:var(--serif);font-weight:900;font-size:0.8125rem;color:#6b5b34;
}
.qa__a p{font-size:0.8125rem;line-height:1.9;color:var(--ivory-txt);}

/* ==========================================================================
   13 最後のCTA＋footer
   ========================================================================== */
.sec--final{
  position:relative;overflow:hidden;
  padding:2.75rem var(--pad) 0;background:#0a0806;
}
.final__bg{position:absolute;inset:0;z-index:0;}
.final__bg img{width:100%;height:100%;object-fit:cover;object-position:center bottom;}
.final__veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(10,8,6,.55) 0%, rgba(10,8,6,.72) 28%, rgba(10,8,6,.93) 62%, #0a0806 100%);
}
.final__kicker{
  text-align:center;
  font-family:var(--sans);font-weight:700;font-size:0.8125rem;letter-spacing:.08em;color:var(--gold);
}
.final__kicker em{font-style:normal;color:var(--yellow);}
.final__head{margin-top:0.875rem;text-align:center;font-family:var(--serif);font-weight:900;color:#fff;}
.final__l1,.final__l3{
  display:block;font-size:1.375rem;line-height:1.5;letter-spacing:.01em;
  text-shadow:0 0.125rem 0.5rem rgba(0,0,0,.75);
}
.final__l2{
  display:block;margin:0.125rem 0;
  font-size:3.5rem;line-height:1.15;letter-spacing:.02em;
  background:linear-gradient(180deg,#fffdf6 0%,#f8ecc4 24%,#dfc274 46%,#a2731a 56%,#f0dda0 74%,#c79c37 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 0.1875rem 0.625rem rgba(0,0,0,.7));
}
.finalpoints{margin-top:1.75rem;list-style:none;display:flex;flex-direction:column;gap:0.625rem;}
.finalpoints li{
  display:flex;align-items:center;gap:0.75rem;
  padding:0.75rem 0.875rem;
  background:rgba(6,5,3,.6);border:1px solid rgba(217,180,91,.28);
}
.finalpoints p{font-size:0.8125rem;font-weight:500;line-height:1.75;color:#ddd5c6;}
.sec--final .btn{margin-top:1.875rem;}
.footer{
  position:relative;z-index:2;
  margin:1.875rem calc(var(--pad) * -1) 0;padding:1.375rem var(--pad) 6.25rem;
  border-top:1px solid rgba(217,180,91,.2);text-align:center;
}
.footer__name{font-family:var(--serif);font-weight:700;font-size:0.84375rem;color:#e4dac4;letter-spacing:.06em;}
.footer__links{margin-top:0.5rem;font-size:0.6875rem;line-height:1.6;color:var(--dim);}
.footer__links a{text-decoration:none;white-space:nowrap;}
.footer__links a:hover{color:var(--gold-l);text-decoration:underline;}

/* ==========================================================================
   追従CTA
   ========================================================================== */
.fixedcta{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  max-width:var(--max);margin-inline:auto;
  padding:0.625rem var(--pad) calc(0.625rem + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(10,8,6,0) 0%,rgba(10,8,6,.92) 40%,rgba(10,8,6,.98) 100%);
  transform:translateY(120%);opacity:0;
  transition:transform .35s ease,opacity .35s ease;
  pointer-events:none;
}
.fixedcta.is-visible{transform:translateY(0);opacity:1;pointer-events:auto;}


@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .btn,.fixedcta,.qa summary::after{transition:none;}
  .reveal{opacity:1;transform:none;transition:none;}
  .fv__cta,.btn--orange,.plan__cta{animation:none;}
}

/* ==========================================================================
   PC（551px以上）：SPレイアウトをそのまま中央に置くだけ
   ========================================================================== */
@media (min-width:551px){
  body{background:#050403;}
  .wrap{box-shadow:0 0 0 1px rgba(217,180,91,.08), 0 0 60px rgba(0,0,0,.85);}
}

/* ==========================================================================
   PC（1180px以上）：左の余白＝プラン2つ／右の余白＝ページ内メニュー
   本文より目立たないよう、枠・背景・画像を持たせず、低コントラストで置く
   ※ PCでは html の font-size が約22.5px になるため、ここは px 指定
   ========================================================================== */
.sideplans,.sidenav{display:none;}

@media (min-width:1180px){
  .fixedcta{display:none !important;}     /* 下部の追従バーは余白の表示に置き換え */

  .sideplans,.sidenav{
    /* 上端が画面の中央より下にくる位置（高さが足りない画面では下端を24px空けて収める） */
    position:fixed;bottom:clamp(24px, calc(50vh - 440px), 25vh);z-index:40;
    width:min(260px, calc((100vw - 550px) / 2 - 56px));
    font-family:"Noto Sans JP",sans-serif;
  }

  .sideplans{display:block;left:calc((100vw - 550px) / 4);transform:translateX(-50%);}
  .sidenav{display:block;right:calc((100vw - 550px) / 4);transform:translateX(50%);}

  /* ---------- 左：プラン ---------- */
  .sideplans__tag{
    padding-bottom:12px;margin-bottom:6px;
    border-bottom:1px solid rgba(217,180,91,.2);
    font-family:var(--serif);font-weight:700;font-size:17px;letter-spacing:.08em;
    color:#ff7a5c;text-align:center;
  }

  .sideplan{padding:16px 0;text-align:center;}
  .sideplan + .sideplan{border-top:1px solid rgba(217,180,91,.14);}

  .sideplan__label{
    margin-bottom:4px;
    font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--gold);
  }
  .sideplan__name{
    font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.4;
    color:var(--gold-l);
  }
  .sideplan__desc{
    margin-top:5px;
    font-size:14px;line-height:1.6;color:rgba(226,219,207,.88);
  }
  .sideplan__btn{
    display:flex;align-items:center;justify-content:center;gap:6px;
    margin-top:12px;padding:11px 10px;border-radius:999px;
    background:transparent;border:1px solid rgba(217,180,91,.65);
    font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--gold-l);
    text-decoration:none;
    transition:background-color .2s ease, border-color .2s ease, color .2s ease;
  }
  .sideplan__btn::after{
    content:"";width:0;height:0;border-style:solid;
    border-width:4px 0 4px 6px;border-color:transparent transparent transparent currentColor;
  }
  .sideplan__btn:hover{background:rgba(217,180,91,.12);border-color:rgba(217,180,91,.8);color:var(--gold-l);}

  /* ---------- 右：ページ内メニュー ---------- */
  .sidenav__title{
    margin-bottom:10px;
    font-family:var(--serif);font-weight:700;font-size:14px;letter-spacing:.32em;
    color:var(--gold);text-align:left;padding-left:18px;
  }
  .sidenav__list{list-style:none;border-left:1px solid rgba(217,180,91,.3);}
  .sidenav__list a{
    position:relative;display:block;
    padding:10px 0 10px 18px;
    font-size:16px;font-weight:500;line-height:1.4;color:rgba(226,219,207,.85);
    text-decoration:none;
    transition:color .2s ease;
  }
  .sidenav__list a::before{                  /* 現在地のマーク（通常は非表示） */
    content:"";position:absolute;left:-3px;top:50%;transform:translateY(-50%);
    width:5px;height:5px;border-radius:50%;background:var(--gold);
    opacity:0;transition:opacity .2s ease;
  }
  .sidenav__list a:hover{color:var(--gold-l);}
  .sidenav__list a.is-current{color:var(--gold-l);}
  .sidenav__list a.is-current::before{opacity:1;}
}
}
}