@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@300;400;700&display=swap');
#wrap{position: relative; width: 100%; margin: 0 auto; min-height: 1140px;}
.container{width: 100%; max-width: 1200px; margin: 0 auto; position: relative; }
/* 헤더 부분 */
.ham_btn {display:none;}
.header_wrap {width:100%; /* background-color:rgba(0,0,0,0.35); */position:absolute;top:0;left:0;z-index:10;  z-index: 9999;  background-color:white;}
.header_wrap.fixed {position:fixed; background: #fff; z-index: 999; border-bottom:1px solid #ddd;}
.header_wrap #header {width:1200px;box-sizing:border-box;padding:0 10px; margin:0 auto; position: relative;}
.header_wrap #header h1.logo {float:left;padding:27px 0 27px;}
/* .header_wrap #header h1.logo a {display:block;}
 */.header_wrap #header h1.logo a img {vertical-align:top; }
.header_wrap #header .gnb_wrap {float:right;overflow:hidden; margin-right:100px;}

.header_wrap #header .gnb_wrap #gnb {float:left;width:750px;}

.header_wrap #header .gnb_wrap #gnb .gnb_1depth {overflow:hidden;width:100%;height:80px;}
.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li {float:left;width:20%; }
.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li > h3 {padding-top:30px; color:#fff;}
.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li > h3 a {display:block;position:relative;height:30px;font-size:20px;color:#fff;font-weight:600;text-align:center;padding:6px 0 42px;vertical-align:top; font-weight: 600;}
.header_wrap.fixed #header .gnb_wrap #gnb .gnb_1depth > li > h3 a{color: #fff;}
.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li + li .gnb_2depth {}

.header_wrap #header .gnb_wrap #gnb .gnb_2depth {display:block;position:relative;z-index:4;width:100%;height:500px;overflow:hidden;padding-top:10px;}
.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li {height:60px; }
.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li + li {}
.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li a {display:block;padding:12px 0;font-size:16px;line-height:16px;height:16px;color:#444;font-weight:400;text-align:center;}
.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li h4.active a {color:#3a4386;}

.body_bg {display:none;position:absolute;left:0;z-index:9990;background:#000000;opacity:0.5;width:100%;}
.gnb_bar {display:block;width:0;height:2px;position:absolute;z-index:4;top:60px;bottom:2px;left:50%;background:#3a4386;}
.gnb_bg{display:none;width:100%;/*min-width:1200px;*/height:1px;position:absolute;top:0px;z-index:-20;left:0; background:#ffffff;border-bottom:1px solid #ddd;}
.gnb_bg:after{content: ''; display: block; position: absolute; top: 91px; left: 0; width: 100%; height: 1px; background-color: #ddd; }
.gnb_bg.active {display:block;}
.gnb_mo_bg {display:none;width:100%;height:1px;position:absolute;top:51px;z-index:3;left:0;background:#000000;opacity:0.5;}
.gnb_mo_bg.active {display:block;}

.gnb_etc{position: absolute; top: 15px; right: 0; width: 85px; box-sizing: border-box; padding: 10px 0; z-index:999;}
.gnbBtn a{/* background: #fff; */ color: #fff; position: relative; z-index: 99; cursor: pointer; padding: 0 5px 0 10px; font-weight: 500; }
.gnbBtn a:before{}
.gnbBtn i{margin-left: 5px;}
.gnbBtn i.fa-chevron-down{ float: right;margin-top: 5px; margin-right: 15px; }
.gnbList{display: none; background: #fff; padding: 40px 20px 10px 25px; position: absolute; top: -10px; left: 0; width: 100%; z-index: 10; box-sizing: border-box; margin-top: 10px;
box-shadow:-1px 1px 10px rgba(0,0,0,0.2);
-moz-box-shadow:-1px 1px 10px rgba(0,0,0,0.2);
-webkit-box-shadow:-1px 1px 10px rgba(0,0,0,0.2);
}
.rotate180{transform: rotate(180deg); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s;}
.gnbList a{color: #666; font-weight: 500; font-size: 16px; }
.gnbList a:hover{color: #3a4386;}
.header_wrap.fixed .gnbBtn a{color: #333 !important;}

.layerBox_inner {
	display:flex;
}

.layer3_content {
	width:400px;
	
	cursor:pointer;
	position:relative;
	font-size:20px;

}

.layer3_content a:hover {
	color:#3a4386;
}

.layer3_content::before {
	content:'';
	width:400px;
	height:1px;
	background-color:#ddd;
	display:block;
	position:absolute;
	top:110px;

}

.layer3_content a {
	color:#333;
	font-size:16px;
}


/**************************************************
	Footer
**************************************************/
#footer{position: relative; width: 100%; margin: 0 auto; padding: 30px 0; background: #222;}
.foLogo{float: left;}
.foNav{float: left;padding: 0 20px; margin-top: 5px;}
.foNav > li{display: inline-block; position: relative; padding: 0 15px;}
.foNav > li:before{content: '|'; display: block; position: absolute; top: 2px; left: -2px; color: #ddd; font-size: 10px;}
.foNav > li:first-child:before{display: none; }
.foNav > li > a{color: #ddd;; font-size: 13px; line-height: 30px;}
.foNav > li > a:hover{color: #3a4386;}

.familySite{float: right; position: relative; z-index: 9;}
.siteBtn{display: inline-block; border: 1px solid #888888; color: #ddd;; font-size: 13px; padding: 5px 20px; letter-spacing: 2px; cursor: pointer;}
.siteBtn > i{float: right; padding: 5px;}
.siteList{ display: none; position: absolute; bottom: 38px; right: 0; width: 100%; z-index: 9; border: 1px solid #888888; box-sizing: border-box; background-color: #ddd;; padding: 5px 0;}
.siteList.is-open{ display: block; }
.siteList li{padding: 3px 20px;}
.siteList li a{color: #ddd;; font-size: 14px;}
.siteList li a:hover{color: #3a4386;}

.foInfoWrap{margin-top: 20px;position: relative;}
.foInfo{font-size: 13px; color: #ddd;; line-height: 22px; text-align: left;}
.foInfo span{position: relative;}
.foInfo span:before{content: '|'; display: inline-block; position: relative; top: -2px; left: 0px; padding: 0 10px; color: #ddd;; font-size: 10px;}{font-size: 13px; color: #ddd;; line-height: 22px;}
.foInfo span:first-child:before{display: none; }
.copyright{position: absolute; bottom: 0; right: 0; font-size: 13px; color: #ddd;}

.btn01{width:180px;height:60px;border:1px solid #fff; color:#fff;text-align:center;line-height:60px;margin-top:50px;transition:all .5s; box-sizing: border-box;display: block;}

.btn01 a { color:#fff;}
.btn01:hover {background-color:#3a4386; border:1px solid #3a4386; color:#fff; cursor:pointer;}
.btn01:hover a {color:#fff;}

.btn02{width:180px;height:60px;border:1px solid #333; color:#333;text-align:center;line-height:60px;margin-top:50px;transition:all .5s; box-sizing: border-box;display: block;}

.btn02 a { color:#333;}
.btn02:hover {background-color:#3a4386; border:1px solid #3a4386; color:#fff; cursor:pointer;}
.btn02:hover a {color:#fff;}


/*반응형영역 */
/*반응형영역 
@media (max-width: 1220px){
.container{max-width: none; width: 96%; margin: 0 auto;}
#header .container{width: 100%; padding: 20px; box-sizing: border-box;}
.menu .lnb .depth1 { padding: 0 35px;}

}

@media screen and (max-width:1217px) {
	.ham_btn {display:none;position:absolute;top:5px;right:15px;}
	.ham_btn.active {display:block;}
	.ham_btn img {height:20px;vertical-align:top;}
	.header_wrap {background-color:rgba(255,255,255,1);border-bottom:1px solid #dcdcdc;}
	.header_wrap #header {width:100%;}
	.header_wrap #header h1.logo {float:none;height:32px;padding:0;margin:20px 0 11px 5px;}
	.header_wrap #header h1.logo a img {vertical-align:top; height:20px;}
	.header_wrap #header .gnb_wrap {display:none;float:none;position:absolute;top:34px;right:0;z-index:999;width:280px;margin-left:0;background:#efefef; margin-right: 0;}
	.header_wrap #header .gnb_wrap.active {display:block;/*min-height:600px;*/ 
	/*반응형영역 
	box-sizing: border-box;}
	.header_wrap #header .gnb_wrap #gnb {float:none;width:auto; height: 100%;}
	.header_wrap #header .gnb_wrap #gnb .gnb_1depth {overflow:hidden;width:100%;height:auto;border-bottom:1px solid #dcdcdc;}
	.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li {float:none;width:auto;border-top:1px solid #dcdcdc;}
	.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li + li {}
	.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li > h3 {padding-top:0;}

	.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li > h3 a {text-align:left;color:#000000;padding:20px 13px 20px 26px;background:url('../images/main/gnb_down_arrow.png') no-repeat 240px center;background-size:18px 11px; }
	.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li.active > h3 a {color:#d71921;background:url('../images/main/gnb_up_arrow.png') no-repeat 240px center;background-size:18px 11px;}
	.header_wrap #header .gnb_wrap #gnb .gnb_2depth {display:none;box-sizing:border-box;position:relative;height:auto;padding-top:0;padding:13px;border-top:1px solid #dcdcdc;background:none;}
	.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li.active .gnb_2depth {display:block;}
	.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li a {text-align:left;height:auto;padding:15px;}
	.gnb_bar {display:none;}
	
	.gnb_etc{display: block !important; /* position: fixed; */
	/*반응형영역 
	right: 50px; top: -10px;}
	/*.ham_btn.active .gnbBtn a{color: #333 ; }*/
	/*.gnb_etc:hover .gnbBtn a{color: #c4161c  !imporant;}*/
}


/*  */
/*반응형영역 
@media (max-width: 1024px){
#logo{width: 200px;padding: 5px 0;}
#logo img{width: 100%;}
.menu .lnb{display: none;}
#header .container{padding: 20px;}
.gnb{position: absolute; top: 20px; right: 60px; }
.mNav{display: block; float: right; font-size: 30px; color: #8a0f14; cursor: pointer;}

.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li > h3 a{font-size:18px; padding: 15px 10px 15px 20px}
.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li a{padding: 10px;}


/* .mobileView .lnb{background: #fff; position: fixed; top: 70px; left: 0; right: 0; border-top: 1px solid #dedede;}
.mobileView .lnb > li{float: none; display: block; }
.mobileView .lnb > li .depth1{float: none; display: block; border-bottom: 1px solid #dedede; text-align: left; padding: 10px; color: #333 !important;}
.mobileView .lnb > li .depth1:after{content: "f078"; display: block; position: absolute; top: 15px; right: 15px; color: #666; font: normal normal normal 14px/1 FontAwesome;}
.mobileView .lnb > li .depth2{display: none; position: relative; margin-top: 0; text-align: left; border-bottom: 2px solid #dedede;}
.mobileView .lnb > li .depth2 li{ text-align: left; padding: 5px 20px;}
.mobileView .lnb .depth1:before{display: none !important;} */

}

 
/*  */ /*반응형영역
@media (max-width: 768px){
.ham_btn {display:none;position:absolute;top:0px;right:15px;}
.header_wrap #header h1.logo {float:none;height:20px;padding:0;margin:20px 0 11px 5px;}
.header_wrap #header h1.logo a img {vertical-align:top; height:12px;}
.ham_btn img {height:15px;vertical-align:top;}
.header_wrap #header .gnb_wrap {display:none;float:none;position:absolute;top:31px;right:0;z-index:999;width:280px;margin-left:0;background:#efefef; margin-right: 0;}
.gnb_etc{display: block !important; position: fixed; right: 47px; top: 13px; width: 72px; padding-top: 0;}
.gnb_etc h4, .gnbList a{font-size: 13px;}
.gnbList{padding-left: 20px; padding-top: 30px; }
#footer{padding: 20px 0;}
.foLogo{float: none; text-align: center; margin-bottom: 20px; padding-top: 60px;}
.foNav{float: none; text-align: center; border-top: 1px solid #444; border-bottom: 1px solid #444;}
.foNav > li > a{font-size: 11px;}
.familySite{float: none; position: absolute; top: 0; left: 0; width: 100%; }
.siteBtn{display: block; width: 100%; font-size: 13px; padding: 5px 20px; box-sizing: border-box;}
.foInfo{text-align: center; font-size: 11px; line-height: 20px;}
.copyright{position: relative; bottom: auto; right: auto; margin-top: 20px; font-size: 11px; text-align: center;}
.mobileView .lnb .depth2 > li > a{line-height: 24px;}
}

@media (max-width: 480px){
#header .container{padding: 10px;}
.mNav{display: block; float: right; font-size: 20px; color: #8a0f14; cursor: pointer;}
.gnbBtn a{font-size: 13px; width:  auto;}

#logo{width: 110px;padding: 5px 0;}
.mobileView .lnb > li .depth1{float: none; display: block; border-bottom: 1px solid #dedede; text-align: left; padding: 3px 10px; color: #333 !important;}
.mobileView .lnb .depth2{padding-top: 0;}
.mobileView .lnb{background: #fff; position: fixed; top: 50px; left: 0; right: 0; border-top: 1px solid #dedede;}

.header_wrap #header .gnb_wrap #gnb .gnb_1depth > li > h3 a{font-size:14px; padding: 10px 5px 10px 15px}
.header_wrap #header .gnb_wrap #gnb .gnb_2depth > li a{padding: 5px; font-size: 13px}


}