/* ========= 第1章 41節-1 専用（最小・安全版） ========= */

/* スコープ＆トークン */
.page-law-proc, .page-law-proc * { box-sizing: border-box; }
.page-law-proc{
  --container: min(1120px, calc(100% - 32px));
  --page-bg: #f5f7fb;
  --card-bg: #fff;
  --ink: #0b1f3a;
  --accent: #1f2a44;
  --head-bg: #f1f6ff;
  --border: #e5e7eb;
  --border-strong: #d5d9e2;   /* 縦罫の視認性UP */
  --hint: #6b7280;            /* 補足色 */
  --ok: #0ea5a8;              /* 可バッジ色 */
  --ng: #ef4444;              /* 不可バッジ色 */
}
body.page-law-proc { background: var(--page-bg); color: var(--ink); }
.page-law-proc .breadcrumbs,
.page-law-proc .main-container { max-width: var(--container); margin-inline: auto; }

/* 見出し（統一） */
.page-law-proc .section-title{
  margin: 18px 0 14px;
  font: 700 clamp(22px,2.1vw,28px)/1.25 system-ui,"Noto Sans JP",sans-serif;
  color: var(--ink);
  border-left: 5px solid var(--accent);
  padding-left: 12px;
  background: transparent;
  box-shadow: none;
}

/* ====== テーブル（#notifications 内だけ） ====== */
#periodic-inspections .table-wrap{
  position: relative;
  background: transparent;
  padding: 2px 0;
  margin: 0;
  border: 0;
  box-shadow: none;
  overflow-x: auto;          /* SP横スクロール */
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y pan-x; /* 縦横パンを許可（スクロール固まり対策） */
  overscroll-behavior-x: contain;
}

#periodic-inspections .procedures-table{
  width: 100%;     
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background: transparent;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.6;
  /* 追加：表としての外枠を明確化 */
  border: 1px solid var(--border-strong);
  background: #fff;
}

#periodic-inspections .procedures-table caption{
  caption-side: top;
  text-align: left;
  font-weight: 700;
  margin: 6px 0 12px;
}
#periodic-inspections .procedures-table caption small{
  display:block; font-weight:400; color: var(--hint); margin-top: 4px;
}

/* セル基礎（sticky の透け防止） */
#periodic-inspections .procedures-table th,
#periodic-inspections .procedures-table td{
  background: #fff;
  padding: 14px 12px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* ヘッダ固定 */
#periodic-inspections .procedures-table thead th{
  position: sticky; top: 0; z-index: 40;
  background: var(--head-bg);
  border-bottom: 1px solid #d8e2ff;
  font-weight: 700;
}

/* 1列目（立場）固定＋右側の縦罫を疑似要素で */
#periodic-inspections .procedures-table thead th:first-child,
#periodic-inspections .procedures-table tbody th.cell-proc,
#periodic-inspections .procedures-table tbody th[scope="row"]{
  position: sticky; left: 0; z-index: 45;
  background: #fff;
  background-clip: padding-box;
  isolation: isolate;
}
#periodic-inspections .procedures-table thead th:first-child{ top: 0; z-index: 50; background: var(--head-bg); }
#periodic-inspections .procedures-table thead th:first-child::after,
#periodic-inspections .procedures-table tbody th.cell-proc::after,
#periodic-inspections .procedures-table tbody th[scope="row"]::after{
  content: "";
  position: absolute; top: 0; right: -1px; bottom: 0; width: 1px;
  background: var(--border-strong);
  pointer-events: none;
}

/* 左列ラベルの見た目 */
#periodic-inspections .cell-proc{
  white-space: normal;
  word-break: auto-phrase; 
  line-height: 1.55;
  background:#f9fbff; color:#0b2b66; font-weight:700; text-align:center;
}

/* 列の縦罫（1列目以外の境界） */
#periodic-inspections .procedures-table thead th + th,
#periodic-inspections .procedures-table tbody td + td{
  border-left: 1px solid var(--border-strong);
}

/* 列幅（3列）— 立場 / 要件 / 講習 */
#periodic-inspections .procedures-table thead th:nth-child(1){ width: 120px; }
#periodic-inspections .procedures-table thead th:nth-child(2){ width: auto;  }


/* 期限・届出先の左右パディングを控えめにして見た目をタイトに */
#periodic-inspections .procedures-table th:nth-child(2),
#periodic-inspections .procedures-table td:nth-child(2){
  padding-right: 10px;
}

/* 行ストライプ */
#periodic-inspections .procedures-table tbody tr:nth-child(even) td{
  background: #fcfdff;
}

/* 選任要件の箇条書き：読みやすいミニリスト */
#periodic-inspections .mini-list{
  margin: 0; padding-left: 1.1em; list-style: disc; line-height: 1.7;
}
#periodic-inspections .mini-list li{ margin: 4px 0; }


