@charset "utf-8";

@font-face {
    font-family: "yg-jalnan";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff") format("woff");
}

:root {
    color-scheme: dark;
}

:root[data-theme="light"] {
    color-scheme: light;
    --site-header-bg: #fff;
    --site-header-panel: #fff;
    --site-page-bg: #fff;
    --site-surface: #fff;
    --site-border: #dfdfdf;
    --site-text: #333;
    --site-muted: #888;
}

body,
button,
input,
select,
textarea,
h1,
h2,
h3,
h4,
h5,
h6,
#hd.site-header,
#container {
    font-family: "yg-jalnan", "Malgun Gothic", dotum, sans-serif;
}

body {
    font-size: 12px;
    line-height: 22px;
    transition: background-color .2s ease, color .2s ease;
}

.site-theme-toggle {
    display:inline-flex;
    align-items:center;
    gap:6px;
    min-height:32px;
    padding:0 11px;
    border:1px solid #444;
    border-radius:16px;
    background:#1b1b1b;
    color:#cfcfcf;
    font-size:12px;
    font-weight:700;
    line-height:30px;
    transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}

.site-theme-toggle:hover,
.site-theme-toggle:focus {
    border-color:#777;
    background:#2a2a2a;
    color:#fff;
}

.site-theme-toggle--mobile {
    position:absolute;
    z-index:20;
    top:10px;
    right:58px;
    width:36px;
    height:36px;
    min-height:36px;
    justify-content:center;
    padding:0;
    border-radius:50%;
}

#ft #visit {
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:16px;
    width:100%;
    max-width:1200px;
    margin:0 auto;
    padding:12px 20px 20px;
    color:#999;
    font-size:11px;
}

#ft #visit h2 {
    position:static;
    margin:0;
    color:#aaa;
    font-size:11px;
    line-height:22px;
    text-align:center;
}

#ft #visit dl {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    margin:0;
    padding:0;
}

#ft #visit dl::after {
    display:none;
}

#ft #visit dt,
#ft #visit dd {
    float:none;
    width:auto;
    height:22px;
    margin:0;
    padding:0;
    color:#888;
    font-size:11px;
    font-weight:400;
    line-height:22px;
    text-align:left;
}

#ft #visit dt span {
    display:none;
}

#ft #visit dd {
    margin-left:-8px;
}

#ft #visit dd strong {
    padding:0;
    color:#bbb;
    font-weight:400;
    line-height:22px;
}

#ft #visit .btn_admin {
    position:static;
    height:24px;
    padding:0 6px;
    line-height:24px;
}

:root[data-theme="light"] body,
:root[data-theme="light"] #wrapper,
:root[data-theme="light"] #container_wr,
:root[data-theme="light"] #container {
    background:#fff;
    color:#333;
}

:root[data-theme="light"] a {
    color:#333;
}

:root[data-theme="light"] #hd.site-header,
:root[data-theme="light"] #tnb.site-header__utility,
:root[data-theme="light"] #hd_wrapper.site-header__main {
    background:#fff;
    color:#333;
}

:root[data-theme="light"] #tnb.site-header__utility {
    border-bottom-color:#ddd;
}

:root[data-theme="light"] .site-header__clock,
:root[data-theme="light"] .site-header__quick a {
    color:#555;
}

:root[data-theme="light"] .site-header__quick a:hover,
:root[data-theme="light"] .site-header__quick a:focus {
    color:#000;
}

:root[data-theme="light"] .site-theme-toggle {
    border-color:#d6d6d6;
    background:#f6f6f6;
    color:#444;
}

:root[data-theme="light"] .site-theme-toggle:hover,
:root[data-theme="light"] .site-theme-toggle:focus {
    border-color:#aaa;
    background:#eee;
    color:#111;
}

:root[data-theme="light"] #hd_sch.site-header__search #sch_stx {
    border-color:#aaa;
    background:#fff;
    color:#333;
}

:root[data-theme="light"] #hd_sch.site-header__search #sch_stx::placeholder {
    color:#999;
}

:root[data-theme="light"] #hd_sch.site-header__search #sch_submit {
    background:#999;
    color:#fff;
}

:root[data-theme="light"] .ranking_slide .lazy_keywords li a,
:root[data-theme="light"] .ranking_slide .lazy_keywords li button {
    color:#333 !important;
}

:root[data-theme="light"] .ranking_slide .lazy_keywords_num {
    color:#24a89f !important;
}

:root[data-theme="light"] .ranking_panel {
    border-color:#d7d7d7;
    background:#fff;
    box-shadow:0 8px 22px rgba(0,0,0,.16);
}

