@charset "UTF-8";
/* ============================================================
   design-2026.css ─ 虎プロ THE伝承 デザインリニューアル 2026
   index2.php（新デザイン版）専用の全面スタイルシート。
   既存の style.css / custom-2026.css は読み込まない前提で、
   現行マークアップ（旧テーマのクラス）をすべてこの1枚で再定義する。
   配色は現行を維持：
     ネイビー #000b95 ／ ブルー #4670d0 ／ レッド #CC0000・#cc170c
     グリーン #2f8536〜#4cae54 ／ オレンジ ／ クリーム #fdfce3・#fff195

   ◆ タイプスケール（PC → モバイル680px以下）
     主本文            17px → 16px
     カード内本文      16.5px → 15.5px
     リスト・表・補足  15〜15.5px → 14〜14.5px
     注記・ラベル      13.5〜14px → 12.5〜13px
     セクション見出し  32px max → 22px
     カード見出し      20〜21px → 17〜18px
   ◆ 余白（8pxグリッド）
     セクション上余白  80px → 56px
     カード間          48px → 32px
     カード内パディング 44/48px → 26/20px
   ============================================================ */

:root{
  --navy:#000b95;
  --navy-ink:#101444;
  --blue:#4670d0;
  --blue-soft:#eef2fb;
  --blue-line:#d7e0f5;
  --red:#CC0000;
  --crimson:#cc170c;
  --green:#3e9e46;
  --green-deep:#2f8536;
  --orange:#f5a623;
  --cream:#fdfce3;
  --cream-line:#f3e9a6;
  --ink:#22242e;
  --ink-2:#4a4d5a;
  --ink-3:#7a7d8c;
  --bg:#f4f6fb;
  --card:#ffffff;
  --line:#e6e9f2;
  --shadow-s:0 1px 2px rgba(16,20,68,.05),0 2px 8px rgba(16,20,68,.05);
  --shadow-m:0 2px 4px rgba(16,20,68,.05),0 12px 32px rgba(16,20,68,.08);
  --serif:'Noto Serif JP',"游明朝",YuMincho,"Hiragino Mincho ProN",serif;
  --sans:'Noto Sans JP',"Hiragino Kaku Gothic ProN",Meiryo,sans-serif;
}

/* ---------- リセット＋ベース ---------- */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  font-family:var(--sans);
  font-size:17px;line-height:2.0;color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
  font-feature-settings:"palt";
}
img{max-width:100%;height:auto;border:0}
iframe{border:0;max-width:100%}
a{color:var(--blue)}
em{font-style:normal}
table{border-collapse:collapse}

/* ---------- 旧ユーティリティ（マークアップ互換） ---------- */
.nbsp{display:none}                       /* 旧スペーサーは無効化し、余白はCSSで設計 */
.center{text-align:center}
.clearfix::after{content:"";display:table;clear:both}
.strong,.b{font-weight:700}
.clr-red{color:var(--red)}
.s{font-size:13.5px}
.m{font-size:14.5px}
.l{font-size:18px}
.ll{font-size:20px}
.lll{font-size:21px}
.lh140{line-height:1.7}
.mincho{font-family:var(--serif)}
.notosans{font-family:var(--sans)}
.mt0{margin-top:0 !important;}.mb0{margin-bottom:0 !important;}
.mt5{margin-top:4px !important;}.mb5{margin-bottom:4px !important;}
.mt10{margin-top:8px !important;}.mb10{margin-bottom:8px !important;}
.mb15{margin-bottom:12px !important;}.mb20{margin-bottom:16px !important;}
.mt30{margin-top:24px !important;}.mb30{margin-bottom:24px !important;}
.pt0{padding-top:0 !important;}.pt15{padding-top:12px !important;}
.pb5{padding-bottom:4px !important;}.pb10{padding-bottom:8px !important;}
.max-w700px{max-width:700px;margin-left:auto;margin-right:auto}
.hr{display:none}
.border{border:1px solid var(--line)}

