@charset "utf-8";

/* Base reset and shared utilities */
*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

ul,
ol,
li {
    margin: 0;
    padding: 0;
    list-style: none;
}

button {
    padding: 0;
    border: 0;
    color: inherit;
    background: none;
    font: inherit;
    cursor: pointer;
}

.flex {
    display: flex;
}

.grid {
    display: grid;
}

a:focus,
a:focus-visible,
button:focus,
button:focus-visible,
input:focus,
input:focus-visible,
select:focus,
select:focus-visible,
textarea:focus,
textarea:focus-visible {
    outline: none !important;
    box-shadow: none !important;
}

input:focus,
input:focus-visible,
select:focus,
select:focus-visible,
textarea:focus,
textarea:focus-visible {
    border-color: #ddd !important;
}

/* 기본 테이블 */
/* 테이블 */
.table.middle tbody td,
.table.middle tbody th,
.table.middle thead th {
    vertical-align: middle;
}
.table thead {
    border-top: 2px #000 solid;
    border-bottom: 0;
    background-color: #fff;
    padding-top: 12px;
    padding-bottom: 12px;
}
.table {
    border-bottom: 1px #ddd solid;
}
.table thead th {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
    border-bottom: 0;
    text-align: center;
    font-weight: 600;
    color: #000;
    font-size: 19px;
    border-bottom: 0 !important;
}
.table thead th.data,
.table thead th.num {
    text-align: center !important;
}
.table tbody th {
    vertical-align: middle;
    text-align: center;
    border-right: 1px #ddd solid;
    font-weight: 600;

}
.table tbody td {
    border-left: 1px #ddd solid;

}
.table tbody td,
.table tbody th {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
    /* font-size: 16px; */
}
.table tbody td a {
    /* font-size: 16px; */
    font-weight: 600;
}
.table tbody td.td_category,
.table tbody td.td_data,
.table tbody td.td_hit,
.table tbody td.td_name,
.table tbody td.td_num {
    text-align: center;

}
@media(min-width:992px) {
    .table tbody td.td_hit {
        width: 80px;
    }
    .table tbody td.td_data {
        width: 120px;
    }
    .table tbody td.td_name {
        width: 160px;
    }
}
.table tbody td span.badge.badge_02 {
    background-color: #f3ffdb;
    border: 1px #cff38b solid;
    color: #89b92e;
}
.table tbody td span.badge.badge_01 {
    background-color: #dbf3ff;
    border: 1px #c1e8fb solid;
    color: #7cc9ef;
}
.table tbody td span.badge {
    display: inline-block;
    min-width: 10px;
    padding: 5px 9px !important;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: #fff;
    border: 1px #000 solid;
    border-radius: 2em;
}
.table tbody td.td_num {
    font-family: 'GmarketSansBold';
    font-size: 13px;
}
.table tbody td.td_data {
    color: #999999;
    font-family: 'GmarketSansLight';
    font-size: 13px;
}
.table tbody td.td_hit {
    font-family: 'GmarketSansLight';
    font-size: 13px;
}
.table tbody td,
.table tbody th {
    text-align: center;

}
.table thead th {
    background-color: #f7f7f7;
    font-size: 20px !important;
}
/* 팝업 */
#hd_pop {
    z-index: 9999999999999999 !important;
    width: 100%;
}

.hd_pops {
    border: 0;
}

.hd_pops .hd_pops_con {
    height: auto !important;
}

.hd_pops_footer {
    padding: 0;
    background: #363942;
    color: #fff;
    text-align: center;
    position: relative;
    display: flex;
    padding-top: 12px;
    padding-bottom: 12px;
}

.hd_pops_footer:after {
    display: block;
    visibility: hidden;
    clear: both;
    content: "";
}

.hd_pops_footer button {
    padding: 0 !important;
    border: 0;
    color: #fff !important;
    width: 80%;
    text-align: center;
    padding: 11px;
    border: 0;
    color: #fff;
    font-size: 14px;

}

.hd_pops_footer .hd_pops_reject {
    background: #363942;
    text-align: center;
}

.hd_pops_footer button.hd_pops_close {
    width: 20%;
    background: #6cb6f3;
    position: absolute;
    top: 0;
    right: 0;
    color: #fff !important;
    height: 100%;
    display: block;

}

.hd_pops_footer button.hd_pops_close i {
    margin-left: 6px;
    font-size: 16px;
}

