@charset "UTF-8";

/* =============================================================
   lp_seizu.css  ― 機械製図入門LP（seizu_top / page-id 8925）試作 初版
   2026-07-23  旧タイプLP改修プロジェクト フェーズ1試作
   -------------------------------------------------------------
   ベース: lp_sokusen.css（旧→新変換の実例）の「共通枠」ルールを抽出・移植。
   アクセント色: 旧seizu踏襲の濃紺 #1f285f（sokusenの #083866 を置換）。
   スコープ: 共通枠のみ（ヘッダー最上部帯・ナビ下線色・講座名帯・cp_bar・
            申込ステップ/料金枠/FAQ-CTA）。本文の章立て等は画像を維持するため
            section-title / program-num 等の本文章要素CSSは含めない。

   ★このファイルは lp_editor.css（共通）と併用する前提。
     読み込み順は lp_seizu.css →【lp_editor.css】→ lp_voice.css で、共通のeditorが【後】。
     （2026-08-02 monoweb.org で実測して訂正。旧記載「editorが先・本ファイルが後」は誤り）
     よって editor と同詳細度で値を変えたい箇所は !important が必要。既存の !important は外さないこと。
   ★下記は「テンプレ切替（固定ページ8925を新デザイン用テンプレへ）後」に
     monoweb.org 実機で微調整する前提の初版。TODO は実機で確定する。
   ============================================================= */

/* ---- アクセント色（1箇所で管理） ------------------------------ */
.lp-body {
  --main-color: #1f285f;      /* 旧seizuの主色（濃紺）。stepper/circle等はこの変数を参照 */
  --main-color-dark: #161d46; /* ホバー等の暗色 */
  --band-color: #e8eaf4;      /* 薄帯（#1f285fの淡色） */
  background-color: #FFF;
}

/* 汎用 h4::after の下線を抑止（基礎編パリティ。統計h4等に不要な線が出るのを防ぐ） */
.lp-body h4::after { display: none; }

/* ---- グローバル既定（koso-basic先頭より移植。2026-07-24 全CSS照合で漏れ判明） ----
   box-sizing: width:100%+padding のルール群がはみ出さない前提条件。
   scroll-behavior: ナビのアンカージャンプをスムーズに。 */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

/* ---- ヘッダー最上部の細い帯（全LP共通の説明バー） -------------- */
.l-header {
  position: relative;
  width: 100%;
  z-index: 100;
  background: #fff;
}
.l-header::before {
  content: "機械設計スキルをステップ式で身につける、eラーニング中心のWeb学習塾";
  display: block;
  width: 100%;
  height: 20px;
  line-height: 20px;
  background-color: #1f285f;   /* ← seizu accent */
  color: #fff;
  font-size: 11px;
  text-align: left;
  padding-left: max((100% - 960px) / 2, 10%);
  box-sizing: border-box;
}

/* ---- ヘッダー上段レイアウト（sokusen per-LP から移植・構造のみ） ----
   ★初版で移植漏れだった箇所。ロゴ・タグライン・上段リンクのflex配置。 */
.p-header__inner {
  width: 80%;
  max-width: 960px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 auto;
  background-color: #FFF;
  box-sizing: border-box;
  height: 80px;
}
@media screen and (max-width: 767px) {
  .p-header__inner { height: 86px; width: 100%; padding: 0 10px; }
}
@media screen and (min-width: 1250px) {
  .p-header__inner { padding: 0; }
}
.p-header__logo-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-left: -16px;
}
@media screen and (max-width: 950px) {
  .p-header__logo-container { flex-direction: column; gap: 0; align-items: flex-start; margin-left: 0; }
}
.p-header__logo { width: 210px; height: fit-content; }
@media screen and (max-width: 950px) { .p-header__logo { width: 180px; } }
.p-header__logo img { width: 100%; height: auto; }
.p-header__logo-text { font-size: 12px; text-align: left; }
@media screen and (max-width: 950px) {
  .p-header__logo-text { font-size: 10px; margin-top: -7px; white-space: nowrap; }
}
@media screen and (max-width: 1024px) {
  .p-header__logo-text { display: none !important; }
}
.p-header__list { display: flex; align-items: center; }
@media screen and (max-width: 950px) {
  .p-header__list { flex-direction: column; gap: 10px; align-items: flex-start; }
}
@media screen and (min-width: 767px) and (max-width: 950px) {
  .p-header__list { margin-right: calc(30px - 1%); }
}
.p-header__list a {
  font-size: 16px;
  text-decoration: none;
  color: #3A3A3A;
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 0 24px;
}
@media screen and (max-width: 950px) { .p-header__list a { font-size: 12px; padding: 0; } }
@media screen and (max-width: 767px) { .p-header__list a { font-size: 11px; } }
@media screen and (min-width: 951px) {
  .p-header__list li:first-of-type { border-right: 1px solid #3A3A3A; }
}
.p-header__item-link:hover { background-color: #f0f4f9; }
.p-header__item-icon { width: 24px; height: 24px; }
.p-header__item-icon2 { width: 21px; height: 21px; }
.p-header__item-icon img { width: 100%; }
.p-header__inner__bottom { margin: 0 auto; background-color: #F6FCFE; box-sizing: border-box; border-bottom: 1px solid #CBD9E8; }
body.lp-fixed .p-header__inner__bottom { position: fixed; top: 0; width: 100%; background-color: #FFFFFF; border-bottom: 1px solid #CBD9E8; box-shadow: 0 2px 6px rgba(8, 56, 102, .08); }

/* ---- 上メニュー(下段ナビ)リンクのホバー色：他LP同様に赤へ（初版で移植漏れ） -- */
.p-header__list__bottom a { color: #3A3A3A; }
.p-header__list__bottom a:hover { color: #ff0000; }

/* ---- iPad帯(768-950px)のヘッダー下段補正（koso-basic 4905行より。editorは≤767のみのためLP側で補う） -- */
@media screen and (max-width: 950px) {
  .p-header__inner__bottom .bar { display: flex; align-items: center; justify-content: space-between; width: 100%; }
}

/* ---- 追従ヘッダーのカレント下線色（形状は lp_editor.css 共通） -- */
body.lp-fixed .p-header__inner__bottom .nav-current {
  color: #1f285f;              /* ← seizu accent */
}
body.lp-fixed .p-header__inner__bottom .nav-current::after {
  background: #1f285f;         /* ← seizu accent */
}

/* ---- 講座名帯（.lp-mv h2） ------------------------------------
   本文の .lp-mv 内に <h2>機械製図超入門講座</h2> を用意する（cp_barの位置基準）。
   .lp-mv の背景画像はseizu用が決まるまで未指定（本文/画像差し込み時に確定）。 */
.lp-mv h2 {
  color: #1f285f;              /* ← seizu accent（元 #123F6D） */
  background-color: #e8eaf4;   /* ← 薄帯（元 #E7F0FB） */
  font-size: 58px;             /* 旧 4vw（1280pxで51px・幅で変動していた）を固定値に */
  margin-top: -6px;
  text-align: center;
  letter-spacing: 4px;
  line-height: 1.6;
}
.lp-mv h2 span { font-size: 3vw; }
@media screen and (max-width: 767px) {
  .lp-mv h2 { font-size: 32px; padding: .3em 0; line-height: 1.4; }
  .lp-mv h2 span { font-size: 24px; display: block; }
}

/* ---- キャンペーン帯（cp_bar） --------------------------------
   HTMLはテンプレが出力。位置は共通 lp.js が .cp_bar を .lp-mv 直後へDOM移動。
   PCで重複する .cp_flag は非表示。 */
.cp_flag.hp-pc_only { display: none !important; }
.cp_bar {
  width: 100%;
  background: #2a3568;          /* ← seizu navy（sokusenの #0B4A85 相当の明度） */
  color: #fff;
  padding: 24px 16px;
  box-sizing: border-box;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .cp_bar.hp-pc_only { display: block; }
}
.cp_bar__inner {
  max-width: 960px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 24px;
  white-space: nowrap;
}
.cp_bar__label {
  font-size: 17px;
  background: #fff;
  color: #555;
  padding: 6px 16px;
  border-radius: 6px;
  font-weight: 800;
  letter-spacing: 1px;
}
.cp_bar__main { font-size: 24px; }
.cp_bar__main b { font-size: 36px; color: #FFE24D; margin-left: 6px; }
.cp_bar__sep { width: 1px; height: 34px; background: rgba(255, 255, 255, .5); }
.cp_bar__date { font-size: 24px; font-weight: 800; }
.cp_bar__days {
  font-size: 18px;
  background: #FFE24D;
  color: #8A5700;
  padding: 7px 16px;
  border-radius: 999px;
  font-weight: 800;
}
@media screen and (max-width: 767px) {
  .cp_bar { padding: 14px 12px; }
  .cp_bar__inner { gap: 10px; white-space: normal; flex-wrap: wrap; }
  .cp_bar__label { font-size: 13px; padding: 4px 10px; }
  .cp_bar__main { font-size: 16px; }
  .cp_bar__main b { font-size: 22px; }
  .cp_bar__sep { display: none; }
  .cp_bar__date { font-size: 16px; }
  .cp_bar__days { font-size: 13px; padding: 5px 12px; }
}

/* ---- 料金枠（.group / #price 表） ----------------------------
   価格は自動出力。表ヘッダーの色のみアクセント化。
   詳細な料金カード（.price-box / .off-txt-box 等）は本文の価格ブロックを
   新マークアップに置換する段階で実機確定（TODO）。 */
.group {
  padding: 50px 0;
  background: #f2f6fb;         /* 淡い枠背景（seizu寄せ） */
  width: 100%;
}
.group h4 + p {
  text-align: center;
  font-size: 18px;
  margin-bottom: 20px;
}
#price table {
  width: 80%;
  max-width: 700px;
  margin: 0 auto 10px;
  border-radius: 4px;
  overflow: hidden;
}
@media screen and (max-width: 767px) {
  #price table { width: calc(100% - 40px); }
}
#price table th {
  background-color: #1f285f;   /* ← seizu accent */
  color: #FFF;
}

/* ---- グループ割引表 追加分（koso-basic準拠・seizu配色） -----------
   セル余白・割引率の強調・行ストライプ・注意書き(.under-table)の中央寄せ。
   koso #E9682C→seizuオレンジ#F28A2E、行ストライプはseizu紺の淡色。 */
#price table th,
#price table td {
  padding: 2% 5%;
  font-size: 16px;
  letter-spacing: 2px;
}
.group tbody tr:nth-child(odd)  { background-color: #F8FAFD; }
.group tbody tr:nth-child(even) { background-color: #E3E8F4; }
.group tbody td:nth-child(1),
.group tbody td:nth-child(3) { color: #243746; }
#price table td.discount {
  color: #F28A2E;
  font-weight: 600;
  font-size: 21px;
}
.under-table {
  font-size: 16px;
  line-height: 1.8;
  text-align: left;
  width: 80%;
  max-width: 700px;
  margin: 20px auto 0;
}
@media screen and (max-width: 767px) {
  #price table th,
  #price table td { font-size: 14px; }
  #price table td.discount { font-size: 18px; }
  .under-table { font-size: 14px; width: calc(100% - 40px); line-height: 2; }
}

/* =============================================================
   .moushikomi.apply-v2「お申込みからご利用開始まで」 2026-07-29
   kyoudo の apply-v2 を seizu へ移植（ティール → 紺 #1f285f 系に配色変更）。
   旧「申込み方法」の3ステップ（.stepper / .step / .circle / .step-label /
   .step-icon）は本文から要素ごと無くなったため、定義を削除して置き換えた。
   ステップは4つ（お申込み → お支払い → 受講案内 → 受講開始）。
   アイコンはテーマ共通の apply_*.svg をCSSマスクで主色に着色。
   ※説明文は4つとも2行に収まる長さで揃えている（1つだけ3行になると番号・
     アイコンの並びは崩れないが下端が不揃いに見えるため）。文言変更時は要確認。
   ============================================================= */
.moushikomi { width: 100%; padding: 50px 0 64px; background: #fff; }
@media screen and (max-width: 767px) { .moushikomi { padding: 36px 16px 46px; } }

.lp-body #seizu_nyumon .apply-v2-panel {
  width: 100%; max-width: 960px; margin: 0 auto; padding: 42px 32px 34px;
  border: 1px solid var(--band-color); border-radius: 18px; background: #F5F6FB; box-sizing: border-box;
}
.lp-body #seizu_nyumon .moushikomi.apply-v2 h2.apply-v2-title {
  width: auto; margin: 0 0 10px; padding: 0; background: none;
  color: var(--main-color); font-size: 32px; font-weight: 800; line-height: 1.45; text-align: center;
}
.lp-body #seizu_nyumon .moushikomi.apply-v2 h2.apply-v2-title::before {
  content: ""; display: block; width: 52px; height: 4px; margin: 0 auto 18px;
  border-radius: 999px; background: var(--main-color);
}
.lp-body #seizu_nyumon .apply-v2-lead {
  margin: 0 0 44px; color: #405266; font-size: 15px; font-weight: 600; line-height: 1.75; text-align: center;
}
/* 4ステップ横並び。番号の高さで水平線をつなぐ */
.lp-body #seizu_nyumon .apply-v2-steps {
  position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0; margin: 0; padding: 0; list-style: none;
}
.lp-body #seizu_nyumon .apply-v2-steps::before {
  content: ""; position: absolute; top: 83px; right: 12.5%; left: 12.5%; z-index: 0;
  height: 2px; background: #C3CAE2;
}
.lp-body #seizu_nyumon .apply-v2-step {
  position: relative; z-index: 1; min-width: 0; min-height: 0; margin: 0; padding: 0 14px;
  border: 0; border-radius: 0; background: transparent; box-shadow: none; text-align: center;
}
.lp-body #seizu_nyumon .apply-v2-number {
  position: relative; z-index: 2; display: inline-flex; align-items: center; justify-content: center;
  width: 38px; min-width: 38px; height: 38px; margin: 0 auto 10px; padding: 0;
  border-radius: 50%; background: var(--main-color); color: #fff;
  font-size: 14px; font-weight: 800; line-height: 1; letter-spacing: .04em; box-sizing: border-box;
}
.lp-body #seizu_nyumon .apply-v2-icon {
  position: relative; z-index: 1; display: flex; align-items: center; justify-content: center;
  width: 72px; height: 72px; margin: 0 auto 14px; border-radius: 50%;
  background: var(--band-color); box-shadow: none; overflow: visible;
}
.lp-body #seizu_nyumon .apply-v2-icon::before {
  content: ""; display: block; width: 38px; height: 38px; background-color: var(--main-color);
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
}
.lp-body #seizu_nyumon .apply-v2-icon--form::before    { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_form.svg");    mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_form.svg"); }
.lp-body #seizu_nyumon .apply-v2-icon--payment::before { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_payment.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_payment.svg"); }
.lp-body #seizu_nyumon .apply-v2-icon--mail::before    { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_mail.svg");    mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_mail.svg"); }
.lp-body #seizu_nyumon .apply-v2-icon--start::before   { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_start.svg");   mask-image: url("/wp/wp-content/themes/fantomsemi/images/apply_start.svg"); }
.lp-body #seizu_nyumon .apply-v2-step-title {
  margin: 0 0 6px; color: var(--main-color); font-size: 19px; font-weight: 800; line-height: 1.45;
}
.lp-body #seizu_nyumon .apply-v2-step-text {
  margin: 0; color: #607181; font-size: 14px; font-weight: 600; line-height: 1.75;
}
/* CTA */
.lp-body #seizu_nyumon .apply-v2-cta {
  display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 32px auto 0;
}
.lp-body #seizu_nyumon .apply-v2-cta .over-cta {
  position: static; margin: 0 0 2px; padding: 0; background: none; color: #EF6C19;
  font-size: 15px; font-weight: 700; line-height: 1.6; letter-spacing: .04em; text-align: center;
}
.lp-body #seizu_nyumon .apply-v2-cta .over-cta::before,
.lp-body #seizu_nyumon .apply-v2-cta .over-cta::after { content: none; }
.lp-body #seizu_nyumon .apply-v2-primary {
  display: inline-flex; align-items: center; justify-content: center; width: 100%; max-width: 480px;
  height: auto; min-height: 64px; margin: 0 auto; padding: 14px 28px; border: 0; border-radius: 10px;
  background: #cc0000 !important; background-image: none !important; box-shadow: 0 3px 0 #990000;
  color: #fff !important; font-size: 20px; font-weight: 800; letter-spacing: .035em; line-height: 1.45;
  text-decoration: none; box-sizing: border-box; transition: background-color .2s, transform .2s;
}
.lp-body #seizu_nyumon .apply-v2-primary:hover,
.lp-body #seizu_nyumon .apply-v2-primary:focus {
  background: #b30000 !important; transform: translateY(1px);
}
/* 「申し込み前のよくあるご質問を確認する」＝最初のCTAと同じテキストリンク仕様 */
.lp-body #seizu_nyumon .apply-v2-cta .info-btn {
  display: inline-flex; flex-direction: row; align-items: center; justify-content: center; gap: 8px;
  width: auto; max-width: none; height: auto; margin: 10px 0 0; padding: 8px 4px;
  border: 0; border-radius: 0; background: transparent; color: var(--main-color);
  font-size: 15px; font-weight: 700; line-height: 1.5; letter-spacing: .02em;
  text-align: center; text-decoration: none; white-space: nowrap;
}
.lp-body #seizu_nyumon .apply-v2-cta .info-btn::before {
  content: "?"; display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; border-radius: 50%; background: var(--main-color); color: #fff;
  font-size: 13px; font-weight: 800; line-height: 1;
}
.lp-body #seizu_nyumon .apply-v2-cta .info-btn::after { content: none; }
.lp-body #seizu_nyumon .apply-v2-cta .info-btn:hover { color: var(--main-color-dark); text-decoration: underline; opacity: 1; }

/* スマホ：縦1列。番号・アイコン・見出し・説明を左寄せの行に */
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .apply-v2-panel { padding: 34px 18px 28px; }
  .lp-body #seizu_nyumon .moushikomi.apply-v2 h2.apply-v2-title { font-size: 24px; }
  .lp-body #seizu_nyumon .apply-v2-lead { margin-bottom: 28px; font-size: 14px; text-align: left; }
  .lp-body #seizu_nyumon .apply-v2-steps { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .lp-body #seizu_nyumon .apply-v2-steps::before {
    top: 19px; right: auto; bottom: 19px; left: 18px; width: 2px; height: auto;
  }
  .lp-body #seizu_nyumon .apply-v2-step {
    display: grid; grid-template-columns: 40px 58px minmax(0, 1fr); grid-template-rows: auto auto;
    column-gap: 12px; align-items: start; padding: 10px 0; text-align: left;
  }
  .lp-body #seizu_nyumon .apply-v2-number { grid-row: 1 / 3; margin: 0; align-self: center; }
  .lp-body #seizu_nyumon .apply-v2-icon { grid-row: 1 / 3; width: 52px; height: 52px; margin: 0; align-self: center; }
  .lp-body #seizu_nyumon .apply-v2-icon::before { width: 28px; height: 28px; }
  .lp-body #seizu_nyumon .apply-v2-step-title { font-size: 17px; align-self: end; }
  .lp-body #seizu_nyumon .apply-v2-step-text { font-size: 13px; align-self: start; }
  .lp-body #seizu_nyumon .apply-v2-primary { font-size: 18px; min-height: 60px; padding: 12px 20px; }
  .lp-body #seizu_nyumon .apply-v2-cta .info-btn { font-size: 14px; white-space: normal; }
}

/* =============================================================
   特典 .tokuten.benefit-v2  2026-07-29
   kyoudo の benefit-v2 を seizu へ移植。kyoudoは3特典で横3列だが、
   seizu は4特典のため **2×2グリッド** にしている（4列だと1枚228pxで
   画像・説明が窮屈になるため）。アクセントはオレンジを踏襲し、
   見出し・詳細リンクを紺 #1f285f に変更。
   カードには要約のみを載せ、現行の長い解説文（180〜250字）と注意書きは
   モーダルへ移した。モーダルは **CSSのみの :target 方式**（JS不要）で、
   「詳しい内容を見る＋」→ #benefitSeizuModalN、閉じる→ #anc_tokuten。
   旧 .tokuten-box / .tokuten-title / .tokuten-num 等は本文から要素ごと
   無くなったため定義を削除した。
   ============================================================= */
.lp-body #seizu_nyumon .tokuten.benefit-v2 {
  /* ★全幅化は上部の `.lp-body .tokuten` の共通ブレイクアウト指定
     （width:100vw; left:50%; margin-left:-50vw）を流用する。
     ここで width/margin を再指定すると二重にずれるため書かない。 */
  display: block;
  padding: 80px 20px 74px;
  background: #FFF5E8;
  color: #172B49;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}
/* アンカー着地オフセット（追従ヘッダーに見出しが隠れないように） */
.lp-body #anc_tokuten { scroll-margin-top: 70px; }
.lp-body #seizu_nyumon .benefit-v2__inner { width: min(1000px, 100%); margin: 0 auto; }
.lp-body #seizu_nyumon .benefit-v2 .benefit-v2__title {
  position: relative; width: auto; margin: 0; padding: 30px 20px 0;
  color: var(--main-color); background: transparent; border: 0;
  font-size: 34px; font-weight: 800; line-height: 1.45; letter-spacing: .04em; text-align: center;
}
.lp-body #seizu_nyumon .benefit-v2 .benefit-v2__title::before {
  content: ""; position: absolute; top: 0; left: 50%; width: 52px; height: 4px;
  border-radius: 999px; background: var(--main-color); transform: translateX(-50%);
}
.lp-body #seizu_nyumon .benefit-v2__lead {
  margin: 14px auto 44px; color: #44566C; font-size: 16px; line-height: 1.8;
  letter-spacing: .02em; text-align: center;
}
/* ★4特典なので2×2 */
.lp-body #seizu_nyumon .benefit-v2__grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: stretch;
}
.lp-body #seizu_nyumon .benefit-v2-card {
  position: relative; display: flex; min-width: 0; flex-direction: column; overflow: hidden;
  background: #FFF; border: 1px solid #EED7BC; border-radius: 12px; box-shadow: 0 6px 20px rgba(23,43,73,.06);
  /* 260802 モーダルを閉じたとき、開いたカードの位置に戻すためのスクロール調整。
     閉じるリンクは全カード共通の #anc_tokuten（セクション先頭）を指していたため
     特典4を閉じても特典1まで戻っていた。→ 各カードに id を付けてそこへ戻す。
     このLPで固定表示されるのは上部32pxのバーのみ（html側に scroll-padding-top:32px あり）
     なので、実効オフセットは 32＋24＝56px。 */
  scroll-margin-top: 24px;
}
.lp-body #seizu_nyumon .benefit-v2-card__number {
  position: absolute; z-index: 2; top: 16px; left: 16px;
  display: flex; width: 66px; height: 66px; flex-direction: column; align-items: center; justify-content: center;
  border-radius: 50%; background: #EF6C19; color: #FFF;
  font-size: 27px; font-weight: 800; line-height: 1; letter-spacing: .02em;
  box-shadow: 0 3px 10px rgba(239,108,25,.22);
}
.lp-body #seizu_nyumon .benefit-v2-card__number small { margin-bottom: 4px; color: inherit; font-size: 12px; font-weight: 700; }
.lp-body #seizu_nyumon .benefit-v2-card__image {
  position: relative; display: flex; height: auto; aspect-ratio: 16 / 9;
  align-items: center; justify-content: center; overflow: hidden; padding: 0;
  background: #FFFCF7; border-bottom: 1px solid #F3E4D3; order: 1;
}
.lp-body #seizu_nyumon .benefit-v2-card__image img {
  display: block; width: 100%; max-width: 100%; height: 100%; margin: 0;
  object-fit: contain; border-radius: 0;
}
.lp-body #seizu_nyumon .benefit-v2-card__heading { order: 2; padding: 22px 24px 0; text-align: center; }
.lp-body #seizu_nyumon .benefit-v2-card__catch {
  min-height: 1.6em; margin: 0 0 8px; color: #EF6C19;
  font-size: 15px; font-weight: 800; line-height: 1.6; letter-spacing: .01em;
}
.lp-body #seizu_nyumon .benefit-v2-card h3 {
  margin: 0; padding: 0; color: #172B49; background: transparent; border: 0;
  font-size: 22px; font-weight: 800; line-height: 1.45; letter-spacing: .01em;
}
.lp-body #seizu_nyumon .benefit-v2-card h3::before,
.lp-body #seizu_nyumon .benefit-v2-card h3::after { display: none; content: none; }
.lp-body #seizu_nyumon .benefit-v2-card__body {
  display: flex; flex: 1; flex-direction: column; order: 3; padding: 0 24px 24px; text-align: center;
}
.lp-body #seizu_nyumon .benefit-v2-card__format {
  margin: 7px 0 13px; color: #EF6C19; font-size: 15px; font-weight: 800; line-height: 1.5;
}
.lp-body #seizu_nyumon .benefit-v2-card__description {
  margin: 0 0 20px; color: #526275; font-size: 15px; line-height: 1.85; letter-spacing: .01em; text-align: left;
}
.lp-body #seizu_nyumon .benefit-v2-card__detail {
  display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 5px;
  margin: auto auto 0; padding: 8px 12px; appearance: none; background: transparent; border: 0;
  color: var(--main-color); font-family: inherit; font-size: 15px; font-weight: 800; line-height: 1.5;
  cursor: pointer; text-decoration: none;
}
.lp-body #seizu_nyumon .benefit-v2-card__detail:hover,
.lp-body #seizu_nyumon .benefit-v2-card__detail:focus-visible {
  color: var(--main-color-dark); text-decoration: underline;
}
.lp-body #seizu_nyumon .benefit-v2-card__detail:focus-visible,
.benefit-v2-modal__close:focus-visible { outline: 3px solid rgba(239,108,25,.35); outline-offset: 3px; }
.lp-body #seizu_nyumon .benefit-v2__note {
  margin: 24px 0 0; color: #6D7887; font-size: 13px; line-height: 1.7; text-align: center;
}

