@charset "utf-8";

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


/* 초기화 */
html {width:100%;height:100%;overflow-y:scroll;background:#181818}
body {width:100%;height:100%;margin:0;padding:0;font-family: 'Noto Sans KR', 'Malgun Gothic', dotum, sans-serif;color:#fff;font-size:14px;font-weight:300;}
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-family: 'Noto Sans KR', 'Malgun Gothic', dotum, sans-serif;color:#fff;font-size:14px;font-weight:300;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}

ul, li, dl, dt, dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;color:#fff;font-size:14px;outline:none;}
input, button {margin:0;padding:0;font-family: 'Noto Sans KR', 'Malgun Gothic', dotum, sans-serif;color:#fff;font-size:14px;font-weight:300;}
input[type="submit"] {cursor:pointer}
button {cursor:pointer}

textarea, select {font-family: 'Noto Sans KR', 'Malgun Gothic', dotum, sans-serif;color:#fff;font-size:14px;font-weight:300;outline:none;}
select {margin:0}
p {margin:0;padding:0;word-break:break-all}
hr {display:none}
pre {overflow-x:scroll;font-size:14px}
a {color:#fff;text-decoration:none;cursor:pointer;}
a:hover {color:#fff}

*, :after, :before {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}

input[type=text],input[type=password], textarea {}
input[type=text]:focus,input[type=password]:focus, textarea:focus,select:focus {}

input, textarea, button {-webkit-appearance:none; -moz-appearance:none; appearance:none;}
input, textarea, button, select {-webkit-border-radius:0; -moz-border-radius:0; -o-border-radius:0; border-radius:0;}

.placeholdersjs {color:#999 !important}
input::placeholder {color:#999;}
input::-webkit-input-placeholder {color:#999;}
input::-ms-input-placeholder {color:#999;}
textarea::placeholder {color:#999;}
textarea::-webkit-input-placeholder {color:#999;}
textarea::-ms-input-placeholder {color:#999;}


#top_btn {display:block;position:fixed;right:40px;bottom:40px;width:55px;height:55px;color:#fff;font-size:20px;text-align:center;line-height:55px;background:#1348d5;border:none;border-radius:50%;z-index:9;opacity:0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
#top_btn.sticky_top_btn {opacity:1 !important;}


#container_wrap {position:relative;width:100%;margin:0 auto;}
#container_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#header_wrap {display:block;position:fixed;left:0;right:0;top:0;width:100%;padding:15px;background:#212121;z-indeX:9;}
#header_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#header_wrap #btn_side {display:block;float:left;width:36px;height:36px;text-align:left;line-height:36px;background:none;border:none;}
#header_wrap a.logo {display:block;float:left;line-height:36px;}
#header_wrap a.btn_login {display:block;float:right;width:76px;height:36px;text-align:center;line-height:36px;background:#363636;}

.hd_sch_wr {display:block;width:450px;margin:0 auto;}
.hd_sch_wr #hd_sch {display:block;position:relative;}
.hd_sch_wr #hd_sch #sch_stx {display:block;width:calc(100% - 36px);height:36px;text-indent:10px;background:#141414;border:none;}
.hd_sch_wr #hd_sch #sch_submit {display:block;position:absolute;right:0;top:0;width:36px;height:36px;text-align:center;line-height:36px;background:none;border:none;}
.hd_sch_wr #hd_sch #sch_submit i {color:#999;font-size:16px;}

.header_mobile {display:none;position:fixed;left:0;right:0;top:0;width:100%;padding:10px 20px;background:rgba(0,0,0,0.6);z-index:99;
-webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;
transition: all 0.6 s ease-out;
}
.header_mobile:after {display:block;visibility:hidden;clear:both;content:""}
.header_mobile a.logo {display:block;float:left;line-height:36px;}
.header_mobile a.btn_login {display:block;float:right;color:#fff;line-height:36px;}
.header_mobile a.btn_login img {width:24px;height:auto;border-radius:50%;}
.header_mobile.hide {top:-80px;}

.header_mobile #btn_side_mobile {display:block;float:left;width:36px;height:36px;text-align:left;line-height:36px;background:none;border:none;}


#side_wrap {position:fixed;left:0;top:0;width:220px;height:calc(100vh - 76px);margin:76px 0 0 0;background:#212121;z-index:9;}
#side_wrap nav {padding:20px;border-bottom:solid 1px #343434;}
#side_wrap nav ul {}
#side_wrap nav ul li {display:block;}

#side_wrap nav#gnb ul li a {display:block;line-height:50px;font-weight:500;}
#side_wrap nav#gnb ul li a .icon {display:inline-block;width:35px;color:#999;font-size:18px;}
#side_wrap nav#gnb ul li a .icon i {vertical-align:middle;}
#side_wrap nav#gnb ul li a .title {display:inline-block;}

#side_wrap nav#snb ul li a {display:block;margin:0 0 10px 0;line-height:20px;font-weight:500;}
#side_wrap nav#snb ul li a .icon {display:inline-block;width:35px;color:#999;font-size:18px;}
#side_wrap nav#snb ul li a .icon i {vertical-align:middle;}
#side_wrap nav#snb ul li ul {margin:0 0 0 35px;}
#side_wrap nav#snb ul li ul li a {margin:0;color:#999;line-height:28px;font-weight:400;}
#side_wrap nav#snb.active {background:#333;}

#side_wrap.on {width:60px;}
#side_wrap.on nav {padding:0px;border-bottom:none;}
#side_wrap.on nav#gnb ul li a {line-height:60px;}
#side_wrap.on nav#gnb ul li a:hover {background:#222;}
#side_wrap.on nav#gnb ul li a .icon {width:60px;text-align:center;}
#side_wrap.on nav#gnb ul li a .title {display:none;}
#side_wrap.on nav#snb {display:none;}


#body_wrap {position:relative;margin:76px 0 0 220px;}
#body_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#body_wrap.on {margin:76px 0 0 60px;}

#content_wrap {position:relative;width:100%;}
#content_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#footer_wrap {clear:both;display:block;position:relative;width:100%;}
#footer_wrap:after {display:block;visibility:hidden;clear:both;content:""}

#footer {display:block;position:relative;width:100%;max-width:1249px;margin:0 auto;padding:40px 0;}
#footer:after {display:block;visibility:hidden;clear:both;content:""}


.notice {margin:0 0 20px 0;}
.notice ul {}
.notice ul li {display:block;}
.notice ul li:nth-child(1) {background:#922020;}
.notice ul li:nth-child(2) {background:#525252;}
.notice ul li a {display:block;width:100%;max-width:1249px;margin:0 auto;line-height:42px;}
.notice ul li a i {font-size:10px;}

.banner_wrap {display:block;width:100%;max-width:1249px;margin:0 auto 40px auto;}
.banner_wrap ul {}
.banner_wrap ul:after {display:block;visibility:hidden;clear:both;content:""}
.banner_wrap ul li {display:block;float:left;width:33%;margin:0 0.5% 10px 0;}
.banner_wrap ul li:nth-child(3n) {margin:0 0 10px 0;}
.banner_wrap ul li:last-child {width:100%;margin:0;}
.banner_wrap ul li img {width:100%;height:auto;}


#content_wrap section {display:block;position:relative;width:100%;max-width:1249px;margin:0 auto 50px auto;}
#content_wrap section h2 {display:block;position:relative;margin:0 0 45px 0;font-size:20px;font-weight:500;line-height:30px;}
#content_wrap section h2 a {display:block;position:absolute;right:0;top:0;color:#999;font-size:16px;font-weight:400;}
#content_wrap section h2 a i {display:inline-block;font-size:8px;}

.line {display:block;width:100%;height:1px;margin:0 0 50px 0;background:#333;}

#footer .bnb {margin:0 0 40px 0;}
#footer .bnb a {display:inline-block;margin:0 20px 0 0;color:#999;font-size:16px;font-weight:400;}
#footer ul {margin:0 0 20px 0;}
#footer ul:after {display:block;visibility:hidden;clear:both;content:""}
#footer ul li {display:block;float:left;margin:0 12px 0 0;padding:0 12px 0 0;background:url(../img/var.gif) no-repeat right 50%;}
#footer ul li:last-child {margin:0;padding:0;background:none;}
#footer ul li a {display:block;color:#999;}
#footer p {margin:0 0 10px 0;color:#999;line-height:180%;word-break:keep-all;}
#footer p span {display:inline-block;}
#footer .copy {color:#999;}
#footer a.telegram {display:block;position:absolute;right:0;top:40px;width:36px;height:36px;color:#999;font-size:!6px;line-height:36px;text-align:center;background:#333;border-radius:50%;}
#footer a.telegram:hover {background:#1348d5;}

.bnb_mobile {display:none;margin:30px 20px 20px 20px;}
.bnb_mobile a {color:#999;}
.bnb_mobile .dot {display:inline-block;width:3px;height:3px;margin:0 8px;background:#999;border-radius:50%;vertical-align:middle;}

#float {display:none;position:fixed;left:0;right:0;bottom:0;width:100%;padding:10px 0;background:#181818;}
#float ul {}
#float ul:after {display:block;visibility:hidden;clear:both;content:""}
#float ul li {display:block;float:left;width:20%;}
#float ul li a {display:block;text-align:center;color:#999;}
#float ul li:first-child a {color:#fff;}
#float ul li a .icon {font-size:20px;}





@media screen and (max-width:960px) {
#top_btn {display:none;}

#header_wrap {display:none;}
#side_wrap {left:-220px;height:calc(100vh - 56px);margin:56px 0 0 0;}
#side_wrap.on_mobile {left:0;overflow-y: auto;}

.header_mobile {display:block;}

#body_wrap {margin:0;padding:0 0 80px 0;}
#body_wrap.on {margin:0;}

.notice,
.banner_wrap {display:none;}

#content_wrap section {margin:0 auto 40px auto;}
#content_wrap section h2 {margin:0 20px 20px 20px;font-size:14px;line-height:20px;}
#content_wrap section h2 a {font-size:12px;}
#content_wrap section h2 a i {font-size:6px;}

.line {display:none;}

#footer .bnb {margin:0;padding:0 20px 20px 20px;border-bottom:solid 1px #333;}
#footer .bnb a {color:#fff;font-size:14px;}
#footer ul {display:none;}
#footer p,
#footer .copy {margin:0 20px;}
#footer p span {display:block;}
#footer p .none {display:none;}
#footer a.telegram {display:none;}

.bnb_mobile {display:block;}

#float {display:block;}
}




@media screen and (max-width:768px) {
body {font-size:12px;}
h1, h2, h3, h4, h5, h6 {font-size:12px;}
label, input, button, select, img {font-size:12px;}
input, button {font-size:12px;}
textarea, select {font-size:12px;}
}




@media screen and (max-width:480px) {
}
