@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

:root {
    --point-color:#01B9FF;
    --second-color:#767676;
    --sub-color:#515151;
    --layout-padding:0 54px;
}

::selection {
    background-color: #01B9FF;
    color: #fff;
}

* {
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html {
    scroll-behavior:smooth;
}

body {
    font-family:'Inter', 'Noto Sans KR', sans-serif;
    font-size:13px;
    font-weight:400;
    color:#131313;
    width:1920px;
    overflow-y:overlay;
}

body::-webkit-scrollbar {
    width:6px;
    background-color:transparent;
}

body::-webkit-scrollbar-thumb {
    height:10px;
    background-color:rgba(0,0,0,0.3);
}

body::-webkit-scrollbar-track {
    background-color:transparent;
}

input:not([type="checkbox"]), select, button, textarea {
    appearance:none;
    border-radius:0;
    border:0;
    background:transparent;
    font-family:'Inter', 'Noto Sans KR', sans-serif;
    font-weight:400;
    outline:0;
}

button {
    cursor:pointer;
}

textarea {
    resize:none;
}

a, a:hover, a:active, a:focus {
    color:#222;
    text-decoration:none;
}

li {
    list-style:none;
}

img {
    vertical-align:middle;
    border:0;
}

h1, h2, h3, h4, h5, h6 {
    font-size:100%;
    font-weight:400;
}

input[type='text']:disabled {background-color: #f8f8f8;}

.hidden {
    position:absolute;
    top:-9999px;
    left:-9999px;
    width:1px;
    height:1px;
    overflow:hidden;
}

.strong {
    font-weight:700;
}

.medium {
    font-weight:500;
}

#main header {
    padding:var(--layout-padding);
    box-shadow: 0px 4px 4px rgba(214, 214, 214, 0.25);
    height:60px;
    line-height:60px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

#main header a {
    font-size:15px;
}

#main header h1 {font-size: 15px;}

#main header a.burger {
    display:none;
}

#main {
    padding-left:220px;
}

aside .logout {
    display:none;
}

section {
    padding:0 54px;
    margin-top:46px;
}

section>h2 {
    color:var(--point-color);
    padding-bottom:18px;
    border-bottom:2px solid #353535;
    margin-bottom:26px;
    font-size:20px;
}

.title {
    padding-bottom:18px;
    border-bottom:2px solid #353535;
    margin-bottom:26px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.title h2 {
    color:var(--point-color);
    font-size:20px;
}

.table {
    margin-top:16px;
    text-align:center;
}

#main .row, .popup .row {
    display:grid;
    align-items:center;
    height:50px;
}

.table .th {
    width:100%;
}

.table .tablehead {
    background:#6F809A;
    border-top:1px solid #222;
}

.table .tablehead .th {
    color:#fff;
}

.m-table .tablehead {
    background:#6F809A;
    border-top:1px solid #222;
}

.table .row:not(.tablehead) {
    border-bottom:1px solid #dedede;
}

.table .row.tablehead {padding-right: 3px;}

#main .table .row:not(.tablehead):hover, #main .table .row:not(.tablehead):active, #main .table .row:not(.tablehead):focus {
    background:#EFF2F9;
}

.buttonset {
    height:28px;
    border-radius:14px;
    border:1px solid var(--sub-color);
    color:var(--sub-color);
    background:#fff;
    width:68px;
    font-size:12px;
}

.bottom {
    margin: 21px 0 110px;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
    height: 40px;
}
.bottom .table-menu {position: absolute; right: 0; top: 0;}
.pagination {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:20px;
    font-size: 14px;
    color: #666;
}

.pagination li.on a {
    font-weight:700;
    color:var(--point-color);

}

.bottom.wrap-bottom {flex-wrap: wrap; gap: 30px;}
.bottom.wrap-bottom .table-menu {position: static; width: 100%; justify-content: end;}


.btn_register {
    background:var(--point-color);
    color:#fff;
}

.btn_cancel {
    border:1px solid var(--sub-color);
    color:var(--sub-color);
}
