﻿@charset "utf-8";

/* header */

#header {width: 100%; height:85px; /* border-bottom: 1px solid #fff */position: fixed; z-index: 99; background-color: #fff; }
#header .bg {display: none; position: absolute; top: 84px; left: 0; width: 100%; height: 225px; background-color: #fff; border-bottom: 1px solid #ddd; border-top: 1px solid #ddd;}
#header .top_util { position: absolute; top: 35px; right: 0; z-index: 1; }
#header .top_util li {float: left; margin: 0 1px;}
#header .top_util li a {display: block;color: #666; font-size: 15px; letter-spacing: 0; padding:0px 27px; height: 35px; line-height: 35px; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;-o-border-radius:5px; transition:.25s;}
#header .top_util li a.on,
#header .top_util li a:hover {background-color: #454545; color: #fff; }

#header .logo { position: absolute; top: 18px; left:0; z-index: 99;}
#header .gnb {  margin-left: 190px;  }
#header .gnb .dep1_wrap {position: relative; font-size: 0; }
#header .gnb .dep1_wrap .dep1_con  {/*float: left;  width: 25%; */display: inline-block; min-width:120px; position: relative;}
#header .gnb .dep1_wrap .dep1_con .dep1 {display: block; font-weight: 700; color: #2f2f2f; font-size: 20px;height: 85px; line-height: 100px; padding: 0 15px;  text-align: center; position: relative; transition:0.5s; -webkit-transition:0.5s;}
#header .gnb .dep1_wrap .dep1_con:hover .dep1,
#header .gnb .dep1_wrap .dep1_con .dep1:focus,
#header .gnb .dep1_wrap .dep1_con.active .dep1 { color: #26a457; }
#header .gnb .dep1_wrap .dep1_con:hover i:before {  -ms-transform:rotate(180deg); -webkit-transform:rotate(180deg); transform:rotate(180deg); }


#header .gnb .dep2_wrap {display: none; position: absolute; top: 100%; left: -8px;  width: 100%;   height: 223px;  border-right: 1px solid #ddd; background-color: #fff; z-index: 9999;}
#header .gnb .dep2_wrap .dep2_con {text-align: center; }
#header .gnb .dep1_con:first-child .dep2_wrap{border-left: 1px solid #ddd;}
#header .gnb .dep2_wrap .dep2_con .dep2 {display: block; padding: 9px 0; line-height: 1.33; font-size: 15px; color: #333; background-color: #fff;transition:0.5s; -webkit-transition:0.5s; }
#header .gnb .dep2_wrap .dep2_con:last-child .dep2 {border-bottom: none;}
#header .gnb .dep2_wrap .dep2_con:hover .dep2,
#header .gnb .dep2_wrap .dep2_con .dep2:focus,
#header .gnb .dep2_wrap .dep2_con.active .dep2 {background-color: #26a457; color: #fff; }

