/* B08 수량산출 — 위 탭 · 구조물 집계표(PLAN 61-1). 색은 테마 변수만(밝음 · 어두움 같이). */ .b08-quantity { display: flex; flex-direction: column; gap: var(--spacing-16); } .b08-quantity__tabs { display: flex; flex-wrap: wrap; gap: var(--spacing-8); padding-bottom: var(--spacing-8); border-bottom: 1px solid var(--color-border); } /* 집계표 — 칸마다 테두리 · 머리 가운데 · 측점 열은 가로로 밀어도 붙어 있음 */ .b08-summary__wrap { max-height: 70vh; overflow: auto; } .b08-summary__table { width: auto; min-width: 100%; } .b08-summary__table th, .b08-summary__table td { padding: var(--spacing-4, 4px) var(--spacing-8); border: 1px solid var(--color-border); white-space: nowrap; } .b08-summary__table thead th { position: sticky; top: 0; z-index: 1; text-align: center; background: var(--color-surface-raised, var(--color-surface)); color: var(--color-text); } /* 머리 둘째 줄은 첫 줄 아래에 붙음 */ .b08-summary__table thead tr + tr th { top: calc(1lh + 2 * var(--spacing-4, 4px) + 1px); } .b08-summary__table .b08-summary__station { position: sticky; left: 0; z-index: 2; text-align: center; background: var(--color-surface-raised, var(--color-surface)); color: var(--color-text); } .b08-summary__table thead .b08-summary__station { z-index: 3; } .b08-summary__table td { min-width: 80px; background: var(--color-surface); } .b08-summary__name.is-missing { color: var(--color-danger); } /* 3탭 토적표 — 수는 오른쪽 · 합계 줄은 아래에 붙어 굵게 */ .b08-earthwork__table td { text-align: right; } .b08-earthwork__total th, .b08-earthwork__total td { position: sticky; /* 칸 테두리는 표(border-collapse) 것이라 붙은 칸과 같이 안 움직임 — 그림자로 선을 긋고 아래로 1px 더 내려 뒤 줄이 비치지 않게 */ bottom: -1px; z-index: 2; font-weight: 700; background: var(--color-surface-raised, var(--color-surface)); box-shadow: inset 0 2px 0 var(--color-text-muted), 0 1px 0 var(--color-surface-raised, var(--color-surface)); } .b08-earthwork__total th { z-index: 3; }