@charset "utf-8";
/* monap form pages — shared styles */
:root{ --bass:#c05050; --dark:#0d0d0d; --cream:#f4eee8; --ink:#1a1414; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:'Noto Sans JP', sans-serif; color:var(--ink); background:var(--cream); }
a{ color:inherit; }

/* ---- sticky sub-header ---- */
.subhead{ position:sticky; top:0; z-index:20; background:rgba(13,13,13,0.96); backdrop-filter:blur(8px); border-bottom:1px solid #000; }
.subhead .inner{ max-width:1040px; margin:0 auto; height:64px; display:flex; align-items:center; justify-content:space-between; padding:0 24px; }
.subhead img{ height:28px; width:auto; filter:brightness(0) invert(1); display:block; }
.subhead .back{ color:rgba(255,255,255,0.8); font-size:13px; font-weight:600; text-decoration:none; display:inline-flex; gap:7px; align-items:center; }
.subhead .back:hover{ color:#fff; }

/* ---- page intro ---- */
.formwrap{ padding:56px 24px 96px; }
.intro{ max-width:1040px; margin:0 auto 36px; }
.intro .eyebrow{ display:inline-flex; align-items:center; gap:9px; font-size:12px; font-weight:700; letter-spacing:0.16em; color:var(--bass); margin-bottom:16px; }
.intro .eyebrow .dot{ width:7px; height:7px; border-radius:99px; background:var(--bass); }
.intro h1{ font-size:36px; font-weight:900; line-height:1.32; letter-spacing:-0.01em; margin:0; }
.intro p{ font-size:15.5px; line-height:1.9; color:#5c4f4f; margin:16px 0 0; max-width:640px; }
.intro .badge{ display:inline-flex; align-items:center; gap:9px; margin-top:20px; font-size:13px; font-weight:700; color:#3a8a4d; background:#eaf6ec; border:1px solid #cfe9d4; padding:9px 16px; border-radius:99px; }

/* ---- layout ---- */
.formgrid{ max-width:1040px; margin:0 auto; display:grid; grid-template-columns:1.35fr .85fr; gap:38px; align-items:start; }
.formcard{ background:#fff; border:1px solid #e7ddd4; border-radius:20px; padding:40px; box-shadow:0 30px 60px -38px rgba(60,30,30,0.45); }

/* ---- fields ---- */
.field{ margin-bottom:22px; }
.field:last-of-type{ margin-bottom:0; }
.field > label{ display:block; font-size:13.5px; font-weight:700; margin-bottom:9px; color:var(--ink); }
.field .req{ color:var(--bass); margin-left:7px; font-size:11px; font-weight:800; }
.field .opt{ color:#a99c95; margin-left:7px; font-size:11px; font-weight:600; }
.field input, .field select, .field textarea{
  width:100%; padding:14px 16px; border:1.5px solid #e3d8cf; border-radius:10px;
  font-size:15px; font-family:inherit; background:#fcfaf8; color:var(--ink); transition:border-color .2s, box-shadow .2s;
}
.field textarea{ min-height:120px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--bass); box-shadow:0 0 0 3px rgba(192,80,80,0.12); }
.field input.invalid, .field select.invalid{ border-color:var(--bass); background:#fdf3f3; }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }

/* radio group */
.radios{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.radios label{
  display:flex; align-items:center; gap:10px; padding:13px 16px; border:1.5px solid #e3d8cf; border-radius:10px;
  font-size:14px; font-weight:600; cursor:pointer; background:#fcfaf8; transition:all .2s;
}
.radios label:hover{ border-color:#d6b3b3; }
.radios input{ width:18px; height:18px; accent-color:var(--bass); margin:0; flex-shrink:0; }
.radios label:has(input:checked){ border-color:var(--bass); background:#fbeef0; color:var(--bass); }

/* consent */
.consent{ display:flex; align-items:flex-start; gap:11px; margin:26px 0 24px; font-size:13.5px; line-height:1.6; color:#5c4f4f; }
.consent input{ width:19px; height:19px; accent-color:var(--bass); margin-top:1px; flex-shrink:0; }
.consent a{ color:var(--bass); text-decoration:underline; text-underline-offset:2px; }

/* submit */
.submit{ width:100%; border:none; cursor:pointer; background:var(--bass); color:#fff; font-weight:800; font-size:16.5px; font-family:inherit; padding:19px; border-radius:12px; box-shadow:0 14px 30px -10px rgba(192,80,80,0.6); transition:transform .2s, box-shadow .2s, opacity .2s; }
.submit:hover{ transform:translateY(-2px); }
.submit .arw{ margin-left:8px; }
.formnote{ text-align:center; font-size:12px; color:#a99c95; margin:16px 0 0; }

/* ---- aside ---- */
.aside{ position:sticky; top:88px; display:flex; flex-direction:column; gap:18px; }
.panel{ background:#fff; border:1px solid #e7ddd4; border-radius:18px; padding:28px 26px; }
.panel.dark{ background:var(--dark); color:#fff; border-color:#000; position:relative; overflow:hidden; }
.panel.dark::before{ content:""; position:absolute; inset:0; background:radial-gradient(90% 120% at 90% 0%, rgba(192,80,80,0.28), transparent 60%); }
.panel h3{ font-size:15px; font-weight:900; margin:0 0 18px; position:relative; }
.panel .plist{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:15px; position:relative; }
.panel .plist li{ display:flex; gap:12px; font-size:14px; line-height:1.65; align-items:flex-start; }
.panel.dark .plist li{ color:rgba(255,255,255,0.85); }
.panel .plist .ck{ flex-shrink:0; width:22px; height:22px; border-radius:99px; background:var(--bass); display:flex; align-items:center; justify-content:center; margin-top:1px; }
.panel .stat{ position:relative; display:flex; align-items:baseline; gap:8px; }
.panel .stat .big{ font-size:34px; font-weight:900; letter-spacing:-0.02em; }
.panel .stat .lbl{ font-size:13px; color:rgba(255,255,255,0.6); }
.panel .substat{ position:relative; font-size:12.5px; color:rgba(255,255,255,0.55); margin:10px 0 0; line-height:1.7; }

/* ---- thank you ---- */
.thanks{ min-height:calc(100vh - 64px); display:flex; align-items:center; justify-content:center; padding:60px 24px 90px; }
.thankscard{ max-width:600px; width:100%; background:#fff; border:1px solid #e7ddd4; border-radius:24px; padding:56px 48px 50px; text-align:center; box-shadow:0 36px 70px -40px rgba(60,30,30,0.45); }
.thankscard .check{ width:78px; height:78px; border-radius:99px; background:#eaf6ec; display:flex; align-items:center; justify-content:center; margin:0 auto 28px; }
.thankscard .check.r{ background:#fbeaea; }
.thankscard .eyebrow{ font-size:12px; letter-spacing:0.16em; font-weight:700; color:var(--bass); margin-bottom:14px; }
.thankscard h1{ font-size:30px; font-weight:900; line-height:1.4; margin:0 0 18px; letter-spacing:-0.01em; }
.thankscard p{ font-size:15px; line-height:1.95; color:#5c4f4f; margin:0 auto; max-width:440px; }
.thanksbox{ background:#faf6f2; border:1px solid #eee2d9; border-radius:14px; padding:22px 24px; margin:30px 0 0; text-align:left; }
.thanksbox h3{ font-size:13px; font-weight:800; margin:0 0 12px; color:var(--ink); }
.thanksbox ol{ margin:0; padding-left:20px; font-size:13.5px; line-height:1.95; color:#5c4f4f; }
.thanksbtns{ display:flex; gap:12px; justify-content:center; margin-top:32px; flex-wrap:wrap; }
.tbtn{ display:inline-flex; align-items:center; gap:8px; padding:15px 26px; border-radius:11px; font-weight:800; font-size:15px; text-decoration:none; transition:transform .2s; }
.tbtn:hover{ transform:translateY(-2px); }
.tbtn.main{ background:var(--bass); color:#fff; box-shadow:0 12px 26px -10px rgba(192,80,80,0.6); }
.tbtn.sub{ background:#fff; color:var(--ink); border:1.5px solid #ddd0c7; }

@media (max-width:860px){
  .intro h1{ font-size:27px; }
  .formgrid{ grid-template-columns:1fr; gap:24px; }
  .formcard{ padding:30px 24px; order:2; }
  .aside{ position:static; order:1; }
  .row2, .radios{ grid-template-columns:1fr; }
  .thankscard{ padding:42px 26px 38px; }
  .thankscard h1{ font-size:24px; }
}

/* ---- shared footer (matches top page) ---- */
.wrap{ max-width:1140px; margin:0 auto; }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:14px 20px; border-radius:11px; font-weight:800; font-size:14px; text-decoration:none; transition:transform .2s, background .2s; }
.btn:hover{ transform:translateY(-2px); }
.btn-main{ background:var(--bass); color:#fff; box-shadow:0 12px 28px -8px rgba(192,80,80,0.6); }
.btn-sub{ background:transparent; color:#fff; border:1.5px solid rgba(255,255,255,0.35); }
.btn-sub:hover{ background:rgba(255,255,255,0.08); }

.site-footer{ background:var(--dark); color:#fff; padding:72px 56px 36px; }
.site-footer .fcols{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; padding-bottom:48px; border-bottom:1px solid rgba(255,255,255,0.12); }
.site-footer .fbrand img{ height:34px; width:auto; filter:brightness(0) invert(1); }
.site-footer .fbrand p{ color:rgba(255,255,255,0.55); font-size:13px; line-height:1.9; margin:20px 0 0; }
.site-footer .fcol h4{ font-size:12px; letter-spacing:0.12em; color:rgba(255,255,255,0.45); font-weight:700; margin:0 0 18px; }
.site-footer .fcol ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:13px; }
.site-footer .fcol ul a{ font-size:14px; color:rgba(255,255,255,0.82); text-decoration:none; }
.site-footer .fcol ul a:hover{ color:#fff; }
.site-footer .fcol .addr{ font-size:13px; line-height:1.95; color:rgba(255,255,255,0.6); font-style:normal; }
.site-footer .fcol .addr .tel{ display:block; color:#fff; font-weight:800; font-size:16px; margin-top:8px; letter-spacing:0.02em; }
.site-footer .fbtns{ display:flex; flex-direction:column; gap:11px; margin-top:18px; }
.site-footer .fcopy{ display:flex; justify-content:space-between; align-items:center; padding-top:26px; flex-wrap:wrap; gap:12px; }
.site-footer .fcopy small{ color:rgba(255,255,255,0.4); font-size:12px; }
.site-footer .fcopy .logis{ font-size:12px; color:rgba(255,255,255,0.4); }
@media (max-width:860px){
  .site-footer{ padding:56px 24px 30px; }
  .site-footer .fcols{ grid-template-columns:1fr; gap:32px; }
}