/* 旧・下線強調 → マーカーハイライトへ */
u{
  text-decoration:none;
  background:linear-gradient(transparent 62%,#ffe9a8 62%);
}
h4 u,h5 u{background:none}

/* ---------- ページ骨格 ---------- */
#main{padding:0 0 96px}
.wrap{width:100%}
.copy-section{padding:0 16px}

/* ---------- ファーストビュー ---------- */
.head-copy-container{
  margin:0 -16px 0;
  padding:40px 16px 56px;
  text-align:center;
  background:
    radial-gradient(1100px 460px at 50% -10%,#1b2ac0 0%,transparent 60%),
    linear-gradient(160deg,#050d63 0%,var(--navy) 45%,#03084d 100%);
  border-bottom:0;
}
.head-copy-container img{
  max-width:860px;width:100%;
  border-radius:16px;
  box-shadow:0 20px 60px rgba(0,0,0,.45);
  margin:0 auto;
}

/* ---------- セクション見出し ---------- */
h3.sec-title{
  max-width:760px;
  margin:80px auto 40px;
  padding:0 8px;
  text-align:center;
  font-size:clamp(22px,4.2vw,32px);
  font-weight:900;
  line-height:1.55;
  color:var(--navy-ink);
  letter-spacing:.02em;
}
h3.sec-title[data-kicker]::before{
  content:attr(data-kicker);
  display:block;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.24em;
  color:var(--blue);
  margin-bottom:12px;
}
h3.sec-title::after{
  content:"";
  display:block;
  width:48px;height:4px;border-radius:2px;
  margin:20px auto 0;
  background:linear-gradient(90deg,var(--navy),var(--blue));
}

/* ---------- コンテンツカード（.letter） ---------- */
.letter{
  max-width:760px;
  margin:0 auto 48px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow-s);
  padding:44px 48px;
  overflow-wrap:break-word;
}
.letter p{font-size:17px;margin:0 0 1.15em;line-height:2.05;text-wrap:pretty}
.letter p:last-child{margin-bottom:0}

/* カード直下の素のリスト（実演リスト・提供物リスト等） */
.letter > ul{list-style:none;margin:4px 0 1.3em;display:grid;gap:10px}
.letter > ul > li{
  position:relative;
  padding-left:24px;
  font-size:16.5px;
  line-height:2.0;
  color:var(--ink-2);
}
.letter > ul > li::before{
  content:"";
  position:absolute;
  left:4px;top:.8em;
  width:8px;height:8px;border-radius:50%;
  background:var(--blue);
}

/* 中央揃えの見出しは行末が揃うように改行を均等化 */
h3.sec-title,
.letter h4,
.testimonial h4,
.plan > h4,
.consult-cta h4,
.info > p:first-child{text-wrap:balance}
/* リード文はbalanceだと語の途中で割れるため、pretty（孤立行の回避のみ）に変更 */
.sub-copy p{text-wrap:pretty}

/* カード内の中見出し（h4） */
.letter h4{
  margin:44px auto 20px;
  text-align:center;
  font-size:28px;
  font-weight:900;
  color:var(--navy-ink);
  line-height:1.6;
}
.letter h4:first-child{margin-top:0}
.letter > h5{
  margin:8px 0 14px;
  font-size:17px;
  font-weight:700;
  color:var(--navy);
}

/* 締切バッジ・個別相談だけのletterはカード装飾を外す */
.letter:has(> .timecounter),
.letter:has(> .consult-cta){
  background:transparent;
  border:none;
  box-shadow:none;
  padding:0;
}

/* ---------- 締切バッジ（N7a）＋旧カウントダウン ---------- */
.timecounter{
  width:max-content;
  max-width:100%;
  margin:32px auto 8px;
  background:#fff;
  border:2px solid var(--red);
  border-radius:999px;
  padding:12px 30px;
  color:var(--red);
  font-weight:900;
  font-size:18px;
  line-height:1.7;
  text-align:center;
  box-shadow:var(--shadow-s);
}
.timecounter .cntdwn_timer .timer_num{font-size:1.25em;margin:0 2px;font-variant-numeric:tabular-nums}
.timecounter .cntdwn_timer .timer_str{font-size:.85em;margin-right:4px}
.webinar_cntdwn{max-width:760px;margin:0 auto}

/* ---------- リード（sub-copy） ---------- */
.sub-copy{
  max-width:720px;
  margin:48px auto;
  padding:0 0;
  text-align:center;
}
.sub-copy p{
  font-family:var(--serif);
  font-size:clamp(17px,2.4vw,21px);
  line-height:2.2;
  color:var(--navy-ink);
  margin-bottom:1.2em;
}

/* ---------- 悩みチェックリスト ---------- */
.bullet{display:grid;gap:20px;margin:8px 0 16px}
.bullet h3{
  display:flex;
  gap:14px;
  align-items:flex-start;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px 20px;
  box-shadow:var(--shadow-s);
  font-size:16.5px;
  font-weight:500;
  line-height:1.9;
}
.bullet h3 .icon-ok-1{
  flex:none;
  width:26px;height:26px;
  margin-top:5px;
  border-radius:50%;
  background:var(--blue-soft);
  color:var(--blue);
  display:grid;
  place-items:center;
  font-size:13px;
}
.bullet h3 .sec-title{font-weight:500}
.bullet h3 strong{color:var(--crimson)}

/* ---------- 汎用パネル（.box：ある人は/流れ/事務情報） ---------- */
.box{
  background:var(--blue-soft);
  border-radius:14px;
  padding:28px 30px;
  margin:15px 0 20px;
}
.box ul,.box ol{list-style:none;display:grid;gap:12px;margin:0}
.box li{
  position:relative;
  padding-left:24px;
  font-size:16.5px;
  line-height:2.0;
}
.box li::before{
  content:"";
  position:absolute;
  left:4px;top:.85em;
  width:8px;height:8px;border-radius:50%;
  background:var(--blue);
}
.box h4{text-align:left;font-size:15px;letter-spacing:.1em;color:var(--navy);margin:24px 0 10px}
.box h4:first-child{margin-top:0}

/* ---------- ストーリー（N10）ダークカード ---------- */
.letter.story{
  background:linear-gradient(165deg,#0d1240 0%,#1a2058 100%);
  border:none;
  box-shadow:var(--shadow-m);
}
.letter.story p{color:#dde1f4;font-size:16.5px;line-height:2.25}

/* ---------- 締切（N7b）：白ベース＋赤アクセントの落ち着いた強調 ---------- */
.letter.deadline{
  background:#fff;
  border:1px solid #f1cdc9;
  border-top:5px solid var(--crimson);
  box-shadow:var(--shadow-s);
  text-align:center;
}
.letter.deadline p{color:var(--ink-2);font-size:16.5px;line-height:2.1}
.letter.deadline p:first-child{
  color:var(--crimson);
  font-weight:900;
  font-size:19px;
  line-height:1.9;
  text-wrap:balance;
}

/* ---------- 受講生の声 ---------- */
.testimonial{
  position:relative;
  border:1px solid var(--line);
  border-radius:16px;
  padding:34px 32px;
  margin:0 0 32px;
  background:#fff;
  box-shadow:var(--shadow-s);
  overflow:hidden;
}
.testimonial::before{
  content:"“";
  position:absolute;
  top:10px;left:16px;
  font-family:var(--serif);
  font-size:96px;
  line-height:1;
  color:var(--blue-soft);
}
.testimonial h4{
  position:relative;
  margin:0 0 12px;
  text-align:center;
  font-size:20px;
  font-weight:900;
  line-height:1.7;
  color:var(--navy-ink);
}
.testimonial h5{
  margin:0 0 22px;
  text-align:center;
  font-size:16px;
  font-weight:700;
  letter-spacing:.06em;
  color:var(--ink);
  line-height:1.7;
}
.testimonial h5 .m{display:block;font-size:13.5px;font-weight:500;color:var(--ink-3)}
.testimonial p{font-size:16.5px;color:var(--ink-2);line-height:2.05}
.testimonial u.strong,.testimonial u{color:var(--ink)}

.testimonial-disclaimer{
  margin:4px auto 0;
  max-width:640px;
  text-align:center;
  font-size:14px;
  color:var(--ink-2);
  background:#fff;
  border:1px solid var(--line);
  border-radius:10px;
  padding:10px 16px;
}

/* ---------- 動画枠 ---------- */
.video-container{
  width:100%;
  max-width:720px;
  margin:0 auto 24px;
}
.content-video{
  position:relative;
  overflow:hidden;
  height:0;
  padding-bottom:56.25%;
  border-radius:12px;
  background:linear-gradient(160deg,#0a1160,#28359f);
  box-shadow:var(--shadow-s);
}
.content-video iframe{
  position:absolute;
  top:0;left:0;
  width:100%;height:100%;
}

/* ---------- 特徴・特典カード（content-list） ---------- */
.content-list{
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  margin:0 0 24px;
  background:#fff;
  box-shadow:var(--shadow-s);
}
.chapter-title{
  background:var(--blue-soft);
  border-bottom:1px solid var(--blue-line);
  padding:18px 26px;
}
.chapter-text h3{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  margin:0;
  font-size:18px;
  font-weight:900;
  line-height:1.6;
  color:var(--navy-ink);
}
.chapter-num{
  flex:none;
  display:inline-block;
  background:linear-gradient(135deg,var(--navy),var(--blue));
  color:#fff;
  border-radius:8px;
  padding:4px 13px;
  font-size:12.5px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1.6;
  white-space:nowrap;
}
.chapter-num.red{background:linear-gradient(135deg,#d5453c,var(--crimson))}
.chapter-content-inner{padding:26px 30px}
.chapter-content-inner p{margin:0 0 1em;font-size:16.5px;line-height:2.0;color:var(--ink-2)}
.chapter-content-inner p:last-child{margin-bottom:0}
.chapter-content-inner ul{margin:0 0 1em 1.4em;list-style:disc}
.chapter-content-inner li{font-size:16.5px;color:var(--ink-2);line-height:1.9;margin-bottom:4px}

/* ---------- カリキュラム（section-box） ---------- */
.section-box{
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  margin:0 0 28px;
  background:#fff;
  box-shadow:var(--shadow-s);
}
.section-box > h5{
  margin:0;
  background:linear-gradient(135deg,var(--navy) 0%,#2b3fb0 60%,var(--blue) 100%);
  color:#fff;
  padding:20px 28px;
  font-size:20px;
  font-weight:900;
  line-height:1.7;
}
.section-box > h5 em{
  display:inline-block;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.3);
  border-radius:8px;
  padding:2px 12px;
  margin-bottom:8px;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.1em;
}
.section-box > h5 em span{font-weight:400}
.section-box > h5.pt0{padding-top:0}
.section-box-inner{padding:28px 30px}
.section-box-inner p{margin:0 0 1em;font-size:16.5px;line-height:2.05;color:var(--ink-2)}
.section-box-inner p:last-child{margin-bottom:0}
.section-box-inner ul{margin:0 0 1em 1.4em;list-style:disc}
.section-box-inner li{font-size:16.5px;color:var(--ink-2);line-height:1.9;margin-bottom:4px}
.section-box-inner h5{
  margin:0 0 14px;
  font-family:var(--serif);
  font-size:21px;
  font-weight:700;
  text-align:center;
  color:var(--crimson);
  line-height:1.8;
}
.section-box-inner h6{
  font-size:22px;
  font-weight:900;
  color:var(--navy-ink);
  margin:16px 0 8px;
}
.profile-box{text-align:center;margin-bottom:12px}
.profile-box img{max-width:300px;border-radius:14px;margin:0 auto}

/* ---------- Q&Aタイトル枠（N11） ---------- */
.qa-titles{
  margin:26px 30px 30px;
  background:var(--blue-soft);
  border:1px solid var(--blue-line);
  border-radius:12px;
  padding:20px 24px;
}
.qa-titles__label{
  position:relative;
  padding-left:32px;
  margin:0 0 12px;
  font-size:14px;
  font-weight:700;
  color:var(--navy);
  line-height:1.8;
}
.qa-titles__label::before{
  content:"Q";
  position:absolute;
  left:0;top:2px;
  width:22px;height:22px;
  border-radius:6px;
  background:var(--navy);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:900;
}
.qa-titles ul{list-style:none;margin:0;display:grid;gap:7px}
.qa-titles li{
  position:relative;
  padding-left:16px;
  font-size:14.5px;
  color:var(--ink-2);
  line-height:1.8;
  margin:0;
}
.qa-titles li::before{
  content:"";
  position:absolute;
  left:0;top:.72em;
  width:6px;height:6px;border-radius:50%;
  background:var(--blue);
}

/* ---------- 内訳表（table.designed） ---------- */
table.designed{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  background:#fff;
  box-shadow:var(--shadow-s);
  font-size:15.5px;
  margin:8px 0 16px;
}
table.designed th{
  text-align:left;
  padding:15px 22px;
  background:#f8faff;
  color:var(--navy-ink);
  font-weight:700;
  width:52%;
  border-top:1px solid var(--line);
}
table.designed td{
  text-align:right;
  padding:15px 22px;
  color:var(--ink-2);
  border-top:1px solid var(--line);
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}
table.designed tr:first-child th,
table.designed tr:first-child td{border-top:none}
table.designed tr:last-child th,
table.designed tr:last-child td{
  background:var(--blue-soft);
  color:var(--navy-ink);
  font-weight:900;
  font-size:17px;
}
table.designed p{margin:0;line-height:1.8}
table.designed td p{white-space:nowrap;text-wrap:nowrap}   /* 数値セルの折返し防止 */

/* ---------- 受講プラン（N6） ---------- */
.plan{
  max-width:760px;
  margin:0 auto 32px;
  background:#fff;
  border:1px solid var(--line);
  border-top:6px solid var(--blue);
  border-radius:20px;
  box-shadow:var(--shadow-m);
  padding:36px 0 36px;
}
.plan > h4{
  margin:0 32px 6px;
  text-align:center;
  font-size:21px;
  font-weight:900;
  color:var(--navy-ink);
  line-height:1.6;
}
.plan > p{margin:0 36px 14px;font-size:16px;line-height:2.0;color:var(--ink-2)}
.plan p.plan__badge{
  display:block;
  width:max-content;
  margin:-58px auto 20px;
  background:var(--crimson);
  color:#fff;
  border:3px solid var(--bg);
  border-radius:999px;
  padding:5px 24px;
  font-size:13px;
  font-weight:900;
  letter-spacing:.16em;
  box-shadow:var(--shadow-s);
}
.plan p.plan__price{
  text-align:center;
  color:var(--red);
  font-weight:900;
  font-size:36px;
  letter-spacing:.02em;
  line-height:1.4;
  font-variant-numeric:tabular-nums;
  margin:6px 32px 20px;
}
.plan ul{
  list-style:none;
  margin:0 36px 22px;
  display:grid;
  gap:10px;
}
.plan li{
  position:relative;
  padding-left:26px;
  font-size:15.5px;
  line-height:1.9;
  color:var(--ink-2);
}
.plan li::before{
  content:"✓";
  position:absolute;
  left:2px;top:0;
  color:var(--green);
  font-weight:900;
}
.plan__addition{
  margin:0 36px 20px;
  background:var(--blue-soft);
  border:1px dashed var(--blue);
  border-radius:12px;
  padding:18px 20px;
}
.plan__addition p{
  margin:0 0 6px !important;
  font-size:14.5px;
  line-height:1.95;
  color:var(--ink);
}
.plan__addition p:first-child{font-weight:900;color:var(--navy)}
.plan p.plan__note{
  text-align:center;
  font-weight:900;
  color:var(--crimson);
  font-size:15.5px;
}
.plan--recommended{border:2px solid var(--crimson);border-top:6px solid var(--crimson);padding-top:44px}
.plan--option{border-top-color:#aeb4c8}
.plan--option > h4{color:var(--ink)}
.plan--option p.plan__price{font-size:28px}
.plan a.button{margin-top:10px}

/* 支払方法（.letter.payment） */
.letter.payment{
  background:var(--blue-soft);
  border:1px solid var(--blue-line);
  box-shadow:none;
  padding:30px 36px;
}
.letter.payment h4{
  margin:0 0 12px;
  text-align:left;
  font-size:15px;
  letter-spacing:.14em;
  color:var(--navy);
}
.letter.payment p{
  position:relative;
  padding-left:20px;
  margin:0 0 8px;
  font-size:15px;
  line-height:1.9;
  color:var(--ink-2);
}
.letter.payment p::before{
  content:"";
  position:absolute;
  left:2px;top:.8em;
  width:7px;height:7px;border-radius:50%;
  background:var(--blue);
}

/* ---------- ボタン ---------- */
a.button,a.button:link,a.button:visited{
  display:block;
  max-width:520px;
  margin:12px auto;
  background:linear-gradient(180deg,#4cae54,var(--green-deep));
  color:#fff !important;
  text-decoration:none;
  text-align:center;
  border-radius:14px;
  box-shadow:0 4px 14px rgba(47,133,54,.35);
  transition:transform .15s ease,box-shadow .15s ease;
}
a.button:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 22px rgba(47,133,54,.42);
  color:#fff !important;
  text-decoration:none;
}
a.button br{display:none}
a.button .btn-text{
  display:block;
  padding:21px 26px;
  font-weight:900;
  font-size:19px;
  line-height:1.6;
  letter-spacing:.04em;
}
a.button .btn-text.ll{font-size:18px}
a.button .icon{margin-right:6px}

.print-button,.print-button:link,.print-button:visited{
  display:inline-block;
  background:#fff;
  color:var(--ink) !important;
  border:1px solid #d8cd7a;
  border-radius:12px;
  text-decoration:none;
  box-shadow:var(--shadow-s);
  transition:transform .15s ease;
}
.print-button:hover{transform:translateY(-2px);text-decoration:none}
.print-button .btn-text{
  display:block;
  padding:14px 28px;
  font-size:16px;
  font-weight:700;
  line-height:1.6;
}

/* ---------- 個別相談（consult-cta） ---------- */
.consult-cta{
  max-width:700px;
  margin:32px auto 8px;
  background:var(--cream);
  border:1px solid var(--cream-line);
  border-radius:18px;
  padding:40px 36px;
  text-align:center;
  box-shadow:var(--shadow-s);
}
.consult-cta h4{
  margin:0 0 14px;
  font-size:20px;
  font-weight:900;
  color:var(--navy-ink);
  line-height:1.6;
}
.consult-cta p{margin:0 0 .6em;font-size:15.5px;line-height:2.0;color:var(--ink-2)}
.consult-cta p strong{color:var(--ink)}
.consult-cta .print-button{margin-top:12px}

/* ---------- 申込フォーム ---------- */
.form-section{margin-top:8px}
.form-section-content-inner > .info{margin-top:56px}
.form-content{margin-top:8px}
.form-content label{
  display:block;
  margin:26px 0 8px;
  font-weight:700;
  font-size:15px;
  color:var(--navy-ink);
}
.require{color:var(--crimson);margin-left:4px}
.form-content input[type="text"],
.form-content input[type="email"],
.form-content select,
.form-content textarea{
  width:100%;
  padding:13px 14px;
  font-size:15.5px;
  font-family:inherit;
  color:var(--ink);
  background:#fbfcfe;
  border:1px solid #ccd2e3;
  border-radius:10px;
}
.form-content input:focus,
.form-content select:focus,
.form-content textarea:focus{
  outline:2px solid var(--blue);
  outline-offset:1px;
  border-color:var(--blue);
}
.form-content .clearfix{display:flex;gap:12px}
.form-content .clearfix input{flex:1}
.form-content .chapter-content{
  background:var(--blue-soft);
  border:1px solid var(--blue-line);
  border-radius:14px;
  margin-bottom:10px;
}
.form-content .chapter-content .chapter-content-inner{padding:26px 28px}
.form-content .chapter-content h4{
  margin:0 0 14px;
  text-align:left;
  font-size:17px;
  color:var(--navy-ink);
}
.service-list ul{list-style:disc;margin:0 0 1em 1.4em}
.service-list li{font-size:15px;line-height:1.9;color:var(--ink-2);margin-bottom:6px}

.submit_button{
  display:block;
  width:100%;
  max-width:560px;
  margin:32px auto 8px;
  background:linear-gradient(180deg,#4cae54,var(--green-deep));
  color:#fff;
  border:none;
  border-radius:14px;
  padding:20px 26px;
  font-family:inherit;
  font-size:18px;
  font-weight:900;
  letter-spacing:.04em;
  line-height:1.6;
  cursor:pointer;
  box-shadow:0 4px 14px rgba(47,133,54,.35);
  transition:transform .15s ease,box-shadow .15s ease;
}
.submit_button:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(47,133,54,.42)}
.submit_button .btn-text{display:inline;padding:0;border:none}
.submit_button .icon{margin-right:6px}

.error_message{
  background:#fdecea;
  border:1px solid #f5c6c0;
  border-radius:10px;
  padding:16px 20px;
  text-align:center;
  margin-bottom:20px;
}
.error_message .alert{color:var(--crimson);font-weight:900;font-size:16px}

/* ---------- FAQ ---------- */
.info > p:first-child{
  margin:0 0 28px;
  text-align:center;
  font-size:24px;
  font-weight:900;
  color:var(--navy-ink);
}
.info > p:first-child u{background:none}
.info ul{list-style:none;margin:0;display:grid;gap:18px}
.info li.faq{
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  padding:28px 30px;
  box-shadow:var(--shadow-s);
  min-width:0;               /* グリッド項目が長いURL等で親幅を突き破るのを防ぐ */
}
.faq-q{
  position:relative;
  margin:0 0 16px !important;
  padding-left:42px;
  font-weight:900;
  font-size:17px;
  color:var(--navy-ink);
  line-height:1.8;
}
.faq-q::before{
  content:"Q";
  position:absolute;
  left:0;top:2px;
  width:28px;height:28px;
  border-radius:8px;
  background:var(--navy);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:14px;
  font-weight:900;
}
.faq-a{
  position:relative;
  margin:0 !important;
  padding-left:42px;
  font-size:16px;
  color:var(--ink-2);
  line-height:2.05;
  overflow-wrap:anywhere;    /* 回答内の長いURLを確実に折り返す */
}
.faq-a a{word-break:break-all}
.faq-a::before{
  content:"A";
  position:absolute;
  left:0;top:2px;
  width:28px;height:28px;
  border-radius:8px;
  background:var(--crimson);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:14px;
  font-weight:900;
}

/* ---------- 受講までの流れ・ヒストリー（table.step） ---------- */
table.step{width:100%;border-collapse:separate;border-spacing:0}
table.step th{
  vertical-align:top;
  text-align:left;
  padding:14px 18px 14px 0;
  white-space:nowrap;
  color:var(--navy);
  font-weight:900;
  font-size:14.5px;
  line-height:2.0;
}
table.step td{
  vertical-align:top;
  padding:14px 0 18px 20px;
  border-left:2px solid var(--blue-line);
  font-size:16px;
  line-height:2.0;
  color:var(--ink-2);
}
table.step td p{margin:0 0 .6em}
table.step td p:last-child{margin-bottom:0}
table.step td p.title{font-weight:700;color:var(--ink);font-size:16.5px}
/* ラベル（STEP n・年号）は絶対に折り返さない：
   .letter p の text-wrap:pretty が white-space:nowrap の折返し禁止を
   上書きしてしまうため、th内の p に明示的に再指定する */
table.step th p{white-space:nowrap;text-wrap:nowrap}

/* ヒストリー見出し（h5＋icon） */
.letter h5:has(.icon-right-circle){
  margin:48px 0 20px;
  text-align:center;
  font-size:21px;
  font-weight:900;
  color:var(--navy-ink);
}
.letter h5 .icon-right-circle{color:var(--blue);margin-right:6px}

/* ---------- フッター ---------- */
#footer{
  background:var(--navy-ink);
  color:#aeb6e8;
  text-align:center;
  padding:44px 20px;
  font-size:13px;
}
#footer .wrap{max-width:960px;margin:0 auto}
#footer a{color:#ced5f5;text-decoration:none;margin:0 4px}
#footer a:hover{text-decoration:underline}
#footer .separate{opacity:.4;margin:0 4px}
#footer #copyright{margin-top:14px;color:#7d86bb}

/* ============================================================
   モバイル（680px以下）─ 全コンポーネントを個別に最適化
   本文16px／カード内15.5px／リスト14〜14.5px／注記12.5〜13px
   ============================================================ */
@media screen and (max-width:680px){

  /* --- ベース --- */
  body{font-size:16px;line-height:1.95}
  #main{padding-bottom:56px}
  .copy-section{padding:0 14px}

  /* --- 旧ユーティリティの縮小 --- */
  .s{font-size:12.5px}
  .m{font-size:13.5px}
  .l{font-size:16.5px}
  .ll{font-size:18px}
  .lll{font-size:19px}

  /* --- ファーストビュー --- */
  .head-copy-container{margin:0 -14px;padding:20px 14px 32px}
  .head-copy-container img{border-radius:10px;box-shadow:0 12px 32px rgba(0,0,0,.4)}

  /* --- セクション見出し --- */
  h3.sec-title{margin:56px auto 24px;font-size:22px;line-height:1.6;padding:0 4px}
  h3.sec-title[data-kicker]::before{font-size:11px;margin-bottom:8px;letter-spacing:.2em}
  h3.sec-title::after{width:40px;height:3px;margin-top:14px}

  /* --- カード --- */
  .letter{padding:26px 20px;margin-bottom:32px;border-radius:14px}
  .letter p{font-size:16px;line-height:1.95;margin-bottom:1em}
  .letter h4{margin:32px 0 16px;font-size:18px;line-height:1.65}
  .letter > h5{font-size:15.5px;margin:4px 0 12px}

  /* --- 締切バッジ --- */
  .timecounter{font-size:13.5px;padding:10px 20px;margin:24px auto 4px;border-width:2px}

  /* --- リード --- */
  .sub-copy{margin:32px auto}
  .sub-copy p{font-size:16px;line-height:2.05;text-align:left;margin-bottom:1em}
  .sub-copy p br{display:none}

  /* --- 悩みチェック --- */
  .bullet{gap:12px;margin:4px 0 12px}
  .bullet h3{padding:14px 16px;font-size:15px;line-height:1.85;gap:11px;border-radius:10px}
  .bullet h3 .icon-ok-1{width:23px;height:23px;margin-top:3px;font-size:11.5px}

  /* --- 汎用パネル --- */
  .box{padding:20px 16px;margin:12px 0 16px;border-radius:12px}
  .box ul,.box ol{gap:10px}
  .box li{font-size:15px;line-height:1.9;padding-left:20px}
  .box li::before{width:7px;height:7px;left:2px}
  .box h4{font-size:13.5px;margin:20px 0 8px}

  /* --- ストーリー／締切カード --- */
  .letter.story p{font-size:15.5px;line-height:2.1}
  .letter.deadline p{font-size:15px;line-height:2.05}
  .letter.deadline p:first-child{font-size:17px;line-height:1.85}

  /* --- カード直下の素のリスト --- */
  .letter > ul{gap:8px;margin-bottom:1.1em}
  .letter > ul > li{font-size:15px;line-height:1.9;padding-left:20px}
  .letter > ul > li::before{width:7px;height:7px;left:2px}

  /* --- 受講生の声 --- */
  .testimonial{padding:26px 18px;margin-bottom:24px;border-radius:14px}
  .testimonial::before{font-size:68px;top:6px;left:10px}
  .testimonial h4{font-size:17px;line-height:1.65}
  .testimonial h4 br{display:none}
  .testimonial h5{font-size:14.5px;margin-bottom:18px}
  .testimonial h5 .m{font-size:12.5px}
  .testimonial p{font-size:15px;line-height:1.95}
  .testimonial-disclaimer{font-size:12.5px;padding:9px 12px}

  /* --- 動画 --- */
  .video-container{margin-bottom:18px}
  .content-video{border-radius:10px}

  /* --- 特徴・特典 --- */
  .content-list{margin-bottom:18px;border-radius:13px}
  .chapter-title{padding:14px 16px}
  .chapter-text h3{font-size:15.5px;gap:9px;line-height:1.6}
  .chapter-num{font-size:11.5px;padding:3px 10px;border-radius:6px}
  .chapter-content-inner{padding:20px 16px}
  .chapter-content-inner p,.chapter-content-inner li{font-size:15px;line-height:1.9}

  /* --- カリキュラム --- */
  .section-box{margin-bottom:20px;border-radius:13px}
  .section-box > h5{padding:16px 18px;font-size:16px;line-height:1.65}
  .section-box > h5 em{font-size:11px;padding:2px 10px;margin-bottom:6px}
  .section-box-inner{padding:20px 16px}
  .section-box-inner p,.section-box-inner li{font-size:15px;line-height:1.95}
  .section-box-inner h5{font-size:17.5px;line-height:1.7}
  .section-box-inner h6{font-size:18px}
  .profile-box img{max-width:210px}

  /* --- Q&A枠 --- */
  .qa-titles{margin:16px 16px 20px;padding:15px 14px;border-radius:10px}
  .qa-titles__label{font-size:12.5px;padding-left:28px;margin-bottom:10px;line-height:1.7}
  .qa-titles__label::before{width:20px;height:20px;font-size:11px}
  .qa-titles ul{gap:6px}
  .qa-titles li{font-size:13px;line-height:1.75;padding-left:14px}

  /* --- 内訳表 --- */
  table.designed{font-size:12.5px;border-radius:10px}
  table.designed th,table.designed td{padding:11px 10px}
  table.designed th{width:46%}
  table.designed tr:last-child th,table.designed tr:last-child td{font-size:14px}

  /* --- プラン --- */
  .plan{padding:28px 0 26px;margin-bottom:26px;border-radius:16px}
  .plan--recommended{padding-top:36px}
  .plan > h4{margin:0 18px 6px;font-size:17.5px}
  .plan > p{margin:0 20px 12px;font-size:14.5px;line-height:1.9}
  .plan p.plan__badge{margin:-48px auto 16px;font-size:12px;padding:4px 20px}
  .plan p.plan__price{font-size:29px;margin:4px 18px 16px}
  .plan--option p.plan__price{font-size:24px}
  .plan ul{margin:0 20px 16px;gap:8px}
  .plan li{font-size:14px;line-height:1.85;padding-left:23px}
  .plan__addition{margin:0 20px 16px;padding:14px 15px;border-radius:10px}
  .plan__addition p{font-size:13.5px;line-height:1.85}
  .plan p.plan__note{font-size:14px;margin-bottom:6px}

  /* --- 支払方法 --- */
  .letter.payment{padding:22px 18px}
  .letter.payment h4{font-size:13.5px;margin-bottom:10px}
  .letter.payment p{font-size:14px;line-height:1.85;padding-left:18px;margin-bottom:7px}

  /* --- ボタン --- */
  a.button{max-width:100%;margin:10px auto;border-radius:12px}
  a.button .btn-text{padding:17px 18px;font-size:17px;line-height:1.55}
  a.button .btn-text.ll{font-size:16px}
  .print-button{border-radius:10px}
  .print-button .btn-text{padding:13px 22px;font-size:15px}

  /* --- 個別相談 --- */
  .consult-cta{padding:28px 20px;margin-top:24px;border-radius:14px}
  .consult-cta h4{font-size:18px;margin-bottom:12px}
  .consult-cta p{font-size:14.5px;line-height:1.95}

  /* --- フォーム --- */
  .form-section-content-inner > .info{margin-top:44px}
  .form-content label{font-size:14px;margin:20px 0 7px}
  /* iOSのフォーカス時自動ズームを防ぐため、入力欄は16px以上を維持する */
  .form-content input[type="text"],
  .form-content input[type="email"],
  .form-content select,
  .form-content textarea{font-size:16px;padding:12px 12px;border-radius:9px}
  .form-content .clearfix{flex-direction:column;gap:0}
  .form-content .chapter-content .chapter-content-inner{padding:20px 16px}
  .form-content .chapter-content h4{font-size:15.5px}
  .service-list li{font-size:14px;line-height:1.85}
  .submit_button{font-size:17px;padding:18px 20px;margin-top:24px;border-radius:12px}
  .error_message{padding:13px 14px}
  .error_message .alert{font-size:14.5px}

  /* --- FAQ --- */
  .info > p:first-child{font-size:20px;margin-bottom:20px}
  .info ul{gap:14px}
  .info li.faq{padding:22px 16px;border-radius:12px}
  .faq-q{font-size:15.5px;padding-left:36px;margin-bottom:12px !important;line-height:1.7}
  .faq-q::before{width:26px;height:26px;font-size:13px;top:1px}
  .faq-a{font-size:15px;padding-left:36px;line-height:1.95}
  .faq-a::before{width:26px;height:26px;font-size:13px;top:1px}

  /* --- 流れ・ヒストリー：ラベルを左横から上へ（縦積みレイアウト） --- */
  table.step,
  table.step tbody,
  table.step tr,
  table.step th,
  table.step td{display:block;width:100%}
  table.step tr{padding:14px 0 16px;border-bottom:1px solid var(--blue-line)}
  table.step tr:first-child{padding-top:2px}
  table.step tr:last-child{border-bottom:none;padding-bottom:2px}
  table.step th{
    padding:0 0 4px;
    font-size:12.5px;
    letter-spacing:.1em;
    color:var(--blue);
    line-height:1.6;
    white-space:nowrap;
  }
  table.step td{
    border-left:none;
    padding:0;
    font-size:14.5px;
    line-height:1.9;
  }
  table.step td p.title{font-size:15px}
  .letter h5:has(.icon-right-circle){margin:36px 0 16px;font-size:18px}

  /* --- フッター --- */
  #footer{padding:32px 16px;font-size:12px}
  #footer a{display:inline-block;margin:2px 4px}
  #footer #copyright{margin-top:12px;font-size:11.5px}
}

/* ---------- 小型スマホ（380px以下）の微調整 ---------- */
@media screen and (max-width:380px){
  h3.sec-title{font-size:20px}
  .timecounter{font-size:12.5px;padding:9px 16px}
  .plan p.plan__price{font-size:26px}
  .testimonial h4{font-size:16px}
  table.designed{font-size:11.5px}
  table.designed th,table.designed td{padding:10px 8px}
}