:root[data-theme="light"] .ranking_panel h3 {
    border-bottom:1px solid #ddd;
    background:#f1f1f1;
    color:#333;
}

:root[data-theme="light"] .ranking_panel li {
    border-bottom:1px solid #eee;
}

:root[data-theme="light"] .ranking_panel li:last-child {
    border-bottom:0;
}

:root[data-theme="light"] .ranking_panel a {
    color:#444 !important;
}

:root[data-theme="light"] .ranking_panel a:hover,
:root[data-theme="light"] .ranking_panel a:focus {
    color:#000 !important;
}

:root[data-theme="light"] .ranking_panel li:hover {
    background:#fafafa;
}

:root[data-theme="light"] .ranking_panel .ranking_panel_num {
    color:#888;
}

:root[data-theme="light"] #gnb.site-header__nav {
    background:#f7f7f7;
}

:root[data-theme="light"] #gnb .site-header__categories {
    border-color:#ddd;
    background:#fff;
}

:root[data-theme="light"] #gnb .site-header__categories li {
    border-right-color:#ddd;
}

:root[data-theme="light"] #gnb .site-header__categories a {
    color:#333;
}

:root[data-theme="light"] #gnb .site-header__categories a:hover,
:root[data-theme="light"] #gnb .site-header__categories a:focus {
    color:#777;
}

:root[data-theme="light"] #gnb .site-header__categories a.active {
    background:#888;
    color:#fff;
}

:root[data-theme="light"] #container_title {
    border-color:#ddd;
    background:#fafafa;
    color:#333;
}

:root[data-theme="light"] #container_title::before {
    background:#eee;
}

:root[data-theme="light"] #container a {
    color:#333;
}

:root[data-theme="light"] .lat_linkrank {
    border-color:#dfdfdf;
    background:#fff;
    color:#333;
}

:root[data-theme="light"] .lat_linkrank:hover {
    border-color:#bbb;
}

:root[data-theme="light"] .lat_linkrank .nara_title {
    border-bottom-color:#dfdfdf;
    background:#fafafa;
}

:root[data-theme="light"] .lat_linkrank_title a,
:root[data-theme="light"] .rank_item_link {
    color:#333;
}

:root[data-theme="light"] #container .rank_item_link.rank_1 {color:#d90025}
:root[data-theme="light"] #container .rank_item_link.rank_2 {color:#0077b6}
:root[data-theme="light"] #container .rank_item_link.rank_3 {color:#00a33c}
:root[data-theme="light"] #container .rank_item_link.rank_4,
:root[data-theme="light"] #container .rank_item_link.rank_5,
:root[data-theme="light"] #container .rank_item_link.rank_other {color:#111}

:root[data-theme="light"] #container .rank_item_link:hover,
:root[data-theme="light"] #container .rank_item_link:focus,
:root[data-theme="light"] #container .lat_linkrank_title a:hover,
:root[data-theme="light"] #container .lat_linkrank_title a:focus {
    color:#000;
}

:root[data-theme="light"] .rank_img_fallback {
    background:#eee;
    color:#666;
}

:root[data-theme="light"] .rank_empty,
:root[data-theme="light"] .lat_linkrank .lt_more {
    color:#888;
}

:root[data-theme="light"] #container .tbl_head01 thead th,
:root[data-theme="light"] #container .tbl_head02 thead th,
:root[data-theme="light"] .tbl_frm01 th {
    border-color:#ddd;
    background:#f5f5f5;
    color:#333;
}

:root[data-theme="light"] #container .tbl_head01 td,
:root[data-theme="light"] #container .tbl_head02 td,
:root[data-theme="light"] .tbl_wrap table,
:root[data-theme="light"] .list_01 li,
:root[data-theme="light"] .new_win,
:root[data-theme="light"] .new_win_con,
:root[data-theme="light"] #ctt {
    border-color:#e5e5e5;
    background:#fff;
    color:#555;
}

:root[data-theme="light"] #container .bo_notice td {
    border-color:#f0d8dd;
    background:#fff7f8 !important;
}

:root[data-theme="light"] #container .bo_notice td a {
    color:#8e3448;
}

:root[data-theme="light"] #container .empty_table,
:root[data-theme="light"] #container .empty_list {
    background:#fafafa !important;
    color:#888;
}

:root[data-theme="light"] #container input[type="text"],
:root[data-theme="light"] #container input[type="password"],
:root[data-theme="light"] #container input[type="email"],
:root[data-theme="light"] #container input[type="number"],
:root[data-theme="light"] #container textarea,
:root[data-theme="light"] #container select,
:root[data-theme="light"] .frm_input {
    border-color:#ccc;
    background:#fff;
    color:#222;
}

