/* responsive.css — 画面幅への対応
   ページ内部は cqw で組んでいるため自動的に比率を保って縮小する。
   ここでは主にナビ・余白・UIの調整のみ行う。 */

@media (max-width: 900px) {
  .sheet { padding: 74px 10px 60px; gap: 18px; }
  .topnav { display: none; }
  .dots { display: none; }
}

@media (max-width: 560px) {
  .sheet { padding: 66px 8px 48px; }
  .page { box-shadow: 0 10px 26px rgba(20,17,15,.14); }
  .topbar { height: 52px; padding: 0 14px; }
  .topbar .brand { font-size: 13px; }
  .btn-print { padding: 8px 13px; font-size: 11px; }
  .modal-card { width: 94vw; }
  .modal-card .m-body { padding: 20px 20px 24px; }
}

/* 大画面ではA4シートを少し大きく見せる */
@media (min-width: 1240px) {
  :root { --page-max: 900px; }
}