@font-face {
    font-family: 'SEBANG_Gothic_Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2104@1.0/SEBANG_Gothic_Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'paybooc-Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/paybooc-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
body{font-family: 'GmarketSansMedium';}
.wrap{overflow-x: hidden;}
ul{margin: 0; padding: 0;}

.header-list{position: fixed; width: 100%; height: 80px; display: flex; justify-content: center; align-items: center; z-index: 999;}
.header-list.on{background-color: rgba(236, 234, 234, 0.6)}
.header-list .logo{width: 150px;}
.header-list .logo img{width: 100%;}

.side{position: fixed; bottom: 10%; right: 5%; cursor: pointer; font-size: 25px; text-align: center; color: #009fe8; display: none; z-index: 99;}
.side.on{display: block;}
.side ul li{width: 50px; height: 50px; border-radius: 5px; border: 1px solid #009fe8; line-height: 50px;}
.side ul li:not(:first-child){margin-top: 15px;}
.side ul li a{color: #009fe8;}
.side ul li:hover a{color: #fff;}
.top-btn{width: 50px; height: 50px; border-radius: 5px; border: 1px solid #009fe8; box-sizing: border-box; line-height: 50px; margin-top: 15px;}
/* .top-btn.on{display: block;} */
.top-btn:hover,
.side ul li:hover{background-color: #009fe8; color: #fff; transition: 0.2s;}

.footer{background-color: #eee; color: #000; padding: 2%; text-shadow: 1px 1px 1px #3a3a3a;}
.footer .footer-wrap{display: flex; justify-content: center; max-width: 1200px; margin: 0 auto; gap: 10%;}
.footer > ul li:nth-child(1){margin-bottom: 10px;}
.footer .footer-inner{display: flex; gap: 20px;}