@charset "UTF-8";
/* =====================================================================
   sitev2/css/houjin.css ── /houjin/（法人・団体の方：法人特別プラン）
   Figma 法人 PC 1858:2 / SP 1858:68 準拠。SP は 640px 以下（SP幅393基準：左右20px・本文幅353）
   ===================================================================== */
.page-houjin{--maxw:894px}
.page-houjin header.site,.page-houjin footer.site{--maxw:1080px}
.page-houjin main{--g:28px}
.pc-only{display:inline}
.sp-only{display:none}

/* セクション共通 */
.page-houjin section{padding-block:52px}
.bg-sec{background:var(--paper)}
.navy-sec{background:var(--navy);color:#fff}
.page-houjin h2{display:flex;align-items:center;gap:14px;color:var(--navy);font-weight:900;font-size:25px;line-height:1.4}
.page-houjin h2::before{content:"";flex:0 0 auto;width:6px;height:30px;background:var(--yellow)}
.navy-sec h2{color:#fff}
.sec-lead{margin-top:12px;font-size:14.5px;line-height:1.7}
.sec-lead strong{font-weight:700}
.sec-sub{margin-top:10px;font-size:15.5px;font-weight:500;line-height:1.6;color:var(--navy)}
.box760{max-width:800px;margin:0 auto;padding-inline:20px}
.inner + .box760,.inner + .box-merit{margin-top:var(--g)}
.box760 > * + *{margin-top:var(--g)}

/* ボタン（ピル型） */
.pbtn{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;font-weight:900;font-size:14.5px;line-height:1.4;padding:13px 36px;white-space:nowrap}
.pbtn.red{background:var(--red);color:#fff;box-shadow:0 4px 4px rgba(0,0,0,.25)}
.pbtn.line{background:var(--white);color:var(--navy);border:2px solid var(--navy)}
.pbtn.yel{background:var(--yellow);color:var(--navy);box-shadow:0 4px 4px rgba(0,0,0,.25)}
.pbtn:hover{opacity:.88}

/* ヒーロー */
.hero{background:var(--navy);color:#fff;padding-block:46px;text-align:center}
.hero .inner{display:flex;flex-direction:column;align-items:center;gap:12px}
.hero .bc{font-size:11.5px;line-height:1.5;color:#9FB0CC}
.hero .bc a:hover{text-decoration:underline}
.hero h1{font-size:34px;font-weight:900;line-height:1.4;letter-spacing:1.02px}
.hero .lead{font-size:16px;line-height:1.85;color:#C9D2E4}
.hero .lead strong{font-weight:700;color:#fff}

/* 目次 */
.toc{background:var(--paper);padding:22px 20px}
.toc ul{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;list-style:none;max-width:1080px;margin:0 auto;font-size:13px;font-weight:700;line-height:1.4}
.toc a{display:block;color:var(--navy);border-bottom:2px solid var(--yellow);padding-bottom:2px}
/* 目次末尾の「お申込み」（黄色ピル・赤文字）→ /houjin/apply/ */
.toc li.apply a{background:var(--yellow);color:var(--red);font-weight:900;border-bottom:0;border-radius:999px;padding:2px 14px}

/* 1. 比較表 */
.cmp{width:718px;max-width:100%;margin-inline:auto;border-collapse:collapse;table-layout:fixed}
.cmp col.c1{width:280px}
.cmp th,.cmp td{border:1px solid var(--line);padding:10px 14px;font-size:13px;line-height:1.5;text-align:center;vertical-align:middle}
.cmp thead th{background:var(--navy);color:#fff;font-weight:700}
.cmp thead th.plan{background:var(--red)}
.cmp tbody th{background:var(--paper);color:var(--navy);font-weight:700;text-align:left}
.cmp td{background:var(--white)}
.cmp td.plan{background:#FFF6D6}
.mk{font-size:17px;font-weight:900;line-height:1.4;color:var(--red)}
.na{font-size:14px;font-weight:900;line-height:1.4;color:#B8C0D0}
.ck{font-size:14px;font-weight:900;line-height:1.3;color:#333}
.cmp td.use{font-size:13.5px}
.cmp td.use.b{font-weight:700}

/* 講座説明 */
.kouza{background:var(--paper);border-radius:12px;padding:24px 26px;display:flex;flex-direction:column;gap:10px}
.kouza .tt{font-size:16px;font-weight:900;line-height:1.5;color:var(--navy)}
.kouza p{font-size:14px;line-height:1.8}

/* 使い分け2分岐 */
.fork{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.fk{position:relative;border:1.5px solid var(--line);border-radius:10px;overflow:hidden;padding:21px 18px 18px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;background:var(--white)}
.fk::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;background:var(--navy)}
.fk.plan::before{background:var(--red)}
.fk .who{font-size:12px;font-weight:900;line-height:1.5;color:var(--sub)}
.fk .nm{font-size:15px;font-weight:900;line-height:1.5;color:var(--navy)}
.fk .ds{font-size:12.5px;line-height:1.7;color:var(--sub)}
.fk .go{font-size:13px;font-weight:900;line-height:1.5;color:var(--red);text-decoration:underline}
.fk .here{background:var(--yellow);border-radius:999px;padding:3px 14px;font-size:12px;font-weight:900;line-height:1.5;color:var(--navy)}
.note1{font-size:12.5px;line-height:1.7;color:var(--sub)}
.note1 a{font-weight:700;text-decoration:underline}

/* 練習問題 */
.practice{display:flex;flex-direction:column;align-items:center;gap:12px}
.practice .pt{font-size:14.5px;font-weight:900;line-height:1.5}
.practice .btns{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:14px}

/* 2. スペック表 */
.page-houjin main #overview{--g:18px}
.spec{width:100%;border-collapse:collapse;table-layout:fixed}
.spec th,.spec td{border:1px solid var(--line);padding:12px 16px;vertical-align:top;text-align:left}
.spec th{width:160px;padding-right:8px;background:var(--paper);color:var(--navy);font-size:13px;font-weight:700;line-height:1.6}
.spec td{background:var(--white);font-size:14px;line-height:1.7}
.spec td .sub{margin-top:4px;font-size:12px;line-height:1.6;color:var(--sub)}

/* 2b. カリキュラム */
.page-houjin main #curriculum{--g:26px}
#curriculum .box760{max-width:894px}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding-inline:3px}
.st .chip{background:var(--navy);color:#fff;border-radius:3px;padding:7px 0;text-align:center;font-size:14px;font-weight:900;line-height:1.4}
.st p:not(.chip){margin-top:8px;font-size:12px;line-height:1.65;color:var(--sub)}
.curwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.cur{width:854px;min-width:854px;border-collapse:collapse;table-layout:fixed}
.cur col.f,.cur col.q{width:109px}
.cur col.k{width:117px}
.cur col.c{width:167px}
.cur th,.cur td{border:1px solid var(--line);padding:9px 8px;text-align:center;vertical-align:middle;background:var(--white)}
.cur thead th{background:var(--navy);color:#fff;font-size:12px;font-weight:700;line-height:1.4;white-space:nowrap}
.cur tbody th{background:#FFF6D6;color:var(--navy);font-size:12.5px;font-weight:700;line-height:1.45}
.cur .mk{font-size:16px;line-height:1.3}
/* 浴室の基礎編セル（Figma 法人PC 1869:90）: ○ の下に「前編/後編の2本」 */
.cur .bn{display:block;margin-top:3px;font-size:10px;font-weight:700;line-height:1.2;color:var(--sub)}
.cur .na{font-size:13px;line-height:1.3}
.cur td.cl{font-size:11.5px;font-weight:900;line-height:1.45;color:var(--navy)}
.cur td.kyuto .t{font-size:12.5px;font-weight:700;line-height:1.5}
.cur td.kyuto .s{margin-top:2px;font-size:11px;line-height:1.45;color:var(--sub)}
.box760 > .fcards + .cur-note{margin-top:12px}
/* SP用 分野カード（PCでは非表示） */
.fcards{display:none;list-style:none;flex-direction:column;gap:10px}
.fcards li{position:relative;background:var(--white);border:1.5px solid var(--line);border-radius:10px;overflow:hidden;padding:12px 14px 12px 19px;display:flex;flex-direction:column;gap:8px}
.fcards li::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--yellow)}
.fcards .fh{display:flex;align-items:baseline;gap:4px;line-height:1.4;white-space:nowrap}
.fcards .fh .nm{font-size:14px;font-weight:900;color:var(--navy)}
.fcards .fh .ct{font-size:11px;font-weight:700;color:var(--sub)}
.fcards .chips{display:flex;flex-wrap:wrap;gap:6px}
.fcards .cp{background:var(--navy);color:#fff;border-radius:999px;padding:3px 11px;font-size:11px;font-weight:700;line-height:1.4;white-space:nowrap}
.fcards .cp.y{background:#FFF6D6;color:var(--navy);border:1px solid #E8D48A}
.fcards .fn{font-size:11px;line-height:1.6;color:var(--sub)}
.cur-note{font-size:12px;line-height:1.6;color:var(--sub);text-align:center}
.movie{text-align:center}
.movie .pbtn{min-width:203px}

/* 3. 料金表 */
.page-houjin main #price{--g:23px}
.price{width:720px;max-width:100%;margin-inline:auto;border-collapse:collapse;table-layout:fixed}
.price col.l{width:331px}
.price th,.price td{border:1px solid var(--line);padding:14px 16px;text-align:left;vertical-align:middle}
.price th{background:#B8C0D0;color:var(--navy);font-size:13.5px;font-weight:700;line-height:1.5}
.price tr.first th{background:var(--navy);color:#fff}
.price th .lb{vertical-align:middle}
.price .badge{display:inline-block;vertical-align:middle;margin-left:8px;background:var(--red);color:#fff;border-radius:999px;padding:2px 12px;font-size:11.5px;font-weight:900;line-height:1.5}
.price td{background:var(--white);color:var(--navy)}
.price .num,.price .tx{white-space:nowrap}
.price tr.first td{background:#FFF6D6}
.price .num{font-family:var(--numfont);font-weight:500;font-size:30px;line-height:1.1;letter-spacing:.3px}
.price .yen{margin-left:2px;font-size:15px;font-weight:900;line-height:1.4}
.price .tx{margin-left:2px;font-size:12px;font-weight:700;line-height:1.4}
/* 税込を小さく併記（税別の下に1行） */
.price .inc{display:block;margin-top:2px;font-size:11.5px;font-weight:700;line-height:1.4;color:var(--sub);white-space:nowrap}
.price + .notes{margin-top:26px}
.notes p{font-size:12px;line-height:1.65;color:var(--sub)}
.notes p + p{margin-top:2px}

/* 4. 導入メリット */
.page-houjin main #merit{--g:30px}
.box-merit{max-width:960px;margin:0 auto;padding-inline:20px}
.merits{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.mc{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:22px 18px;display:flex;flex-direction:column;gap:10px}
.mc .tt{font-size:16px;font-weight:900;line-height:1.5;text-align:center}
.mc .tx{font-size:13px;line-height:1.75;color:#DDE4F2}
.mc .pic{margin-top:auto;height:140px;border-radius:8px;overflow:hidden;background:#fff}
.mc .pic img{display:block;width:100%;height:100%;object-fit:cover}
.merit-note{margin-top:27px;text-align:center}
.merit-note p{font-size:12.5px;line-height:1.65;color:#C9D2E4}

/* 5. お申込みの流れ（STEPバッジはカード上辺にはみ出す＝カードは overflow を切らない） */
.flow{list-style:none;display:flex;flex-direction:column;gap:24px}
.flow li{position:relative;overflow:visible;background:var(--white);border:1.5px solid var(--line);border-radius:10px;padding:22px 20px 18px;display:flex;flex-direction:column;gap:6px}
.flow .badge{position:absolute;left:14.5px;top:-13.5px;background:var(--navy);color:var(--yellow);border-radius:999px;padding:2px 14px;font-family:var(--numfont);font-weight:500;font-size:13px;line-height:1.5;letter-spacing:.78px;white-space:nowrap}
.flow .tt{font-size:15.5px;font-weight:900;line-height:1.5;color:var(--navy)}
.flow .tx{font-size:13.5px;line-height:1.75}
.flow .tx a{font-weight:700;color:var(--red);text-decoration:underline}
.flow .nt{font-size:11.5px;line-height:1.65;color:var(--sub)}

/* 6. 実施要項 */
.page-houjin main #outline{--g:26px}
.yoko{border:2px solid var(--navy);border-radius:12px;overflow:hidden;background:var(--white)}
.yk{padding:20px 24px;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.yk + .yk{border-top:1px solid var(--line)}
.yk .chip{background:var(--navy);color:var(--yellow);border-radius:6px;padding:2px 12px;font-size:13px;font-weight:900;line-height:1.5}
.yk .tx{font-size:14px;line-height:1.7}
.yk .li{list-style:none;font-size:13.5px;line-height:1.75}
.yk .li.sm{font-size:12.5px}
.yk .period{font-size:16px;font-weight:900;line-height:1.6;color:var(--navy)}
.yk .nt{font-size:12px;line-height:1.65;color:var(--sub)}

/* 7. 申込CTA */
.cta .inner{display:flex;flex-direction:column;align-items:center;gap:18px;text-align:center}
.cta .ct{font-size:18px;font-weight:900;line-height:1.5}
.cta .btns{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:16px}
.cta .pbtn{width:290px}
.cta .ask{font-size:13px;line-height:1.6;color:#C9D2E4}
.cta .ask a{font-weight:700;color:#fff;text-decoration:underline}

/* PC幅が狭いとき（タブレット） */
@media(max-width:900px){
  .merits{grid-template-columns:1fr;max-width:480px;margin-inline:auto}
}

/* ===== SP（Figma 1858:68 / 393幅） ===== */
@media(max-width:640px){
  .pc-only{display:none}
  .sp-only{display:inline}
  .spbr{display:inline}
  .page-houjin section{padding-block:40px}
  .page-houjin main{--g:24px}
  .page-houjin h2{gap:12px;font-size:20px}
  .page-houjin h2::before{width:5px;height:26px}
  #merit h2{line-height:1.5}
  #flow h2,#outline h2{font-size:19px;line-height:1.45}
  .sec-lead{margin-top:10px;font-size:13.5px;line-height:1.8}
  .sec-sub{margin-top:8px;font-size:13.5px}
  .pbtn{font-size:13.5px;padding:12px 28px;width:280px;max-width:100%}

  .hero{padding-block:38px}
  .hero h1{font-size:25px;letter-spacing:.75px}
  .hero .lead{font-size:13.5px}

  .cmp{width:100%}
  .cmp col.c1{width:41%}
  .cmp th,.cmp td{padding:8px;font-size:11.5px}
  .cmp thead th.plan{line-height:1.4}
  .mk{font-size:15px}
  .na{font-size:13px}
  .cmp td.use{font-size:11px;line-height:1.5}

  .kouza{padding:18px;gap:8px}
  .kouza .tt{font-size:15px;line-height:1.55}
  .kouza p{font-size:13px}

  .fork{grid-template-columns:1fr;gap:14px}
  .fk{padding:19px 16px 16px;gap:5px}
  .fk .who{font-size:11.5px}
  .fk .nm{font-size:14.5px}
  .fk .ds{font-size:12px}
  .fk .go{font-size:12.5px}
  .fk .here{font-size:11.5px}
  .note1{font-size:11.5px}
  .practice .pt{font-size:13.5px}
  .practice .btns{flex-direction:column;align-items:center;gap:10px}

  .page-houjin main #overview{--g:22px}
  .spec th,.spec td{padding:10px}
  .spec th{width:108px;padding-right:10px;font-size:11.5px}
  .spec td{font-size:12.5px}
  .spec td .sub{margin-top:3px;font-size:11px}

  .page-houjin main #curriculum{--g:22px}
  .steps4{grid-template-columns:1fr 1fr;gap:14px 12px;padding-inline:0}
  .st .chip{font-size:13px}
  .st p:not(.chip){font-size:11.5px}
  .curwrap{display:none}
  .fcards{display:flex}
  .cur-note{font-size:11.5px}
  .movie .pbtn{min-width:0}

  .page-houjin main #price{--g:22px}
  .price{width:100%}
  .price col.l{width:158px}
  .price th,.price td{padding:12px}
  .price th{font-size:12.5px}
  .price th .lb{display:block}
  .price .badge{margin:5px 0 0;font-size:11px}
  .price .num{font-size:25px;letter-spacing:.25px}
  .price .yen{font-size:13.5px}
  .price .tx{font-size:10.5px}
  .price .inc{font-size:10.5px}
  .price + .notes{margin-top:22px}
  .notes p{font-size:11px}
  .notes p + p{margin-top:3px}

  .merits{gap:14px;max-width:none}
  .mc{padding:20px 16px}
  .mc .tt{font-size:15.5px}
  .mc .tx{font-size:12.5px}
  .mc .pic{height:120px}
  .merit-note{margin-top:24px}
  .merit-note p{font-size:11.5px;line-height:1.7}

  .page-houjin main #flow{--g:26px}
  .flow{gap:22px}
  .flow li{padding:20px 16px 16px;gap:5px}
  .flow .badge{left:12.5px;top:-12.5px;padding:2px 12px;font-size:12px;letter-spacing:.72px}
  .flow .tt{font-size:14.5px}
  .flow .tx{font-size:12.5px}
  .flow .nt{font-size:11px}

  .page-houjin main #outline{--g:22px}
  .yk{padding:16px;gap:5px}
  .yk .chip{font-size:12px}
  .yk .tx{font-size:12.5px}
  .yk .li{font-size:12px}
  .yk .li.sm{font-size:11.5px}
  .yk .period{font-size:14.5px}
  .yk .nt{font-size:11px}

  .cta .inner{gap:16px}
  .cta .ct{font-size:16px;line-height:1.55}
  .cta .btns{flex-direction:column;align-items:center;gap:12px}
  .cta .pbtn{width:300px}
  .cta .ask{font-size:12.5px;line-height:1.7}
}