@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nanum+Myeongjo:wght@400;700&display=swap');

* {-webkit-text-size-adjust:none;}
html {height:100%;}
body {margin:0;padding:0;color:#333;font-family:Malgun Gothic, AppleGothic, Sans-serif;-webkit-tap-highlight-color:rgba(0,0,0,0);} 
dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, img, input, textarea, blockquote, th, td, p, header, hgroup, nav, section, article, aside {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;}
dl, ul, ol {list-style:none;}
img {border:0;}
q:before, q:after {content:'';}
input,textarea, button{outline-style:none;}
a {color:#404040;text-decoration:none;border:none;}
a:link, a:active {}
table {border-collapse:collapse; border-spacing:0px;width : 100%;}
img, select, input, textarea, select, button {vertical-align:top;}
td {vertical-align:middle;}
label {cursor:pointer;}

.fr {float:right;}
.fl {float:left;}
.pr {position:relative;}
.tal {text-align:left;}
.tar {text-align:right;}
.tac {text-align:center;}
.dpn {display:none;}
.cb {clear:both;width:0px;height:0px;font-size:0px;line-height:0px;}

#wrap{min-width:320px;max-width:800px;margin:0 auto;} 
#cover{position:fixed;top:0;left:0;width:100%;height:100%;display:none;background:#000;z-index:20000;opacity:0;} 
.container {width:100%;overflow:hidden;} 

#header {border-bottom:1px solid #d2d2d2;overflow:hidden;}
#top_head {width:100%;height:64px;display:table;position:relative;}
#top_head h1{width:100%;height:100%;display:table-cell;vertical-align:middle;text-align:center;} 
#top_head h1 img {width:200px;position:relative;}
#top_head h1 input {font-size:18px;padding:5px 5px;border:1px solid #dadada;border-radius:5px;width:75%;} 
#top_head .menu_btn{width:44px;position:absolute;top:20px;right:-8px;}
#top_head .menu_btn img{width:19px}

.sub_menu_box  {width:100%;border-top:1px solid #ececec;background:#f9f9f9;}
.sub_menu_box ul {overflow:hidden;}
.sub_menu_box ul li {float:left;text-align:center;background:url(../images/sub_menu_gap.png) right no-repeat;}
.sub_menu_box ul li:last-child {background:none;}
.sub_menu_box ul li.wfix50 {width:50%;}
.sub_menu_box ul li.wfix33 {width:33.33%;}
.sub_menu_box ul li p {padding:5px 0;font-size:14px;font-weight:300;}
.sub_menu_box ul li a.on {color:#ed1b23}

footer {width:100%;clear:both;height:108px;background:#6f2d1b;}
footer ul {max-width:800px;margin:0 auto;overflow:hidden;padding-top:30px}
footer ul li {text-align:center;line-height:normal;}
footer ul li p {font-size:14px;border-radius:3px;padding:5px 9px;display:inline-block;color:#fff;margin:0 2px;background:#371006;}
footer ul li p a {color:#fff;}
footer ul li i {font-size:12px;color:#c6cdcf;}

/* 사이드메뉴 */
#menu{display:none;position:absolute;top:0;right:-285px;width:285px;height:100%;background:#fff;z-index:20010;overflow-x:hidden;overflow-y:scroll;-webkit-overflow-scrolling:touch;}
#menu .logo_top{width:100%;height:52px;border-bottom:1px solid #404040;margin:0;}
#menu .logo{width:125px;position:absolute;top:17px;left:14px;}
#menu .close_btn {width:18px;position:absolute;top:19px;right:14px;cursor:pointer;}
#menu dl {width:100%}
#menu div.sub1 a {display:block;width:100%;padding:15px 0 15px 15px;font-size:15px;color:#222;border-top:1px solid #e9e9e9;overflow:hidden;}
#menu div.sub2 {width:100%;height:48px;position:relative;border-top:1px solid #e9e9e9;}
#menu div.sub2 > a {display:block;font-size:15px;color:#222;padding:15px 0 15px 15px;width : 200px;}
#menu div.sub2 .btn_cli{width:46px;height:46px;position:absolute;right:0;}
#menu div.sub2 > p {width:46px;height:46px;text-align:center;position:absolute;right:0;}
#menu div.sub2 > p > img {width:12px;margin:-29px;transition:0.3s;}
#menu div.submenu{border-top:1px solid #e9e9e9;display:none;}
#menu div.submenu a {display:block;width:100%;padding:5px 0 15px 30px;font-size:15px;color:#6d6d6d;overflow:hidden;}
#menu div.submenu a:first-child {padding:18px 0 15px 30px;}
#menu .side_footer {background:#595959;overflow:hidden;}
#menu .side_footer a {color:#fff;font-size:14px;padding:20px 0;width:49.5%;display:block;float:left;text-align:center;background:url(../images/sub_menu_gap.png) right no-repeat;}
#menu .side_footer a:last-child {background:none;}
#menu .side_copy {padding:15px 0;text-align:center;font-size:14px;color:#808080;}

.sub_nav_box {width:100%;}
.sub_nav_box dl dt {background:#f1f1f1;position:relative;}
.sub_nav_box dl dt h4 {padding:10px;font-size:18px;font-family:'Noto Sans KR';color:#e9572f;font-weight:500;line-height:24px;z-index:1001;}
.sub_nav_box dl dt h4 a {color:#e9572f;}
.sub_nav_box dl dt span {position:absolute;top:10px;right:15px;z-index:1000;}
.sub_nav_box dl dt span img {width:15px;position:relative;top:6px;}
.sub_nav_box dl dt.sub_menu {cursor:pointer;}
/*
.sub_nav_box dl dt.sub_menu:hover ul {width:100%;display:block;z-index:10000;}
.sub_nav_box dl dt.sub_menu ul{width:100%;display:block;z-index:10000;}

.view_box img{width : 100% !important;}
*/
.sub_nav_box dl dt ul {display:none;}
.sub_nav_box dl dt ul li {border-top:1px solid #ddd;}
.sub_nav_box dl dt ul li p {font-size:15px;padding:12px;border-bottom:1px solid #ddd;text-align:left;}
.sub_nav_box dl dt ul li p:hover {color:#fff;background:#de6f51;}
.sub_nav_box dl dt ul li p.on {color:#fff;background:#de6f51;}

.sub_content_box {padding:15px ;overflow:hidden;}
.sub_content_box .notice_view_box .webzine_img{width:100%;}
#top_button {position:fixed;bottom:5px;right:6px;width:11.5%;max-width:60px;display:none;z-index:2000} 
#top_button img {width:100%} 

/* 페이징 */
.sub_line {width:100%;border-top:1px solid #ddd;}
.sub_paging {text-align:center;margin:20px 0 15px 0;}
.sub_paging .pgbtn {border:1px solid #e4e4e4;padding:3px 12px 6px 12px;margin:1px;position:relative;top:-1px;}
.sub_paging .pgbtn img {position:relative;top:8px;}
.sub_paging .sub_pg_num {padding:4px 12px 5px 12px;border:1px solid #e4e4e4;margin:1px;font-size:16px;}
.sub_paging > span {color:#5a626e;}
.sub_paging a {color:#bcbcbc;}
.sub_paging .list_btn {width:60px;margin:0 auto;text-align:center;border:1px solid #ddd;padding:8px 20px;color:#000;font-size:15px;}
.sub_paging .down_btn {width:220px;white-space:nowrap;margin:0 auto;text-align:center;border:1px solid #ddd;padding:8px 20px;color:#c40000;}
.sub_paging .down_btn span {font-size:12px;position:relative;top:-2px;}


@media only screen and (min-width:320px) {
   #header #nav ul li span {font-size:15px;letter-spacing:-0.5px;}
}

@media only screen and (min-width:480px) {
   #header #nav ul li span {font-size:18px;letter-spacing:-0.5px;}
   .sub_menu_box ul li p {font-size:16px;}
   #top_head h1 input {width:82%;}
}

@media only screen and (min-width:640px) {
	   #wrap {border-left:1px solid #f0f0f0;border-right:1px solid #f0f0f0;}
	   #top_head {height:84px;}
	   #top_head h1 img {width:260px;position:relative;}
	   #top_head .menu_btn{width:44px;position:absolute;top:28px;right:13px;cursor:pointer;}
	   #top_head .menu_btn img{width:23px;}
	   #header #nav ul li span {font-size:20px;letter-spacing:-0.5px;}  
	   .sub_menu_box ul li p {font-size:18px;}
	   #top_head h1 input {width:85%;}
}