/* ---- モーダル（CSSのみ・:target で開閉。Escキーは使えないが背景/×/ブラウザバックで閉じる） ---- */
.benefit-v2-modal { position: fixed; z-index: 100000; inset: 0; display: none; place-items: center; padding: 24px; }
.benefit-v2-modal:target { display: grid; }
.benefit-v2-modal__backdrop { position: absolute; inset: 0; background: rgba(10,31,44,.72); }
.benefit-v2-modal__dialog {
  position: relative; z-index: 1; width: min(920px, 100%); max-height: calc(100vh - 48px); overflow: auto;
  padding: 34px 38px 38px; background: #FFF; border-radius: 16px;
  box-shadow: 0 20px 70px rgba(0,0,0,.28); color: #172B49; outline: none;
}
.benefit-v2-modal__close {
  position: absolute; top: 14px; right: 16px; display: grid; width: 42px; height: 42px; place-items: center;
  padding: 0; appearance: none; background: var(--band-color, #e8eaf4); border: 0; border-radius: 50%;
  color: var(--main-color, #1f285f); font-size: 28px; line-height: 1; cursor: pointer;
  text-decoration: none !important;   /* テーマのa下線を確実に消す */
}
.benefit-v2-modal__eyebrow { margin: 0 0 4px; color: #EF6C19; font-size: 14px; font-weight: 800; text-align: center; }
.lp-body #seizu_nyumon .benefit-v2-modal .benefit-v2-modal__title,
.benefit-v2-modal__title {
  width: auto; margin: 0 0 28px; padding: 0; background: transparent;
  color: var(--main-color, #1f285f); font-size: 28px; font-weight: 800; line-height: 1.5;
  letter-spacing: .02em; text-align: center;
}
.benefit-v2-modal__title::before, .benefit-v2-modal__title::after { display: none; content: none; }
.benefit-v2-modal__panel {
  display: grid; grid-template-columns: minmax(280px, .9fr) minmax(0, 1.25fr); gap: 30px; align-items: center;
}
.benefit-v2-modal__visual {
  display: flex; height: auto; aspect-ratio: 1 / 1; align-items: center; justify-content: center;
  overflow: hidden; padding: 0; background: #FFF9F0; border: 1px solid #F0DECA; border-radius: 10px;
}
.benefit-v2-modal__visual img { display: block; width: 100%; max-width: 100%; height: 100%; margin: 0; object-fit: contain; }
.benefit-v2-modal__number { margin: 0 0 6px; color: #EF6C19; font-size: 14px; font-weight: 800; }
.benefit-v2-modal__content h3 { margin: 0 0 14px; color: #172B49; font-size: 25px; font-weight: 800; line-height: 1.45; }
.benefit-v2-modal__content > p:not(.benefit-v2-modal__number) { margin: 0 0 20px; color: #4A5D72; font-size: 15px; line-height: 1.9; }
.benefit-v2-modal__attention { color: #6a737c !important; font-size: 13px !important; line-height: 1.8 !important; }
.benefit-v2-modal__content dl { margin: 0; }
.benefit-v2-modal__content dl > div {
  display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 10px; padding: 13px 0; border-top: 1px solid #DDE2F0;
}
.benefit-v2-modal__content dt { color: var(--main-color, #1f285f); font-size: 14px; font-weight: 800; }
.benefit-v2-modal__content dd { margin: 0; color: #4A5D72; font-size: 14px; line-height: 1.75; }

/* タブレット・スマホ：1列 */
@media screen and (max-width: 900px) {
  .lp-body #seizu_nyumon .benefit-v2__grid { grid-template-columns: 1fr; width: min(520px, 100%); margin: 0 auto; }
  .lp-body #seizu_nyumon .benefit-v2-card__image { height: auto; }
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .tokuten.benefit-v2 { padding: 48px 16px 44px; }
  .lp-body #seizu_nyumon .benefit-v2 .benefit-v2__title { font-size: 24px; padding-top: 26px; }
  .lp-body #seizu_nyumon .benefit-v2__lead { margin-bottom: 30px; font-size: 14px; text-align: left; }
  .lp-body #seizu_nyumon .benefit-v2-card__number { width: 56px; height: 56px; font-size: 22px; }
  .lp-body #seizu_nyumon .benefit-v2-card h3 { font-size: 19px; }
  .lp-body #seizu_nyumon .benefit-v2-card__description { font-size: 14px; }
  .benefit-v2-modal { padding: 14px; }
  .benefit-v2-modal__dialog { padding: 28px 18px 24px; }
  .benefit-v2-modal__title { font-size: 21px; }
  .benefit-v2-modal__panel { grid-template-columns: minmax(0, 1fr); gap: 18px; }
}

/* ---- FAQ（旧LP style_seizu.css を踏襲・スコープ付き）Q&A行=点線区切り・回答は薄グレー背景。
   q.png/a.pngアイコンはインライン。見出し帯のみ主色#1f285fに統一（旧#2c346bとほぼ同色） --- */
.faq-icon {
  filter: invert(45%) sepia(87%) saturate(319%) hue-rotate(194deg) brightness(43%) contrast(126%);
}
.lp-body .faq h2 { font-size: 34px; color: #1f285f; background: #e8eaf4; text-align: center; font-weight: 700; padding: 24px 30px 20px; margin: 44px 0 24px; line-height: 1.4; }
@media screen and (max-width: 767px) { .lp-body .faq h2 { font-size: 24px; padding: 18px 16px 14px; } }
.lp-body .faq p { margin: 0 4%; letter-spacing: 0.025em; }
.lp-body .faq p img { position: relative; top: -3px; }
/* 2026-08-02 CSS監査: 旧FAQのQ/A行（.faq_q / .faq_a）と旧お客様の声（.okyaku 一式）を削除。
   併記されていた .lp-body .okyaku h2 系セレクタも取り除いた（.lp-body .faq h2 は現役）。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
@media screen and (max-width: 480px) {
  .lp-body .faq p { margin: 0 3%; }
}

/* FAQの見出し帯を画面幅いっぱいに（100vwブレイクアウト）＋帯高を .section-title と統一（min-height160・上下中央） */
.lp-body .faq h2 {
  width: 100vw; position: relative; left: 50%; right: 50%;
  margin-left: -50vw; margin-right: -50vw; box-sizing: border-box;
  min-height: 160px; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
@media screen and (max-width: 767px) { .lp-body .faq h2 { min-height: 110px; } }
/* 見出しの見た目を .section-title と同じに：薄帯#e8eaf4・紺文字（上で指定）＋紺のアクセント線 */
.lp-body .faq h2::before { content: ""; display: block; width: 52px; height: 4px; background: #1f285f; border-radius: 2px; margin: 0 auto 20px; }

/* ---- 締め画像（.bottom-img）新テーマ画像 bottom-img.png / _sp.png・is-pc/is-spで出し分け --- */
.lp-body .bottom-img { text-align: center; margin: 40px auto 0; }
.lp-body .bottom-img img { max-width: 900px; width: 100%; height: auto; }
/* 締め画像が他LPより小さかった修正：共通lp_editor.cssの .bottom-img{width:70%} が
   seizuでは960px幅コンテナ内で672pxに縮小。PCのみ width:100%(=max-width900pxで頭打ち)にして他LPと同じ900pxに。
   モバイルは lp_editor.css の width:calc(100% - 40px) を維持。アース指定 2026-07-25 */
@media screen and (min-width: 768px) { .lp-body .bottom-img { width: 100%; } }

/* ---- FAQ下部のCTA / お問い合わせ（.faq-cta）新フォーマット・中央寄せ ---------- */
.faq-cta {
  width: 80%;
  max-width: 620px;
  margin: 40px auto 60px;
}
.faq-cta a {
  background-color: #1f285f;   /* ← seizu accent */
  color: #FFF;
  font-size: 24px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  width: 100%;
  height: 82px;
  padding: 0 30px;
  box-shadow: 0 3px 8px rgba(0, 0, 0, .12);
  text-decoration: none;
  transition: background-color .2s;
}
.faq-cta a:hover { background-color: #161d46; }
@media screen and (max-width: 767px) {
  .faq-cta { width: calc(100% - 40px); }
  .faq-cta a { font-size: 17px; letter-spacing: 0; width: auto; }
}

/* ---- FAQショートコード対応（インライン<style>の上書き対策） ----------------
   FAQをショートコード化すると、出力される <style> が .faq(80%左寄せ)と
   .faq-cta a(旧#0989b1・角丸84px・font32)を「同詳細度で後勝ち」上書きしてしまう。
   → .lp-body で詳細度を上げ、確実に効かせたい背景等は !important で seizu デザインに戻す。
   ① .faq を中央寄せ（右側の余白を解消）② お問い合わせボタンを seizu デザインに復帰 */
.lp-body .faq { margin-left: auto; margin-right: auto; }
.lp-body .faq-cta { width: 80%; max-width: 620px; margin: 40px auto 60px; }
.lp-body .faq-cta a { background-color: #1f285f !important; color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 16px !important; width: 100%; height: 82px !important; padding: 0 30px !important; font-size: 24px !important; font-weight: 700; letter-spacing: normal; box-shadow: 0 3px 8px rgba(0, 0, 0, .12); text-decoration: none; transition: background-color .2s; }
.lp-body .faq-cta a:hover { background-color: #161d46 !important; opacity: 1; }
@media screen and (max-width: 767px) {
  .lp-body .faq-cta { width: calc(100% - 40px); }
  .lp-body .faq-cta a { font-size: 17px !important; height: auto !important; padding: 14px 20px !important; letter-spacing: 0; }
}

/* 「このページのTOPへ」ボタンは全LP共通のテーマ標準 #page-top（style.css）を使用。
   本文 <main> 内に <div id="page-top"><a href="#top">このページのTOPへ▲</a></div> を置くだけ（CSS不要）。 */

/* 2026-08-03 「このページのTOPへ▲」がセクションによって隠れる問題の修正（kyoudoと同内容）。
   #page-top は position:fixed だが z-index の指定がSP用メディアクエリ内にしかなく、
   タブレット〜PC幅では z-index:auto。DOM上あとに来る position 付きセクションに
   上から塗られて見えなくなっていた。全幅で 9001 を指定する。 */
body.lp-body #page-top { z-index: 9001; }

/* =============================================================
   機械製図超入門講座：お問い合わせページ専用（seizu_ask / page-id 8919）
   2026-07-29  kyoudo のお問い合わせページ（kyoudo_ask）を移植し、紺 #1f285f 系に配色変更。
   ★kyoudo は同等のCSSを投稿本文内の <style> に書いているが、seizu は保守しやすさを
     優先して本ファイルに集約した（本文には id="seizu-ask" とマークアップのみ）。
   変更点は2つだけ：
     ① ヒーロー … 青い背景写真(lp-bg.jpg)をやめ、薄紺帯＋アクセント線＋サブ文に
     ② 見出しアイコン … <img> をやめ、CSSマスクの <span class="ask-ico"> で主色に着色
        （SVGファイル自体は無改変なので他ページに影響しない）
   ※「よくあるご質問」リンクは既に /seizu_top/#faq-anchor を指しているため変更なし。
   ============================================================= */
.lp-body:has(#seizu-ask) .lp-low {
  background: #F5F6FB; position: static; margin-bottom: 56px; padding: 34px 20px 26px; height: auto;
}
.lp-body:has(#seizu-ask) .lp-low img { display: none; }
.lp-body:has(#seizu-ask) .lp-low .ttl {
  position: static; color: #17233f; transform: none; bottom: auto; width: auto;
  font-size: 32px; font-weight: 800; text-align: center;
}
.lp-body:has(#seizu-ask) .lp-low .ttl::before {
  content: ""; display: block; width: 52px; height: 4px; background: var(--main-color); margin: 0 auto 16px;
}
.lp-body:has(#seizu-ask) .lp-low .ask-sub {
  max-width: 640px; margin: 10px auto 0; color: #718096;
  font-size: 14px; font-weight: 600; line-height: 1.7; text-align: center;
}
/* 見出しアイコン（.lp-form .ttl は既に flex / gap:24px / 主色なので、アイコンだけ差し替える） */
#seizu-ask .ttl .ask-ico {
  display: block; width: 1.66em; height: 1.66em; flex: 0 0 auto;
  background-color: var(--main-color);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center center; mask-position: center center;
  -webkit-mask-size: contain; mask-size: contain;
}
#seizu-ask .ttl .ask-ico--1 { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/ico-contact01.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/ico-contact01.svg"); }
#seizu-ask .ttl .ask-ico--2 { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/ico-contact02.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/ico-contact02.svg"); }
#seizu-ask .ttl .ask-ico--3 { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/ico-contact03.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/ico-contact03.svg"); }
@media screen and (max-width: 767px) {
  .lp-body:has(#seizu-ask) .lp-low { padding: 28px 16px 22px; margin-bottom: 40px; }
  .lp-body:has(#seizu-ask) .lp-low .ttl { font-size: 24px; }
  .lp-body:has(#seizu-ask) .lp-low .ask-sub { font-size: 13px; text-align: left; }
}

/* =============================================================
   機械製図超入門講座：申込みページ専用（seizu_paidseminar-order / page-id 8923）
   2026-07-29  kyoudo の申込みページ（#kyoudo-order）を移植し、紺 #1f285f 系に配色変更。
   HTMLの #seizu-order 内だけに適用するため、LP本体には影響しない。
   ★このページの価格は本文末尾の<script>が .price01〜.price04 へ自動出力する。
     カード内のこれらのクラスは削除・改名しないこと。
     商品ID: 24=一括 / 25=6回払い / 26=法人（数量入力あり）
   ★旧レイアウト（PC用 table.hidden-phone 1本＋SP用 table.visible-phone 3本）は
     3枚カードで PC/SP 両対応にしたため本文から撤去済み（kyoudoはCSSで非表示、
     seizuはマークアップごと削除して重複カートフォームを解消）。
   ============================================================= */
.lp-body:has(#seizu-order) header.l-header.p-header .p-header__inner__bottom,
.lp-body:has(#seizu-order) header.l-header.p-header .p-header__float {
  display: none !important;
}

/* ---- 戻るリンク ---- */
.lp-body:has(#seizu-order) .order-back-bar {
  position: absolute; top: 28px; left: max(40px, calc(50% - 520px));
  z-index: 2; background: transparent; padding: 0;
}
.lp-body:has(#seizu-order) .order-back-bar__inner { max-width: none; margin: 0; padding: 0; }
.lp-body:has(#seizu-order) .order-back-bar a {
  display: inline-flex; align-items: center; color: var(--main-color);
  font-weight: 700; font-size: 14px; text-decoration: none;
}
.lp-body:has(#seizu-order) .order-back-bar a::before { content: "←"; margin-right: 6px; }
.lp-body:has(#seizu-order) .order-back-bar a:hover { text-decoration: underline; }

/* ---- ヒーロー（旧: 青い背景画像 → 薄紺帯＋アクセント線） ---- */
.lp-body:has(#seizu-order) .lp-low {
  background: #F5F6FB; position: relative; margin-bottom: 0; padding: 34px 20px 26px; height: auto;
}
.lp-body:has(#seizu-order) .lp-low img { display: none; }
.lp-body:has(#seizu-order) .lp-low .ttl {
  position: static; color: #17233f; transform: none; bottom: auto; width: auto;
  font-size: 32px; font-weight: 800; text-align: center;
}
.lp-body:has(#seizu-order) .lp-low .ttl::before {
  content: ""; display: block; width: 52px; height: 4px; background: var(--main-color); margin: 0 auto 16px;
}
.lp-body:has(#seizu-order) .lp-low .order-title-row {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px; white-space: nowrap;
}
.lp-body:has(#seizu-order) .lp-low .order-course-title,
.lp-body:has(#seizu-order) .lp-low .order-page-title { display: block; }
.lp-body:has(#seizu-order) .lp-low .order-course-title { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.5; }
.lp-body:has(#seizu-order) .lp-low .order-page-title { font-size: inherit; line-height: 1.4; }
.lp-body:has(#seizu-order) .lp-low .op-sub {
  max-width: 600px; margin: 10px auto 0; color: #718096;
  font-size: 14px; font-weight: 600; line-height: 1.7; text-align: center;
}
#seizu-order > section:first-child { padding-top: 42px; }

/* ---- ご受講までの4ステップ ---- */
#seizu-order .opf-heading {
  text-align: center; color: #17233f; font-size: 24px; font-weight: 800; margin: 0 0 30px;
}
#seizu-order .opf-heading::before { content: none !important; display: none !important; }
#seizu-order .opf-steps { display: flex; max-width: 760px; margin: 0 auto; }
#seizu-order .opf-step {
  flex: 1 1 0; min-width: 0; position: relative; display: flex; flex-direction: column;
  align-items: center; text-align: center; padding-top: 34px;
}
#seizu-order .opf-step::before {
  content: ""; position: absolute; top: 55px; left: -50%; width: 100%; height: 2px;
  background: #d6dbea; z-index: 0;
}
#seizu-order .opf-step:first-child::before { display: none; }
#seizu-order .opf-circle {
  position: relative; z-index: 1; width: 42px; height: 42px; flex: 0 0 auto;
  border-radius: 50%; border: 2px solid #b3bbd8; background: #fff; color: var(--main-color);
  font-size: 18px; font-weight: 800; line-height: 1; display: flex; align-items: center; justify-content: center;
}
#seizu-order .opf-step--current .opf-circle { background: var(--main-color); border-color: var(--main-color); color: #fff; }
#seizu-order .opf-badge {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  background: var(--main-color); color: #fff; font-size: 11px; font-weight: 700; line-height: 1.5;
  padding: 3px 10px; border-radius: 6px; white-space: nowrap;
}
#seizu-order .opf-badge::after {
  content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%);
  border: 5px solid transparent; border-top-color: var(--main-color);
}
#seizu-order .opf-name { margin-top: 12px; font-size: 15px; font-weight: 800; color: #17233f; line-height: 1.4; }
#seizu-order .opf-sub { margin-top: 4px; font-size: 12px; font-weight: 600; color: #8a92a6; line-height: 1.5; }

/* ---- お支払いプラン（3枚カード） ---- */
#seizu-order .opp-sec {
  background: #F5F6FB; padding: 44px 20px 48px; margin: 0 0 32px;
  width: 100vw; margin-left: calc(50% - 50vw);
}
#seizu-order .opp-sec__head { text-align: center; margin: 0 0 30px; }
#seizu-order .opp-sec__head h3.opp-title {
  color: #17233f; font-size: 26px; font-weight: 800; margin: 0; text-align: center;
  background: none !important; background-image: none !important; border: none !important; padding: 0 !important;
}
#seizu-order .opp-sec__head h3.opp-title::before {
  content: ""; display: block; width: 52px; height: 4px; background: var(--main-color); margin: 0 auto 16px;
}
#seizu-order .opp-sec__head p.opp-lead {
  color: #718096; font-size: 14px; font-weight: 600; margin: 10px 0 0; text-align: center;
}
#seizu-order .opp-wrap { display: flex; gap: 20px; max-width: 900px; margin: 0 auto; align-items: stretch; }
#seizu-order .opp-card {
  flex: 1 1 0; min-width: 0; background: #fff; border-radius: 14px; overflow: hidden;
  display: flex; flex-direction: column; box-shadow: 0 4px 14px rgba(23, 35, 63, .08);
}
#seizu-order .opp-card--c { position: relative; z-index: 2; overflow: visible; }
#seizu-order .opp-card--c .opp-card__head { border-radius: 14px 14px 0 0; }
#seizu-order .opp-card--c .opp-card__body { border-radius: 0 0 14px 14px; }
#seizu-order .opp-card__head {
  padding: 15px 12px; text-align: center; color: #fff; font-size: 17px; font-weight: 800; letter-spacing: .02em;
}
#seizu-order .opp-card--a .opp-card__head,
#seizu-order .opp-card--b .opp-card__head { background: var(--main-color); }
#seizu-order .opp-card--c .opp-card__head { background: #EF6C19; }
#seizu-order .opp-card__body { padding: 20px 36px 22px; display: flex; flex-direction: column; flex: 1; text-align: center; }
/* 価格ブロック：メタ／［ラベル＋割引ピル］／価格／税込 の4段。
   ★kyoudoは2カラムグリッド（"label badge"）＋カード別の translateX(-38px/-42px) で
     ピルを左へ寄せている。これは価格行が2カラムを押し広げてラベルとピルの間に
     大きな余白ができるのを打ち消すための調整で、ラベル文言の長さに依存して脆い。
     seizuは「販売価格／1名」など文言が長いカードがあるため、ラベルとピルを
     .opp-labelrow で1行にまとめ、1カラムグリッド＋flexで隙間を作らない方式にした。 */
/* 260802 ラベル（定価／販売価格）を他LPと同じく価格の左端に揃える。
   従来は列幅がカード幅いっぱい（1fr）で justify-items:center だったため、
   ラベルだけが価格の上で中央に浮いていた。
   列幅を max-content（＝最も広い行＝価格の幅）にして justify-content:center で
   その列ごとカード内中央に置き、各行は justify-items:start で左揃えにする。
   こうすると価格の見た目の位置は変わらないまま、ラベルが価格の左端に揃う。 */
#seizu-order .opp-priceblock {
  display: grid; grid-template-columns: max-content;
  justify-content: center; justify-items: start; align-items: center;
}
#seizu-order .opp-meta { color: #8a92a6; font-size: 14px; font-weight: 600; line-height: 1.6; }
#seizu-order .opp-card__body .opp-meta { margin: 0 0 14px !important; }
#seizu-order .opp-meta .opp-reg { text-decoration: line-through; text-decoration-thickness: 1px; }
/* ラベルと割引ピルを隙間なく横並びに */
#seizu-order .opp-labelrow {
  display: flex; align-items: center; justify-content: flex-start; gap: 6px;
  margin: 0 0 3px; flex-wrap: wrap;
}
#seizu-order .opp-label {
  display: block; margin: 0 !important; text-align: left;
  font-size: 12px; font-weight: 600; color: #8a92a6; line-height: 1.5; white-space: nowrap;
}
/* 260802 ラベル文言を割引の有無で出し分ける（アース指定：割引が無いときは全講座「定価」に統一）。
   これまで seizu だけHTMLに「販売価格」とベタ書きだったため、定価販売に戻しても
   「販売価格」のままで、即戦力・強度（旧「通常価格」）とも表記が揃っていなかった。
   即戦力・強度と同じくラベルはHTMLから文言を外し、CSSの ::before で出す方式に変更。
   割引中かどうかは、[check_discount] の中でだけ出力される割引ピル .opp-pill の有無で判定する。
   b（分割払い）カードは割引に関係なく「月々のお支払い」。 */
#seizu-order .opp-label::before { content: "定価"; }
#seizu-order .opp-labelrow:has(.opp-pill) .opp-label::before { content: "販売価格"; }
#seizu-order .opp-card--c .opp-labelrow:has(.opp-pill) .opp-label::before { content: "販売価格／1名"; }
#seizu-order .opp-label--b::before { content: "月々のお支払い" !important; }
#seizu-order .opp-pill {
  display: inline-flex; align-items: center; margin: 0 !important;
  padding: 2px 7px; border: 1px solid #f1d0ad; border-radius: 999px; background: #fff8f0;
  color: #b76018; font-size: 10px; font-weight: 700; line-height: 1.4; letter-spacing: .03em; white-space: nowrap;
}
#seizu-order .opp-price { line-height: 1.25; }
#seizu-order .opp-card__body .opp-price { margin: 0 !important; line-height: 1.25 !important; }
#seizu-order .opp-price .price01,
#seizu-order .opp-price .price03 { display: inline !important; font-size: 30px !important; font-weight: 800 !important; }
#seizu-order .opp-card--a .opp-price .price01 { color: #cc0000; }
#seizu-order .opp-card--b .opp-price .price03 { color: var(--main-color); }
#seizu-order .opp-card--c .opp-price .price01 { color: #EF6C19; }
#seizu-order .opp-card--c .opp-price br { display: none; }
#seizu-order .opp-card--c .opp-price .price01::after {
  content: "（税別）"; font-size: 14px; font-weight: 700; color: #5b6472;
}
#seizu-order .opp-price .opp-tax { font-size: 14px; font-weight: 700; color: #5b6472; margin-left: 2px; }
#seizu-order .opp-price .price02,
#seizu-order .opp-price .price04 { display: block !important; color: #606469; font-size: 15px; font-weight: 600; margin-top: 2px; }
#seizu-order .opp-monthly { font-size: 16px; white-space: nowrap; }
#seizu-order .opp-card__body .opp-monthly { margin: 0 !important; }
#seizu-order .opp-taxline { color: #606469; font-size: 15px; font-weight: 600; line-height: 1.25 !important; }
#seizu-order .opp-taxline .price02,
#seizu-order .opp-taxline .price04 { display: inline !important; }
#seizu-order .opp-card__body .opp-taxline { margin: 2px 0 0 !important; }
/* 受講人数のⓘツールチップ */
#seizu-order .opp-info {
  position: relative; display: inline-flex; align-items: center; justify-content: center;
  width: 17px; height: 17px; flex: 0 0 auto; border-radius: 50%;
  border: 1px solid var(--main-color); color: var(--main-color);
  font-size: 11px; font-weight: 800; line-height: 1; cursor: help;
}
#seizu-order .opp-info::before { content: "i"; font-family: Georgia, "Times New Roman", serif; font-style: italic; }
/* 2026-08-03 ツールチップ本文に「付属テキストの配送」の案内を追記したため、
   5〜7行の長文でも読めるよう 文字11→12px・太さ600→500・行間1.5→1.7・
   余白6/10→10/12px・最大幅260→300px に拡張。位置と挙動は変更なし。 */
#seizu-order .opp-tip {
  position: absolute; bottom: calc(100% + 9px); right: -4px; left: auto;
  background: #17233f; color: #fff; font-size: 12px; font-weight: 500; line-height: 1.7;
  padding: 10px 12px; border-radius: 6px; width: max-content; max-width: 300px;
  white-space: normal; text-align: left; opacity: 0; visibility: hidden; transition: opacity .15s; z-index: 5;
}
/* 「団体割引は適用されません」等を <b> で強調したときの色（濃紺背景で読める淡橙） */
#seizu-order .opp-tip b { font-weight: 700; color: #ffd28a; }
#seizu-order .opp-tip::after {
  content: ""; position: absolute; top: 100%; right: 10px; border: 5px solid transparent; border-top-color: #17233f;
}
#seizu-order .opp-info:hover .opp-tip,
#seizu-order .opp-info:focus .opp-tip { opacity: 1; visibility: visible; }
/* 支払い手段リスト */
#seizu-order .opp-list { list-style: none !important; text-align: left; border-top: 1px solid #e6eaf4; }
#seizu-order .opp-card__body .opp-list { margin: 14px 0 0 !important; padding: 14px 0 0 !important; }
#seizu-order .opp-list li {
  list-style: none !important; position: relative; padding: 0 0 0 20px;
  font-size: 13px; font-weight: 600; color: #3c4453; line-height: 1.6;
}
#seizu-order .opp-card__body .opp-list li { margin: 0 0 8px !important; }
#seizu-order .opp-list li::marker { content: ""; }
#seizu-order .opp-list li::before {
  content: ""; position: absolute; left: 2px; top: .5em; width: 8px; height: 8px; border-radius: 50%;
}
#seizu-order .opp-card--a .opp-list li::before,
#seizu-order .opp-card--b .opp-list li::before { background: var(--main-color); }
#seizu-order .opp-card--c .opp-list li::before { background: #EF6C19; }
/* カートボタン */
#seizu-order .opp-cart { margin-top: auto; margin-left: -14px; margin-right: -14px; }
#seizu-order .opp-card__body .opp-cart { padding-top: 10px !important; }
#seizu-order .opp-card__body .opp-cart p.cart { margin: 0 !important; text-align: center; }
#seizu-order .opp-qty {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font-size: 13px; font-weight: 700; color: #3c4453;
}
#seizu-order .opp-card__body .opp-cart p.cart.opp-qty { margin: 0 0 20px !important; }
#seizu-order .opp-cart input.product_quantity {
  width: 56px; text-align: center; padding: 6px; border: 1px solid #d5dbe2; border-radius: 6px; font-size: 14px;
}
#seizu-order .opp-cart input.product_cart {
  width: 90%; -webkit-appearance: none; appearance: none;
  border: none !important; border-radius: 8px !important; padding: 14px 6px;
  background: #c00 !important; background-image: none !important; color: #fff !important;
  font-weight: 800; font-size: 13px; line-height: 1.4; cursor: pointer;
  box-shadow: none !important; transition: opacity .2s;
}
#seizu-order .opp-cart input.product_cart:hover {
  opacity: .75; border: none !important; border-radius: 8px !important; box-shadow: none !important; background: #c00 !important;
}
#seizu-order .opp-cart input.product_cart:focus,
#seizu-order .opp-cart input.product_cart:active {
  opacity: .6; border: none !important; border-radius: 8px !important;
  outline: none !important; box-shadow: none !important; background: #c00 !important;
}

/* ---- ご購入前の確認事項 ---- */
#seizu-order .opn {
  max-width: 900px; margin: 32px auto 0; background: #f9fafd;
  border: 1px solid #e0e5f2; border-radius: 16px; padding: 26px 22px 20px; text-align: left;
}
#seizu-order .opn p { margin: 0 !important; }
#seizu-order .opn p.opn__title {
  margin: 0 0 18px !important; font-size: 20px; font-weight: 800; color: #17233f; line-height: 1.45; text-align: center;
}
#seizu-order .opn__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
#seizu-order .opn__card {
  position: relative; min-width: 0; min-height: 0; padding: 18px 16px 16px 56px;
  border: 1px solid #dfe4f0; border-radius: 10px; background: #fff;
}
#seizu-order .opn__card-icon {
  position: absolute; top: 18px; left: 16px; width: 27px; height: 27px;
  background-color: var(--main-color);
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
}
#seizu-order .opn__card--invoice .opn__card-icon { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg"); }
#seizu-order .opn__card--receipt .opn__card-icon { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg"); }
#seizu-order .opn__card--warning .opn__card-icon { -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg"); mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg"); }
#seizu-order .opn__ttl { font-size: 15px; font-weight: 800; color: var(--main-color); margin: 0 0 8px !important; }
#seizu-order .opn__txt { font-size: 12px; color: #3c4453; line-height: 1.7; }

