@charset "utf-8";

#wrap {position:relative;margin:0;padding:0;}
.container {width:1280px;position:relative;margin:0px auto;padding:0;}

/* Header */
#header{-webkit-transition:top 0.4s;-moz-transition:top 0.4s;-o-transition:top 0.4s;-ms-transition:top 0.4s;transition:top 0.4s;position:absolute;left:0;top:0;width:100%;}
#header.fixed {position:fixed;}
#headerInnerWrap{position:relative; width:100%; z-index:100; background-color: #fff; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-o-transition:all 0.3s;-ms-transition:all 0.3s;transition:all 0.3s;border-bottom:1px solid #e5e5e5;}
#header.over #headerInnerWrap {border-bottom:3px solid #254fa3;-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.14);
-moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.14);
box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.14);}
#header .logo{position:relative; z-index:100; float:left; padding:17px 0 0 0; }	
#header .logo a{display:block; }
#header .logo img{display:block; vertical-align:middle;}

/* -------- Header :: UTIL BOX -------- */
.header-util-box{position:absolute; top:50%; right:15px; margin-top:-16px; z-index:100; }

/* Header :: 사이트맵(기본형 or 커스텀) */
.sitemap-line-btn{float:left; width:45px; height:37px; margin-left:10px}
.sitemap-line-btn .line{display:block; width:38px; height:3px; background-color:#000; margin: 7px auto;}
.sitemap-line-btn .line1{}
.sitemap-line-btn .line2{margin-left: 7px;}
.sitemap-line-btn .line3{}



/* -------- Header :: GNB(PC) -------- */
#gnb{ width:100%; z-index:99; position:relative; }
#gnb .gnb-wrapper{display:inline-block; *display:inline;*zoom:1;float:right;}
#gnb .gnb-wrapper li{float: none;}
#gnb .gnb-wrapper > li{float:left;}

#gnb .gnb-wrapper li > a{padding: 0;}
#gnb .gnb-wrapper > li > a{position:relative; margin-right:60px;text-align:left;z-index:100; display:block; height:90px; line-height:90px; padding:0 0px; color:#192857; font-size:18px; letter-spacing:-0.75px; font-weight:800; -webkit-transition: color 0.3s;-moz-transition: color 0.3s; -o-transition: color 0.3s;-ms-transition: color 0.3s; transition: color 0.3s;font-family:'NanumSquare';}
#gnb .gnb-wrapper > li:last-child > a {margin-right:105px;}

#gnb .gnb-wrapper > li > a:hover, #gnb .gnb-wrapper > li.on > a{color: #2f63c9;}


#gnb .gnb-wrapper > li .gnb-2dep {display:none;}
#gnb .gnb-wrapper > li .gnb-2dep ul{padding:0 0 15px 0px;margin:0;}
#gnb .gnb-wrapper > li .gnb-2dep ul li{position:relative;padding:0px; margin:0;text-align:left;width:100%;}
#gnb .gnb-wrapper > li .gnb-2dep ul li a{font-family:'Noto Sans KR';display:block;width:100%; color:#787878; font-weight: 400; height: auto; line-height: 30px;	letter-spacing: -0.65px; font-size:14px; -webkit-transition:all 0s 0s;-moz-transition:all  0s 0s;-o-transition:all  0s 0s;-ms-transition:all  0s 0s;transition:all  0s 0s}
#gnb .gnb-wrapper > li .gnb-2dep ul li a:hover{text-decoration:none; color: #2699da;}
#gnb .gnb-wrapper > li .gnb-2dep ul li a span{display: inline-block; position: relative;}
#gnb .gnb-wrapper > li .gnb-2dep ul li a span:before{display: block; position: absolute; left: 0; bottom: 2px; content: ''; width: 0; height: 1px; -webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
-ms-transition: pall 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;}
#gnb .gnb-wrapper > li .gnb-2dep ul li a:hover span:before{width: 100%; background-color: #2699da;}
/*#gnb .gnb-wrapper > li:last-child .gnb-2dep {position: absolute;width:200px;}*/





