@charset "UTF-8";
/* ============================================================
   pageb-2026.css ─ ページB（既存受講生向け）専用の最小追加CSS
   design-2026.css の後に読み込む前提。既存クラスで表現できる
   ものはここには書かない。
   追加セレクタは以下のみ：
     .fv-hero（ファーストビュー・ヒーロー一式
       __eyebrow / __lede / __spec / __date / __fee /
       __fee-num / __fee-tax、および内部の .sec-title 上書き）
     .fv-hero + .letter .timecounter（締切バッジの重ね配置）
     .letter.fv-target（対象者ブロックの枠線）
     .instructor-box（講師・免責事項ボックスの文字組）
     table.designed.outline（開催概要テーブルの調整）
   配色はページAヒーローと同じネイビーグラデーション＋
   金色アクセント（#f0b64a〜#ffd97a）。
   モバイル境界は既存と同じ 680px。
   ============================================================ */

/* ---------- ファーストビュー・ヒーロー ---------- */
/* 背景はページA（.head-copy-container）と同一のグラデーション */
.fv-hero{
	margin:0 -16px;
	padding:76px 24px 84px;
	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%);
}

/* 導入行（アイブロウ）：金色＋左右にフェードする罫線 */
.fv-hero__eyebrow{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:14px;
	margin:0 0 26px;
	font-size:14px;
	font-weight:700;
	letter-spacing:.22em;
	color:#ffd97a;
}
.fv-hero__eyebrow::before,
.fv-hero__eyebrow::after{
	content:"";
	flex:none;
	width:36px;
	height:1px;
}
.fv-hero__eyebrow::before{background:linear-gradient(90deg,transparent,rgba(255,217,122,.85))}
.fv-hero__eyebrow::after{background:linear-gradient(90deg,rgba(255,217,122,.85),transparent)}

