/* =========================================================
   ts.css — まなびのもり 特別支援学校モード 共通スタイル
   ---------------------------------------------------------
   ・既存ページ（free-print.html 等）の配色をそのまま引き継ぎます。
   ・タップ目標は 44px 以上、文字は大きめ、行間は広めにしています。
   ・mm-a11y.js が付ける html.mm-* クラス（文字サイズ／高コントラスト／
     動きを減らす／1画面1課題）と併用できます。
   ・印刷時は、余計なものを消して紙に収まるようにします。
   ========================================================= */

:root{
  --green:#2f9e60; --green-d:#1f7a47; --ink:#2f3a3a; --muted:#6b7a7a;
  --bg:#fffdf7; --line:#eef0e9; --soft:#e7f6ee;
  --blue:#3d7fb5; --blue-s:#eaf2fa;
  --amber:#b5772a; --amber-s:#fdf3e3;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:"Hiragino Maru Gothic ProN","Yu Gothic","Meiryo",sans-serif;
  background:var(--bg); color:var(--ink); line-height:1.9;
  -webkit-text-size-adjust:100%;
}
header{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:10px 16px; background:#fff; border-bottom:2px solid var(--green);
}
header a{color:var(--green-d);text-decoration:none;font-weight:800}
header .nav-links{display:flex;align-items:center;gap:12px;font-size:.85rem}

.wrap{max-width:860px;margin:0 auto;padding:18px 16px 70px}
h1{font-size:1.4rem;color:var(--green-d);margin:6px 0 2px}
h2{font-size:1.08rem;color:var(--green-d);margin:26px 0 8px}
h3{font-size:1rem;color:var(--green-d);margin:18px 0 6px}
p{margin:8px 0}
.lead{color:var(--muted);font-size:.95rem}
.small{font-size:.85rem;color:var(--muted)}

/* パンくず */
.crumb{font-size:.83rem;color:var(--muted);margin:2px 0 10px}
.crumb a{color:var(--green-d)}

/* カード並べ */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin:16px 0}
.grid.wide{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.grid.tight{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
a.card,.card{
  display:block;background:#fff;border:2px solid var(--line);border-radius:16px;
  padding:16px;text-decoration:none;color:var(--ink);
}
a.card:hover,a.card:focus{border-color:var(--green);outline:none}
a.card:focus-visible{box-shadow:0 0 0 4px #bfe3cc}
.card > b{color:var(--green-d);font-size:1.02rem;display:block}
.card .ic{font-size:1.9rem;display:block;line-height:1.3}
.card .sub{color:var(--muted);font-size:.83rem;display:block;margin-top:2px}
/* 説明文のなかの <b> は、行を折らずに強調するだけにします */
.card .sub b{display:inline;color:var(--green-d);font-size:inherit}

/* お知らせ帯 */
.note{background:var(--soft);border-radius:12px;padding:12px 16px;margin:14px 0;font-size:.9rem}
.note.blue{background:var(--blue-s)}
.note.amber{background:var(--amber-s)}
.note b{color:var(--green-d)}

/* ボタン */
.btn{
  display:inline-block;font-family:inherit;font-size:1rem;font-weight:800;
  border:none;border-radius:999px;padding:12px 24px;min-height:44px;
  background:linear-gradient(135deg,#1f7a47,#22824c);color:#fff;
  text-decoration:none;cursor:pointer;
}
.btn.sub{background:#fff;color:var(--green-d);border:2px solid var(--green)}
.btn:focus-visible{outline:3px solid var(--green-d);outline-offset:2px}
.btnrow{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0}

/* 対応状況バッジ */
.badge{
  display:inline-block;font-size:.76rem;font-weight:800;border-radius:999px;
  padding:2px 10px;border:2px solid currentColor;white-space:nowrap;
}

/* 表 */
.tbl{width:100%;border-collapse:collapse;font-size:.86rem;background:#fff}
.tbl th,.tbl td{border:1px solid var(--line);padding:7px 8px;text-align:left;vertical-align:top}
.tbl th{background:#f4faf6;color:var(--green-d);position:sticky;top:0;z-index:1}
.scrollx{overflow-x:auto;border:2px solid var(--line);border-radius:12px}

/* イラスト */
.mm-il{width:100%;height:auto;display:block}
.ilbox{background:#fff;border:2px solid var(--line);border-radius:16px;padding:10px;text-align:center}
.ilbox .cap{font-size:.9rem;font-weight:800;margin-top:4px}

/* 絵カード（印刷用の枠） */
.cardsheet{display:grid;grid-template-columns:repeat(3,1fr);gap:6mm}
.pcard{border:3px solid #2f3a3a;border-radius:6mm;padding:4mm;text-align:center;background:#fff;break-inside:avoid}
.pcard .cap{font-size:1.05rem;font-weight:800;margin-top:2mm}

footer{text-align:center;color:var(--muted);font-size:.8rem;padding:20px;border-top:1px solid var(--line);margin-top:34px}
footer a{color:var(--green-d)}

/* 「1画面1課題」のときは、飾りを減らします */
html.mm-onetask .grid{grid-template-columns:1fr}
html.mm-onetask .note{display:none}

@media print{
  header,footer,.crumb,.btnrow,.note,.noprint{display:none !important}
  body{background:#fff}
  .wrap{max-width:none;padding:0}
  .pcard{border-color:#000}
}