@charset "utf-8";

/* =========================================
   MENU COMMON
========================================= */
.at-menu,
.at-menu * {
    box-sizing:border-box;
}

.at-menu ul,
.at-menu li {
    margin:0;
    padding:0;
    list-style:none;
}

.at-menu a {
    text-decoration:none;
}

/* 배너 영역을 메뉴 너비와 똑같이 꽉 채우기 위해 max-width 제한 해제 */
.at-container {
    width:100%;
    /* max-width:1200px; */
    margin:0 auto;
    position:relative;
}

.pc-menu .menu-scroll {
    width:100%;
}

/* =========================================
   PC MENU
========================================= */
.pc-menu {
    background:#00bfff !important;
    border:0 !important;
    box-shadow:0 5px 5px -2px rgba(25,25,25,0.15);
    position:sticky;
    top:0;
    z-index:100;
}

.pc-menu .nav-visible {
    position:relative;
}

.pc-menu .menu-ul {
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
    margin:0;
    padding:0;
}

.pc-menu .menu-li {
    position:relative;
    flex:1 1 auto;
}

.pc-menu .menu-a {
    color:#fff !important;
    font-size:18px;
    font-weight:900;
}

.pc-menu .menu-a.nav-height {
    height:48px;
    line-height:48px;
    padding:0 8px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    white-space:nowrap;
}

.pc-menu .menu-li.on > .menu-a,
.pc-menu .menu-li:hover > .menu-a {
    color:#fff !important;
    background:rgba(255,255,255,0.18);
}

.pc-menu .menu-a .ca-icon {
    width:20px;
    height:20px;
    object-fit:contain;
    display:inline-block;
    margin-right:6px;
    vertical-align:middle;
}

.pc-menu .menu-a.sub-icon {
    position:relative;
    padding-right:28px;
}

.pc-menu .menu-a.sub-icon::after {
    content:"\e93f";
    font-family:"xeicon";
    position:absolute;
    right:10px;
    top:50%;
    transform:translateY(-50%);
    font-size:16px;
    color:#fff;
}

/* PC 서브메뉴 */
.pc-menu .sub-1div {
    display:none;
    position:absolute;
    left:0;
    top:100%;
    min-width:180px;
    background:#fff;
    border:1px solid #00bfff;
    border-top:0;
    z-index:120;
    box-shadow:0 6px 12px rgba(0,0,0,.12);
}

.pc-menu .menu-li:hover .sub-1div {
    display:block;
}

.pc-menu .sub-1dul {
    padding:8px 0;
}

.pc-menu .sub-1da {
    display:block;
    padding:9px 14px;
    font-size:14px;
    color:#333;
    line-height:1.4;
    white-space:nowrap;
}

.pc-menu .sub-1dli.on .sub-1da,
.pc-menu .sub-1dli:hover .sub-1da {
    color:#00bfff;
    background:#00bfff;
    font-weight:700;
}

/* 1280 이하 메뉴 가로 스크롤 */
@media all and (max-width:1280px) {
    .pc-menu .nav-visible {
        overflow-x:auto;
        overflow-y:visible;
        -webkit-overflow-scrolling:touch;
    }

    .pc-menu .at-container {
        max-width:none;
        width:max-content;
        min-width:100%;
    }

    .pc-menu .menu-ul {
        width:max-content;
        min-width:100%;
        flex-wrap:nowrap;
    }

    .pc-menu .menu-li {
        flex:0 0 auto;
    }

    .pc-menu .menu-a.nav-height {
        padding:0 14px;
    }

    .pc-menu .nav-visible::-webkit-scrollbar {
        height:4px;
    }

    .pc-menu .nav-visible::-webkit-scrollbar-thumb {
        background:#ccc;
        border-radius:10px;
    }
}

@media all and (max-width:991px) {
    .pc-menu .menu-a {
        font-size:15px;
    }

    .pc-menu .menu-a.nav-height {
        height:46px;
        line-height:46px;
        padding:0 12px;
    }

    .pc-menu .sub-1div {
        display:none !important;
    }
}

/* =========================================
   SIDEBAR MASK
========================================= */
#nt_sidebar_mask {
    display:none;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.75);
    z-index:99998;
}

/* =========================================
   SIDEBAR : PC 우측 / 모바일 좌측
========================================= */
#nt_sidebar {
    position:fixed;
    top:0;
    width:280px;
    height:100vh;
    height:100dvh;
    background:#fff;
    z-index:99999;
    box-shadow:0 0 5px 5px rgba(50,60,70,0.15);
    overflow:hidden;
    transition:right .25s ease, left .25s ease;
}

/* PC, 태블릿: 우측에서 */
@media all and (min-width:769px) {
    #nt_sidebar {
        right:-300px;
        left:auto;
    }

    #nt_sidebar.open {
        right:0;
        left:auto;
    }
}