/* 補助文字 */
.muted { color: var(--hint); font-size: .9em; }

/* ===== 注意・補足（丙の範囲、ヒントなど） ===== */
.page-law-proc .note-block.callout-warn{
  background: #fff; border: 1px solid #ffd28a; border-left: 5px solid #f7a02f;
  border-radius: 10px; padding: 14px 16px 12px; margin: 18px 0 12px;
}
.page-law-proc .note-block.callout-warn h3{
  margin: 0 0 8px; font-size: clamp(18px,1.9vw,20px); line-height: 1.35;
}
.page-law-proc .note-block .hint{ color: var(--hint); margin-top: 8px; }

/* 可／不可の“バッジ化” */
.note-block .pair{
  display: grid; gap: 10px; align-items: start;
  grid-template-columns: 1fr;           /* SP：1列 */
}
@media (min-width: 720px){
  .note-block .pair{ grid-template-columns: 1fr 1fr; }  /* PC：左右2列 */
}
.badge-list{ display:flex; flex-wrap:wrap; gap:8px 10px; margin:6px 0 0; padding:0; list-style:none; }
.badge{ display:inline-block; padding:6px 10px; border-radius:999px; font-weight:600; }
.badge.ok{ background:#ecfeff; color:var(--ok); border:1px solid #a5f3fc; }
.badge.ng{ background:#fee2e2; color:var(--ng); border:1px solid #fecaca; }

/* ===== 頻出ポイント（オレンジ） ===== */
.page-law-proc .exam-notes{
  background: #FFF8E8;
  border: 2px dashed #F1C073;
  border-radius: 12px;
  box-shadow: none;
  padding: 18px 18px 16px;
  margin: 20px 0 18px;
}
.page-law-proc .exam-notes > h3{
  margin: 0 0 12px;
  font-size: clamp(18px,1.9vw,20px);
  font-weight: 700;
  color: #2B2B2B;
  border: 0; padding: 0;
}
.page-law-proc .exam-notes ul.compact{
  list-style: disc;
  margin: 0;
  padding: 0 0 0 1.2em;
}
.page-law-proc .exam-notes ul.compact li{
  margin: 8px 0;
  line-height: 1.7;
}
.page-law-proc .exam-notes ul.compact li::before{ content: none; }

/* 表示崩れ防止 */
.page-law-proc .main-container,
.page-law-proc .site-main,
.page-law-proc .summary-section{ overflow: visible !important; }

/* iOS/Safariの自動拡大を禁止（このページだけ） */
.page-law-proc { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }


#periodic-inspections .deadline { white-space: nowrap; font-variant-numeric: tabular-nums; }

/* 期限・数値の視認性UP（半角数字の桁揃え＆改行防止は既にOK） */
#periodic-inspections .deadline{
  letter-spacing: .02em;
}


/* 既存の @media (max-width: 768px){ ... } の中を書き換え／追記 */
@media (max-width: 768px){

  #periodic-inspections .procedures-table{
    width: 100% !important;
    min-width: 100% !important;        /* ここが肝：はみ出し防止 */
    table-layout: auto !important;     /* 内容に合わせて可変の方が読みやすい */
  }

  /* stickyは完全オフ（再掲：確実に効かせる） */
  #periodic-inspections .procedures-table thead th,
  #periodic-inspections .procedures-table tbody th[scope="row"],
  #periodic-inspections .procedures-table tbody th.cell-proc{
    position: static !important;
    left: auto !important;
    top: auto !important;
    z-index: auto !important;
  }

    /* ▼ここを更新：項目=38% / 内容=62% ＋ 最小幅を保証 */
  #periodic-inspections .procedures-table thead th:nth-child(1),
  #periodic-inspections .procedures-table tbody th[scope="row"]{
    width: 38% !important;
    min-width: 8.5em;               /* 「点検実施者」「記録事項」でも潰れない */
    text-align: left;                /* 視線の流れに合わせて左寄せ */
  }
  #periodic-inspections .procedures-table thead th:nth-child(2){
    width: 62% !important;
  }

  /* 文字の折り返しを強化（長い語でのはみ出し阻止） */
  #periodic-inspections .procedures-table td{
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
  }

  /* パディングをややタイトに（視覚的に広がりすぎないように） */
  #periodic-inspections .procedures-table th,
  #periodic-inspections .procedures-table td{ padding: 12px 10px; }
}

/* モバイル時：1列目の“擬似罫線”を完全OFF（飛び出し対策） */
#periodic-inspections .procedures-table thead th:first-child::after,
#periodic-inspections .procedures-table tbody th.cell-proc::after,
#periodic-inspections .procedures-table tbody th[scope="row"]::after{
  content: none !important;
  display: none !important;
}

  #periodic-inspections .procedures-table{
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: .95rem;           /* 16px → 約15.2px */
    line-height: 1.55;           /* 1.6 → 1.55 で詰めすぎない */
  }
