@charset "utf-8";
/* 동탄 테마: 아카라이브식 촘촘한 커뮤니티 레이아웃. default.css 위에 덮어쓴다. */

:root {
    --dt-bg: #f2f3f5;
    --dt-surface: #ffffff;
    --dt-surface-2: #f7f8fa;
    --dt-border: #e1e3e8;
    --dt-text: #1d2129;
    --dt-text-2: #5f6673;
    --dt-text-3: #8b919c;
    --dt-primary: #0f8a6c;  /* 동탄 호수공원 초록 */
    --dt-primary-text: #ffffff;
    --dt-header: #0d3b36;
    --dt-header-text: #ffffff;
    --dt-up: #e5383b;
    --dt-down: #1c64f2;
    --dt-notice: #f59f00;
    --dt-ai: #7c4dff;
    --dt-visited: #7a7f88;
    --dt-c-red: #d92d20;     /* 에디터 글자색: 라이트/다크마다 읽히는 색으로 */
    --dt-c-orange: #c2570c;
    --dt-c-green: #0f8a6c;
    --dt-c-blue: #1c64f2;
    --dt-c-purple: #7c4dff;
    --dt-c-gray: #6b7280;
    --dt-radius: 6px;
    --dt-width: 1200px;
}

:root[data-theme="dark"] {
    --dt-bg: #0f1115;
    --dt-surface: #181b21;
    --dt-surface-2: #1f232b;
    --dt-border: #2b3039;
    --dt-text: #e6e8ec;
    --dt-text-2: #a7adb8;
    --dt-text-3: #7d8490;
    --dt-primary: #34c39b;
    --dt-header: #08201d;
    --dt-up: #ff5c5f;
    --dt-down: #5b9dff;
    --dt-visited: #8a909a;
    --dt-c-red: #ff6b6b;
    --dt-c-orange: #ffa94d;
    --dt-c-green: #4cd4a8;
    --dt-c-blue: #74a7ff;
    --dt-c-purple: #b197fc;
    --dt-c-gray: #9aa1ad;
}

