/* 太さは2段階だけ＝見出し700／本文400（2026/08/29 小久保指摘）。900・800・500は使わない */
/* /seminar 専用のスタイル。共通の site.css を読み込んだうえで、このページだけの差分を足す。
 * 2026/08/26 新設（#370）。色・角丸・影は site.css の :root の値をそのまま使う。
 * ⚠️ /assets/* は immutable キャッシュ。中身を直したら seminar.html の ?v= を上げる。
 *
 * 2026/08/26 改訂：共通のヘッダー・フッター・追従ボタンを外した（小久保）。
 * 集客の1枚なので、ここから他のページへ出る道を作らない。その分の骨をここに持つ。 */

/* ---------- このページだけのヘッダーとフッター ---------- */
.sem-body{background:var(--paper);}
.sem-head{
  display:flex; justify-content:center; align-items:center;
  padding:clamp(18px,3.5vw,28px) 20px 0;
}
.sem-logo{width:clamp(88px,18vw,110px); height:auto;}
.sem-foot{
  border-top:1px solid rgba(133,116,64,.18);
  margin-top:clamp(48px,7vw,72px);
  padding:clamp(22px,4vw,32px) 20px clamp(28px,5vw,40px);
  text-align:center;
}
.sem-foot p{display:flex; flex-wrap:wrap; gap:10px 22px; justify-content:center;}
.sem-foot a{
  font-size:clamp(11.5px,1.8vw,12.5px); color:var(--ink-soft);
  text-decoration:underline; text-underline-offset:3px;
}
.sem-copy{
  display:block !important; margin-top:14px;
  font-family:var(--font-en); font-size:11px; letter-spacing:.1em; color:var(--ink-soft);
}

/* ---------- 見出し ---------- */
.sem-title{
  text-align:center; font-size:clamp(17px,3.4vw,23px); font-weight:700; line-height:1.6;
  margin-bottom:clamp(24px,4vw,36px);
}
.sem-title span{
  display:inline-block; margin-top:8px;
  font-size:clamp(13px,2.4vw,16px); color:var(--gold-deep);
}

.seminar-page{padding:clamp(28px,5vw,44px) 0 0;}

/* ⚠️ site.css の .btn は display:inline-flex なので、そのままだと hidden が効かない。
   行き先の決まっていないボタンが金色の粒になって残った（2026/08/26 実発生）。 */
.sem [hidden]{display:none !important;}

/* 中身が短い画面（終了画面など）でも、フッターが宙に浮かず下に着く */
.sem-body{min-height:100dvh; display:flex; flex-direction:column;}
.seminar-page{flex:1 0 auto;}
.sem-foot{flex:none;}
.sem{max-width:640px; margin:0 auto;}
/* 公開中だけ横に広げる（2026/09/16 小久保）。動画が横長（1754×852）なので PC は約2倍の幅、文はこれまでどおり 640px に収める */
.sem[data-state="open"]{max-width:1200px;}
.sem[data-state="open"] .sem-live,
.sem[data-state="open"] .sem-teaser,
.sem[data-state="open"] .sem-next{max-width:640px; margin-left:auto; margin-right:auto;}
.sem[data-state="open"] .sem-player{aspect-ratio:1754/852;}
/* スマホは左右の余白を消して画面いっぱいに */
@media (max-width:640px){
  .sem[data-state="open"] .sem-player{margin-left:calc(-1 * clamp(18px,4.5vw,40px)); margin-right:calc(-1 * clamp(18px,4.5vw,40px)); width:auto; border-radius:0;}
}
.sem-loading{text-align:center; color:var(--ink-soft); font-size:14px; padding:40px 0;}