/* タイトル（sec-title のヒーロー内上書き） */
.fv-hero .sec-title{
	margin:0 auto 26px;
	color:#fff;
	/* 41px＝「コーチング実践トレーニング（全3回）」17文字が
	   sec-title の max-width:760px 内で1行に収まる上限 */
	font-size:clamp(30px,4.8vw,41px);
	line-height:1.5;
	letter-spacing:.04em;
}
.fv-hero .sec-title::after{
	width:56px;
	height:4px;
	margin-top:24px;
	background:linear-gradient(90deg,#f0b64a,#ffd97a);
}

/* リード文：明朝でやわらかく */
.fv-hero__lede{
	max-width:640px;
	margin:0 auto 40px;
	font-family:var(--serif);
	font-size:clamp(16px,2.2vw,19px);
	line-height:2.15;
	color:#dde1f4;
}
/* 折返しは文節の区切りでのみ発生させる（「です。」だけの孤立行を防ぐ） */
.fv-hero__phrase{white-space:nowrap}

/* 日程・時間：半透明のスペックパネル */
.fv-hero__spec{
	width:max-content;
	max-width:100%;
	margin:0 auto 36px;
	padding:18px 36px;
	background:rgba(255,255,255,.06);
	border:1px solid rgba(255,255,255,.24);
	border-radius:14px;
}
.fv-hero__spec p{
	margin:0;
	font-size:16.5px;
	font-weight:700;
	letter-spacing:.04em;
	line-height:2.05;
	color:#fff;
	font-variant-numeric:tabular-nums;
}
/* 折返しは日付の区切り（／）でのみ発生させる */
.fv-hero__date{white-space:nowrap}

/* 受講料：金額のみ大きく */
.fv-hero__fee{
	margin:0;
	font-size:15px;
	font-weight:700;
	letter-spacing:.08em;
	color:#c9cff2;
}
.fv-hero__fee-num{
	margin:0 1px 0 8px;
	font-size:34px;
	font-weight:900;
	letter-spacing:.02em;
	line-height:1.2;
	color:#fff;
	font-variant-numeric:tabular-nums;
}
.fv-hero__fee-tax{font-size:13.5px}

/* 締切バッジ（直後の .letter 内）をヒーロー下端に重ねる */
.fv-hero + .letter .timecounter{margin-top:-28px}

/* ---------- 講師・免責事項ボックス（開催概要内） ----------
   .s / .m は .letter p（0-1-1）に特異性で負けて 17px のまま
   になるため、ここで明示的にサイズと行間を組み直す */
.instructor-box p.s{
	margin:0;
	font-size:13.5px;
	line-height:1.9;
	color:var(--ink-2);
}
.instructor-box p:not(.s):not(.m){   /* 氏名 */
	margin:2px 0 0;
	font-size:18px;
	font-weight:700;
	line-height:1.7;
	color:var(--navy-ink);
}
.instructor-box p.m{                 /* 免責事項・キャンセルポリシー本文 */
	margin:0;
	font-size:14.5px;
	line-height:1.95;
	color:var(--ink-2);
}
.instructor-box li{                  /* 支払方法リスト（本文サイズに合わせる） */
	font-size:14.5px;
	line-height:1.9;
}

/* ---------- 対象者ブロックの枠線 ---------- */
.letter.fv-target{
	border:2px solid var(--blue);
}
.letter.fv-target h4{
	font-size:18px;
	margin-bottom:12px;
}

/* ---------- 開催概要テーブル ----------
   table.designed は右寄せ・数値・折返し禁止・最終行ハイライト前提の
   内訳表デザインのため、開催概要用に左寄せ・折返し可へ調整する */
table.designed.outline th{width:9em}
/* セル内の p は .letter p（17px/16px）ではなく table.designed 本来の
   フォントサイズ（15.5px/12.5px）に合わせる */
table.designed.outline th p,
table.designed.outline td p{font-size:inherit}
table.designed.outline td{
	text-align:left;
	white-space:normal;
}
table.designed.outline td p{
	white-space:normal;
	text-wrap:wrap;
}
table.designed.outline tr:last-child th{
	background:#f8faff;
	color:var(--navy-ink);
	font-weight:700;
	font-size:15.5px;
}
table.designed.outline tr:last-child td{
	background:#fff;
	color:var(--ink-2);
	font-weight:400;
	font-size:15.5px;
}

/* 申込ボタン：商品名「コーチング実践トレーニング」の語中で
   折り返さないための区切り（index.php のボタン文言で使用） */
.submit_button .nobr{white-space:nowrap}

/* ---------- モバイル（680px以下） ---------- */
@media screen and (max-width:680px){
	/* 15px＝icon＋「コーチング実践トレーニング」が375px幅のボタン内で
	   1行に収まる上限（あふれる場合は「に申し込む」だけが2行目に落ちる） */
	.submit_button{font-size:15px}
	.fv-hero{margin:0 -14px;padding:52px 18px 72px}
	.fv-hero__eyebrow{gap:10px;margin-bottom:18px;font-size:11.5px;letter-spacing:.18em}
	.fv-hero__eyebrow::before,
	.fv-hero__eyebrow::after{width:22px}
	/* 「コーチング実践トレーニング」13文字（nowrap）が375px幅で1行に収まる上限 */
	.fv-hero .sec-title{font-size:clamp(24px,6.4vw,27px);margin-bottom:20px}
	.fv-hero .sec-title::after{width:44px;height:3px;margin-top:16px}
	.fv-hero__lede{font-size:15px;line-height:2.0;margin-bottom:30px}
	.fv-hero__spec{padding:14px 20px;margin-bottom:28px;border-radius:12px}
	.fv-hero__spec p{font-size:14px;line-height:2.0}
	.fv-hero__fee{font-size:13.5px}
	.fv-hero__fee-num{font-size:28px;margin-left:6px}
	.fv-hero__fee-tax{font-size:12px}
	.fv-hero + .letter .timecounter{margin-top:-26px}

	.letter.fv-target h4{font-size:16px}

	.instructor-box p.s{font-size:12.5px;line-height:1.85}
	.instructor-box p:not(.s):not(.m){font-size:16.5px}
	.instructor-box p.m{font-size:13.5px;line-height:1.9}
	.instructor-box li{font-size:13.5px;line-height:1.85}

	table.designed.outline th{width:7em}
	table.designed.outline tr:last-child th,
	table.designed.outline tr:last-child td{font-size:12.5px}
}