/* stiky */
#header.stiky {background-color: #fff; position: fixed; border-bottom: none; box-shadow:0 1px 15px rgba(0,0,0,0.2);}
#header.stiky .gnb .dep1_wrap .dep1_con .dep1 {color: #26a457;}
#header.stiky .gnb .dep1_wrap .dep1_con:hover .dep1,
#header.stiky .gnb .dep1_wrap .dep1_con .dep1:focus,
#header.stiky .gnb .dep1_wrap .dep1_con.active .dep1 { color: #a3002e; }
/* #header.stiky .open_sitemap a {border-color: #26a457;}
#header.stiky .open_sitemap span,
#header.stiky .open_sitemap span:before,
#header.stiky .open_sitemap span:after {background-color: #26a457;} */
/* sub header */
.s_con_mb #header,
.s_con_terms #header {background-color: #fff;border-bottom: 1px solid #f1f1f1 }
.s_con_mb #header .gnb .dep1_wrap .dep1_con .dep1,
.s_con_terms #header .gnb .dep1_wrap .dep1_con .dep1{color: #26a457;}
.s_con_mb #header .gnb .dep1_wrap .dep1_con:hover .dep1,
.s_con_mb #header .gnb .dep1_wrap .dep1_con .dep1:focus,
.s_con_terms #header .gnb .dep1_wrap .dep1_con.active .dep1,
.s_con_terms #header .gnb .dep1_wrap .dep1_con:hover .dep1,
.s_con_terms #header .gnb .dep1_wrap .dep1_con .dep1:focus,
.s_con_terms #header .gnb .dep1_wrap .dep1_con.active .dep1 { color: #a3002e; }
.s_con_mb .open_sitemap a
.s_con_terms .open_sitemap a {border-color: #26a457;}
.s_con_mb #header .open_sitemap span,
.s_con_mb #header .open_sitemap span:before,
.s_con_mb #header .open_sitemap span:after,
.s_con_terms #header .open_sitemap span,
.s_con_terms #header .open_sitemap span:before,
.s_con_terms #header .open_sitemap span:after {background-color: #26a457;}

/* 사이트맵 */
.open_sitemap{position: absolute; top: 15px; right: 0; z-index: 9999;}
.open_sitemap a{position:relative;display:block;width:56px;height:56px;border: 1px solid #2f2f2f;transition:.25s; -webkit-transition:.25s;}
.open_sitemap a.active span,
.open_sitemap a:hover span { width: 26px;}
.open_sitemap a span{position:absolute;left:50%;top:50%;display:block;width:16px;height:3px;background-color:#2f2f2f;margin:-1.5px 0 0 -13px;text-indent:-9999px;}
.open_sitemap span,
.open_sitemap span:before,
.open_sitemap span:after{content:"";left:0;position:absolute;display:block;width:26px;height:100%;background-color:#2f2f2f;transition:.25s;-webkit-transition:.25s;}
.open_sitemap span:before{top:-7px;}
.open_sitemap span:after{bottom:-7px;}
/* .open_sitemap .active {border: none;}
.open_sitemap .active span{background-color:transparent;}
.open_sitemap .active span:before{top:0;transform:rotate(-45deg);-moz-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-o-transform:rotate(-45deg);}
.open_sitemap .active span:after{bottom:0;transform:rotate(45deg);-moz-transform:rotate(45deg);-webkit-transform:rotate(45deg);-o-transform:rotate(45deg);} */
.close_sitemap {position: absolute; top: 30px; right: 20px;}
.sitemap {/* display: none; */}
.sitemap .wrap {display: none;width: 300px; height: 100%; background-color: #232020; position: fixed; top: 0; right: 0px;z-index: 9999; box-shadow:-1px 0px 5px #333;}
.sitemap .wrap .hd {height: 85px; border-bottom: 1px solid #333; position: relative;}
.sitemap .wrap .hd .close {position: absolute; top: 0px; right: 0px; display: block; padding: 20px;}
.sitemap .wrap .top_util {position: absolute; bottom: 0; left: 30px;}
.sitemap .wrap .top_util li {display: inline-block; }
.sitemap .wrap .top_util li a {color: #777; display: block; padding:10px;}
.sitemap .dep1_wrap {width: 100%; padding: 30px;  }
.sitemap .dep1_wrap .dep1_con {padding: 0 5px;}
.sitemap .dep1_wrap .dep1_con .dep1 {display: block;  padding-left: 10px; height: 45px; line-height: 45px; color: #fff;transition:0.5s; -webkit-transition:0.5s; }
.sitemap .dep1_wrap .dep1_con:hover .dep1,
.sitemap .dep1_wrap .dep1_con.active .dep1{  padding-left: 15px; background-color: #26a457;}
.sitemap .dep1_wrap .dep1_con:hover .dep2_wrap {border-bottom: 1px solid #444;}
.sitemap .dep1_wrap .dep1_con.active .dep2_wrap {display: block;border-bottom: 1px solid #444;}
.sitemap .dep2_wrap  {display: none; padding: 10px 0;}
.sitemap .dep2_wrap.active {display: block;}
.sitemap .dep2_wrap .dep2_con {padding: 7px; }
.sitemap .dep2_wrap .dep2_con .dep2 { display: block; font-size: 16px;height: 30px;color: #ddd; padding-left: 15px; line-height: 30px; transition:0.5s; -webkit-transition:0.5s; }
.sitemap .dep2_wrap .dep2_con:hover .dep2,
.sitemap .dep2_wrap .dep2_con.active .dep2 {color: #26a457; padding-left:20px;}


/* footer */
#footer {background-color: #111; color: #808080;}
#footer .f_top {border-bottom: 1px solid #545454; }
#footer .f_top .f_menu li {display: inline-block;}
#footer .f_top .f_menu li a {display: block;  padding:22px 15px;position: relative; transition:0.5s;}
#footer .f_top .f_menu li a:hover,
#footer .f_top .f_menu li a:focus {text-decoration: underline;}
#footer .f_top .f_menu li a:after { content:''; display: block; width: 1px; height: 12px; background-color: #808080; position: absolute; top: 25px; left: 0;}
#footer .f_top .f_menu li:first-child a:after {display: none;}
#footer .sns_menu {position: absolute; top: 22px; right: 0;}
#footer .sns_menu li a {padding: 0 8px;}
#footer .sns_menu li {display: inline-block; padding: 0 2px;}
#footer .sns_menu li a:hover img {opacity: 1;}
#footer .sns_menu li img {opacity: .7; transition:.25s;}
#footer .logo {position: absolute; top: 0px; left: 0;}
#footer .logo img {opacity: .5;}
#footer .f_bot {padding: 30px 0 50px;}
#footer .f_bot .txt_wrap {padding-left: 170px;}

#footer .top_trigger{display:none;position:fixed;right:14%;bottom:50px;margin:0 /* -896px */0 0 0;z-index:9998;}


/* 반응형 */
@media all and (max-width:1800px){
	#header .logo {left: 20px;}
	.open_sitemap { right: 20px;}
		
}
@media all and (max-width:1400px){
	#header .top_util {right: 10%;}
	#header .gnb { width: calc(100% - 80px); padding-right: 80px;}
}
@media all and (max-width:1200px){
	#header .gnb { width: 100%; }
	#footer .logo {left: 20px;}
	#footer .f_bot .txt_wrap {padding-left: 140px;}
}
@media all and (max-width:1000px){
		#header {height: 80px;}
		#header .bg {top: 79px;}
		#header .logo img {width: 120px;}
		#header .top_util {top: 20px; right: 70px;}
		#header .top_util li a {padding: 0 10px; font-size: 12px;}
		#header .gnb {width: calc(100% - 350px); margin-left: 160px; padding-right: 0;}
		#header .gnb .dep1_wrap .dep1_con {min-width:100px;}
		#header .gnb .dep1_wrap .dep1_con .dep1 { font-size: 18px; height: 80px; line-height: 80px;}
		.open_sitemap {top: 18px;}
		.open_sitemap a {width: 40px; height: 40px;}
		.sitemap .wrap .hd {height: 90px;}
		
		.sitemap .wrap .top_util a {font-size: 14px;}
		/* #header .gnb {display: none;} */
		#footer .logo img {width: 100px;	}
}
@media all and (max-width:860px){
	#header {height: 70px;}
		#header .bg {top: 69px;}
	#header .top_util {top: 10px; right: 70px;}
	#header .top_util li a {padding: 5px;  height: auto; line-height: 1;}
	#header .gnb { margin-left: 150px; width: calc(100% - 160px);padding-top: 12px;}
	#header .gnb .dep1_wrap .dep1_con .dep1 {font-size: 16px;height: 58px; line-height: 60px; padding: 0 10px;}
	#header .gnb .dep2_wrap .dep2_con .dep2 { font-size: 14px;}
	
}
@media all and (max-width:768px){
	

	#header .logo {top: 9px; left: 5px;}
	#header .logo img {width: 100px;}

	#header .gnb { margin-left: 120px; width: calc(100% - 130px);padding-top: 0; margin-top: 10px;}
	#header .gnb .dep1_wrap .dep1_con .dep1 {height: 60px;}
	#header .top_util {top: -5px;}
	#header .top_util li a {font-size: 12px;}
	.open_sitemap {top: 4px;right: 10px;}
	.close_sitemap {top: 35px;}
	.sitemap .dep1_wrap {padding: 20px;}
	.sitemap .dep1_wrap .dep1_con .dep1 {font-size: 16px;}
	.sitemap .dep2_wrap .dep2_con .dep2 {font-size: 15px;}
	.sitemap .dep2_wrap {height: auto;}
	/* .sitemap .dep1_con:nth-child(3) .dep2_wrap, .sitemap .dep1_con:nth-child(4) .dep2_wrap, .sitemap .dep1_con:nth-child(5) .dep2_wrap {height: 80px;} */
	.sitemap .wrap .hd {height: 70px;}
	.sitemap .dep2_wrap .dep2_con {padding: 3px 7px;}
	#footer .f_top .f_menu li {width: 24%; text-align: center;}
	#footer .f_top .f_menu li a {padding:22px 0; width: 100%; font-size: 14px;}
	#footer .f_top .f_menu li a:after {top: 26px;}
	#footer .sns_menu {position: static; text-align: center; margin: 12px 0;}
	#footer .logo {position: static; text-align: center;}
	#footer .logo img {width: 60px;}
	#footer { padding:10px 0 0;}

	#footer .f_bot .txt_wrap {padding-left: 0; text-align: center; margin-top: 20px; }
}
@media all and (max-width:600px){
	#header .gnb .dep1_wrap .dep1_con {min-width:80px; }
	#header .gnb .dep2_wrap {left: 0;}
	#header .gnb .dep1_wrap .dep1_con .dep1 i:before {width: auto;}
	#header .gnb .dep2_wrap .dep2_con .dep2 {font-size: 12px;}
}
@media all and (max-width:560px){
	#header .gnb .dep1_wrap .dep1_con .dep1 i {display: none;}
}
@media all and (max-width:500px){
	#header .top_util { top: -2px; right: 15px;}
	#header .bg {height: 40px;}
	#header .gnb .dep1_wrap  {text-align: right; position: static;}
	#header .gnb .dep1_wrap .dep1_con {position: static; min-width:auto;}
	#header .gnb .dep2_wrap {width: 100%;height: 38px; border: none; }
	#header .gnb .dep2_wrap {left: 0; text-align: center;}
	#header .gnb .dep1_con:first-child .dep2_wrap {border-left: none;}
	#header .gnb .dep2_wrap .dep2_con {display: inline-block;}
	#header .gnb .dep2_wrap .dep2_con .dep2 { padding: 0 3px; line-height: 38px;}
	
	.open_sitemap {display: none;}
}
@media all and (max-width:486px){
	
	#header .logo {top: 17px;}
	#header .logo img {width: 80px;}
	
	#header .gnb { margin-left: 90px; width: calc(100% - 105px); padding-top: 10px; }
	#header .gnb .dep1_wrap .dep1_con .dep1 {font-size: 15px; padding: 0 5px; height: auto; line-height: 50px;}
	
	.route_wrap .wrap .home img {height: 12px;}
	.route_wrap .wrap,
	.route_wrap .txt16 {font-size: 12px;}
	.route_wrap .route_con.route_con1 {transform:translateY(-2px);}
	#header .top_util li a {font-size: 10px;}
	#footer .f_top .f_menu li {width: 49%;	}
	#footer .f_top .f_menu li a {padding: 8px 0;}
	#footer .f_top .f_menu li a:after {top: 15px;}
	#footer .f_top .f_menu li:nth-child(3) a:after {display: none;}
	
	#footer .f_bot .txt {font-size: 12px;}
	#footer .top_trigger {width: 15%; bottom: 0; right: 0;}
}
@media all and (max-width:380px){
	#header .gnb .dep1_wrap .dep1_con .dep1 {font-size: 14px;}
	#header .gnb .dep2_wrap .dep2_con .dep2 {font-size: 11px;}
	#header .gnb {width: calc(100% - 75px); margin-left: 60px;}
	#header .gnb .dep1_wrap .dep1_con .dep1 {padding: 0 4px;}
}
@media all and (max-width:339px){
	#header .logo {top: 22px;}
	#header .logo img {width: 70px;}
	
}
@media all and (max-width:320px){
	#header {width: 320px;}
}