html, body { background: var(--dt-bg); color: var(--dt-text); }
#hd, #wrapper, #ft { min-width: 0; }
body { font-family: "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; font-size: 14px; }
a { color: inherit; }
#hd_login_msg { position: absolute; left: -9999px; }

.dt-inner { max-width: var(--dt-width); margin: 0 auto; padding: 0 16px; box-sizing: border-box; }

/* 상단 */
#hd.dt-hd { background: var(--dt-header); color: var(--dt-header-text); position: sticky; top: 0; z-index: 100; }
.dt-topbar .dt-inner { display: flex; align-items: center; gap: 16px; height: 52px; }
.dt-logo { display: flex; align-items: center; gap: 8px; font-size: 20px; font-weight: 800; color: var(--dt-header-text); text-decoration: none; letter-spacing: -0.5px; }
.dt-logo-mark { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 7px; background: var(--dt-primary); font-size: 15px; }
.dt-search { flex: 1; max-width: 420px; display: flex; background: rgba(255,255,255,.12); border-radius: 18px; overflow: hidden; }
.dt-search input { flex: 1; min-width: 0; height: 34px; padding: 0 14px; border: 0; background: transparent; color: #fff; font-size: 14px; }
.dt-search input::placeholder { color: rgba(255,255,255,.6); }
.dt-search button { width: 40px; border: 0; background: transparent; color: #fff; cursor: pointer; }
.dt-user { margin-left: auto; display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.dt-user a { color: var(--dt-header-text); text-decoration: none; font-size: 13px; }
.dt-nick { font-weight: 700; }
.dt-link { opacity: .8; }
.dt-icon-btn { width: 34px; height: 34px; border: 0; border-radius: 50%; background: transparent; color: var(--dt-header-text); font-size: 16px; cursor: pointer; }
.dt-icon-btn:hover { background: rgba(255,255,255,.12); }
.dt-menu-btn { display: none; }
.dt-btn { display: inline-block; padding: 6px 14px; border-radius: var(--dt-radius); font-size: 13px; font-weight: 700; text-decoration: none; }
.dt-btn-primary { background: var(--dt-primary); color: var(--dt-primary-text) !important; }

#gnb.dt-nav { background: var(--dt-surface); border-bottom: 1px solid var(--dt-border); }
.dt-nav ul { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; overflow-x: auto; scrollbar-width: none; }
.dt-nav ul::-webkit-scrollbar { display: none; }
.dt-nav li a { display: block; padding: 11px 12px; color: var(--dt-text-2); font-weight: 600; text-decoration: none; white-space: nowrap; border-bottom: 2px solid transparent; }
.dt-nav li a:hover { color: var(--dt-text); }
.dt-nav li.on a { color: var(--dt-primary); border-bottom-color: var(--dt-primary); }


/* 본문 2단 */
#wrapper.dt-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; width: auto; min-width: 0; margin: 16px auto; background: none; }
#container.dt-main { min-width: 0; width: auto; min-height: 0; float: none; margin: 0; padding: 0; background: none; }
#aside.dt-aside { min-width: 0; width: auto; height: auto; float: none; margin: 0; display: flex; flex-direction: column; gap: 12px; }
#aside.dt-aside #ol_before, #aside.dt-aside #ol_after { width: auto; margin: 0; border-radius: var(--dt-radius); background: var(--dt-surface); border: 1px solid var(--dt-border); }
.dt-page-title { margin: 0 0 12px; font-size: 18px; }

/* 박스 */
.dt-box { background: var(--dt-surface); border: 1px solid var(--dt-border); border-radius: var(--dt-radius); overflow: hidden; }
.dt-box-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 0; padding: 11px 14px; font-size: 15px; font-weight: 800; border-bottom: 1px solid var(--dt-border); }
.dt-box-title a { text-decoration: none; }
.dt-more { font-size: 12px; font-weight: 500; color: var(--dt-text-3); }
.dt-empty { padding: 24px 14px; color: var(--dt-text-3); text-align: center; font-size: 13px; }

/* 메인 최신글 */
.dt-latest-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dt-lat ul { margin: 0; padding: 4px 0; list-style: none; }
.dt-lat li { display: flex; align-items: center; gap: 6px; padding: 6px 14px; font-size: 13.5px; }
.dt-lat li:hover { background: var(--dt-surface-2); }
.dt-lat-subject { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.dt-lat-subject:visited { color: var(--dt-visited); }
.dt-lat-time { flex: none; color: var(--dt-text-3); font-size: 12px; }
.dt-lat li.is-notice .dt-lat-subject { font-weight: 700; }
.dt-lat-hotdeal { grid-column: 1 / -1; }

/* 공통 배지 */
.dt-cate { flex: none; white-space: nowrap; display: inline-block; margin-right: 4px; padding: 0 6px; border-radius: 4px; background: var(--dt-surface-2); border: 1px solid var(--dt-border); color: var(--dt-text-2); font-size: 11.5px; line-height: 18px; text-decoration: none; vertical-align: 1px; }
.dt-cmt { flex: none; color: var(--dt-primary); font-size: 12px; font-weight: 700; }
.dt-new { display: inline-block; margin-left: 2px; padding: 0 4px; border-radius: 3px; background: var(--dt-up); color: #fff; font-size: 10px; line-height: 15px; font-weight: 700; vertical-align: 1px; }
.dt-ai-badge { display: inline-block; padding: 0 5px; border-radius: 3px; background: var(--dt-ai); color: #fff; font-size: 10.5px; line-height: 16px; font-weight: 700; vertical-align: 1px; }
.dt-source { margin-top: 18px; padding-top: 10px; border-top: 1px dashed var(--dt-border); color: #888; font-size: 13px; }
#bo_v_con p { margin: 0 0 0.9em; }

/* 에디터로 꾸민 글 (plugin/editor/quill). 글자색은 클래스로만 오므로 테마 색을 쓴다 */
html #bo_v_con a { color: var(--dt-primary); }
html #bo_v_con h2 { font-size: 1.45em; font-weight: 800; margin: 1em 0 .5em; }
html #bo_v_con h3 { font-size: 1.2em; font-weight: 700; margin: .9em 0 .4em; }
html #bo_v_con ul, html #bo_v_con ol { margin: 0 0 .9em; padding-left: 1.6em; }
html #bo_v_con ul > li { list-style: disc; }
html #bo_v_con ol > li { list-style: decimal; }
html #bo_v_con blockquote { margin: 0 0 .9em; padding: 4px 14px; border-left: 4px solid var(--dt-border); color: var(--dt-text-2); }
html #bo_v_con .ql-align-center { text-align: center; }
html #bo_v_con .ql-align-right { text-align: right; }
html #bo_v_con .ql-align-justify { text-align: justify; }
html #bo_v_con .ql-video { display: block; width: 100%; max-width: 720px; aspect-ratio: 16 / 9; height: auto; margin: 0 auto .9em; border: 0; }
html #bo_v_con p.ql-align-center .ql-video, html #bo_v_con .ql-video.ql-align-center { margin-left: auto; margin-right: auto; }
html #bo_v_con .ql-indent-1 { padding-left: 2em; }
html #bo_v_con .ql-indent-2 { padding-left: 4em; }
html #bo_v_con .ql-indent-3 { padding-left: 6em; }
html #bo_v_con .ql-indent-4 { padding-left: 8em; }
html #bo_v_con .ql-indent-5 { padding-left: 10em; }
html #bo_v_con .ql-indent-6 { padding-left: 12em; }
html #bo_v_con .ql-indent-7 { padding-left: 14em; }
html #bo_v_con .ql-indent-8 { padding-left: 16em; }
html #bo_v_con .ql-color-red, .ql-editor .ql-color-red { color: var(--dt-c-red); }
html #bo_v_con .ql-color-orange, .ql-editor .ql-color-orange { color: var(--dt-c-orange); }
html #bo_v_con .ql-color-green, .ql-editor .ql-color-green { color: var(--dt-c-green); }
html #bo_v_con .ql-color-blue, .ql-editor .ql-color-blue { color: var(--dt-c-blue); }
html #bo_v_con .ql-color-purple, .ql-editor .ql-color-purple { color: var(--dt-c-purple); }
html #bo_v_con .ql-color-gray, .ql-editor .ql-color-gray { color: var(--dt-c-gray); }
.dt-notice { color: var(--dt-notice); font-weight: 800; }

/* 실시간 베스트 */
.dt-best ol { margin: 0; padding: 4px 0; list-style: none; }
.dt-best li { display: flex; align-items: center; gap: 8px; padding: 6px 14px; font-size: 13px; }
.dt-best li a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.dt-rank { flex: none; width: 18px; color: var(--dt-text-3); font-weight: 800; text-align: center; }
.dt-best li:nth-child(-n+3) .dt-rank { color: var(--dt-up); }
.dt-best-bo { color: var(--dt-text-3); font-size: 11.5px; margin-right: 4px; }
.dt-best .fa-fire { color: var(--dt-up); }

/* 게시판 목록 */
.dt-board { background: var(--dt-surface); border: 1px solid var(--dt-border); border-radius: var(--dt-radius); }
.dt-board-title { margin: 0; padding: 14px 16px 6px; font-size: 18px; font-weight: 800; }
.dt-board-title a { text-decoration: none; }
.dt-board #bo_cate { margin: 0; padding: 4px 16px 8px; }
.dt-board #bo_cate h2 { position: absolute; left: -9999px; }
.dt-board #bo_cate ul { display: flex; flex-wrap: wrap; gap: 6px; padding: 0; }
.dt-board #bo_cate li { display: block; padding: 0; float: none; }
.dt-board #bo_cate a { display: block; padding: 3px 10px; border: 1px solid var(--dt-border); border-radius: 14px; background: var(--dt-surface); color: var(--dt-text-2); font-size: 12.5px; line-height: 1.5; }
.dt-board #bo_cate #bo_cate_on { background: var(--dt-primary); border-color: var(--dt-primary); color: #fff; box-shadow: none; }
.dt-board #bo_btn_top { padding: 0 16px; margin: 6px 0; }
.dt-list-tabs { display: flex; gap: 2px; padding: 0 16px; border-bottom: 1px solid var(--dt-border); }
.dt-list-tabs a { padding: 8px 10px; color: var(--dt-text-3); font-weight: 700; text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.dt-list-tabs a.on { color: var(--dt-text); border-bottom-color: var(--dt-text); }

.dt-list { font-size: 13.5px; }
.dt-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) 120px 64px 52px 44px; align-items: center; min-height: 38px; padding: 0 16px; border-bottom: 1px solid var(--dt-border); }
.dt-board .dt-row:has(.dt-c-chk) { grid-template-columns: 28px 64px minmax(0, 1fr) 120px 64px 52px 44px; }
.dt-row:hover { background: var(--dt-surface-2); }
.dt-row-head { min-height: 32px; color: var(--dt-text-3); font-size: 12px; font-weight: 700; background: var(--dt-surface-2); }
.dt-row.is-notice { background: color-mix(in srgb, var(--dt-notice) 8%, var(--dt-surface)); }
.dt-row.is-current { background: color-mix(in srgb, var(--dt-primary) 8%, var(--dt-surface)); }
.dt-row > span { min-width: 0; }
.dt-c-num, .dt-c-hit, .dt-c-good, .dt-c-time { text-align: center; color: var(--dt-text-3); font-size: 12px; font-variant-numeric: tabular-nums; }
.dt-c-subject { display: flex; align-items: center; gap: 4px; overflow: hidden; padding: 8px 8px 8px 0; }
.dt-subject { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-decoration: none; }
.dt-subject:visited { color: var(--dt-visited); }
.dt-c-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--dt-text-2); font-size: 12.5px; }
.dt-c-name .sv_wrap { display: inline; }
.dt-c-good { color: var(--dt-up); font-weight: 700; }
.dt-m-label { display: none; }
.dt-board .pg_wrap { padding: 16px; margin: 0; }
.dt-board .bo_fx { padding: 0 16px 16px; }

/* 기본 스킨 요소 다크모드 대응 */
html #bo_v, html #bo_w, #bo_vc, .bo_vc_w, html #bo_v_con, .tbl_head01 td, .frm_input, textarea, select { color: var(--dt-text); }
/* 게시판 스킨 style.css 가 나중에 읽혀 흰 배경으로 덮으므로 html 을 붙여 우선한다 */
html #bo_v, html #bo_w { background: var(--dt-surface); border: 1px solid var(--dt-border); border-radius: var(--dt-radius); padding: 20px; box-sizing: border-box; }
.frm_input, textarea, select, .bo_vc_w textarea { background: var(--dt-surface); border-color: var(--dt-border) !important; }
#bo_vc article .cm_wrap, #bo_vc article { border-color: var(--dt-border); }
.pg_page, .pg_current { background: var(--dt-surface); border-color: var(--dt-border); color: var(--dt-text-2); }
.pg_current { background: var(--dt-primary); border-color: var(--dt-primary); color: #fff; }

/* 회원 스킨(회원가입·로그인·쪽지·포인트 등) 다크모드: 흰 배경이 고정돼 있어 밝은 글자가 묻힌다 */
:root[data-theme="dark"] #register_form, :root[data-theme="dark"] .register_form_inner,
:root[data-theme="dark"] .mbskin .mbskin_box, :root[data-theme="dark"] #fregister textarea,
:root[data-theme="dark"] .fregister_terms div, :root[data-theme="dark"] #fregister_chkall,
:root[data-theme="dark"] .fregister_terms table th, :root[data-theme="dark"] #find_info .new_win_con,
:root[data-theme="dark"] .mb_log_cate .join, :root[data-theme="dark"] #mb_login_od_wr p,
:root[data-theme="dark"] .memo_list li, :root[data-theme="dark"] .memo_from, :root[data-theme="dark"] #memo_view p,
:root[data-theme="dark"] #memo_view_ul, :root[data-theme="dark"] .point_list li, :root[data-theme="dark"] #scrap_do .scrap_tit,
:root[data-theme="dark"] #reg_result, :root[data-theme="dark"] #reg_result #result_email, :root[data-theme="dark"] #guest_privacy {
    background: var(--dt-surface); color: var(--dt-text); border-color: var(--dt-border);
}
:root[data-theme="dark"] .register_form_inner, :root[data-theme="dark"] .memo_list li.read,
:root[data-theme="dark"] .point_list .point_use { background: var(--dt-surface-2); }
:root[data-theme="dark"] #register_form h2, :root[data-theme="dark"] .fregister_terms table th,
:root[data-theme="dark"] .fregister_agree input[type="checkbox"]:checked + label,
:root[data-theme="dark"] #point .point_all .full_li span { color: var(--dt-text); border-color: var(--dt-border); }
:root[data-theme="dark"] .register_form_inner label, :root[data-theme="dark"] .fregister_agree input[type="checkbox"] + label { color: var(--dt-text-2); }
:root[data-theme="dark"] #mb_confirm fieldset .frm_input, :root[data-theme="dark"] #pw_confirm fieldset .frm_input { background-color: var(--dt-surface) !important; }

/* 자동등록방지 입력칸, 취소 버튼: 기본 CSS 의 흰 배경 고정을 테마 색으로 */
#captcha #captcha_key { background: var(--dt-surface); color: var(--dt-text); border-color: var(--dt-border); }
.btn_close, a.btn_close { background: var(--dt-surface); color: var(--dt-text-2); border-color: var(--dt-border); }
.btn_close:hover, a.btn_close:hover { color: var(--dt-text); }

/* 그누보드 공용 표(새글, 포인트, 스크랩 등)와 새글 검색 상자 다크모드 */
:root[data-theme="dark"] .tbl_wrap table, :root[data-theme="dark"] .tbl_head02 tbody th, :root[data-theme="dark"] .tbl_head02 td, :root[data-theme="dark"] #new_sch { background: var(--dt-surface); border-color: var(--dt-border); }
:root[data-theme="dark"] .tbl_head01 thead th, :root[data-theme="dark"] .tbl_head02 thead th, :root[data-theme="dark"] .tbl_frm01 th, :root[data-theme="dark"] .tbl_head01 tfoot th, :root[data-theme="dark"] .tbl_head01 tfoot td,
:root[data-theme="dark"] .tbl_head02 tfoot th, :root[data-theme="dark"] .tbl_head02 tfoot td { background: var(--dt-surface-2); color: var(--dt-text); border-color: var(--dt-border); }
:root[data-theme="dark"] .tbl_head01 td, :root[data-theme="dark"] .tbl_head02 td, :root[data-theme="dark"] .tbl_head01 td a, :root[data-theme="dark"] .tbl_head02 td a, :root[data-theme="dark"] .tbl_head02 thead a { color: var(--dt-text-2); border-color: var(--dt-border); }
:root[data-theme="dark"] .tbl_head01 tbody tr:hover td { background: var(--dt-surface-2); }
:root[data-theme="dark"] .empty_table, :root[data-theme="dark"] #new_sch p { color: var(--dt-text-3); }

/* 새글 그룹·게시판 라벨: 기본 스킨의 연한 글자를 진하게 (스킨 CSS 가 나중에 읽혀서 #container 로 우선순위를 올린다) */
#container #fnewlist .td_group a { color: #3f7a12; }
#container #fnewlist .td_board a { color: #5b3fc0; }
:root[data-theme="dark"] #container #fnewlist .td_group a { background: rgba(140,193,82,.18); color: #a6dd6e; }
:root[data-theme="dark"] #container #fnewlist .td_board a { background: rgba(172,146,236,.18); color: #c6b3ff; }

/* 체크박스 라벨(글쓰기 공지·비밀글, 자동로그인 등): 아웃로그인 스킨이 나중에 읽히며 체크 시 검은 글자로 덮어써서 body 로 우선순위를 올린다 */
body .chk_box input[type="checkbox"] + label { color: var(--dt-text-2); }
body .chk_box input[type="checkbox"]:checked + label { color: var(--dt-text); }
/* 게시판 스킨(style.css)에 박힌 흰 배경·검정 글자를 테마 색으로 (다크모드) */
html .btn_bo_user li, html .more_opt, html .more_opt li button, html .more_opt li a, html #bo_v_top ul, html .cmt_btn, html .bo_vc_act, html #autosave_pop, html .bo_sch, html .bo_sch .bo_sch_cls { background: var(--dt-surface); color: var(--dt-text-2); border-color: var(--dt-border); }
html .more_opt li:hover button, html .cmt_btn b, html .bo_tit, html .td_num strong, html #bo_v_info .sv_member, html #bo_v_file a, html #bo_v_link a { color: var(--dt-text); }
html .cmt_btn { border-bottom-color: var(--dt-border); }
html .bo_vc_w textarea, html #bo_w .bo_w_flie .file_wr { background: var(--dt-surface); color: var(--dt-text); border-color: var(--dt-border); }
html #bo_v_share .btn { width: auto; white-space: nowrap; background: var(--dt-surface); color: var(--dt-text-2); border-color: var(--dt-border); }
html #bo_v_share .btn:hover { background: var(--dt-surface-2); }

/* 글쓰기 옵션 체크박스 (공지, 비밀글, 답변메일): 다크모드에서 글자가 묻히지 않게 */
#bo_w .chk_box input[type="checkbox"] + label, html .bo_vc_w .chk_box input[type="checkbox"] + label { color: var(--dt-text-2); }
#bo_w .chk_box input[type="checkbox"]:checked + label, html .bo_vc_w .chk_box input[type="checkbox"]:checked + label { color: var(--dt-text); }
#bo_w .chk_box input[type="checkbox"] + label:hover, html .bo_vc_w .chk_box input[type="checkbox"] + label:hover { color: var(--dt-primary); }
#bo_w .chk_box input[type="checkbox"] + label span, html .bo_vc_w .chk_box input[type="checkbox"] + label span { background-color: var(--dt-surface); border-color: var(--dt-text-3); }
#bo_w .chk_box input[type="checkbox"]:checked + label span, html .bo_vc_w .chk_box input[type="checkbox"]:checked + label span { background-color: var(--dt-primary); border-color: var(--dt-primary); }
#bo_w .chk_box input[type="checkbox"]:focus-visible + label span { outline: 2px solid var(--dt-primary); outline-offset: 1px; }

/* 버튼, 로그인 박스 */
.dt-board .btn_bo_user .btn, .dt-board .btn_b01 { background: var(--dt-surface) !important; color: var(--dt-text-2) !important; border: 1px solid var(--dt-border) !important; border-radius: var(--dt-radius); }
#ol_before #ol_be_cate h2, #ol_before #ol_be_cate .join { background: var(--dt-surface-2); color: var(--dt-text-2); border-color: var(--dt-border); }
#ol_before #ol_be_cate h2 { background: var(--dt-surface); color: var(--dt-text); }
#ol_before input[type=text], #ol_before input[type=password] { background: var(--dt-surface); color: var(--dt-text); border-color: var(--dt-border); }
#ol_after { color: var(--dt-text); }

/* 하단 */
#ft.dt-ft { text-align: left; margin-top: 24px; padding: 24px 0 40px; background: var(--dt-surface); border-top: 1px solid var(--dt-border); color: var(--dt-text-3); font-size: 12px; }
.dt-ft-links { display: flex; gap: 16px; margin-bottom: 10px; }
.dt-ft-links a { text-decoration: none; color: var(--dt-text-2); }
.dt-ft-notice { margin: 0 0 6px; line-height: 1.6; }
.dt-ft-copy { margin: 0; }
#top_btn { position: fixed; right: 20px; bottom: 20px; width: 40px; height: 40px; border: 1px solid var(--dt-border); border-radius: 50%; background: var(--dt-surface); color: var(--dt-text-2); cursor: pointer; }

/* 서랍 (모바일 게시판 메뉴) */
.dt-drawer-bg { display: none; }

@media (max-width: 1024px) {
    #wrapper.dt-wrap { grid-template-columns: minmax(0, 1fr); }
    .dt-aside { order: 2; }
}

@media (max-width: 768px) {
    .dt-inner { padding: 0 12px; }
    .dt-topbar .dt-inner { gap: 8px; }
    .dt-menu-btn { display: inline-block; }
    .dt-logo { font-size: 18px; }
    .dt-search { display: none; }
    .dt-user .dt-link { display: none; }
    #wrapper.dt-wrap { margin: 8px auto; gap: 8px; padding: 0; }
    .dt-latest-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .dt-box, .dt-board { border-radius: 0; border-left: 0; border-right: 0; }

    /* 목록: 1행 제목, 2행 작성자·시간·조회·추천 */
    .dt-row, .dt-board .dt-row:has(.dt-c-chk) { display: flex; flex-wrap: wrap; gap: 0 10px; padding: 8px 12px; }
    .dt-row.dt-row-head { display: none; }
    .dt-c-num { display: none; }
    .dt-row.is-notice .dt-c-num { display: inline; order: -1; }
    .dt-c-chk { order: -2; }
    .dt-c-subject { flex: 1 0 100%; padding: 0 0 4px; }
    .dt-c-name, .dt-c-time, .dt-c-hit, .dt-c-good { text-align: left; font-size: 12px; }
    .dt-m-label { display: inline; margin-right: 3px; color: var(--dt-text-3); font-weight: 400; }

    body.dt-drawer-open .dt-nav { position: fixed; top: 0; left: 0; bottom: 0; width: 240px; z-index: 300; overflow-y: auto; border-right: 1px solid var(--dt-border); }
    body.dt-drawer-open .dt-nav ul { flex-direction: column; overflow: visible; padding: 12px 0; }
    body.dt-drawer-open .dt-nav li a { border-bottom: 0; border-left: 3px solid transparent; padding: 12px 18px; }
    body.dt-drawer-open .dt-nav li.on a { border-left-color: var(--dt-primary); }
    body.dt-drawer-open .dt-drawer-bg { display: block; position: fixed; inset: 0; z-index: 250; background: rgba(0,0,0,.45); }
}
.dt-best .dt-box-title { justify-content: flex-start; }

/* 두 번째 줄 메뉴 (동네, 핫딜 하위 게시판) */
.dt-subnav { background: var(--dt-surface-2); border-bottom: 1px solid var(--dt-border); font-size: 13px; }
.dt-subnav .dt-inner { display: flex; gap: 4px; align-items: center; height: 38px; overflow-x: auto; white-space: nowrap; scrollbar-width: none; }
.dt-subnav .dt-inner::-webkit-scrollbar { display: none; }
.dt-subnav a { padding: 4px 10px; border-radius: 14px; color: var(--dt-text-2); text-decoration: none; }
.dt-subnav a:hover { background: var(--dt-surface); }
.dt-subnav a.on { background: var(--dt-primary); color: #fff; font-weight: 700; }
.dt-subnav .fa-bell { font-size: 10px; color: var(--dt-primary); }
.dt-subnav a.on .fa-bell { color: #fff; }

/* 구독 버튼 */
.dt-board-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-right: 16px; }
.dt-board-head .dt-board-title small { margin-left: 6px; font-size: 13px; font-weight: 500; color: var(--dt-text-3); }
.dt-sub-btn { flex: none; display: inline-flex; align-items: center; gap: 5px; padding: 4px 11px; border: 1px solid var(--dt-primary); border-radius: 15px; background: var(--dt-surface); color: var(--dt-primary); font-size: 12.5px; font-weight: 700; line-height: 1.4; cursor: pointer; text-decoration: none; }
.dt-sub-btn.is-on { background: var(--dt-primary); color: #fff; }
.dt-sub-btn:disabled { opacity: .6; }
.dt-sub-count { font-weight: 500; opacity: .8; }
.dt-box-tools { display: inline-flex; align-items: center; gap: 8px; }
.dt-box-tools .dt-sub-btn { padding: 2px 9px; font-size: 11.5px; }

/* 내 구독 */
.dt-my-subs ul { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; padding: 12px 14px; list-style: none; }
.dt-my-subs li a { display: inline-block; padding: 3px 10px; border: 1px solid var(--dt-border); border-radius: 14px; font-size: 12.5px; text-decoration: none; }
.dt-new-cnt { display: inline-block; min-width: 16px; padding: 0 4px; border-radius: 8px; background: var(--dt-up); color: #fff; font-size: 10.5px; line-height: 16px; text-align: center; font-weight: 700; }
.dt-feed { margin-bottom: 12px; }
.dt-feed-row { display: flex; align-items: center; gap: 4px; min-height: 38px; padding: 6px 16px; border-bottom: 1px solid var(--dt-border); }
.dt-feed-row:hover { background: var(--dt-surface-2); }
.dt-feed-row .dt-subject { flex: 1; min-width: 0; }
.dt-feed-meta { flex: none; color: var(--dt-text-3); font-size: 12px; margin-left: 8px; }
.dt-sub-group { padding: 10px 14px; border-bottom: 1px solid var(--dt-border); }
.dt-sub-group:last-child { border-bottom: 0; }
.dt-sub-group h3 { margin: 0 0 8px; font-size: 13px; color: var(--dt-text-2); }
.dt-sub-group ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 6px 12px; margin: 0; padding: 0; list-style: none; }
.dt-sub-group li { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13.5px; }
.dt-sub-group li > a { text-decoration: none; }

/* 칩 필터 (실거래가 동, 교통 노선) */
.dt-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 16px 10px; }
.dt-chips a { padding: 3px 10px; border: 1px solid var(--dt-border); border-radius: 14px; color: var(--dt-text-2); font-size: 12.5px; text-decoration: none; }
.dt-chips a.on { background: var(--dt-primary); border-color: var(--dt-primary); color: #fff; font-weight: 700; }

/* 실거래가 */
.dt-price { color: var(--dt-text); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dt-lat li .dt-price { flex: none; font-size: 13px; }
.dt-lat-subject small { color: var(--dt-text-3); font-size: 11.5px; }
.dt-apt-controls { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 12px; }
.dt-apt-controls select, .dt-apt-controls .frm_input { height: 32px; padding: 0 8px; border: 1px solid var(--dt-border); border-radius: var(--dt-radius); }
.dt-apt-controls .frm_input { width: 160px; }
.dt-apt-controls .dt-btn { border: 0; cursor: pointer; }
.dt-apt-summary { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 8px; padding: 0 16px 12px; }
.dt-apt-card { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--dt-border); border-radius: var(--dt-radius); background: var(--dt-surface-2); text-decoration: none; font-size: 12px; color: var(--dt-text-2); }
.dt-apt-card b { font-size: 14px; color: var(--dt-text); }
.dt-apt-total { padding: 0 16px 6px; color: var(--dt-text-3); font-size: 12px; }
.dt-apt-table-wrap { overflow-x: auto; }
.dt-apt-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.dt-apt-table th { padding: 8px; background: var(--dt-surface-2); color: var(--dt-text-3); font-size: 12px; font-weight: 700; text-align: left; border-top: 1px solid var(--dt-border); border-bottom: 1px solid var(--dt-border); white-space: nowrap; }
.dt-apt-table td { padding: 8px; border-bottom: 1px solid var(--dt-border); white-space: nowrap; }
.dt-apt-table th:first-child, .dt-apt-table td:first-child { padding-left: 16px; }
.dt-apt-table .r { text-align: right; }
.dt-apt-table small { color: var(--dt-text-3); }
.dt-apt-name a { font-weight: 600; text-decoration: none; }
.dt-apt-table tr.is-cancel td { color: var(--dt-text-3); text-decoration: line-through; }
.dt-apt-table tr.is-cancel td:last-child { text-decoration: none; }
.dt-tag, .dt-tag-cancel { display: inline-block; padding: 0 5px; border-radius: 3px; font-size: 11px; line-height: 17px; border: 1px solid var(--dt-border); color: var(--dt-text-2); }
.dt-tag-cancel { border-color: var(--dt-up); color: var(--dt-up); }
.dt-apt-source { margin: 0; padding: 12px 16px 16px; color: var(--dt-text-3); font-size: 12px; line-height: 1.6; }

/* 교통정보 */
.dt-traffic-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 0 16px; }
.dt-line { border: 1px solid var(--dt-border); border-top: 4px solid var(--line); border-radius: var(--dt-radius); padding: 12px 14px; background: var(--dt-surface); }
.dt-line header { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.dt-line h3 { display: flex; align-items: center; gap: 6px; margin: 0; font-size: 16px; }
.dt-line-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.dt-line-status { padding: 1px 8px; border-radius: 10px; font-size: 11.5px; font-weight: 700; background: var(--dt-surface-2); color: var(--dt-text-2); }
.dt-line-status.is-run { background: var(--dt-primary); color: #fff; }
.dt-line-status.is-build { background: #f59f00; color: #fff; }
.dt-line p { margin: 8px 0; color: var(--dt-text-2); font-size: 13px; line-height: 1.6; }
.dt-line dl { display: flex; gap: 8px; margin: 0 0 8px; font-size: 12.5px; }
.dt-line dt { color: var(--dt-text-3); }
.dt-line dd { margin: 0; }
.dt-line ul { margin: 0; padding: 6px 0; border-top: 1px solid var(--dt-border); list-style: none; }
.dt-line li { display: flex; align-items: center; gap: 4px; padding: 4px 0; font-size: 13px; }
.dt-line li.dt-empty { padding: 8px 0; justify-content: center; }
.dt-line footer { display: flex; justify-content: flex-end; gap: 12px; padding-top: 6px; }

@media (max-width: 768px) {
    .dt-traffic-grid { grid-template-columns: minmax(0, 1fr); padding: 0 12px; }
    .dt-chips, .dt-apt-controls, .dt-apt-summary { padding-left: 12px; padding-right: 12px; }
    .dt-board-head { padding-right: 12px; }
    .dt-feed-row { flex-wrap: wrap; padding: 8px 12px; }
    .dt-feed-meta { flex-basis: 100%; margin-left: 0; }
}
.dt-lat-town { grid-column: 1 / -1; }

/* 하루 한 번 게시판 (업체홍보) */
.dt-daily-rule { margin: 4px 16px 8px; padding: 10px 12px; border-radius: var(--dt-radius); background: color-mix(in srgb, var(--dt-primary) 8%, var(--dt-surface)); color: var(--dt-text-2); font-size: 12.5px; line-height: 1.6; }
.dt-daily-rule a { color: var(--dt-primary); font-weight: 700; }
.dt-bump { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 10px 0; font-size: 12.5px; color: var(--dt-text-3); }