/* ── dividend_reconstruction2_3（商とあまりからわられる数を組み立てよう、単元仕様書 v1.2）── */
/* 画面：問題文の下に関係図（3本のぼう）、二段の式、回答案内、2つの欄（見出しと欄を同じ行に）、テンキーを置く（§5-3・§7 画面表示）。320×568でも横スクロールを出さない。 */
.drc-main{display:flex;flex-direction:column;align-items:center;gap:6px;margin:4px 0 6px;max-width:100%}
.drc-figure{margin:0;width:22em;max-width:100%;box-sizing:border-box}
.drc-fig-title{margin:0 0 4px;font-weight:700;font-size:.95rem;text-align:center;color:#1f2937}
.drc-bars{display:flex;flex-direction:column;gap:4px}
.drc-bar-row{display:flex;gap:4px}
.drc-bar{box-sizing:border-box;min-height:40px;display:flex;align-items:center;justify-content:center;padding:4px 6px;border:2px solid #334155;border-radius:6px;font-weight:700;font-size:1.02rem;line-height:1.25;text-align:center;font-variant-numeric:tabular-nums;color:#111827;word-break:keep-all;overflow-wrap:normal}
.drc-bar-n{background:#fef9c3}
.drc-bar-p{flex:3 1 0;min-width:0;background:#dbeafe}
.drc-bar-r{flex:1 1 0;min-width:5.5em;background:#fee2e2;border-style:dashed}
.drc-factors-row{gap:4px}
.drc-fig-factors{flex:3 1 0;min-width:0;margin:0;font-size:.95rem;font-weight:700;text-align:center;color:#1e3a8a}
.drc-factors-space{flex:1 1 0;min-width:5.5em}
.drc-steps{display:flex;flex-direction:column;align-items:center;gap:2px;margin:2px 0 0}
.drc-step{margin:0;font-size:1.2rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em}
.drc-response{margin:4px 0 4px;font-weight:700;text-align:center}
.drc-fields{display:flex;flex-direction:column;align-items:center;gap:6px;margin:4px auto 2px;max-width:100%}
.drc-field{display:flex;align-items:center;justify-content:flex-end;gap:8px;font-weight:700;font-size:1.05rem;white-space:nowrap}
.drc-field-label{min-width:6.5em;text-align:right}
.drc-input{width:5.5em;max-width:40vw;min-height:44px;font-size:1.4rem;padding:4px 8px;border:2px solid #94a3b8;border-radius:10px;text-align:center;font-family:inherit;box-sizing:border-box}
.drc-input:focus-visible{outline:3px solid #1d4ed8;outline-offset:2px}
.drc-input:disabled{background:#f8fafc;color:#111827;opacity:1}
.drc-input.drc-input-active{border:3px solid #1d4ed8;background:#eff6ff}
.drc-input.drc-input-ok{border:3px solid #15803d;background:#dcfce7}
.drc-input.drc-input-ng{border:3px dashed #b91c1c;background:#fff1f2}
.drc-msg{margin:2px auto 0;color:#b91c1c;font-weight:700;font-size:.95rem;text-align:center;max-width:32em;display:flex;flex-direction:column;gap:2px}
.drc-msg:empty{display:none}
.drc-keypad{margin-top:10px}
.drc-keypad .drc-key-switch{grid-column:1/-1;font-size:1rem}
.feedback.has-text.drc-feedback{height:auto;min-height:40px;padding:4px 0;text-align:center;line-height:1.45;display:flex;flex-direction:column;align-items:center}
.drc-answer-line{margin:4px 0 2px;font-weight:700}
.drc-expl-text{margin:2px 0 6px}
#page-quiz.active:has(.drc-main) #hint-area .kp-card{display:flex;align-items:flex-start;gap:8px}
#page-quiz.active:has(.drc-main) #hint-area .kp-head{margin-bottom:0;flex:none}
#page-quiz.active:has(.drc-main) #hint-area .kp-title:empty{display:none}
#page-quiz.active:has(.drc-main) #hint-area .kp-body{flex:1;min-width:0;padding-left:0}
@media (max-width:380px){
  .drc-field{font-size:.98rem;gap:6px}
  .drc-field-label{min-width:0}
  .drc-step{font-size:1.1rem}
  .drc-bar{font-size:.92rem;padding:4px 3px}
  .drc-bar-r,.drc-factors-space{min-width:7em}
}

/* 印刷：A4縦・1列・1ページ（§7。用紙の余白10mm、本文190×277mm）。 */
.drc-print-page{width:190mm;height:277mm;box-sizing:border-box;display:flex;flex-direction:column;padding:0;margin:0 auto 8mm;overflow:hidden;background:#fff;color:#000;font-family:'Atkinson Hyperlegible','BIZ UDPGothic','Yu Gothic','Meiryo',sans-serif}
/* 見出し：題名の枠、「月 日」「年 組」「名前」の記入欄、実線、共通の案内（点数の欄は置かない）。 */
.drc-print-head{display:flex;flex-direction:column;flex:none;box-sizing:border-box}
.drc-print-title{box-sizing:border-box;margin:0;height:8mm;font-size:14.3pt;font-weight:700;line-height:6.9mm;text-align:center;white-space:nowrap;padding:0;border:1.5pt solid #666;background:#ffffcc;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.drc-print-fields{display:flex;gap:9mm;align-items:flex-end;height:7mm;margin-top:3mm;font-size:12.5pt;line-height:7mm;white-space:nowrap}
.drc-print-group{display:inline-flex;align-items:flex-end;gap:4mm;flex:none}
.drc-print-field{display:inline-flex;align-items:flex-end;gap:1.5mm;flex:none}
.drc-print-field-line{display:inline-block;box-sizing:border-box;width:13mm;height:5.5mm;border-bottom:1pt solid #555}
.drc-field-name{flex:1;min-width:0}
.drc-field-name .drc-print-field-line{flex:1;width:auto;min-width:40mm}
.drc-print-solid{box-sizing:content-box;display:block;height:0;padding:0;border:0;border-top:1.5pt solid #333;margin:2.5mm 0 2mm}
.drc-print-instruction{margin:0 0 2mm;max-height:18mm;font-size:12.8pt;line-height:6mm;overflow:hidden}
/* 問題：1問17mm×10段（ラベル9pt 4mm＋値と（　）の行8mm＋余り）。 */
.drc-print-problems{display:grid;grid-template-rows:repeat(10,17mm);flex:none;height:170mm}
.drc-print-cell{display:flex;align-items:flex-end;height:17mm;overflow:hidden;box-sizing:border-box;padding-bottom:3mm}
.drc-print-line{display:flex;align-items:flex-end;font-size:12.8pt;line-height:8mm;white-space:nowrap}
.drc-print-number{display:inline-block;font-weight:700;min-width:12mm;line-height:8mm;white-space:nowrap}
.drc-print-text{display:inline-block;white-space:pre;line-height:8mm}
.drc-print-slot{display:inline-flex;flex-direction:column;align-items:center;min-width:12mm}
.drc-print-label{font-size:9pt;line-height:4mm;height:4mm;white-space:nowrap;color:#000}
.drc-print-value{display:inline-block;line-height:8mm;font-weight:700;padding:0 1mm}
.drc-print-box{display:inline-flex;align-items:center;line-height:8mm;white-space:pre}
.drc-print-box-space{display:inline-block;box-sizing:border-box;width:32mm;height:8mm;white-space:pre;color:transparent;overflow:hidden;border-bottom:0.4mm solid #333}
.drc-print-answers{flex:none;box-sizing:border-box;margin-top:2mm}
.drc-print-dashed{box-sizing:content-box;display:block;height:0;margin:0 0 0.5mm;padding:0;border:0;border-top:2pt dashed #aaa}
.drc-print-answers-title{font-weight:700;font-size:12.8pt;height:6mm;line-height:6mm}
.drc-print-answers-grid{display:grid;grid-template-columns:92mm 92mm;column-gap:6mm}
.drc-print-answer-col{list-style:none;margin:0;padding:0}
.drc-print-answer{font-size:10pt;line-height:4.6mm;min-height:9.2mm;max-height:9.2mm;overflow:hidden}
.drc-app-pdf-page .drc-print-page{box-shadow:none;margin:0}

#pr-sheet[data-unit="dividend_reconstruction2_3"]{width:190mm;max-width:none;padding:0;margin:calc(12px + 10mm) auto;background:transparent;box-shadow:none}
#pr-sheet[data-unit="dividend_reconstruction2_3"]>:not(#pr-problems){display:none!important}
#pr-sheet[data-unit="dividend_reconstruction2_3"]>#pr-problems{display:block}
/* 画面のプレビューでは、用紙の余白10mmを白い縁で見せる（印刷の寸法は変えない）。 */
#pr-sheet[data-unit="dividend_reconstruction2_3"] .drc-print-page{box-shadow:0 0 0 10mm #fff,0 0 4px 10mm rgba(0,0,0,.12);margin-bottom:calc(8mm + 10mm)}
@media print{
  #page-print #pr-sheet[data-unit="dividend_reconstruction2_3"]{width:auto!important;max-width:none!important;margin:0!important;padding:0!important;transform:none!important;box-shadow:none!important}
  #page-print #pr-sheet[data-unit="dividend_reconstruction2_3"]>:not(#pr-problems){display:none!important}
  #page-print #pr-sheet[data-unit="dividend_reconstruction2_3"]>#pr-problems{display:block!important}
  #page-print #pr-sheet[data-unit="dividend_reconstruction2_3"] .drc-print-page{display:flex!important;margin:0!important;box-shadow:none!important;break-after:auto;page-break-after:auto}
}