/* ---- スマホ（3枚カードを縦積み。旧SPテーブルは撤去済み） ---- */
@media screen and (max-width: 767px) {
  .lp-body:has(#seizu-order) .order-back-bar { position: static; margin: 0 0 18px; text-align: left; }
  .lp-body:has(#seizu-order) .order-back-bar a { font-size: 13px; }
  .lp-body:has(#seizu-order) .lp-low { padding: 28px 16px 22px; margin-top: 0; }
  .lp-body:has(#seizu-order) .lp-low .ttl { font-size: 24px; }
  .lp-body:has(#seizu-order) .lp-low .order-title-row { flex-direction: column; gap: 4px; white-space: normal; }
  .lp-body:has(#seizu-order) .lp-low .order-course-title { margin: 0; font-size: 15px; }
  #seizu-order > section:first-child { padding-top: 28px; }
  #seizu-order .opf-heading { font-size: 20px; margin-bottom: 22px; }
  #seizu-order .opf-circle { width: 36px; height: 36px; font-size: 15px; }
  #seizu-order .opf-name { font-size: 13px; }
  /* ---- SPは4ステップを2×2に組み替える  2026-07-30 ----
     横1列4カラムだと1カラム88px（320px時）しかなく、補足ラベルを11pxまで
     落としても2行に折り返して窮屈だった。2×2にすると1カラム136px確保でき、
     ラベルを12pxに戻しても320pxで全て1行に収まる（実測: 84/96/120/108px）。
     連結線（.opf-step::before は「1つ前のステップから伸びる線」）は、
     行をまたぐ 2→3 の間に引くと不自然なので、各行の2列目（偶数番）だけ残す。 */
  #seizu-order .opf-steps {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 8px; row-gap: 18px; max-width: 340px;
  }
  #seizu-order .opf-step { padding-top: 30px; }
  #seizu-order .opf-step::before { display: none; }
  #seizu-order .opf-step:nth-child(even)::before { display: block; top: 47px; }
  #seizu-order .opf-sub { font-size: 12px; }
  #seizu-order .opp-sec { padding: 32px 16px 36px; }
  #seizu-order .opp-sec__head h3.opp-title { font-size: 21px; }
  #seizu-order .opp-wrap { flex-direction: column; gap: 16px; }
  /* ★重要バグ修正 2026-07-30
     .opp-card は PC の3カラム等幅用に flex:1 1 0 を持つ。縦並びに切り替えると
     flex-basis:0 が「高さ0」の起点になり、さらに .opp-card の overflow:hidden で
     自動最小サイズ（min-height:auto）が無効化されるため、a（一括払い）と
     b（6回払い）の2枚が高さ0に潰れて画面から消えていた。
     ※c（法人）だけ残っていたのは overflow:visible を個別指定しているため。
     縦並びでは内容の高さを使う（flex:0 0 auto）。 */
  #seizu-order .opp-card { flex: 0 0 auto; }
  #seizu-order .opp-card__body { padding: 18px 20px 20px; }
  #seizu-order .opp-list { margin-top: 16px !important; padding-top: 16px !important; }
  #seizu-order .opp-list li { font-size: 14px; }
  #seizu-order .opp-cart { margin-right: 0; margin-left: 0; }
  #seizu-order .opp-card__body .opp-cart { padding-top: 14px !important; }
  #seizu-order .opp-card__body .opp-cart p.cart.opp-qty { margin-bottom: 18px !important; }
  #seizu-order .opp-qty { flex-wrap: wrap; gap: 7px; font-size: 14px; }
  #seizu-order .opp-cart input.product_cart { width: 100%; min-height: 50px; padding: 14px 10px; font-size: 14px; }
  /* ツールチップ：受講人数の行を基準にして右端を揃える。
     旧: .opp-info（17px角のiバッジ）基準の right:-8px だったため、320pxでは
     260px幅の吹き出しが画面左へ11pxはみ出していた（実測 left:-11px）。
     .opp-info を static に戻し、.opp-qty を配置基準にすることで
     カード内に収まる（320pxで left:24 / right:284）。 */
  #seizu-order .opp-qty { position: relative; }
  #seizu-order .opp-info { position: static; }
  /* 2026-08-03 長文化に合わせて上限を260→300pxへ。画面端の余白は48→40pxに詰める */
  #seizu-order .opp-tip { right: 0; left: auto; width: max-content; max-width: min(300px, calc(100vw - 40px)); }
  #seizu-order .opn { margin-top: 24px; padding: 20px 14px 16px; }
  #seizu-order .opn__grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  #seizu-order p.more a { white-space: nowrap; }
}

/* ---- フッター（sokusen per-LP から移植・主色は var(--main-color)=#1f285f） ----
   ★これも初版で移植漏れだった箇所。 */
.l-footer { background: #1963aa; }
.l-footer * { color: #fff; }
.l-footer a { text-decoration: none; }
/* フッター下部メニュー(トップ/動作環境/特定商取引法/運営会社)のホバー：上メニュー同様に赤へ。
   ※法人向け無料トライアル/チラシDL(.f-link)には掛けない（.f-inner直下のul のみ対象） */
.l-footer .f-inner > ul a:hover { color: #ff0000; } /* !important撤去（アース指定 2026-07-25）。ホバー色は lp_editor.css の共通指定(#E5E5E5)が後勝ちで適用される */
.f-nav { background: var(--main-color); padding: 30px 0; font-size: 18px; }
.f-nav ul { display: flex; flex-wrap: wrap; gap: 1em 2em; }
.f-inner { width: 960px; margin: 0 auto; max-width: calc(100% - 40px); }
.f-inner p { font-weight: bold; font-size: 24px; }
.f-inner.a p span { font-size: 14px; display: inline-block; line-height: 1.4; }
.f-inner .f-link li:first-child a { background: #F26700; color: #FFF; }
.f-inner.a p .is-sp { display: inline; }
.f-inner.a { display: flex; justify-content: space-between; padding: 45px 0; }
@media screen and (max-width: 950px) { .f-inner.a { flex-direction: column; padding: 50px 0; gap: 20px; } }
@media screen and (min-width: 951px) {
  .f-inner p { margin-top: 2em; }
  .f-inner.a p { width: calc(100% - 600px); }
  .f-inner.a .right { width: 560px; }
}
@media screen and (max-width: 767px) {
  .f-inner { font-size: 14px; }
  .f-inner > ul { width: 50%; margin: 0 auto 0 20px; }
  .f-inner p { font-size: 24px; }
}
.f-link { display: flex; flex-wrap: wrap; gap: 20px; text-align: center; margin-bottom: 20px; }
.f-link li { width: calc(50% - 10px); }
.f-link li:nth-child(3) { width: 100%; }
/* ボタン背景は共通lp_editor.css（.f-link a=白／first-child=橙）で制御。
   ここでは文字色を主色（濃紺）にして白ボタンの文字を可視化（sokusen 6529相当）。
   first-child(法人トライアル橙)は .f-inner .f-link li:first-child a{color:#FFF} が優先で白のまま。 */
.f-link a { display: block; border: solid 3px #fff; border-radius: .5em; font-size: 20px; background: #fff; color: var(--main-color); padding: .8em 0; position: relative; font-weight: bold; }
.f-link a:hover { opacity: 0.7; }
@media screen and (max-width: 767px) { .f-link a { font-size: 18px; } }
.f-link a:before { content: ''; position: absolute; width: .5em; height: .5em; border-top: 2px solid #fff; border-right: 2px solid #fff; right: 1em; top: 1.2em; transform: rotate(45deg); }
/* 白ボタン(チラシDL=last-child)の矢印は濃紺に */
.f-link li:last-child a::before { border-top: 2px solid var(--main-color); border-right: 2px solid var(--main-color); }
.f-tel { text-align: left; }
.f-tel a { font-size: 32px; font-weight: bold; }
@media screen and (max-width: 767px) { .f-tel a { font-size: clamp(1.75rem, 1.124rem + 3.13vw, 2rem); } }
.f-tel img { width: 1.13em; vertical-align: middle; margin-right: .5em; }
.f-tel small { display: block; font-size: 20px; text-align: left; padding-left: 70px; }
@media screen and (max-width: 767px) { .f-tel small { font-size: clamp(1rem, 0.821rem + 0.89vw, 1.25rem); padding-left: clamp(3.125rem, 2.678rem + 2.24vw, 3.75rem); } }
.f-copy { text-align: center; background: #002b55; padding: 1em; font-size: 12px; font-weight: bold; }

/* ---- 価格カード（sokusen準拠を移植・主価格色は var(--main-color)=#1f285f） ----
   価格値は本文のショートコード [product product_id=24 field=product_price] で自動出力。
   2026-08-02 CSS監査: 旧OFF表示（.price-img / .off-txt-box / .off-sub-txt / .off-txt）を削除。
   LP・お申込み・お問い合わせの3ページのHTMLいずれにも存在しないことを実測確認。
   現行の料金カードは .price-box 側で描画している。復元はバックアップから。 */

/* ---- 追従カート(.float_cart)のOFFバッジ：koso同様 赤地#cc0000・白字。申込ボタンの下線も除去 -- */
.off { background:#cc0000; color:#fff; display:inline-block; font-size:12px; padding:0 3px !important; margin-bottom:5px !important; letter-spacing:0.075em; }
.btn_purchase a { text-decoration:none; }
/* SP追従カートの購入ボタン・タイトル（koso-basic 561/4857/4869行より。.off/.btn_purchaseだけ移植して漏れていた） */
@media screen and (max-width: 800px) { .visible-phone .buy { display: block; } }
.float_cart_sp .buy { line-height: 55px !important; margin-top: 0 !important; }
/* 2026-08-02 CSS監査: 未使用の .float_cart_title を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* ---- 固定購入欄(.float_cart)がCTAボタン・特徴カードに重なる問題を修正（kyoudo実装踏襲・2026-07-28） ----
   2026-08-03 更新：アース指示により「タブレットでも追従CTAカードを表示する」方針へ変更。
   旧: 768〜1334px は display:none（重なり回避のため非表示）
   新: 非表示をやめる。指定内容は lp_kyoudo.css と同一（3講座で見た目を揃えるため）。
   2026-08-03 経緯：一度は幅150px・bottom 90〜155px に縮める案にしたが、
   ①「このページのTOPへ▲」(#page-top＝common.jsがinlineでbottom:75px、画面下から128pxまで)と重なる
   ②幅150pxでは「講座に申し込む」が2行に折り返す
   の2点が出たため、既に問題なく表示できている即戦力LPと同じ見た目に揃える方針とし、
   サイズ・位置の上書きはすべて撤去して display:block のみとした。
   幅180px・bottom 150px（style.css のベース値）が適用され、TOPボタンとの間に 22px 残る。
   ※実機（iPad 縦 834px / 横 1024px）での確認は要。 */
@media screen and (min-width: 768px) and (max-width: 1334px) {
  .lp-body:has(#seizu_nyumon) .float_cart.hidden-phone {
    display: block !important;
  }
}

/* CTA上のキャンペーン表示(.over-cta)をseizuでは表示に戻す（②③のみ／①先頭は本文から削除済み）。
   全LP共通 lp_editor.css の .lp-body .over-cta{display:none} を seizu だけ上書き。editorが後読みのため!important。 */
.lp-body .over-cta { display:block !important; }

.price-txt{ font-weight:600; font-size:80px; letter-spacing:2px; color:var(--main-color); width:100%; text-align:center; display:flex; justify-content:center; align-items:center; line-height:1.2; }
.price-txt > img{ width:100px; height:40px; margin-right:15px; }
.price-txt span:last-child{ font-size:50px; margin-top:20px; }
@media screen and (max-width: 767px){
  .price-txt{ font-size:50px; position:relative; text-align:left; box-sizing:border-box; white-space:nowrap; letter-spacing:0; margin:0; }
  .price-txt > img{ width:80px; height:30px; }
  .price-txt > span{ font-size:48px; }
  .price-txt span:last-child{ font-size:30px; margin-top:10px; }
}
.price-txt_intax, .price-txt_intax_bunkatsu, .price-txt_intax_bunkatsu + p{ font-size:18px; line-height:2; }
@media screen and (max-width: 767px){ .price-txt_intax, .price-txt_intax_bunkatsu, .price-txt_intax_bunkatsu + p{ font-size:18px; line-height:1.6; } }

.sub-price{ width:100%; background:#e8eaf4; border-radius:14px; text-align:center; padding:20px 16px 12px; margin:24px auto 0; margin-left:0; box-sizing:border-box; }
.ttl_sub-price{ background:#1f285f; border-radius:30px; color:#fff; display:inline-block; padding:6px 15px; line-height:1; font-size:18px; }
.sub-price-txt{ font-weight:600; font-size:42px; letter-spacing:2px; color:var(--main-color); width:100%; text-align:center; display:flex; align-items:center; justify-content:center; }
.sub-price-txt i{ font-style:normal; }
.sub-price-txt span.main{ font-size:42px; }
.sub-price-txt span{ font-size:27px; }
@media screen and (max-width: 767px){
  .sub-price{ margin:24px auto 0; margin-left:0; width:100%; }
  .sub-price-txt{ position:relative; flex-direction:column; align-items:center; font-size:32px; flex-wrap:wrap; }
  .sub-price-txt span.main{ font-size:32px; }
  .sub-price-txt span{ font-size:20px; }
}

.price-box{ display:flex; flex-direction:column; align-items:center; background:#FFFFFF; width:90%; max-width:600px; margin:0 auto 64px; border:1px solid #ECECEC; border-top:none; border-radius:0 0 20px 20px; padding:8px 46px 48px; box-sizing:border-box; box-shadow:0 14px 34px rgba(20,50,70,0.07); }
@media screen and (max-width: 767px){ .price-box{ width:calc(100% - 28px); align-items:center; padding:30px 20px 40px; } }
.price-box .line-through{ font-size:18px; color:#9aa4ae; text-decoration-color:#d64541; text-decoration-thickness:2px; margin-bottom:14px; }
.price-box .price-txt_intax{ color:#7a838c; }
.line-through{ font-size:24px; color:#707070; text-decoration:line-through; line-height:1; }
@media screen and (max-width: 767px){ .line-through{ font-size:18px; line-height:1.6; text-align:center; } }
#price h4{ font-size:28px; margin-bottom:30px; text-align:center; }

/* ---- #price セクション（料金・申込方法）
   ★価格の自動出力は本文末尾の<script>が担う。以下のDOM構造は壊さないこと：
       .info .price .price01 / .price02   … 一括（税抜／税込）
       .bunkatsu .price01                 … 分割（月々）
       td.price_00〜price_03              … グループ割引表
       .float_cart .price / .intax        … 追従カート
     （いずれも [product product_id=24 field=product_price] を元に算出）
   2026-07-29 に price-v2 レイアウトへ移行。上記ブロックは移設のみで中身は非改変。 */
#price{ padding-bottom:24px; }
.price-box .info{ width:100%; }
.price-box .info .price{ width:100%; }
.price-box .info .price .price-txt{ margin-top:6px; }
.price-box .info .price .price-txt .main{ font-size:80px; line-height:1.1; }
@media screen and (max-width:767px){ .price-box .info .price .price-txt .main{ font-size:44px; } }
.price-box .info .price .price-txt_intax{ text-align:center; margin-top:4px; }
/* CTA上の期間限定表示(.over-cta) koso-basic(455行)に合わせる：背景透明・オレンジ文字#E9682C・29px・
   両端に＼／(PC)・SPは黄ハイライト。旧seizuのピル型(オレンジ帯/白文字)を廃止。 */
.over-cta{ font-size:29px; letter-spacing:2px; font-weight:600; color:#E9682C; margin-bottom:23px; position:relative; background:transparent; }
@media screen and (max-width:767px){ .over-cta{ background:linear-gradient(transparent 50%,#FFF242 50%,#FFF242 100%); font-size:clamp(14px, -0.202rem + 5.38vw, 21px); } }
@media screen and (max-width:400px){ .over-cta{ font-size:clamp(16px, 0.5rem + 2.5vw, 18px); } }
@media screen and (min-width:768px){
  .over-cta:before, .over-cta:after{ color:#3A3A3A; position:absolute; }
  .over-cta:before{ content:'＼'; margin-left:-1.1em; transform:rotate(20deg); }
  .over-cta:after{ content:'／'; margin-left:-.2em; transform:rotate(-20deg); }
}
/* CTA下の注意書き */
.cta-box ul{ list-style:none; padding:0; margin:22px auto 0; max-width:600px; text-align:left; }
.cta-box ul li{ position:relative; font-size:14px; line-height:1.9; color:#5a636b; padding-left:1.3em; }
.cta-box ul li::before{ content:"\203B"; position:absolute; left:0; color:#9aa4ae; }

/* =============================================================
   #price.price-v2「料金・申込方法」 2026-07-29
   kyoudo の price-v2 を seizu へ移植（ティール → 紺 #1f285f 系に配色変更）。
   左＝講座内容カード／右＝価格・申込カードの2カラム。下にグループ割引と確認事項。
   ★既存の自動出力ブロック（.line-through / .info / .sub-price.bunkatsu /
     グループ割引table）はそのまま入れ子にしており、ここで見た目だけ上書きする。
   ============================================================= */
.lp-body #seizu_nyumon #price.price-v2 {
  --pv2-main: #1f285f;
  --pv2-main-dark: #161d46;
  --pv2-soft: #eef0f8;
  --pv2-pale: #f7f8fc;
  --pv2-navy: #17233f;
  --pv2-text: #404b66;
  --pv2-muted: #71798c;
  --pv2-line: #dbe0ee;
  --pv2-orange: #ef6c19;
  --pv2-orange-soft: #fff7ed;
  --pv2-red: #cc0000;
  --pv2-red-dark: #b30000;
  --pv2-white: #fff;
  /* ★全幅化は上部の `.lp-body #price` の共通ブレイクアウト指定
     （width:100vw; left:50%; margin-left:-50vw）を流用する。
     ここで width/margin を再指定すると二重にずれるため書かない。 */
  padding: 64px max(20px, calc((100vw - 960px) / 2)) 58px;
  box-sizing: border-box;
  background: var(--pv2-white);
  color: var(--pv2-text);
}
.lp-body #seizu_nyumon #price.price-v2,
.lp-body #seizu_nyumon #price.price-v2 *,
.lp-body #seizu_nyumon #price.price-v2 *::before,
.lp-body #seizu_nyumon #price.price-v2 *::after { box-sizing: border-box; }

.lp-body #seizu_nyumon #price.price-v2 .pv2-title {
  width: auto; margin: 0 auto 8px; padding: 0; background: none;
  color: var(--pv2-main); font-size: 32px; font-weight: 800; line-height: 1.4; text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-title::before {
  content: ""; display: block; width: 52px; height: 4px; margin: 0 auto 20px;
  border-radius: 999px; background: var(--pv2-main);
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-lead {
  max-width: 760px; margin: 0 auto 44px; color: var(--pv2-text);
  font-size: 15px; font-weight: 600; line-height: 1.75; text-align: center;
}

/* 2カラム */
.lp-body #seizu_nyumon #price.price-v2 .pv2-top {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 24px; width: 100%; max-width: 960px; margin: 0 auto 24px; align-items: stretch;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-card {
  min-width: 0; overflow: hidden; border: 1px solid var(--pv2-line); border-radius: 14px;
  background: var(--pv2-white); box-shadow: 0 4px 16px rgba(24, 34, 80, .07);
}

/* 左：講座内容 */
.lp-body #seizu_nyumon #price.price-v2 .pv2-course { display: flex; flex-direction: column; padding: 28px 26px 24px; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-card-title {
  margin: 0 0 18px; color: var(--pv2-navy); font-size: 21px; font-weight: 800; line-height: 1.45;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-list { margin: 0; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row {
  display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 12px; align-items: start;
  padding: 12px 0; border-bottom: 1px solid #e9ecf5;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row:first-child { padding-top: 0; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row:last-child { border-bottom: 0; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row dt,
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row dd { margin: 0; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row dt {
  color: var(--pv2-main); font-size: 14px; font-weight: 800; line-height: 1.65;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-row dd {
  color: var(--pv2-text); font-size: 14px; font-weight: 600; line-height: 1.65;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-link {
  display: inline-block; margin-left: 6px; color: var(--pv2-main); font-weight: 800; text-decoration: none;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-course-link:hover { text-decoration: underline; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-metrics {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: auto 0 0; padding-top: 20px;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-metric {
  min-width: 0; padding: 14px 8px 12px; border-radius: 9px; background: var(--pv2-soft); text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-metric strong {
  display: block; margin: 0 0 3px; color: var(--pv2-main); font-size: 20px; font-weight: 800;
  line-height: 1.25; letter-spacing: -.02em; white-space: nowrap;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-metric span {
  display: block; color: var(--pv2-muted); font-size: 11px; font-weight: 700; line-height: 1.45;
}

/* 右：価格・申込 */
.lp-body #seizu_nyumon #price.price-v2 .pv2-purchase {
  display: flex; flex-direction: column; background: #fffaf3; border-color: #f1dcc4;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-campaign {
  margin: 0; padding: 13px 18px; background: var(--pv2-orange); color: var(--pv2-white);
  font-size: 15px; font-weight: 800; line-height: 1.5; text-align: center;
}
/* .price-box を兼ねる：白カード/枠/影/幅制限を打ち消してカード内に馴染ませる */
.lp-body #seizu_nyumon #price.price-v2 .pv2-purchase-body {
  display: flex; flex: 1 1 auto; flex-direction: column; align-items: stretch;
  width: 100%; max-width: none; margin: 0; padding: 20px 24px 22px;
  border: 0; border-radius: 0; background: transparent; box-shadow: none; text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-campaign-status {
  display: flex; align-items: center; justify-content: center; gap: 12px; margin: 0 0 14px;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-campaign-period {
  margin: 0; color: var(--pv2-main); font-size: 13px; font-weight: 800; line-height: 1.55;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-campaign-remain {
  margin: 0; padding: 4px 12px; border-radius: 999px; background: #fff0c9; color: var(--pv2-orange);
  font-size: 13px; font-weight: 800; line-height: 1.4; white-space: nowrap;
}
/* 通常価格（既存 .line-through をそのまま利用） */
.lp-body #seizu_nyumon #price.price-v2 .line-through {
  margin: 0 0 5px; color: #707070; font-size: 14px; line-height: 1.6; text-align: center;
  text-decoration: line-through; text-decoration-thickness: 1px;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-sale-label {
  margin: 0 0 2px; color: var(--pv2-navy); font-size: 13px; font-weight: 800;
}
/* 260802 割引が無いときは「定価（税抜）」、割引中は「販売価格（税抜）」に出し分ける（アース指定）。
   申込ページのラベルと同じ考え方。文言はHTMLから外し、CSSの ::before で出している。
   割引中かどうかは、[check_discount] の中でだけ出力される .pv2-campaign-status
   （終了日・残り日数の表示）の有無で判定する。 */
.lp-body #seizu_nyumon #price.price-v2 .pv2-sale-label::before { content: "定価（税抜）"; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-purchase-body:has(.pv2-campaign-status) .pv2-sale-label::before { content: "販売価格（税抜）"; }
/* 販売価格（既存 .info > .price > .price-txt(.price01) + .price-txt_intax(.price02)） */
.lp-body #seizu_nyumon #price.price-v2 .info .price .price-txt {
  display: flex; align-items: baseline; justify-content: center; gap: 2px;
  margin: 0 0 3px; color: var(--pv2-red); font-weight: 800; line-height: 1; white-space: nowrap;
}
/* 260802 margin-top:0 を追加。旧デザインから引き継いだ .main の上マージン20pxが残っていて、
   ラベル（定価／販売価格）と金額の間だけ余白が広がっていた（実測：他LPは gap -9px・高さ48px、
   製図だけ gap +11px・高さ68px）。0にして他LPと同じ詰まり方に揃える。 */
.lp-body #seizu_nyumon #price.price-v2 .info .price .price-txt .main { margin-top: 0; font-size: 48px; letter-spacing: -1px; line-height: 1; }
.lp-body #seizu_nyumon #price.price-v2 .info .price .price-txt > img { display: none; }
.lp-body #seizu_nyumon #price.price-v2 .info .price .price-txt_intax {
  display: inline-flex; align-items: baseline; align-self: center; gap: 7px;
  margin: 3px auto 16px; padding: 5px 12px; border-radius: 7px; background: #fff0e5;
  color: var(--pv2-red); font-size: 18px; font-weight: 800; line-height: 1.4; text-align: center;
}
/* 申込みボタン */
/* ★height:auto が必須。共通の lp_editor.css に
   @media(max-width:767px){ .lp-body .lp-cta { height: 85px } } があり、
   これを打ち消さないとSPでこのボタンだけ85pxに膨らむ（他のCTAは height:auto
   を持っているため60px）。高さも他のCTAと揃えて min-height:60px にする。 */
.lp-body #seizu_nyumon #price.price-v2 .pv2-primary {
  display: flex; align-items: center; justify-content: center; width: 100%;
  height: auto; min-height: 60px;
  margin: 0 0 10px; padding: 12px 18px; border: 0; border-radius: 7px;
  background: var(--pv2-red) !important; background-image: none !important;
  box-shadow: 0 3px 0 #990000; color: var(--pv2-white) !important;
  font-size: 17px; font-weight: 800; line-height: 1.45; letter-spacing: normal;
  text-decoration: none; transition: background-color .2s, transform .2s;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-primary:hover {
  background: var(--pv2-red-dark) !important; transform: translateY(1px);
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-payment-note {
  margin: auto 0 14px; padding-top: 14px; border-top: 1px solid #eadfce;
  color: var(--pv2-muted); font-size: 11px; line-height: 1.65;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-payment-note span { display: block; color: var(--pv2-orange); font-weight: 700; }
/* 分割払い（既存 .sub-price.bunkatsu をそのまま利用） */
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu {
  width: 100%; margin: 0; padding: 15px 16px 14px; border-radius: 10px;
  background: var(--pv2-soft); color: var(--pv2-main); text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu .ttl_sub-price {
  display: inline-block; margin: 0 0 3px; padding: 3px 12px; border-radius: 999px;
  background: var(--pv2-main); color: var(--pv2-white); font-size: 11px; font-weight: 800; line-height: 1.6;
}
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu .sub-price-txt {
  display: block; margin: 0 0 2px; color: var(--pv2-main); font-size: 14px; font-weight: 800; line-height: 1.4;
}
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu .sub-price-txt .main { font-size: 27px; }
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu .sub-price-txt span { font-size: 14px; }
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu .price-txt_intax_bunkatsu,
.lp-body #seizu_nyumon #price.price-v2 .sub-price.bunkatsu .price-txt_intax_bunkatsu + p {
  margin: 0; color: var(--pv2-muted); font-size: 10px; line-height: 1.55;
}

/* グループ割引 */
.lp-body #seizu_nyumon #price.price-v2 .pv2-group {
  width: 100%; max-width: 960px; margin: 0 auto 20px; padding: 20px 20px 14px;
  border: 1px solid var(--pv2-line); border-radius: 12px; background: var(--pv2-pale);
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-subtitle {
  margin: 0 0 3px; color: var(--pv2-main); font-size: 24px; font-weight: 800; line-height: 1.45; text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-sublead {
  margin: 0 0 8px; color: var(--pv2-muted); font-size: 13px; font-weight: 600; line-height: 1.65; text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-group-badges {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 14px;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-group-badges span {
  display: inline-flex; align-items: center; justify-content: center; min-height: 26px; padding: 4px 14px;
  border: 1px solid var(--pv2-main); border-radius: 999px; background: var(--pv2-white);
  color: var(--pv2-main); font-size: 11px; font-weight: 800; line-height: 1.3;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-table-wrap {
  overflow: hidden; border: 1px solid #d3daea; border-radius: 9px; background: var(--pv2-white);
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-table {
  width: 100%; max-width: none; margin: 0; border-collapse: collapse; table-layout: fixed;
  border-radius: 0; background: var(--pv2-white);
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-table th,
.lp-body #seizu_nyumon #price.price-v2 .pv2-table td {
  height: auto; padding: 9px 14px; border: 0; border-bottom: 1px solid #e8ecf4;
  color: var(--pv2-text); font-size: 14px; letter-spacing: normal; line-height: 1.55;
  text-align: center; vertical-align: middle;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-table th {
  background: var(--pv2-main); color: var(--pv2-white); font-size: 13px; font-weight: 800;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-table tbody tr:last-child td { border-bottom: 0; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-table tbody tr:nth-child(odd) { background: var(--pv2-white); }
.lp-body #seizu_nyumon #price.price-v2 .pv2-table tbody tr:nth-child(even) { background: var(--pv2-pale); }
.lp-body #seizu_nyumon #price.price-v2 .pv2-table td.discount {
  color: var(--pv2-orange); font-size: 14px; font-weight: 800;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-quote-action { margin: 16px 0 0; text-align: center; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-quote-button {
  display: inline-flex; align-items: center; justify-content: center; width: min(100%, 390px);
  min-height: 46px; padding: 10px 22px; border-radius: 8px; background: var(--pv2-orange);
  color: var(--pv2-white); font-size: 14px; font-weight: 800; line-height: 1.4;
  text-decoration: none; transition: background-color .2s;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-quote-button:hover { background: #d75a0d; }
.lp-body #seizu_nyumon #price.price-v2 .pv2-quote-action p {
  margin: 7px 0 0; color: var(--pv2-muted); font-size: 10px; line-height: 1.55;
}
/* 注記（既存 .under-table を流用） */
.lp-body #seizu_nyumon #price.price-v2 .pv2-group-notes {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px;
  width: auto; max-width: none; margin: 8px 0 0; padding: 0; list-style: none; text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-group-notes li {
  margin: 0; color: var(--pv2-muted); font-size: 10px; line-height: 1.55;
}

/* ご購入前の確認事項 */
.lp-body #seizu_nyumon #price.price-v2 .pv2-notes {
  width: 100%; max-width: 960px; margin: 0 auto; padding: 22px 22px 20px;
  border: 1px solid var(--pv2-line); border-radius: 14px; background: #f9fafd;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-notes-title {
  margin: 0 0 16px; color: var(--pv2-navy); font-size: 20px; font-weight: 800; line-height: 1.45; text-align: center;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-card {
  position: relative; min-width: 0; min-height: 126px; margin: 0; padding: 18px 16px 16px 56px;
  border: 1px solid #e6eaf4; border-radius: 10px; background: var(--pv2-white);
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-card--warning { border-color: #f2c99f; background: var(--pv2-orange-soft); }
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-icon {
  position: absolute; top: 18px; left: 16px; width: 28px; height: 28px;
  background-color: var(--pv2-main);
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-size: contain; mask-size: contain;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-card--invoice .pv2-note-icon {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_invoice.svg");
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-card--receipt .pv2-note-icon {
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_receipt.svg");
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-card--warning .pv2-note-icon {
  background-color: var(--pv2-orange);
  -webkit-mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg");
  mask-image: url("/wp/wp-content/themes/fantomsemi/images/gai_note.svg");
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-heading {
  margin: 0 0 7px; color: var(--pv2-main); font-size: 15px; font-weight: 800; line-height: 1.45; text-align: left;
}
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-card--warning .pv2-note-heading { color: var(--pv2-orange); }
.lp-body #seizu_nyumon #price.price-v2 .pv2-note-text {
  margin: 0; color: var(--pv2-text); font-size: 12px; line-height: 1.7; text-align: left;
}

/* スマホ：1カラム縦積み */
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon #price.price-v2 { padding: 44px 16px 40px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-title { font-size: 25px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-lead { margin-bottom: 28px; font-size: 14px; text-align: left; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-top { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-course { padding: 22px 18px 20px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-course-row { grid-template-columns: 88px minmax(0, 1fr); gap: 10px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-metric strong { font-size: 17px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-purchase-body { padding: 18px 16px 20px; }
  .lp-body #seizu_nyumon #price.price-v2 .info .price .price-txt .main { font-size: 40px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-group { padding: 18px 14px 12px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-subtitle { font-size: 20px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-table th,
  .lp-body #seizu_nyumon #price.price-v2 .pv2-table td { padding: 8px 6px; font-size: 12px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-notes { padding: 18px 14px 16px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-note-grid { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-note-card { min-height: 0; padding: 14px 14px 13px 52px; }
}

/* 日々の学習イメージ（dailystudies 共通パーツ）: 中央揃え */
.lp-body .dailystudies{ text-align:center; }
.lp-body .dailystudies h2{ text-align:center; }
.lp-body .dailystudies .arrow{ text-align:center; }
.lp-body .dailystudies .slider{ margin-left:auto; margin-right:auto; }

/* ---- 本文レイアウト: 旧本文を960px中央寄せ（新デザイン標準幅・2026-07-24に1000→960化） --------
   #kikaizairyou は旧テンプレ由来の本文最外ラッパー（seizu他・コピー起源で共通の可能性）。
   新テンプレで制約が外れ左寄せ＆全幅化していたのを960px中央寄せに復元（マスト=960px）。
   新バンド（.lp-mv 講座名帯 / .cp_bar）は全幅にブレイクアウトして揃える。
   旧画像は自然幅のまま中央に。960px超の装飾画像は親幅に収める。 */
.lp-body #kikaizairyou, .lp-body #seizu_nyumon { width: 100%; max-width: 960px; margin-left: auto; margin-right: auto; box-sizing: border-box; } /* 修正: モバイルで親を可変にし、全幅ブロック(left:50%;margin-left:-50vw)の右ずれを解消 */
/* 旧キャンペーンバナーは main 直下の別<p>にあり中央寄せ対象外だったため個別に中央寄せ。
   ※このバナー(旧20%OFF・日付焼込み)を残すか撤去するかは別途判断（cp_barと重複）。 */
.lp-body main > p { max-width: 960px; margin-left: auto; margin-right: auto; text-align: center; }
/* 全幅ブレイクアウト（背景を画面いっぱいに・中身は各セクションのmax-widthで中央寄せ） */
/* 2026-08-02 CSS監査: 下の併記セレクタから .u_voice / .reason-sec の2行のみ削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body .sz-hero,
.lp-body .lp-mv,
.lp-body .cp_bar,
.lp-body .lp-cta-sec,
.lp-body .feature-container,
.lp-body .feature-number,
.lp-body .reason3,
.lp-body .worry,
.lp-body .listen,
.lp-body .curriculum,
.lp-body .pace,
.lp-body #price,
.lp-body .tokuten {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.lp-body #kikaizairyou p img { max-width: 100%; height: auto; }
/* 「日々の学習イメージ」スライド画像: 上の #kikaizairyou p img{height:auto} が editor の
   .dailystudies …p.img img{height:380px} を詳細度で上書きし、画像が960pxに拡大していた。
   ID付きで詳細度を上げて editor の意図（高さ380px基準）を復元し、kosoと同じ表示サイズに揃える。 */
.lp-body #kikaizairyou .dailystudies div.slider p.img img { height: 380px; width: auto; max-width: none; }
@media screen and (max-width: 767px) { .lp-body #kikaizairyou .dailystudies div.slider p.img img { height: auto; width: auto; max-width: 100%; } }

/* ---- 個別調整（seizu固有・上から目視レビュー） ---------------- */
/* CTAサイズ: 幅80%・最大680px・中央寄せ（sokusen .cta-box 準拠）。
   これが無いと .lp-cta(padding 5%/7%) が1000px幅基準で巨大化する。 */
.cta-box { display: flex; flex-direction: column; align-items: center; width: 80%; max-width: 680px; margin: 0 auto; text-align: center; }
@media screen and (max-width: 767px) { .cta-box { width: calc(100% - 20px); } }
.cta-links { display: flex; flex-direction: column; width: 100%; align-items: center; }

/* 導入文「若手エンジニアを抱える法人様へ」を枠（カード）に */
/* =============================================================
   法人の教育担当者様へ（.biz-intro）  2026-07-31
   旧 .message_intro（見出し＋長文1段落。実績数のショートコードを含む）を、
   バッジ／見出し／2行リード／3カード／脚注 の構成に置き換えた。
   数値の実績は下の .feature-number（登録ユーザー数・取引企業数）で
   別途訴求しているため、この段落からは外している。
   ============================================================= */
.lp-body #seizu_nyumon .biz-intro {
  width: 100%; max-width: 960px; margin: 56px auto 48px;
  padding: 36px 32px 30px; box-sizing: border-box;
  background: #EEF3FA; border-radius: 16px; text-align: center;
}
.lp-body #seizu_nyumon .biz-intro__badge {
  display: inline-block; margin: 0 0 18px; padding: 7px 22px;
  background: #EF6C19; border-radius: 999px;
  color: #fff; font-size: 15px; font-weight: 800; line-height: 1.4;
}
.lp-body #seizu_nyumon .biz-intro__title {
  margin: 0 0 16px; color: var(--main-color);
  font-size: 32px; font-weight: 900; line-height: 1.45; letter-spacing: .01em;
}
.lp-body #seizu_nyumon .biz-intro__lead {
  margin: 0 0 26px; color: #3d4a63; font-size: 16px; font-weight: 500; line-height: 1.85;
}
/* ---- 3カード ---- */
.lp-body #seizu_nyumon .biz-intro__cards {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
  margin: 0 0 22px; padding: 0; list-style: none; text-align: left;
}
.lp-body #seizu_nyumon .biz-intro__card {
  display: flex; align-items: flex-start; gap: 14px; margin: 0;
  padding: 20px 18px; background: #fff; border-radius: 12px;
}
/* 丸い下地は付けず、アイコン単体で見せる（旧: 52pxの水色丸＋28pxアイコン）。
   下地を外した分アイコンが小さく見えるため、字面を1.5倍の42pxにしている。 */
.lp-body #seizu_nyumon .biz-intro__ico {
  flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  width: 42px; height: 42px;
}
.lp-body #seizu_nyumon .biz-intro__ico::before {
  content: ""; display: block; width: 42px; height: 42px;
  background-color: var(--main-color);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
.lp-body #seizu_nyumon .biz-intro__ico--std::before {
  -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/apply_form.svg);
  mask-image: url(/wp/wp-content/themes/fantomsemi/images/apply_form.svg);
}
.lp-body #seizu_nyumon .biz-intro__ico--time::before {
  -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg);
  mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg);
}
.lp-body #seizu_nyumon .biz-intro__ico--know::before {
  -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/seizu/denkyu.svg);
  mask-image: url(/wp/wp-content/themes/fantomsemi/images/seizu/denkyu.svg);
}
.lp-body #seizu_nyumon .biz-intro__body { min-width: 0; }
.lp-body #seizu_nyumon .biz-intro__ttl {
  margin: 0 0 5px; color: #17233f; font-size: 17px; font-weight: 800; line-height: 1.4;
}
.lp-body #seizu_nyumon .biz-intro__txt {
  margin: 0; color: #4a5670; font-size: 13px; font-weight: 500; line-height: 1.6;
}
/* ---- 脚注（2項目を縦罫で区切る） ---- */
.lp-body #seizu_nyumon .biz-intro__note {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0 18px;
  margin: 0; color: #59637d; font-size: 14px; font-weight: 600; line-height: 1.6;
}
.lp-body #seizu_nyumon .biz-intro__note span:not(:last-child) {
  padding-right: 18px; border-right: 1px solid #c3cbdd;
}

@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .biz-intro { margin: 36px auto 32px; padding: 26px 16px 22px; border-radius: 12px; }
  .lp-body #seizu_nyumon .biz-intro__badge { margin-bottom: 14px; padding: 6px 16px; font-size: 13px; }
  .lp-body #seizu_nyumon .biz-intro__title { font-size: 21px; margin-bottom: 12px; }
  .lp-body #seizu_nyumon .biz-intro__lead { font-size: 14px; line-height: 1.8; margin-bottom: 20px; text-align: left; }
  /* SPは3列だと1枚あたりが狭すぎるため1列に積む */
  .lp-body #seizu_nyumon .biz-intro__cards { grid-template-columns: minmax(0, 1fr); gap: 10px; margin-bottom: 18px; }
  .lp-body #seizu_nyumon .biz-intro__card { padding: 16px 14px; gap: 12px; }
  .lp-body #seizu_nyumon .biz-intro__ico { width: 36px; height: 36px; }
  .lp-body #seizu_nyumon .biz-intro__ico::before { width: 36px; height: 36px; }
  .lp-body #seizu_nyumon .biz-intro__ttl { font-size: 16px; }
  .lp-body #seizu_nyumon .biz-intro__note { gap: 4px 14px; font-size: 12px; }
  .lp-body #seizu_nyumon .biz-intro__note span:not(:last-child) { padding-right: 14px; }
}

/* 2026-08-02 CSS監査: 旧 .message_intro（.biz-intro へ置き換え済みで参照用に残していたもの）を
   専用@mediaごと削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* ---- 講座スペック（公式 .feature-sec / .box-list を移植・onestep準拠） ----
   3カード(box-list li)＋デバイス案内(li:last-of-type)。カード背景は var(--main-color)=#1f285f。
   アイコンは onestep の f-icon*.svg / f-icon4.png を使用。 */
.feature-container { background-color: #FFF; padding: 80px 0; }
@media screen and (max-width: 767px) { .feature-container { padding: 30px 0; } }
.box-list { display: flex; flex-wrap: wrap; flex-direction: row; align-items: stretch; justify-content: space-between; margin: 0 auto; width: 80%; max-width: 960px; row-gap: 32px; }
@media screen and (max-width: 679px) { .box-list { flex-direction: row; gap: 18px; } }
@media screen and (min-width: 680px) and (max-width: 767px) { .box-list { flex-direction: row; gap: 10px; } }
/* 高さは内容に合わせて可変・3枚等高（stretch）。長文カード(業種)の見切れ防止。 */
.box-list li { width: 32%; background-color: var(--main-color); color: #FFF; border-radius: 10px; text-align: center; min-height: 222px; padding: 24px 0; box-sizing: border-box; display: flex; flex-direction: column; justify-content: center; }
@media screen and (max-width: 767px) { .box-list li { width: 70%; height: 175px; padding: 40px 15px 20px; position: relative; margin: 0 auto 30px; min-width: 250px; } }
@media screen and (min-width: 680px) and (max-width: 767px) { .box-list li { width: calc(100% / 2 - 10px); } }
.box-list li:last-of-type { background-color: #EDF1F7; color: #22334A; border-radius: 10px; display: flex; flex-direction: row; justify-content: center; align-items: center; text-align: left; padding: 21px 20px; width: 100%; height: auto; min-height: 0; }
.box-list li:last-of-type p { font-size: 18px; font-weight: bold; }
.box-list li:last-of-type span { display: block; font-size: 16px; font-weight: normal; }
@media screen and (min-width: 768px) { .box-list li:last-of-type p { padding-left: 20px; } }
@media screen and (max-width: 767px) { .box-list li:last-of-type { width: 70%; height: auto; padding: 30px 20px; font-size: 16px; } .box-list li:last-of-type p { font-size: 16px; } .box-list li:last-of-type span { font-size: 14px; } }
@media screen and (max-width: 680px) { .box-list li:last-of-type { flex-direction: column; height: auto; padding: 30px 20px; font-size: 16px; } }
@media screen and (min-width: 680px) and (max-width: 767px) { .box-list li:last-of-type { flex-direction: row; width: calc(100% / 2 - 10px); padding: 40px 15px 20px; } }
/* 2026-08-02 CSS監査: 旧カード見出し・本文（.box-title / .box-txt 一式）と専用@mediaを削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.feature-icon { width: 40px; }
.feature-icon img { width: 100%; vertical-align: middle; }
@media screen and (max-width: 767px) { .feature-icon { width: 32px; } .feature-bottom-icon { position: absolute; top: -25px; left: 50%; transform: translateX(-50%); background: #fff; border-radius: 10px 0; color: #EAEAEA; border: 3px solid; padding: 0 10px; white-space: nowrap; width: 120px; text-align: center; } .feature-bottom-icon img { width: 70%; padding-top: 5px; } }

/* =============================================================
   講座の特徴3カード＋対応端末（.feature-overview）  2026-07-28
   kyoudo の「ヘッド画像下：講座の特徴3項目＋対応端末」を seizu に移植。
   表示ルール：ラベル（アイコン＋項目名・小）／main（短いキーワード・30px）／
   desc（補足文・カード下端に揃える）の3段。内容は製図講座のものを使用。
   色: カード=var(--main-color)、端末帯=#EDF1F7（kyoudoのティール→seizu紺に置換）。
   ※アイコンは onestep の f-icon*.svg（塗りつぶし円形）を流用するため、kyoudo のように
     .feature-icon 側へ白丸背景は付けず、SVG自身の円＋白フィルターで白丸に見せる。
   ============================================================= */
.lp-body #seizu_nyumon .feature-sec.feature-overview .feature-container {
  box-sizing: border-box;
  padding: 54px 20px 64px;
  background: #fff;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  width: min(1010px, 100%);
  margin: 0 auto;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__card {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: auto;
  min-height: 224px;
  margin: 0;
  padding: 26px 24px 24px;
  color: #fff;
  text-align: center;
  background: var(--main-color);
  border: 0;
  border-radius: 12px;
  box-shadow: none;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__label {
  position: static; top: auto; left: auto;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: auto; margin: 0 0 13px; padding: 0;
  color: #fff; white-space: normal;
  background: transparent; border: 0; border-radius: 0; transform: none;
}
/* アイコン: onestep SVGは全面塗りの円形。白フィルターのまま40pxで「白丸バッジ」に見せる */
.lp-body #seizu_nyumon .feature-overview .feature-overview__label .feature-icon {
  box-sizing: border-box;
  display: grid; flex: 0 0 40px; place-items: center;
  width: 40px; height: 40px; padding: 0;
  background: transparent; border-radius: 50%;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__label .feature-icon img {
  display: block; width: 40px; height: 40px; object-fit: contain;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__label p {
  margin: 0; color: #fff; font-size: 18px; font-weight: 700; line-height: 1.4;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__main {
  margin: 0 0 16px; color: #fff;
  font-size: 30px; font-weight: 700; line-height: 1.25; letter-spacing: .02em;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__desc {
  width: 100%; margin: auto 0 0; color: #fff;
  font-size: 16px; font-weight: 600; line-height: 1.75; text-align: center;
  word-break: normal; overflow-wrap: break-word;
}
/* 対応端末の横長帯（3カラムをまたぐ） */
.lp-body #seizu_nyumon .feature-overview .feature-overview__devices {
  box-sizing: border-box;
  display: flex; grid-column: 1 / -1;
  align-items: center; justify-content: center; gap: 28px;
  width: auto; min-height: 126px; margin: 8px 0 0; padding: 22px 44px;
  color: #1a2540; text-align: left;
  background: #EDF1F7; border: 0; border-radius: 12px; box-shadow: none;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__devices .feature-bottom-icon {
  position: static; flex: 0 0 174px; width: 174px; transform: none;
  background: transparent; border: 0; padding: 0;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__devices .feature-bottom-icon img {
  display: block; width: 100%; height: auto; object-fit: contain; padding: 0;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__device-copy,
.lp-body #seizu_nyumon .feature-overview .feature-overview__devices p { margin: 0; }
.lp-body #seizu_nyumon .feature-overview .feature-overview__device-title {
  color: #1a2540; font-size: 20px; font-weight: 700; line-height: 1.5;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__device-note {
  display: flex; align-items: baseline; gap: 18px; margin-top: 6px;
  font-size: 14px; line-height: 1.6;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__device-note strong {
  flex: 0 0 auto; color: var(--main-color); font-size: 15px;
}
.lp-body #seizu_nyumon .feature-overview .feature-overview__device-note span {
  display: inline; margin: 0; color: #5f6c75; font-size: 14px; font-weight: 400;
}
.feature-overview__mobile-break { display: none; }

/* タブレット（681-900px）: カードの内側余白と文字を詰める */
@media screen and (max-width: 900px) and (min-width: 681px) {
  .lp-body #seizu_nyumon .feature-overview .feature-overview__list { gap: 16px; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__card { padding-right: 16px; padding-left: 16px; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__main { font-size: 25px; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__desc { font-size: 14px; }
}

/* スマートフォン（〜680px）: 1列・アイコン左／テキスト右の横並びカードに */
@media screen and (max-width: 680px) {
  .lp-body #seizu_nyumon .feature-sec.feature-overview .feature-container { padding: 36px 16px 44px; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__list {
    grid-template-columns: 1fr; gap: 12px; width: 100%;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__card {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr);
    grid-template-areas: "icon label" "icon main" "icon desc";
    column-gap: 14px; row-gap: 2px; align-items: center;
    width: 100%; min-height: 0; margin: 0; padding: 18px 20px; text-align: left;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__label { display: contents; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__label .feature-icon { grid-area: icon; align-self: center; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__label p {
    grid-area: label; justify-self: start; font-size: 15px; line-height: 1.4; text-align: left;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__main {
    grid-area: main; margin: 0; font-size: 25px; line-height: 1.3; text-align: left;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__desc {
    grid-area: desc; margin: 2px 0 0; font-size: 14px; line-height: 1.6; text-align: left;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__devices {
    flex-direction: column; gap: 14px; width: 100%; min-height: 0;
    margin: 0; padding: 24px 18px; text-align: center;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__devices .feature-bottom-icon {
    flex-basis: auto; width: 138px; margin: 0 auto;
  }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__device-title { font-size: 18px; }
  .lp-body #seizu_nyumon .feature-overview .feature-overview__device-note {
    flex-direction: column; align-items: center; gap: 3px; margin-top: 7px;
  }
  .feature-overview__mobile-break { display: initial; }
}

/* サブボタン（講座情報を見る / よくあるご質問）: 公式 .info-btn。共通lp_editor.cssにも定義あり。 */
.info-btn { background-color: #d5eaff; border-radius: 88px; color: #3A3A3A; font-size: 18px; text-align: center; padding: 3% 7%; letter-spacing: 1.5px; font-weight: 600; line-height: 1.2; display: flex; flex-direction: column; justify-content: center; width: 70%; max-width: 580px; text-decoration: none; box-sizing: border-box; position: relative; margin: 14px auto 0; }
.info-btn:hover { opacity: 0.7; }
.info-btn::after { content: "＞"; position: absolute; right: 3%; top: 50%; transform: translateY(-50%); }
@media screen and (max-width: 767px) { .info-btn { width: 100%; height: 85px; padding: 10px 7%; font-size: clamp(12px, 0.625rem + 1.25vw, 16px); } }
.info-btn span { color: #868686; font-size: 15px; line-height: 1.2; font-weight: 300; display: block; margin-top: 6px; }
@media screen and (max-width: 767px) { .info-btn span { font-size: 12px; } }

/* ---- CTAセクション背景（.lp-cta-sec 背景色は共通lp_editor.css #F3F9FB） --- */
.lp-cta-sec { display: flex; flex-direction: column; align-items: center; padding: 46px 0 40px; }

/* =============================================================
   最初のCTA（.lp-cta-sec 内）を kyoudo のデザインに合わせる  2026-07-28
   kyoudo: `.lp-body #kyoudosekkei .firstview .lp-cta`（角丸10px・20px・下影付き・
   最大480px）＋ 10088行の #cc0000 上書き が最終形。seizu には .firstview が無いため
   `.lp-cta-sec` でスコープする（ページ内の他のCTAは従来の丸ピル型のまま＝今回の対象外）。
   ============================================================= */
.lp-body #seizu_nyumon .lp-cta-sec .lp-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 480px;
  height: auto;
  min-height: 64px;
  margin: 0 auto;
  padding: 14px 28px;
  border: 0;
  border-radius: 10px;
  background: #cc0000;
  background-image: none;
  box-shadow: 0 3px 0 #990000;
  color: #fff !important;
  font-size: 20px;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .035em;
  text-decoration: none;
  box-sizing: border-box;
  transition: background-color .2s, transform .2s;
}
.lp-body #seizu_nyumon .lp-cta-sec .lp-cta:hover,
.lp-body #seizu_nyumon .lp-cta-sec .lp-cta:focus {
  background: #b30000;
  background-image: none;
  box-shadow: 0 3px 0 #990000;
  transform: translateY(1px);
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .lp-cta-sec .lp-cta { font-size: 18px; min-height: 60px; padding: 12px 20px; }
}

/* ---- 「申し込み前のよくあるご質問を確認する」＝ボタンではなくテキストリンク（kyoudo .info-btn 準拠） ---- */
.lp-body #seizu_nyumon .lp-cta-sec .info-btn {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: auto;
  max-width: none;
  height: auto;
  margin: 10px 0 0;
  padding: 8px 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--main-color);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .02em;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}
.lp-body #seizu_nyumon .lp-cta-sec .info-btn::before {
  content: "?";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: var(--main-color);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  line-height: 1;
}
.lp-body #seizu_nyumon .lp-cta-sec .info-btn::after { content: none; }
.lp-body #seizu_nyumon .lp-cta-sec .info-btn:hover {
  color: var(--main-color-dark);
  text-decoration: underline;
  opacity: 1;
}
.lp-body #seizu_nyumon .lp-cta-sec .info-btn span { display: none; }
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .lp-cta-sec .info-btn {
    width: auto; height: auto; margin-top: 10px; padding: 8px 0;
    font-size: 14px; white-space: normal;
  }
}

/* ---- 講座情報ポップアップ（#infoPopup / .popup）。トリガーは共通lp.jsが .info-btn に付与 --- */
.popup { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.7); z-index: 9999; }
.popup.active { display: flex; justify-content: center; align-items: center; }
.popup-content { background: #fff; padding: 15px; border-radius: 10px; position: relative; width: 560px; max-width: 90%; max-height: 90vh; overflow-y: auto; -webkit-overflow-scrolling: touch; box-sizing: border-box; }
.close { position: absolute; top: 10px; right: 10px; font-size: 24px; cursor: pointer; }
.popup-text { text-align: left; padding: 1% 2%; box-sizing: border-box; }
.popup-text h3 { color: var(--main-color); font-size: 18px; font-weight: 600; line-height: 2; }
.popup-text ul { line-height: 2; margin-bottom: 20px; }
.popup-text p { line-height: 2; margin: 15px auto; }

/* ---- よくある質問ポップアップ：Q&Aをカード化（kyoudo .faq-popup-item を移植・seizu配色に変更） ----
   旧: <h3>+<p><strong>Q...</strong><br>A...</p> の素のテキスト羅列。
   新: 見出しをfaq-popup-titleクラス、Q&AをQ/Aラベル付きカードに（本文2026-07-28更新・#infoPopup内） */
.popup-text h3.faq-popup-title {
  width: auto; max-width: none; padding: 0; background: transparent; border: 0;
  letter-spacing: .02em; margin: 24px 0 16px; color: var(--main-color);
  font-size: 20px; font-weight: 800; line-height: 1.5; text-align: left;
}
.faq-popup-list { display: grid; gap: 12px; }
.faq-popup-item { margin: 0; padding: 18px 20px; border: 1px solid #dbe0ee; border-radius: 10px; background: #f6f7fb; }
.faq-popup-question, .faq-popup-answer { position: relative; padding-left: 30px; text-align: left; }
.faq-popup-question { margin: 0 0 8px; color: #17233f; font-size: 16px; font-weight: 800; line-height: 1.6; }
.faq-popup-answer { margin: 0; color: #40495c; font-size: 14px; font-weight: 500; line-height: 1.8; }
.faq-popup-question::before, .faq-popup-answer::before { position: absolute; top: 0; left: 0; font-weight: 800; }
.faq-popup-question::before { content: "Q"; color: var(--main-color); }
.faq-popup-answer::before { content: "A"; color: #F28A2E; }
@media screen and (max-width: 767px) {
  .popup-text h3.faq-popup-title { font-size: 17px; margin: 18px 0 12px; }
  .faq-popup-item { padding: 15px 14px; }
  .faq-popup-question { font-size: 15px; }
  .faq-popup-answer { font-size: 13px; }
}

/* ---- is-pc / is-sp 表示切替（PC/SP画像の出し分け・アイコン二重表示の解消） --- */
@media screen and (min-width: 768px) { .is-sp { display: none; } }
@media screen and (max-width: 767px) { .is-pc { display: none; } }

/* =============================================================
   ファーストビュー（.sz-hero）  2026-07-30
   -------------------------------------------------------------
   旧FVは文字を焼き込んだ1枚画像（lp_mv_seizu.jpg / img_01_sp.jpg）だった。
   文字が拡大でぼやける・SPで小さすぎる・文言修正のたびに画像を作り直す、
   という問題があったため、
     ①製図背景（::before）②人物写真（img）③文字（HTML）
   の3レイヤーに分離した。sokusen の .lp-hero と同じ骨組みだが、
   あちらに一切影響しないよう seizu 専用のクラス名（sz-hero）で新規実装している。
   ※幅・マージンは上の全幅ブレイクアウト一覧で指定済み。ここで再指定しない。
   ============================================================= */
.lp-body .sz-hero {
  position: relative;
  isolation: isolate;          /* ::before の重なりをこの中に閉じる */
  overflow: hidden;
  background-color: #F7FAFD;   /* ごく薄い青。製図背景の下地 */
}
/* ★製図背景だけを疑似要素に分離する。
   .sz-hero 本体に opacity を掛けると文字と人物写真まで薄くなるため。 */
.lp-body .sz-hero::before {
  content: "";
  position: absolute; inset: 0; z-index: 0;
  background-image: url(/wp/wp-content/themes/fantomsemi/images/seizu/hero-drafting-blueprint-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: .08;                /* 6〜10%の範囲。左のコピーが読める濃さ */
  pointer-events: none;
}
.lp-body .sz-hero {
  --sz-pad: 20px;              /* .sz-hero__inner の左右padding。写真の右抜き計算に使う */
}
.lp-body .sz-hero__inner {
  position: relative; z-index: 1;   /* 文字・写真は不透明のまま前面へ */
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40%;
  align-items: stretch;             /* 写真をFVの高さいっぱいに伸ばす */
  gap: 28px;
  /* LPの基準幅は960px。ここを超えて広げない（他セクションの #seizu_nyumon と揃える） */
  width: 100%; max-width: 960px; margin: 0 auto;
  padding: 0 var(--sz-pad);         /* 上下は .sz-hero__text 側で持つ */
  box-sizing: border-box;
}
.lp-body .sz-hero__text { align-self: center; padding: 34px 0 30px; }

/* ---- 左：テキスト ---- */
.lp-body .sz-hero__badge {
  display: inline-block; margin: 0 0 18px; padding: 7px 20px;
  border: 2px solid #EF6C19; border-radius: 999px; background: #fff;
  color: #EF6C19; font-size: 16px; font-weight: 800; line-height: 1.4;
}
.lp-body .sz-hero__title {
  margin: 0 0 22px;            /* メインコピーと補足説明の間に余白 */
  color: #17233f; font-size: 46px; font-weight: 900; line-height: 1.35;
  letter-spacing: .01em; word-break: normal;
}
.lp-body .sz-hero__hl { color: #EF6C19; }
.lp-body .sz-hero__note {
  margin: 0 0 24px; color: #3d4a63; font-size: 16px; font-weight: 500; line-height: 1.75;
}
/* ---- 左：講座の特徴3点（アイコンはCSSマスクで主色に着色） ---- */
.lp-body .sz-hero__points {
  display: flex; flex-wrap: wrap; align-items: center; gap: 0 18px;
  margin: 0; padding: 0; list-style: none;
}
.lp-body .sz-hero__point {
  display: flex; align-items: center; gap: 9px; margin: 0;
  color: #17233f; font-size: 14px; font-weight: 700; line-height: 1.45;
}
.lp-body .sz-hero__point:not(:last-child) {
  padding-right: 18px; border-right: 1px solid #cfd7e8;
}
.lp-body .sz-hero__point::before {
  content: ""; flex: 0 0 auto; width: 30px; height: 30px;
  background-color: var(--main-color);
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
.lp-body .sz-hero__point--time::before {
  -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg);
  mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg);
}
.lp-body .sz-hero__point--level::before {
  -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/seizu/jyougi.svg);
  mask-image: url(/wp/wp-content/themes/fantomsemi/images/seizu/jyougi.svg);
}
.lp-body .sz-hero__point--term::before {
  -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_replay.svg);
  mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_replay.svg);
}

/* ---- 右：人物写真 ----
   縦は上のグローバルナビ〜下の「機械製図超入門講座」帯まで、FVの高さいっぱい。
   横は画面右端まで抜かず、LPの基準幅960pxの右端で止める
   （※以前は負マージンで画面右端まで広げていたが、LPの版面より外に出るため取りやめ）。 */
.lp-body .sz-hero__photo {
  position: relative;
  align-self: stretch;
  overflow: hidden;
  /* ★人物の右側（腕・肩）を出しきるため、版面960pxの右端から約82px外へ伸ばす。
     82px = 現在の右トリミング量。これと object-position:right の組み合わせにより、
     左のトリミング量が114pxのまま変わらない＝人物は1pxも動かずに右だけが増える。
     max() は狭いウィンドウ用の保険で、写真が画面右端をはみ出さない位置で止める。 */
  /* ★clamp の上限は 0。max() だと画面幅が960px未満のとき計算結果が「正の右マージン」に
     なってしまい、写真の枠が逆に細くなっていた（768pxで182pxまで痩せていた）。 */
  margin: 0 clamp(-82px, calc((960px - 100vw) / 2), 0px) 0 0;
}
/* PC/SPの出し分けはテーマ共通の .hidden-phone/.visible-phone を使わず自前で行う。
   共通クラスの切替点（768〜780pxあたり）とこのFVのレイアウト切替点(767px)が
   ずれており、その隙間で「2カラムなのに縦長のSP画像」になっていたため。 */
.lp-body .sz-hero__img--sp { display: none; }
/* 枠を高さいっぱいに使うため cover。人物が右寄りの写真なので、
   object-position を右寄せ気味にして顔と両手が切れないようにしている
   （切り落とされるのは左端のモニター側）。 */
.lp-body .sz-hero__photo img {
  width: 100%; height: 100%; object-fit: cover; object-position: right center;
  vertical-align: bottom;
  /* 左右の端を背景へなじませる。
     版面960pxで止めているため、そのままだと右端に直線的な切り口が出る。
     左は白いモニター側、右は人物の背中側なので、どちらも被写体の主要部
     （顔・両手）には掛からない。 */
  -webkit-mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0, #000 12%, #000 85%, rgba(0,0,0,0) 100%);
  mask-image: linear-gradient(90deg, rgba(0,0,0,0) 0, #000 12%, #000 85%, rgba(0,0,0,0) 100%);
}
/* キャプションは写真の右下に重ねる */
.lp-body .sz-hero__cap {
  position: absolute; right: 16px; bottom: 16px; z-index: 2;
  display: inline-block; margin: 0; padding: 7px 16px;
  background: #fff; border: 1px solid #DDE4F2; border-radius: 999px;
  box-shadow: 0 2px 8px rgba(31, 40, 95, .10);
  color: var(--main-color); font-size: 14px; font-weight: 700; line-height: 1.4;
}

/* ---- タブレット（960px以下）：写真をやや小さく、文字を詰める ---- */
@media screen and (max-width: 960px) {
  .lp-body .sz-hero { --sz-pad: 18px; }
  .lp-body .sz-hero__inner { grid-template-columns: minmax(0, 1fr) 38%; gap: 20px; }
  .lp-body .sz-hero__text { padding: 28px 0 26px; }
  .lp-body .sz-hero__title { font-size: 33px; }
  .lp-body .sz-hero__note { font-size: 15px; margin-bottom: 20px; }
  .lp-body .sz-hero__points { gap: 0 12px; }
  .lp-body .sz-hero__point:not(:last-child) { padding-right: 12px; }
  /* ★タブレットは縦位置のSP画像に切り替える。
     この幅では写真の枠が縦長（例: 768pxで278×411＝縦横比0.68）になるため、
     横位置のPC画像(1.25)を cover で入れると左右が274〜332pxも削られ、
     人物の腕や肩が切れてしまっていた。SP画像は縦横比0.67でほぼ一致する。 */
  .lp-body .sz-hero__img--pc { display: none; }
  .lp-body .sz-hero__img--sp { display: block; }
  /* 顔が上寄りの写真なので、上下を削る場合は下（机側）から削る */
  .lp-body .sz-hero__photo img { object-position: center 20%; }
}

/* ---- スマートフォン：コピーが先、写真は下 ---- */
@media screen and (max-width: 767px) {
  /* 背景の歯車（画像の右端）が文字に重ならないよう、右下寄せにする */
  .lp-body .sz-hero { --sz-pad: 16px; }
  .lp-body .sz-hero::before { background-position: 88% bottom; opacity: .07; }
  .lp-body .sz-hero__inner {
    grid-template-columns: minmax(0, 1fr);   /* 1列＝DOM順どおり テキスト→写真 */
    gap: 18px;
  }
  .lp-body .sz-hero__text { align-self: auto; padding: 24px 0 0; }
  .lp-body .sz-hero__badge { margin-bottom: 14px; padding: 6px 15px; font-size: 13px; }
  /* 「手書き図面の描き方を」(10文字)が320pxでも1行に収まる上限で可変にする */
  .lp-body .sz-hero__title { font-size: clamp(24px, 7.4vw, 30px); margin-bottom: 16px; }
  .lp-body .sz-hero__note { font-size: 14px; margin-bottom: 18px; }
  .lp-body .sz-hero__points { gap: 9px 16px; }
  .lp-body .sz-hero__point { font-size: 13px; gap: 7px; }
  .lp-body .sz-hero__point::before { width: 24px; height: 24px; }
  /* SPでは3項目が2行に折り返すため、行末に縦罫が残って不自然になる。区切り線は消す */
  .lp-body .sz-hero__point:not(:last-child) { padding-right: 0; border-right: 0; }
  .lp-body .sz-hero__img--pc { display: none; }
  .lp-body .sz-hero__img--sp { display: block; }
  /* SPは写真がコピーの下。下辺は「機械製図超入門講座」の帯に接する。
     縦位置の写真なので cover で切らず、全体を見せて高さで頭打ちにする
     （cover にすると顔か手のどちらかが必ず切れるため）。 */
  .lp-body .sz-hero__photo { margin: 0 calc(-1 * var(--sz-pad)); overflow: visible; text-align: center; }
  .lp-body .sz-hero__photo img {
    width: auto; height: auto; max-width: 100%; max-height: 50vh; margin: 0 auto;
    /* ★object-fit は contain。none だと画像が原寸(1024×1536)で描画され、
       247×370の枠に対して中央付近だけが切り抜かれる（胸元がドアップになる）。
       object-position も PC 用の right center が効いてしまうため center に戻す。 */
    object-fit: contain; object-position: center;
    -webkit-mask-image: none; mask-image: none;   /* SP画像には左フェードを掛けない */
  }
  .lp-body .sz-hero__cap {
    right: auto; left: 50%; transform: translateX(-50%); bottom: 14px;
    font-size: 12px; padding: 6px 13px; white-space: nowrap;
  }
}

/* feature-icon を白に（濃紺カード上）。
   ★2026-07-30: SP用に青(#2c6fd1相当)へ寄せる filter 上書きを削除した。
     これは3特徴が「薄い box-title ピルの中にアイコンを置く」旧レイアウト
     だった頃の指定で、現在のSPカードは濃紺(#1f285f)地のため、
     青い丸が塗りつぶされたように見えて読めなくなっていた。
     PCと同じ白のままにしてカードの地色とコントラストを確保する。 */
.feature-icon img { filter: invert(100%) sepia(4%) saturate(15%) hue-rotate(115deg) brightness(107%) contrast(104%); }

/* ---- 社会的証明セクション（.feature-number）他LPから移植 --- */
.feature-number { background-color: #F0FAFE; padding: 60px 0; }
.feature-number h3 { font-size: 24px; font-weight: 600; letter-spacing: 2px; color: #3A3A3A; text-align: center; margin: 0 auto 38px auto; }
@media screen and (max-width: 767px) { .feature-number h3 { font-size: 20px; } .feature-number ul + h3 { font-size: 14px; } }
.number-box { display: flex; justify-content: space-between; width: 80%; max-width: 960px; margin: 0 auto 63px auto; text-align: center; }
@media screen and (min-width: 768px) { .number-box li { width: 33%; } }
.number-box p { text-align: center; }
@media screen and (max-width: 767px) { .number-box { flex-direction: column; gap: 70px; } }
.number-box li h4 { font-size: clamp(18px, -0.375rem + 3.13vw, 24px); color: #607D8B; letter-spacing: 2px; }
@media screen and (max-width: 767px) { .number-box li h4 { font-size: 18px; } }
.stat-item { opacity: 0; transform: translateY(50px); transition: all 0.8s cubic-bezier(0.34, 1.56, 0.64, 1); }
.stat-item:nth-child(2) { transition-delay: 0.1s; }
.stat-item:nth-child(1) { transition-delay: 0.4s; }
.stat-item:nth-child(3) { transition-delay: 0.4s; }
.stat-item.float-in { opacity: 1; transform: translateY(0); }
.stat-number { font-size: clamp(40px, -0.879rem + 7.04vw, 69px); font-weight: 700; letter-spacing: 1.5px; color: #F26700; line-height: 1.5; }
@media screen and (max-width: 767px) { .stat-number { font-size: 60px; } }
.stat-unit { font-size: clamp(20px, -0.265rem + 3.16vw, 33px); font-weight: bold; color: #000; }
@media screen and (max-width: 767px) { .stat-unit { font-size: 20px; } }
.under-num { padding: 0 10px; font-size: clamp(16px, 0.534rem + 0.97vw, 20px); color: #607D8B; font-weight: 600; letter-spacing: 2px; line-height: 1.5; }
@media screen and (max-width: 767px) { .under-num { font-size: 16px; } }
.feature-number-img { margin: 0 auto 20px auto; width: fit-content; }
.feature-number-img img { max-width: 100%; }
.feature-number-txt { font-size: 14px; line-height: 2; color: #707070; letter-spacing: 1.5px; margin: 0 auto; width: 62%; max-width: 960px; }
@media screen and (max-width: 767px) { .feature-number-txt { font-size: 12px; width: auto; margin: 0 20px; } }
.companies-section { opacity: 0; transform: translateY(30px); transition: all 0.8s ease-out 0.2s; text-align: center; }
/* .hp_justify をグローバルに（koso-basic準拠。seizuは .tokuten 配下限定で、社会的証明(.feature-number-txt)に
   効かず→親.companies-sectionの中央寄せ継承＋letter-spacing:1.5pxで4行化していた。両端揃え＋字間0.02emで3行に。） */
.hp_justify { text-align: justify; }
p.hp_justify { line-height: 1.95; letter-spacing: 0.02em; }

/* ---- 本文の説明文サイズ 個別指定（アース指定・2026-07-24。一括18pxは廃止し指定箇所のみ調整） ---- */
/* 2026-08-02 CSS監査: 旧reason3の本文サイズ個別指定（.reason3_1 / .reason3_2 / .reason3_3 /
   .box_right / .box_method / .ippan / .font_s / .txt_zumen を含むセレクタ）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body #kikaizairyou .curriculum-accordion__summary { font-size: 16px; }                   /* 各章の見出し概要（旧 .box_curriculum p.point。2026-07-28 アコーディオン化で改称） */

/* ---- reason3(3つの学習ポイント)の説明文：行間1.5→1.95・段落間に余白を入れて読みやすく（アース指定・2026-07-24） ---- */
.lp-body #kikaizairyou .reason3 p { line-height: 1.95; }
/* 2026-08-02 CSS監査: .reason3 .box_method:not(.ippan) の1行を削除（.box_method が本文から消滅済み）。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-body #kikaizairyou .reason3 p + p { margin-top: 0.9em; }
.lp-body #kikaizairyou .reason3 p.list + p { margin-top: 0.5em; }
.companies-section.float-in { opacity: 1; transform: translateY(0); }

/* ---- セクション見出し（.lined）マスター(koso)準拠：背景なし・通常幅・紺線は文字の上(top:-30px)。色のみseizu紺 --- */
/* 帯にしない（背景透明）ため、上のセクションとの隙間は白地に溶け込み見えない＝基礎知識編と同じ挙動。
   旧: 100vw薄紫帯にしていたため帯の上の白マージンが「隙間」に見えていた → 透明・通常幅に戻す。
   フォントサイズ/線寸法は lp_editor.css が集約管理（色のみここ）。 */
/* 上マージン70px(SP40px)＝koso .feature-about の padding-top 70px 相当。
   これが無いと紺線(top:-30px)が直上の色付きセクションに食い込む（はみ出す）。 */
.lined { font-size: 24px; font-weight: 600; letter-spacing: 2px; color: #1f285f; margin: 70px auto 64px auto; text-align: center; position: relative; width: fit-content; background-color: transparent; }
/* SP見出し: 旧18px。実機320〜430pxで本文14px・カード見出し17〜19pxに埋もれて
   セクションの区切りとして機能していなかったため22px/1.45に引き上げ（2026-07-29 SP最適化）。 */
/* SPでは字送り(letter-spacing:2px)を0にする。22px×2pxのままだと
   「製図超入門講座のカリキュラムを」が1行に入らず「を」だけが次行に孤立した。 */
@media screen and (max-width: 767px) { .lined { font-size: 22px; line-height: 1.45; letter-spacing: 0; margin: 40px auto 30px; } }
/* 320px級では22pxでも「…カリキュラムを」が入らないため、この見出しだけ落とす */
@media screen and (max-width: 374px) { .lp-body #seizu_nyumon .curriculum .lined { font-size: 18px; } }
.lined::before { content: ""; width: 80px; height: 6px; background-color: #1f285f; position: absolute; top: -30px; left: 50%; transform: translateX(-50%); }
@media screen and (max-width: 767px) { .lined::before { height: 4px; width: 48px; top: -20px; } }

/* =============================================================
   「図面は…『共通言語』です」セクション（.common-lang）  2026-07-29
   旧 .basic_skill（img_seizu_01/02 のPC画像＋SP用4枚）を廃止し、
   見出し／リード文／関係者の図解／活躍分野の写真／締め帯に置き換えた。
   図解は画像ではなくHTML＋CSSで構築（テキストが鮮明・レスポンシブ対応のため）。
   ★画像は theme/images/seizu/ に以下10点が必要：
     pc-icon.svg / milling-icon.svg / cart.svg / hand.svg / jyougi.svg /
     drw1.png / automotive-transport.webp / industrial-machinery.webp /
     ship-plant.webp / precision-parts.webp
   ============================================================= */
.lp-body #seizu_nyumon .common-lang__title { max-width: 100%; line-height: 1.45; }
.lp-body #seizu_nyumon .common-lang__title .cl-em { color: #EF6C19; }

.lp-body #seizu_nyumon .common-lang {
  width: 100%; max-width: 1000px; margin: 0 auto; padding: 0 0 20px; box-sizing: border-box;
}
.lp-body #seizu_nyumon .common-lang__lead {
  margin: -34px auto 30px; color: #3d4a63; font-size: 16px; font-weight: 500;
  line-height: 1.9; text-align: center; letter-spacing: .01em;
}

/* ---- 関係者の図解（中央＝図面／左右＝各工程／下＝品質管理） ---- */
/* ★カード幅は5枚とも共通の --cl-node-w に固定する。
   最長ラベル「品質管理・検査」の内容幅（アイコン42＋gap12＋文字121＝175px）＋
   左右padding 12px×2 ＝ 199px に合わせた最小幅。列幅もこの値にすることで、
   カードが列いっぱいに広がって左右に無駄な余白が出るのを防ぎ、
   同時に接続線の長さ（＝列間 gap）を横幅によらず一定に保つ。 */
.lp-body #seizu_nyumon .cl-diagram {
  --cl-node-w: 200px;
  display: grid;
  grid-template-columns: var(--cl-node-w) minmax(0, 1fr) var(--cl-node-w);
  grid-template-areas: "left center right" "left bottom right";
  align-items: center; justify-items: center; gap: 18px 26px;
  padding: 26px 24px 30px; background: #EEF4FB; border-radius: 16px;
}
.lp-body #seizu_nyumon .cl-col--left   { grid-area: left;   display: grid; gap: 18px; width: 100%; }
.lp-body #seizu_nyumon .cl-col--right  { grid-area: right;  display: grid; gap: 18px; width: 100%; }
.lp-body #seizu_nyumon .cl-col--bottom { grid-area: bottom; display: grid; width: var(--cl-node-w); }
.lp-body #seizu_nyumon .cl-center      { grid-area: center; width: 100%; }

/* 各ノード（アイコン＋ラベル）。5枚とも同じ幅・同じ高さ */
.lp-body #seizu_nyumon .cl-node {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 12px;
  width: 100%; min-height: 92px; padding: 14px 12px; box-sizing: border-box;
  background: #fff; border-radius: 12px; box-shadow: 0 2px 8px rgba(23, 40, 95, .08);
}
.lp-body #seizu_nyumon .cl-node__ico { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; }
.lp-body #seizu_nyumon .cl-node__ico img { width: 100%; height: 100%; object-fit: contain; }
.lp-body #seizu_nyumon .cl-node__label {
  color: #17233f; font-size: 17px; font-weight: 700; line-height: 1.4; letter-spacing: .02em;
}
/* 接続線（ノードから中央の図面へ伸びる線＋丸） */
.lp-body #seizu_nyumon .cl-col--left .cl-node::after,
.lp-body #seizu_nyumon .cl-col--right .cl-node::after {
  content: ""; position: absolute; top: 50%; width: 26px; height: 2px;
  background: var(--main-color); transform: translateY(-50%);
}
.lp-body #seizu_nyumon .cl-col--left .cl-node::after  { left: 100%; }
.lp-body #seizu_nyumon .cl-col--right .cl-node::after { right: 100%; }
.lp-body #seizu_nyumon .cl-col--left .cl-node::before,
.lp-body #seizu_nyumon .cl-col--right .cl-node::before {
  content: ""; position: absolute; top: 50%; width: 8px; height: 8px; border-radius: 50%;
  background: var(--main-color); transform: translateY(-50%); z-index: 1;
}
.lp-body #seizu_nyumon .cl-col--left .cl-node::before  { left: calc(100% + 22px); }
.lp-body #seizu_nyumon .cl-col--right .cl-node::before { right: calc(100% + 22px); }
.lp-body #seizu_nyumon .cl-col--bottom .cl-node::after {
  content: ""; position: absolute; left: 50%; bottom: 100%; width: 2px; height: 20px;
  background: var(--main-color); transform: translateX(-50%);
}
.lp-body #seizu_nyumon .cl-col--bottom .cl-node::before {
  content: ""; position: absolute; left: 50%; bottom: calc(100% + 16px); width: 8px; height: 8px;
  border-radius: 50%; background: var(--main-color); transform: translateX(-50%); z-index: 1;
}
/* 中央の図面カード */
.lp-body #seizu_nyumon .cl-center__ttl {
  margin: 0 0 8px; color: #17233f; font-size: 18px; font-weight: 800; text-align: center; letter-spacing: .04em;
}
.lp-body #seizu_nyumon .cl-center__img {
  background: #fff; border: 1px solid #cfdcf0; border-radius: 10px; padding: 10px; box-sizing: border-box;
}
.lp-body #seizu_nyumon .cl-center__img img { display: block; width: 100%; height: auto; }

/* ---- 活躍分野の写真4枚 ---- */
.lp-body #seizu_nyumon .cl-fields__ttl {
  margin: 40px 0 18px; color: #17233f; font-size: 22px; font-weight: 800;
  line-height: 1.5; text-align: center; letter-spacing: .02em;
}
.lp-body #seizu_nyumon .cl-fields {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
}
.lp-body #seizu_nyumon .cl-field {
  margin: 0; padding: 10px; background: #fff; border: 1px solid #e3e8f3;
  border-radius: 12px; box-shadow: 0 2px 8px rgba(23, 40, 95, .06);
}
.lp-body #seizu_nyumon .cl-field img {
  display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px;
}
.lp-body #seizu_nyumon .cl-field figcaption {
  margin-top: 10px; color: #17233f; font-size: 15px; font-weight: 700; line-height: 1.45; text-align: center;
}

/* ---- 締めの帯 ---- */
.lp-body #seizu_nyumon .cl-closing {
  margin: 26px 0 0; padding: 18px 20px; background: #FFF8E1; border-radius: 10px;
  color: #17233f; font-size: 20px; font-weight: 800; line-height: 1.6;
  text-align: center; letter-spacing: .02em;
}

@media screen and (max-width: 900px) {
  /* 図解を縦積みに。接続線は縦向きへ切り替える */
  .lp-body #seizu_nyumon .cl-diagram {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "center" "left" "right" "bottom";
    gap: 26px 0; padding: 22px 16px 26px;
  }
  .lp-body #seizu_nyumon .cl-col--left,
  .lp-body #seizu_nyumon .cl-col--right {
    grid-template-columns: repeat(2, minmax(0, var(--cl-node-w))); justify-content: center; gap: 12px;
  }
  .lp-body #seizu_nyumon .cl-col--bottom { width: var(--cl-node-w); }
  .lp-body #seizu_nyumon .cl-node { min-height: 76px; }
  .lp-body #seizu_nyumon .cl-col--left .cl-node::after,
  .lp-body #seizu_nyumon .cl-col--right .cl-node::after,
  .lp-body #seizu_nyumon .cl-col--left .cl-node::before,
  .lp-body #seizu_nyumon .cl-col--right .cl-node::before,
  .lp-body #seizu_nyumon .cl-col--bottom .cl-node::after,
  .lp-body #seizu_nyumon .cl-col--bottom .cl-node::before { content: none; }
  .lp-body #seizu_nyumon .cl-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .common-lang__lead { margin: -14px auto 24px; font-size: 14px; line-height: 1.85; text-align: left; }
  .lp-body #seizu_nyumon .cl-node__label { font-size: 15px; }
  .lp-body #seizu_nyumon .cl-node__ico { width: 36px; height: 36px; }
  .lp-body #seizu_nyumon .cl-fields__ttl { margin: 30px 0 14px; font-size: 17px; }
  .lp-body #seizu_nyumon .cl-field figcaption { font-size: 13px; }
  .lp-body #seizu_nyumon .cl-closing { font-size: 15px; padding: 14px 14px; }
}

/* =============================================================
   「図面について、こんなお悩みはありませんか？」セクション（.worry）  2026-07-29
   旧 .nayami（青バッジ＋チェックリスト11項目＋画像3点）を廃止し、
   左＝イラスト／右＝お悩み4カード／下＝おすすめ枠＋矢印の構成に置き換えた。
   ★画像・アイコンは未入稿。以下のプレースホルダーに寸法だけ確保してある。
     本文の該当箇所にコメントで差し込み用の <img> タグを書いてあるので、
     画像が用意でき次第そのコメントを実タグに置き換える。
       .wr-visual     … メイン画像（4:3想定）
       .wr-card__ico  … お悩みアイコン4点（円形・64px）
       .wr-reco__ico  … 電球アイコン（48px）
     画像を入れた時点で、下の「プレースホルダーの見た目」ブロックは削除してよい。
   ============================================================= */
.lp-body #seizu_nyumon .worry__title { max-width: 100%; line-height: 1.45; }
.lp-body #seizu_nyumon .worry__title .wr-em { color: #EF6C19; }
/* ★背景の薄い水色を画面幅いっぱいに敷くため、上部の共通ブレイクアウト指定
   （.lp-body .worry）を使って全幅化している。中身は max-width:1000px で中央寄せ。
   見出し(h2.worry__title)もこのセクションの中に入れてある（外にあると
   見出しだけ白地に取り残されるため）。 */
.lp-body #seizu_nyumon .worry {
  padding: 56px 20px 40px; background: #EDF3FA; box-sizing: border-box;
}
.lp-body #seizu_nyumon .worry > * { max-width: 1000px; margin-left: auto; margin-right: auto; }
.lp-body #seizu_nyumon .worry__title { margin-top: 0; }
.lp-body #seizu_nyumon .worry__lead {
  margin: -34px auto 26px; color: #3d4a63; font-size: 16px; font-weight: 500;
  line-height: 1.9; text-align: center; letter-spacing: .01em;
}

/* 白パネル：左にイラスト、右に4カード */
/* 列比は、カード04の1行目「加工や検査を考慮した」（10文字＝約150px）が
   折り返さない幅を確保できる値。狭めると4枚の高さが揃わなくなるので注意。 */
.lp-body #seizu_nyumon .wr-panel {
  display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr);
  align-items: stretch; gap: 24px;
  padding: 18px; background: #fff; border-radius: 16px; box-shadow: 0 4px 18px rgba(23, 40, 95, .07);
}
.lp-body #seizu_nyumon .wr-visual {
  border-radius: 12px; overflow: hidden; background: #EEF4FB; aspect-ratio: 4 / 3;
}
.lp-body #seizu_nyumon .wr-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }

.lp-body #seizu_nyumon .wr-cards {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch;
}
.lp-body #seizu_nyumon .wr-card {
  display: flex; align-items: center; gap: 14px; min-width: 0;
  padding: 18px 16px; background: #fff; border: 1px solid #e6ebf5; border-radius: 12px;
}
.lp-body #seizu_nyumon .wr-card__ico {
  flex: 0 0 auto; width: 64px; height: 64px; border-radius: 50%; background: #FDEEE1;
  display: grid; place-items: center; overflow: hidden;
}
/* アイコンは円の内側いっぱいに（92%）。円は背景色の座布団なので、
   ここを小さくすると「アイコンが小さい」印象になる。 */
.lp-body #seizu_nyumon .wr-card__ico img { width: 92%; height: 92%; object-fit: contain; }
.lp-body #seizu_nyumon .wr-card__body { min-width: 0; }
.lp-body #seizu_nyumon .wr-card__num {
  margin: 0 0 2px; color: #EF6C19; font-size: 20px; font-weight: 800; line-height: 1.2; letter-spacing: .04em;
}
.lp-body #seizu_nyumon .wr-card__txt {
  margin: 0; color: #17233f; font-size: 15px; font-weight: 700; line-height: 1.55;
  word-break: keep-all;   /* 文節の途中で不自然に改行させない */
}

/* おすすめ枠（オレンジの囲み） */
.lp-body #seizu_nyumon .wr-reco {
  display: flex; align-items: center; justify-content: center; gap: 18px;
  width: min(760px, 100%); margin: 24px auto 0; padding: 18px 24px;
  background: #fff; border: 2px solid #EF6C19; border-radius: 12px;
}
.lp-body #seizu_nyumon .wr-reco__ico {
  flex: 0 0 auto; width: 48px; height: 48px; display: grid; place-items: center;
}
.lp-body #seizu_nyumon .wr-reco__ico img { width: 100%; height: 100%; object-fit: contain; }
.lp-body #seizu_nyumon .wr-reco__ttl {
  margin: 0 0 4px; color: #17233f; font-size: 22px; font-weight: 800; line-height: 1.45;
}
.lp-body #seizu_nyumon .wr-reco__sub {
  margin: 0; color: #3d4a63; font-size: 15px; font-weight: 600; line-height: 1.6;
}

/* 下向きの矢印（CSSのみ） */
.lp-body #seizu_nyumon .wr-arrow { width: 100%; height: 40px; margin-top: 18px; position: relative; }
.lp-body #seizu_nyumon .wr-arrow::before {
  content: ""; position: absolute; top: 6px; left: 50%; width: 26px; height: 26px;
  border-right: 4px solid #9fb0cc; border-bottom: 4px solid #9fb0cc;
  transform: translateX(-50%) rotate(45deg); border-radius: 3px;
}

/* ---- プレースホルダーの見た目（画像が入るまでの仮表示。差し込み後は削除可） ---- */
.lp-body #seizu_nyumon .wr-visual:empty,
.lp-body #seizu_nyumon .wr-card__ico:empty,
.lp-body #seizu_nyumon .wr-reco__ico:empty { position: relative; }
.lp-body #seizu_nyumon .wr-visual:empty::after,
.lp-body #seizu_nyumon .wr-card__ico:empty::after,
.lp-body #seizu_nyumon .wr-reco__ico:empty::after {
  content: "画像"; position: absolute; inset: 0; display: grid; place-items: center;
  color: #9fb0cc; font-size: 12px; font-weight: 700; letter-spacing: .08em;
}
.lp-body #seizu_nyumon .wr-card__ico:empty::after,
.lp-body #seizu_nyumon .wr-reco__ico:empty::after { content: "ICON"; font-size: 10px; }
.lp-body #seizu_nyumon .wr-reco__ico:empty { background: #FDEEE1; border-radius: 50%; }

@media screen and (max-width: 900px) {
  .lp-body #seizu_nyumon .wr-panel { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .lp-body #seizu_nyumon .wr-visual { aspect-ratio: 16 / 9; }
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .worry__lead { margin: -14px auto 20px; font-size: 14px; line-height: 1.85; text-align: left; }
  .lp-body #seizu_nyumon .wr-panel { padding: 12px; }
  .lp-body #seizu_nyumon .wr-cards { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .lp-body #seizu_nyumon .wr-card { padding: 14px 12px; gap: 12px; }
  .lp-body #seizu_nyumon .wr-card__ico { width: 52px; height: 52px; }
  .lp-body #seizu_nyumon .wr-card__num { font-size: 17px; }
  .lp-body #seizu_nyumon .wr-card__txt { font-size: 14px; }
  .lp-body #seizu_nyumon .wr-card__txt br { display: none; }
  .lp-body #seizu_nyumon .wr-reco { flex-direction: column; gap: 10px; padding: 16px 14px; text-align: center; }
  .lp-body #seizu_nyumon .wr-reco__ttl { font-size: 17px; }
  .lp-body #seizu_nyumon .wr-reco__sub { font-size: 13px; }
}

/* =============================================================
   「受講後にできるようになること」セクション（.aftercourse）  2026-07-29
   お悩みセクションと「3つの理由」の間に新設。
   受講前→受講後のビフォーアフター、できること4カード、締めの紺帯で構成。
   ★アイコンは未入稿。以下のプレースホルダーに寸法だけ確保してある。
     本文の該当箇所にコメントで差し込み用の <img> タグを書いてある。
       .ac-ba__face   … 受講前／受講後の表情アイコン（56px）
       .ac-card__ico  … できること4点のアイコン（円形・110px）
     画像を入れた時点で「プレースホルダーの見た目」ブロックは削除してよい。
   ============================================================= */
.lp-body #seizu_nyumon .aftercourse__title { max-width: 100%; line-height: 1.45; }
/* 下パディングは、直後の「3つの理由」（背景色つきの全幅セクション）との間隔。
   他セクション間が70〜80pxなので合わせる。10pxのままだと紺帯の直下に
   水色背景が接してしまい、区切りが分からなくなる。 */
.lp-body #seizu_nyumon .aftercourse {
  width: 100%; max-width: 1000px; margin: 0 auto; padding: 0 0 76px; box-sizing: border-box;
}
.lp-body #seizu_nyumon .aftercourse__lead {
  margin: -34px auto 26px; color: #3d4a63; font-size: 16px; font-weight: 500;
  line-height: 1.9; text-align: center; letter-spacing: .01em;
}

/* ---- 受講前 → 受講後 ---- */
.lp-body #seizu_nyumon .ac-ba {
  display: grid; grid-template-columns: minmax(0, 1fr) 44px minmax(0, 1fr);
  align-items: stretch; gap: 0; margin: 0 0 20px;
}
.lp-body #seizu_nyumon .ac-ba__box {
  display: flex; align-items: center; gap: 16px; min-width: 0;
  padding: 20px 24px; border-radius: 14px;
}
.lp-body #seizu_nyumon .ac-ba__box--before { background: #F1F3F7; }
.lp-body #seizu_nyumon .ac-ba__box--after  { background: #EEF4FB; }
.lp-body #seizu_nyumon .ac-ba__badge {
  flex: 0 0 auto; padding: 5px 12px; border-radius: 6px;
  color: #fff; font-size: 13px; font-weight: 800; line-height: 1.4; white-space: nowrap;
}
.lp-body #seizu_nyumon .ac-ba__box--before .ac-ba__badge { background: #8a92a6; }
.lp-body #seizu_nyumon .ac-ba__box--after  .ac-ba__badge { background: var(--main-color); }
/* 表情イラストは人物の描き込みがあるため、56pxでは小さく見える。
   下のカードのアイコン（110px）とのバランスを見て88pxにしている。 */
.lp-body #seizu_nyumon .ac-ba__face {
  flex: 0 0 auto; width: 88px; height: 88px; display: grid; place-items: center;
}
.lp-body #seizu_nyumon .ac-ba__face img { width: 100%; height: 100%; object-fit: contain; }
.lp-body #seizu_nyumon .ac-ba__txt {
  margin: 0; min-width: 0; color: #17233f; font-size: 15px; font-weight: 700;
  line-height: 1.6; word-break: keep-all;
}
/* 中央のオレンジ矢印（CSSのみ） */
.lp-body #seizu_nyumon .ac-ba__arrow { position: relative; }
.lp-body #seizu_nyumon .ac-ba__arrow::before {
  content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 0; height: 0;
  border-top: 11px solid transparent; border-bottom: 11px solid transparent;
  border-left: 16px solid #EF6C19;
}
.lp-body #seizu_nyumon .ac-ba__arrow::after {
  content: ""; position: absolute; top: 50%; left: calc(50% - 14px); transform: translateY(-50%);
  width: 12px; height: 7px; background: #EF6C19;
}

/* ---- できること4カード ---- */
.lp-body #seizu_nyumon .ac-cards {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: stretch;
}
.lp-body #seizu_nyumon .ac-card {
  display: flex; align-items: center; gap: 18px; min-width: 0;
  padding: 22px 24px; background: #fff; border-radius: 14px; box-shadow: 0 3px 12px rgba(23, 40, 95, .07);
}
.lp-body #seizu_nyumon .ac-card__ico {
  flex: 0 0 auto; width: 110px; height: 110px; border-radius: 50%; background: #FDEEE1;
  display: grid; place-items: center; overflow: hidden;
}
/* 同上。円の内側の余白は最小限にする */
.lp-body #seizu_nyumon .ac-card__ico img { width: 92%; height: 92%; object-fit: contain; }
.lp-body #seizu_nyumon .ac-card__body { min-width: 0; }
.lp-body #seizu_nyumon .ac-card__num {
  margin: 0 0 2px; color: #EF6C19; font-size: 24px; font-weight: 800; line-height: 1.2; letter-spacing: .04em;
}
.lp-body #seizu_nyumon .ac-card__ttl {
  margin: 0 0 6px; color: #17233f; font-size: 18px; font-weight: 800; line-height: 1.45; word-break: keep-all;
}
.lp-body #seizu_nyumon .ac-card__txt {
  margin: 0; color: #4a5670; font-size: 14px; font-weight: 500; line-height: 1.7; word-break: keep-all;
}

/* ---- 締めの紺帯 ---- */
.lp-body #seizu_nyumon .ac-banner {
  display: flex; align-items: center; justify-content: center; gap: 14px;
  margin: 22px 0 0; padding: 20px 24px; background: var(--main-color); border-radius: 10px;
  color: #fff; font-size: 22px; font-weight: 800; line-height: 1.5; text-align: center; letter-spacing: .02em;
}
.lp-body #seizu_nyumon .ac-banner__check {
  flex: 0 0 auto; position: relative; width: 30px; height: 30px;
  border: 2px solid #fff; border-radius: 50%;
}
.lp-body #seizu_nyumon .ac-banner__check::before {
  content: ""; position: absolute; top: 47%; left: 50%; width: 13px; height: 7px;
  border-left: 2.5px solid #fff; border-bottom: 2.5px solid #fff;
  transform: translate(-50%, -50%) rotate(-45deg);
}

