/* =============================================
   Reset CSS
   ============================================= */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote::before, blockquote::after,
q::before, q::after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
a {
    color: inherit;
    text-decoration: none;
}
img {
    display: block;
    max-width: 100%;
}
input, button, select, textarea {
    font-family: inherit;
    font-size: inherit;
}

/* =============================================
   Base / Typography
   ============================================= */
html {
    background: #1a1a2e;
}
body {
    font-family: 'Noto Sans KR', 'Roboto', 'Montserrat', Dotum, '돋움', 'Malgun Gothic', '맑은 고딕', sans-serif;
    font-size: 15px;
    color: #222;
    background: #1a1a2e;
    line-height: 1.5;
    overflow-x: hidden;
}

/* =============================================
   전체 레이아웃 Wrapper
   ============================================= */
#wrap {
    width: 100%;
    background: #fff;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* =============================================
   헤더 - 구 정의 제거됨 (하단 HEADER 개선 섹션 참조)
   ============================================= */

/* =============================================
   Gnuboard 공통 유틸리티
   ============================================= */
.sound_only {
    overflow: hidden;
    position: absolute;
    width: 1px; height: 1px;
    clip: rect(0 0 0 0);
    margin: -1px; padding: 0; border: 0;
}
/* 팝업레이어 (#hd_pop / .hd_pops) */
#hd_pop { position: relative; z-index: 9999; }
#hd_pop h2 { display: none; }
.hd_pops {
    display: block;
    position: fixed;
    z-index: 9999;
    background: #fff;
    border: 1px solid #ccc;
    box-shadow: 0 8px 32px rgba(0,0,0,.25);
    border-radius: 4px;
    overflow: hidden;
}
.hd_pops_con { overflow: auto; }
.hd_pops_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f5f5f5;
    border-top: 1px solid #e0e0e0;
    padding: 6px 10px;
    font-size: 12px;
}
.hd_pops_reject, .hd_pops_close {
    background: none;
    border: 1px solid #ccc;
    border-radius: 3px;
    padding: 3px 10px;
    font-size: 11px;
    cursor: pointer;
    color: #555;
    transition: all .2s;
}
.hd_pops_reject:hover { background: #555; color: #fff; border-color: #555; }
.hd_pops_close { background: #e63946; color: #fff; border-color: #e63946; }
.hd_pops_close:hover { background: #c0392b; }

/* =============================================
   관리자 플로팅 퀵바 (어드민만)
   ============================================= */
#admin-quick-bar {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 10000;
    display: flex;
    flex-direction: column;
    gap: 6px;
    align-items: flex-end;
}
#admin-quick-bar .aqb-toggle {
    width: 46px; height: 46px;
    border-radius: 50%;
    background: #e63946;
    color: #fff;
    border: none;
    font-size: 18px;
    cursor: pointer;
    box-shadow: 0 4px 14px rgba(230,57,70,.5);
    display: flex; align-items: center; justify-content: center;
    transition: transform .2s;
}
#admin-quick-bar .aqb-toggle:hover { transform: rotate(90deg); }
#admin-quick-bar .aqb-menu {
    display: none;
    flex-direction: column;
    gap: 5px;
    align-items: flex-end;
}
#admin-quick-bar .aqb-menu.open { display: flex; }
#admin-quick-bar .aqb-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #1a1a2e;
    color: #fff !important;
    border-radius: 24px;
    padding: 7px 14px 7px 10px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    box-shadow: 0 2px 8px rgba(0,0,0,.3);
    transition: background .2s;
    cursor: pointer;
    border: none;
}
#admin-quick-bar .aqb-item:hover { background: #e63946; color: #fff !important; }
#admin-quick-bar .aqb-item i {
    width: 24px; height: 24px;
    background: rgba(255,255,255,.15);
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px;
    flex-shrink: 0;
}
/* 마이페이지 팝업 오버레이 (소형 popup) */
.popup-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 9998;
    justify-content: center;
    align-items: center;
}
.popup-overlay.open { display: flex; }
.popup-box {
    background: #fff;
    border-radius: 10px;
    width: 420px;
    max-width: 95vw;
    max-height: 85vh;
    overflow-y: auto;
    box-shadow: 0 16px 48px rgba(0,0,0,.3);
    position: relative;
}
.popup-box-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #e8e8e8;
    font-weight: 700;
    font-size: 14px;
    color: #1a1a2e;
    background: #f8f8f8;
    border-radius: 10px 10px 0 0;
}
.popup-close-btn {
    background: none;
    border: none;
    font-size: 16px;
    color: #999;
    cursor: pointer;
    padding: 2px 6px;
    border-radius: 3px;
    transition: all .2s;
}
.popup-close-btn:hover { background: #e63946; color: #fff; }
.popup-box-body { padding: 16px; }

/* =============================================
   관리자 위젯 톱니바퀴 (로그인 시만 표시)
   ============================================= */
.widget-gear {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    background: rgba(230,57,70,.1);
    border: 1px solid rgba(230,57,70,.3);
    border-radius: 3px;
    color: #e63946 !important;
    font-size: 10px;
    text-decoration: none;
    transition: all .2s;
    flex-shrink: 0;
}
.widget-gear:hover {
    background: #e63946;
    color: #fff !important;
    border-color: #e63946;
}
/* 사이드박스 타이틀 flex로 세자 정렬 */
.side-box-title {
    display: flex !important;
    align-items: center;
    gap: 6px;
}
.side-box-title .widget-gear { margin-left: auto; }

/* =============================================
   본문 3단 컨테이너
   ============================================= */
#content-wrap {
    max-width: 1380px;
    margin: 0 auto;
    padding: 12px 10px;
    display: flex;
    gap: 15px;
    align-items: flex-start;
    flex: 1;
}

/* =============================================
   사이드 배너 컬럼 (참조 사이트 기존 참고 사이트 좌측 배너)
   ============================================= */
#sidebar-banners {
    width: 155px;
    min-width: 155px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: relative;
}
body.board-page #sidebar-banners {
    display: none;
}

/* 회원가입 화면도 게시판과 동일한 좌측 위젯 + 우측 본문 구조 사용 */
body.member-register-page #sidebar-banners {
    display: none;
}

body.member-register-page #main-content {
    min-width: 0;
}

body.member-register-page .rg-wrap,
body.member-register-page .register {
    margin-left: 0;
    margin-right: auto;
}

body.member-register-page .rg-wrap {
    padding-top: 0;
}
#content-wrap.has-fw-banner {
    flex-wrap: wrap;
}
/* 전체 폭 게시판 배너 다음 줄에서 사이드바와 본문을 같은 행에 유지 */
#content-wrap.has-fw-banner > #main-content {
    flex: 1 1 0;
    min-width: 0;
}
#content-wrap > .fw-board-banner {
    width: 100%;
    flex-shrink: 0;
    box-sizing: border-box;
    border-radius: 10px !important;
    margin-bottom: 12px !important;
}
.sb-admin-link {
    display: flex; align-items: center; justify-content: center;
    width: 22px; height: 22px;
    background: rgba(230,57,70,.85); color: #fff !important;
    border-radius: 50%; font-size: 10px;
    position: absolute; top: 4px; right: 4px; z-index: 10;
    text-decoration: none; transition: background .15s;
}
.sb-admin-link:hover { background: #c0392b; }
.sb-banner-link {
    display: block; border-radius: 10px; overflow: hidden;
    border: 1px solid #e0e0e0;
    height: 280px;
    transition: transform .18s, box-shadow .18s;
}
.sb-banner-link:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,.15); }
.sb-banner-img {
    width: 100%; height: 280px; display: block; object-fit: cover;
}
.sb-placeholder {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    height: 280px; border: 2px dashed #ccc; border-radius: 10px;
    color: #bbb; font-size: 12px; text-decoration: none; gap: 6px;
    transition: all .15s;
}
.sb-placeholder:hover { border-color: #e63946; color: #e63946; }
.sb-placeholder i { font-size: 24px; }

/* =============================================
   좌측 사이드바 (240px) - 우측 사이드바 제거 후 확대
   ============================================= */
#left-sidebar {
    width: 260px;
    min-width: 260px;
    flex-shrink: 0;
}
.side-box {
    background: #fff;
    border: 1px solid #ccc;
    border-top: 2px solid #e94560;
    margin-bottom: 8px;
    border-radius: 0;
}
.side-box-title {
    background: #f0f0f0;
    font-size: 14px;
    font-weight: bold;
    color: #222;
    padding: 5px 8px;
    border-bottom: 1px solid #ccc;
    letter-spacing: 0;
}
.side-box ul {
    padding: 2px 0;
}
.side-box ul li a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 8px;
    color: #333;
    font-size: 14px;
    transition: background 0.1s;
    border-bottom: 1px solid #f5f5f5;
}
.side-box ul li a:hover {
    background: #fff0f0;
    color: #e94560;
}
.side-box ul li a .cnt {
    color: #e94560;
    font-size: 11px;
    font-weight: bold;
}

/* =============================================
   전체폭 페이지 (회원가입 등 사이드바 없는 페이지)
   ============================================= */
#fw-page {
    max-width: 1380px;
    margin: 0 auto;
    padding: 20px 10px 40px;
    width: 100%;
    flex: 1;
    box-sizing: border-box;
}

/* =============================================
   중앙 메인 (flex-1)
   ============================================= */
#main-content {
    flex: 1;
    min-width: 0;
}
.board-box {
    background: #fff;
    border: 1px solid #ccc;
    border-top: 2px solid #e94560;
    margin-bottom: 8px;
    border-radius: 0;
}
.board-box-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f0f0f0;
    padding: 5px 8px;
    border-bottom: 1px solid #ccc;
}
.board-box-title .tit {
    font-size: 15px;
    font-weight: bold;
    color: #111;
    letter-spacing: -0.3px;
}
.board-box-title .more {
    font-size: 11px;
    color: #999;
    transition: color 0.2s;
}
.board-box-title .more:hover {
    color: #e94560;
}
.board-list {
    width: 100%;
    border-collapse: collapse;
}
.board-list tr {
    border-bottom: 1px solid #ebebeb;
}
.board-list tr:last-child {
    border-bottom: none;
}
.board-list tbody tr:nth-child(even) {
    background: #f9f9f9;
}
.board-list tr:hover {
    background: #fff3f3 !important;
}
.board-list td {
    padding: 5px 7px;
    font-size: 14px;
    color: #333;
}
.board-list td.title a {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%;
    color: #333;
    font-size: 14px;
}
.board-list td.title a:hover {
    color: #e94560;
}
.board-list td.num {
    width: 40px;
    text-align: center;
    color: #999;
    font-size: 11px;
}
.board-list td.date {
    width: 80px;
    text-align: right;
    color: #aaa;
    font-size: 11px;
}
.board-list td .badge {
    display: inline-block;
    background: #e94560;
    color: #fff;
    font-size: 10px;
    padding: 0 3px;
    border-radius: 0;
    margin-right: 3px;
    vertical-align: middle;
    font-weight: bold;
    line-height: 1.6;
}
.board-list td .badge.hot {
    background: #d43f00;
}
.board-list td .badge.new {
    background: #1a7a3a;
}

