/* ===================================================================
   小学生ページ /ele  v4 本組みプレビュー
   デザインの正本 ＝ 特徴ページ feature_エディトリアル案_v1.html
   ・全セレクタを .ltev4 配下にスコープ化（A-BiSUのZIP取込を想定）
   ・半角プラスは1文字も使わない（CSSの隣接セレクタは p ~ p を使う）
   ・初期非表示はCSSに書かない。JSが .wait / .anim を付けたときだけ隠す
   =================================================================== */

.ltev4{
  --orange:#E89B3C; --orange-d:#94601b;
  --marker:rgba(255,214,110,.72);
  --ease:cubic-bezier(.16,1,.3,1);
  --display:'Zen Kaku Gothic New',sans-serif;
  --body:'Noto Sans JP',sans-serif;
  --radius:2px;
  --navy:#08549b; --navy-d:#063f75; --navy-lt:#4780c5;
  --paper:#f6f8fa; --ink:#333; --sub:#5a6572;
  --hair:rgba(8,84,155,.18); --hair-strong:rgba(8,84,155,.32);
  --cta-ink:#fff;

  font-family:var(--body);background:var(--paper);color:var(--ink);
  line-height:1.95;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;min-height:100vh;
}
/* ライト固定（2026-08-31社長指摘→本番/featureのCSSを実測しダークモード非対応＝ライト固定と確認。サイト統一のため本ページも揃える） */

.ltev4 *{box-sizing:border-box;margin:0;padding:0;}

/* ★サイト側テーマCSSの一括リセット（span等を16px/400に潰す）への防御。
   font-family まで継承させないと、見出し中の span だけ本文書体になって折返しが変わる。 */
.ltev4 span,.ltev4 em,.ltev4 strong,.ltev4 b,.ltev4 i,.ltev4 small,.ltev4 mark,
.ltev4 div,.ltev4 li,.ltev4 dd,.ltev4 dt,.ltev4 td,.ltev4 th,
.ltev4 figure,.ltev4 figcaption,.ltev4 label,.ltev4 time{
  font-size:inherit;font-weight:inherit;font-family:inherit;font-style:inherit;}

.ltev4 img{max-width:100%;display:block;}
.ltev4 a{color:inherit;}

.ltev4 .shell{max-width:1240px;margin:0 auto;padding:0 clamp(20px,5vw,64px);}

/* ── 蛍光ペン ── */
.ltev4 .mk{background-image:linear-gradient(transparent 58%,var(--marker) 58%);
  background-repeat:no-repeat;background-size:0% 100%;
  transition:background-size 1s var(--ease) .2s;padding:0 .06em;}
.ltev4 .mk.in{background-size:100% 100%;}

/* ── セクション共通 ── */
.ltev4 .sec{padding:clamp(64px,10vh,120px) 0;border-top:1px solid var(--hair-strong);}
.ltev4 .sec-head{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:baseline;
  padding-bottom:clamp(28px,4vw,50px);}
.ltev4 .sec-head h2{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(27px,4.4vw,56px);line-height:1.25;letter-spacing:-.03em;}
.ltev4 .sec-head .side{font-size:12.5px;color:var(--sub);letter-spacing:.08em;line-height:1.9;}
@media (max-width:820px){
  .ltev4 .sec-head{grid-template-columns:1fr;gap:12px;}
  .ltev4 .sec-head .side{letter-spacing:.04em;}
}

.ltev4 .lead{font-size:clamp(15px,1.6vw,17px);line-height:2.05;max-width:40em;}
.ltev4 .lead ~ .lead{margin-top:14px;}
.ltev4 .note{font-size:12.5px;color:var(--sub);line-height:1.9;
  padding-top:clamp(22px,3vw,36px);margin-top:clamp(22px,3vw,36px);
  border-top:1px solid var(--hair-strong);}
.ltev4 .h3{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(20px,2.7vw,33px);line-height:1.45;letter-spacing:-.028em;
  padding-top:clamp(30px,4vw,50px);margin-top:clamp(30px,4vw,50px);
  border-top:1px solid var(--hair);}
.ltev4 .h3.first{border-top:none;padding-top:0;margin-top:clamp(26px,3.4vw,40px);}