:root[data-theme="light"] #container .btn_b01,
:root[data-theme="light"] #container .btn_b02,
:root[data-theme="light"] #container .btn_admin,
:root[data-theme="light"] #container .btn_bo_user > li,
:root[data-theme="light"] #container .more_opt,
:root[data-theme="light"] #container .more_opt li,
:root[data-theme="light"] #container .more_opt li a,
:root[data-theme="light"] #container .more_opt li button,
:root[data-theme="light"] #container .bo_sch {
    border-color:#ddd;
    background:#fff;
    color:#444;
}

:root[data-theme="light"] #ft {
    border-top-color:#ddd;
    background:#f7f7f7;
    color:#666;
}

:root[data-theme="light"] #ft_copy {
    border-color:#ddd;
    color:#888;
}

:root[data-theme="light"] #ft #visit,
:root[data-theme="light"] #ft #visit h2,
:root[data-theme="light"] #ft #visit dt,
:root[data-theme="light"] #ft #visit dd {
    color:#777;
}

:root[data-theme="light"] #ft #visit dd strong {
    color:#444;
}

:root[data-theme="light"] #top_btn {
    border-color:#ccc;
    background:#fff;
    color:#555;
}

@media (max-width:768px) {
    :root[data-theme="light"] #hd.site-header,
    :root[data-theme="light"] #tnb.site-header__utility,
    :root[data-theme="light"] #hd_wrapper.site-header__main,
    :root[data-theme="light"] #logo.site-header__logo,
    :root[data-theme="light"] .hd_sch_wr.site-header__search-wrap {
        background:#fff;
    }

    :root[data-theme="light"] .site-header__mobile-nav,
    :root[data-theme="light"] .site-header__popular {
        border-color:#ddd;
        background:#f7f7f7;
    }

    :root[data-theme="light"] .site-header__featured-menu li {
        border-color:#ddd;
    }

    :root[data-theme="light"] .site-header__featured-menu a {
        color:#333;
    }

    :root[data-theme="light"] .site-header__menu-toggle {
        background:#eee;
        color:#333;
    }

    :root[data-theme="light"] .site-header__drawer {
        background:#fff;
        color:#333;
        box-shadow:8px 0 24px rgba(0,0,0,.18);
    }

    :root[data-theme="light"] .site-header__drawer-head {
        border-color:#0f7dff;
        background:var(--site-nav-bg);
        color:#fff;
    }

    :root[data-theme="light"] .site-header__drawer-menu {
        background:#fff;
    }

    :root[data-theme="light"] .site-header__drawer-menu li {
        border:0;
        background:transparent;
    }

    :root[data-theme="light"] .site-header__drawer-menu a {
        border-color:#e0e3e8;
        background:#fff;
        color:#222;
    }

    :root[data-theme="light"] .site-header__drawer-menu .site-header__notice-menu a {
        border-color:#5aa7ff;
        background:#dbeeff;
        color:#004f91;
    }

    :root[data-theme="light"] .site-header__drawer-links {
        background:#fff;
    }

    :root[data-theme="light"] .site-header__menu-close {
        color:#fff;
    }

    :root[data-theme="light"] #ft,
    :root[data-theme="light"] #top_btn {
        background:#f7f7f7;
        color:#666;
    }

    #ft #visit {
        flex-direction:column;
        gap:3px;
        padding:10px 12px 16px;
    }

    #ft #visit dl {
        flex-wrap:wrap;
        gap:4px 10px;
    }
}

/* 관리자에서 크게 등록한 팝업도 모바일 화면 안에 원본 비율로 축소합니다. */
@media (max-width:768px) {
    #hd_pop .popup_container {
        position:static;
        width:auto;
        transform:none;
    }

    #hd_pop .popup_wrapper {
        position:static;
        display:block;
        width:auto;
        height:auto;
        max-width:none;
        max-height:none;
        overflow:visible;
    }

    #hd_pop .hd_pops {
        position:fixed !important;
        top:50% !important;
        left:50% !important;
        width:max-content !important;
        max-width:none !important;
        transform:translate(-50%,-50%) scale(var(--popup-scale,1));
        transform-origin:center center;
    }

    #hd_pop .hd_pops_con {
        width:var(--popup-content-width) !important;
        height:var(--popup-content-height) !important;
        max-width:none !important;
        max-height:none !important;
        aspect-ratio:auto;
    }

    #hd_pop .hd_pops_con img,
    #hd_pop .hd_pops_con video {
        max-width:none;
    }
}