/* ---- プレースホルダーの見た目（画像が入るまでの仮表示。差し込み後は削除可） ---- */
.lp-body #seizu_nyumon .ac-card__ico:empty,
.lp-body #seizu_nyumon .ac-ba__face:empty { position: relative; }
.lp-body #seizu_nyumon .ac-card__ico:empty::after,
.lp-body #seizu_nyumon .ac-ba__face:empty::after {
  content: "ICON"; position: absolute; inset: 0; display: grid; place-items: center;
  color: #c3a189; font-size: 10px; font-weight: 700; letter-spacing: .08em;
}
.lp-body #seizu_nyumon .ac-ba__face:empty { background: #FDEEE1; border-radius: 50%; }

@media screen and (max-width: 900px) {
  .lp-body #seizu_nyumon .ac-ba { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  /* 縦積みでは矢印を下向きに */
  .lp-body #seizu_nyumon .ac-ba__arrow { height: 26px; }
  .lp-body #seizu_nyumon .ac-ba__arrow::before {
    border-top: 16px solid #EF6C19; border-bottom: 0;
    border-left: 11px solid transparent; border-right: 11px solid transparent;
  }
  .lp-body #seizu_nyumon .ac-ba__arrow::after {
    top: calc(50% - 14px); left: 50%; transform: translateX(-50%); width: 7px; height: 12px;
  }
  .lp-body #seizu_nyumon .ac-cards { grid-template-columns: minmax(0, 1fr); }
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .aftercourse { padding-bottom: 50px; }
  .lp-body #seizu_nyumon .aftercourse__lead { margin: -14px auto 20px; font-size: 14px; line-height: 1.85; text-align: left; }
  .lp-body #seizu_nyumon .ac-ba__box { padding: 16px 14px; gap: 12px; flex-wrap: wrap; }
  .lp-body #seizu_nyumon .ac-ba__face { width: 72px; height: 72px; }   /* スマホでは少し控えめに */
  .lp-body #seizu_nyumon .ac-ba__txt { font-size: 14px; }
  .lp-body #seizu_nyumon .ac-ba__txt br { display: none; }
  .lp-body #seizu_nyumon .ac-card { padding: 16px 14px; gap: 14px; }
  .lp-body #seizu_nyumon .ac-card__ico { width: 82px; height: 82px; }
  .lp-body #seizu_nyumon .ac-card__num { font-size: 20px; }
  .lp-body #seizu_nyumon .ac-card__ttl { font-size: 16px; }
  .lp-body #seizu_nyumon .ac-card__txt { font-size: 13px; }
  .lp-body #seizu_nyumon .ac-card__txt br { display: none; }
  .lp-body #seizu_nyumon .ac-banner { font-size: 16px; padding: 16px 14px; gap: 10px; }
  .lp-body #seizu_nyumon .ac-banner__check { width: 24px; height: 24px; }
  .lp-body #seizu_nyumon .ac-banner__check::before { width: 11px; height: 6px; }
}

