@charset "utf-8";
/* CSS Document */
@import url("main.css");
@import url("board.css");
@import url("member.css");

/* skip */
#skipnav {overflow:hidden; position:absolute; width:100%; z-index:1000;}
#skipnav a {display:block; overflow:hidden; height:1px; width:1px; margin:0 -1px -1px 0; font-size:0; line-height:0; text-align:center;}
#skipnav a:focus, #skipnav a:hover, #skipnav a:active {width:auto; height:20px; margin:0; padding:8px 0 5px; background:#20262c; font-size:12px; font-weight:700; line-height:1; color:#fff;}

.skip_info {display:block; position:absolute; overflow:hidden; width:1px; height:1px; font-size:0; line-height:0; text-indent:100%;}

/*************************************
  공통
**************************************/
#wrap {position:relative; min-width:300px;}

header, #footer > div {width:1200px; margin:0 auto;}

header {padding:35px 0 25px 0; position:relative;}

/* topmenu */
.top_menu > ul {position:absolute; top:0; right:0; z-index:10;}
.top_menu > ul li {float:left; background:#f5f5f5; height:30px; position:relative;}
.top_menu > ul li:first-child {background:#fff; padding-left:35px;}
.top_menu > ul li:first-child a span {display:block; position:absolute; top:0; left:0; background:#31682a; width:35px; height:100%; text-align:center;}
.top_menu > ul li:first-child a span img {padding-top:5px;}
.top_menu > ul li a {display:block; font-size:12px; color:#666; padding:6px 15px;}
.top_menu > ul li:nth-child(3) a {background:url(../DR0001IMG/common/top_line.gif) 0 50% no-repeat;}

#footer > div {overflow:hidden; padding:30px 0; font-size:12px;}
#footer > div, #footer a {color:#777 !important; font-weight:300;}
#footer > div h1, #footer > div .add_info {float:left;}
#footer > div h1 {width:24%;}
#footer > div h1 img {max-width:100%;}
#footer > div .add_info {width:70%; margin-left:6%;}
#footer > div .add_info span {display:inline-block;}
#footer > div .add_info address > span {background:url(../DR0001IMG/common/line_1x14.gif) 100% 4px no-repeat; padding:0px 10px;}
#footer > div .add_info address > span:nth-child(4), #footer > div .add_info address > span:nth-child(7) {background:none;}
#footer > div .add_info > p {margin-left:10px;}

#container + #footer {border-top:2px solid #999; background:#f7f7f7;}

a.go_top {display:none; position:fixed; z-index:100; right:10px; bottom:50px; background:url(../DR0001IMG/common/icon_go_top.png) 50% 0 no-repeat; width:37px; height:37px; text-indent:-99999px;}

/* 팝업 */
#pop_wrap h2 {padding:8px 13px; background:#5d8222; color:#fff;}
.pop_con_in {padding:3%; text-align:center;}
.pop_con_in video, .pop_con_in img {max-width:100%;}
.pop_con_in .btn_close {margin-top:20px;}
#pop_wrap video {width:100%; height:100% !important;}

@media screen and (max-width:1220px) {
header, #footer > div {width:auto; padding-left:10px; padding-right:10px;}
}

@media screen and (max-width:1100px) {
#footer > div .add_info address > span {background:none; padding:0px 0 0 10px;}
a.go_top {display:block;}
}

@media screen and (max-width:768px) {
header {padding:0px 0 25px 0;}
/* topmenu */
.top_menu > ul {position:relative;}
.top_menu > ul > li {width:28%; box-sizing:border-box; text-align:center;}
.top_menu > ul > li:first-child {width:44%;}

#footer > div h1, #footer > div .add_info {width:auto; float:none;}
#footer > div .add_info {margin:15px 0 0 0;}
}

@media screen and (max-width:480px) {
.top_menu > ul li a {padding:6px 5px;}
}

/*************************************
  상단네비
**************************************/
header {position:relative; min-height:38px;}
header h1 {position:absolute; top:30px; left:10px;}

.toggleMenu {display:none; margin:21px 0 0 5px;}
.toggleMenu img {width:27px;}
header #gnb {position:relative; float:right; width:72%;}
.nav {}
/* .nav:before, .nav:after {content:" "; display:table;} */
.nav:after {clear:both;} 
.nav ul {width:97%;}
.nav li {position:relative;}
.nav > li {float:left; width:16.66666%; text-align:center;}
.nav > li > .parent {}
.nav > li > a {display:block; font-size:18px; font-weight:400; padding:10px 0; color:#333;}
.nav > li ul {position:absolute; left:-9999px;}
.nav > li.hover > ul {left:0;}
.nav li li.hover ul {left:100%; top:0;}
.nav li li a {display:block; font-size:13px; padding:12px 10px; background:#9eaf00; color:#fff; border-top:1px solid #a8b900; border-bottom:1px solid #90a200; position:relative; z-index:100;}

@media screen and (max-width:1100px) {
.nav > li > a {font-size:16px;}
}

@media screen and (max-width:900px) {
header {min-height:20px;}
.active {display:block;}
header h1 { position:absolute; top:0%; left:50%; margin:37px 0 0 -100px; z-index:1000;}
header h1 img {width:190px;}
header #gnb {float:none; width:100%;}
.nav {margin-top:20px; background:#246b55;}
.nav > li {float:none; border-bottom:1px solid #194c3d; width:auto;}
.nav > li > a {font-size:16px; padding:15px 0; color:#fff;}
.nav > li > .parent {background:url(../DR0001IMG/common/downArrow.png) 95% 50% no-repeat;}
.nav li li .parent {background:url(../DR0001IMG/common/downArrow.png) 50% 95% no-repeat;}
.nav ul {display:block; width:100%;}
.nav li li a {font-size:14px; padding:10px 30px; background:#aebe00; border-top:1px solid #c3cf00; border-bottom:1px solid #96a800;}
.nav li li a br {display:none;}
.nav > li.hover > ul, .nav li li.hover ul {position:static;}
}