@charset "utf-8";
/* CSS Document */

    :root{--bg:#fafafa;--card:#ffffff;--ink:#222;--ink-2:#666;--prim:#0b6cff;--ok:#117a37;--ng:#b00020;--bd:#e6e6e6;--muted:#f4f6f8}
    html,body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Noto Sans JP","Noto Sans","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;}
    .eiju-wrap{max-width:920px;margin:24px auto;padding:16px}
    .eiju-card{background:var(--card);border:1px solid var(--bd);border-radius:16px;box-shadow:0 6px 20px rgba(0,0,0,.04);}
    .eiju-header{padding:20px 24px 8px}
    .eiju-header h1{margin:0 0 6px;font-size:clamp(20px,3.2vw,28px);}
    .eiju-header p{margin:0;color:var(--ink-2);}
    .eiju-kicker{font-size:13px;color:#1745a3;font-weight:700;letter-spacing:.04em}
    .eiju-notice{border-left:4px solid var(--prim);background:var(--muted);padding:12px 14px;margin:16px 24px;border-radius:8px}
    .eiju-section{padding:8px 24px 16px}
    .eiju-q{display:grid;grid-template-columns:1fr auto;gap:12px;border:1px solid var(--bd);border-radius:12px;padding:14px;margin:12px 0;background:#fff}
    .eiju-q h3{margin:0 0 6px;font-size:16px}
    .eiju-help{color:var(--ink-2);font-size:13px;margin:0}
    .eiju-choices{display:flex;gap:8px;align-items:center}
    .eiju-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--bd);padding:6px 10px;border-radius:999px;cursor:pointer;background:#fff}
    input[type=radio]{accent-color:var(--prim)}
    .eiju-q.ng{border-color:var(--ng);box-shadow:0 0 0 2px rgba(176,0,32,.1) inset}
    .eiju-q.ok{border-color:var(--ok)}
    .eiju-actions{display:flex;flex-wrap:wrap;gap:12px;padding:10px 24px 20px}
    button,.eiju-btn{border:0;border-radius:10px;padding:12px 16px;cursor:pointer;font-weight:600}
    .eiju-primary{background:var(--prim);color:#fff}
    .eiju-secondary{background:#eef3ff;color:#1745a3}
    .eiju-ghost{background:#fff;border:1px solid var(--bd)}
    .eiju-result{border-top:1px solid var(--bd);padding:16px 24px}
    .eiju-badge{display:inline-block;padding:6px 10px;border-radius:999px;font-weight:700}
    .eiju-badge-ok{background:#e8f5ee;color:var(--ok)}
    .eiju-badge-ng{background:#fdecec;color:var(--ng)}
    .eiju-list{margin:12px 0 0;padding-left:18px}
    .eiju-grid-2{display:grid;grid-template-columns:1fr;gap:12px}
    @media (min-width:800px){.eiju-grid-2{grid-template-columns:1fr 1fr}}
    .eiju-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
    .eiju-small{font-size:12px;color:var(--ink-2)}
    .eiju-footer{padding:16px 24px;border-top:1px solid var(--bd);display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
    .eiju-link{color:#1745a3;text-decoration:underline}
    .eiju-muted{color:var(--ink-2)}
    .eiju-sr{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
    .eiju-print-hint{display:none}
    @media print{.eiju-actions,.eiju-footer{display:none}.eiju-print-hint{display:block}.eiju-card{border:0;box-shadow:none}}
 /* スマホ画面（例: 600px以下）のとき、はい/いいえを縦並びにする */
@media (max-width: 600px) {
  .eiju-choices {
    flex-direction: column !important; /* ←横並びを縦並びに変更 */
    align-items: flex-start;           /* 左揃えにする */
    gap: 8px;                          /* はい/いいえの間の余白 */
  }

  .eiju-choices label,
  .eiju-choices .eiju-pill {
    width: 100%;                       /* ラジオボタンの幅を広げる（お好み） */
  }
}
/* スマホ時に Q 本体を縦並びにする */
@media (max-width: 600px) {
  .eiju-q {
    display: block !important;       /* ←横並びのgridを解除 */
  }
  .eiju-q > div:first-child {
    margin-bottom: 8px;              /* 質問テキストとボタンの間の余白 */
  }
  .eiju-choices {
    flex-direction: row !important;  /* はい/いいえは横並びのまま */
    justify-content: flex-start;
    gap: 16px;
  }
}
/* 固定ヘッダー分の余白を確保（例：120px） */
#eiju-result,
.eiju-q {
  scroll-margin-top: 150px;
}
