/* SUB/table_total — 표 (2026-10-28)
   변수: --tb-fs/--tb-fw 내용 · --tb-thfs/--tb-thfw 제목칸 · --tb-py 칸 위아래 여백 · --tb-mo 모바일 비율(0.5~1)
   샘플: tb_pre_line(굵은 윗선+회색 제목) · tb_pre_box(칸 테두리) · tb_pre_dark(진한 제목줄) · tb_pre_simple(가로줄만) */
.table_total { width: 100%; float: left; }
.table_total .wg_side { width: 100%; float: left; position: relative; }
.table_total .sub_stit_box { width: 100%; float: left; margin-bottom: clamp(12px, calc(0.938vw + 9px), 24px); }
/* ★ 제목 줄 = [제목 | 설명 문구(오른쪽)] · 설명 문구 = 출처 등 짧은 글 (제목 오른쪽 / 표 아래 왼쪽 / 표 아래 오른쪽) */
.table_total .tb_head { width: 100%; float: left; display: flex; align-items: flex-end; justify-content: space-between; gap: 6px 16px; flex-wrap: wrap; }
.table_total .tb_head .sub_stit_box { flex: 1 1 auto; width: auto; min-width: 0; }
.table_total .tb_nslot_t { flex: 0 1 auto; margin-left: auto; margin-bottom: clamp(12px, calc(0.938vw + 9px), 24px); text-align: right; }
.table_total .tb_nslot_t:empty { display: none; }
.table_total .tb_nslot_b { width: 100%; float: left; display: flex; justify-content: flex-start; margin-top: 10px; }
.table_total .tb_nslot_b.tb_nslot_r { justify-content: flex-end; text-align: right; }
.table_total .tb_nslot_b:empty { display: none; }
.table_total .tb_note { font-size: 14px; line-height: 1.5; color: #666; word-break: keep-all; }
.table_total .tb_note.tb_note_off { display: none; }
.table_total .admin_div .tb_note.tb_note_off,
.table_total.admin_div .tb_note.tb_note_off { display: block; min-width: 120px; min-height: 1.5em; color: #94a3b8; outline: 1px dashed #cbd5e1; outline-offset: 2px; }
.table_total.admin_div .tb_note.tb_note_off:empty::before { content: '설명 문구 (비어 있음)'; font-size: 12px; }
@media screen and (max-width: 768px) {
  .table_total .tb_note { font-size: 13px; }
  .table_total .tb_nslot_t { margin-bottom: 8px; }
}
.table_total .tb_wrap { width: 100%; float: left; --tb-line: #e5e7eb; --tb-hbg: #f8f9fb; --tb-hc: #111; --tb-c: #333; }
.table_total .tb_scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table_total .tb_table { width: 100%; border-collapse: collapse; border-spacing: 0; table-layout: auto; }
.table_total .tb_table th,
.table_total .tb_table td { padding: var(--tb-py) clamp(8px, calc(0.625vw + 6px), 16px); vertical-align: middle; word-break: keep-all; line-height: 1.5; }
.table_total .tb_table td { font-size: var(--tb-fs); font-weight: var(--tb-fw); color: var(--tb-c); }
.table_total .tb_table th { font-size: var(--tb-thfs); font-weight: var(--tb-thfw); color: var(--tb-hc); background: var(--tb-hbg); }
.table_total .tb_al_left .tb_table th, .table_total .tb_al_left .tb_table td { text-align: left; }
.table_total .tb_al_center .tb_table th, .table_total .tb_al_center .tb_table td { text-align: center; }
.table_total .tb_al_right .tb_table th, .table_total .tb_al_right .tb_table td { text-align: right; }
.table_total .tb_c { min-height: 1.5em; }
/* ★ 칸 안 글(.tb_c.wg_txtN)에 사이트 공통 글자 크기·두께가 걸려 표 설정을 덮던 문제 — 칸(td/th) 값을 그대로 따르게 */
.table_total .tb_wrap .tb_table td { font-size: var(--tb-fs) !important; font-weight: var(--tb-fw) !important; }
.table_total .tb_wrap .tb_table th { font-size: var(--tb-thfs) !important; font-weight: var(--tb-thfw) !important; }
.table_total .tb_wrap .tb_table .tb_c { font-size: inherit !important; font-weight: inherit !important; line-height: inherit; color: inherit; letter-spacing: inherit; }
.table_total .tb_c:empty::before { content: '\00a0'; }
/* 세로형 — 왼쪽 제목칸 폭 기본 25% (열 폭 설정이 있으면 그 값) */
.table_total .tb_type_v .tb_table tbody th { width: 25%; }

/* 샘플 1 — 굵은 윗선 + 회색 제목 + 연한 칸선 (기본) */
.table_total .tb_pre_line .tb_table { border-top: 2px solid #333; }
.table_total .tb_pre_line .tb_table th,
.table_total .tb_pre_line .tb_table td { border: 1px solid var(--tb-line); }
.table_total .tb_pre_line .tb_table tr > :first-child { border-left: 0; }
.table_total .tb_pre_line .tb_table tr > :last-child { border-right: 0; }
.table_total .tb_pre_line .tb_table thead th { border-top: 0; }
.table_total .tb_pre_line.tb_type_v .tb_table tbody tr:first-child > * { border-top: 0; }

/* 샘플 2 — 칸마다 테두리 + 둥근 바깥 */
.table_total .tb_pre_box .tb_table { border: 1px solid #d1d5db; border-radius: 10px; border-collapse: separate; overflow: hidden; }
.table_total .tb_pre_box .tb_table th,
.table_total .tb_pre_box .tb_table td { border-right: 1px solid #d1d5db; border-bottom: 1px solid #d1d5db; }
.table_total .tb_pre_box .tb_table tr > :last-child { border-right: 0; }
.table_total .tb_pre_box .tb_table tbody tr:last-child > * { border-bottom: 0; }
.table_total .tb_pre_box { --tb-hbg: #f1f5f9; }

/* 샘플 3 — 진한 제목줄 (메인컬러) + 줄무늬 */
.table_total .tb_pre_dark { --tb-hbg: var(--primary, #334155); --tb-hc: #fff; }
.table_total .tb_pre_dark .tb_table th,
.table_total .tb_pre_dark .tb_table td { border-bottom: 1px solid var(--tb-line); }
.table_total .tb_pre_dark .tb_table tbody tr:nth-child(even) td { background: #fafafa; }

/* 샘플 4 — 가로줄만 (배경 없음) */
.table_total .tb_pre_simple { --tb-hbg: transparent; }
.table_total .tb_pre_simple .tb_table th,
.table_total .tb_pre_simple .tb_table td { border-bottom: 1px solid var(--tb-line); }
.table_total .tb_pre_simple .tb_table thead th { border-bottom: 2px solid #111; }
.table_total .tb_pre_simple.tb_type_v .tb_table tbody th { border-right: 2px solid #111; }

/* ★ 가로 스크롤 화살표 — 밀 수 있는 쪽에만 반투명으로 (글씨를 가리지 않게 작고 흐리게, 누르면 그쪽으로 이동) */
.table_total .tb_sbox { position: relative; width: 100%; }
.table_total .tb_arr { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 32px; height: 32px; border: 0; border-radius: 50%; background: rgba(15,23,42,.32); color: #fff; font-size: 22px; line-height: 1; display: none; align-items: center; justify-content: center; padding: 0; cursor: pointer; opacity: .8; -webkit-tap-highlight-color: transparent; backdrop-filter: blur(2px); }
.table_total .tb_arr:active { background: rgba(15,23,42,.55); }
.table_total .tb_arr_l { left: 4px; } .table_total .tb_arr_r { right: 4px; }
.table_total .tb_sbox.can-l .tb_arr_l, .table_total .tb_sbox.can-r .tb_arr_r { display: flex; }
.table_total .tb_scroll { scrollbar-width: thin; }

/* ★모바일 — 글자·여백을 비율로 줄이고, 표 폭(--tb-mw)이 100% 보다 크면 가로 스크롤 */
@media screen and (max-width: 768px) {
  .table_total .tb_table { min-width: var(--tb-mw, 100%); }
  .table_total .tb_table th,
  .table_total .tb_table td { padding: calc(var(--tb-py) * var(--tb-mo)) calc(10px * var(--tb-mo)); }
  .table_total .tb_wrap .tb_table td { font-size: calc(var(--tb-fs) * var(--tb-mo)) !important; }
  .table_total .tb_wrap .tb_table th { font-size: calc(var(--tb-thfs) * var(--tb-mo)) !important; }
}

/* ── 관리자 [표 설정] 버튼 + 설정창 ── */
.table_total .tb_set_bar { width: 100%; float: left; display: flex; justify-content: flex-end; margin-bottom: 6px; position: relative; z-index: 30; }
.table_total .tb_set_btn { position: relative; z-index: 30; height: 30px; padding: 0 12px; border: 0; border-radius: 6px; background: #0f766e; color: #fff; font-size: 12px; font-weight: 700; cursor: pointer; box-shadow: 0 2px 6px rgba(15,118,110,.35); }
.table_total .tb_set_btn:hover { background: #115e59; }
.table_total .tb_set_bar { gap: 6px; }
.table_total .tb_mg_btn { position: relative; z-index: 30; height: 30px; padding: 0 12px; border: 1px solid #0f766e; border-radius: 6px; background: #fff; color: #0f766e; font-size: 12px; font-weight: 700; cursor: pointer; }
.table_total .tb_mg_btn:hover, .table_total .tb_mg_btn.on { background: #0f766e; color: #fff; }

/* ★ 웹접근성 버전 (2026-10-29) — tb_a11y
   글자 대비 4.5:1 이상(본문 #222·제목 #111 / 진한 제목줄 #1e293b 바탕 + 흰 글) · 글자 최소 15px(모바일 14px) · 줄 간격 1.6
   표 제목 caption(숨김이면 화면낭독기만) · 가로 스크롤 영역 키보드 포커스 표시 · 화살표 버튼 진하게 */
.table_total .tb_sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
.table_total .tb_cap { caption-side: top; text-align: left; padding: 0 0 10px; font-size: 16px; font-weight: 700; color: #111; }
.table_total .tb_a11y { --tb-c: #222; --tb-hc: #111; --tb-line: #c4c8cf; }
.table_total .tb_a11y.tb_pre_line, .table_total .tb_a11y.tb_pre_box { --tb-hbg: #f1f3f5; }
.table_total .tb_a11y.tb_pre_dark { --tb-hbg: #1e293b; --tb-hc: #fff; }
.table_total .tb_a11y .tb_table th, .table_total .tb_a11y .tb_table td { line-height: 1.6; }
.table_total .tb_wrap.tb_a11y .tb_table td { font-size: max(15px, var(--tb-fs)) !important; }
.table_total .tb_wrap.tb_a11y .tb_table th { font-size: max(15px, var(--tb-thfs)) !important; }
.table_total .tb_a11y .tb_scroll:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 2px; }
.table_total .tb_a11y .tb_arr { background: rgba(15,23,42,.72); opacity: 1; }
.table_total .tb_a11y .tb_arr:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 2px; }
.table_total .tb_a11y ~ .tb_nslot .tb_note, .table_total .tb_a11y .tb_note { color: #4b5563; }
@media screen and (max-width: 768px) {
  .table_total .tb_wrap.tb_a11y .tb_table td { font-size: max(14px, calc(var(--tb-fs) * var(--tb-mo))) !important; }
  .table_total .tb_wrap.tb_a11y .tb_table th { font-size: max(14px, calc(var(--tb-thfs) * var(--tb-mo))) !important; }
}
/* 설정창 — 접근성 묶음 */
.tbset-a11y { padding: 10px 12px; border: 1px solid #bfdbfe; border-radius: 8px; background: #eff6ff; }
.tbset-a11y-go { height: 34px; padding: 0 14px; border: 0; border-radius: 7px; background: #1d4ed8; color: #fff; font-size: 12px; font-weight: 700; cursor: pointer; }
.tbset-a11y-go:hover { background: #1e40af; }
.tbset-a11y ul { margin: 6px 0 0; padding-left: 18px; font-size: 11px; color: #475569; line-height: 1.6; }
.tbset-a11y li.ok { color: #15803d; }

/* ★ 칸 병합 (2026-10-29) — 덮인 칸 숨김 · 병합 모드 선택 표시 · 떠 있는 병합 도구 */
.table_total .tb_table .tb_mg_x { display: none !important; }
.table_total .tb_mgmode .tb_table th, .table_total .tb_mgmode .tb_table td { cursor: cell; user-select: none; }
.table_total .tb_mgmode .tb_table th:hover, .table_total .tb_mgmode .tb_table td:hover { box-shadow: inset 0 0 0 2px #5eead4; }
.table_total .tb_table .tb_mg_sel { background-color: rgba(13,148,136,.16) !important; box-shadow: inset 0 0 0 2px #0d9488 !important; }
.table_total .tb_mgmode .tb_table { outline: 2px dashed #0d9488; outline-offset: 3px; }
.tbmg-bar { position: absolute; z-index: 10000005; display: flex; align-items: center; gap: 6px; padding: 6px 8px; background: #fff; border: 1px solid #99f6e4; border-radius: 10px; box-shadow: 0 8px 24px rgba(15,23,42,.18); font-size: 12px; color: #334155; white-space: nowrap; }
.tbmg-bar .tbmg-info { padding: 0 4px; font-weight: 600; color: #0f766e; }
.tbmg-bar .tbmg-msg { color: #0f766e; }
.tbmg-bar .tbmg-msg:empty { display: none; }
.tbmg-bar button { display: inline-flex; align-items: center; gap: 4px; height: 30px; padding: 0 10px; border: 1px solid #cbd5e1; border-radius: 6px; background: #fff; color: #334155; font-size: 12px; font-weight: 600; cursor: pointer; }
.tbmg-bar button[data-mg="merge"] { background: #0f766e; border-color: #0f766e; color: #fff; }
.tbmg-bar button:disabled { opacity: .4; cursor: default; }
.tbmg-bar .tbmg-close { background: #e2e8f0; border-color: #e2e8f0; }
.tbset { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 10000010; width: 640px; max-width: 96vw; max-height: 90vh; background: #fff; border-radius: 12px; box-shadow: 0 20px 60px rgba(0,0,0,.3); display: flex; flex-direction: column; overflow: hidden; font-size: 13px; color: #1e293b; }
.tbset-head { display: flex; align-items: center; gap: 8px; padding: 13px 16px; background: linear-gradient(135deg, #0f766e, #0d9488); color: #fff; cursor: move; user-select: none; }
.tbset-head b { font-size: 15px; }
.tbset-head small { opacity: .8; }
.tbset-x { margin-left: auto; width: 30px; height: 30px; border: 0; border-radius: 6px; background: rgba(255,255,255,.2); color: #fff; font-size: 20px; cursor: pointer; }
.tbset-body { flex: 1; overflow-y: auto; padding: 14px 16px; }
.tbset-sec { margin-bottom: 14px; }
.tbset-sec > label, .tbset-lb { display: block; font-size: 12px; font-weight: 700; color: #475569; margin-bottom: 6px; }
.tbset-pre { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.tbset-pre button { padding: 8px 6px; border: 2px solid #e2e8f0; border-radius: 8px; background: #fff; cursor: pointer; font-size: 12px; font-weight: 600; color: #334155; }
.tbset-pre button.on { border-color: #0f766e; background: #f0fdfa; color: #0f766e; }
.tbset-pre i { display: block; height: 30px; margin-bottom: 6px; border-radius: 4px; }
.tbset-pre [data-v="line"] i { background: linear-gradient(#333 0 2px, #f8f9fb 2px 12px, #e5e7eb 12px 13px, #fff 13px 21px, #e5e7eb 21px 22px, #fff 22px); }
.tbset-pre [data-v="box"] i { border: 1px solid #94a3b8; background: linear-gradient(#f1f5f9 0 10px, #94a3b8 10px 11px, #fff 11px 20px, #94a3b8 20px 21px, #fff 21px); }
.tbset-pre [data-v="dark"] i { background: linear-gradient(#334155 0 10px, #fff 10px 19px, #fafafa 19px 28px, #fff 28px); }
.tbset-pre [data-v="simple"] i { background: linear-gradient(#fff 0 9px, #111 9px 11px, #fff 11px 19px, #e5e7eb 19px 20px, #fff 20px); }
.tbset-seg { display: inline-flex; border: 1px solid #cbd5e1; border-radius: 7px; overflow: hidden; }
.tbset-seg button { padding: 6px 12px; border: 0; border-right: 1px solid #cbd5e1; background: #fff; cursor: pointer; font-size: 12px; color: #334155; }
.tbset-seg button:last-child { border-right: 0; }
.tbset-seg button.on { background: #0f766e; color: #fff; }
.tbset-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.tbset-row + .tbset-row { margin-top: 8px; }
.tbset-row > span { min-width: 64px; font-size: 12px; color: #475569; }
/* 사이트 공통 input/select 폭(100%)을 이기도록 .tbset 로 한 번 더 감쌈 */
.tbset .tbset-num { width: 70px !important; flex: 0 0 70px; height: 30px; padding: 0 6px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 13px; box-sizing: border-box; margin: 0; }
.tbset .tbset-sel { width: auto !important; flex: 0 0 auto; height: 30px; padding: 0 6px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 12px; margin: 0; }
.tbset .tbset-row { flex-wrap: nowrap; }
.tbset .tbset-row > span { flex: 0 0 auto; }
.tbset .tbset-col select { width: auto !important; }
.tbset .tbset-col input { width: 52px !important; margin: 0; }
.tbset .tbset-range { width: 140px !important; flex: 0 0 140px; margin: 0; }
.tbset-foot .tbset-json { height: 34px; padding: 0 12px; border: 1px solid #99f6e4; border-radius: 7px; background: #f0fdfa; color: #0f766e; font-size: 12px; font-weight: 600; cursor: pointer; }
.tbset-foot .tbset-json:hover { background: #ccfbf1; }
.tbset-range { width: 140px; accent-color: #0f766e; }
.tbset-cols { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 6px; }
.tbset-col { display: flex; align-items: center; gap: 4px; padding: 6px 8px; border: 1px solid #e2e8f0; border-radius: 7px; background: #f8fafc; font-size: 12px; }
.tbset-col b { min-width: 30px; color: #0f766e; }
.tbset-col select { flex: 1 1 auto; min-width: 0; height: 28px; border: 1px solid #cbd5e1; border-radius: 5px; font-size: 12px; }
.tbset-col input { flex: 0 0 52px; width: 52px; height: 28px; padding: 0 6px; border: 1px solid #cbd5e1; border-radius: 5px; font-size: 13px; text-align: right; -moz-appearance: textfield; }
.tbset-col input::-webkit-outer-spin-button, .tbset-col input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.table_total .tb_table .tb_new { outline: 1px dashed #5eead4; outline-offset: -3px; }
.tbset-hint { font-size: 11px; color: #94a3b8; margin-top: 4px; line-height: 1.5; }
.tbset-foot { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-top: 1px solid #e2e8f0; background: #f8fafc; }
.tbset-foot .msg { margin-right: auto; font-size: 12px; color: #0f766e; }
.tbset-foot button { height: 34px; padding: 0 18px; border: 0; border-radius: 7px; cursor: pointer; font-size: 13px; font-weight: 600; }
.tbset-cancel { background: #e2e8f0; color: #334155; }
.tbset-save { background: #0f766e; color: #fff; }
@media (max-width: 640px) { .tbset-pre { grid-template-columns: repeat(2, minmax(0, 1fr)); } }