/* ===================================================================
   납부 일정 표 — 좁은 화면에서 옆으로 밀리지 않게 세로로 편다.

   표는 시기 · 분양대금 · 발코니/옵션 · 합계처럼 네다섯 칸인데, 금액이
   "219,300,000원"이라 한 칸이 80px 밑으로는 줄지 않는다. 폰 화면에서
   쓸 수 있는 폭은 300px 남짓이라 어떻게 눌러도 모자라서, .tbl-wrap이
   가로로 스크롤됐다. 오른쪽 합계 칸이 잘린 채로 시작하니 표가 옆으로
   움직인다는 것도 알아채기 어려웠다.

   그래서 좁을 때는 한 줄(tr)을 한 덩어리로 세운다. 맨 앞(시기)과 맨
   뒤(합계)를 같은 줄 양끝에 놓고, 가운데 칸들은 제 머리글을 라벨로
   달고 아래에 잇는다. 칸 수가 셋이든 다섯이든 같은 규칙으로 접히고,
   숨기는 값이 없으니 스크롤만 사라진다.

   접기 여부는 sched-table.js가 실제로 넘쳤는지 재서 .is-stack으로
   알려 준다 — 폭이 아니라 넘침이 기준이라 표가 짧은 페이지는 그대로
   표로 남는다.
   =================================================================== */

.tbl-wrap.is-stack{overflow-x:visible}

.tbl-wrap.is-stack table{display:block; width:100%; min-width:0}
.tbl-wrap.is-stack thead{display:none}
.tbl-wrap.is-stack tbody{display:block}

.tbl-wrap.is-stack tbody tr{
  display:grid; grid-template-columns:minmax(0,1fr) auto;
  align-items:baseline; column-gap:12px; row-gap:3px;
  padding:11px 0; border-top:1px solid var(--line,#e5e8ec);
}
.tbl-wrap.is-stack tbody td{display:block; border:0; padding:0}

/* 시기 — 왼쪽 위 */
.tbl-wrap.is-stack tbody td:first-child{
  grid-area:1/1; text-align:left; font-weight:600;
  white-space:normal; overflow-wrap:anywhere;
}
/* 합계 — 오른쪽 위, 같은 줄 */
.tbl-wrap.is-stack tbody td:last-child{
  grid-area:1/2; text-align:right; white-space:nowrap;
  font-variant-numeric:tabular-nums;
}
/* 가운데 칸 — 머리글을 라벨로 달고 아래 줄에 잇는다 */
.tbl-wrap.is-stack tbody td.s-mid{
  grid-column:1/-1; display:flex; justify-content:space-between; gap:10px;
  font-size:.88em; font-weight:400; color:var(--sub,#6b7684);
  font-variant-numeric:tabular-nums;
}
.tbl-wrap.is-stack tbody td.s-mid::before{
  content:attr(data-label); text-align:left; font-weight:400;
}
/* 값이 없거나(—) 합계와 같은 말이면 굳이 한 줄을 더 쓰지 않는다 */
.tbl-wrap.is-stack tbody td.s-nil{display:none}

/* 합계 줄의 굵은 윗선은 칸이 아니라 줄이 갖는다 */
.tbl-wrap.is-stack tbody tr.tot{border-top:1.5px solid var(--txt,#1c2330)}
.tbl-wrap.is-stack tbody tr.tot td:first-child,
.tbl-wrap.is-stack tbody tr.tot td:last-child{font-weight:700}