@media(max-width:786px) {
    #hd_pop {
        z-index: 9999999999999999 !important;
        position: relative;
        margin: 0 auto;
        width: 100% !important;
        height: 0;
    }

    .hd_pop {
        width: 100% !important;
    }

    .hd_pops {
        left: 0 !important;
        top: 0 !important;
        width: 100% !important;
        border: 0;
    }

    .hd_pops .hd_pops_con {
        width: 100% !important;
        height: auto !important;
    }

    .hd_pops .hd_pops_con img {
        width: 100%;
        height: auto;
    }

    .hd_pops_footer {
        padding: 0;
        background: #363942;
        color: #fff;
        text-align: center;
        position: relative;
        display: flex;
        padding-top: 16px;
        padding-bottom: 16px;
        font-weight: 600;
        font-family: 'NotoSans', 'Poppins', 'Ubuntu', dotum, sans-serif;
    }

}

/* 게시판 아이콘 */
.btn_admin.btn,
.btn_b01.btn {
    font-size: 16px;
}

/* 퀵메뉴 */
#top_btn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 55px;
    height: 55px;
    line-height: 46px;
    border: 2px solid #333;
    color: #333;
    text-align: center;
    font-size: 15px;
    z-index: 90;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 50%;
}

#top_btn:hover {
    border-color: #3059c7;
    background: #3059c7;
    color: #fff;
}
/* 탭 */
#tab01 {
    display: flex;
    gap: 7px;
}
#tab01.num5 li {
    width: 20%;
}
#tab01.num4 li {
    width: 25%;
}
#tab01 li a {
    display: block;
    background: #f2f3f4;
    color: #3a3a3a;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    border-radius: 0.3em;
}
#tab01 li.active a {
    background: #0367c5;
    color: #fff;
    font-weight: 600;
}
#tab01 li a:hover {
    text-decoration: none;
}
/* 퀵메뉴 마감 */
/* sellect */
/* sellect end */
/* animation */
@media(min-width:992px) {
    .wiz_animation,
    .wiz_swiper {
        opacity: 0 !important;
    }

    .wiz_active {
        transform: translateX(0) !important;
        opacity: 1 !important;
    }
}
@media(max-width:991px) {
    .wiz_animation,
    .wiz_swiper {
        transform: translateX(0) !important;
        transform: translateY(0) !important;
        opacity: 1 !important;
    }
    /* 탭 */
    #tab01 {
        display: flex;
        flex-wrap: nowrap;
        gap: 7px;
        overflow-x: auto;
        /* 가로 스크롤 가능하게 */
        white-space: nowrap;
        /* 줄바꿈 방지 */
        -webkit-overflow-scrolling: touch;
        /* iOS에서 부드러운 스크롤 */
        scrollbar-width: none;
        /* Firefox에서 스크롤바 숨기기 */
    }

    #tab01::-webkit-scrollbar {
        display: none;
        /* 스크롤바 숨기기 */
    }
    #tab01.num5 li {
        width: auto;
    }
    #tab01.num4 li {
        width: auto;
    }
    #tab01 li a {
        display: block;
        background: #f2f3f4;
        color: #3a3a3a;
        padding: 13px 16px;
        text-align: center;
        font-weight: 600;
        font-size: 13px;
        border-radius: 0.3em;
    }
    #tab01 li.active a {
        background: #0367c5;
        color: #fff;
        font-weight: 600;
    }
    #tab01 li a:hover {
        text-decoration: none;
    }
    .table thead {
        border-top: 2px #000 solid;
        border-bottom: 0;
        background-color: #fff;
        padding-top: 12px;
        padding-bottom: 12px;
    }
    .table {
        border-bottom: 1px #ddd solid;
    }
    .table thead th {
        padding-top: 16px !important;
        padding-bottom: 16px !important;
        border-bottom: 0;
        text-align: center;
        font-weight: 600;
        color: #000;
        font-size: 14px !important; 
        border-bottom: 0 !important;
    }
    .table thead th.data,
    .table thead th.num {
        text-align: center !important;
    }
    .table tbody th {
        vertical-align: middle;
        text-align: center;
        border-right: 1px #ddd solid;
        font-weight: 600;

    }
    .table tbody td {
        border-left: 1px #ddd solid;

    }
    .table tbody td,
    .table tbody th {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
        font-size:12px !important;
        /* font-size: 16px; */
    }
   

}
/* animation end */
