/* ── multiply_then_divide_word2_3（全部の数をもとめてから分けよう、単元仕様書 v1.2）── */
/* 画面：問題文の下に、2つのステップの図（ヒント第2段階から・回答後）、式と答えの欄と単位、回答案内、画面のキー、「こたえる！」（§5-3・§7 画面表示）。 */
.mtd-figure{margin:4px auto 8px;max-width:40em}
.mtd-figure[hidden]{display:none}
.mtd-fig{margin:0;padding:6px 8px;border:2px solid #94a3b8;border-radius:10px;background:#f8fafc}
.mtd-fig-title{font-weight:700;font-size:.9rem;margin:0 0 4px;text-align:center}
.mtd-fig-row{display:flex;align-items:center;justify-content:center;gap:4px}
.mtd-fig-box{flex:1 1 0;min-width:0;border:2px solid #1d4ed8;border-radius:8px;background:#fff;padding:4px 6px;font-weight:700;font-size:.95rem;text-align:center;overflow-wrap:anywhere}
.mtd-fig-arrow{flex:0 1 auto;display:flex;flex-direction:column;align-items:center;min-width:3.5em;max-width:7em;font-size:.85rem;font-weight:700;text-align:center}
.mtd-fig-step{overflow-wrap:anywhere}
.mtd-fig-line{display:block;width:100%;min-width:2.5em;height:0;border-top:3px solid #334155;position:relative;margin-top:4px}
.mtd-fig-line::after{content:'';position:absolute;right:-2px;top:-8px;border-left:10px solid #334155;border-top:6px solid transparent;border-bottom:6px solid transparent}
/* 320 CSS px 幅では3つのわくを上から順に並べる（①②の番号と矢印の向きは保つ。§7）。 */
@media (max-width:480px){
  .mtd-fig-row{flex-direction:column;align-items:stretch}
  .mtd-fig-arrow{max-width:none;flex-direction:row;justify-content:center;gap:6px}
  .mtd-fig-line{width:0;min-width:0;height:18px;border-top:0;border-left:3px solid #334155;margin:0}
  .mtd-fig-line::after{right:auto;left:-8px;top:auto;bottom:-2px;border-left:6px solid transparent;border-right:6px solid transparent;border-top:10px solid #334155;border-bottom:0}
}
.mtd-field{display:flex;justify-content:center;align-items:center;gap:8px;margin:6px auto 2px;flex-wrap:nowrap;max-width:100%}
.mtd-input{width:11em;max-width:calc(100vw - 6.5em);min-height:44px;font-size:1.3rem;padding:4px 8px;border:3px solid #1d4ed8;background:#eff6ff;border-radius:10px;text-align:center;font-family:inherit;box-sizing:border-box}
.mtd-input::placeholder{font-size:.8rem;color:#64748b}
.mtd-input:focus-visible{outline:3px solid #1d4ed8;outline-offset:2px}
.mtd-input:disabled{background:#f8fafc;color:#111827;opacity:1;border-color:#94a3b8}
.mtd-input.mtd-input-ok{border:3px solid #15803d;background:#dcfce7}
.mtd-input.mtd-input-ng{border:3px dashed #b91c1c;background:#fff1f2}
.mtd-unit{font-weight:700;font-size:1.1rem;white-space:nowrap}
.mtd-guide{margin:6px auto 4px;font-weight:700;text-align:center;max-width:32em}
.mtd-msg{margin:2px auto 0;color:#b91c1c;font-weight:700;font-size:.95rem;text-align:center;max-width:32em}
.mtd-msg:empty{display:none}
.mtd-keypad{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:300px;margin:6px auto 4px}
.mtd-keypad .num-btn{min-height:44px}
.feedback.has-text.mtd-feedback{height:auto;min-height:40px;padding:4px 0;text-align:center;line-height:1.45}
.mtd-correct{margin:2px 0 6px;font-weight:700;overflow-wrap:anywhere}
.mtd-expl-text{margin:4px 0 6px;overflow-wrap:anywhere}
.mtd-lesson-ex{display:block;margin-top:6px;overflow-wrap:anywhere}
#page-quiz.active:has(.mtd-field) #hint-area .kp-card{display:flex;align-items:flex-start;gap:8px}
#page-quiz.active:has(.mtd-field) #hint-area .kp-head{margin-bottom:0;flex:none}
#page-quiz.active:has(.mtd-field) #hint-area .kp-title:empty{display:none}
#page-quiz.active:has(.mtd-field) #hint-area .kp-body{flex:1;min-width:0;padding-left:0;overflow-wrap:anywhere}

/* 印刷：A4縦・2列×5段・1ページ（§7。用紙の余白10mm、本文190×277mm、列92mm・列の間6mm）。
   上から、題名の枠と記入欄22.5mm、共通の案内11mm、共通の図17mm、問題 39.5mm×5段、答え（見出しと4列×3行）。 */
.mtd-pr-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}
.mtd-pr-head{display:flex;flex-direction:column;flex:none;box-sizing:border-box;width:190mm;height:22.5mm}
.mtd-pr-title{box-sizing:border-box;margin:0;height:9mm;font-size:14.3pt;font-weight:700;line-height:7.8mm;text-align:center;white-space:nowrap;padding:0;border:1.5pt solid #666;background:#ffffcc;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.mtd-pr-inst{flex:none;box-sizing:border-box;margin:0;height:11mm;font-size:12.6pt;line-height:5.5mm;overflow:hidden}
.mtd-pr-fig{flex:none;box-sizing:border-box;margin:1mm 0 0;height:17mm;width:190mm}
.mtd-pr-fig-title{font-size:9.5pt;font-weight:700;height:4.5mm;line-height:4.5mm}
.mtd-pr-fig-row{display:flex;align-items:center;height:12mm}
.mtd-pr-fig-box{box-sizing:border-box;height:11mm;border:0.4mm solid #000;border-radius:1mm;padding:0 1mm;display:flex;align-items:center;justify-content:center;text-align:center;font-size:9.5pt;line-height:4.2mm;font-weight:700;overflow:hidden}
.mtd-pr-fig-box1{width:62mm}
.mtd-pr-fig-box2{width:18mm}
.mtd-pr-fig-box3{width:48mm}
.mtd-pr-fig-arrow{box-sizing:border-box;display:flex;flex-direction:column;align-items:stretch;justify-content:center;padding:0 1mm;height:12mm}
.mtd-pr-fig-arrow1{width:17mm}
.mtd-pr-fig-arrow2{width:40mm}
.mtd-pr-fig-step{font-size:9.5pt;line-height:4.2mm;text-align:center;font-weight:700}
.mtd-pr-fig-line{display:block;height:0;border-top:0.5mm solid #000;position:relative;margin:0.8mm 1.5mm 0 0}
.mtd-pr-fig-line::after{content:'';position:absolute;right:-1.6mm;top:-1.45mm;border-left:2.2mm solid #000;border-top:1.2mm solid transparent;border-bottom:1.2mm solid transparent}
.mtd-pr-problems{display:grid;grid-template-columns:92mm 92mm;column-gap:6mm;flex:none;height:197.5mm;margin-top:2mm}
.mtd-pr-col{display:flex;flex-direction:column}
.mtd-pr-cell{box-sizing:border-box;height:39.5mm;overflow:hidden;display:flex;flex-direction:column;padding-right:3mm}
.mtd-pr-q{margin:0;font-size:12.6pt;line-height:5.7mm;overflow-wrap:anywhere}
.mtd-pr-boxline{margin:1.5mm 0 0;height:10mm;font-size:12.6pt;display:flex;align-items:center;gap:2mm;white-space:nowrap}
.mtd-pr-paren{display:inline-flex;align-items:center;white-space:pre}
.mtd-pr-box{display:inline-block;box-sizing:border-box;width:60mm;height:9mm;border:0.35mm solid #000;border-radius:1mm;margin:0 0.5mm}
.mtd-pr-unit{font-weight:700}
.mtd-pr-answers{flex:none;box-sizing:border-box;margin-top:2mm}
.mtd-pr-dashed{box-sizing:content-box;display:block;height:0;margin:0 0 0.5mm;padding:0;border:0;border-top:2pt dashed #aaa}
.mtd-pr-answers-title{font-weight:700;font-size:12.6pt;height:6mm;line-height:6mm}
.mtd-pr-ans-grid{display:grid;grid-template-columns:repeat(4,44.5mm);column-gap:3mm}
.mtd-pr-ans{box-sizing:border-box;margin:0;height:4.6mm;font-size:10.2pt;line-height:4.6mm;white-space:nowrap;overflow:hidden}
.mtd-app-pdf-page .mtd-pr-page{box-shadow:none;margin:0}

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