/* 2026-08-02 CSS監査: 旧受講者の声セクション（.bg-lorn / .uservoice / .u_voice / .title-lg /
   .voice-wrap / .member）と専用@media2件を、見出しコメントごと削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* =============================================================
   「初心者でも機械製図の基礎が身につく3つの理由」（.reason3.reason-v2）  2026-07-29
   旧デザイン（濃紺背景＋横長ブロック3本／画像左・本文右のフロート組み）を廃止し、
   薄い水色背景に画像上・本文下の3カード＋締めの一文、という構成に置き換えた。
   旧 .reason3_inner / .title_reason / .box_right / .box_method / .txt_zumen 等は
   本文から要素ごと無くなったため定義を削除。
   ★全幅化は上部の `.lp-body .reason3` の共通ブレイクアウト指定を流用（再指定しない）。
   画像は images/seizu/reason1.png 〜 reason3.png。
   ============================================================= */
#seizu_nyumon .reason3.reason-v2 {
  background: #EDF3FA; padding: 60px 20px 64px; box-sizing: border-box;
}
#seizu_nyumon .reason-v2 > * { max-width: 1000px; margin-left: auto; margin-right: auto; }
#seizu_nyumon .reason-v2 .rs-title {
  position: relative; width: auto; background: none; border: 0;
  color: #17233f; font-size: 34px; font-weight: 800; line-height: 1.45;
  letter-spacing: .03em; text-align: center; margin: 0 auto 12px; padding: 26px 20px 0;
}
#seizu_nyumon .reason-v2 .rs-title::before {
  content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 52px; height: 4px; border-radius: 999px; background: var(--main-color);
}
#seizu_nyumon .reason-v2 .rs-lead {
  margin: 0 auto 34px; color: #3d4a63; font-size: 16px; font-weight: 500;
  line-height: 1.9; text-align: center;
}

