/* =====================================================================
   /houjin/apply/ 法人新規申込フォーム（確定モック houjin-apply-mock v7 準拠）
   クラスは hj- 接頭辞（サイト共通CSSと衝突させない）。PCは max-width 680 の1カラム。
   ===================================================================== */
.page-hj{
  --hj-navy:#12264F; --hj-ink:#1B2333; --hj-sub:#5A6478;
  --hj-line:#DDE2EC; --hj-paper:#F7F8FB; --hj-white:#FFFFFF;
  --hj-yellow:#FFDE59; --hj-red:#B51809; --hj-green:#1A7A3C;
  --hj-num:"Oswald","Barlow Condensed","Helvetica Neue",Arial,sans-serif;
  background:var(--hj-paper);
}
.page-hj [hidden]{display:none !important}
.hj-main{color:var(--hj-ink);font-family:"Noto Sans JP",-apple-system,"Hiragino Kaku Gothic ProN",sans-serif;font-size:15px;line-height:1.75;overflow-wrap:anywhere}
.hj-main *,.hj-main *::before,.hj-main *::after{box-sizing:border-box}
.hj-main a{color:inherit}

/* ヒーロー帯 */
.hj-hero{background:var(--hj-navy);color:#fff;text-align:center;padding:26px 20px 30px}
.hj-hero h1{margin:0;font-size:clamp(19px,3.4vw,24px);font-weight:900;letter-spacing:.03em;line-height:1.4;color:#fff}
.hj-hero p{margin:6px 0 0;font-size:12.5px;color:#C9D2E4}
.hj-hero p b{color:var(--hj-yellow)}

/* ステップインジケーター */
.hj-steps{max-width:680px;margin:-16px auto 0;padding-inline:16px;position:relative;z-index:2}
.hj-steps ol{list-style:none;margin:0;padding:0;display:flex;background:var(--hj-white);border:1px solid var(--hj-line);border-radius:12px;overflow:hidden;box-shadow:0 4px 14px rgba(18,38,79,.08)}
.hj-steps li{flex:1;min-width:0;text-align:center;padding:10px 2px 9px;font-size:10.5px;font-weight:700;color:#A6AFC2;position:relative;line-height:1.4}
.hj-steps li .n{display:block;font-family:var(--hj-num);font-size:16px;font-weight:600;line-height:1.1}
.hj-steps li.on{color:var(--hj-navy)}
.hj-steps li.on::after{content:"";position:absolute;left:14%;right:14%;bottom:0;height:3px;background:var(--hj-yellow);border-radius:3px 3px 0 0}
.hj-steps li.done{color:var(--hj-navy);opacity:.45}

/* カード */
.hj-wrap{max-width:680px;margin:22px auto 60px;padding-inline:16px}
.hj-card{background:var(--hj-white);border:1px solid var(--hj-line);border-radius:14px;padding:26px 22px 30px}
.hj-card--gap{margin-top:16px}
@media(min-width:700px){.hj-card{padding:34px 40px 40px}}
.hj-h{margin:0;color:var(--hj-navy);font-weight:900;font-size:18px;border-left:6px solid var(--hj-yellow);padding-left:12px;line-height:1.4}
.hj-hint{font-size:12.5px;color:var(--hj-sub);margin:10px 0 0}
.hj-hint--center{text-align:center}

/* 商品ボックス */
.hj-prod{border:1.5px solid var(--hj-line);border-radius:10px;margin-top:18px;overflow:hidden}
.hj-prod .pt{background:var(--hj-navy);color:#fff;font-weight:900;font-size:14px;padding:10px 16px}
.hj-prod .pb{padding:14px 16px;font-size:13.5px}
.hj-prod .pb ul{list-style:none;margin:4px 0 0;padding:0}
.hj-prod .pb li{padding-left:1.3em;position:relative;margin-top:3px}
.hj-prod .pb li::before{content:"✓";position:absolute;left:0;color:var(--hj-red);font-weight:900}
.hj-prod .pb .nt{font-size:11.5px;color:var(--hj-sub);margin:8px 0 0}

/* 料金ミニ表 */
.hj-ptbl{width:100%;border-collapse:collapse;margin-top:14px;font-size:13.5px}
.hj-ptbl th,.hj-ptbl td{border:1px solid var(--hj-line);padding:9px 12px;text-align:left}
.hj-ptbl th{background:var(--hj-paper);color:var(--hj-navy);font-size:12.5px;width:44%}
.hj-ptbl .amt{font-weight:900;color:var(--hj-navy);white-space:nowrap}
.hj-ptbl .amt small{font-weight:700;font-size:11px}
.hj-badge30{display:inline-block;background:var(--hj-red);color:#fff;font-weight:900;font-size:10.5px;border-radius:999px;padding:1px 10px;margin-left:6px;vertical-align:1px;white-space:nowrap}

/* 同意 */
.hj-eligi{background:#FDF1F0;border:1.5px solid #E8C2BE;border-radius:10px;padding:16px;margin-top:16px}
.hj-eligi .et{display:block;color:var(--hj-navy);font-size:14px;font-weight:900}
.hj-eligi p{font-size:12.5px;color:#4A5468;margin:10px 0 0;line-height:1.8}
.hj-terms{border:1.5px solid var(--hj-line);border-radius:10px;background:var(--hj-paper);height:220px;overflow-y:auto;padding:14px 16px;font-size:12px;color:var(--hj-sub);margin-top:26px}
.hj-terms b{color:var(--hj-ink)}
.hj-terms p{margin:10px 0 0}
.hj-terms a{color:var(--hj-red);text-decoration:underline}
.hj-agree{display:flex;gap:10px;align-items:flex-start;margin-top:14px;font-size:13.5px;font-weight:700;cursor:pointer}
.hj-agree input{flex:0 0 auto;width:20px;height:20px;margin:3px 0 0;accent-color:var(--hj-red)}
.hj-agree a{color:var(--hj-red);text-decoration:underline}
.hj-agree--terms{margin-top:26px}
.hj-agree--sm,.hj-fg > label.hj-agree--sm{display:flex;margin-top:8px;font-size:12.5px;color:var(--hj-ink)}
.hj-agree--sm input{width:18px;height:18px}

/* 入力欄 */
.hj-frm{margin-top:6px}
.hj-fg{margin-top:18px;min-width:0}
.hj-fg > label{display:block;font-weight:700;font-size:13.5px;color:var(--hj-navy)}
.hj-req,.hj-opt{display:inline-block;color:#fff;font-size:10px;font-weight:700;border-radius:4px;padding:0 6px;margin-left:6px;vertical-align:2px;line-height:1.7}
.hj-req{background:var(--hj-red)}
.hj-opt{background:#A6AFC2}
.hj-fg input[type=text],.hj-fg input[type=email],.hj-fg input[type=tel],.hj-fg select{display:block;width:100%;max-width:100%;margin-top:6px;border:1.5px solid var(--hj-line);border-radius:8px;padding:11px 12px;font-size:16px;background:var(--hj-white);font-family:inherit;color:var(--hj-ink)}
.hj-fg textarea{display:block;width:100%;max-width:100%;margin-top:6px;border:1.5px solid var(--hj-line);border-radius:8px;padding:11px 12px;font-size:16px;line-height:1.6;background:var(--hj-white);font-family:inherit;color:var(--hj-ink);resize:vertical;min-height:110px}
.hj-fg.is-error textarea{border-color:var(--hj-red);background:#FFF9F8}
.hj-fg textarea:focus{outline:2px solid var(--hj-navy);border-color:var(--hj-navy)}
.hj-cf__note{white-space:pre-wrap}
.hj-fg input:focus,.hj-fg select:focus{outline:2px solid var(--hj-navy);border-color:var(--hj-navy)}
.hj-fg input:disabled{background:#EEF1F6;color:#A6AFC2}
.hj-fg .ex{font-size:11.5px;color:var(--hj-sub);margin:3px 0 0}
.hj-fg.is-error input[type=text],.hj-fg.is-error input[type=email],.hj-fg.is-error input[type=tel],.hj-fg.is-error select{border-color:var(--hj-red);background:#FFF9F8}
.hj-ferr{color:var(--hj-red);font-size:12.5px;font-weight:700;margin:6px 0 0}
.hj-two{display:grid;grid-template-columns:minmax(0,1fr);gap:0 14px}
@media(min-width:700px){.hj-two{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}

/* 人数セレクタ+自動計算 */
.hj-calc{background:var(--hj-paper);border:1.5px solid var(--hj-line);border-radius:12px;padding:18px 16px;margin-top:20px}
.hj-calc.is-error{border-color:var(--hj-red)}
.hj-calc .ct{font-weight:900;color:var(--hj-navy);font-size:14px}
.hj-numrow{display:flex;align-items:center;gap:12px;margin-top:10px}
.hj-numrow button{width:44px;height:44px;border-radius:10px;border:2px solid var(--hj-navy);background:var(--hj-white);color:var(--hj-navy);font-size:22px;font-weight:900;cursor:pointer;line-height:1;padding:0;font-family:inherit}
.hj-numrow button:disabled{opacity:.3;cursor:default}
.hj-numrow .nv{font-family:var(--hj-num);font-size:30px;font-weight:600;color:var(--hj-navy);min-width:64px;text-align:center;line-height:1.3}
.hj-numrow .nv small{font-family:"Noto Sans JP",sans-serif;font-size:13px;font-weight:700}
.hj-calc dl{margin:14px 0 0;border-top:1px dashed #C7CEDD;padding-top:10px;font-size:13px}
.hj-calc dl div{display:flex;justify-content:space-between;gap:10px;padding:3px 0}
.hj-calc dt{color:var(--hj-sub)}
.hj-calc dd{margin:0;font-weight:700;color:var(--hj-ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.hj-calc .total{border-top:2px solid var(--hj-navy);margin-top:8px;padding-top:10px !important;align-items:baseline}
.hj-calc .total dt{color:var(--hj-navy);font-weight:900;font-size:14px}
.hj-calc .total dd{color:var(--hj-red);font-weight:900;font-size:22px;font-family:var(--hj-num)}
.hj-calc .total dd small{font-size:11px;font-family:"Noto Sans JP",sans-serif}
.hj-calc .zei{font-size:11px;color:var(--hj-sub);text-align:right;margin:2px 0 0}

/* 受講者ブロック */
.hj-member{border:1.5px solid var(--hj-line);border-left:5px solid var(--hj-navy);border-radius:10px;padding:14px 16px 18px;margin-top:16px;background:var(--hj-white)}
.hj-member .mt{font-weight:900;color:var(--hj-navy);font-size:13.5px}
.hj-member .mt .tag{display:inline-block;background:var(--hj-yellow);color:var(--hj-navy);font-size:10.5px;border-radius:999px;padding:1px 10px;margin-left:8px}
.hj-later{display:flex;gap:10px;align-items:flex-start;margin-top:16px;background:#FFF6D6;border:1.5px solid #E7C652;border-radius:10px;padding:13px 14px;font-size:13px;font-weight:700;cursor:pointer}
.hj-later input{flex:0 0 auto;width:19px;height:19px;margin:3px 0 0;accent-color:var(--hj-navy)}
.hj-later small{display:block;font-weight:500;font-size:11.5px;color:var(--hj-sub);margin-top:3px}

/* 確認テーブル */
.hj-cf{width:100%;border-collapse:collapse;margin-top:16px;font-size:13.5px;table-layout:fixed}
.hj-cf th,.hj-cf td{border:1px solid var(--hj-line);padding:10px 12px;text-align:left;vertical-align:top}
.hj-cf th{background:var(--hj-paper);color:var(--hj-navy);font-size:12.5px;width:38%}
.hj-cf td{overflow-wrap:anywhere}
.hj-cf td b.red{color:var(--hj-red)}
.hj-cf__sub{display:block;font-size:12px;color:var(--hj-sub)}
.hj-cf__sub:empty{display:none}
.hj-cf__calc{color:var(--hj-sub)}
.hj-edit{display:inline-block;background:none;border:none;padding:0;font-family:inherit;font-size:11px;color:var(--hj-red);text-decoration:underline;cursor:pointer;white-space:nowrap}
@media(min-width:700px){.hj-cf th{white-space:nowrap}}

/* 支払方法 */
.hj-pay{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:16px}
@media(min-width:700px){.hj-pay{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.hj-pay label{display:block;border:2px solid var(--hj-line);border-radius:12px;padding:16px;cursor:pointer;background:var(--hj-white);position:relative}
.hj-pay label.sel{border-color:var(--hj-red);background:#FFF9F8}
.hj-pay input{position:absolute;opacity:0;width:1px;height:1px}
.hj-pay label:focus-within{outline:2px solid var(--hj-navy);outline-offset:2px}
.hj-pay b{display:block;color:var(--hj-navy);font-size:15px}
.hj-pay b::before{content:"";display:inline-block;width:16px;height:16px;border:2px solid #B8C0D0;border-radius:50%;margin-right:8px;vertical-align:-2px;box-sizing:border-box}
.hj-pay label.sel b::before{border-color:var(--hj-red);background:radial-gradient(circle,var(--hj-red) 0 4px,#fff 5px)}
.hj-pay p{font-size:12px;color:var(--hj-sub);margin:6px 0 0;line-height:1.6}
.hj-pay .pm{font-size:11px}

/* ボタン */
.hj-btns{display:flex;flex-direction:column;gap:12px;align-items:center;margin-top:28px}
.hj-btn{display:inline-block;border:none;cursor:pointer;border-radius:999px;font-weight:900;font-size:15.5px;padding:15px 20px;width:100%;max-width:360px;text-align:center;font-family:inherit;line-height:1.5;text-decoration:none}
.hj-btn-red{background:var(--hj-red);color:#fff;box-shadow:0 4px 10px rgba(181,24,9,.3)}
.hj-btn-navy{background:var(--hj-navy);color:#fff}
.hj-btn[disabled],.hj-btn[aria-disabled=true]{background:#C7CEDD;box-shadow:none;cursor:default}
.hj-btn-back{background:none;border:none;color:var(--hj-sub);font-size:13px;font-weight:700;text-decoration:underline;cursor:pointer;font-family:inherit;padding:4px}
/* PAY.JP checkout のボタン（ライブラリが生成）をモックの赤ボタンに揃える */
.hj-paybtn{width:100%;max-width:360px;text-align:center}
.hj-paybtn #payjp_checkout_box{width:100%}
.hj-paybtn #payjp_checkout_box input[type=button],.hj-paybtn #payjp_checkout_box button{display:block;width:100% !important;height:auto !important;border:none !important;border-radius:999px !important;background:var(--hj-red) !important;background-image:none !important;color:#fff !important;font-weight:900 !important;font-size:15.5px !important;padding:15px 20px !important;box-shadow:0 4px 10px rgba(181,24,9,.3) !important;cursor:pointer;font-family:inherit !important;line-height:1.5 !important;text-shadow:none !important}

/* メッセージ */
.hj-alert{background:#FDF1F0;border:1.5px solid #E8C2BE;color:var(--hj-red);font-weight:700;font-size:13.5px;border-radius:10px;padding:12px 16px;margin:0 0 16px;width:100%}
.hj-btns .hj-alert{margin:0;max-width:360px;text-align:center}

/* 完了 */
.hj-done__ico{width:72px;height:72px;border-radius:50%;background:var(--hj-green);color:#fff;font-size:38px;font-weight:900;display:flex;align-items:center;justify-content:center;margin:6px auto 0}
.hj-done__ico.is-bank{background:var(--hj-navy)}
.hj-done__t{text-align:center;font-size:19px;font-weight:900;color:var(--hj-navy);margin:14px 0 0;line-height:1.5}
.hj-done__p{font-size:13.5px;margin:14px 0 0}
.hj-done__p a{color:var(--hj-red);text-decoration:underline;font-weight:700}
.hj-idbox{background:var(--hj-paper);border:1.5px solid var(--hj-line);border-radius:10px;text-align:center;padding:14px;margin-top:16px}
.hj-idbox .l{font-size:11.5px;color:var(--hj-sub);font-weight:700}
.hj-idbox .v{font-family:var(--hj-num);font-size:26px;font-weight:600;color:var(--hj-navy);letter-spacing:.04em}
.hj-next{border:1.5px solid var(--hj-line);border-left:5px solid var(--hj-yellow);border-radius:10px;padding:14px 16px;margin-top:14px;font-size:13px}
.hj-next b{color:var(--hj-navy)}
.hj-next ol{margin:6px 0 0 1.4em;padding:0}
.hj-next li{margin-top:4px}