.ltev4 .more{margin-top:clamp(20px,3vw,32px);display:flex;flex-wrap:wrap;gap:0 clamp(20px,3vw,38px);}
.ltev4 .more a{display:inline-block;font-family:var(--display);font-weight:700;font-size:14px;
  color:var(--navy);text-decoration:none;border-bottom:2px solid var(--hair-strong);
  padding:11px 0 9px;transition:border-color .3s var(--ease);}
.ltev4 .more a:hover{border-color:var(--navy);}
.ltev4 .more a:focus-visible{outline:2px solid #08549b;outline-offset:1px;box-shadow:0 0 0 1px #fff;}

/* ── CTA ── */
.ltev4 .cta{display:inline-block;font-family:var(--display);font-weight:700;font-size:16px;
  letter-spacing:.02em;color:var(--cta-ink);background:var(--navy);text-decoration:none;
  padding:17px 38px;border-radius:var(--radius);
  transition:transform .3s var(--ease),background .3s var(--ease);}
.ltev4 .cta:hover{transform:translateY(-2px);background:var(--navy-d);}
.ltev4 .cta:active{transform:translateY(0);}
.ltev4 .cta:focus-visible{outline:2px solid #08549b;outline-offset:1px;box-shadow:0 0 0 1px #fff;}

.ltev4 .act{display:flex;align-items:center;gap:clamp(12px,2vw,24px);flex-wrap:wrap;
  padding:clamp(22px,3vw,34px) 0;margin-top:clamp(22px,3vw,34px);
  border-top:1px solid var(--hair-strong);}
.ltev4 .act .msg{font-family:var(--display);font-weight:900;
  font-size:clamp(16px,2vw,22px);line-height:1.6;letter-spacing:-.02em;flex:1 1 240px;}
.ltev4 .tel{display:inline-block;padding:8px 0;font-family:var(--display);font-weight:900;
  color:var(--navy);font-size:clamp(19px,2.4vw,26px);letter-spacing:-.01em;
  text-decoration:none;white-space:nowrap;}
.ltev4 .tel .k{display:block;font-family:var(--body);font-weight:400;
  font-size:12.5px;color:var(--sub);letter-spacing:.08em;margin-bottom:2px;}
.ltev4 .tel:focus-visible{outline:2px solid #08549b;outline-offset:1px;box-shadow:0 0 0 1px #fff;}

/* ── ① ヒーロー ── */
.ltev4 .hero{padding-top:clamp(64px,10vh,104px);padding-bottom:clamp(56px,9vh,104px);}
.ltev4 .eyebrow{font-size:12px;font-weight:700;letter-spacing:.2em;color:var(--sub);
  padding-bottom:14px;margin-bottom:clamp(20px,3vw,34px);border-bottom:1px solid var(--hair-strong);}
/* テーマJS(js12)が本文の最初のh1をヘッダーへ移すため、大見出しはh2にする */
.ltev4 .hero-title{font-family:var(--display);font-weight:900;color:var(--ink);
  /* 最長行「意志が強いのではありません。」＝14字が1行に収まる上限で頭打ちにする
     （実測：shell幅1112pxで88pxだと2行に割れた） */
  font-size:clamp(23px,6.1vw,76px);line-height:1.16;letter-spacing:-.035em;
  margin-bottom:clamp(22px,3.4vw,40px);}
.ltev4 .hero-title .line{display:block;overflow:hidden;}
.ltev4 .hero-title .line > span{display:block;}
/* 競り上がりの初期状態は .anim が付いたときだけ。CSSに直接持たせると
   アニメが走らない環境で見出しが隠れたままになる。 */
.ltev4 .hero-title.anim .line > span{transform:translateY(105%);
  animation:ltev4Rise .95s var(--ease) forwards;}
.ltev4 .hero-title.anim .line:nth-child(1) > span{animation-delay:.05s;}
.ltev4 .hero-title.anim .line:nth-child(2) > span{animation-delay:.17s;}
.ltev4 .hero-title.anim .line:nth-child(3) > span{animation-delay:.29s;}
@keyframes ltev4Rise{to{transform:translateY(0);}}
.ltev4 .hero-title em{font-style:normal;color:var(--navy);}
.ltev4 .hero-lead{font-size:clamp(15px,1.55vw,17.5px);line-height:2.05;max-width:36em;color:var(--sub);font-weight:500;}
.ltev4 .hero-lead .mk{color:var(--ink);font-weight:700;}

.ltev4 .steps{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(8px,1.4vw,18px);
  font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(16px,2.2vw,26px);letter-spacing:-.02em;
  padding-top:clamp(22px,3vw,32px);margin-top:clamp(22px,3vw,32px);
  border-top:1px solid var(--hair);}
.ltev4 .steps .ar{color:var(--orange);font-size:.7em;}
.ltev4 .steps.anim .st,.ltev4 .steps.anim .ar{opacity:0;animation:ltev4Step .42s var(--ease) forwards;}
.ltev4 .steps.anim > :nth-child(1){animation-delay:.46s;}
.ltev4 .steps.anim > :nth-child(2){animation-delay:.57s;}
.ltev4 .steps.anim > :nth-child(3){animation-delay:.64s;}
.ltev4 .steps.anim > :nth-child(4){animation-delay:.75s;}
.ltev4 .steps.anim > :nth-child(5){animation-delay:.82s;}
@keyframes ltev4Step{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}

.ltev4 .hero .cta{margin-top:clamp(26px,3.6vw,40px);}
.ltev4 .hero .fine{font-size:12.5px;color:var(--sub);line-height:1.9;margin-top:16px;}

/* ── ② あるある ── */
.ltev4 .worry{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(28px,5vw,72px);row-gap:0;}
@media (max-width:820px){ .ltev4 .worry{grid-template-columns:1fr;} }
.ltev4 .worry .w{padding:clamp(26px,3.6vw,40px) 0;border-top:1px solid var(--hair);}
.ltev4 .worry .q{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(17px,2.1vw,24px);line-height:1.55;letter-spacing:-.02em;margin-bottom:12px;}
.ltev4 .worry .a{font-size:14.5px;line-height:2.05;color:var(--sub);max-width:30em;}
.ltev4 .worry .a .mk{color:var(--ink);font-weight:700;}

/* ── ③ 学習クエスト ── */
.ltev4 .quest-nums{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  padding:clamp(20px,3vw,32px) 0;}
@media (max-width:760px){ .ltev4 .quest-nums{grid-template-columns:1fr;} }
.ltev4 .qn{padding:clamp(18px,2.6vw,26px) clamp(16px,2.2vw,26px);
  border-left:1px solid var(--hair);text-align:center;}
.ltev4 .qn:first-child{border-left:none;}
@media (max-width:760px){
  .ltev4 .qn{border-left:none;border-top:1px solid var(--hair);padding-left:0;padding-right:0;}
  .ltev4 .qn:first-child{border-top:none;}
}
.ltev4 .ring{position:relative;width:132px;height:132px;margin:0 auto 12px;}
.ltev4 .ring svg{transform:rotate(-90deg);display:block;}
.ltev4 .ring .track{fill:none;stroke:var(--hair);stroke-width:7;}
.ltev4 .ring .arc{fill:none;stroke:var(--orange);stroke-width:7;stroke-linecap:round;
  stroke-dasharray:326.73;stroke-dashoffset:0;}
.ltev4 .ring .arc.anim{transition:stroke-dashoffset 1.2s var(--ease);}
.ltev4 .ring .val{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:38px;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;}
.ltev4 .ring .val small{font-size:.5em;margin-left:2px;letter-spacing:0;}
.ltev4 .qn .k{font-size:13.5px;line-height:1.9;color:var(--sub);}
.ltev4 .qn .k b{font-family:var(--display);font-weight:900;color:var(--ink);}

.ltev4 .cards{display:grid;grid-template-columns:1fr 1fr;gap:0;}
@media (max-width:820px){ .ltev4 .cards{grid-template-columns:1fr;} }
.ltev4 .cards.three{grid-template-columns:repeat(3,1fr);}
@media (max-width:900px){ .ltev4 .cards.three{grid-template-columns:1fr;} }
.ltev4 .cd{padding:clamp(22px,3vw,32px) clamp(18px,2.4vw,28px) clamp(22px,3vw,32px) 0;
  border-top:1px solid var(--hair);}
.ltev4 .cards .cd:nth-child(even){padding-left:clamp(18px,2.4vw,28px);padding-right:0;
  border-left:1px solid var(--hair);}
.ltev4 .cards.three .cd{padding-right:clamp(18px,2.4vw,28px);padding-left:clamp(18px,2.4vw,28px);
  border-left:1px solid var(--hair);}
.ltev4 .cards.three .cd:first-child{padding-left:0;border-left:none;}
.ltev4 .cards.three .cd:last-child{padding-right:0;}
@media (max-width:900px){
  .ltev4 .cards.three .cd{padding-left:0;padding-right:0;border-left:none;}
}
@media (max-width:820px){
  .ltev4 .cards .cd:nth-child(even){padding-left:0;border-left:none;}
  .ltev4 .cd{padding-right:0;}
}
.ltev4 .cd .t{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(17px,2.1vw,23px);line-height:1.5;letter-spacing:-.02em;}
.ltev4 .cd .m{font-size:12px;color:var(--sub);letter-spacing:.06em;margin-top:6px;line-height:1.8;}
.ltev4 .cd p{font-size:14.5px;line-height:2.05;color:var(--sub);margin-top:10px;}
.ltev4 .cd p .mk{color:var(--ink);font-weight:700;}

.ltev4 .qquote{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(21px,3.4vw,42px);line-height:1.45;letter-spacing:-.03em;
  padding:clamp(30px,4.4vw,56px) 0 0;margin-top:clamp(30px,4vw,50px);
  border-top:1px solid var(--hair-strong);text-align:center;}
.ltev4 .qquote .src{display:block;font-family:var(--body);font-weight:400;
  font-size:12.5px;color:var(--sub);margin-top:18px;letter-spacing:.04em;}

/* ── 実物写真：3枚組（featureの.shotsを移植）──
   カプセルの色そのものが訴求なので、グレースケールは掛けない。 */
.ltev4 .shots{display:grid;grid-template-columns:1.25fr 1fr 1fr;
  gap:clamp(10px,1.6vw,18px);margin-top:clamp(22px,3vw,34px);}
@media (max-width:760px){
  .ltev4 .shots{grid-template-columns:1fr 1fr;}
  .ltev4 .shots figure:last-child{display:none;}
}
.ltev4 .shots img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block;
  border-radius:var(--radius);}
.ltev4 .shots figcaption{font-size:12.5px;line-height:1.85;color:var(--sub);margin-top:8px;}
.ltev4 .shots-note{font-size:12px;color:var(--sub);margin-top:12px;}

/* ── 実物写真：単独1枚（学び方セクション） ── */
.ltev4 .solo-shot{max-width:420px;margin-top:clamp(24px,3.4vw,38px);}
.ltev4 .solo-shot img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;display:block;
  border-radius:var(--radius);filter:grayscale(.08) contrast(1.02);}
.ltev4 .solo-shot figcaption{font-size:12.5px;line-height:1.85;color:var(--sub);margin-top:8px;}

/* ── ④ 一貫タイムライン ── */
.ltev4 .tl{display:grid;grid-template-columns:repeat(5,1fr);gap:0;
  margin-top:clamp(10px,2vw,18px);}
.ltev4 .nd{padding-right:clamp(14px,1.8vw,24px);}
.ltev4 .nd .bar{position:relative;height:14px;margin-bottom:clamp(14px,2vw,20px);}
.ltev4 .nd .bar::before{content:"";position:absolute;left:0;right:0;top:50%;
  height:3px;margin-top:-1.5px;background:var(--hair);}
/* 既定は「描き切った状態」（実寸100%）。JSが動くときだけ scale で0から塗り足す。
   ＝JS停止でも線は引かれて見える。高さの%指定は絶対配置の解決に左右されるので使わない（実測で効かなかった）。 */
.ltev4 .nd .bar i{position:absolute;left:0;top:50%;height:3px;margin-top:-1.5px;
  background:var(--navy);width:100%;
  transform-origin:left center;transition:transform .2s linear;}
.ltev4 .nd .dot{position:absolute;left:0;top:50%;width:11px;height:11px;margin-top:-5.5px;
  border-radius:50%;background:var(--paper);border:3px solid var(--hair-strong);
  transition:border-color .4s var(--ease),transform .4s var(--ease);}
.ltev4 .nd.lit .dot{border-color:var(--orange);transform:scale(1.12);}
/* ★中学の区間だけ、線を太く・色を変える（「グッと上がる」を線の変化で見せる） */
.ltev4 .nd.mid .bar::before{height:8px;margin-top:-4px;}
.ltev4 .nd.mid .bar i{height:8px;margin-top:-4px;background:var(--orange);}
.ltev4 .nd.mid .dot{width:15px;height:15px;margin-top:-7.5px;border-color:var(--orange);}
.ltev4 .nd .g{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(15px,1.9vw,22px);line-height:1.45;letter-spacing:-.022em;margin-bottom:10px;}
.ltev4 .nd.mid .g{color:var(--orange-d);}
.ltev4 .nd p{font-size:13.5px;line-height:1.95;color:var(--sub);}
.ltev4 .nd p .mk{color:var(--ink);font-weight:700;}
/* 未到達のノードを薄くするのはJSが .anim を付けたときだけ */
.ltev4 .tl.anim .nd{opacity:.4;transition:opacity .7s var(--ease);}
.ltev4 .tl.anim .nd.lit{opacity:1;}
@media (max-width:900px){
  .ltev4 .tl{grid-template-columns:1fr;}
  .ltev4 .nd{display:grid;grid-template-columns:14px 1fr;column-gap:clamp(14px,3vw,22px);
    padding-right:0;padding-bottom:clamp(18px,3vw,26px);}
  .ltev4 .nd .bar{height:auto;width:14px;margin-bottom:0;}
  .ltev4 .nd .bar::before{left:50%;right:auto;top:0;bottom:0;height:auto;
    width:3px;margin-top:0;margin-left:-1.5px;}
  .ltev4 .nd .bar i{left:50%;top:0;bottom:0;height:auto;width:3px;
    margin-top:0;margin-left:-1.5px;transform-origin:center top;}
  .ltev4 .nd .dot{left:50%;top:0;margin-top:0;margin-left:-5.5px;}
  .ltev4 .nd.mid .bar::before{width:8px;height:auto;margin-left:-4px;}
  .ltev4 .nd.mid .bar i{width:8px;margin-left:-4px;
    height:auto;top:0;bottom:0;margin-top:0;transform-origin:center top;}
  .ltev4 .nd.mid .dot{margin-left:-7.5px;}
  .ltev4 .nd .body{padding-bottom:clamp(6px,1.4vw,12px);}
}

/* ── ⑤ 講座ハブ ── */
.ltev4 .crs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;}
@media (max-width:980px){ .ltev4 .crs-grid{grid-template-columns:1fr 1fr;} }
@media (max-width:660px){ .ltev4 .crs-grid{grid-template-columns:1fr;} }
.ltev4 .crs{display:block;text-decoration:none;color:inherit;
  padding:clamp(22px,3vw,30px) clamp(16px,2.2vw,26px);
  border-top:1px solid var(--hair);border-left:1px solid var(--hair);
  transition:background .3s var(--ease);}