/* 3カード（画像上・番号・見出し・説明） */
#seizu_nyumon .reason-v2 .rs-cards {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; align-items: stretch;
}
#seizu_nyumon .reason-v2 .rs-card {
  display: flex; flex-direction: column; min-width: 0;
  padding: 20px 20px 26px; background: #fff; border-radius: 14px;
  box-shadow: 0 3px 14px rgba(23, 40, 95, .07);
}
#seizu_nyumon .reason-v2 .rs-card__img {
  margin: 0 0 18px; border-radius: 8px; overflow: hidden; background: #F5F7FB; aspect-ratio: 16 / 10;
}
#seizu_nyumon .reason-v2 .rs-card__img img {
  display: block; width: 100%; height: 100%; object-fit: contain;
}
#seizu_nyumon .reason-v2 .rs-card__num {
  margin: 0 0 6px; color: #EF6C19; font-size: 30px; font-weight: 800;
  line-height: 1.1; letter-spacing: .04em; text-align: center;
}
#seizu_nyumon .reason-v2 .rs-card__ttl {
  margin: 0 0 12px; color: #17233f; font-size: 19px; font-weight: 800;
  line-height: 1.5; text-align: center; word-break: keep-all;
}
#seizu_nyumon .reason-v2 .rs-card__txt {
  margin: 0; color: #4a5670; font-size: 14px; font-weight: 500; line-height: 1.85; word-break: keep-all;
}

/* 締めの一文（白地＋オレンジのチェック） */
#seizu_nyumon .reason-v2 .rs-closing {
  display: flex; align-items: center; justify-content: center; gap: 16px;
  width: min(840px, 100%); margin: 26px auto 0; padding: 20px 24px;
  background: #fff; border-radius: 12px;
  color: #17233f; font-size: 21px; font-weight: 800; line-height: 1.5; text-align: center;
}
#seizu_nyumon .reason-v2 .rs-closing__check {
  flex: 0 0 auto; position: relative; width: 32px; height: 32px;
  border: 2.5px solid #EF6C19; border-radius: 50%;
}
#seizu_nyumon .reason-v2 .rs-closing__check::before {
  content: ""; position: absolute; top: 46%; left: 50%; width: 14px; height: 7px;
  border-left: 2.5px solid #EF6C19; border-bottom: 2.5px solid #EF6C19;
  transform: translate(-50%, -50%) rotate(-45deg);
}

@media screen and (max-width: 900px) {
  #seizu_nyumon .reason-v2 .rs-cards { grid-template-columns: minmax(0, 1fr); width: min(520px, 100%); margin: 0 auto; }
}
@media screen and (max-width: 767px) {
  #seizu_nyumon .reason3.reason-v2 { padding: 44px 16px 48px; }
  #seizu_nyumon .reason-v2 .rs-title { font-size: 23px; padding-top: 22px; }
  #seizu_nyumon .reason-v2 .rs-lead { margin-bottom: 26px; font-size: 14px; line-height: 1.85; text-align: left; }
  #seizu_nyumon .reason-v2 .rs-card { padding: 16px 16px 22px; }
  #seizu_nyumon .reason-v2 .rs-card__num { font-size: 26px; }
  #seizu_nyumon .reason-v2 .rs-card__ttl { font-size: 17px; }
  #seizu_nyumon .reason-v2 .rs-card__txt { font-size: 13.5px; }
  #seizu_nyumon .reason-v2 .rs-card__txt br { display: none; }
  #seizu_nyumon .reason-v2 .rs-closing { font-size: 16px; padding: 16px 14px; gap: 12px; }
  #seizu_nyumon .reason-v2 .rs-closing__check { width: 26px; height: 26px; }
  #seizu_nyumon .reason-v2 .rs-closing__check::before { width: 12px; height: 6px; }
}

/* ---- 教育現場の声（.listen）導入ボックス＋写真＋声カード（悩み→成果）でサンプルに準拠 ---
   ★背景色: 直前の「3つの理由」が薄い水色(#EDF3FA)、直後のカリキュラムが白のため、
     どちらとも見分けがつくよう暖色系の生成り(#FBF6EE)にした。
     後半の「特典」セクションの生成り(#FFF5E8)と系統を合わせている。
     全幅化は上部の共通ブレイクアウト指定（.lp-body .listen）を使用。 */
.listen { padding: 56px 20px 48px; background: #FBF6EE; box-sizing: border-box; }
.listen > * { max-width: 960px; margin-left: auto; margin-right: auto; }
.listen > .lined:first-child { margin-top: 0; }
/* 導入文を左アクセント罫のボックスに。2段落目(.hl)は薄水色で強調 */
.listen-intro { max-width: 960px; margin: 0 auto 44px; background: #F7FAFC; border-radius: 8px; padding: 26px 32px; line-height: 1.95; font-size: 16px; box-shadow: 0 6px 18px rgba(20, 50, 70, .05); box-sizing: border-box; }
.listen-intro p { margin: 0; font-size: 16px; }
.listen-intro p + p { margin-top: 12px; }
.listen-intro p.hl { font-weight: 700; color: #1f285f; background: #E7F1F9; padding: 10px 14px; border-radius: 6px; }
@media screen and (max-width: 767px) { .listen-intro { padding: 20px; } }

.listen .genba { display: flex; gap: 36px; align-items: flex-start; max-width: 960px; margin: 0 auto; }
.listen .genba .img { flex: 0 0 34%; max-width: 34%; display: flex; flex-direction: column; gap: 16px; }
.listen .genba .img p { margin: 0; }
.listen .genba .img img { width: 100%; height: auto; display: block; border-radius: 10px; box-shadow: 0 4px 14px rgba(20, 50, 70, .12); }
.listen .genba .voice { flex: 1; }

/* 声の見出し */
.voice-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; font-size: 20px; font-weight: 700; color: #1f285f; margin: 0 0 20px; padding-left: 14px; border-left: 4px solid #2f8fd6; line-height: 1.4; }
.voice-note { font-size: 12px; font-weight: 400; color: #8a949e; }

/* 声カード（受講前の悩み → 受講後の成果） */
.vcard { background: #fff; border: 1px solid #E3EAF0; border-radius: 14px; box-shadow: 0 4px 16px rgba(20, 50, 70, .06); padding: 20px 22px; margin-bottom: 20px; }
.vcard-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.vcard-age { flex: 0 0 auto; background: #1f285f; color: #fff; font-size: 13px; font-weight: 700; padding: 4px 12px; border-radius: 999px; }
.vcard-attr { font-size: 15px; font-weight: 700; color: #333; }
.vcard-cols { display: flex; align-items: stretch; gap: 14px; }
.vcol { flex: 1; border-radius: 10px; padding: 14px 16px; box-sizing: border-box; }
.vbefore { background: #F4F6F8; }
.vafter { background: #EAF3FB; }
.vlabel { display: flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.vbefore .vlabel { color: #6a737c; }
.vafter .vlabel { color: #1a6fb0; }
.vlabel::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: currentColor; display: inline-block; }
.vcol p { margin: 0; font-size: 14px; line-height: 1.8; color: #333; }
.varrow { flex: 0 0 auto; align-self: center; width: 34px; height: 34px; border-radius: 50%; background: #2f8fd6; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; }

@media screen and (max-width: 767px) {
  .listen .genba { flex-direction: column; }
  .listen .genba .img { flex: none; max-width: 100%; flex-direction: row; }
  .vcard-cols { flex-direction: column; }
  .varrow { transform: rotate(90deg); margin: 2px auto; }
}

/* 2026-08-02 CSS監査: 旧「選ばれる理由/4つの特徴」セクション（.reason-sec 一式）と専用@mediaを、
   見出しコメントごと削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* ---- カリキュラム（.curriculum / .box_curriculum）旧LP style_seizu から流用・#seizu_nyumon スコープ --- */
/* ★旧: margin-top:60px。セクションに背景色を付けた 2026-07-29 以降は、外側の余白だと
   そこだけ白く抜けて帯が途切れるため、下の .lp-body .curriculum で padding に置き換えた。 */
/* 章本文（.txt / .exp_img）は 2026-07-28 のアコーディオン化で
   .curriculum-accordion__content の中へ移動。旧 .box_curriculum の .num/h3/.point は
   アコーディオン見出し（__number/__chapter-title/__summary）に置き換わったため定義を削除。 */
#seizu_nyumon .curriculum-accordion__content .txt { font-size: 15px; margin-bottom: 20px; padding: 0; }
#seizu_nyumon .curriculum-accordion__content .exp_img { margin: 0 0 20px; }
#seizu_nyumon .curriculum-accordion__content .exp_img img { vertical-align: bottom; max-width: 100%; height: auto; }
/* 2026-08-02 CSS監査: 未使用の .words（章本文内の用語装飾）を削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
#seizu_nyumon .curriculum-accordion__content .openVideo { margin: 4px auto 8px; }
/* =============================================================
   章パネル内の「理解が深まる専門用語」と補足図  2026-07-29
   -------------------------------------------------------------
   旧 .box_curriculum_bottom は、章が水色の大きなカードだった時代の名残で
   「水色の外枠＋白い内箱」という二重構造だった（外枠は padding-top:0 のため
   上辺だけ色が出ない）。アコーディオン化でカード自体が無くなったため、
   パネル内に水色の切れ端が残る崩れた見た目になっていた。
   マークアップごと .cur-terms（用語をチップ表示）と .cur-figure（補足図）に
   作り替え、旧 .box_curriculum_bottom* の定義は削除した。
   ============================================================= */
.lp-body #seizu_nyumon .cur-terms {
  margin: 20px 0 0; padding: 18px 20px 20px;
  background: #FFF; border: 1px solid #DDE4F2; border-radius: 10px;
}
.lp-body #seizu_nyumon .cur-terms__label {
  display: flex; align-items: center; gap: 8px;
  margin: 0 0 12px; color: var(--main-color);
  font-size: 14px; font-weight: 800; line-height: 1.4;
}
/* ラベル左の短い縦線。〈 〉で囲む旧表記の代わり */
.lp-body #seizu_nyumon .cur-terms__label::before {
  content: ""; flex: 0 0 auto; width: 3px; height: 15px;
  background: var(--main-color); border-radius: 2px;
}
.lp-body #seizu_nyumon .cur-terms__list {
  display: flex; flex-wrap: wrap; gap: 8px;
  margin: 0; padding: 0; list-style: none;
}
.lp-body #seizu_nyumon .cur-terms__list li {
  margin: 0; padding: 5px 12px;
  background: #EEF3FB; border-radius: 999px;
  color: #2b3757; font-size: 13px; font-weight: 600; line-height: 1.5;
  white-space: nowrap;
}
.lp-body #seizu_nyumon .cur-figure { margin: 16px 0 0; text-align: center; }
/* ★display は指定しない。PC用(.hidden-phone)/SP用(.visible-phone)の出し分けを
     打ち消してしまい、両方が縦に並んで表示されるため。 */
.lp-body #seizu_nyumon .cur-figure img {
  max-width: 100%; height: auto; vertical-align: bottom; border-radius: 8px;
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .cur-terms { padding: 14px 14px 16px; }
  .lp-body #seizu_nyumon .cur-terms__list { gap: 6px; }
  .lp-body #seizu_nyumon .cur-terms__list li { padding: 4px 10px; font-size: 12px; }
}
/* =============================================================
   カリキュラム・アコーディオン（.curriculum-accordion）  2026-07-28
   kyoudo の全9章アコーディオンを seizu へ移植し、紺 #1f285f 系に配色変更。
   開閉JSは共通の js/lp_kyoudo_curriculum.js（クラス名依存のみで講座非依存）を
   本文の<script>で読み込む。※ファイル名にkyoudoが入るが中身は汎用。
   seizuは箇条書き（学習内容リスト）・スライド帯が無く画像主体のため、
   kyoudo の __learning-list / __slide-strip / lightbox 系ルールは移植しない。
   ============================================================= */
.lp-body #seizu_nyumon .curriculum-accordion,
.lp-body #seizu_nyumon .curriculum-accordion * { box-sizing: border-box; }

/* カリキュラム全体の帯。全体像カード・章カードとも白なので、白背景のままだと
   カードの輪郭が背景に溶けて区切りが読めなかった。セクションを薄い水色にして
   「白いカードが乗っている」形にし、上下のセクションとの境目も明確にする。
   ※幅・マージンは上の全幅ブレイクアウト一覧で指定済み。ここで再指定すると二重にずれる。 */
.lp-body .curriculum {
  /* 上下は margin ではなく padding で取る。margin だとその分だけ背景色が途切れて
     前後のセクションとの間に白い帯ができてしまう。 */
  margin-top: 0;
  padding: 60px 20px 30px;
  background: #F2F6FC;
  box-sizing: border-box;
}
.lp-body .curriculum > * { max-width: 1000px; margin-left: auto; margin-right: auto; }
/* 直後の30pxスペーサーも同じ理由で白く抜けるため、帯の padding-bottom に取り込んで隠す */
.lp-body .curriculum + .wp-block-spacer { display: none; }
@media screen and (max-width: 480px) { .lp-body .curriculum { padding-top: 30px; } }

.lp-body #seizu_nyumon .curriculum-accordion {
  width: 100%;
  margin: 0 auto;
  padding: 0 0 60px;
  background: transparent;  /* 帯の色を透かす。旧 #FFF だとセクション色が出ない */
  color: #1a2540;
  word-break: normal;
  overflow-wrap: break-word;
  line-break: strict;
}
.lp-body #seizu_nyumon .curriculum-accordion__header {
  width: 100%;
  padding: 0 20px 22px;
  background: transparent;
}
.lp-body #seizu_nyumon .curriculum-accordion__header-inner { width: min(1000px, 100%); margin: 0 auto; }
.lp-body #seizu_nyumon .curriculum-accordion__lead {
  margin: 0 auto; color: #59637d; font-size: 15px; line-height: 1.8; text-align: center;
}

/* すべて開く / すべて閉じる */
.lp-body #seizu_nyumon .curriculum-accordion__controls {
  display: flex; justify-content: flex-end; gap: 8px; margin: 0 0 12px;
}
.lp-body #seizu_nyumon .curriculum-accordion__control {
  min-height: 38px; padding: 7px 15px; appearance: none;
  background: #FFF; border: 1px solid #C9D0E4; border-radius: 6px;
  color: var(--main-color); font-family: inherit; font-size: 13px; font-weight: 700;
  line-height: 1.4; cursor: pointer;
}
.lp-body #seizu_nyumon .curriculum-accordion__control:hover { background: var(--band-color); }

.lp-body #seizu_nyumon .curriculum-accordion__list { display: grid; gap: 9px; }

.lp-body #seizu_nyumon .curriculum-accordion__item {
  overflow: hidden; background: #FFF; border: 1px solid #D8DDEC; border-radius: 9px;
  transition: background-color .2s ease, border-color .2s ease;
}
.lp-body #seizu_nyumon .curriculum-accordion__item.is-open {
  background: #F5F6FB; border-color: #B9C2DE; border-left: 4px solid var(--main-color);
}

/* 見出しボタン: 章番号バッジ／タイトル／概要一文／＋－アイコン */
.lp-body #seizu_nyumon .curriculum-accordion__toggle {
  display: grid; width: 100%; min-height: 68px;
  grid-template-columns: auto minmax(0, 1fr) auto; gap: 18px; align-items: center;
  padding: 12px 16px 12px 13px; appearance: none; background: transparent; border: 0;
  color: #1a2540; font-family: inherit; text-align: left; cursor: pointer;
}
.lp-body #seizu_nyumon .curriculum-accordion__toggle:hover { background: #F5F6FB; }
.lp-body #seizu_nyumon .curriculum-accordion__number {
  display: inline-flex; min-width: 76px; min-height: 38px; align-items: center; justify-content: center;
  padding: 7px 12px; border-radius: 6px; background: var(--main-color); color: #FFF;
  font-size: 14px; font-weight: 800; line-height: 1; white-space: nowrap;
  grid-column: 1; grid-row: 1 / 3;
}
.lp-body #seizu_nyumon .curriculum-accordion__heading { display: block; min-width: 0; grid-column: 2; grid-row: 1; }
.lp-body #seizu_nyumon .curriculum-accordion__chapter-title {
  display: block; color: #1a2540; font-size: 18px; font-weight: 800; line-height: 1.45;
}
.lp-body #seizu_nyumon .curriculum-accordion__summary {
  display: block; grid-column: 2; grid-row: 2; margin-top: -4px;
  color: #59637d; font-size: 13px; font-weight: 500; line-height: 1.55;
}
.lp-body #seizu_nyumon .curriculum-accordion__icon {
  position: relative; display: block; width: 34px; height: 34px; border-radius: 50%;
  background: var(--band-color); color: var(--main-color); flex: 0 0 auto;
  grid-column: 3; grid-row: 1 / 3;
}
.lp-body #seizu_nyumon .curriculum-accordion__icon::before,
.lp-body #seizu_nyumon .curriculum-accordion__icon::after {
  content: ""; position: absolute; top: 50%; left: 50%; width: 15px; height: 2px;
  border-radius: 2px; background: currentColor; transform: translate(-50%, -50%);
  transition: transform .2s ease;
}
.lp-body #seizu_nyumon .curriculum-accordion__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.lp-body #seizu_nyumon .curriculum-accordion__toggle[aria-expanded="true"] .curriculum-accordion__icon::after {
  transform: translate(-50%, -50%) rotate(0deg);
}
.lp-body #seizu_nyumon .curriculum-accordion__toggle:focus-visible,
.lp-body #seizu_nyumon .curriculum-accordion__control:focus-visible {
  outline: 3px solid rgba(31, 40, 95, .28); outline-offset: 3px;
}

/* 開閉パネル。JS未読込（is-no-js）の間は開いた状態で表示＝内容が必ず読める */
.lp-body #seizu_nyumon .curriculum-accordion__panel { background: #F5F6FB; }
.lp-body #seizu_nyumon .curriculum-accordion__panel[hidden] { display: none; }
.lp-body #seizu_nyumon .curriculum-accordion.is-no-js .curriculum-accordion__panel[hidden] { display: block !important; }
.lp-body #seizu_nyumon .curriculum-accordion.is-no-js .curriculum-accordion__controls { display: none; }
.lp-body #seizu_nyumon .curriculum-accordion__content {
  padding: 24px 30px 30px; border-top: 1px solid #D8DDEC;
}

@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .curriculum-accordion { padding-bottom: 40px; }
  .lp-body #seizu_nyumon .curriculum-accordion__header { padding: 0 16px 18px; }
  .lp-body #seizu_nyumon .curriculum-accordion__lead { font-size: 14px; text-align: left; }
  .lp-body #seizu_nyumon .curriculum-accordion__controls { justify-content: center; }
  .lp-body #seizu_nyumon .curriculum-accordion__toggle {
    grid-template-columns: auto minmax(0, 1fr) auto; gap: 10px; padding: 12px 12px 12px 10px;
  }
  .lp-body #seizu_nyumon .curriculum-accordion__number { min-width: 62px; min-height: 32px; padding: 6px 8px; font-size: 12px; }
  .lp-body #seizu_nyumon .curriculum-accordion__chapter-title { font-size: 16px; }
  .lp-body #seizu_nyumon .curriculum-accordion__summary { font-size: 12px; }
  .lp-body #seizu_nyumon .curriculum-accordion__icon { width: 28px; height: 28px; }
  .lp-body #seizu_nyumon .curriculum-accordion__content { padding: 18px 14px 22px; }
}

/* 2026-08-02 CSS監査: 旧補足枠（.exp_add / .exp_add.last / .theme）と専用@mediaを削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* =============================================================
   カリキュラムのSTEP構成（.cur-overview / .cur-group / .cur-ex）  2026-07-29
   -------------------------------------------------------------
   【変更の背景】
   全13枚（第0章〜第10章。第6章は-1/-2/-3に分割）のアコーディオンが縦一列に
   並ぶだけで、どこまでが基礎でどこからが応用なのかが読み取れなかった。
   また到達イメージ（旧 .step-block）が常時表示の大きな画像だったため、
   章リストが画像で3回分断され、一覧性を損なっていた。
   そこで
     ① 冒頭に STEP1〜3 の全体像カード（.cur-overview）を置いて地図を示す
     ② 章を3つのSTEPグループ（.cur-group）に束ね、薄い水色の見出し帯で区切る
     ③ 常時表示だった演習画像を、各グループ末尾の開閉行（.cur-ex）に格納する
   という構成にした。旧 .step-block / .sb-* の定義はマークアップごと廃止。

   【開閉の仕様】
   演習行は章と同じ .curriculum-accordion__item / __toggle / __panel を使うため、
   既存の lp_seizu_curriculum.js がそのまま制御する（JSの修正は不要）。
   排他制御（1つ開くと他が閉じる）は入れていない＝「すべて開く」と両立させるため。
   ============================================================= */

/* ---- ① 全体像カード ---- */
.lp-body #seizu_nyumon .cur-overview {
  width: min(1000px, 100%); margin: 0 auto 26px; padding: 26px 24px;
  background: #FFF; border: 1px solid #DCE5F5; border-radius: 14px;
  box-shadow: 0 2px 10px rgba(31, 40, 95, .07);
}
.lp-body #seizu_nyumon .cur-overview__list {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px;
  margin: 0; padding: 0; list-style: none;
}
.lp-body #seizu_nyumon .cur-overview__step {
  position: relative; display: flex; flex-direction: column; align-items: center;
  margin: 0; padding: 0 10px; text-align: center;
}
/* STEP間の矢印（最後の1つには出さない） */
.lp-body #seizu_nyumon .cur-overview__step:not(:last-child)::after {
  content: ""; position: absolute; top: 122px; right: -14px;
  width: 22px; height: 16px; background: #F5811F;
  -webkit-clip-path: polygon(0 30%, 55% 30%, 55% 0, 100% 50%, 55% 100%, 55% 70%, 0 70%);
  clip-path: polygon(0 30%, 55% 30%, 55% 0, 100% 50%, 55% 100%, 55% 70%, 0 70%);
}
.lp-body #seizu_nyumon .cur-overview__badge {
  margin: 0 0 8px; padding: 4px 18px; background: #F5811F; border-radius: 999px;
  color: #FFF; font-size: 13px; font-weight: 800; letter-spacing: .1em; line-height: 1.4;
}
.lp-body #seizu_nyumon .cur-overview__range {
  margin: 0 0 4px; color: #59637d; font-size: 14px; font-weight: 700; line-height: 1.4;
}
.lp-body #seizu_nyumon .cur-overview__title {
  margin: 0 0 6px; color: #17233f; font-size: 21px; font-weight: 800; line-height: 1.4;
}
.lp-body #seizu_nyumon .cur-overview__desc {
  margin: 0 0 14px; color: #59637d; font-size: 13px; font-weight: 500; line-height: 1.5;
}
.lp-body #seizu_nyumon .cur-overview__visual {
  display: flex; align-items: center; justify-content: center;
  width: 100%; height: 150px; margin-top: auto;
}
.lp-body #seizu_nyumon .cur-overview__visual img {
  display: block; width: auto; height: auto; max-width: 100%; max-height: 100%;
  object-fit: contain;
}

/* ---- ② STEPグループの見出し帯 ---- */
.lp-body #seizu_nyumon .cur-group { margin: 0 0 26px; }
.lp-body #seizu_nyumon .cur-group:last-of-type { margin-bottom: 8px; }
/* 文字サイズが違う「見出し」と「章範囲」は、box の中央ではなく文字のベースラインで
   揃えないと段違いに見える。丸バッジだけはベースラインに乗せず中央に置く。 */
.lp-body #seizu_nyumon .cur-group__head {
  display: flex; align-items: baseline; gap: 14px;
  margin: 0 0 10px; padding: 12px 18px;
  background: #E4ECF9; border-radius: 9px;
}
.lp-body #seizu_nyumon .cur-group__badge {
  align-self: center;
  flex: 0 0 auto; padding: 5px 16px; background: #F5811F; border-radius: 999px;
  color: #FFF; font-size: 13px; font-weight: 800; letter-spacing: .08em; line-height: 1.4;
}
.lp-body #seizu_nyumon .cur-group__title {
  margin: 0; color: #17233f; font-size: 22px; font-weight: 800; line-height: 1.4;
}
.lp-body #seizu_nyumon .cur-group__range {
  color: #59637d; font-size: 14px; font-weight: 700; line-height: 1.4;
}

/* ---- ③ 演習の開閉行 ---- */
/* 章の行と同じ部品を使うが、章番号バッジの代わりにアイコンが入るため
   枠線と背景で「章ではない」ことを示す。 */
.lp-body #seizu_nyumon .curriculum-accordion__item--exercise {
  background: #F7FAFF; border-color: #C3D2EC;
}
/* 演習行は章行と違って概要文（2行目）が無い。章行用の3行グリッドのままだと
   アイコン・＋ボタンと見出しの中心が9pxずれるため、単純な横並びに戻す。 */
.lp-body #seizu_nyumon .curriculum-accordion__item--exercise .curriculum-accordion__toggle {
  display: flex; align-items: center; gap: 18px;
}
.lp-body #seizu_nyumon .curriculum-accordion__item--exercise .curriculum-accordion__heading {
  flex: 1 1 auto;
}
.lp-body #seizu_nyumon .cur-ex__ico {
  display: flex; align-items: center; justify-content: center;
  flex: 0 0 76px;
}
.lp-body #seizu_nyumon .cur-ex__ico img {
  display: block; width: auto; height: auto; max-width: 100%; max-height: 40px;
  object-fit: contain;
}
.lp-body #seizu_nyumon .cur-ex__lead {
  margin: 0 0 16px; color: #3d4a63; font-size: 15px; font-weight: 500;
  line-height: 1.8; text-align: center;
}
.lp-body #seizu_nyumon .cur-ex__visual { margin: 0 auto; max-width: 1000px; }
.lp-body #seizu_nyumon .cur-ex__visual img {
  display: block; width: 100%; height: auto; border-radius: 10px;
}
.lp-body #seizu_nyumon .cur-ex__note {
  margin: 18px auto 0; padding: 14px 20px; max-width: 1000px;
  background: #EEF4FB; border-radius: 10px;
  color: #17233f; font-size: 17px; font-weight: 700; line-height: 1.6; text-align: center;
}

/* ---- 下部の操作ヒント ---- */
.lp-body #seizu_nyumon .cur-hint {
  margin: 18px 0 0; color: #59637d; font-size: 13px; line-height: 1.6; text-align: center;
}

