@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Muli:400,600');
@import url('reset.css');

/* skipToContent */
#skipToContent a {position:absolute; top:0; left:0; z-index:9999; width:100%; height:1px; margin-top:-1px; display:block; background-color:#3875c1; font-size:14px; font-weight:bold; color:#fff; line-height:1; text-align:center; overflow:hidden}
#skipToContent a:focus, #skipToContent a:active {margin-top:0; height:auto; padding:10px 0px}

/* common */
#wrap{width:82%;max-width:1562px;margin:0 auto}
.img-responsive {display:block; max-width:100%; height:auto}
.width100{width:100%;padding:0; margin:0}
.mobile{display:none}
.mobile2{display:none}
.auto {margin:0 auto}

.logo {width:150px; margin:5% auto; z-index:999;}

/*년도 tab*/
.tab02{width:100%;margin:3% auto;overflow:hidden}
.tab02 li {display:block; float:left;width:49.5%;border:1px solid #4b4b4b;font-size:16px;padding:1% 0; color:#4b4b4b;text-align:center;}
.tab02 a {color:#4b4b4b}
.tab02 li:hover{background:#4b4b4b;color:#fff}
.tab02 li.on {background:#4b4b4b;color:#fff}
.tab03{width:100%;margin:3% auto;overflow:hidden}
.tab03 li {display:block; float:left;width:33.2%;border:1px solid #4b4b4b;font-size:16px;padding:1% 0; color:#4b4b4b;text-align:center;}
.tab03 a {color:#4b4b4b}
.tab03 li:hover{background:#4b4b4b;color:#fff}
.tab03 li.on {background:#4b4b4b;color:#fff}
.tab04{width:100%;margin:3% auto;overflow:hidden}
.tab04 li {display:block; float:left;width:24.8%;border:1px solid #4b4b4b;font-size:16px;padding:1% 0; color:#4b4b4b;text-align:center;}
.tab04 a {color:#4b4b4b}
.tab04 li:hover{background:#4b4b4b;color:#fff}
.tab04 li.on {background:#4b4b4b;color:#fff}
.tab05{width:100%;margin:3% auto;overflow:hidden}
.tab05 li {display:block; float:left;width:19.8%;border:1px solid #4b4b4b;font-size:16px;padding:1% 0; color:#4b4b4b;text-align:center;}
.tab05 a {color:#4b4b4b}
.tab05 li:hover{background:#4b4b4b;color:#fff}
.tab05 li.on {background:#4b4b4b;color:#fff}

/*contents*/
.back_con{width:90%;margin:5% auto;overflow:hidden}
.back_con li {display:block; float:left;width:25%;margin:4% 4%;font-size:14px; color:#212121;text-align:center;text-transform:uppercase}
.back_con li a{color:#212121;}
.back_con li img{margin-bottom:10px;border:1px solid #e7e7e7}

/* footer */
.footer_top{overflow:hidden; width:100%; background:#f4f4f4; padding:3% 0;}
.footer_top_box{width:82%;max-width:1562px;margin:0 auto}
.footer_btn{width:80%;margin:0}
.footer_btn li{list-style:none;display:block; float:left; text-align:center;width:20%;border:1px solid #0b0306; margin-right:10px;padding:13px 1%;font-family: 'Noto Sans', sans-serif; font-size:12px;color:#313131}
.footer_btn li:hover{background:#0b0306; color:#fff}
.footer_btn a{color:#313131}

.follow{float:right; width:170px;}
.follow ul {overflow:hidden;}
.follow ul li {list-style:none;display:block; float:left; margin-left:10px;}
.tbs{float:right;margin:8px 3% 0 0}

footer {clear:both;width:100%;padding:60px 0; text-align:center}
footer .copy {clear:both;font-family:'Verdana', 'Geneva', sans-serif; font-size:11px; color:#686868; margin-top:15px}
footer .flogo{overflow:hidden; width:18%;margin:0 auto;}
footer .flogo a{display:block; float:left;margin: 0 7%; padding:0}

@media screen and (max-width:1850px) {
	footer .flogo{width:20%;}
}
@media screen and (max-width:1680px) {
.footer_btn{width:85%;}
.footer_btn li{width:18%;margin-right:10px;padding:10px 5px; font-size:11px;}
footer .flogo{width:20%;}
footer .flogo a{margin: 0 5%;}
}
@media screen and (max-width:1480px) {
	footer .flogo{width:25%;}
}
/*노트북*/
@media screen and (max-width:1366px) {
.footer_btn{width:85%}
.footer_btn li{font-size:11px}
}
@media screen and (max-width:1280px) {
.footer_btn li{font-size:10px;width:17%;padding:8px 2px;}
.follow{width:140px}
.follow ul li{margin-left:3px}
.follow ul li img{width:80%;}
.tbs{margin:5px 1% 0 0}
.tbs img{width:80%}
.tab04 li{width:24%;}
}
@media screen and (max-width:1180px) {
footer .flogo{width:30%;}
}
/*아이패드 미니-가로*/
@media screen and (max-width:1024px) {
.back_con{width:100%}
footer .flogo{width:35%;}
}

@media screen and (max-width:960px) {
.footer_top_box{width:90%}
.footer_btn{width:100%;margin-bottom:30px}
.footer_btn li{width:23%;margin:0 0.5%}
.follow{clear:both;width:100%;float:left}
.follow ul{width:140px;margin:30px auto;}
.tbs{width:88px;margin:20px auto;float:none}
}
@media screen and (max-width:1024px) {
footer .flogo{width:40%;}
}
/*아이패드 미니-세로, 아이폰 XS-가로*/
@media screen and (max-width:768px) {
.logo{width:80px;margin:5% auto;padding-bottom:20px}
.back_con li{width:40%}
.tab02 li{width:49%;}
.footer_top_box{width:90%}
.footer_btn li{width:22%;margin:0 0.5%;padding:5px 2px;}
footer .flogo{width:45%;}
}
@media screen and (max-width:768px) {
footer .flogo{width:50%;}
}
/*아이폰XS*/
@media screen and (max-width:570px) {
.back_con li{width:95%;margin:5% 4%;}
.tab02 li{width:49%;font-size:14px}
.footer_btn li{font-size:10px;width:47%; margin:2px 2px}
footer{padding:30px 0}
footer .flogo{width:70%;}
footer .flogo a{margin:3% 5%;text-align:center}
}
@media screen and (max-width:425px) {
.footer_top_box{width:60%; margin:0 auto}
.footer_btn li{font-size:10px;width:100%; margin:1% auto;padding:10px 0}
footer .flogo{width:80%;}
}

@media screen and (max-width:360px) {
.footer_top_box{width:70%; margin:0 auto}
.footer_btn li{font-size:10px;width:100%; margin:1% auto;padding:10px 0}
footer .flogo{width:40%;}
footer .flogo a{margin:3% 2%;}
}

@media screen and (max-width:320px) {
}

