/* ========= 第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;
}
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 12px !important;
  font: 700 clamp(22px,2.1vw,28px)/1.25 system-ui,"Noto Sans JP",sans-serif !important;
  color: var(--ink) !important;
  border-left: 5px solid var(--accent) !important;
  padding-left: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* テーブルカード（横スクロール親） */
/* ====== テーブル外側の白カードをやめる（フラット化） ====== */
.page-law-proc .table-wrap{
  position: relative;
  isolation: isolate;
  background: transparent !important;  /* ← 白背景やめる */
  border: 0 !important;                /* ← 枠線なし */
  box-shadow: none !important;         /* ← 影なし */
  padding: 0 !important;               /* ← 余白も外す */
  margin: 0;                           /* 任意：上下マージンもフラットに */
  overflow-x: auto;                    /* ← 横スクロールは維持（SP用） */
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x;
  overscroll-behavior-x: contain;
}


/* ====== テーブル基礎（そのまま。背景はセル側で白に） ====== */
.page-law-proc .procedures-table{
  width: 100%;
  min-width: 920px;                    /* SPは横スクロール */
  border-collapse: separate;
  border-spacing: 0;
  table-layout: fixed;
  background: transparent;             /* ← テーブル自体の背景は透明 */
  color: var(--ink);
}


/* セル塗り（sticky の透け防止） */
.page-law-proc .procedures-table th,
.page-law-proc .procedures-table td{
  background: #fff;                    /* ← セルを白で塗る */
  padding: 12px 10px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  word-break: auto-phrase;
}

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

/* 1列目固定＋潜り込み防止の白帯 */
.page-law-proc .procedures-table th[scope="rowgroup"]{
  position: sticky; left: 0; z-index: 10;
  background: #fff;
  box-shadow: 8px 0 0 #fff;            /* 右側のセルを隠す白帯 */
}
.page-law-proc .procedures-table thead th:first-child{
  position: sticky; left: 0; top: 0; z-index: 12;
  background: var(--head-bg);
}

/* 行グループの区切りは通常線（点線を無効化） */
.page-law-proc .procedures-table .group-sep td,
.page-law-proc .procedures-table .group-sep th{
  border-bottom: 1px solid var(--border) !important;
}

/* 列幅の目安（SP共通） */
.page-law-proc .procedures-table thead th:nth-child(1){ width: 80px; }
.page-law-proc .procedures-table thead th:nth-child(2){ width: 120px; }
.page-law-proc .procedures-table thead th:nth-child(3){ width: auto; }
.page-law-proc .procedures-table thead th:nth-child(4){ width: 120px; }

/* 左列ラベルの見た目（お好みで） */
.page-law-proc .cell-proc{
  background:#f9fbff !important; color:#0b2b66 !important;
  font-weight:700 !important; text-align:center !important;
  border-right:1px solid #dfe6f7 !important;
}

/* === PCでは横スクロールをやめて列幅を詰める === */
@media (min-width: 1024px){
  .page-law-proc .table-wrap{ overflow-x: visible !important; }
  .page-law-proc .procedures-table{ min-width: unset !important; width:100%; }

  /* 手続=80 / 項目=120 / 目的等=auto / 申請先=140 */
  .page-law-proc .procedures-table thead th:nth-child(1){ width:80px !important; }
  .page-law-proc .procedures-table thead th:nth-child(2){ width:120px !important; }
  .page-law-proc .procedures-table thead th:nth-child(3){ width:auto  !important; }
  .page-law-proc .procedures-table thead th:nth-child(4){ width:140px !important; }
}

/* モバイル（パディングを控えめに） */
@media (max-width: 768px){
  .page-law-proc .procedures-table{ min-width: 860px; }
  .page-law-proc .procedures-table th,
  .page-law-proc .procedures-table td{ padding: 10px 8px; }
}


/* ===== 頻出ポイント（オレンジ・1列） ===== */
.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 !important; }
@media (max-width: 768px){
  .page-law-proc .exam-notes{ padding: 16px 14px; }
}

.page-law-proc .main-container,
.page-law-proc .site-main,
.page-law-proc .summary-section{
  overflow: visible !important;
}

/* ===== SPのスクロール改善（縦も横も自然に） ===== */
@media (max-width: 768px){
  /* 横スクロールは維持しつつ、縦スクロールをブロックしない */
  .page-law-proc .table-wrap{
    overflow-x: auto !important;
    overflow-y: visible !important;      /* ← hidden を解除 */
    touch-action: pan-y pan-x !important;/* ← 縦横のパンを許可 */
    -webkit-overflow-scrolling: touch;   /* 慣性スクロール */
  }

  /* 列幅をさらにコンパクトに（手続/項目/申請先） */
  .page-law-proc .procedures-table{ min-width: 820px !important; }
  .page-law-proc .procedures-table thead th:nth-child(1){ width: 80px  !important; }  /* 手続 */
  .page-law-proc .procedures-table thead th:nth-child(2){ width: 120px !important; }  /* 項目  */
  .page-law-proc .procedures-table thead th:nth-child(3){ width: auto   !important; }  /* 目的等=可変 */
  .page-law-proc .procedures-table thead th:nth-child(4){ width: 120px !important; }  /* 申請先 */

  /* 左固定列（許可 etc.）の見え方を保ちつつ最前面に */
  .page-law-proc .procedures-table th[scope="rowgroup"]{
    z-index: 10 !important;
    box-shadow: 8px 0 0 #fff;            /* 右側潜り込み防止の白帯 */
  }

  /* 余白を少し軽くして指操作しやすく */
  .page-law-proc .procedures-table th,
  .page-law-proc .procedures-table td{ padding: 10px 8px !important; }
}


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

/* テーブル内の文字サイズを明示して固定 */
.page-law-proc .procedures-table {
  font-size: 1rem;            /* 基本 */
  line-height: 1.6;
}

@media (max-width: 768px){
  .page-law-proc .procedures-table th,
  .page-law-proc .procedures-table td{
    font-size: .95rem;        /* SPはやや小さめ、列ごとの暴走防止 */
  }

  /* 折り返しを安定させ、拡大のトリガーを減らす */
  .page-law-proc .procedures-table td,
  .page-law-proc .procedures-table th{
    word-break: break-word;   /* auto-phrase が効かない環境の保険 */
    overflow-wrap: anywhere;
  }
}