/* 모바일: 좌측에서 */
@media all and (max-width:768px) {
    #nt_sidebar {
        left:-300px;
        right:auto;
    }

    #nt_sidebar.open {
        left:0;
        right:auto;
    }
}

#nt_sidebar .sidebar-content {
    height:calc(100vh - 52px);
    height:calc(100dvh - 52px);
    overflow-y:auto;
    overflow-x:hidden;
    -webkit-overflow-scrolling:touch;
    padding-bottom:90px;
}

/* =========================================
   SIDEBAR HEADER
========================================= */
#nt_sidebar_header {
    background:#00bfff;
    padding:0 15px;
    margin:0;
}

#nt_sidebar_header h3 {
    margin:0;
    padding:10px 0;
    font-size:16px;
    font-weight:900;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

#nt_sidebar_header .sidebar-logo {
    color:#fff;
    display:flex;
    align-items:center;
    gap:6px;
    max-width:220px;
    line-height:1.3;
}

#nt_sidebar_header .sidebar-logo img {
    width:22px;
    height:22px;
    object-fit:contain;
}

#nt_sidebar_header .sidebar-close {
    color:#fff;
    font-size:18px;
}

/* =========================================
   SIDEBAR MEMBER / QUICK
========================================= */
.sidebar-member,
.sidebar-quick {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    background:#fff;
    border-bottom:1px solid #dee2e6;
}

.sidebar-member li,
.sidebar-quick li {
    border-right:1px solid #dee2e6;
}

.sidebar-member li:last-child,
.sidebar-quick li:last-child {
    border-right:0;
}

.sidebar-member a,
.sidebar-quick a {
    display:block;
    padding:12px 5px;
    text-align:center;
    font-size:14px;
    font-weight:900;
    color:#333;
    background:#fff;
}

.sidebar-member a:hover,
.sidebar-quick a:hover {
    color:#00bfff;
}

/* =========================================
   SIDEBAR MENU GRID
========================================= */
#nt_sidebar ul.me-ul.border-top.f-de {
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:10px;
    padding:10px;
    background:#fff;
    border-top:1px solid #eee;
}

#nt_sidebar ul.me-ul.border-top.f-de > .me-li {
    position:relative;
    background:#fff;
    border:1px solid #eee;
    border-radius:6px;
    overflow:hidden;
}

#nt_sidebar ul.me-ul.border-top.f-de > .me-li > .me-a {
    min-height:48px;
    padding:8px 6px;
    display:flex;
    align-items:center;
    gap:7px;
    border-bottom:0;
    color:#222;
    font-size:15px;
    font-weight:700;
    text-align:left;
}

#nt_sidebar ul.me-ul.border-top.f-de > .me-li > .me-a img,
#nt_sidebar ul.me-ul.border-top.f-de > .me-li > .me-a .ca-icon {
    width:20px;
    height:20px;
    object-fit:contain;
    display:inline-block;
    vertical-align:middle;
}

#nt_sidebar ul.me-ul.border-top.f-de > .me-li.active > .me-a,
#nt_sidebar ul.me-ul.border-top.f-de > .me-li:hover > .me-a {
    color:#00bfff;
    background:#00bfff;
}

/* 하위메뉴 */
#nt_sidebar .me-ul1.off {
    display:none;
}

#nt_sidebar .me-ul1 {
    background:#fafafa;
    border-top:1px solid #eee;
}

#nt_sidebar .me-li1 .me-a1 {
    display:block;
    padding:8px 10px;
    font-size:13px;
    color:#333;
    border-bottom:1px solid #eee;
}

#nt_sidebar .me-li1.active .me-a1,
#nt_sidebar .me-li1 .me-a1:hover {
    color:#00bfff;
    font-weight:700;
}

#nt_sidebar .tree-toggle {
    position:absolute;
    right:0;
    top:0;
    width:30px;
    height:30px;
    line-height:30px;
    text-align:center;
    cursor:pointer;
    color:#aaa;
    z-index:2;
}

#nt_sidebar .tree-toggle.on i {
    transform:rotate(180deg);
}

#nt_sidebar .tree-toggle i {
    transition:transform .2s ease;
}

/* =========================================
   SIDEBAR BOTTOM
========================================= */
.sidebar-bottom-link {
    background:#fff;
    padding:12px;
    border-top:1px solid #eee;
}

.sidebar-bottom-link li {
    margin-bottom:8px;
}

.sidebar-bottom-link li:last-child {
    margin-bottom:0;
}

.sidebar-bottom-link a {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:5px;
    min-height:34px;
    font-size:13px;
    font-weight:800;
    border-radius:4px;
}

.sidebar-bottom-link .btn_a {
    background:#0047a0;
    color:#fff;
}

.sidebar-bottom-link .btn_b {
    background:#ff0000;
    color:#fff;
}

/* 사이드바 열렸을 때 스크롤 방지 */
html.sidebar-open,
body.sidebar-open {
    overflow:hidden;
    height:100%;
}