@charset "utf-8";

/*
================================================================================
LAYOUT
================================================================================
*/

/* Loading */
/*.loaded{background:url(../images/common/loading.gif) 50% 250px no-repeat;}*/

/* innerWrap */
#wrap { position:relative; min-width:1500px;}
.innerWrap{position:relative;width: 1450px;margin:0 auto;}
@media only screen and (max-width: 1450px){
	#wrap{ width:100%;}
	.innerWrap { padding-left:25px; padding-right:25px; width:100%;}
	#header .headerWrap{width:100%;}
}
@media only screen and (max-width: 1024px){ 
	#wrap{width:100%; min-width:260px; margin:0 auto; }	
	.innerWrap, #header .headerWrap { width: 100%;min-width: 280px;}
}
@media only screen and (max-width: 720px){ 
	.innerWrap, #header .headerWrap {padding-left: 15px !important; padding-right:15px !important;}
}

#header {width:100%;height: 120px;background: linear-gradient(-90deg, #7db428 35%, #2e3192 65%);position:absolute;left:0;top:0;z-index: 910;}
#header a {text-decoration: none;display: block;}
.headerWrap {position:relative;width: 1450px;height: 120px;margin:0 auto; }
#header:before{content:''; display:block; position:absolute; left:0; top:0; width:421px; height:100%; background:url('../images/common/header_bg01.png') no-repeat 0 0; background-size:contain;}
#header:after{content:'';display:block;position:absolute;right:0;top:0;width:421px;height:100%;background: url('../images/common/header_bg02.png') no-repeat 100% 0%;background-size:contain;}


/* logo */
#header .logo {position:absolute;top: 0px;left: 0;width: 487px;height: 120px;z-index: 10;margin: 0;}
#header .logo a {display:table;width: 100%;height: 100%; text-align: center;}
#header .logo a span{width: 260px;height: 100%;display: table-cell;font-size:0;line-height:0;}
#header .logo a .tit{font-family: 'Gmarket Sans', 'Noto Sans KR', 'Malgun Gothic', '맑은고딕', '돋움', sans-serif;color: #fff;line-height: 1.3;font-size: 1.815em;font-weight:400;display: table-cell;text-align: left;vertical-align: middle;padding: 0;letter-spacing: -0.12em;} 
#header .logo a .tit br{ display:none;}
#header .logo a .tit .txt_sm{font-size:11px;color:#9194e2;display:block;letter-spacing: 0.1em;font-weight:500;}
#header .topBox .logo a .tit br{display: none;}

/* mGnb */
#header .btn_menu,
.topBox, .gnb_foot{display:none;}

/* gnb menu */
.gnb_wrap {position: relative;z-index: 1;}
#gnb {text-align: center;position: absolute;right: 0;top: 30px;} /*메뉴위치*/
#gnb:after {display:block; content:""; clear:both;}
#gnb > li {display: inline-block;float: left;width: 120px;vertical-align: top; }
#gnb > li.pc_non{ display:none;}
#gnb > li .tit{position:relative;z-index: 2;}
#gnb > li .tit > a {font-family: 'Noto Sans KR', 'Malgun Gothic', '맑은고딕', '돋움', sans-serif;color: #fff;font-size: 1.25em;font-weight: 400;display: block;line-height: 60px;padding: 0;letter-spacing:-0.05em; border-radius:60px;}

#gnb > li .tit a:hover,
#gnb > li .tit a:focus,
#gnb > li .tit a:active,
#gnb > li:hover .tit a,
#gnb > li.on .tit a{color: #314bab !important;background-color: #fff;}