@media screen and (max-width: 767px) {
  /* 全体像は横3列だと1列あたりが狭すぎるため縦積みにし、矢印は下向きに置き換える */
  .lp-body #seizu_nyumon .cur-overview { padding: 18px 14px; margin-bottom: 20px; }
  .lp-body #seizu_nyumon .cur-overview__list { grid-template-columns: 1fr; gap: 22px; }
  .lp-body #seizu_nyumon .cur-overview__step { padding: 0; }
  .lp-body #seizu_nyumon .cur-overview__step:not(:last-child)::after {
    top: auto; bottom: -19px; right: auto; left: 50%; width: 16px; height: 22px;
    transform: translateX(-50%);
    -webkit-clip-path: polygon(30% 0, 30% 55%, 0 55%, 50% 100%, 100% 55%, 70% 55%, 70% 0);
    clip-path: polygon(30% 0, 30% 55%, 0 55%, 50% 100%, 100% 55%, 70% 55%, 70% 0);
  }
  .lp-body #seizu_nyumon .cur-overview__title { font-size: 19px; }
  .lp-body #seizu_nyumon .cur-overview__visual { height: 120px; }

  .lp-body #seizu_nyumon .cur-group__head {
    flex-wrap: wrap; gap: 6px 10px; padding: 10px 12px;
  }
  .lp-body #seizu_nyumon .cur-group__badge { font-size: 12px; padding: 4px 13px; }
  .lp-body #seizu_nyumon .cur-group__title { font-size: 18px; }
  .lp-body #seizu_nyumon .cur-group__range { font-size: 13px; }

  .lp-body #seizu_nyumon .cur-ex__ico { flex-basis: 62px; }
  .lp-body #seizu_nyumon .curriculum-accordion__item--exercise .curriculum-accordion__toggle { gap: 10px; }
  .lp-body #seizu_nyumon .cur-ex__ico img { max-height: 32px; }
  .lp-body #seizu_nyumon .cur-ex__lead { font-size: 14px; text-align: left; }
  .lp-body #seizu_nyumon .cur-ex__note { font-size: 15px; padding: 12px 14px; }
}

/* ---- 汎用 section-title（基礎編準拠・seizu色の薄帯＋上に短線） --- */
.section-title { width: 100%; box-sizing: border-box; color: #1f285f; background-color: #e8eaf4; font-size: 36px; margin-top: -1px; text-align: center; letter-spacing: 4px; line-height: 1.6; padding: 30px 20px 48px; margin-bottom: 80px; }
.section-title::before { content: ""; display: block; width: 52px; height: 4px; background: #1f285f; border-radius: 2px; margin: 0 auto 20px; }
@media screen and (max-width: 767px) { .section-title { font-size: 24px; margin-bottom: 40px; } }

/* =============================================================
   study-sec「あなたのペースで、無理なく学習できます」  2026-07-28
   kyoudo の study-sec を seizu へ移植（紺 #1f285f 系に配色変更）。
   旧 .pace（説明文＋pace.png ＋ 影付き3カード「集中型/通常型/ゆっくり型」）は廃止し、
   受講環境の3項目（枠なし・アイコン左）＋ 既存スライダー（.dailystudies）を1つの
   セクションに統合。旧 .pace-top/.pace-img/.pace-style/.pace-box 系の定義は
   本文から要素が無くなったため削除した。
   ※全幅ブレイクアウトは上部の .lp-body .pace の共通指定を流用（二重指定しない）
   ============================================================= */
.pace { background-color: #FFF; }
.lp-body #seizu_nyumon .study-sec {
  display: block;
  box-sizing: border-box;
  padding: 60px max(20px, calc((100vw - 960px) / 2));
  /* ★2026-07-29 変更: 旧 #F5F6FB。直前のカリキュラム帯(#F2F6FC)とほぼ同じ色で
     セクションの切れ目が見えなかったため、暖色系の生成りにした。
     色はこのLPで既に使っている .listen と同じ #FBF6EE を流用（新色を増やさない）。 */
  background: #FBF6EE;
}
.lp-body #seizu_nyumon .study-sec > * { max-width: 960px; margin-left: auto; margin-right: auto; }
.lp-body #seizu_nyumon .study-sec .section-title {
  width: auto; background: none; font-size: 33px; margin: 0 0 12px; padding-top: 0;
}
.lp-body #seizu_nyumon .study-sec .ss-lead {
  text-align: center; font-size: 16px; color: #4A5568; line-height: 1.7; margin: 0 0 44px;
}
/* スマホ専用の改行。PCでは無効にして自然に折り返す（kyoudo と同じ挙動。
   これが無いとPCでも<br>が効き、3行に割れて「す」だけ落ちる等の崩れが出る） */
.mobile-copy-break { display: none; }
@media screen and (max-width: 767px) { .mobile-copy-break { display: initial; } }

/* カリキュラム見出しの補足行「（基礎知識が身につく流れを実感してください）」。
   本題より一段小さくして主従を付ける。PC/SP共通で 0.72em（PC28px→約20px、SP22px→約16px）。 */
.lp-body #seizu_nyumon .curriculum .lined .cur-title__sub {
  display: inline-block; font-size: 0.72em; letter-spacing: normal;
}

/* 3つの特徴（カード枠なし・アイコン左／見出しと説明文を右） */
.lp-body #seizu_nyumon .study-sec .ss-cards {
  display: flex; gap: 0; margin: 0 auto 28px; padding: 0; list-style: none;
}
.lp-body #seizu_nyumon .study-sec .ss-card {
  flex: 1 1 0; position: relative; display: flex; align-items: center; gap: 16px;
  min-height: 96px; padding: 12px 20px;
  background: transparent; border: 0; border-radius: 0; box-shadow: none;
}
.lp-body #seizu_nyumon .study-sec .ss-card:not(:last-child)::after {
  content: ""; position: absolute; top: 12px; right: 0; bottom: 12px;
  width: 1px; background: rgba(31, 40, 95, .14);
}
/* 丸い下地は付けずアイコン単体で見せる（2026-07-31。法人向けセクションと揃えた） */
.lp-body #seizu_nyumon .study-sec .ss-ico {
  position: relative; display: inline-block; flex: 0 0 auto;
  width: 58px; height: 58px;
}
/* アイコン本体：SVGをマスクにして主色で塗る（テーマ共通のstudy_*.svgを流用） */
.lp-body #seizu_nyumon .study-sec .ss-ico::before {
  content: ""; position: absolute; top: 11px; left: 11px; right: 11px; bottom: 11px;
  background-color: var(--main-color);
  -webkit-mask: center / contain no-repeat; mask: center / contain no-repeat;
}
.lp-body #seizu_nyumon .study-sec .ss-card:nth-child(1) .ss-ico::before { -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg);   mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_time.svg); }
.lp-body #seizu_nyumon .study-sec .ss-card:nth-child(2) .ss-ico::before { -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_player.svg); mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_player.svg); }
.lp-body #seizu_nyumon .study-sec .ss-card:nth-child(3) .ss-ico::before { -webkit-mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_replay.svg); mask-image: url(/wp/wp-content/themes/fantomsemi/images/study_replay.svg); }
.lp-body #seizu_nyumon .study-sec .ss-body { flex: 1 1 auto; min-width: 0; }
.lp-body #seizu_nyumon .study-sec .ss-card-ttl {
  margin: 0 0 5px; color: var(--main-color); font-size: 18px; font-weight: 800;
  line-height: 1.45; white-space: nowrap;
}
.lp-body #seizu_nyumon .study-sec .ss-card-desc {
  margin: 0; color: #53667E; font-size: 15px; line-height: 1.75;
  word-break: normal; overflow-wrap: break-word; line-break: strict;
}

/* スライダー見出し（小＝オレンジ左右線／メイン＝紺） */
.lp-body #seizu_nyumon .study-sec .ss-slider-head { text-align: center; margin: 34px auto 20px; }
.lp-body #seizu_nyumon .study-sec .ss-sub {
  display: inline-flex; align-items: center; gap: 10px;
  color: #E96512; font-size: 14px; font-weight: 700;
}
.lp-body #seizu_nyumon .study-sec .ss-sub::before,
.lp-body #seizu_nyumon .study-sec .ss-sub::after { content: ""; display: inline-block; width: 24px; height: 2px; background: #E96512; }
.lp-body #seizu_nyumon .study-sec .ss-main { font-size: 25px; font-weight: 800; color: #1a2540; margin: 6px 0 0; }

/* 既存スライダー：内部の見出し・装飾矢印画像は隠し、上の自前見出しに置き換え */
.lp-body #seizu_nyumon .study-sec .dailystudies > h2,
.lp-body #seizu_nyumon .study-sec .dailystudies > p.arrow { display: none; }
.lp-body #seizu_nyumon .study-sec .dailystudies { width: 100%; max-width: 860px; margin: 0 auto; }
.lp-body #seizu_nyumon .study-sec .dailystudies .slider {
  /* 背景は #ECF1F6（2026-08-01変更・旧#fff）。
     スライド内の画像枠(.box_ds .img)は白のままとし、
     薄いブルーの台紙の上に受講画面が浮いて見える形にする。 */
  position: relative; background: #ECF1F6; border-radius: 14px; padding: 22px 0;
}
/* 1枚表示。前後のスライドは見せない */
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-slide,
.lp-body #seizu_nyumon .study-sec .dailystudies .box_ds { background: transparent; }
.lp-body #seizu_nyumon .study-sec .dailystudies .box_ds {
  position: relative; display: flex; flex-direction: column; align-items: stretch;
  padding: 0 8px; box-sizing: border-box;
}
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-slide { opacity: 0; transition: opacity .3s; }
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-slide.slick-active,
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-center { opacity: 1; }
.lp-body #seizu_nyumon .study-sec .box_ds .num { display: none; }
/* スライド内タイトル：画像に重ねず画像の上へ独立配置 */
.lp-body #seizu_nyumon .study-sec .box_ds .title {
  order: 1; align-self: center; position: static; transform: none; z-index: auto;
  display: inline-block; background: var(--main-color); color: #fff;
  font-size: 14px; font-weight: 700; line-height: 1.4; text-align: center;
  padding: 5px 16px; border-radius: 999px; margin: 0 0 12px;
}
/* 画像：白ボックス＋薄い枠。※既存の height:380px 固定指定を詳細度で上書きする。
   max-width は、seizuのslickがスライド幅960px（スライダー枠860pxより広い）で
   組まれており68%だと大きくなりすぎるため、kyoudoの実寸(約574px)に合わせる上限。 */
.lp-body #seizu_nyumon .study-sec .box_ds .img {
  order: 2; align-self: center; width: 68%; max-width: 580px; margin: 0;
  border-radius: 10px; overflow: hidden; background: #fff; border: 1px solid #DDE2F0;
}
.lp-body #seizu_nyumon .study-sec .slick-center .box_ds .img { box-shadow: 0 6px 18px rgba(0, 0, 0, .12); }
.lp-body #kikaizairyou .study-sec .dailystudies div.slider p.img img {
  width: 100%; height: auto; max-width: 100%; display: block; object-fit: contain;
}
/* 画像下の説明文 */
.lp-body #seizu_nyumon .study-sec .box_ds .txt {
  order: 3; display: block; width: 100%; max-width: 100%; box-sizing: border-box;
  margin: 12px 0 0; text-align: center; font-size: 14px; line-height: 1.75;
  color: #4A5568; word-break: keep-all;
}
.lp-body #seizu_nyumon .study-sec .dailystudies .slider p.txt {
  width: 100%; max-width: 100%; float: none; text-align: center; margin: 12px 0 0;
}

/* 矢印（白丸＋太い紺リング＋紺の三角）。
   ★kyoudoは <button class="ss-arrow"> だが、seizu のslick設定が生成するのは
     <img class="prev-arrow"> ＝ 置換要素のため ::before が描画されない。
     そこで CSS の content で img の中身ごと SVG（リング＋三角）に差し替える。
     クリック領域・slick-disabled の制御はそのまま活きる。 */
.lp-body #seizu_nyumon .study-sec .dailystudies .slider .prev-arrow,
.lp-body #seizu_nyumon .study-sec .dailystudies .slider .next-arrow {
  position: absolute; top: 42%; transform: translateY(-50%); z-index: 5;
  width: 60px; height: 60px; display: block !important; padding: 0; border: 0;
  background: none; cursor: pointer;
  filter: drop-shadow(0 3px 6px rgba(31, 40, 95, .22));
} /* !important: slickがインラインで display を書くため */
.lp-body #seizu_nyumon .study-sec .dailystudies .slider .prev-arrow {
  left: 60px;
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"><circle cx="30" cy="30" r="26" fill="%23ffffff" stroke="%231f285f" stroke-width="8"/><path d="M34 20 L22 30 L34 40 Z" fill="%231f285f"/></svg>');
}
.lp-body #seizu_nyumon .study-sec .dailystudies .slider .next-arrow {
  right: 60px;
  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60"><circle cx="30" cy="30" r="26" fill="%23ffffff" stroke="%231f285f" stroke-width="8"/><path d="M26 20 L38 30 L26 40 Z" fill="%231f285f"/></svg>');
}
/* ループ無効：先頭で左矢印・末尾で右矢印を非表示 */
.lp-body #seizu_nyumon .study-sec .dailystudies .slider .prev-arrow.slick-disabled,
.lp-body #seizu_nyumon .study-sec .dailystudies .slider .next-arrow.slick-disabled { display: none !important; }
/* ドット（選択中は横長の紺） */
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-dots {
  position: static; display: flex; justify-content: center; gap: 8px; margin: 16px 0 0; padding: 0;
}
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-dots li { width: auto; height: auto; margin: 0; }
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-dots li button {
  width: 8px; height: 8px; padding: 0; border-radius: 50%; background: #C5CBDE;
}
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-dots li button::before { display: none; }
.lp-body #seizu_nyumon .study-sec .dailystudies .slick-dots li.slick-active button {
  width: 22px; border-radius: 999px; background: var(--main-color);
}
/* スライダー下 説明 */
.lp-body #seizu_nyumon .study-sec .ss-slider-desc {
  text-align: center; font-size: 14px; color: #4A5568; line-height: 1.7; margin: 18px auto 0;
}
.lp-body #seizu_nyumon .study-sec .ss-slider-desc b { color: var(--main-color); }

@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .study-sec { padding: 40px 16px; }
  .lp-body #seizu_nyumon .study-sec .section-title { font-size: 25px; }
  .lp-body #seizu_nyumon .study-sec .ss-lead { margin-bottom: 30px; font-size: 14px; }
  .lp-body #seizu_nyumon .study-sec .ss-cards { flex-direction: column; gap: 0; }
  .lp-body #seizu_nyumon .study-sec .ss-card { flex: 0 0 auto; min-height: 0; gap: 14px; padding: 18px 10px; }
  .lp-body #seizu_nyumon .study-sec .ss-card:not(:last-child)::after {
    top: auto; right: 10px; bottom: 0; left: 10px; width: auto; height: 1px;
  }
  .lp-body #seizu_nyumon .study-sec .ss-ico { width: 52px; height: 52px; }
  .lp-body #seizu_nyumon .study-sec .ss-card-ttl { white-space: normal; }
  .lp-body #seizu_nyumon .study-sec .ss-main { font-size: 22px; }
  .lp-body #seizu_nyumon .study-sec .dailystudies .slider { padding: 16px 0; }
  .lp-body #seizu_nyumon .study-sec .dailystudies .box_ds { padding: 0 4px; }
  .lp-body #seizu_nyumon .study-sec .box_ds .title { font-size: 12px; padding: 4px 12px; margin-bottom: 9px; }
  .lp-body #seizu_nyumon .study-sec .box_ds .txt { font-size: 13px; }
  .lp-body #seizu_nyumon .study-sec .box_ds .img { width: 100%; }
  .lp-body #seizu_nyumon .study-sec .dailystudies .slider .prev-arrow,
  .lp-body #seizu_nyumon .study-sec .dailystudies .slider .next-arrow { width: 50px; height: 50px; }
  .lp-body #seizu_nyumon .study-sec .dailystudies .slider .prev-arrow { left: 8px; }
  .lp-body #seizu_nyumon .study-sec .dailystudies .slider .next-arrow { right: 8px; }
}

/* ---- サンプル動画ボタン（.openVideo）koso-basic準拠・背景はseizu紺#1f285f。第1/4/7章に追加 2026-07-25 ---- */
.openVideo {
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 80%;
  max-width: 670px;
  background-color: #1f285f;
  color: #FFF;
  border-radius: 6px;
  font-size: 22px;
  padding: 1%;
  box-sizing: border-box;
  margin: 20px auto 35px auto;
  cursor: pointer;
}
@media screen and (max-width: 400px) { .openVideo { font-size: 15px; gap: 15px; } }
@media screen and (min-width: 401px) and (max-width: 767px) { .openVideo { font-size: 16px; gap: 10vw; } }
@media screen and (max-width: 767px) { .openVideo { justify-content: center; width: calc(100% - 40px); padding: 10px 0; } }
.v-right { display: flex; align-items: center; gap: 15px; }
@media screen and (max-width: 400px) { .v-right { gap: 8px; } }
@media screen and (min-width: 401px) and (max-width: 767px) { .v-right { gap: 15px; } }
/* 動画ポップアップ内のiframeサイズ（.popup/.popup-content/.close は既存を流用） */
.popup-content > iframe { width: 100%; margin-bottom: -8px; height: 270px; }

/* =============================================================
   スマートフォン最適化 第1段階  2026-07-29
   -------------------------------------------------------------
   320 / 375 / 390 / 430px を実機幅で描画して計測し、
   「実際に問題が再現した箇所」だけを修正している。
   ・横スクロールは4幅とも発生していなかったため、はみ出し対策は入れていない。
   ・.box-list / .benefit-v2-card / .number-box / カリキュラム全体像は
     320pxで既に1列・左右16pxの余白が取れていたため変更なし。
   ・.off-txt / .spec_list / .tk-cards は現在のマークアップに存在しない
     （price-v2 / benefit-v2 へ置換済み）ため対象外。
   すべて max-width:767px 以下のみに閉じており、PC表示には影響しない。
   ============================================================= */
