@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;700&display=swap');

/* chap16 専用テーブルの基本 */
.styled-table-chap16 {
  width: 100%;
  border-collapse: collapse;
  /* ほかで fixed が当たっていても自分は可変幅にする */
  table-layout: auto;
}

/* 1列目は番号用。PCでは4ch=「0」4文字分程度に */
.styled-table-chap16 .col-num { width: 4ch; }

/* テーブル内の共通パディング等（必要なら） */
.styled-table-chap16 th,
.styled-table-chap16 td {
  padding: .75rem 1rem;
}

/* モバイルで番号列を“最小”に寄せる */
@media (max-width: 640px) {
  /* ① 1列目（番号）をさらに詰める */
  .styled-table-chap16 .col-num { width: 3ch; }

  /* ② 見出しセル（1列目）を折り返させず、左右余白も圧縮 */
  .styled-table-chap16 thead th:first-child,
  .styled-table-chap16 tbody th[scope="row"] {
    width: 1%;                 /* “できるだけ狭く”のヒント */
    white-space: nowrap;       /* 折り返し防止＝最小幅化 */
    padding-left: .5rem;
    padding-right: .5rem;
    text-align: center;
    vertical-align: top;       /* 長文2列目との高さ差でズレないように */
  }
}

/* 参考：視覚非表示ユーティリティ（必要なら） */
.sr-only {
  position: absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border:0;
}