/* target  */
#gnb .target .tit > a:after{content:'';display:inline-block;margin: 0 0 0 5px;background:url('../images/common/ic_blank_w.png') no-repeat 0 0;width:13px;height:13px;vertical-align: middle;-webkit-transform: translateY(0px);-moz-transform: translateY(0px);transform: translateY(0px);-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out;}
#gnb .target .tit > a:focus:after, #gnb .target .tit > a:active:after, #gnb .target .tit > a:hover:after,
#header.on #gnb .target .tit > a:focus:after,
#header.on #gnb .target .tit > a:active:after,
#header.on #gnb .target .tit > a:hover:after,
#header.fixed-header #gnb .target .tit > a:focus:after,
#header.fixed-header #gnb .target .tit > a:active:after,
#header.fixed-header #gnb .target .tit > a:hover:after,
#gnb > li> .ulWrap > ul > li.target > a:focus:after,
#gnb > li> .ulWrap > ul > li.target > a:active:after,
#gnb > li> .ulWrap > ul > li.target > a:hover:after{margin-top: 0px; background-image:url('../images/common/ic_blank_on.png');}


/* mobileblock */	
#mobileblock{position:fixed; z-index:50; top:0px; left:0; width:100%; height:100%; background: rgba(0,0,0,0.6); display:none;}


/* container */
#container {padding-top: 120px;}
#container:after {display:block; content:""; clear:both;}

/* footer */
#footer{position:relative;padding: 40px 0;background: #f9f9f9;}
#footer .innerWrap{overflow:hidden; padding-right:290px;}
#footer .foot_ci{ position:absolute; right:0; top:0;}
#footer p{color: #777;text-align: left;font-size: 0.875em;}
#footer .add span{display:inline-block;position:relative;padding-right: 7px;margin-right: 7px;}
#footer .add span:last-child:after{ display:none;}
#footer .add span:after{content:'';display:block;width:1px;height: 0.9em;background:#c7c6c6;position:absolute;right:0;top: 5px;}
#footer .desc{display: inline-block;}
#footer p.copyright {display: inline-block;margin-right: 10px;}


/* 콘텐츠 상단으로 이동 */
#footer .btn-top {width: 60px;height: 60px;overflow:hidden;background: linear-gradient(-18deg, #7db428 15%, #2e3192 85%);display:block;position: absolute;top: -30px;right: 20px;border-radius: 100px;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;box-shadow: 0 3px 8px rgba(0,0,0,0.2);z-index: 11;}
#footer .btn-top.on {/* right: 20px; *//* bottom: 15%; */}
#footer .btn-top span:before{content:'';display:block;width:100%;height:23px;margin-bottom: 3px;background:url('../images/common/toTop.png') center center no-repeat;}
#footer .btn-top span{color:#fff;font-family: 'Gmarket Sans';font-weight:400;font-size: 0.88em;}
#footer .btn-top:hover{background: linear-gradient(-18deg, #2e3192 15%, #7db428 85%);}  