/* -------- Header :: GNB(Mobile) -------- */
.nav-open-btn{display:none;
    position: fixed;
    top: 24px;
    right: 5px;
    z-index: 9998;
    height: 37px;
    transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
    -webkit-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
    -oz-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
    -ms-transition: all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);
	border:none;background:rgba(255,255,255,0);
}
.nav-open-btn .line{
		display:block; width:30px; height:3px; background-color:#000; margin: 7px auto;
		-webkit-transition: all 0.3s ease-in-out;
	  -o-transition: all 0.3s ease-in-out;
	  transition: all 0.3s ease-in-out;
	}
	/*.nav-open-btn .line2{margin-left: 7px;}*/
	.nav-open-btn.active {background-color:#192857; }
	.nav-open-btn.active .line{background-color:#fff;}
	.nav-open-btn.active .line:nth-child(2), .nav-open-btn.active .line:nth-child(4){opacity: 0;}
	.nav-open-btn.active .line:nth-child(1){
		 -webkit-transform: translateY(10px) rotate(45deg);
		  -ms-transform: translateY(10px) rotate(45deg);
		  -o-transform: translateY(10px) rotate(45deg);
		  transform: translateY(10px) rotate(45deg);
	}
	.nav-open-btn.active .line:nth-child(3){
		 -webkit-transform: translateY(-10px) rotate(-45deg);
		  -ms-transform: translateY(-10px) rotate(-45deg);
		  -o-transform: translateY(-10px) rotate(-45deg);
		  transform: translateY(-10px) rotate(-45deg);
	}
#gnbM{display:none}

/* Footer */
.footer {clear:both;border-top:1px solid #dddddd;font-size:14px;}
.footer .container {padding:20px 0;}
.footer-copy-wrap {float:left;width:73%;}
.footer-copy-wrap p {margin:10px 0;line-height:1.4em;color:#868686;display:inline-block;}
.footer-copy-wrap p span {font-weight:600;}
.footer-copy-wrap a {color:#868686;padding:0 15px;font-weight:600;}
.footer-copy-wrap a:first-child {padding-left:0;}
.footer-family-wrap {float:left;width:27%;text-align:right;line-height:26px;}
.footer-family-wrap .family-link {display:inline-block;line-height:28px}
.footer-family-wrap .family-link strong {color:#202020;}
.footer-family-wrap .family-link a {font-weight:600;color:#868686;padding:0 10px;}
.footer-copy-wrap .select-wrap {display:inline-block;}
.footer-copy-wrap .select-wrap .select-area {display:inline-block;text-align:left;position:relative;}
.footer-copy-wrap .select-wrap .select-area .select-choice {margin:8px 0;border:1px solid #dddddd;padding:2px 5px;color:#a1a1a1;cursor:pointer;min-width:120px;}
.footer-copy-wrap .select-wrap .select-area ul {display:none;position:absolute;left:0;bottom:32px;border:1px solid #dddddd;background:#fff;min-width:120px;}
.footer-copy-wrap .select-wrap .select-area ul.selectview {display:block;}
.footer-copy-wrap .select-wrap .select-area ul li a {font-size:12px;display:block;padding:2px 5px;letter-spacing:-0.6px;line-height:22px;color:#a1a1a1;}
.footer-family-wrap p img {margin-top:10px;}

/* Footer :: TOP버튼 */
.to-top-btn{
	position:fixed; bottom:-100px; right:15px; display:block; width:70px; height:70px; background:url(../images/common/top.png);  line-height:70px; z-index:99;
	opacity:0;filter:Alpha(opacity=0);text-indent:-99999px;
	-webkit-transition:all 0.6s;-moz-transition:all 0.6s;-o-transition:all 0.6s;-ms-transition:all 0.6s;transition:all 0.6s
}
.to-top-btn:hover {background:url(../images/common/top_ov.png);}
.to-top-btn.fixed{bottom:15px; opacity:1.0;filter:Alpha(opacity=100);}

/*quick*/
#quick {position:fixed;right:10px;top:130px;width:130px;z-index:90;text-align:center;}
#quick a {display:block;background:rgba(30,50,98,0.3);width:100%;text-align:center;color:#fff;padding:5px;margin:5px 0;font-size:12px;}
#quick a:hover {background:rgba(30,50,98,1);}
#quick p.more {background:#1e3262;text-algin:center;display:inline-block;color:#fff;padding:0px 15px;cursor:pointer;}
#quick p.more_view {display:none;}
#quick p.more_view.active {display:block;}

/*subvisual*/
.subvisual {height:360px;text-align:center;color:#fff;padding:205px 0 0 0;font-size:34px;line-height:1.3em;text-shadow: 2px 2px 2px rgba(0,0,0,0.35);font-weight:300;} /* 200514modi */
.subvisual strong {font-weight:600;}
.subvisual.sub01 {background:#b8e0f2 url(../images/sub/Visual01.png) no-repeat center top;}
.subvisual.sub02 {background:#b8e0f2 url(../images/sub/Visual02.png) no-repeat center top;}
.subvisual.sub03 {background:#b8e0f2 url(../images/sub/Visual03.png) no-repeat center top;}
.subvisual.sub04 {background:#b8e0f2 url(../images/sub/Visual04.png) no-repeat center top;}
.subvisual.sub05 {background:#b8e0f2 url(../images/sub/Visual05.png) no-repeat center top;}
.subvisual.sub06 {background:#8d93a8 url(../images/sub/Visual06.png) no-repeat center top;}
.subvisual.sub07 {background:#8d93a8 url(../images/sub/Visual07.png) no-repeat center top;}

#lnb-wrap {float:left;width:20%;}
#lnb-wrap h2 {text-align:center;color:#fff;background:#254fa3;padding:35px 0;font-size:22px;font-weight:600;}
#lnb-wrap li {border-bottom:1px solid #e2e3e4;}
#lnb-wrap li a {padding:15px;color:#828282;font-size:15px;display:block;width:100%;}
#lnb-wrap li.active a, #lnb-wrap li a:hover {background:#f8f8f8;color:#088fd5;}

#content-wrap {float:right;width:75%;padding:30px 0 225px 0;background:url(../images/sub/sub_bg.png) no-repeat bottom right;}
#content-wrap .title-wrap {border-bottom:1px solid #e2e3e4;padding-bottom:20px;}
#content-wrap .title-wrap h3 {font-size:27px;color:#192857;font-weight:600;display:inline-block;}
#content-wrap .title-wrap .nav {float:right;margin-top:10px;color:#9b9b9b;}
#content-wrap .title-wrap .nav strong {font-weight:400;color:#000;}
#content-wrap .content-area {margin:50px 0 20px 0;}


.modal-open {
	overflow: hidden;
}
.modal {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1040;
	display: none;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
	outline: 0
}
.modal.fade .modal-dialog {
	-webkit-transition: -webkit-transform .3s ease-out;
	-o-transition: -o-transform .3s ease-out;
	transition: transform .3s ease-out;
	-webkit-transform: translate(0, -25%);
	-ms-transform: translate(0, -25%);
	-o-transform: translate(0, -25%);
	transform: translate(0, -25%)
}
.modal.in .modal-dialog {
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0)
}
.modal-open .modal {
	overflow-x: hidden;
	overflow-y: auto
}
.modal-dialog {
	position: relative;
	width: 95%;
	margin: 10px;
	border: 3px solid #3969ba;
}
.modal-content {
	position: relative;
	background-color: #fff;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	
	outline: 0;
}
.modal-backdrop {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	background-color: #000
}
.modal-backdrop.fade {
	filter: alpha(opacity=0);
	opacity: 0
}
.modal-backdrop.in {
	filter: alpha(opacity=70);
	opacity: .7
}
.modal-header {
	min-height: 16.43px;
	padding: 15px;
	border-bottom: 1px solid #e5e5e5;
	background:#ecf7fb;
}
.modal-header .close {
	background:rgba(255,255,255,0);
	border:none;
	color:#888;
	position:absolute;
	right:10px;
	top:15px;
	cursor:pointer;
}
.modal-title {
	margin: 0;
	line-height: 1.42857143;
	font-weight:600;
	color:#3969ba;
	font-size:1.2em;
}
.modal-body {
	position: relative;
	padding: 15px
}
.modal-footer {
	padding: 15px;
	text-align: right;
	border-top: 1px solid #e5e5e5
}
.modal-footer .btn+.btn {
	margin-bottom: 0;
	margin-left: 5px
}
.modal-footer .btn-group .btn+.btn {
	margin-left: -1px
}
.modal-footer .btn-block+.btn-block {
	margin-left: 0
}


@media (min-width:768px) {
.modal-dialog {
	width: 700px;
	margin: 30px auto;
}


}


/* 인풋 */
.form-checkbox {position:relative;display:inline-block;vertical-align:middle;}
.form-checkbox ~ .form-checkbox {margin:0 0 0 15px;}
.form-checkbox input {position:absolute;top:0;left:0;width:20px;height:20px;opacity:0;}
.form-checkbox input ~ label {position:relative;display:block;height:20px;line-height:20px;padding:0 0 0 28px;font-size:13px;font-weight:normal;cursor:pointer;}
.form-checkbox input ~ label:before {position:absolute;top:1px;left:1px;width:18px;height:18px;display:block;content:"";box-sizing:border-box;background:#d9d9d9;}
.form-checkbox input ~ label .xi.xi-check-square {position:absolute;top:0;left:-2px;line-height:20px;font-size:24px;color:#396aba;display:none;}
.form-checkbox input ~ label.notvalid:after {background:#396aba;}
.form-checkbox input:checked ~ label:before {background-color:#fff;}
.form-checkbox input:checked ~ label .xi-check-square {display:block;}

.form-radio {position:relative;display:inline-block;vertical-align:middle;}
.form-radio ~ .form-radio {margin:0 0 0 15px;}
.form-radio input {position:absolute;top:0;left:0;width:20px;height:20px;opacity:0;}
.form-radio input ~ label {position:relative;display:block;height:20px;line-height:20px;padding:0 0 0 28px;font-size:13px;font-weight:normal;cursor:pointer;}
.form-radio input ~ label:before {position:absolute;top:1px;left:1px;width:18px;height:18px;display:block;content:"";box-sizing:border-box;border-radius:50%;background:#d9d9d9;}
.form-radio input ~ label .xi.xi-check-circle {position:absolute;top:0;left:-2px;line-height:20px;font-size:24px;color:#396aba;display:none;}
.form-radio input ~ label.notvalid:after {background:#396aba;}
.form-radio input:checked ~ label:before {background-color:#fff;}
.form-radio input:checked ~ label .xi-check-circle {display:block;}
.form-radio .form-radio-item {margin-left:15px;display:inline-block;}
.form-radio .form-radio-item:first-child {margin-left:0;}



@media (min-width:992px) {

}


/* desktop 1600*/
@media screen and (max-width:1600px){		

}

/* desktop 1366 */
@media screen and (max-width:1366px){		

}

/* desktop 1280 */
@media screen and (max-width:1280px){		
.container {width:95%;}
}

/* desktop 1200 */
@media screen and (max-width:1200px){		
#gnb .gnb-wrapper > li > a {margin-right: 45px;}
	#gnb .gnb-wrapper > li .gnb-2dep ul li a {    letter-spacing: -1.5px;		font-size: 12.5px;}
}

/* desktop 1060 */
@media screen and (max-width:1065px){		
	#headerInnerWrap {padding-bottom:15px;}
/* -------- Header :: GNB(Pc) -------- */
	#gnb{display:none;}
	.nav-open-btn {    display: block;}

	/* -------- Header :: GNB(Mobile) -------- */
	.gnb-overlay-bg-m{display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:101;}	
	#gnbM{ 
		display:block; 
		overflow-y:auto; 
		position:fixed; 
		top:0px; 
		right:-82%;
		width:80%; 
		height:100%;  
		max-width:280px; 
		background-color:#192857; 
		z-index:999; 
		box-shadow:-2px 1px 11px rgba(0, 0, 0, .3);
		transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  
		-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); 
		-ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);		/* gnb OPEN 속도 */
		visibility:hidden;
	}
	#gnbM.open{
		right:0px; 
		visibility:visible;
	}
	#gnbM #navigation{margin-top:80px;}	/* Header 높이값 */
	/* GNB Mobile :: 1차 */
	#gnbM #navigation > li{border-bottom:1px solid rgba(255,255,255,0.2);}
	#gnbM #navigation > li > a {position:relative; display:block; padding:15px; color:#fff; font-size:17px;  }
	#gnbM #navigation > li.active > a{color:#fff;}
	#gnbM #navigation > li.has-2dep > a{}
	#gnbM #navigation > li.has-2dep.active > a{}
	#gnbM #navigation > li .gnb-icon{position:absolute; top:50%; right:10px; margin-top:-10px;}
	#gnbM #navigation > li .gnb-icon i{font-size:24px;}
	/* GNB Mobile :: 2차 */
	#gnbM #navigation > li .gnb-2dep{display:none; padding:15px 0; background-color:#00438c; /* box-shadow:inset 0px 3px 9px rgba(0, 0, 0, .3); */}
	#gnbM #navigation > li .gnb-2dep > li{}
	#gnbM #navigation > li .gnb-2dep > li > a{display:block; color:#fff; font-size:14px; padding:10px 15px; opacity:0.7;filter:Alpha(opacity=70);}
	#gnbM #navigation > li .gnb-2dep > li.on > a{opacity:1.0;filter:Alpha(opacity=100); text-decoration:underline;}
	/* GNB Mobile :: 3차 */
	#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep{display:none; padding:10px 20px; background-color:#aaa; box-shadow:inset 0px 3px 9px rgba(0, 0, 0, .3);}
	#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a{display:block; padding:8px 0; font-size:13px; color:#fff;}
	#gnbM #navigation > li .gnb-2dep > li > .gnb-3dep > li > a:before{display:inline-block; content:"-"; margin-right:5px;}
	#gnbM p {text-align:center;margin:15px 0;}
	#gnbM p a {display:inline-block;background:#254fa3;color:#fff;padding:5px 10px;font-size:12px;margin:2px;border-radius:2px;min-width:45%}
	#quick {display:none;}
}

/* desktop 1024 */
@media screen and (max-width:1024px){		
	#lnb-wrap {display:none;}
	#content-wrap {float:none;width:100%;}
}

/* desktop 768 */
@media screen and (max-width:768px){
	body {font-size:13px;line-height:1.3em;}
	
	.subvisual {
    height: 250px;
    padding: 125px 0 0 0;
    font-size: 30px;
}
	.subvisual.sub01 {    background-size:cover;}
	.footer {font-size:11px;}
	.footer-copy-wrap {float:none;width:100%;}
	.footer-family-wrap {float:none;width:100%;text-align:left;}
	.footer-copy-wrap .select-wrap .select-area .select-choice {    min-width: 110px;}
	.footer-copy-wrap .select-wrap .select-area ul { min-width: 110px;bottom: 28px;}
	.footer-copy-wrap .select-wrap .select-area ul li a {    font-size: 11px;    letter-spacing: -1px;}
	
	#content-wrap .content-area {    margin: 20px 0 10px 0;}
	#content-wrap .title-wrap h3 {font-size:22px;}
	#content-wrap .title-wrap .nav {display:none;}
	.to-top-btn  {display:none;}
}

/* mobie 640 */
@media screen and (max-width:640px){	

}

/* mobie 414 */
@media screen and (max-width:425px){	
	.subvisual {
    height: 200px;
    padding: 110px 0 0 0;
    font-size: 22px;
}
#content-wrap {padding: 30px 0 100px 0;    background-size:contain;}
	.footer-copy-wrap .select-wrap .select-area .select-choice { margin-top:5px}
}

@media screen and (max-width:320px){	
	#header .logo img {    width:230px;height:auto;}
	.nav-open-btn {top: 20px;	}
}