/* 카테고리 태그 */
.cat-tag {
    display: inline-block;
    background: #16213e;
    color: #ccc;
    font-size: 10px;
    font-weight: bold;
    padding: 0 4px;
    margin-right: 4px;
    border-radius: 0;
    vertical-align: middle;
    line-height: 1.7;
    border: 1px solid #0f3460;
}
.cat-tag.free  { background: #2c4a7c; border-color: #2c4a7c; }
.cat-tag.sports { background: #7c2c2c; border-color: #7c2c2c; }
.cat-tag.gong  { background: #2c6e4a; border-color: #2c6e4a; }
.cat-tag.humor { background: #6b3fa0; border-color: #6b3fa0; }
.cat-tag.notice { background: #555; border-color: #555; }

/* N 아이콘 (NEW) */
.n-icon {
    display: inline-block;
    background: #e94560;
    color: #fff;
    font-size: 9px;
    font-weight: bold;
    padding: 0 3px;
    margin-right: 2px;
    border-radius: 0;
    vertical-align: middle;
    line-height: 1.7;
}

/* =============================================
   우측 사이드바 - 제거됨 (위젯은 좌측으로 이동)
   ============================================= */
#right-sidebar {
    display: none !important;
}

/* 로그인 박스 */
.login-box {
    background: #fff;
    border: 1px solid #ccc;
    border-top: 2px solid #e94560;
    padding: 8px;
    margin-bottom: 8px;
    border-radius: 0;
}
.login-box input[type="text"],
.login-box input[type="password"] {
    width: 100%;
    height: 32px;
    border: 1px solid #bbb;
    padding: 0 6px;
    font-size: 14px;
    margin-bottom: 4px;
    border-radius: 0;
    outline: none;
    background: #fafafa;
    transition: border 0.1s;
}
.login-box input[type="text"]:focus,
.login-box input[type="password"]:focus {
    border-color: #e94560;
    background: #fff;
}
.login-box .btn-row {
    display: flex;
    gap: 3px;
    margin-bottom: 5px;
}
.btn-login {
    flex: 1;
    height: 32px;
    background: #e94560;
    color: #fff;
    border: none;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 0;
    transition: background 0.1s;
    letter-spacing: 0.5px;
}
.btn-login:hover {
    background: #c0304a;
}
.btn-join {
    flex: 1;
    height: 32px;
    background: #16213e;
    color: #ccc;
    border: none;
    font-size: 14px;
    cursor: pointer;
    border-radius: 0;
    transition: background 0.1s;
}
.btn-join:hover {
    background: #0a1628;
    color: #fff;
}
.login-links {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding-top: 2px;
}
.login-links a {
    font-size: 11px;
    color: #777;
}
.login-links a:hover {
    color: #e94560;
}

/* 인기 게시물 (우측) */
.right-board-list li {
    display: flex;
    align-items: center;
    padding: 5px 10px;
    border-bottom: 1px solid #f2f2f2;
    gap: 6px;
}
.right-board-list li:last-child {
    border-bottom: none;
}
.right-board-list li .rank {
    font-size: 11px;
    font-weight: bold;
    color: #e94560;
    width: 18px;
    text-align: center;
    flex-shrink: 0;
}
.right-board-list li a {
    font-size: 16px;
    color: #555;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
}
.right-board-list li a:hover {
    color: #e94560;
}

/* 배너 박스 */
.banner-box {
    background: #fff;
    border: 1px solid #ddd;
    margin-bottom: 10px;
    border-radius: 2px;
    overflow: hidden;
    text-align: center;
}
.banner-box img {
    width: 100%;
    height: auto;
}
.banner-placeholder {
    background: #3a3a3a;
    color: #999;
    font-size: 11px;
    padding: 20px 10px;
    text-align: center;
    font-weight: bold;
    letter-spacing: 0.5px;
    border: 1px dashed #666;
}

/* 사이드바 배너 자리 (세로형) */
.side-banner {
    background: #3a3a3a;
    border: 1px dashed #666;
    color: #999;
    font-size: 11px;
    font-weight: bold;
    text-align: center;
    padding: 0;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
}
.side-banner .sb-size {
    font-size: 10px;
    color: #777;
    font-weight: normal;
}
.side-banner-left {
    height: 150px;
}
.side-banner-right {
    height: 100px;
}

/* =============================================
   푸터 - 하단 새 스타일 참조 (#footer 재정의)
   ============================================= */

/* =============================================
   중앙 게시판 그리드 (2열 PC / 1열 모바일)
   ============================================= */
.board-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.board-grid .board-box {
    margin-bottom: 0;
}

/* =============================================
   좌측 GNB 메뉴 세부 스타일
   ============================================= */
.side-box .menu-section {
    border-bottom: 1px solid #f0f0f0;
    padding: 4px 0;
}
.side-box .menu-section:last-child {
    border-bottom: none;
}
.side-box .menu-section-title {
    font-size: 10px;
    font-weight: bold;
    color: #888;
    padding: 4px 8px 2px;
    letter-spacing: 0;
    text-transform: uppercase;
    background: #f8f8f8;
    border-bottom: 1px solid #eee;
}
.side-box ul li a .icon {
    margin-right: 4px;
    font-style: normal;
    font-size: 11px;
}
.side-box ul li.active a {
    color: #e94560;
    font-weight: bold;
    background: #fef3f3;
}

/* 레벨/포인트 랭킹 위젯 */
.rank-list { list-style: none; margin: 0; padding: 0; }
.rank-item {
    display: flex; align-items: center; gap: 8px;
    padding: 7px 12px; border-bottom: 1px solid #f5f5f5; font-size: 12px;
}
.rank-item:last-child { border-bottom: none; }
.rank-no { width: 22px; text-align: center; font-size: 13px; flex-shrink: 0; }
.rank-nick { flex: 1; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-val { font-size: 11px; color: #e63946; font-weight: 700; white-space: nowrap; }

/* 로그인 박스 제목 */
.login-box-title {
    font-size: 14px;
    font-weight: bold;
    color: #222;
    background: #f0f0f0;
    border-bottom: 1px solid #ccc;
    padding: 5px 8px;
    margin: -8px -8px 8px;
}

/* 포인트 랭킹 */
.rank-list {
    padding: 2px 0;
}
.rank-list li {
    display: flex;
    align-items: center;
    padding: 4px 8px;
    border-bottom: 1px solid #f0f0f0;
    gap: 5px;
}
.rank-list li:last-child {
    border-bottom: none;
}
.rank-list li .rank-no {
    width: 22px;
    text-align: center;
    font-size: 11px;
    font-weight: bold;
    flex-shrink: 0;
    background: none;
    color: #888;
    line-height: 1;
}
.rank-list li:nth-child(1) .rank-no,
.rank-list li:nth-child(2) .rank-no,
.rank-list li:nth-child(3) .rank-no { font-size: 16px; background: none; }
.rank-list li .rank-nick {
    flex: 1;
    font-size: 12px;
    color: #333;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.rank-list li .rank-pt {
    font-size: 11px;
    color: #e94560;
    font-weight: bold;
    flex-shrink: 0;
}

/* 접속자 수 표시 */
.online-box {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-bottom: 1px solid #eee;
    font-size: 11px;
    color: #444;
}
.online-box .online-count {
    font-weight: bold;
    color: #e94560;
}

/* =============================================
   공통 유틸리티
   ============================================= */
.clearfix::after {
    content: '';
    display: table;
    clear: both;
}

/* =============================================
   반응형 - 태블릿 (769px ~ 1024px)
   ============================================= */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    #sidebar-banners {
        width: 120px;
        min-width: 120px;
    }
    #left-sidebar {
        width: 200px;
        min-width: 200px;
    }
    #content-wrap {
        gap: 10px;
    }
}
@media screen and (max-width: 768px) {
    #sidebar-banners { display: none !important; }
}

/* =============================================
   TOP BAR
   ============================================= */
#top-bar {
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border-bottom: 1px solid #e8e8e8;
    font-size: 12px;
    color: #666;
    box-sizing: border-box;
}
.top-bar-inner {
    max-width: 1380px;
    margin: 0 auto;
    padding: 6px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}
.top-bar-left {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.top-bar-left a { color: #555; transition: color .2s; }
.top-bar-left a:hover { color: #e63946; }
.tb-dot { color: #bbb; }
.tb-date { color: #777; }
.tb-connect { color: #555; font-size: 12px; }
.tb-connect strong { color: #2ecc71; font-weight: 700; }
.top-bar-right {
    display: flex;
    align-items: center;
    gap: 8px;
}
.top-search {
    display: flex;
    align-items: center;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    overflow: hidden;
    padding: 2px 8px;
}
.top-search input {
    background: transparent;
    border: none;
    outline: none;
    color: #333;
    width: 200px;
    font-size: 12px;
    padding: 3px 4px;
}
.top-search input::placeholder { color: #aaa; }
.top-search button {
    background: transparent;
    border: none;
    color: #666;
    cursor: pointer;
    padding: 2px 4px;
    font-size: 12px;
    transition: color .2s;
}
.top-search button:hover { color: #e63946; }
.top-btn-login {
    background: transparent;
    border: 1px solid #ccc;
    color: #555 !important;
    padding: 3px 12px;
    border-radius: 3px;
    font-size: 11px;
    transition: all .2s;
}
.top-btn-login:hover { border-color: #e63946; color: #e63946 !important; }
.top-btn-join {
    background: #e63946;
    border: 1px solid #e63946;
    color: #fff !important;
    padding: 3px 12px;
    border-radius: 3px;
    font-size: 11px;
    font-weight: 700;
    transition: all .2s;
}
.top-btn-join:hover { background: #c0392b; border-color: #c0392b; }

/* =============================================
   HEADER 개선
   ============================================= */
#header {
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border-bottom: 3px solid #e63946;
    z-index: 100;
    overflow: visible;
    box-sizing: border-box;
}
#header-inner {
    max-width: 1380px;
    margin: 0 auto;
    padding: 0 12px;
    min-height: 70px;
    display: flex;
    align-items: stretch;
    gap: 0;
    flex-wrap: nowrap;
}
#logo {
    display: flex;
    align-items: center;
    padding: 0 32px 0 0;
    margin-left: 60px;
    flex-shrink: 0;
}
#logo a {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    color: #1a1a2e;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 24px;
    letter-spacing: -1px;
    text-decoration: none;
}
.logo-flower { font-size: 34px; line-height: 1; }
.logo-icon-img { height: 54px; width: auto; display: block; object-fit: contain; flex-shrink: 0; }
.logo-right {
    display: flex;
    flex-direction: column;
    gap: 1px;
}
.logo-text { font-size: 26px; font-weight: 900; line-height: 1.1; letter-spacing: -1px; }
.logo-red { color: #e63946; }
.logo-sub {
    display: block;
    font-size: 11px;
    font-weight: 400;
    color: #888;
    font-family: 'Noto Sans KR', sans-serif;
    letter-spacing: 0;
    line-height: 1;
}
/* 이벤트 버튼 (TOP BAR 안) */
.tb-event-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: linear-gradient(135deg, #e63946, #ff6b35);
    color: #fff !important;
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(230,57,70,.35);
    white-space: nowrap;
    transition: transform .2s;
}
.tb-event-btn:hover { transform: translateY(-1px); color: #fff !important; }

/* ===== HEADER 내부 GNB (메인 네비게이션) ===== */
#gnb {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 0;
    justify-content: flex-end;
}
/* 직접 a 태그 (get_menu_db 미등록 fallback) */
#gnb > a {
    display: flex;
    align-items: center;
    color: #333;
    font-size: 15px;
    font-weight: 700;
    padding: 0 14px;
    white-space: nowrap;
    transition: color .2s;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    position: relative;
}
#gnb > a:hover { color: #e63946; border-bottom-color: #e63946; }
#gnb > a i { color: #f59e0b; margin-right: 3px; font-size: 11px; }
/* get_menu_db() 연동 gnb-item */
.gnb-item {
    position: relative;
    display: flex;
    align-items: stretch;
}
.gnb-item > a {
    display: flex;
    align-items: center;
    color: #333;
    font-size: 15px;
    font-weight: 700;
    padding: 0 14px;
    white-space: nowrap;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    transition: all .2s;
}
.gnb-item > a:hover,
.gnb-item:hover > a { color: #e63946; border-bottom-color: #e63946; }
/* 드롭다운 서브메뉴 */
.gnb-sub {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-top: 2px solid #e63946;
    min-width: 140px;
    z-index: 1000;
    list-style: none;
    margin: 0; padding: 6px 0;
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
}
.gnb-item.has-sub:hover .gnb-sub { display: block; }
.gnb-sub li a {
    display: block;
    color: #555;
    font-size: 14px;
    font-weight: 600;
    padding: 8px 16px;
    text-decoration: none;
    transition: all .2s;
}
.gnb-sub li a:hover { color: #e63946; background: #fff5f5; padding-left: 20px; }
/* 햄버거 버튼 (전체 메뉴 - PC/모바일 공통 표시) */
#gnb-hamburger {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 38px;
    height: 38px;
    background: none;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 17px;
    color: #333;
    cursor: pointer;
    margin-left: 10px;
    flex-shrink: 0;
}
#gnb-hamburger:hover { color: #e63946; border-color: #e63946; }

/* =============================================
   NOTICE TICKER (공지 티커)
   ============================================= */
.notice-ticker {
    display: flex;
    align-items: center;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 8px;
    height: 32px;
}
.ticker-label {
    background: #e63946;
    color: #fff;
    padding: 0 10px;
    font-size: 12px;
    display: flex;
    align-items: center;
    height: 100%;
    flex-shrink: 0;
}
.ticker-wrap {
    flex: 1;
    overflow: hidden;
    padding: 0 8px;
    font-size: 12px;
    color: #555;
    white-space: nowrap;
}
.ticker-move {
    display: inline-block;
    white-space: nowrap;
    animation: ticker-scroll 20s linear infinite;
}
.ticker-move:hover { animation-play-state: paused; }
.ticker-move a { color: #333; margin-right: 20px; }
.ticker-move a:hover { color: #e63946; }
@keyframes ticker-scroll {
    0%   { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

/* =============================================
   TELEGRAM BUTTON
   ============================================= */
.telegram-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: linear-gradient(135deg, #0088cc, #0099dd);
    color: #fff !important;
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 12px;
    font-weight: 600;
    margin: 8px 0;
    text-decoration: none;
    transition: all .2s;
    box-shadow: 0 3px 10px rgba(0,136,204,.3);
}
.telegram-btn:hover { background: linear-gradient(135deg, #006da8, #0088cc); transform: translateY(-2px); color:#fff !important; }
.telegram-btn i { font-size: 16px; }
.tg-point {
    background: #ff6b35;
    color: #fff;
    border-radius: 10px;
    padding: 2px 7px;
    font-size: 10px;
}

/* 관리자에게만 보이는 텔레그램 위젯 설정 버튼 */
#sidebar-banner-area {
    position: relative;
}
.telegram-widget-gear {
    position: absolute;
    top: 3px;
    right: 3px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    color: #0088cc;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0,0,0,.14);
}
.telegram-widget-gear:hover {
    background: #e63946;
    border-color: #e63946;
    color: #fff;
}
.telegram-widget-gear i {
    font-size: 10px;
}

/* =============================================
   SWIPER MAIN BANNER
   ============================================= */
.main-swiper {
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 14px;
    height: 200px;
    box-shadow: 0 4px 16px rgba(0,0,0,.15);
}
.swiper-slide { position: relative; }
.swiper-slide img {
    width: 100%; height: 200px; display: block; object-fit: cover;
}
.slide-1 { background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%); }
.slide-2 { background: linear-gradient(135deg, #2d3561 0%, #c05c7e 50%, #f1b33a 100%); }
.slide-3 { background: linear-gradient(135deg, #0f3460 0%, #e94560 100%); }
.slide-inner {
    padding: 30px 36px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.slide-en {
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    color: rgba(255,255,255,.6);
    letter-spacing: 3px;
    text-transform: uppercase;
    margin-bottom: 8px;
}
.slide-title {
    font-size: 22px;
    font-weight: 900;
    color: #fff;
    margin-bottom: 8px;
    line-height: 1.3;
    text-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.slide-desc {
    font-size: 12px;
    color: rgba(255,255,255,.75);
    line-height: 1.6;
    margin-bottom: 16px;
}
.slide-btn {
    display: inline-flex;
    align-items: center;
    background: #e63946;
    color: #fff !important;
    padding: 8px 20px;
    border-radius: 24px;
    font-size: 12px;
    font-weight: 700;
    width: fit-content;
    text-decoration: none;
    transition: all .2s;
    box-shadow: 0 3px 10px rgba(230,57,70,.4);
}
.slide-btn:hover { background: #c0392b; transform: translateY(-2px); color:#fff !important; }
.swiper-pagination-bullet { background: rgba(255,255,255,.5); }
.swiper-pagination-bullet-active { background: #e63946; }
.swiper-button-prev, .swiper-button-next { color: rgba(255,255,255,.7); }
.swiper-button-prev:after, .swiper-button-next:after { font-size: 16px; }

/* =============================================
   QUICK ACTIONS
   ============================================= */
.quick-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin-bottom: 14px;
}
.quick-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 18px 10px;
    text-decoration: none;
    transition: all .2s;
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
    text-align: center;
    cursor: pointer;
}
.quick-card:hover {
    border-color: #e63946;
    transform: translateY(-3px);
    box-shadow: 0 6px 18px rgba(230,57,70,.15);
    text-decoration: none;
}
.quick-icon {
    width: 52px;
    height: 52px;
    background: linear-gradient(135deg, #fff5f5, #ffe0e3);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #e63946;
    margin-bottom: 10px;
    transition: all .2s;
}
.quick-card:hover .quick-icon { background: #e63946; color: #fff; }
.quick-label {
    font-size: 17px;
    font-weight: 700;
    color: #1a1a2e;
    margin-bottom: 4px;
}
.quick-desc {
    font-size: 14px;
    color: #999;
    line-height: 1.4;
}

/* =============================================
   SECTION HEADER & SPONSOR GRID
   ============================================= */
.section-header {
    text-align: center;
    font-size: 26px;
    font-weight: 800;
    color: #1a1a2e;
    margin: 16px 0 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}
.section-trophy { color: #e63946; font-size: 22px; }
.section-title { color: #1a1a2e; font-size: 26px; font-weight: 800; }
.section-desc {
    text-align: center;
    font-size: 12px;
    color: #888;
    margin-bottom: 12px;
}
.sponsor-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
    margin-bottom: 14px;
}
.sponsor-link { display: block; }
.sponsor-placeholder {
    background: linear-gradient(135deg, #1a1a2e, #16213e);
    border-radius: 8px;
    height: 130px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: rgba(255,255,255,.4);
    font-size: 11px;
    transition: all .2s;
    border: 1px solid #2a2a4e;
}
.sponsor-placeholder i { font-size: 20px; color: rgba(255,255,255,.3); }
.sponsor-placeholder strong { color: #fff; font-size: 14px; }
.sponsor-placeholder small { color: rgba(255,255,255,.55); font-size: 10px; }
.sponsor-placeholder:hover { background: linear-gradient(135deg, #e63946, #c0392b); color:#fff; border-color:#e63946; }
.sponsor-placeholder:hover i { color: #fff; }
/* 보증업체 실제 이미지 */
.sponsor-item {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
}
.sponsor-img {
    width: 100%;
    height: 130px;
    object-fit: cover;
    display: block;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    transition: transform .2s, opacity .2s;
}
.sponsor-link:hover .sponsor-img { transform: scale(1.03); opacity: .9; }
/* 관리자 수정 버튼 (각 슬롯 우상단) */
.sp-edit-btn {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    background: rgba(230,57,70,.9);
    color: #fff !important;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    text-decoration: none;
    opacity: 0;
    transition: opacity .2s;
    z-index: 5;
}
.sponsor-item:hover .sp-edit-btn { opacity: 1; }
/* 섹션 헤더 관리자 버튼 */
.sponsor-admin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    background: #e63946;
    color: #fff !important;
    border: none;
    border-radius: 50%;
    font-size: 12px;
    text-decoration: none;
    cursor: pointer;
    transition: background .2s, transform .2s;
    margin-left: 2px;
}
.sponsor-admin-btn:hover { background: #c0392b; transform: rotate(90deg); color: #fff !important; }
/* 업체 추가 슬롯 */
.sponsor-add-slot { background: #f5f5f5; border-radius: 8px; border: 2px dashed #ccc; }
.sponsor-add-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 80px;
    gap: 4px;
    color: #bbb !important;
    font-size: 11px;
    text-decoration: none;
    transition: all .2s;
}
.sponsor-add-link i { font-size: 22px; }
.sponsor-add-link:hover { color: #e63946 !important; }
.sponsor-add-slot:hover { border-color: #e63946; background: #fff0f0; }

/* =============================================
   BOARD BOX 아이콘 추가
   ============================================= */
.board-box-title .tit i {
    color: #e63946;
    margin-right: 4px;
    font-size: 12px;
}

/* #hd-gnb, #main-nav-bar 제거 - GNB는 이제 #header 내부 #gnb로 통합됨 */

/* =============================================
   LOGIN WIDGET (좌측 사이드바 로그인 폼)
   ============================================= */
/* ===== 사이드바 로고 ===== */
.sb-logo {
    text-align: right;
    padding: 10px 4px 10px;
    margin-bottom: 10px;
    border-bottom: 3px solid #e63946;
}
.sb-logo a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #1a1a2e;
    font-family: 'Montserrat', sans-serif;
    font-weight: 900;
    font-size: 22px;
    letter-spacing: -1px;
    text-decoration: none;
}
.sb-logo .logo-flower { font-size: 20px; }
.sb-logo .logo-text { font-size: 24px; font-weight: 900; }
.sb-logo .logo-red { color: #e63946; }

.login-widget {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 16px 14px;
    margin-bottom: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
/* ===== 로그인 상태 (원본 기존 참고 디자인 스타일) ===== */
.lw-member-wrap { width: 100%; }
/* 상단 행: 아바타 + 닉네임/아이디 + 로그아웃 */
.lw-top-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}
.lw-avatar-box {
    width: 42px; height: 42px;
    border-radius: 50%;
    background: #e8e8e8;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
    border: 2px solid #e63946;
}
.lw-avatar-box img { width: 100%; height: 100%; object-fit: cover; }
.lw-avatar-box i { font-size: 20px; color: #aaa; }
.lw-id-col {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}
.lw-nick {
    font-size: 13px;
    font-weight: 700;
    color: #1a1a2e;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lw-id-text {
    font-size: 10px;
    color: #999;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.lw-logout-btn {
    background: #e63946;
    color: #fff !important;
    border: none;
    border-radius: 4px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background .2s;
    flex-shrink: 0;
}
.lw-logout-btn:hover { background: #c0392b; color: #fff !important; }
/* 경험치 바 */
.lw-exp-row {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
}
.lw-exp-label { font-size: 10px; color: #888; white-space: nowrap; flex-shrink: 0; }
.lw-exp-bar {
    flex: 1;
    height: 6px;
    background: #e8e8e8;
    border-radius: 3px;
    overflow: hidden;
}
.lw-exp-fill {
    height: 100%;
    background: linear-gradient(90deg, #e63946, #ff6b35);
    border-radius: 3px;
    transition: width .5s;
}
/* 등급 + 포인트 행 */
.lw-info-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    color: #555;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
}
.lw-grade i { color: #f59e0b; margin-right: 2px; }
.lw-point-val { color: #e63946; font-weight: 700; }
.lw-point-val i { margin-right: 2px; }
/* 아이콘 단축키 행 */
.lw-icon-row {
    display: flex;
    justify-content: space-around;
    gap: 4px;
}
.lw-icon-row a {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 36px; height: 36px;
    border-radius: 8px;
    background: #f5f5f5;
    color: #555 !important;
    font-size: 14px;
    text-decoration: none;
    transition: all .2s;
    border: 1px solid #e8e8e8;
}
.lw-icon-row a:hover { background: #e63946; color: #fff !important; border-color: #e63946; }
.lw-icon-btn {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 36px; height: 36px;
    border-radius: 8px;
    background: #f5f5f5;
    color: #555;
    font-size: 14px;
    border: 1px solid #e8e8e8;
    cursor: pointer;
    transition: all .2s;
    padding: 0;
}
.lw-icon-btn:hover { background: #e63946; color: #fff; border-color: #e63946; }
/* 로그인 폼 */
.lw-input-wrap {
    position: relative;
    margin-bottom: 8px;
}
.lw-input-icon {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #bbb;
    font-size: 12px;
}
.lw-input {
    width: 100%;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 9px 10px 9px 30px;
    font-size: 12px;
    color: #333;
    background: #fafafa;
    outline: none;
    transition: border-color .2s;
}
.lw-input:focus { border-color: #e63946; background: #fff; }
.lw-login-btn {
    width: 100%;
    background: #e63946;
    color: #fff;
    border: none;
    border-radius: 5px;
    padding: 10px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    transition: background .2s;
    margin-bottom: 10px;
}
.lw-login-btn:hover { background: #c0392b; }
.lw-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 11px;
}
.lw-autologin { display: flex; align-items: center; gap: 6px; color: #666; cursor: pointer; }
.lw-links { display: flex; align-items: center; gap: 4px; color: #999; }
.lw-links a { color: #666; text-decoration: none; transition: color .2s; }
.lw-links a:hover { color: #e63946; }
/* 토글 스위치 (자동로그인) */
.toggle-switch { position: relative; display: inline-block; width: 32px; height: 18px; }
.toggle-switch input { opacity: 0; width: 0; height: 0; }
.toggle-slider {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background: #ddd;
    border-radius: 18px;
    transition: .3s;
}
.toggle-slider:before {
    content: '';
    position: absolute;
    width: 14px; height: 14px;
    left: 2px; bottom: 2px;
    background: #fff;
    border-radius: 50%;
    transition: .3s;
}
.toggle-switch input:checked + .toggle-slider { background: #e63946; }
.toggle-switch input:checked + .toggle-slider:before { transform: translateX(14px); }

/* =============================================
   이벤트 사이드 리스트
   ============================================= */
.event-side-box { margin-bottom: 10px; }
.event-side-title { background: #f59e0b !important; color: #fff !important; }
.event-side-title i { color: #fff; }
.event-side-list { list-style: none; padding: 0; margin: 0; }
.event-side-list li {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 6px 8px;
    border-bottom: 1px solid #f5f5f5;
    font-size: 11px;
}
.event-side-list li:last-child { border-bottom: none; }
.event-side-list li a { flex: 1; color: #333; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.event-side-list li a:hover { color: #e63946; }
.evt-cat { background: #e63946; color: #fff; border-radius: 10px; padding: 1px 7px; font-size: 10px; font-weight: 700; flex-shrink: 0; }
.evt-plus { color: #e63946; font-weight: 700; font-size: 10px; flex-shrink: 0; }
.evt-minus { color: #2196f3; font-weight: 700; font-size: 10px; flex-shrink: 0; }
.evt-date { color: #999; font-size: 10px; flex-shrink: 0; }

/* =============================================
   새글/새댓글 탭 위젯
   ============================================= */
.newpost-box { margin-bottom: 10px; padding: 0 !important; overflow: hidden; }
.tab-nav {
    display: flex;
    background: #f5f5f5;
    border-bottom: 1px solid #e0e0e0;
}
.tab-btn {
    flex: 1;
    background: none;
    border: none;
    padding: 8px 4px;
    font-size: 12px;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    transition: all .2s;
}
.tab-btn.active { background: #fff; color: #e63946; border-bottom: 2px solid #e63946; }
.tab-pane { padding: 4px 0; }
.newpost-list { list-style: none; padding: 0; margin: 0; }
.newpost-list li {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 5px 8px;
    border-bottom: 1px solid #f5f5f5;
    font-size: 11px;
}
.newpost-list li:last-child { border-bottom: none; }
.newpost-list li a { flex: 1; color: #333; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.newpost-list li a:hover { color: #e63946; }
.np-board { background: #e63946; color: #fff; border-radius: 3px; padding: 1px 5px; font-size: 10px; flex-shrink: 0; }
.np-date { color: #bbb; font-size: 10px; flex-shrink: 0; }
.np-empty { color: #bbb; text-align: center; padding: 12px 8px !important; }
.n-icon { background: #e63946; color: #fff; border-radius: 2px; padding: 0 3px; font-size: 9px; font-weight: 700; }
.lt_cmt { color: #e63946; font-size: 10px; font-weight: 700; }

/* =============================================
   반응형 - 모바일 (768px 이하)
   ============================================= */
@media screen and (max-width: 768px) {
    #content-wrap {
        flex-direction: column;
        gap: 10px;
        padding: 8px 6px;
    }
    #left-sidebar {
        display: none;
    }
    #main-content {
        width: 100%;
    }
    #header-inner {
        padding: 0 8px;
        height: 50px;
        flex-wrap: nowrap;
    }
    #logo {
        font-size: 18px;
    }
    #gnb {
        display: none;
    }
    #gnb-hamburger {
        display: flex;
    }
    .tb-event-btn {
        display: none;
    }
    .top-search {
        width: 120px;
    }
    .top-search input {
        width: 100px;
    }
    #nav-inner {
        padding: 0 6px;
    }
    #nav-inner a {
        font-size: 11px;
        padding: 8px 8px;
    }
    .board-list td.date {
        display: none;
    }
    .board-list td.num {
        display: none;
    }
    .board-grid {
        grid-template-columns: 1fr;
    }
}

/* =============================================
   게시판 탭 위젯 (꽁머니홍보 / 일반홍보 / ...)
   ============================================= */
.board-tab-wrap {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    margin-bottom: 14px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
}
.board-tab-nav {
    display: flex;
    background: #f5f5f5;
    border-bottom: 2px solid #e63946;
    overflow-x: auto;
    scrollbar-width: none;
}
.board-tab-nav::-webkit-scrollbar { display: none; }
.btab-btn {
    background: none;
    border: none;
    padding: 9px 14px;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    cursor: pointer;
    white-space: nowrap;
    transition: all .2s;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
}
.btab-btn.active, .btab-btn:hover { color: #e63946; border-bottom-color: #e63946; background: #fff; }
.btab-pane { display: none; }
.btab-pane.active { display: block; }
.btab-col-wrap {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}
.btab-list {
    list-style: none;
    padding: 4px 0;
    margin: 0;
    border-right: 1px solid #f0f0f0;
}
.btab-list:last-child { border-right: none; }
.btab-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 12px;
    border-bottom: 1px solid #f8f8f8;
    font-size: 12px;
}
.btab-list li:last-child { border-bottom: none; }
.btab-list li a {
    flex: 1;
    color: #333;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.btab-list li a:hover { color: #e63946; }
.btab-list li a em { color: #e63946; font-style: normal; font-size: 11px; margin-left: 2px; }
.btab-list .btab-empty { color: #aaa; font-size: 11px; padding: 10px 12px; }
.btab-date { color: #aaa; font-size: 10px; flex-shrink: 0; margin-left: 6px; }
.btab-more {
    text-align: right;
    padding: 5px 12px;
    border-top: 1px solid #f0f0f0;
    background: #fafafa;
}
.btab-more a { font-size: 11px; color: #e63946; text-decoration: none; font-weight: 600; }

/* =============================================
   먹튀리스트 카드 섹션
   ============================================= */
.fraud-list-section {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    margin-bottom: 14px;
    padding: 12px 14px;
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
}
.fraud-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}
.fl-title { font-size: 14px; font-weight: 700; color: #1a1a2e; }
.fl-title::before { content: ''; display: inline-block; width: 4px; height: 14px; background: #e63946; border-radius: 2px; margin-right: 6px; vertical-align: middle; }
.fl-more { font-size: 11px; color: #e63946; font-weight: 600; text-decoration: none; }
.fraud-card-row {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    scrollbar-width: none;
}
.fraud-card-row::-webkit-scrollbar { display: none; }
.fraud-card {
    flex-shrink: 0;
    width: 120px;
    text-decoration: none;
    color: #333;
}
.fraud-thumb {
    position: relative;
    width: 120px;
    height: 80px;
    background: #2d2d2d;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.fraud-thumb img { width: 100%; height: 100%; object-fit: cover; }
.fraud-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    background: #e63946;
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 10px;
}
.fraud-card-title {
    font-size: 11px;
    text-align: center;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.fraud-card:hover .fraud-card-title { color: #e63946; }

/* =============================================
   사이트 소개 + SEO 콘텐츠 섹션
   ============================================= */
.site-intro-wrap {
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    padding: 24px 20px;
    margin-bottom: 14px;
    box-shadow: 0 2px 6px rgba(0,0,0,.05);
}
.seo-section-title {
    font-size: 22px;
    font-weight: 800;
    color: #1a1a2e;
    text-align: center;
    margin-bottom: 6px;
}
.seo-section-subtitle {
    font-size: 13px;
    color: #666;
    text-align: center;
    margin-bottom: 20px;
}
/* 사이트 소개 카드 */
.site-intro-card {
    background: #f8f8f8;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 20px;
    margin-bottom: 20px;
}
.intro-highlight-bar {
    background: #1a1a2e;
    color: #fff;
    padding: 10px 14px;
    border-radius: 6px;
    font-size: 13px;
    margin-bottom: 14px;
    font-weight: 600;
}
.intro-main-title {
    font-size: 17px;
    font-weight: 800;
    color: #1a1a2e;
    line-height: 1.5;
    margin-bottom: 12px;
}
.site-intro-card p {
    font-size: 13px;
    color: #444;
    line-height: 1.9;
    margin-bottom: 10px;
}
/* Why 섹션 */
.seo-why-section { margin-bottom: 20px; }
.seo-why-title {
    margin-bottom: 12px;
}
.seo-why-title span {
    background: #e63946;
    color: #fff;
    padding: 7px 18px;
    border-radius: 20px;
    font-size: 15px;
    font-weight: 700;
}
.seo-why-list {
    list-style: none;
    padding: 0;
    margin: 0;
}
.seo-why-list li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    color: #444;
    line-height: 1.7;
    margin-bottom: 8px;
    padding-bottom: 8px;
    border-bottom: 1px dashed #e8e8e8;
}
.seo-why-list li:last-child { border-bottom: none; }
/* SEO 아티클 */
.seo-article { margin-bottom: 24px; }
.seo-article .seo-section-title { text-align: left; margin-bottom: 12px; font-size: 18px; }
.seo-article-card {
    background: #f8f8f8;
    border: 1px solid #e8e8e8;
    border-radius: 10px;
    padding: 18px 20px;
}
.seo-article-card.seo-card-yellow { background: #fffde7; border-color: #f59e0b; }
.seo-article-card.seo-card-dark { background: #1a1a2e; color: #ccc; border-color: #333; }
.seo-article-card.seo-card-dark p { color: #bbb; }
.seo-article-card p {
    font-size: 13px;
    color: #444;
    line-height: 1.9;
    margin-bottom: 12px;
}
.seo-num-list {
    list-style: none;
    padding: 0;
    margin: 0 0 10px 0;
}
.seo-num-list li {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    font-size: 13px;
    color: #444;
    line-height: 1.7;
    margin-bottom: 8px;
}
.seo-article-card.seo-card-dark .seo-num-list li { color: #bbb; }
.seo-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #e63946;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    flex-shrink: 0;
}
/* 서브 타이틀 색상 변형 */
.seo-sub-title-green, .seo-sub-title-red, .seo-sub-title-blue, .seo-sub-title-purple {
    display: inline-block;
    padding: 6px 16px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    margin: 14px 0 10px;
}
.seo-sub-title-green  { background: #27ae60; }
.seo-sub-title-red    { background: #e63946; }
.seo-sub-title-blue   { background: #0f3460; }
.seo-sub-title-purple { background: #7c3aed; }
/* 동적 콘텐츠 (g5_content) */
.seo-dynamic-content { font-size: 13px; color: #444; line-height: 1.9; }
.seo-dynamic-content p { margin-bottom: 10px; }
.seo-dynamic-content h2, .seo-dynamic-content h3 { font-weight: 700; color: #1a1a2e; margin: 12px 0 6px; }
.seo-dynamic-content ol, .seo-dynamic-content ul { padding-left: 20px; margin-bottom: 10px; }
.seo-dynamic-content li { margin-bottom: 5px; }
.seo-dynamic-content img { max-width: 100%; border-radius: 6px; margin: 8px 0; }
/* 섹션 제목 옆 관리자 수정 버튼 */
.seo-section-title {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.seo-article .seo-section-title { justify-content: flex-start; }
.seo-admin-edit-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #e63946;
    color: #fff !important;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
    transition: background .2s;
}
.seo-admin-edit-btn:hover { background: #c0392b; color: #fff !important; }
/* 내용 없을 때 관리자 안내 박스 */
.seo-empty-admin {
    background: #fff8e1;
    border: 2px dashed #f59e0b;
    border-radius: 8px;
    padding: 20px;
    font-size: 13px;
    color: #666;
    text-align: center;
    line-height: 2;
}
.seo-empty-admin i { font-size: 24px; color: #f59e0b; display: block; margin-bottom: 8px; }
.seo-empty-admin a { color: #e63946; text-decoration: none; }
.seo-empty-admin a:hover { text-decoration: underline; }
.seo-empty-admin code { background: #eee; padding: 2px 6px; border-radius: 4px; font-size: 12px; color: #333; }

/* =============================================
   배너 관리 팝업 (관리자 전용)
   ============================================= */
.bmp-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.6);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.bmp-box {
    background: #fff;
    border-radius: 12px;
    width: 100%;
    max-width: 520px;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0,0,0,.35);
    overflow: hidden;
}
.bmp-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    background: #1a1a2e;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    flex-shrink: 0;
}
.bmp-header i { color: #e63946; margin-right: 6px; }
.bmp-close {
    background: rgba(255,255,255,.15);
    border: none;
    color: #fff;
    width: 28px; height: 28px;
    border-radius: 50%;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .2s;
}
.bmp-close:hover { background: #e63946; }
.bmp-body {
    overflow-y: auto;
    padding: 16px;
    flex: 1;
}
.bmp-section-title {
    font-size: 12px;
    font-weight: 700;
    color: #888;
    text-transform: uppercase;
    letter-spacing: .5px;
    margin-bottom: 8px;
    padding-bottom: 4px;
    border-bottom: 1px solid #eee;
}
.bmp-section-title small { font-size: 10px; font-weight: 400; }
/* 배너 목록 */
.bmp-list { display: flex; flex-direction: column; gap: 8px; min-height: 40px; }
.bmp-empty, .bmp-loading {
    text-align: center;
    color: #aaa;
    font-size: 12px;
    padding: 16px 0;
}
.bmp-loading i { margin-right: 6px; color: #e63946; }
/* 배너 아이템 */
.bmp-item {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f8f8f8;
    border: 1px solid #e8e8e8;
    border-radius: 8px;
    padding: 8px 10px;
    transition: box-shadow .2s;
}
.bmp-item:hover { box-shadow: 0 2px 8px rgba(0,0,0,.1); }
.bmp-drag-handle {
    color: #bbb;
    cursor: grab;
    padding: 4px;
    font-size: 14px;
    flex-shrink: 0;
}
.bmp-drag-handle:active { cursor: grabbing; }
/* 썸네일 */
.bmp-thumb {
    position: relative;
    width: 64px;
    height: 48px;
    border-radius: 6px;
    overflow: hidden;
    background: #ddd;
    flex-shrink: 0;
}
.bmp-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bmp-thumb-empty { width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#bbb; font-size:20px; }
.bmp-change-img-btn {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,.45);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    cursor: pointer;
    opacity: 0;
    transition: opacity .2s;
}
.bmp-thumb:hover .bmp-change-img-btn { opacity: 1; }
/* 필드 */
.bmp-item-fields { flex: 1; display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.bmp-item-title, .bmp-item-link {
    width: 100%;
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 4px 8px;
    font-size: 12px;
    color: #333;
    background: #fff;
    outline: none;
    transition: border-color .2s;
}
.bmp-item-title:focus, .bmp-item-link:focus { border-color: #e63946; }
.bmp-link-row { display: flex; align-items: center; gap: 5px; }
.bmp-link-row i { color: #aaa; font-size: 11px; flex-shrink: 0; }
.bmp-link-row input { flex: 1; }
/* 버튼들 */
.bmp-item-btns { display: flex; flex-direction: column; gap: 4px; flex-shrink: 0; }
.bmp-save-btn, .bmp-del-btn {
    width: 28px; height: 28px;
    border: none;
    border-radius: 6px;
    font-size: 11px;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: background .2s;
}
.bmp-save-btn { background: #e63946; color: #fff; }
.bmp-save-btn:hover { background: #c0392b; }
.bmp-del-btn  { background: #eee; color: #999; }
.bmp-del-btn:hover  { background: #fdd; color: #e63946; }
/* 새 배너 추가 폼 */
.bmp-add-form { display: flex; flex-direction: column; gap: 10px; }
.bmp-upload-zone {
    border: 2px dashed #ddd;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background .2s;
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    color: #aaa;
}
.bmp-upload-zone i { font-size: 28px; color: #ddd; }
.bmp-upload-zone span { font-size: 13px; font-weight: 600; color: #888; }
.bmp-upload-zone small { font-size: 10px; }
.bmp-upload-zone:hover, .bmp-upload-zone.has-img { border-color: #e63946; background: #fff8f8; }
.bmp-upload-zone.has-img i, .bmp-upload-zone.has-img span { color: #e63946; }
.bmp-add-preview { width: 100%; max-height: 140px; object-fit: contain; border-radius: 8px; border: 1px solid #eee; }
.bmp-field { display: flex; flex-direction: column; gap: 4px; }
.bmp-field label { font-size: 11px; font-weight: 700; color: #666; }
.bmp-field label i { color: #aaa; margin-right: 3px; }
.bmp-field input {
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 13px;
    color: #333;
    outline: none;
    transition: border-color .2s;
}
.bmp-field input:focus { border-color: #e63946; }
.bmp-btn-primary {
    background: linear-gradient(135deg, #e63946, #ff6b35);
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 10px 0;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    transition: opacity .2s;
    width: 100%;
}
.bmp-btn-primary:hover { opacity: .9; }
.bmp-btn-primary:disabled { opacity: .5; cursor: not-allowed; }
/* 배너 관리 열기 버튼 (사이드바 내) */
.banner-mgr-open-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    background: #fff3f3;
    border: 2px dashed #e63946;
    color: #e63946;
    border-radius: 7px;
    padding: 7px 0;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
    margin-top: 4px;
    margin-bottom: 4px;
    transition: background .2s;
}
.banner-mgr-open-btn:hover { background: #ffe0e3; }
/* 토스트 */
.bmp-toast {
    position: fixed;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    background: #1a1a2e;
    color: #fff;
    padding: 9px 20px;
    border-radius: 24px;
    font-size: 13px;
    opacity: 0;
    transition: opacity .25s, transform .25s;
    z-index: 999999;
    pointer-events: none;
}
.bmp-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.bmp-toast-err { background: #e63946; }
.bmp-toast-ok  { background: #27ae60; }

/* =============================================
   동적 사이드바 배너 (toto_banners 테이블)
   ============================================= */
.side-banner-img-link {
    display: block;
    margin-bottom: 6px;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
    line-height: 0;
}
.side-banner-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 6px;
    transition: opacity .2s;
}
.side-banner-img-link:hover .side-banner-img { opacity: .9; }
.sb-edit-overlay {
    position: absolute;
    top: 6px; right: 6px;
    background: rgba(230,57,70,.9);
    color: #fff !important;
    width: 26px; height: 26px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px;
    text-decoration: none;
    opacity: 0;
    transition: opacity .2s;
    z-index: 5;
}
.side-banner-img-link:hover .sb-edit-overlay,
.side-banner-dyn:hover .sb-edit-overlay { opacity: 1; }
.side-banner-add-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    background: #fff3f3;
    border: 2px dashed #e63946;
    color: #e63946 !important;
    border-radius: 6px;
    padding: 7px 10px;
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
    margin-bottom: 6px;
    transition: background .2s;
    cursor: pointer;
}
.side-banner-add-btn:hover { background: #ffe0e3; }
/* 게시판 탭 관리자 버튼 */
.btab-admin-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px; height: 22px;
    background: #e63946;
    color: #fff !important;
    border-radius: 50%;
    font-size: 10px;
    text-decoration: none;
    margin-right: 4px;
    transition: background .2s;
    flex-shrink: 0;
}
.btab-admin-btn:hover { background: #c0392b; }
/* 게시판 탭 카테고리 라벨 */
.btab-cat {
    color: #e63946;
    font-weight: 700;
    font-size: 11px;
    margin-right: 2px;
    white-space: nowrap;
}
/* 먹튀리스트 - 이미지 없을 때 */
.fraud-no-img {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: #2a2a3e;
    color: #e63946;
    font-size: 28px;
}
.fl-admin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px; height: 22px;
    background: #e63946;
    color: #fff !important;
    border-radius: 50%;
    font-size: 10px;
    text-decoration: none;
    margin-left: 6px;
}
.fl-admin:hover { background: #c0392b; }
/* =============================================
   랭킹 탭 (레벨 랭킹 / 포인트 랭킹)
   ============================================= */
.rank-tab-box { padding-bottom: 0; }
.rank-tab-nav {
    display: flex;
    background: #f0f0f0;
    border-bottom: 1px solid #ccc;
    position: relative;
}
.rank-tab-btn {
    flex: 1;
    background: none;
    border: none;
    padding: 7px 4px;
    font-size: 12px;
    font-weight: 600;
    color: #888;
    cursor: pointer;
    transition: color .2s, border-bottom .2s;
    border-bottom: 2px solid transparent;
}
.rank-tab-btn.active {
    color: #e63946;
    border-bottom: 2px solid #e63946;
}
.rank-tab-pane { display: block; }
/* 아바타 이미지 */
.rank-avatar {
    width: 22px; height: 22px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid #ddd;
}
.rank-lv {
    font-size: 10px;
    color: #888;
    flex-shrink: 0;
    background: #f0f0f0;
    border-radius: 3px;
    padding: 1px 4px;
}

/* =============================================
   푸터 원본 스타일
   ============================================= */
#footer {
    background: #1a1a2e;
    color: #aaa;
    margin-top: 0;
    width: 100vw;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    box-sizing: border-box;
}
#footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 28px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
}
.footer-logo {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #fff;
    font-size: 20px;
    font-weight: 800;
    flex-shrink: 0;
}
.footer-logo .logo-flower { font-size: 24px; }
.footer-corp {
    flex: 1;
    font-size: 11px;
    line-height: 1.7;
    color: #888;
    min-width: 200px;
}
.footer-corp p { margin-bottom: 4px; }
.footer-tg {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}
.footer-tg a {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #229ED9;
    color: #fff !important;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    transition: background .2s;
}
.footer-tg a:hover { background: #1a8bbf; }
.footer-tg span { font-size: 11px; color: #888; text-align: center; }
.footer-btns {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.footer-btns a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    transition: opacity .2s;
}
.footer-btns a:hover { opacity: .85; }
.footer-btn-contact { background: #e63946; color: #fff !important; }
.footer-btn-mobile  { background: #333; color: #fff !important; }
.footer-copy {
    width: 100%;
    text-align: center;
    font-size: 11px;
    color: #666;
    border-top: 1px solid #2a2a40;
    padding-top: 16px;
    margin-top: 4px;
}

/* =============================================
   랭킹 탭 위젯 (레벨/포인트 탭 전환)
   ============================================= */
.rank-tab-box { overflow: hidden; }
.rank-tab-nav {
    display: flex;
    border-bottom: 2px solid #f0f0f0;
    background: #fff;
    padding: 0;
    position: relative;
}
.rank-tab-btn {
    flex: 1;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    padding: 9px 6px;
    font-size: 12px;
    font-weight: 600;
    color: #aaa;
    cursor: pointer;
    transition: all .2s;
}
.rank-tab-btn.active { color: #e63946; border-bottom-color: #e63946; background: #fff; }
.rank-tab-btn:hover:not(.active) { color: #555; }
.rank-tab-pane { display: none; }
.rank-tab-pane.active { display: block; }
/* 랭킹 아바타 */
.rank-avatar {
    width: 20px; height: 20px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
    border: 1px solid #eee;
}
/* 레벨 뱃지 */
.rank-lv {
    font-size: 10px;
    color: #fff;
    background: #1a1a2e;
    border-radius: 8px;
    padding: 1px 6px;
    font-weight: 700;
    flex-shrink: 0;
}
/* 포인트 코인 아이콘 */
.rank-coin {
    color: #f59e0b;
    font-size: 10px;
    margin-right: 2px;
}
/* 이벤트 사이드 타이틀 개선 */
.event-side-title {
    background: linear-gradient(135deg, #f59e0b, #e67e00) !important;
    color: #fff !important;
    border-radius: 0;
}

/* =============================================
   게시판 목록 (basic skin) - 레퍼런스(preview.html) 완전 일치
   ============================================= */

/* 타이틀바: 레퍼런스 #f0f0f0 */
#bo_list .board-box-title {
    background: #f0f0f0 !important;
    border-bottom: 1px solid #ccc !important;
    padding: 5px 8px !important;
}
#bo_list .board-box-title .tit {
    font-size: 13px !important;
    font-weight: bold !important;
    color: #111 !important;
}
#bo_list .board-box-title .tit strong {
    color: #e94560 !important;
    font-weight: bold !important;
}

/* 헤더 행 */
#bo_list .tbl_head01 thead th,
#bo_list .tbl_wrap thead th {
    background: #f5f5f5 !important;
    color: #555 !important;
    font-weight: 600 !important;
    font-size: 12px !important;
    padding: 6px 7px !important;
    border: none !important;
    border-bottom: 1px solid #ddd !important;
    text-align: center !important;
    white-space: nowrap !important;
}
#bo_list .tbl_head01 thead tr,
#bo_list .tbl_wrap thead tr {
    background: #f5f5f5 !important;
    border-bottom: 1px solid #ddd !important;
}
#bo_list .tbl_head01 thead th a,
#bo_list .tbl_wrap thead th a {
    color: #555 !important; text-decoration: none !important;
}

/* 바디 행: 레퍼런스 padding 4px 7px, 12px */
#bo_list tbody td {
    padding: 7px 7px !important;
    font-size: 14px !important;
    color: #333 !important;
    border: none !important;
    vertical-align: middle !important;
}
#bo_list tbody tr {
    border-bottom: 1px solid #ebebeb !important;
}
#bo_list tbody tr:last-child { border-bottom: none !important; }
#bo_list tbody tr:nth-child(even) td { background: #f9f9f9 !important; }
#bo_list tbody tr:hover td { background: #fff3f3 !important; }

/* 날짜: 레퍼런스 #aaa */
#bo_list .td_datetime,
#bo_list .td_date {
    color: #aaa !important;
    font-size: 11px !important;
    text-align: right !important;
}

/* 번호/조회 컬럼 */
#bo_list .td_num2 { color: #999 !important; font-size: 11px !important; text-align: center !important; }
#bo_list .td_num  { color: #999 !important; font-size: 11px !important; text-align: center !important; }

/* 제목 링크: 레퍼런스 #333 */
#bo_list .bo_tit a { font-size: 14px !important; color: #333 !important; font-weight: normal !important; }
#bo_list .bo_tit a:hover { color: #e94560 !important; }

/* 새글 아이콘: 레퍼런스 n-icon 스타일 (빨간 배지 N) */
#bo_list .bo_tit .new_icon {
    display: inline-block !important;
    background: #e94560 !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: bold !important;
    padding: 0 3px !important;
    margin-right: 2px !important;
    border-radius: 0 !important;
    vertical-align: middle !important;
    line-height: 1.7 !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
}

/* 알림/공지 배지 */
#bo_list .notice_icon {
    display: inline-block !important;
    padding: 1px 6px !important;
    background: #e94560 !important; color: #fff !important;
    font-size: 10px !important; font-weight: bold !important;
    border-radius: 0 !important; line-height: 1.6 !important;
    white-space: nowrap !important; vertical-align: middle !important;
}

/* 이름 컬럼 */
#bo_list .td_name { width: 130px !important; }
#bo_list .list-name-wrap {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 12px !important;
    color: #444 !important;
    white-space: nowrap !important;
}
#bo_list .list-prof-img {
    width: 22px !important; height: 22px !important;
    border-radius: 50% !important; object-fit: cover !important;
    flex-shrink: 0 !important; border: 1px solid #e0e0e0 !important;
}
#bo_list .list-prof-default {
    display: inline-flex !important;
    align-items: center !important; justify-content: center !important;
    width: 22px !important; height: 22px !important;
    border-radius: 50% !important;
    background: #e94560 !important; color: #fff !important;
    font-size: 10px !important; font-weight: 700 !important;
    flex-shrink: 0 !important;
}

/* widget-gear: 아이콘 버튼 + | 구분자 제거 */
#bo_list .bo-title-btns .widget-gear::before,
#bo_list .bo-title-btns .widget-gear::after { display: none !important; content: none !important; }
#bo_list .bo-title-btns .widget-gear {
    display: inline-flex !important; align-items: center !important;
    justify-content: center !important;
    width: 26px !important; height: 26px !important;
    background: #f5f5f5 !important; color: #666 !important;
    border: 1px solid #ddd !important; border-radius: 4px !important;
    font-size: 12px !important; text-decoration: none !important;
}
#bo_list .bo-title-btns .widget-gear:hover {
    background: #e94560 !important; color: #fff !important; border-color: #e94560 !important;
}

/* =============================================
   모바일 슬라이드 메뉴
   ============================================= */
#mobile-menu-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.5);
    z-index: 9000;
}
#mobile-menu-overlay.open { display: block; }

#mobile-menu {
    position: fixed;
    top: 0; right: -280px;
    width: 280px;
    height: 100%;
    background: #fff;
    z-index: 9100;
    overflow-y: auto;
    transition: right .28s cubic-bezier(.4,0,.2,1);
    display: flex;
    flex-direction: column;
}
#mobile-menu.open { right: 0; }

.mm-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    background: #1a1a2e;
    border-bottom: 3px solid #e63946;
    flex-shrink: 0;
}
.mm-logo {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 900;
    color: #fff;
    letter-spacing: -0.5px;
}
#mobile-menu-close {
    background: none;
    border: none;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: background .2s;
}
#mobile-menu-close:hover { background: rgba(255,255,255,.15); }

.mm-nav { list-style: none; margin: 0; padding: 8px 0; flex: 1; }
.mm-item > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 18px;
    font-size: 14px;
    font-weight: 700;
    color: #222;
    border-bottom: 1px solid #f0f0f0;
    text-decoration: none;
    transition: background .15s;
}
.mm-item > a:hover { background: #fff5f5; color: #e63946; }
.mm-item.has-sub > a::after { content: '\f107'; font-family: 'Font Awesome 6 Free'; font-weight: 900; font-size: 12px; color: #aaa; }
.mm-item.has-sub.expanded > a::after { content: '\f106'; }

.mm-sub {
    display: none;
    list-style: none;
    background: #f8f8f8;
    border-bottom: 1px solid #eee;
}
.mm-item.expanded .mm-sub { display: block; }
.mm-sub li a {
    display: block;
    padding: 10px 18px 10px 32px;
    font-size: 13px;
    color: #555;
    text-decoration: none;
    border-bottom: 1px solid #f0f0f0;
    transition: background .15s;
}
.mm-sub li a:hover { background: #fff0f0; color: #e63946; }

.mm-user, .mm-login {
    padding: 14px 16px;
    border-top: 1px solid #e8e8e8;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
}
.mm-nick { font-size: 13px; font-weight: 700; color: #222; flex: 1; }
.mm-logout {
    font-size: 12px; color: #e63946;
    border: 1px solid #e63946; padding: 4px 10px; border-radius: 4px;
    text-decoration: none; transition: all .2s;
}
.mm-logout:hover { background: #e63946; color: #fff; }
.mm-btn-login, .mm-btn-join {
    flex: 1; text-align: center; padding: 10px 0;
    font-size: 13px; font-weight: 700; border-radius: 4px;
    text-decoration: none; transition: all .2s;
}
.mm-btn-login { background: #f0f0f0; color: #333; border: 1px solid #ddd; }
.mm-btn-login:hover { background: #e0e0e0; }
.mm-btn-join { background: #e63946; color: #fff; border: 1px solid #e63946; }
.mm-btn-join:hover { background: #c0392b; }

/* =============================================
   모바일 반응형 (≤768px)
   ============================================= */
@media screen and (max-width: 768px) {

    /* 헤더 */
    #header-inner {
        min-height: 54px;
        padding: 0 12px;
    }
    #logo a { font-size: 20px; }
    .logo-flower { font-size: 18px; }
    .logo-text { font-size: 20px; }
    .logo-sub { font-size: 8px; }

    /* GNB 숨기고 햄버거 표시 */
    #gnb { display: none !important; }
    #gnb-hamburger {
        display: flex !important;
        align-items: center;
        justify-content: center;
        width: 38px; height: 38px;
        border: 1px solid #e0e0e0;
        border-radius: 6px;
        background: #fff;
        font-size: 17px;
        color: #333;
        cursor: pointer;
        margin-left: auto;
        flex-shrink: 0;
    }

    /* TOP BAR */
    .top-bar-inner {
        flex-wrap: wrap;
        gap: 6px;
        padding: 6px 10px;
    }
    .top-bar-left { font-size: 11px; gap: 5px; }
    .top-search input { width: 130px; }
    .top-btn-login, .top-btn-join { padding: 3px 8px; font-size: 10px; }

    /* 3단 → 1단 */
    #content-wrap {
        flex-direction: column;
        gap: 8px;
        padding: 8px;
    }
    #sidebar-banners { display: none !important; }
    #left-sidebar {
        width: 100% !important;
        min-width: 0 !important;
        order: 2;
    }
    #main-content { width: 100%; order: 1; }

    /* 보드 그리드 1열 */
    .board-grid { grid-template-columns: 1fr !important; }

    /* 게시판 테이블 - 날짜/조회 숨김 */
    #bo_list .td_datetime,
    #bo_list .td_date,
    #bo_list .td_num { display: none !important; }
    #bo_list thead th:last-child,
    #bo_list thead th:nth-last-child(2) { display: none !important; }

    /* 검색 팝업 위치 */
    #bo_list .bo_sch_wrap { right: 0 !important; min-width: 240px !important; }

    /* 패널티 테이블 */
    .pen-table .td-date { display: none; }
    .pen-table thead th:last-child { display: none; }

    /* 공지 티커 */
    .notice-ticker { font-size: 11px; }

    /* 푸터 */
    #footer { padding: 16px 12px; font-size: 11px; }

    /* 팝업박스 */
    .popup-box { width: 94vw; }
}

/* =============================================
   새글(알림) 페이지 - new.php 스타일 오버라이드
   ============================================= */

/* 검색 fieldset */
#new_sch {
    border: none !important;
    background: #fff;
    border-radius: 10px;
    padding: 20px 22px !important;
    margin-bottom: 18px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
}
#new_sch legend {
    font-size: 15px !important;
    font-weight: 800 !important;
    color: #1a1a2e !important;
    padding: 0 6px !important;
    background: #fff;
    letter-spacing: -0.3px;
}
#new_sch form {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
}
#new_sch select {
    height: 38px;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 0 10px;
    font-size: 13px;
    color: #333;
    background: #f9f9f9;
    outline: none;
    cursor: pointer;
    min-width: 100px;
}
#new_sch input[type=text], #new_sch input#mb_id {
    flex: 1;
    height: 38px;
    border: 1px solid #ddd;
    border-radius: 6px;
    padding: 0 12px;
    font-size: 13px;
    color: #333;
    outline: none;
    min-width: 160px;
}
#new_sch input[type=text]:focus, #new_sch input#mb_id:focus {
    border-color: #e94560;
    box-shadow: 0 0 0 2px rgba(233,69,96,.12);
}
#new_sch .btn_submit {
    height: 38px;
    padding: 0 20px;
    background: #e94560;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background .15s;
    white-space: nowrap;
}
#new_sch .btn_submit:hover { background: #c0392b; }
#new_sch p {
    width: 100%;
    font-size: 12px;
    color: #aaa;
    margin: 6px 0 0 !important;
}

/* 목록 테이블 */
#main-content .tbl_head01.tbl_wrap,
.tbl_head01.tbl_wrap {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
    margin-bottom: 16px;
}
#main-content .tbl_head01 table,
.tbl_head01 table {
    width: 100% !important;
    border-collapse: collapse !important;
    background: #fff;
}
#main-content .tbl_head01 thead th,
.tbl_head01 thead th {
    background: #1a1a2e !important;
    color: #fff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    padding: 11px 10px !important;
    text-align: center !important;
    border: none !important;
    white-space: nowrap;
}
#main-content .tbl_head01 tbody tr,
.tbl_head01 tbody tr {
    border-bottom: 1px solid #f0f0f0 !important;
}
#main-content .tbl_head01 tbody tr:hover td,
.tbl_head01 tbody tr:hover td {
    background: #fff3f3 !important;
}
#main-content .tbl_head01 tbody td,
.tbl_head01 tbody td {
    padding: 9px 10px !important;
    font-size: 13px !important;
    color: #333 !important;
    vertical-align: middle !important;
    border: none !important;
}
#main-content .tbl_head01 tbody tr:nth-child(even) td,
.tbl_head01 tbody tr:nth-child(even) td {
    background: #fafafa;
}

/* 컬럼별 */
.tbl_head01 .td_group a,
.tbl_head01 .td_board a {
    font-size: 11px !important;
    color: #888 !important;
    text-decoration: none;
    background: #f0f0f0;
    border-radius: 3px;
    padding: 2px 6px;
    white-space: nowrap;
    transition: all .12s;
}
.tbl_head01 .td_group a:hover,
.tbl_head01 .td_board a:hover {
    background: #e94560;
    color: #fff !important;
}
.tbl_head01 .new_tit {
    color: #222 !important;
    text-decoration: none !important;
    font-size: 13px !important;
    transition: color .12s;
}
.tbl_head01 .new_tit:hover { color: #e94560 !important; }
.tbl_head01 .td_date {
    color: #aaa !important;
    font-size: 11px !important;
    text-align: center !important;
    white-space: nowrap;
}
.tbl_head01 .td_name {
    text-align: center !important;
    font-size: 12px !important;
    color: #555 !important;
}
.tbl_head01 .empty_table {
    text-align: center !important;
    color: #bbb !important;
    padding: 30px 0 !important;
    font-size: 14px !important;
}

/* =============================================
   전체 메뉴 패널 (우측 슬라이드)
   ============================================= */
#megamenu-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.52);
    z-index: 9998;
    cursor: pointer;
}
#megamenu-overlay.open { display: block; }

#megamenu-panel {
    position: fixed;
    top: 0; right: 0; bottom: 0;
    width: 300px;
    background: #fff;
    z-index: 9999;
    transform: translateX(100%);
    transition: transform .3s cubic-bezier(.4,0,.2,1);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: -4px 0 24px rgba(0,0,0,.18);
}
#megamenu-panel.open { transform: translateX(0); }
body.megamenu-open { overflow: hidden; }

/* 헤더 */
.megamenu-hd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 16px;
    height: 52px;
    border-bottom: 2px solid #e94560;
    flex-shrink: 0;
    background: #fff;
}
.megamenu-title {
    font-size: 16px;
    font-weight: 800;
    color: #111;
    letter-spacing: -.3px;
}
#megamenu-close {
    background: none;
    border: none;
    font-size: 18px;
    color: #888;
    cursor: pointer;
    padding: 6px 4px;
    line-height: 1;
    transition: color .15s;
}

/* ═══════════════════════════════════════════════
   전체너비 홈페이지 (full_width_page) 레이아웃
   ═══════════════════════════════════════════════ */
#fw-page {
    width: 100%;
    background: #f2f4f7;
    min-height: 400px;
    flex: 1;
}
.home-wrap {
    width: 100%;
    background: #f2f4f7;
}

/* 공통 섹션 컨테이너 */
.h-sec {
    width: 100%;
    padding: 0 0 24px;
}
.h-con {
    max-width: 820px;
    margin: 0 auto;
    padding: 0 16px;
}

/* ── [1] 사이트 소개 섹션 ── */
.h-intro-sec {
    background: #f2f4f7;
    padding: 28px 0 24px;
    text-align: center;
}
.h-title1 {
    font-size: 20px;
    font-weight: 800;
    color: #111;
    margin: 0 0 8px;
    letter-spacing: -.5px;
}
.h-sub1 {
    font-size: 13px;
    color: #555;
    margin: 0 0 18px;
}
.h-intro-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
    display: flex;
    align-items: stretch;
    text-align: left;
    overflow: hidden;
}
.h-intro-body {
    flex: 1;
    padding: 24px 22px;
    min-width: 0;
}
.h-intro-greet {
    font-size: 12px;
    color: #777;
    margin: 0 0 10px;
}
.h-intro-hl {
    font-size: 15px;
    font-weight: 800;
    color: #111;
    line-height: 1.5;
    margin: 0 0 14px;
    letter-spacing: -.3px;
}
.h-intro-body p {
    font-size: 12.5px;
    color: #444;
    line-height: 1.75;
    margin: 0 0 8px;
}
.h-intro-right {
    width: 160px;
    flex-shrink: 0;
    background: linear-gradient(160deg, #c8102e 60%, #8b0000 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 12px;
}
.h-trophy-box {
    text-align: center;
    color: #fff;
}
.h-trophy-icon {
    font-size: 48px;
    color: #ffd700;
    margin-bottom: 10px;
    text-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.h-trophy-sub {
    font-size: 11px;
    color: rgba(255,255,255,.8);
    margin-bottom: 4px;
}
.h-trophy-name {
    font-size: 20px;
    font-weight: 900;
    color: #fff;
    letter-spacing: 1px;
}
.h-trophy-watermark {
    font-size: 10px;
    color: rgba(255,255,255,.4);
    letter-spacing: 3px;
    margin-top: 6px;
    font-weight: 700;
}

/* ── [2] 공식 보증업체 (기존 .sponsor-* 재사용, h-con 안에 배치) ── */
.h-sec .section-header {
    margin-bottom: 10px;
}
.h-sec .sponsor-grid {
    margin-top: 0;
}

/* ── [3] Why 섹션 ── */
.h-why-head {
    background: #c8102e;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    text-align: center;
    padding: 12px 16px;
    border-radius: 6px 6px 0 0;
    letter-spacing: -.2px;
}
.h-why-card {
    background: #fff;
    border-radius: 0 0 8px 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
    padding: 20px 24px 18px;
}
.h-why-list {
    list-style: none;
    margin: 0 0 14px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.h-why-list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-size: 13px;
    color: #333;
    line-height: 1.6;
}
.h-wn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 30px;
    height: 30px;
    background: #c8102e;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    font-weight: 800;
    flex-shrink: 0;
    margin-top: 2px;
}
.h-why-note {
    font-size: 12px;
    color: #666;
    line-height: 1.7;
    margin: 0;
    padding-top: 12px;
    border-top: 1px solid #eee;
}

/* ── [6-12] SEO 텍스트 섹션 ── */
.h-seo-sec {
    padding-bottom: 20px;
}
.h-seo-title {
    font-size: 16px;
    font-weight: 800;
    color: #111;
    text-align: center;
    padding: 14px 0;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    letter-spacing: -.3px;
}
.h-seo-card {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
    padding: 20px 24px;
    font-size: 13px;
    color: #333;
    line-height: 1.8;
}
.h-seo-card h4 {
    font-size: 14px;
    font-weight: 700;
    color: #111;
    margin: 14px 0 8px;
}
.h-seo-card ul {
    padding-left: 18px;
    margin: 6px 0 10px;
}
.h-seo-card li {
    margin-bottom: 4px;
}
.h-seo-card a { color: #c8102e; }

/* ── 게시판 탭 (홈 전용 – 기존 .board-tab-wrap 재사용) ── */
.h-sec .board-tab-wrap {
    background: #fff;
    border: none;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
    overflow: hidden;
    margin-bottom: 0;
}

/* ── 먹튀리스트 (기존 .fraud-* 재사용) ── */
.h-sec .fraud-list-section {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,.07);
    overflow: hidden;
}

/* 홈 섹션 간격 */
.h-sec + .h-sec {
    padding-top: 0;
}

/* ── [0] 홈 위젯바 ── */
.h-widget-bar {
    background: #fff;
    border-bottom: 1px solid #e8e8e8;
    padding: 8px 0;
}
.h-widget-inner {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

/* 로그인 영역 */
.h-wbar-login {
    flex-shrink: 0;
}
.h-wbar-form {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}
.h-wbar-inp {
    height: 30px;
    padding: 0 8px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 12px;
    width: 110px;
    background: #fafafa;
}
.h-wbar-inp:focus {
    outline: none;
    border-color: #c8102e;
    background: #fff;
}
.h-wbar-btn {
    display: inline-block;
    height: 30px;
    line-height: 28px;
    padding: 0 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    border: 1px solid #ccc;
    background: #f5f5f5;
    color: #333;
    white-space: nowrap;
}
.h-wbar-btn-login {
    background: #c8102e;
    color: #fff;
    border-color: #c8102e;
}
.h-wbar-btn-login:hover { background: #a80d25; }
.h-wbar-btn-out { border-color: #888; color: #555; }
.h-wbar-link {
    font-size: 11px;
    color: #888;
    text-decoration: none;
    white-space: nowrap;
}
.h-wbar-link:hover { color: #c8102e; }

/* 로그인 상태 - 회원정보 */
.h-wbar-member {
    display: flex;
    align-items: center;
    gap: 10px;
}
.h-wbar-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 14px;
    color: #888;
    flex-shrink: 0;
}
.h-wbar-avatar img { width: 100%; height: 100%; object-fit: cover; }
.h-wbar-info {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 80px;
}
.h-wbar-nick {
    font-size: 12px;
    font-weight: 700;
    color: #111;
}
.h-wbar-exp {
    height: 4px;
    background: #eee;
    border-radius: 2px;
    width: 80px;
}
.h-wbar-exp-fill {
    height: 100%;
    background: #c8102e;
    border-radius: 2px;
}
.h-wbar-btns {
    display: flex;
    gap: 4px;
}

/* 공지 티커 */
.h-wbar-ticker {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    background: #f9f9f9;
    border: 1px solid #eee;
    border-radius: 4px;
    padding: 5px 10px;
    height: 30px;
    overflow: hidden;
}
.h-wbar-ticker-label {
    font-size: 11px;
    color: #c8102e;
    font-weight: 700;
    white-space: nowrap;
    flex-shrink: 0;
}
.h-wbar-ticker-wrap {
    flex: 1;
    overflow: hidden;
    position: relative;
    height: 20px;
}
.h-wbar-ticker-move {
    white-space: nowrap;
    font-size: 12px;
    color: #444;
    animation: h-ticker-scroll 22s linear infinite;
    display: inline-block;
    padding-left: 100%;
}
.h-wbar-ticker-move a {
    color: #333;
    text-decoration: none;
    margin-right: 12px;
}
.h-wbar-ticker-move a:hover { color: #c8102e; }
@keyframes h-ticker-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

/* 모바일 반응형 */
@media (max-width: 640px) {
    .h-intro-card { flex-direction: column; }
    .h-intro-right { width: 100%; height: 120px; }
    .h-trophy-icon { font-size: 36px; }
    .h-con { padding: 0 10px; }
    .h-widget-inner { flex-direction: column; align-items: flex-start; gap: 8px; }
    .h-wbar-ticker { width: 100%; }
    .h-wbar-inp { width: 90px; }
}
#megamenu-close:hover { color: #e94560; }

/* 빠른 버튼 */
.megamenu-quick {
    display: flex;
    border-bottom: 1px solid #f0f0f0;
    flex-shrink: 0;
}
.megamenu-qbtn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 14px 4px;
    text-decoration: none;
    font-size: 11px;
    font-weight: 600;
    color: #555;
    border-right: 1px solid #f0f0f0;
    transition: background .15s, color .15s;
}
.megamenu-qbtn:last-child { border-right: none; }
.megamenu-qbtn i { font-size: 20px; color: #e94560; }
.megamenu-qbtn:hover { background: #fff6f7; color: #e94560; }

/* 텔레그램 배너 */
.megamenu-tg-banner {
    display: flex;
    align-items: center;
    gap: 10px;
    background: linear-gradient(90deg, #1565c0, #1e88e5);
    padding: 11px 16px;
    text-decoration: none;
    flex-shrink: 0;
    transition: filter .15s;
}
.megamenu-tg-banner:hover { filter: brightness(1.08); }
.megamenu-tg-banner > .fab { font-size: 26px; color: #fff; flex-shrink: 0; }
.megamenu-tg-text { flex: 1; }
.megamenu-tg-text strong { display: block; font-size: 12px; color: #fff; font-weight: 700; margin-bottom: 2px; }
.megamenu-tg-text span  { font-size: 11px; color: rgba(255,255,255,.82); }
.megamenu-tg-banner > .fas { font-size: 12px; color: rgba(255,255,255,.65); flex-shrink: 0; }

/* 메뉴 본문 (스크롤) */
.megamenu-body {
    flex: 1;
    overflow-y: auto;
    padding: 4px 0 24px;
}
.megamenu-body::-webkit-scrollbar { width: 4px; }
.megamenu-body::-webkit-scrollbar-thumb { background: #ddd; border-radius: 4px; }

/* 섹션 */
.megamenu-section {
    padding: 14px 16px 10px;
    border-bottom: 1px solid #f4f4f4;
}
.megamenu-section:last-child { border-bottom: none; }

.megamenu-sec-title {
    font-size: 11px;
    font-weight: 800;
    color: #aaa;
    letter-spacing: .8px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.megamenu-sec-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5px;
}

.megamenu-link {
    display: block;
    padding: 8px 10px;
    font-size: 13px;
    color: #333;
    text-decoration: none;
    border-radius: 5px;
    background: #f7f7f7;
    border: 1px solid #efefef;
    text-align: center;
    transition: background .15s, color .15s, border-color .15s;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.megamenu-link:hover {
    background: #e94560;
    color: #fff;
    border-color: #e94560;
}

/* ── SEO 텍스트 섹션 ── */
.seo-section {
    padding: 10px 0 6px;
}
.seo-section + .seo-section {
    border-top: 1px solid #f0f0f0;
    padding-top: 14px;
}
.seo-section-body {
    font-size: 13px;
    color: #444;
    line-height: 1.8;
    margin-top: 6px;
}
.seo-section-body p {
    margin: 0 0 6px;
}
.seo-section-body a {
    color: #e63946;
    text-decoration: none;
}
.seo-section-body a:hover {
    text-decoration: underline;
}

/* ── SEO 리치 콘텐츠 공통 ── */
.seo-card {
    background: #f5f5f7;
    border-radius: 8px;
    padding: 18px 22px;
    margin: 10px 0 14px;
    font-size: 13px;
    line-height: 1.9;
    color: #333;
}
.seo-card-dark {
    background: linear-gradient(135deg, #141432 0%, #1e1e5a 60%, #2d1060 100%);
    border-radius: 8px;
    padding: 22px 26px;
    margin: 10px 0 14px;
    color: #ddd;
    font-size: 13px;
    line-height: 1.9;
    position: relative;
    overflow: hidden;
}
.seo-card-dark .seo-big-text {
    color: #fff;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.4;
    margin: 10px 0;
}
.seo-card-yellow {
    background: linear-gradient(135deg, #f6c000 0%, #f9a800 100%);
    border-radius: 8px;
    padding: 22px 26px;
    margin: 10px 0 14px;
    font-size: 13px;
    line-height: 1.9;
    color: #222;
    position: relative;
    overflow: hidden;
}
.seo-card-yellow strong { color: #7d4000; }
.seo-card-darkblue {
    background: linear-gradient(135deg, #0a0a2e 0%, #1a237e 100%);
    border-radius: 8px;
    padding: 22px 26px;
    margin: 10px 0 14px;
    color: #ccc;
    font-size: 13px;
    line-height: 1.9;
}
.seo-card-darkblue .seo-big-text {
    color: #fff;
    font-size: 20px;
    font-weight: 900;
    line-height: 1.4;
    margin: 10px 0;
}
.seo-card-img {
    float: right;
    max-width: 180px;
    margin: 0 0 10px 18px;
}
.seo-card::after, .seo-card-dark::after, .seo-card-yellow::after, .seo-card-darkblue::after {
    content: '';
    display: table;
    clear: both;
}
/* 서브 헤딩 배너 */
.seo-sub-head {
    display: block;
    padding: 9px 20px;
    border-radius: 24px;
    font-size: 15px;
    font-weight: 800;
    color: #fff;
    margin: 16px 0 10px;
    width: fit-content;
}
.seo-sh-teal   { background: #00c4b0; }
.seo-sh-navy   { background: #1a237e; }
.seo-sh-purple { background: #7b1fa2; }
.seo-sh-pink   { background: #e91e8c; }
.seo-sh-orange { background: #ff6b35; }
.seo-sh-red    { background: #e63946; }
/* 번호 목록 */
.seo-num-list {
    list-style: none;
    padding: 0;
    margin: 8px 0 12px;
}
.seo-num-item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-bottom: 10px;
    font-size: 13px;
    line-height: 1.7;
    color: #333;
}
.seo-num {
    background: #2ecc71;
    color: #fff;
    font-weight: 800;
    font-size: 11px;
    min-width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}
.seo-num-item strong { color: #c8102e; }
.seo-num-item a { color: #c8102e; text-decoration: none; }
.seo-card-center {
    text-align: center;
    font-size: 13px;
    color: #555;
    line-height: 1.9;
    padding: 14px 0 4px;
}
/* 볼 아이콘 (파워볼) */
.seo-ball-row { display: flex; align-items: center; gap: 6px; margin: 8px 0 4px; }
.seo-ball {
    width: 30px; height: 30px; border-radius: 50%;
    font-size: 10px; font-weight: 800; color: #fff;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
}
.seo-ball-red    { background: #e63946; }
.seo-ball-blue   { background: #1565c0; }
.seo-ball-yellow { background: #f9a800; color: #333; }
.seo-ball-green  { background: #2ecc71; }
.seo-ball-purple { background: #7b1fa2; }

/* =========================================================
   2026-08 최종 화면 다듬기 오버라이드
   기존 스킨 규칙과 충돌하지 않도록 파일 마지막에 유지한다.
   ========================================================= */
:root {
    --toto-layout-max: 1360px;
    --toto-ad-rail: 144px;
    --toto-side-rail: 248px;
    --toto-gap: 16px;
    --toto-page-bg: #f5f6f8;
    --toto-surface: #fff;
    --toto-border: #e3e6ea;
    --toto-text: #20242a;
    --toto-muted: #727982;
    --toto-brand: #e63946;
    --toto-radius: 10px;
    --toto-shadow: 0 3px 14px rgba(15, 23, 42, .07);
}

body {
    color: var(--toto-text);
    font-size: 14px;
    line-height: 1.65;
}

#wrap {
    background: var(--toto-page-bg);
}

/* 100vw가 스크롤바 너비까지 포함해 만들던 미세한 가로 넘침 제거 */
#top-bar,
#header,
#footer {
    width: 100%;
    left: auto;
    transform: none;
}

.top-bar-inner,
#header-inner,
#content-wrap,
#fw-page,
#footer-inner {
    width: 100%;
    max-width: var(--toto-layout-max);
}

/* 헤더와 메뉴의 좌우 기준선을 본문과 통일 */
#header-inner {
    min-height: 72px;
    height: auto;
    padding: 0 24px;
}

#logo {
    margin-left: 0;
    padding: 0 28px 0 0;
}

#gnb {
    gap: 2px;
}

#gnb > a,
.gnb-item > a {
    padding-inline: 12px;
    font-size: 14px;
}

/* 마우스뿐 아니라 키보드 탐색에서도 하위 메뉴를 연다. */
.gnb-item:focus-within .gnb-sub {
    display: block;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(230, 57, 70, .35);
    outline-offset: 2px;
}

/* 1440px 화면 기준: 광고 144px + 사이드바 248px + 유동 본문 */
#content-wrap {
    width: 100%;
    padding: 20px 24px 40px;
    gap: var(--toto-gap);
}

#sidebar-banners {
    width: auto;
    min-width: 0;
    flex: 0 0 var(--toto-ad-rail);
}

#left-sidebar {
    width: auto;
    min-width: 0;
    flex: 0 0 var(--toto-side-rail);
}

#main-content {
    flex: 1 1 auto;
    min-width: 0;
}

.login-widget,
.side-box,
.notice-ticker {
    margin-bottom: 12px;
    border-color: var(--toto-border);
    border-radius: var(--toto-radius);
    box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
    overflow: hidden;
}

/* 홈 전용: 게시판·회원 스킨에는 카드 규격이 번지지 않는다. */
#main-content.is-home .main-swiper {
    height: 240px;
    margin-bottom: 18px;
    border-radius: 12px;
    box-shadow: var(--toto-shadow);
}

#main-content.is-home .slide-inner {
    padding: 32px 38px;
}

#main-content.is-home .slide-title {
    font-size: 24px;
}

#main-content.is-home .quick-actions {
    gap: 12px;
    margin-bottom: 20px;
}

#main-content.is-home .quick-card {
    min-width: 0;
    padding: 16px 10px;
    border-color: var(--toto-border);
    border-radius: var(--toto-radius);
    box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
}

#main-content.is-home .quick-icon {
    width: 46px;
    height: 46px;
    margin-bottom: 8px;
    font-size: 18px;
}

#main-content.is-home .quick-label {
    font-size: 15px;
}

#main-content.is-home .quick-desc {
    font-size: 12px;
}

#main-content.is-home .section-header {
    margin: 24px 0 6px;
}

#main-content.is-home .section-title {
    margin: 0;
    font-size: 22px;
    line-height: 1.35;
}

#main-content.is-home .sponsor-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}

#main-content.is-home .sponsor-grid.sponsor-count-1 {
    grid-template-columns: minmax(0, 420px);
    justify-content: center;
}

#main-content.is-home .sponsor-item {
    aspect-ratio: 2.6 / 1;
    border-radius: var(--toto-radius);
    background: var(--toto-surface);
}

#main-content.is-home .sponsor-link {
    height: 100%;
}

#main-content.is-home .sponsor-img,
#main-content.is-home .sponsor-placeholder {
    height: 100%;
    border-radius: var(--toto-radius);
}

#main-content.is-home .board-tab-wrap,
#main-content.is-home .fraud-list-section {
    margin-bottom: 20px;
    border-color: var(--toto-border);
    border-radius: var(--toto-radius);
    box-shadow: var(--toto-shadow);
}

#main-content.is-home .btab-list li {
    padding: 7px 12px;
    font-size: 13px;
}

#main-content.is-home .fraud-list-section {
    padding: 14px 16px;
}

#main-content.is-home .seo-section {
    padding: 22px 0 10px;
}

#main-content.is-home .seo-section + .seo-section {
    padding-top: 24px;
    border-top-color: var(--toto-border);
}

#main-content.is-home .seo-section-title {
    margin: 0 0 12px;
    font-size: 22px;
    line-height: 1.4;
}

#main-content.is-home .seo-section-body {
    width: 100%;
    max-width: none;
    margin: 0;
    color: #3f464f;
    font-size: 14px;
    line-height: 1.85;
    overflow-wrap: anywhere;
}

#main-content.is-home .seo-card,
#main-content.is-home .seo-card-dark,
#main-content.is-home .seo-card-yellow,
#main-content.is-home .seo-card-darkblue {
    padding: 20px 22px;
    border-radius: var(--toto-radius);
}

#footer-inner {
    padding: 30px 24px;
}

/* 중간 폭에서는 광고 열부터 제거해 본문 가독성을 보호한다. */
@media screen and (min-width: 769px) and (max-width: 1180px) {
    #sidebar-banners {
        display: none;
    }

    #content-wrap {
        padding-inline: 20px;
    }

    #left-sidebar {
        flex-basis: 232px;
    }
}

/* 좁은 태블릿은 전체 GNB 대신 우측 메뉴 패널을 사용한다. */
@media screen and (min-width: 769px) and (max-width: 1100px) {
    #gnb {
        display: none !important;
    }

    #gnb-hamburger {
        margin-left: auto;
    }
}

/* 모바일: 390px을 기준으로 가로 넘침 없이 한 열로 재배치 */
@media screen and (max-width: 768px) {
    body {
        font-size: 14px;
    }

    .top-bar-inner {
        padding: 6px 12px;
    }

    .top-bar-left {
        display: none;
    }

    .top-bar-right {
        width: 100%;
        flex-wrap: nowrap;
        justify-content: flex-end;
        gap: 6px;
    }

    .top-search {
        flex: 1 1 140px;
        width: auto;
        min-width: 100px;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 26px;
        padding: 2px 6px 2px 10px;
        overflow: hidden;
    }

    .top-search input {
        width: 100%;
        min-width: 0;
    }

    .top-search button {
        width: 26px;
        padding: 0;
    }

    .top-btn-login,
    .top-btn-join {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    #header-inner {
        min-height: 60px;
        height: auto;
        padding: 0 14px;
    }

    #logo {
        margin-left: 0;
        padding-right: 0;
    }

    .logo-flower {
        font-size: 22px;
    }

    .logo-text {
        font-size: 21px;
    }

    .logo-sub {
        font-size: 9px;
    }

    #gnb-hamburger {
        margin-left: auto;
    }

    #content-wrap {
        display: block;
        padding: 12px 12px 28px;
    }

    #sidebar-banners,
    #left-sidebar {
        display: none !important;
    }

    #main-content {
        width: 100%;
        min-width: 0;
    }

    #main-content > * {
        max-width: 100%;
    }

    #main-content.is-home .main-swiper {
        height: 220px;
        margin-bottom: 12px;
    }

    #main-content.is-home .slide-inner {
        padding: 22px 24px;
    }

    #main-content.is-home .slide-en {
        font-size: 9px;
        letter-spacing: 2px;
    }

    #main-content.is-home .slide-title {
        font-size: 20px;
    }

    #main-content.is-home .slide-desc {
        margin-bottom: 12px;
        font-size: 11px;
    }

    #main-content.is-home .slide-btn {
        padding: 7px 14px;
        font-size: 11px;
    }

    #main-content.is-home .swiper-button-prev,
    #main-content.is-home .swiper-button-next {
        display: none;
    }

    #main-content.is-home .quick-actions {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
        margin-bottom: 16px;
    }

    #main-content.is-home .quick-card {
        padding: 12px 4px;
    }

    #main-content.is-home .quick-icon {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }

    #main-content.is-home .quick-label {
        font-size: 12px;
    }

    #main-content.is-home .quick-desc {
        display: none;
    }

    #main-content.is-home .section-header {
        margin-top: 20px;
        gap: 6px;
    }

    #main-content.is-home .section-title {
        font-size: 19px;
    }

    #main-content.is-home .section-trophy {
        font-size: 17px;
    }

    #main-content.is-home .sponsor-grid {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    #main-content.is-home .btab-col-wrap {
        grid-template-columns: 1fr;
    }

    #main-content.is-home .btab-list {
        border-right: 0;
    }

    #main-content.is-home .btab-list + .btab-list {
        border-top: 1px solid var(--toto-border);
    }

    #main-content.is-home .seo-section {
        padding-top: 18px;
    }

    #main-content.is-home .seo-section-title {
        font-size: 19px;
    }

    #main-content.is-home .seo-section-body {
        max-width: none;
        font-size: 13px;
        line-height: 1.8;
    }

    #main-content.is-home .seo-card,
    #main-content.is-home .seo-card-dark,
    #main-content.is-home .seo-card-yellow,
    #main-content.is-home .seo-card-darkblue {
        padding: 15px 14px;
    }

    #main-content.is-home .seo-sub-head {
        width: 100%;
        padding-inline: 12px;
        border-radius: 8px;
        text-align: center;
        font-size: 14px;
    }

    #fw-page {
        padding: 16px 12px 32px;
    }

    #megamenu-panel {
        width: min(340px, 90vw);
    }

    #footer-inner {
        flex-direction: column;
        align-items: flex-start;
        padding: 24px 16px;
    }

    .footer-tg {
        align-items: flex-start;
    }

    .footer-btns {
        width: 100%;
        flex-direction: row;
    }

    .footer-btns a {
        flex: 1;
        justify-content: center;
        padding-inline: 8px;
    }
}

/* 태블릿에서는 긴 보증 배너가 한 열로 과대해지지 않게 3열을 유지한다. */
@media screen and (min-width: 540px) and (max-width: 768px) {
    #main-content.is-home .sponsor-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (prefers-reduced-motion: reduce) {
    .ticker-move,
    .h-wbar-ticker-move {
        animation: none !important;
    }

    #mobile-menu,
    #megamenu-panel {
        transition: none !important;
    }
}