@media only screen and (max-width:1450px) {	
	#footer .foot_ci{ right:25px;}
	#header .logo a .tit{/* font-size:1.8em; */}
	#header .logo{left: 20px;}
}
@media only screen and (max-width:1024px) {	
	body{font-size: 15px;}		
	#header {position:absolute;padding-top:0;min-width: 280px;height:auto;}
	#header .headerWrap{width:100%; min-width:280px; margin:0 auto; height: auto;max-width: inherit; } 		
	
	/* logo */
	#header .logo{width: auto;height: 85px;position: relative;top:inherit;padding: 0.5em 20px; left: 0;}
	#header .logo a{display: block;}
	#header .logo a span{width: 300px;display: block;}
	#header .logo a span.mark{ position: absolute; left: 150px; top: 0; width: 40px; }
	#header .logo a .tit{font-size: 1.5em;float:none;text-align: left;padding-top: 10px;line-height: 1.2em;display: block;}
	#header .logo a .tit b{ display:block;}
	#header .logo a .tit .txt_sm{ display:none;}

    /* topBox */
	.topBox{display:block;overflow: hidden;padding: 2.5em 20px;position: relative;}
	#header .topBox .logo{padding:0 !important;height: auto;width: 100%;margin: 0;position: relative;top:inherit;left: inherit;}
	#header .topBox .logo a{height: auto;}
	#header .topBox .logo a span{display: block;width: 100%;height: auto;}
	#header .topBox .logo a .tit{text-align:center;font-size: 1.35em;line-height: 1.3em;padding: 0 !important;}
	#header .topBox .logo a .tit{ color: #222;}
	#header .topBox .logo a .txt_sm{color: #777 !important;}
	
	/* mGnb */
	#header .btn_menu{display:block;}
	#mGnb {position:absolute;right: 0;top: 0px;z-index: 999;overflow:hidden;width: 85px;height: 85px;font-size:0;text-indent:-10000px;}		
	#mGnb a{display: block;width:100%;position: relative;height: 100%;}
	#mGnb span{position:absolute;right: 20px;display: block;height: 2px;width: 50%;border-bottom: 2px solid #fff;transition: 0.3s all ease;-webkit-transition: 0.3s all ease;-moz-transition: 0.3s all ease;-ms-transition: 0.3s all ease;-o-transition: 0.3s all ease;}
	#mGnb span:nth-child(1){top: 38%;}
	#mGnb span:nth-child(2){top: 50%;}
	#mGnb span:nth-child(3){top: 62%;}
	#mGnb.mGnbOn{position:fixed;top:0px;left: inherit;right: 0%;}
	#mGnb.mGnbOn span{border-color: rgba(0,0,0,0.8);top: 37px;left: inherit;right: 20px;}	
	#mGnb.mGnbOn span:nth-child(1){-ms-transform: rotate(45deg); -webkit-transform: rotate(45deg);transform: rotate(45deg);}
	#mGnb.mGnbOn span:nth-child(2){ display:none;}		
	#mGnb.mGnbOn span:nth-child(3){ -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg);transform: rotate(-45deg);}
	
	.gnb_foot{position: absolute;bottom: 0;left: 0;z-index: 4;text-align: center;width: 100%;display: block;}
	.gnb_foot .tel{font-family: 'Gmarket Sans', 'Noto Sans KR', 'Malgun Gothic', '맑은고딕', '돋움', sans-serif;color:#7db428;font-weight: 300;font-size: 1.25em;margin-bottom: 10px;}
	.gnb_foot .tel b{ font-weight:700;}
	.gnb_foot .txt_s{font-size: 0.95em;display: block;background: #f7f7f7;padding: 15px;}
	
	
	.gnb_wrap {position:fixed;right: -100%;top: 0px;width: 50%;height:100%;z-index:200;display:block;background:#fff;/*box-shadow : 0px 0px 15px rgba(0,0,0,0.15);*/}
	.gnb_wrap nav {position:relative;width:auto;height:100%;background: #fff;overflow:hidden;overflow-y:auto;z-index:3;}
	#gnb {position:static;float:none;width:100%;padding-left: 0 !important;text-align: center;}/*메뉴위치*/
	#gnb:after {display:block; content:""; clear:both;}
	#gnb > li:first-child{border-top: 1px solid #ededed;}
	#gnb > li {visibility:inherit;position:static;margin: 0 !important;padding:0;background:none;text-align:left;float:none;display: block;width:auto !important;border-bottom: 1px solid #ededed;border-right:none;}
	#gnb > li.pc_non{display: block;}
	
	#gnb > li .tit{position:relative;z-index: 2;}
	#gnb > li .tit > a{display:block;color: #111;font-size: 1.25em;height: 2.8em;line-height: 2.8em;letter-spacing: -0.05em;padding: 0px 0 0px 20px;border:none;width:auto !important;position:relative;font-weight: 500;background: url('../images/common/ico_mgnb.png') no-repeat right 15px center;}
	#gnb > li.on .tit a,
	#gnb > li .tit > a:hover, 
	#gnb > li .tit > a:focus,
	#gnb > li .tit > a:active,
	#gnb > li:hover .tit a{color: #2e3192 !important; background-image: url('../images/common/ico_mgnb_on.png');}
	
	#gnb > li .tit a::after{ display: none !important;}
	
	
	/* footer */	
	#footer{ padding: 30px 0;}
	#footer .innerWrap{padding-right:0}
	#footer p{text-align: center;}
	#footer .foot_ci{position: relative;right:inherit;top:inherit;margin-bottom: 10px;height: 45px;}
	#footer .foot_ci img{ height: 100%;}
	#footer p.copyright{text-align:center;float: none;display: block;}
	#footer .desc{display:block;}

	#footer .btn-top span:before{background-size: contain;height: 15px;}
}

@media only screen and (max-width:720px) {	
	#header:before,
	#header:after{width: 228px;}
	
	/* logo */
	#header .logo{height: 65px;padding: 0.5em 0;}
	#header .logo a span{height: 25px;margin-bottom: 10px;width: 98px;}
	#header .logo a span.mark{width: 31px;left: 110px;}
	#header .logo a .tit{width: auto;font-size: 1.15em;padding-top: 5px;}
	#header .topBox{ padding: 2.25em 20px 3em 20px;}
    #header .topBox .logo a span{ height:30px; }
	#header .topBox .logo a .tit{font-size:1.6em;}

	/* mGnb */
	#mGnb{width:65px;height:65px;}
	#mGnb a{height: 65px;}
	#mGnb.mGnbOn{right: 0;}
	#mGnb span{right:15px;}
	
	/* topBox */
	.topBox{}
	.topBox .lang{width: 65px;margin-left: 10px;}
	.topBox .lang a:before{ height:55px;}
	.topBox li a{ line-height:55px;}
	.topBox li a:after{padding-left: 7px;}	
		
	/* Gnb */
	.gnb_wrap{width: 100%;min-width: 260px;}
	#gnb > li.on .tit a,
	#gnb > li .tit > a:hover, 
	#gnb > li .tit > a:focus,
	#gnb > li .tit > a:active,		
	#gnb > li .tit > a{ height:45px; line-height:45px; padding-left:15px;}
	#gnb > li > div > ul > li > ul{padding: 6px 15px;}
	#gnb > li .tit > a, #header.fixed-header #gnb > li .tit > a{font-size: 1.2em;}
	#gnb > li > div > ul > li > a{ padding-left:15px;}
	#gnb > li > .ulWrap > ul > li > a:focus, #gnb > li > .ulWrap > ul > li > a:active, #gnb > li > .ulWrap > ul > li > a:hover, #gnb > li:hover > div > ul > li:hover > a {padding-left: 20px;}
	
	/* footer */		
	#footer .btn-top{width:45px;height: 45px;right:10px;top: -27px;}
	#footer .btn-top span{font-size:0;}
	#footer .btn-top span:before{margin: 15px 0;}
	#footer p.copyright{ font-size:0.95em;}
	#footer .foot_ci{ height: 35px;}
	#footer .desc{font-size: 0.8em;}
}

@media only screen and (max-width:480px) {
	body {line-height: 1.4}
	p {line-height: 1.4}
	#header:before{display:none;}
	#header:after{width: 228px;}
    #header .topBox{ padding: 35px 15px;}
    #header .topBox .logo a span{ height:22px; margin-bottom:15px;}
	#header .topBox .logo a .tit{ font-size:1.4em;}
	#header .topBox .logo a .tit br{display: block;}
	#header .logo a .tit br{display:block;}
	#header .logo a .tit{ font-size: 1.16em; }
	
	#footer p{margin-bottom: 5px;}
	#footer .add span{display: block; padding: 0;}
	#footer .add span:after{display: none;}
	#footer .btn-top{width:40px;height: 40px;top: -22px;}
	#footer .btn-top span:before{ margin:13px 0;}
	

}



/*
================================================================================
SUB LAYOUT
================================================================================
*/

/* title_area */
.title_area{overflow: hidden;padding-bottom: 60px;padding-bottom: 2.5em;position:relative;}
.title_area:before{content:'';display:block;width:100%;height: 50px;background:#362f2d;position: absolute;left: 0;top: 0;}
.title_area h2{font-size:3.385em;line-height:1em;color:#362f2d;font-family: 'Gmarket Sans';font-weight:500;margin-top: 60px;margin-top: 1.35em;}

/* location */
.location span {display:inline-block;padding:0 8px 0 15px;background:url('../images/common/icon_location_arrow.png') no-repeat 0px center;font-size: 0.95em;height: 50px;line-height: 50px;color: #fff;font-weight: 300;}
.location a{}
.location a:last-child span {padding-right:0;}
.location a.home{ margin-right: 10px;}
.location a.home img {vertical-align:middle; margin-top:-3px;}


@media only screen and (max-width:1024px) {
	.title_area{ padding-bottom:30px; }
	.title_area:before{height: 35px;}
	.title_area h2{font-size: 2em;}
	.location span{height: 35px;line-height: 35px;font-size: 0.88em;}
}
@media only screen and (max-width:720px) {	
	.title_area h2{ font-size:2em;}	
	.title_area{ padding-bottom:20px;}
	.title_area:before,
	.location{display: none;}
}
@media only screen and (max-width:480px) {	
	.title_area{ padding-bottom:15px;}
	.title_area h2{font-size: 1.65em;}
}




/* content */
#content{position:relative;width: 1450px;margin: 0 auto;padding: 0 0 50px 0;z-index: 2;}
#page{clear:both;min-height:600px;margin:0 auto;width:100%; overflow: hidden;}
#page p{font-size:1.125em;}
#page table p{ margin-bottom:0; font-size: 1em !important;}
.subTitWrap{ margin-bottom: 50px;}
#page .ttl01:first-child,
.cntBody .ttl01:first-child{margin-top: 10px;}

.ttl01{clear: both;font-size: 1.43em;font-weight: 500;color: #1d2088;margin:60px 0 15px;position:relative; line-height: 1.3em;}
.ttl01:before{content:'';display:block;margin-bottom: 8px;background: linear-gradient(90deg, #90c31f 35%, #1d2088 20%);width: 1.035em;height: 0.175em;}
.ttl01.tC{text-align:center;}
.ttl01.tC:before{ margin:0 auto 8px auto;}
.ttl01.tC + p{text-align:center;margin-bottom: 45px;}
.ttl02{clear: both;font-size: 1.2em;font-weight: 500;color: #1d2089;margin:35px 0 10px;position: relative;  line-height: 1.3em;}
.ttl01 span,
.ttl02 span,
.ttl03 span{display: inline-block;color: #555;font-size: .85em;font-weight: 400;}
.ttl03{clear: both;font-size: 1.05em;color: #333;margin:20px 0 8px;position: relative;padding-left: 0.8em;font-weight: 500; line-height: 1.3em;}
.ttl03:before{content:'';display: block;position: absolute;left: 0px;top: 0.4em;width: 0.6em;height: 0.6em;border-radius: 50%;box-shadow: 0 0 0 0.15em inset #90c31f;}
.ttl01 + .ttl02 { margin-top: 25px;}
.ttl02 + .ttl03 { margin-top: 0;}
.ttl01 span.txt_sm{ font-size:0.7em; padding-left: 10px;}
.ttl01 span .button, .ttl02 span .button, .ttl03 span .button { margin-bottom: 0;}

@media only screen and (max-width:1450px) {
	#content{ width:100%; padding-left:25px; padding-right:25px;}
}
@media only screen and (max-width:1024px) {
	#container{padding-top: 85px;}
	/* content */	
	#content {width:100%;float: none;margin:0 auto;padding: 0px 15px 30px 15px;}
		
}
@media only screen and (max-width: 720px) {	
	#container{padding-top: 65px;}
	#page{min-height:300px; }
	#page p{font-size:1em;}	    
	
	.ttl01{ margin:40px 0 13px;}
	.ttl02{ margin:28px 0 8px;}
	.ttl03{ margin:15px 0 5px;}
	.ttl01 + .ttl02 { margin-top: 20px;}
	.ttl02 + .ttl03 { margin-top: 0;}
	.ttl01:before{/* top: -6px; */margin-bottom: 5px;height: 0.15em;}
	.ttl01.center:before{ margin-left:-9px;}
	.ttl02:before, .ttl02:after{ width:4px; height: 4px;}
	.ttl01.center + p{margin-bottom: 30px !important;}	
}
@media only screen and (max-width:480px) {	
	.ttl01.center + p{margin-bottom: 25px !important;}
}