@media screen and (max-width: 767px) {

  /* --- 1. 固定CTAの重なり ---------------------------------------
     .apply-v2-step(z-index:1) / .apply-v2-number(z-index:2) が、
     z-index:auto のSP固定カートと #page-top より前面に出ており、
     「申込みからご利用開始まで」の位置で固定CTAが数字バッジに隠れていた。
     PC用 .float_cart.hidden-phone は既に z-index 指定済みのため触らない。
     ※#page-top（このページのTOPへ）は 320〜430px の全スクロール位置で
       display:none＝SPでは表示されないため、SP側の対策は不要。 */
  .lp-body .float_cart_sp { z-index: 1000; }
  /* ★左右の位置を明示する。この固定バーは left/right が auto のため、
     下の「本文が画面端に接する」対策で #seizu_nyumon に付けた左右padding 16px が
     静的位置に効いてしまい、バーが右へ16pxずれて左に隙間が空いていた。 */
  .lp-body #seizu_nyumon .float_cart_sp { left: 0; right: 0; width: auto; }

  /* --- 2. ページ末尾が固定CTA（高さ55px）に隠れる --------------
     フッターのコピーライト行が完全に隠れていたため、下に逃げを作る。 */
  .lp-body:has(#seizu_nyumon) { padding-bottom: 60px; }

  /* --- 3. 10pxまで落ちていた注記 -------------------------------
     分割払いの税込表記とグループ割引の注記が10pxで、本文14pxに対して
     読めない差になっていた。12pxへ。 */
  .lp-body #seizu_nyumon .price-txt_intax_bunkatsu,
  .lp-body #seizu_nyumon .pv2-group-notes li,
  .lp-body #seizu_nyumon .pv2-quote-action p { font-size: 12px; line-height: 1.6; }

  /* --- 4. アンケート結果の横棒グラフ ---------------------------
     .bar-row は 100px / 122px / 40px の固定3列。320pxでは
     「非常に分かり易い」が2行に割れて棒とラベルの高さがずれていた。
     ラベルを詰め、棒側を可変にして1行に収める。 */
  .lp-body #seizu_nyumon .bar-row { grid-template-columns: 96px minmax(0, 1fr) 38px; }
  .lp-body #seizu_nyumon .bar-row .bar-label { font-size: 12px; line-height: 1.4; }

  /* --- 5. 本文が画面の左右端に接していた -----------------------
     本文の最外ラッパー #seizu_nyumon に左右paddingが無く、全幅
     ブレイクアウトしていないセクション（.common-lang / .aftercourse /
     #sec-survey / .faq など）の文章が画面端にぴったり付いていた。
     ★全幅ブレイクアウト（width:100vw; left:50%; margin-left:-50vw）は
       親の左右paddingが対称であれば位置が変わらない
       （x = P + (W-2P)/2 - W/2 = 0）。実測でも全幅セクションの
       ずれ・横スクロールは発生しないことを4幅で確認済み。 */
  .lp-body #seizu_nyumon { padding-left: 16px; padding-right: 16px; }
  /* 全幅セクションは親paddingの外へ出るため、内側余白は個別に持たせる。
     他の全幅セクションは各自paddingを持っており、無いのはここだけだった。 */
  .lp-body #seizu_nyumon .feature-number { padding-left: 16px; padding-right: 16px; }

  /* --- 6. word-break:keep-all によるカード内テキストの溢れ -----
     文節の途中で改行させないための keep-all が、SPの狭い幅では
     改行位置を失って1行のまま枠外へ出ていた。
     例) お悩み01「図面に書かれた記号や線の意味が分からない」
         = 実測308px / 枠236px（第3・4カードも同様）
     原因は、PC用に本文へ入れてある <br> をSPで display:none に
     しているため、keep-all だと改行の逃げ場が無くなること。
     SPだけ通常の日本語禁則処理に戻す。 */
  .lp-body #seizu_nyumon .wr-card__txt,
  .lp-body #seizu_nyumon .ac-card__ttl,
  .lp-body #seizu_nyumon .ac-card__txt,
  .lp-body #seizu_nyumon .ac-ba__txt,
  .lp-body #seizu_nyumon .reason-v2 .rs-card__ttl,
  .lp-body #seizu_nyumon .reason-v2 .rs-card__txt,
  .lp-body #seizu_nyumon .study-sec .box_ds .txt { word-break: normal; }
}

/* --- 7. 料金カードの3指標が320pxでセルから溢れる --------------
   .pv2-metrics は3列固定。320pxではセル内幅61pxに対し
   「4時間20分」が17pxで79px必要になり溢れていた（375px以上は収まる）。
   375px未満だけ詰める。 */
@media screen and (max-width: 374px) {
  .lp-body #seizu_nyumon #price.price-v2 .pv2-metric { padding: 12px 2px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-metric strong { font-size: 14px; }
  .lp-body #seizu_nyumon #price.price-v2 .pv2-metric span { font-size: 10px; }
}

/* =============================================================
   TODO（テンプレ切替後に monoweb.org 実機で確定）
   - .lp-mv の背景画像（seizu用のヒーロー地）をどうするか（無地／seizu画像）。
   - 価格詳細カード（.price-box / .off-txt-box / .price-txt 等）の当て込み。
     本文の価格ブロックを新マークアップに置換する段階で lp_sokusen.css の
     該当ルールを移植・recolor。
   - [済 2026-07-23] 本文を1000px中央寄せ・バンド全幅化（上記「本文レイアウト」）。
     残: 装飾画像 arrows.png 等の配置、歯車キャラ(img_hagumi)の右はみ出し、スマホ表示。
   - ヘッダー追従下線が20000px/35000px…のスクロール位置で正しく連動するか。
   - CTA本文文言「講座に申し込む →」への差し替え（本文側・投稿/固定ページ8925）。
   - 不要ルールの整理（本ファイルは枠のみ。body章要素CSSは持たせない方針）。
   ============================================================= */

/* =============================================================
   申込ページ（seizu_paidseminar-order / post 8923）用レイアウト
   lp_koso-basic.css の申込ブロック（.lp-low/.lp-inner/.lp-app）を移植。
   色は koso #0989B1/#0944B1 → seizu #1f285f に置換。橙 #FF6D00 は踏襲。
   価格表(.price0x)はプラグイン net-shop-admin.css が担当。
   ============================================================= */
.lp-low { position: relative; margin-bottom: 80px; }
@media screen and (max-width: 767px) { .lp-low { margin-bottom: 50px; } }
@media screen and (max-width: 950px) { .lp-low { margin-top: 62px; } }
@media screen and (max-width: 767px) { .lp-low { margin-top: 142px; } }
.lp-low .ttl { text-align: center; color: #fff; position: absolute; width: 100%; bottom: 4vw; font-size: 36px; }
@media screen and (max-width: 950px) { .lp-low .ttl { font-size: 30px; bottom: 50%; transform: translateY(50%); } }
.lp-low img { width: 100%; height: auto; object-fit: cover; }
@media screen and (max-width: 950px) { .lp-low img { height: 150px; } }
.lp-inner { width: 840px; margin: 0 auto; max-width: calc(100% - 40px); color: #3A3A3A; }

.lp-app { margin-bottom: 80px; }
@media screen and (min-width: 768px) { .lp-app { width: 1118px; } }
.lp-app * { box-sizing: border-box; }
.lp-app .ttl { text-align: center; font-size: 24px; font-weight: bold; position: relative; letter-spacing: .08em; margin-bottom: 1.2em; }
@media screen and (max-width: 767px) { .lp-app .ttl { font-size: 20px; } }
.lp-app .ttl:before { content: ''; position: absolute; left: 50%; translate: -50% 0; top: -1em; width: 3.33em; height: .25em; background: #1f285f; }
/* 2026-08-02 CSS監査: 旧お申込みメッセージ（.lp-app .msg 一式）と専用@mediaを削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */
.lp-app .list { display: flex; gap: 60px; margin-bottom: 40px; }
@media screen and (max-width: 767px) { .lp-app .list { flex-direction: column; } }
.lp-app .list dl { border-radius: 10px; background: #F5F5F5; position: relative; text-align: center; }
@media screen and (min-width: 768px) { .lp-app .list dl { width: calc(23% - 30px); } }
.lp-app .list dl:first-child:before { content: none; }
@media screen and (min-width: 768px) { .lp-app .list dl:last-child { width: calc(26% - 30px); } }
.lp-app .list dl:last-child dt { background: #FF6D00; }
.lp-app .list dl:last-child:before { background: #FF6D00; }
.lp-app .list dl:before { content: ''; position: absolute; top: 50%; translate: 0 -50%; width: 20px; height: 55px; clip-path: polygon(0 0, 0 100%, 100% 50%); background: #1f285f; left: -40px; }
@media screen and (max-width: 767px) { .lp-app .list dl:before { left: 50%; translate: -50% 0; top: -40px; clip-path: polygon(0 0, 50% 100%, 100% 0); width: 55px; height: 20px; } }
.lp-app .list dt { font-size: 20px; font-weight: bold; color: #fff; background: #1f285f; letter-spacing: .08em; text-align: center; border-radius: 10px 10px 0 0; padding-top: .3em; }
.lp-app .list dt i { font-style: normal; font-size: 1.4em; }
.lp-app .list dd { padding: 20px 15px; }
.lp-app .list dd p { height: 3em; display: flex; align-items: center; justify-content: center; font-weight: bold; font-size: 18px; margin-bottom: 1em; }
.lp-app .list dd small { font-size: 14px; display: block; margin-top: 2em; }
.lp-app .note { font-size: 14px; line-height: 1.9; }
.lp-app figure { margin: 60px 0 80px; }
.lp-app figure img { width: 100%; }
.lp-app tbody tr:nth-child(even) { background: none; }
.lp-app table { width: 100%; }
.lp-app .ttl2 { background: #1f285f; color: #fff; font-size: 18px; display: flex; align-items: center; border-radius: 5px; padding: .5em 1em; position: relative; gap: 1em; padding-right: 55px; margin-bottom: 18px; cursor: pointer; }
.lp-app .ttl2:before { content: ''; position: absolute; font-size: 18px; width: .8em; height: .8em; border-bottom: 2px solid #fff; border-right: 2px solid #fff; right: 38px; top: 50%; transform: rotate(45deg) translateY(-0.8em); }
.lp-app .ttl2.open + .qa { display: block; }
.lp-app .qa { display: none; }
.lp-app .qa > dl { background: #F0F0F0; padding: 20px; margin-bottom: 18px; font-size: 16px; }
@media screen and (max-width: 767px) { .lp-app .qa > dl { font-size: 14px; } }
.lp-app .qa > dl > dt, .lp-app .qa > dl > dd { position: relative; }
.lp-app .qa > dl > dt:before, .lp-app .qa > dl > dd:before { content: 'Q'; position: absolute; color: #1f285f; font-weight: bold; left: 0; font-size: 24px; top: 0; line-height: 1; }
.lp-app .qa > dl > dt { font-weight: bold; padding-left: 32px; cursor: pointer; padding-right: 38px; }
.lp-app .qa > dl > dt.open:after { border: none; border-top: 2px solid #1f285f; border-left: 2px solid #1f285f; margin-top: .35em; }
.lp-app .qa > dl > dt.open + dd { display: block; }
.lp-app .qa > dl > dt:after { content: ''; position: absolute; font-size: 18px; width: .8em; height: .8em; border-bottom: 2px solid #1f285f; border-right: 2px solid #1f285f; right: 18px; top: 50%; transform: rotate(45deg) translateY(-0.8em); }
.lp-app .qa > dl > dd { border-top: solid 1px #B9B9B9; padding: 15px 0; padding-left: 32px; margin-top: 15px; }
.lp-app .qa > dl > dd:before { top: 16px; content: 'A'; }
.lp-app .qa .toggle { border: solid 1px #BEBEBE; padding: 1em; font-size: 14px; margin-top: 1em; }
@media screen and (max-width: 767px) { .lp-app .qa .toggle { font-size: 13px; } }
.lp-app .qa .toggle dt { color: #1f285f; font-size: 14px; font-weight: bold; cursor: pointer; }
.lp-app .qa .toggle dt.open + dd { display: block; margin-top: 1em; line-height: 2; }
.lp-app .qa dd dt:before, .lp-app .qa dd dd:before { content: none; }
.lp-app .qa dd { display: none; }
.lp-app .more { text-align: center; font-weight: bold; font-size: 20px; margin-top: 40px; }
@media screen and (max-width: 767px) { .lp-app .more { font-size: 18px; } }

/* =============================================================
   お問い合わせフォーム(.lp-form) lp_koso-basic.css から移植。
   見出し#0989B1・送信ボタン#FF6D00 → seizu紺#1f285f。必須バッジ#FF6D00は維持。
   フォーム本体はCF7 id=44956（共通）。.lp-inner は既存を流用。 */
.lp-form section { border-top: solid 1px #C2C2C2; padding: 60px 0 20px; }
.lp-form section:first-of-type { padding-top: 0; border: none; }
.lp-form .ttl { font-weight: bold; color: #1f285f; display: flex; gap: 1em; align-items: center; font-size: 24px; margin-bottom: 1em; }
@media screen and (max-width: 767px) { .lp-form .ttl { font-size: 18px; } }
.lp-form .ttl img { width: 1.66em; }
.lp-form p { font-size: 16px; line-height: 2; }
@media screen and (max-width: 767px) { .lp-form p { font-size: 14px; } }
.lp-form p b { font-weight: bold; font-size: 1.33em; }
.lp-form p em { display: block; font-style: normal; font-size: 24px; line-height: 1.5; }
@media screen and (max-width: 767px) { .lp-form p em { font-size: 20px; margin-bottom: .5em; } }
@media screen and (max-width: 767px) { .lp-form p small { display: block; } }
.lp-form table { margin-top: 30px; width: 100%; }
.lp-form th { font-weight: bold; font-size: 16px; position: relative; padding-bottom: .5em; }
@media screen and (min-width: 768px) { .lp-form th { font-size: 18px; width: 300px; } }
.lp-form td { padding: 0 0 2em; }
@media screen and (max-width: 767px) { .lp-form th, .lp-form td { float: left; width: 100%; } }
.lp-form .haveto, .lp-form .any { position: absolute; right: 5em; font-size: 13px; color: #fff; background: #8C8C8C; border-radius: .2em; padding: .2em .5em .1em; font-weight: normal; }
@media screen and (max-width: 767px) { .lp-form .haveto, .lp-form .any { right: 0; } }
.lp-form .wpcf7-form-control-wrap { display: inline-block; margin-right: 5px; }
.lp-form .haveto { background: #FF6D00; }
.lp-form td input, .lp-form td textarea { width: 100%; background: #F2F2F2; border: solid 1px #C7C7C7; padding: .8em 1em; box-sizing: border-box; }
.lp-form #formbtn { display: block; margin: 35px auto; background: #1f285f; width: 691px; max-width: 100%; color: #fff; font-weight: bold; border: none; font-size: 20px; padding: .8em 0; }
.lp-form .wpcf7 { text-align: center; }

/* 2026-08-02 CSS監査: 旧動作環境セクション（.lp-envi 一式）と専用@mediaを、見出しコメントごと削除。
   LP・お申込み・お問い合わせの3ページのHTML／JSいずれにも存在しないことを実測確認。復元はバックアップから。 */

/* =============================================================
   2026-08-02 CSS監査: 旧「講座の仕様＋特典枠」（.spec / .spec_list / .spec_tokuten / .tk-*）を
   一式削除。LP・お申込み・お問い合わせの3ページのHTMLいずれにも存在しないことを実測確認
   （6ページ横断で再測定し、直前まで残していた .spec_tokuten > a も未使用と確定）。
   lp_plan.css（企画発想編）からの移植時の残骸。復元はバックアップから。
   ============================================================= */


/* ================================================================
   【復旧用】お客様の声セクション CSS 一式（2026-07-29 作成）
   対象：lp_seizu.css（機械製図超入門講座LP / seizu_top 専用ファイル）

   ■ このファイルは何か
   社内での全体レイアウト調整に伴い lp_seizu.css が差し替えられた際、
   ファイル末尾に追記されていた「お客様の声」関連CSSの2ブロック
   （2026-07-26追記分・2026-07-27追記分）が失われました。
   その2ブロックを、当時と同じ内容・同じ順序でそのまま復元したものです。

   ■ 貼り付け方
   lp_seizu.css の「一番最後」に、このファイルの中身をすべて追記してください。
   すべて新規クラス（既存クラスとの重複なし）のため、位置による影響はありません。
   途中で分割せず、ファイル丸ごと1回で貼り付けてください。

   ■ 重要：ブロック1 → ブロック2 の順序を変えないこと
   ブロック2の .voice-detail はブロック1の余白指定(50px)を打ち消すための
   上書き定義です。順序が逆になると余白が約100px空いた状態に戻ります。

   ■ 内容は当時のまま（A案）
   スタイルの値は一切変更していません。
   なお、テーマ標準の帯見出し .section-title は letter-spacing:4px / margin-bottom:80px を
   持っており、このファイルの .sec-title（letter-spacing指定なし / margin-bottom:40px）とは
   従来から差があります（今回のレイアウト調整で生じた差ではなく、2026-07-27時点からの差）。
   今回はあえて合わせず、従来どおりの見た目で復旧します。

   ■ このファイルとあわせて必要な作業
   固定ページ本文に以下の1行を復元してください（<section id="sec-survey"> の直前）。
       <div id="voice-anchor" class="c_anchor"></div>
   グローバルメニュー「受講者の声」のジャンプ先です。現在この行が失われており、
   メニューをクリックしても移動しません。
   ================================================================ */


/* ################################################################
   【ブロック1】2026-07-26 追記分 ／ カードリスト（52件の表示・もっと見る）
   ※ここから194行、原本のまま
   ################################################################ */

/* ==== 受講者の声「詳細を確認する」カードリスト 2026-07-26追加 ====
   公差基礎LP（kousa_top）で作成したカード型デザインを移植したもの。
   見出しは既存の共通クラス.voice-txtを使い回す（lp_editor.cssと内容が完全一致するクラスのため、
   このクラス自体は追記不要）。.voice-detailのmargin-top/padding-topのみ、lp_editor.cssにも
   同名セレクタが古い値（70px/70px）で定義されており読み込み順で後勝ちすることがあるため、
   !importantでlp_seizu.css側を確実に勝たせている（kousa_top案件で確立した対処法、
   lp_editor.cssは他LP共通ファイルのため触らない）。
   数値はkousa_top案件で確定した値（余白50px/50px）をそのまま採用。 */
.voice-detail {
  width: 100%;
  background-color: #FFF;
  margin-top: 50px !important;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 50px !important;
}

@media screen and (max-width: 767px) {
  .voice-detail {
    margin-top: 30px !important;
  }
}

.detail-box {
  width: 80%;
  max-width: 900px;
  background-color: #D9D9D9;
  height: 776px;
  margin-bottom: 70px;
}

@media screen and (max-width: 767px) {
  .detail-box {
    width: calc(100% - 40px);
    height: auto;
    aspect-ratio: 340 / 221;
    margin-bottom: 30px;
  }
}

.detail-box.is-filled {
  background-color: transparent;
  height: auto;
}

@media screen and (max-width: 767px) {
  .detail-box.is-filled {
    height: auto;
    aspect-ratio: unset;
  }
}

.voice-card-list {
  display: flex;
  flex-direction: column;
  gap: 20px;
  position: relative;
}
@media screen and (min-width: 768px) {
  .voice-card-list {
    max-height: 776px;
    overflow-y: auto;
    padding-right: 10px;
    scrollbar-width: thin;
    scrollbar-color: #B9DDE8 transparent;
  }
  .voice-card-list::-webkit-scrollbar { width: 8px; }
  .voice-card-list::-webkit-scrollbar-track { background: transparent; }
  .voice-card-list::-webkit-scrollbar-thumb { background: #B9DDE8; border-radius: 4px; }
}

.voice-card-scroll-fade {
  position: absolute;
  left: 0;
  right: 10px;
  bottom: 0;
  height: 28px;
  background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.8));
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s ease;
}
.voice-card-list.is-scrollable .voice-card-scroll-fade { opacity: 1; }

.voice-card {
  background: #FFF;
  border: 1px solid #DCECF1;
  border-radius: 12px;
  box-shadow: 0 6px 20px rgba(23,50,77,0.08);
  padding: 32px;
  opacity: 0;
  transform: translateY(8px);
  animation: voiceCardFadeIn .4s ease forwards;
}
@media screen and (max-width: 767px) {
  .voice-card { padding: 16px; }
}
@keyframes voiceCardFadeIn {
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .voice-card { animation: none; opacity: 1; transform: none; }
}

.voice-card-no {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 13px;
  font-weight: 700;
  color: #1D8FB8;
  background: #E6F5FA;
  border-radius: 999px;
  padding: 6px 14px;
  margin-bottom: 12px;
}

.voice-card-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.5;
  color: #2D344B;
  margin: 0 0 8px;
}

.voice-card-attr {
  font-size: 13px;
  color: #4a6478;
  margin: 0 0 16px;
}

.voice-mail-wrap {
  position: relative;
  display: block;
  width: 100%;
  border: 1px solid #DCECF1;
  border-radius: 8px;
  overflow: hidden;
  background: #F7FBFC;
  padding: 10px 0 0;
}
.voice-mail-wrap img {
  display: block;
  width: 100%;
  height: auto;
}

.voice-card-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: 14px;
}
.voice-count {
  font-size: 12px;
  color: #5c7185;
}

.voice-detail-more-wrap {
  text-align: center;
  margin-top: 36px;
}
.voice-detail-remain {
  font-size: 13px;
  color: #4a6478;
  margin: 0 0 10px;
}
.voice-detail-more-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 58px;
  width: 100%;
  max-width: 360px;
  background: #E6F5FA;
  color: #17324D;
  border: 1px solid #B9DDE8;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: background .15s ease;
}
.voice-detail-more-btn:hover { background: #D8EFF7; }
.voice-detail-more-btn:disabled { opacity: .6; cursor: default; }
.voice-detail-more-btn svg { width: 16px; height: 16px; }
.voice-detail-done-msg {
  font-size: 14px;
  color: #4a6478;
  margin-top: 36px;
}

/* ################################################################
   【ブロック2】2026-07-27 追記分 ／ 刷新セクション（帯見出し・集計グラフ・代表の声）
   ※ここから109行、原本のまま（ヘッダーコメント1行のみ、結合に合わせて記述を更新）
   ################################################################ */

/* ================================================================
   お客様の声セクション刷新（案2）2026-07-27追加
   対象：seizu_top（機械製図超入門講座LP）
   ※このブロックは lp_seizu.css の「一番最後」に追記してください。
     新規クラスのみのため位置依存はありません。
   ※CSS変数(var(--navy)等)はモックアップ専用のため、実際の色値に展開済みです。
   ※.voice-comment は lp.css / lp_editor.css に既存定義があり競合するため、
     .vsec-comment にリネームしています（HTML側も同じ名前です）。
   ※カードリスト(.voice-card 等)のCSSは、この復旧ファイルでは上の【ブロック1】に含めています。
   ================================================================ */

  /* ---- 大見出し（既存 .lp-body h2 帯パターンに合わせる） ---- */
  /* 本文コンテナ(max-width:960px)の外まで帯を広げる。
     テーマ既存の .lp-body .faq h2 と同じ全幅化手法に合わせている */
  .sec-title{
    width:100vw; position:relative; left:50%; right:50%;
    background:#e8eaf4; color:#1f285f;
    text-align:center; font-weight:700; font-size:36px;
    padding:30px 20px 48px; margin:0 -50vw 40px;
  }
  .sec-title::before{
    content:""; display:block; width:52px; height:4px; background:#1f285f;
    border-radius:2px; margin:0 auto 20px;
  }
  @media screen and (max-width:767px){
    .sec-title{ font-size:24px; padding:30px 20px 48px; }
  }

  /* ---- セクション内の中見出し（同一セクション内での区切り。帯にはしない） ---- */
  .sub-heading{
    text-align:center; font-size:22px; font-weight:700; color:#1f285f;
    margin:64px 0 28px;
  }
  .sub-heading::before{
    content:""; display:block; width:36px; height:3px; background:#1f285f;
    border-radius:2px; margin:0 auto 14px; opacity:.6;
  }
  @media screen and (max-width:767px){ .sub-heading{ font-size:19px; margin:48px 0 22px; } }
  /* ---- 1. アンケート集計結果 ---- */
  .survey-card{
    display:flex; gap:40px; background:#fff; border:1px solid #DCECF1;
    border-radius:16px; box-shadow:0 10px 28px rgba(20,50,70,.06);
    padding:40px; margin-bottom:8px;
  }
  @media screen and (max-width:767px){ .survey-card{ flex-direction:column; gap:28px; padding:28px 20px; } }

  .survey-left{ flex:1; text-align:center; }
  .survey-eyebrow{ font-size:14px; color:#4a6478; margin-bottom:6px; }
  .survey-eyebrow::before{ content:"\FF3C"; color:#B9C3CE; margin-right:.4em; }
  .survey-eyebrow::after{ content:"\FF0F"; color:#B9C3CE; margin-left:.4em; }
  .survey-lead{ font-size:18px; font-weight:700; color:#1f285f; margin:6px 0 4px; }
  .survey-num{ font-size:64px; font-weight:800; color:#1f285f; line-height:1; }
  .survey-num span{ font-size:34px; }
  .survey-result{ font-size:20px; font-weight:700; margin:6px 0 14px; }
  .survey-result b{ color:#F28A2E; }
  .survey-note{ font-size:12px; color:#4a6478; line-height:1.9; }

  .survey-right{ flex:1.3; display:flex; flex-direction:column; justify-content:center; gap:14px; }
  .bar-row{ display:grid; grid-template-columns:128px 1fr 46px; align-items:center; gap:12px; }
  @media screen and (max-width:767px){ .bar-row{ grid-template-columns:100px 1fr 40px; gap:8px; } }
  .bar-label{ font-size:13px; color:#2D344B; }
  .bar-track{ background:#EEF2F6; border-radius:999px; height:14px; overflow:hidden; }
  .bar-fill{ height:100%; border-radius:999px; }
  .bar-pct{ font-size:14px; font-weight:700; text-align:right; }

  /* ---- 代表的な受講者の声 ---- */
  .voice-cards{ display:flex; flex-direction:column; gap:20px; }
  .voice-card2{
    display:flex; gap:20px; align-items:flex-start; background:#fff;
    border:1px solid #DCECF1; border-radius:14px;
    box-shadow:0 6px 20px rgba(23,50,77,.06); padding:28px;
  }
  @media screen and (max-width:600px){ .voice-card2{ flex-direction:column; align-items:center; text-align:center; padding:22px 18px; } }
  .avatar{ width:64px; height:64px; border-radius:50%; flex-shrink:0; object-fit:cover; background:#F0F4F8; }
  .voice-card2-body{ flex:1; }
  @media screen and (max-width:600px){ .voice-card2-body{ text-align:left; } }
  .voice-tag{
    display:inline-block; font-size:12px; font-weight:700; color:#1D8FB8;
    background:#E6F5FA; border:1px solid #BEE3EE; border-radius:999px;
    padding:4px 14px; margin-bottom:10px;
  }
  .vsec-comment{ font-size:17px; font-weight:700; color:#F28A2E; margin:0 0 10px; line-height:1.7; }
  .voice-attr2{ font-size:13px; color:#4a6478; }

  /* ---- アンケート原文 ---- */
  /* 見出し直後にある場合は見出し-サブテキスト間・サブテキスト-カード間を
     「受講者から寄せられた成果の声」見出し下の余白（sub-heading margin-bottom:28px）に揃える */
  .sub-heading + .raw-intro{ margin-top:-18px; }
  .raw-intro{ text-align:center; margin-bottom:28px; }
  .raw-intro p{ font-size:14px; color:#4a6478; margin:8px 0 0; }

/* 入れ子<section>によるpadding二重適用の打ち消し（テーマの section{padding:...} 対策）。
   あわせて、既存lp_seizu.cssの .voice-detail に付いている
   margin-top:50px !important / padding-top:50px !important（スマホは30px）も打ち消す。
   これは前回案件で単独セクションだった頃の余白指定で、見出し付きセクションの内側になった今は不要。
   !important が付いているため、こちらも !important で上書きする必要がある */
.voice-detail{
  width:100%; display:flex; flex-direction:column; align-items:center;
  margin-top:0 !important; padding:0 !important;
}
@media screen and (max-width:767px){
  .voice-detail{ margin-top:0 !important; }
}

/* グローバルメニュー「受講者の声」のジャンプ先の位置調整。
   テーマ共通の scroll-margin-top(PC:4.5vw≒64px)だけでは固定ヘッダー(実測81px)に
   帯の上部が隠れるため、この帯専用に余白を上乗せする。
   ※本文側に <div id="voice-anchor" class="c_anchor"></div> の設置が必要 */
#voice-anchor{ scroll-margin-top:100px; }

/* =============================================================
   SP：大見出しの改行位置の調整  2026-08-01
   -------------------------------------------------------------
   本文側に <br class="mobile-copy-break"> を入れて改行位置を指定したが、
   下記2つの見出しは指定位置で折り返しても2行目が入りきらず、
   さらに自動折り返しが発生して単語が途中で割れてしまう。
     ・.study-sec .section-title「あなたのペースで、無理なく学習できます」
        letter-spacing:4px が効いて「無理なく学習できます」(10文字)が
        290px必要。実際の内側幅は276px(375px幅)しかない。
     ・.reason-v2 .rs-title「初心者でも機械製図の基礎が身につく3つの理由」
        23pxで「基礎が身につく3つの理由」(12文字)が約284px必要。同上。
   そのため、この2つだけ字送り・文字サイズを詰める。
   PC幅（768px以上）の見た目は変更していない。
   ============================================================= */
@media screen and (max-width: 767px) {
  /* 字送り4px→約0.03emで258pxに収まる。文字サイズは25pxのまま維持 */
  .lp-body #seizu_nyumon .study-sec .section-title { letter-spacing: .03em; }
  /* 23px→21pxで259pxに収まる */
  #seizu_nyumon .reason-v2 .rs-title { font-size: 21px; }
}
@media screen and (max-width: 374px) {
  /* 320px幅は内側248pxまで狭まるため、さらに一段下げる */
  .lp-body #seizu_nyumon .study-sec .section-title { font-size: 22px; }
  #seizu_nyumon .reason-v2 .rs-title { font-size: 19px; }
}

/* =============================================================
   ハンバーガーメニューの背景抜け  2026-08-01（範囲修正 2026-08-02）
   -------------------------------------------------------------
   .p-header__list__bottom は position:absolute だが背景色の指定が無く、
   開くと本文（ファーストビューのコピー）が透けて文字が重なって読めない。
   閉じている間は display:none のため、常時この背景を当てても影響しない。
   色はヘッダー下段 .p-header__inner__bottom の #f6fcfe に合わせる。

   ★当初 max-width:767px に入れていたが、テーマのハンバーガー表示は
     max-width:950px まで続くため、iPad(768〜950px)で背景が出ていなかった。
     実測：ハンバーガーは950px以下で表示、951px以上は通常の横並びナビ。
     そのため 950px に合わせる。951px以上には一切影響しない。
   ※強度LP・即戦力LPは元から背景色が入っており（#f2fbf8 / #f6fcfe）、
     この不具合は製図LPのみ。
   ============================================================= */
@media screen and (max-width: 950px) {
  .p-header__list__bottom {
    background: #f6fcfe;
    border-bottom: 1px solid #d7e6ee;
    box-shadow: 0 10px 18px rgba(31, 40, 95, .14);
    z-index: 900;
  }
}

/* =============================================================
   SP最適化 第2弾  2026-08-01
   -------------------------------------------------------------
   320/375/390px の実測にもとづく修正。PC幅（768px以上）は一切変更なし。
   ============================================================= */
@media screen and (max-width: 767px) {

  /* ---- (2) 「このページのTOPへ」の重なり -----------------------
     実測 100×53px / bottom:75px / right:20px / z-index:auto。
     z-indexが無いため本文の上下関係が不定になり、幅も広く本文を隠していた。
     固定カート(.float_cart_sp は高さ55px・z-index:1000)の直下に収める。 */
  .lp-body #page-top {
    width: 84px; right: 12px; bottom: 78px;
    z-index: 999; opacity: .9;
  }

  /* ---- (3) 図面画像(drw1.png)が薄くて見えない ------------------
     元画像2004pxを234pxまで縮小しており、細線が飛んで白い枠に見えていた。
     ①枠いっぱいまで拡大（234→285px）②周囲に薄グレーを敷いて紙面を際立たせる
     ③コントラストを上げて線を復活させる、の3点で対処。 */
  .lp-body #seizu_nyumon .cl-center__img {
    background: #e9edf3; border-radius: 8px; padding: 10px;
  }
  .lp-body #seizu_nyumon .cl-center__img img {
    width: 100%; max-width: none; height: auto;
    background: #fff; border-radius: 4px;
    filter: contrast(1.45) brightness(.97);
  }

  /* ---- (4) 縦余白の圧縮 ----------------------------------------
     36px以上ある上下の余白のみ約7割へ。26px を下限とする。
     文字サイズ・行間・カード内部の余白は変更していない。
     ※ページ全体の高さ26,031px中の削減は約380px(1.5%)。
       これは余白の総量(上下paddingの合計5,665px)自体が全体の2割強しか
       無いためで、10〜15%の短縮は画像の縮小か内容の折りたたみが必要。 */
  .lp-body #seizu_nyumon .lp-cta-sec { padding-top: 31px; padding-bottom: 27px; }
  .lp-body #seizu_nyumon .biz-intro { margin-top: 26px; }
  .lp-body #seizu_nyumon .feature-sec .feature-container { padding-top: 26px; padding-bottom: 30px; }
  .lp-body #seizu_nyumon .feature-number { padding-top: 27px; padding-bottom: 27px; }
  .lp-body #seizu_nyumon .number-box { margin-bottom: 29px; }
  .lp-body #seizu_nyumon .worry { padding-top: 38px; padding-bottom: 27px; }
  .lp-body #seizu_nyumon .aftercourse { padding-bottom: 34px; }
  .lp-body #seizu_nyumon .reason3.reason-v2 { padding-top: 30px; padding-bottom: 33px; }
  .lp-body #seizu_nyumon .listen { padding-top: 38px; padding-bottom: 33px; }
  .lp-body #seizu_nyumon .listen-intro { margin-bottom: 30px; }
  .lp-body #seizu_nyumon .curriculum-accordion { padding-bottom: 27px; }
  .lp-body #seizu_nyumon .pace.study-sec { padding-top: 27px; padding-bottom: 27px; }
  .lp-body #seizu_nyumon .section-title { padding-bottom: 33px; }
  .lp-body #seizu_nyumon #price.price-v2 { padding-top: 30px; padding-bottom: 27px; }
  .lp-body #seizu_nyumon .moushikomi.apply-v2 { padding-top: 26px; padding-bottom: 31px; }
  .lp-body #seizu_nyumon #anc_tokuten { padding-top: 33px; padding-bottom: 30px; }
  .lp-body #seizu_nyumon .sec-title { padding-bottom: 33px; margin-bottom: 27px; }
  .lp-body #seizu_nyumon .sub-heading { margin-top: 33px; }
  .lp-body #seizu_nyumon .faq-cta { margin-top: 27px; margin-bottom: 41px; }
  .lp-body #seizu_nyumon .bottom-img { margin-top: 27px; }
  .lp-body #seizu_nyumon .lined { margin-top: 27px; }
}

/* ---- (5) 320px幅のヘッダー -------------------------------------
   ロゴの右に「eラーニング一覧」(110px)＋「法人・企業の方へ」(112px)が
   並び、320px幅では窮屈で可読性が落ちる。両リンクはハンバーガー内には
   無いが、フッターと下段ナビから到達できるため上段のみ隠す。
   あわせてハンバーガーのタップ領域を44px確保する（実測40×50px）。 */
@media screen and (max-width: 480px) {
  .p-header__inner .p-header__list { display: none; }
  .p-header__inner__bottom label { min-width: 44px; min-height: 44px; }
}

/* =============================================================
   操作ヒント(.cur-hint)を「すべて開く／すべて閉じる」と同じ行へ
   -------------------------------------------------------------
   「章または演習をクリックすると、詳しい内容が開きます。」は従来
   カリキュラム全体の最後（全11章を読み終えた後）に置かれており、
   操作方法を知りたいタイミングに存在しなかった。
   本文側で .curriculum-accordion__controls の先頭へ移動済み。
   PCは左にヒント・右にボタンの1行、SPは幅が足りないためヒントを
   上段に折り返してボタンを中央に置く（既存の justify-content:center を活かす）。
   ============================================================= */
.lp-body #seizu_nyumon .curriculum-accordion__controls {
  align-items: center; flex-wrap: wrap;
}
.lp-body #seizu_nyumon .curriculum-accordion__controls .cur-hint {
  flex: 1 1 auto; margin: 0 auto 0 0; text-align: left;
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .curriculum-accordion__controls .cur-hint {
    flex: 1 1 100%; margin: 0 0 10px; text-align: center;
  }
}

/* =============================================================
   スマホ固定バー(.float_cart_sp)に価格を表示する  2026-08-01
   -------------------------------------------------------------
   価格のspan自体はHTMLにもJSにも存在し、値も入っていたが、
   1091行の .float_cart_sp .buy { line-height:55px !important } により
   1行目「講座に申し込む」だけで55pxを消費し、<br>以降の価格が
   バーの外（画面下・y=781px）へ押し出されて見えなくなっていた。
   バー高55pxは変えずに、行送りを詰めて2行を収める。
   カートアイコンは position:absolute のままだと320px幅で価格と
   4px重なるため、flexアイテム化して gap で間隔を確保する。
   実測：320px / 390px とも全要素がバー内に収まり、重なりなし。
   ============================================================= */
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .float_cart_sp { display: block !important; text-align: center; }
  /* アイコンは320px幅で価格と重なるうえ、強度LPでは元から非表示・即戦力LPには
     そもそも存在しない。3講座で見た目を揃えるためスマホでは出さない */
  .lp-body #seizu_nyumon .float_cart_sp .fa-shopping-cart { display: none !important; }
  .lp-body #seizu_nyumon .float_cart_sp .buy {
    display: block !important; line-height: 1.3 !important;
    margin: 0 !important; padding: 7px 10px !important;
    text-align: center; box-sizing: border-box;
  }
  /* 本文の<br>は使わず .purchase をブロック化して改行する。
     <br>を残すと3行になりバー(55px)から溢れる */
  .lp-body #seizu_nyumon .float_cart_sp .buy br { display: none !important; }
  .lp-body #seizu_nyumon .float_cart_sp .purchase { display: block !important; font-size: 16px !important; line-height: 1.3 !important; }
  .lp-body #seizu_nyumon .float_cart_sp .price { display: inline !important; font-size: 13px !important; font-weight: 700; line-height: 1.3 !important; }
  .lp-body #seizu_nyumon .float_cart_sp .intax { display: inline !important; font-size: 11px !important; line-height: 1.3 !important; }
}

/* =============================================================
   料金カードの「円」を小さくする（.pv2-yen）  2026-08-01
   -------------------------------------------------------------
   従来はJSが「35,200円」と金額＋単位をまとめて .main へ書き込んでいたため、
   「円」まで48pxで表示され、数字と同じ大きさで目立ちすぎていた。
   即戦力LPは <span class="main">42,800</span><span>円</span> と分けて
   数字48px・円18pxにしているので、同じ構成に揃える。
   本文側で「円」を独立したspanに切り出し、JSは数字だけを書き込むよう変更済み。
   追従カートは従来どおり「35,200円」の一括表示のため、JSの対象から分離してある。
   ============================================================= */
.lp-body #seizu_nyumon .price-txt .pv2-yen {
  font-size: 18px; font-weight: 700; vertical-align: baseline;
}

/* =============================================================
   FAQ下・お問い合わせボタン上の案内文（.faq-txt-under）  2026-08-01
   -------------------------------------------------------------
   強度LPには以前から入っている案内文が、製図LPでは抜けていたため復活させる。
   このクラスの基底定義は lp_seizu.css には無く、テーマ側の指定を拾って
   PC20px・幅960pxいっぱいで表示されてしまうため、強度LPと同じ
   18px / 最大620px / 中央寄せ に揃える。
   スマホは #seizu_nyumon p 側の margin:0 に負けないよう、
   IDを含む詳細度で左右余白を指定し直す（強度LPと同じ対処）。
   ============================================================= */
.lp-body #seizu_nyumon .faq-txt-under {
  max-width: 620px; margin: 45px auto 24px;
  font-size: 18px; line-height: 2; letter-spacing: 2px;
  text-wrap: pretty; /* 末尾1文字の孤立を自動回避（Safari17.5+/Chrome） */
}
@media screen and (max-width: 767px) {
  .lp-body #seizu_nyumon .faq-txt-under {
    margin: 0 20px 30px; font-size: 16px; line-height: 1.7; letter-spacing: 1px;
  }
  /* 案内文とボタンがくっつくため間隔を確保 */
  .lp-body #seizu_nyumon .faq-cta { margin-top: 24px; }
}

/* ★ css/lp_seizu.css の「一番最後」に貼り付けてください。
     新しい変数を定義するだけなので、位置による影響はありません。

   ★ 何をするものか
     章見出しの「サンプル動画」バッジの色を、機械製図超入門講座の色にします。
     この6行が無いと、公差LPの色（#009999・青緑）で表示されます。

   ★ 色の根拠（2026-08-18実測）
     主アクセント #1F285F と薄帯 #E8EAF4 は、lp_seizu.css の .section-title
     （帯見出し）の color / background-color をそのまま使っています。
     残り4色は主アクセントから機械的に作った値です（参照データ/サンプル動画セクション/講座別カラー.md）。

   ★ 貼ったあとの確認
     lp_seizu.css を開いて --lp-accent を検索し、1件ヒットすればOKです。
*/

/* ---- ① 講座アクセント色（サンプル動画バッジで使用） ---- */
.lp-body {
  --lp-accent:      #1F285F;
  --lp-accent-dark: #19204C;
  --lp-accent-soft: #E8EAF4;
  --lp-accent-pale: #F4F4F7;
  --lp-accent-line: #D2D4DF;
  --lp-accent-mid:  #A5A9BF;
}

/* ---- ② バッジを章タイトルと同じ行に並べる ----
   ★ この2行目のブロックは seizu だけに必要です。

   理由（2026-08-18・本番ページで実測）
   他8講座は .curriculum-accordion__heading が flex になっているためバッジが
   章タイトルの右隣に並びますが、**seizu だけ block のまま**で、バッジが次の行に落ちます。
   その結果、章の行の高さが 84px → 110px に伸びて、動画のある3章だけ背が高くなります。
   このブロックを入れると同じ行に並び、行の高さは 84px のまま（他講座と同じ見た目）になります。

   ⚠️ セレクタから #seizu_nyumon を外さないでください。
      lp_seizu.css の既存ルールがid付きの詳細度で書かれているため、
      `.lp-body .curriculum-accordion__heading` では負けて効きません（実測ずみ）。 */
.lp-body #seizu_nyumon .curriculum-accordion__heading {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