.ltev4 .crs:hover{background:rgba(8,84,155,.045);}
.ltev4 .crs:focus-visible{outline:2px solid #08549b;outline-offset:-4px;
  box-shadow:inset 0 0 0 2px #fff;}
.ltev4 .crs-grid > :nth-child(1){border-left:none;}
@media (min-width:981px){ .ltev4 .crs-grid > :nth-child(4){border-left:none;} }
@media (max-width:980px) and (min-width:661px){
  .ltev4 .crs-grid > :nth-child(odd){border-left:none;}
}
@media (max-width:660px){ .ltev4 .crs{border-left:none;padding-left:0;padding-right:0;} }
.ltev4 .crs .thumb{width:100%;aspect-ratio:1/1;overflow:hidden;margin-bottom:16px;background:var(--hair);}
.ltev4 .crs .thumb img{width:100%;height:100%;object-fit:cover;
  transition:transform .5s var(--ease);}
.ltev4 .crs:hover .thumb img{transform:scale(1.03);}
.ltev4 .crs .t{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(17px,2vw,22px);line-height:1.45;letter-spacing:-.022em;}
.ltev4 .crs .m{font-size:12px;color:var(--sub);line-height:1.85;margin-top:8px;
  padding-top:8px;border-top:1px solid var(--hair);}
.ltev4 .crs p{font-size:14px;line-height:2;color:var(--sub);margin-top:10px;}
.ltev4 .crs p .mk{color:var(--ink);font-weight:700;}
.ltev4 .crs .go{display:inline-block;font-family:var(--display);font-weight:900;
  color:var(--navy);font-size:18px;margin-top:12px;
  transition:transform .3s var(--ease);}
.ltev4 .crs:hover .go{transform:translateX(6px);}

.ltev4 .super{margin-top:clamp(26px,3.6vw,44px);padding:clamp(24px,3.4vw,40px);
  border:2px solid var(--orange);border-radius:var(--radius);}
.ltev4 .super .t{font-family:var(--display);font-weight:900;color:var(--orange-d);
  font-size:clamp(20px,2.6vw,30px);line-height:1.4;letter-spacing:-.025em;}
.ltev4 .super .m{font-size:13px;color:var(--sub);margin-top:8px;padding-bottom:14px;
  border-bottom:1px solid var(--hair);line-height:1.9;}
.ltev4 .super p{font-size:14.5px;line-height:2.05;margin-top:14px;color:var(--sub);}
.ltev4 .super p .mk{color:var(--ink);font-weight:700;}
.ltev4 .super .ex{font-size:14px;line-height:2.05;color:var(--sub);margin-top:14px;
  padding-top:14px;border-top:1px solid var(--hair);}

/* ── ⑦ インタビュー ── */
.ltev4 .iv{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  gap:clamp(20px,4vw,56px);}
@media (max-width:880px){ .ltev4 .iv{grid-template-columns:1fr;gap:18px;} }
.ltev4 .iv .q{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(18px,2.3vw,27px);line-height:1.6;letter-spacing:-.025em;}
.ltev4 .iv .a{font-size:15px;line-height:2.1;}
.ltev4 .iv .a ~ .a{margin-top:14px;}

/* ── ⑧ 料金 ── */
.ltev4 .price{display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  padding:clamp(6px,1.4vw,14px) 0 0;}
@media (max-width:760px){ .ltev4 .price{grid-template-columns:1fr;} }
.ltev4 .pr{padding:clamp(22px,3vw,30px) clamp(16px,2.2vw,26px) clamp(22px,3vw,30px) 0;
  border-top:1px solid var(--hair);border-left:1px solid var(--hair);}
.ltev4 .price > :first-child{border-left:none;}
.ltev4 .price .pr:nth-child(2),.ltev4 .price .pr:nth-child(3){padding-left:clamp(16px,2.2vw,26px);}
@media (max-width:760px){ .ltev4 .pr{border-left:none;padding-left:0;padding-right:0;}
  .ltev4 .price .pr:nth-child(2),.ltev4 .price .pr:nth-child(3){padding-left:0;} }
.ltev4 .pr .v{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(28px,3.8vw,46px);line-height:1.1;letter-spacing:-.04em;
  font-variant-numeric:tabular-nums;}
.ltev4 .pr .k{font-size:14px;line-height:1.9;margin-top:10px;padding-top:10px;
  border-top:1px solid var(--hair);}
.ltev4 .pr .k .s{display:block;font-size:12px;color:var(--sub);margin-top:2px;}
.ltev4 .free{font-family:var(--display);font-weight:900;color:var(--navy);
  font-size:clamp(20px,2.8vw,32px);line-height:1.5;letter-spacing:-.025em;
  padding-top:clamp(22px,3vw,32px);margin-top:clamp(6px,1.4vw,14px);
  border-top:1px solid var(--hair-strong);}

/* ── SNS（リンクカード3枚・埋め込みなしの軽量方式） ── */
.ltev4 .sns-row{display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(12px,2vw,20px);margin-top:clamp(18px,2.6vw,28px);}
@media (max-width:820px){.ltev4 .sns-row{grid-template-columns:1fr;}}
.ltev4 .sns-card{display:block;text-decoration:none;
  border:1px solid var(--hair-strong);border-radius:var(--radius);
  padding:clamp(20px,2.8vw,30px);
  transition:border-color .3s var(--ease),transform .3s var(--ease);}
.ltev4 .sns-card:hover{border-color:var(--navy);transform:translateY(-2px);}
.ltev4 .sns-card:focus-visible{outline:2px solid var(--navy);outline-offset:3px;
  box-shadow:0 0 0 1px #fff;}
.ltev4 .sns-card .nm{display:block;font-family:var(--display);font-weight:900;
  color:var(--navy);font-size:clamp(16px,1.9vw,20px);letter-spacing:-.01em;}
.ltev4 .sns-card .hd{display:block;font-size:12.5px;color:var(--sub);
  margin-top:2px;letter-spacing:.04em;}
.ltev4 .sns-card .ds{display:block;font-size:13.5px;line-height:1.9;margin-top:10px;color:var(--ink);}

/* ── 追従バー ── */
/* iOSのホームバー分（env）を足す。envに未対応なら0扱いになるので保険の値を先に書く。 */
.ltev4 .sticky{position:fixed;left:0;right:0;bottom:0;z-index:70;
  visibility:hidden;pointer-events:none;
  display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:nowrap;
  padding:11px 16px;
  /* calc()の加算は半角プラスが必要なため使えない（A-BiSUが半角プラスを空白に変える）。
     max()なら中身がホームバーに隠れないことを同じだけ保証でき、余白も間延びしない。 */
  padding-bottom:max(11px, env(safe-area-inset-bottom, 0px));
  background:var(--paper);border-top:1px solid var(--hair-strong);
  transform:translateY(110%);transition:transform .4s var(--ease);}
.ltev4 .sticky.show{transform:none;visibility:visible;pointer-events:auto;}
.ltev4 .sticky .m{font-size:13px;font-weight:700;white-space:nowrap;}
.ltev4 .sticky .cta{padding:11px 24px;font-size:14px;white-space:nowrap;}
.ltev4 .sticky .tel{font-size:17px;padding:13px 6px;}
.ltev4 .sticky .tel .k{display:none;}
@media (max-width:620px){ .ltev4 .sticky .m{display:none;} }
/* ★360px以下は2段に折れるので、電話リンクを畳んでLINEだけにする（電話は料金セクションに残る） */
@media (max-width:360px){
  .ltev4 .sticky .tel{display:none;}
  .ltev4 .sticky .cta{padding:11px 18px;}
}
/* 退避高はJSがバーの実高（safe-area分の下パディングを含む）を測って --tail-h に入れる。
   JS停止時は clamp() の保険値が効く。 */
.ltev4 .tail{height:var(--tail-h, clamp(70px,10vh,96px));}

/* ── スクロールで現れる（控えめに） ── */
/* 初期非表示はCSSに書かない。JSが .wait を付けたときだけ隠す。 */
.ltev4 .rv{transition:opacity .85s var(--ease),transform .85s var(--ease);}
.ltev4 .rv.wait{opacity:0;transform:translateY(20px);}
.ltev4 .rv.in{opacity:1;transform:none;}
.ltev4 .rv.d1{transition-delay:.08s;}
.ltev4 .rv.d2{transition-delay:.16s;}
.ltev4 .rv.d3{transition-delay:.24s;}

@media (prefers-reduced-motion: reduce){
  .ltev4 *,.ltev4 *::before,.ltev4 *::after{animation:none !important;transition:none !important;}
  .ltev4 .rv{opacity:1;transform:none;}
  .ltev4 .mk{background-size:100% 100%;}
  .ltev4 .tl.anim .nd{opacity:1;}
}

/* ── 印刷：画面外のリビールが非表示のまま刷られて白紙になるのを防ぐ ──
   演出は全て「最終状態」に固定し、追従バーと退避スペースは刷らない。 */
@media print{
  .ltev4 *,.ltev4 *::before,.ltev4 *::after{animation:none !important;transition:none !important;}
  .ltev4{background:#fff !important;min-height:0;}
  .ltev4 .rv,.ltev4 .rv.wait{opacity:1 !important;transform:none !important;}
  .ltev4 .mk{background-size:100% 100% !important;}
  .ltev4 .hero-title.anim .line > span{transform:none !important;}
  .ltev4 .steps.anim .st,.ltev4 .steps.anim .ar{opacity:1 !important;transform:none !important;}
  .ltev4 .ring .arc{stroke-dashoffset:0 !important;}
  .ltev4 .tl.anim .nd,.ltev4 .nd{opacity:1 !important;}
  .ltev4 .nd .bar i{transform:none !important;}
  .ltev4 .nd .dot{border-color:var(--orange) !important;}
  .ltev4 .sticky{display:none !important;}
  .ltev4 .tail{display:none !important;}
  .ltev4 .sec{border-top:1px solid #bbb;page-break-inside:auto;}
  .ltev4 .sec-head{page-break-after:avoid;}
  /* 実物写真：ページまたぎで割れないようにし、幅も刷り上がりに収める */
  .ltev4 .shots{grid-template-columns:1fr 1fr 1fr;break-inside:avoid;page-break-inside:avoid;}
  .ltev4 .shots figure,.ltev4 .solo-shot{break-inside:avoid;page-break-inside:avoid;}
  .ltev4 .shots img,.ltev4 .solo-shot img{filter:none !important;max-width:100%;}
  .ltev4 .solo-shot{max-width:300px;}
}