/* 公開日時のかたまり。このページで一番先に目に入るところ */
.sem-when{
  background:linear-gradient(135deg,#fdf8e9,var(--champagne));
  border:1.5px solid rgba(216,182,76,.55); border-radius:var(--radius);
  padding:clamp(20px,3.6vw,28px) clamp(18px,4vw,32px);
  text-align:center; margin-bottom:clamp(24px,4vw,36px);
}
.sem-when-lead{font-size:12px; font-weight:700; letter-spacing:.14em; color:var(--gold-deep); margin-bottom:10px;}
.sem-when-main{font-size:clamp(19px,4.6vw,26px); font-weight:700; line-height:1.45; overflow-wrap:anywhere;}
.sem-when-sub{margin-top:8px; font-size:clamp(12.5px,2.2vw,14px); color:var(--ink-soft); font-weight:700;}

.sem-past{
  background:var(--gray); border-radius:10px; padding:14px 16px; margin-bottom:20px;
  font-size:clamp(12.5px,2.1vw,14px); font-weight:400; color:var(--ink-soft); line-height:1.8;
}

.sem-three{list-style:none; counter-reset:sem; margin-top:14px;}
.sem-three li{
  position:relative; counter-increment:sem; padding-left:30px; margin-bottom:12px;
  font-size:clamp(13px,2.1vw,14.5px); line-height:1.85; color:var(--ink);
  font-weight:400;
}
.sem-three li::before{
  content:counter(sem); position:absolute; left:0; top:.28em;
  width:20px; height:20px; border-radius:50%; background:var(--gold); color:#fff;
  font-family:var(--font-en); font-weight:700; font-size:11px;
  display:flex; align-items:center; justify-content:center;
}
/* 1文の中で太さを変えない（2026/08/29）。差は色でつける */
.sem-three strong{color:var(--ink); font-weight:inherit;}
.sem-note{margin-top:14px; font-size:clamp(12px,1.9vw,13px); color:var(--ink-soft); line-height:1.85;}

/* 3択（ラジオ）。スマホで押しやすいよう1行1択の帯にする */
.sem-choice{border:0; padding:0; margin:0 0 22px;}
.sem-choice .fld-head{display:flex; align-items:baseline; gap:10px; margin-bottom:8px;}
.sem-choice .fld-head p{font-weight:700; font-size:14px;}
.sem-radio{
  display:flex !important; align-items:center; gap:12px; margin-bottom:8px !important;
  padding:.8em 1em; background:#fff; border:1.5px solid rgba(133,116,64,.3); border-radius:10px;
  font-size:15px; cursor:pointer;
}
.sem-radio input{width:18px; height:18px; accent-color:var(--gold); flex:none;}
.sem-radio span{min-width:0;}
.sem-radio:has(input:checked){border-color:var(--gold); background:var(--gold-pale);}

.sem-consent{
  margin:0 0 18px; padding:12px 14px; background:var(--gray); border-radius:10px;
  font-size:clamp(12px,1.9vw,13px); color:var(--ink-soft); line-height:1.8;
}

/* 申込直後の完了画面 */
.sem-done{text-align:center;}
.sem-done-head{font-size:clamp(16px,2.8vw,20px); font-weight:700; margin-bottom:18px;}
.sem-done p{font-size:clamp(13px,2vw,14.5px); color:var(--ink-soft); line-height:1.9; margin-bottom:18px;}
.sem-done .btn-block{width:100%;}

/* 公開中 */
.sem-live{text-align:center; margin-bottom:clamp(18px,3vw,26px);}
.sem-live-head{
  display:inline-block; padding:.5em 1.4em; border-radius:999px;
  background:var(--gold); color:#fff; font-weight:700; font-size:clamp(12px,2vw,13.5px); letter-spacing:.08em;
}
.sem-live-sub{margin-top:10px; font-size:clamp(12.5px,2.1vw,14px); color:var(--ink-soft); font-weight:700;}

.sem-player{
  position:relative; width:100%; aspect-ratio:16/9;
  background:#0d0c09; border-radius:var(--radius); overflow:hidden;
  box-shadow:var(--shadow); margin-bottom:clamp(24px,4vw,36px);
}
.sem-player iframe,.sem-player video{position:absolute; inset:0; width:100%; height:100%; border:0;}
.sem-player .sem-note{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  margin:0; padding:24px; text-align:center; color:#f3efe3;
}

.sem-next h2{font-size:clamp(15px,2.4vw,18px); font-weight:700; line-height:1.7; text-align:center; margin-bottom:18px;}
.sem-next .btn-block{width:100%; margin-bottom:12px;}
.sem-next .sem-note{text-align:center;}

@media (max-width:420px){
  .sem-when{padding:18px 14px;}
  .sem-radio{padding:.75em .85em; font-size:14px;}
}

/* ---------- 締切の1行（動画を見た人にだけ出す） ---------- */
.sem-deadline{
  margin-top:20px; padding:16px 18px;
  background:var(--gold-pale); border:1.5px solid rgba(216,182,76,.5); border-radius:12px;
  text-align:center; font-size:clamp(12.5px,2.1vw,14px); line-height:1.9; color:var(--ink-soft);
}
.sem-deadline strong{color:var(--gold-deep); font-weight:inherit;}
.sem-nowrap{white-space:nowrap;}
.sem-deadline-rows{
  display:flex; flex-direction:column; gap:6px;
  margin:12px auto 10px; padding:12px 14px;
  background:rgba(255,255,255,.7); border-radius:8px;
  font-size:clamp(12.5px,2.1vw,14px);
}
.sem-deadline-rows strong{color:var(--gold-deep); font-weight:inherit;}
.sem-deadline-note{display:block; font-size:clamp(11.5px,1.9vw,12.5px);}
.sem-deadline[hidden]{display:none;}

/* 共通CSSから来る見出しの太さだけ、このページの700へ寄せる（2026/08/29）。
   本文側には触らない＝触ると .sem-when-main のような「主役の行」まで細くなる */
.seminar-page h1,
.seminar-page h2,
.seminar-page h3{font-weight:700;}

/* 自由記入欄（2026/09/04 小久保の指示で追加）。共通CSSの textarea は min-height:180px で
   スマホだと画面を占めすぎるので、このページだけ低くする */
.sem-bg{display:block; margin-bottom:22px;}
.sem-bg .fld-head{display:flex; align-items:baseline; gap:10px; margin-bottom:8px;}
.sem-bg .fld-head p{font-weight:700; font-size:14px;}
.sem-bg .fld-head .opt{color:var(--ink-soft); font-size:13px;}
.sem-bg textarea{min-height:110px;}

/* ---------- 申込済みの人の待機画面（2026/09/04・#479） ----------
   同じURLでも、?k=（確認メールのリンク）か、申し込んだ端末には、公開前はフォームでなくこれを出す。
   黒いプレーヤー枠の中に「公開までの残り時間」。公開時刻になるとJSが同じ場所を動画に差し替える */
.sem-applied{text-align:center; margin-bottom:clamp(16px,3vw,22px);}
.sem-applied-pill{
  display:inline-block; padding:.5em 1.4em; border-radius:999px;
  background:var(--gold); color:#fff; font-weight:700; font-size:clamp(12px,2vw,13.5px); letter-spacing:.08em;
}
.sem-applied-name{margin-top:10px; font-size:clamp(13px,2.2vw,15px); font-weight:700; overflow-wrap:anywhere;}
.sem-wait-inner{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; padding:20px; text-align:center; color:#f3efe3;
}
.sem-wait-lead{font-size:clamp(12px,2vw,13.5px); letter-spacing:.14em; color:rgba(243,239,227,.75); font-weight:700;}
.sem-wait-count{
  font-family:var(--font-en); font-size:clamp(28px,7.5vw,44px); font-weight:700; letter-spacing:.04em; line-height:1.15;
  font-variant-numeric:tabular-nums;
}
.sem-wait-count span+span{margin-left:.3em;}
.sem-wait-sub{font-size:clamp(11.5px,1.9vw,13px); color:rgba(243,239,227,.8); line-height:1.7;}
.sem-view[data-view="wait"] .btn-block{width:100%;}
.sem-wait-other{text-align:center;}
.sem-wait-other a{color:var(--ink-soft); text-decoration:underline; text-underline-offset:3px;}
.sem-form-note{margin:0 0 16px; text-align:center;}

/* ---------- iOS の自動ズームを止める（2026/09/04・小久保の実機で横スクロール再発） ----------
   iPhone の Safari と LINE 内ブラウザは、文字サイズ 16px 未満の入力欄を押すと勝手にズームする。
   ズームしたぶん画面が横に動くようになり、「横スクロールが戻った」ように見える（今朝の「直った」はLINEを開き直してズームが解けただけ）。
   共通CSS（site.css）は 15px なので、このページの入力欄だけ 16px にする。ラジオ・チェックは押しても拡大されないので触らない */
.sem-form input:not([type="radio"]):not([type="checkbox"]),
.sem-form textarea{font-size:16px;}

/* ---------- 公開中：次の一歩（2026/09/04 案C＋A・小久保決定） ----------
   0:00〜 予告1行だけ → 14:00〜 パネル＋追従ボタン → 終了の瞬間 プレーヤーの上に重ねる。主役＝無料個別面談、申込は文字リンク */
.sem-player-box{position:absolute; inset:0;}
.sem-player-box iframe,.sem-player-box video{position:absolute; inset:0; width:100%; height:100%; border:0;}
.sem-player-box .sem-note{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  margin:0; padding:24px; text-align:center; color:#f3efe3;
}
.sem-end{
  position:absolute; inset:0; z-index:2; background:rgba(13,12,9,.94); color:#f3efe3;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;
  padding:16px 18px; text-align:center;
}
.sem-end-head{font-size:clamp(13px,2.2vw,15px); font-weight:700; line-height:1.7; margin:0 0 4px;}
.sem-end .btn-block{width:100%; font-size:clamp(13px,2.2vw,15px);}
.sem-end .btn-ghost{background:transparent; color:#f3efe3; border:1.5px solid rgba(243,239,227,.7); box-shadow:none;}
.sem-end .btn-ghost:hover{background:rgba(243,239,227,.12); color:#fff;}
.sem-end-again{
  background:none; border:0; padding:4px; margin-top:2px; cursor:pointer;
  font-size:12px; color:rgba(243,239,227,.8); text-decoration:underline; text-underline-offset:3px;
}
@media (max-width:420px){
  .sem-end{gap:8px; padding:12px 14px;}
  .sem-end-head{font-size:12.5px; line-height:1.55;}
  .sem-end .btn-block{padding:.75em 1em; font-size:13px;}
}
.sem-teaser{text-align:center; font-size:clamp(12px,1.9vw,13px); color:var(--ink-soft); line-height:1.7; margin:-6px 0 18px;}
.sem-next{
  padding:clamp(18px,3.4vw,24px) clamp(16px,3.4vw,22px) clamp(14px,2.6vw,18px);
  background:#fff; border:1.5px solid rgba(216,182,76,.6); border-radius:var(--radius);
  box-shadow:var(--shadow); animation:sem-up .45s ease-out;
}
@keyframes sem-up{from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:none;}}
.sem-next h2{font-size:clamp(15px,2.4vw,18px); font-weight:700; line-height:1.7; text-align:center; margin-bottom:16px;}
.sem-next .btn-block{width:100%; margin-bottom:10px;}
.sem-next-sub{font-size:clamp(12.5px,2vw,13.5px); color:var(--ink-soft); line-height:1.85; text-align:center; margin:0 0 12px;}
.sem-next-alt{font-size:clamp(12.5px,2vw,13.5px); text-align:center; margin:0 0 4px; line-height:1.8;}
.sem-next-alt a,.sem-sticky-alt a{color:var(--ink-soft); text-decoration:underline; text-underline-offset:3px;}
.sem-next .sem-deadline{margin-top:14px;}
.sem-next .sem-note{text-align:center;}
.sem-sticky{
  position:fixed; left:0; right:0; bottom:0; z-index:50;
  background:rgba(250,248,242,.96); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  border-top:1px solid rgba(216,182,76,.6);
  padding:10px 16px calc(12px + env(safe-area-inset-bottom));
  animation:sem-up .4s ease-out;
}
.sem-sticky .btn-block{width:100%; max-width:640px; margin:0 auto; display:flex; padding:.8em 1em; font-size:clamp(13px,2.2vw,15px);}
.sem-sticky-alt{text-align:center; font-size:12px; margin:6px 0 0; line-height:1.6;}
.sem-sticky[hidden]{display:none !important;}
/* 追従ボタンが出ている間、ページ末尾が隠れないように */
.sem[data-sticky="1"]{padding-bottom:110px;}

/* 説明会ページ：動画の一場面（2026-09-18） */
.sem-shot{margin:18px 0 0}
.sem-shot img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid rgba(0,0,0,.08)}
.sem-shot figcaption{font-size:12.5px;color:#5f6570;margin-top:8px;line-height:1.7}
