@charset "utf-8";

/* background fixed 사용시 버그 대응용 * 한 번 스크롤로 페이지 전체 넘김을 할 때는 html스타일에서 height속성 제거하기 */
html {overflow: hidden; height: 100%;}
body {overflow: auto; height: 100%;}

/* ************************ 공용 ************************ */
a {text-decoration:none !important; outline:none !important; selector-dummy:expression(this.hideFocus=true) !important;}
a:link {text-decoration:none; color:#3d3833;}
a:visited {text-decoration:none; color:#3d3833;}
a:hover {text-decoration:none; color:#000;}
a:active {text-decoration:none; color:#3d3833;}
a,img {transition:all .1s linear;	-webkit-transition:all .1s linear; -moz-transition:all .1s linear;}
			
body {
	position:relative; width:100%; min-width:320px;
	font-family:"NotoSansKR","돋움",sans-serif; font-size:16px; font-weight:normal; line-height:1.6; color:#666; letter-spacing:0px;
}
#gotop {z-index:999999; position:fixed; width:35px; height:35px; border-radius:7px; bottom:20px; right:20px; background:url(../images/common/arrow_up.png) no-repeat 50% #fff; box-shadow:0 0 3px rgba(0,0,0,.3) !important; }

/* 컨텐츠 */
section {position:relative; display:block; width:100%; max-width:1200px; margin:0 auto;}
.contents img {max-width:100%; height:auto;}

div[class *="col-"] {padding-left:0; padding-right:0;}



/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {

	html,body {}
	.mobile {display:none !important;}

	/*헤더*/
	header {z-index:999; position:absolute; width:100%; background-color:#fff;}
	header .head {position:relative; height:80px; max-width:1200px; margin:0 auto;}
	header .head h1 {display:inline-block; margin-top:25px;}
	header .head .side {position:absolute; right:0; top:35px; line-height:1;}
	header .head .side li {float:left; overflow:hidden;}
	header .head .side li a {display:block; color:#666; text-transform:uppercase; font-weight:normal;}
	header .head .side li:first-child a {background:url(../images/common/i_tel.png)no-repeat; font-size:18px; letter-spacing:-1px; color:#0064ca; margin-right:25px; padding:6px 0 6px 35px;}
	header .head .side li a.link {border:1px solid #e5e5e5; border-radius:5px; padding:9px 10px; font-size:11px; color:#666;}
	header .head .side li:nth-child(2) a {border-radius:5px 0 0 5px; margin-right:-1px;}
	header .head .side li:nth-child(3) a {border-radius:0 5px 5px 0;}
	header .head .side li:last-child a {background:#f2f2f2; margin-left:10px;}
	
	/*sub*/
	.sub_visual {
		text-align:center; min-width:1200px; max-width:100%; height:220px; margin-top:130px;
		background-size:cover; background-position:50%; background-repeat:no-repeat;
	}
	.sub_visual.bg_intro {background-image:url(../images/main/main_bg.jpg);}
	.sub_visual p {line-height:1;}
	.sub_visual p:first-child {padding-top:70px; font-family: 'Abel', sans-serif; font-size:44px; color:#fff; text-transform:uppercase;}
	.sub_visual p:last-child {padding-top:20px; color:rgba(255,255,255,.5);}
	.sub_visual span {font-size:18px; color:#fff; font-weight:normal;}
	.topLine {z-index:-1; position:absolute; top:350px; left:0; width:100%; height:80px; border-bottom:1px solid #e7e7e7; background-color:#fff;}

	/**/	
	section.con_wrap {display:table;}
	section.con_wrap>div {display:table-cell; float:none; clear:both; padding:0; vertical-align:top;}
	/* .affix {z-index:9999; top:0;} */
	.lnb {width:100%; max-width:220px; margin:0; padding:0; background-color:#fff; top:-20px; word-break:keep-all; padding-bottom:100px;}
	.lnb h2 {text-align:center; margin:0 0 10px 0; line-height:1; padding-top:40px; width:100%; height:120px; font-size:22px; color:#fff; border-radius:0 0 3px 3px; background:#0064ca;}
	.lnb span {color:rgba(255,255,255,.3); font-size:12px;}
	.lnb>ul>li {width:100%; border-bottom:1px solid #e0e0e0;}
	.lnb>ul>li>a {display:block; padding-left:30px; margin-right:20px; line-height:45px; color:#666; font-weight:normal;}
	.lnb>ul>li.on {border-bottom:0; border-radius:3px; background:#0064ca; color:#fff;}
	.lnb>ul>li.on>a {color:#fff; background:url(../images/common/snb_on.png) no-repeat right center;}
	
	/* location */
	.contents {padding:0 0 0 70px !important; position:relative; width:80%;}	
	.contents .con {padding:50px 0; overflow:hidden;}
	.location {height:80px; color:#333;}
	.location h3 {padding:30px 0 0 0; float:left; font-size:22px; color:#333; line-height:-2px;}
	.location div {padding-top:40px; float:right; font-size:12px; color:#999;}
	.location div span+span {
		display:inline-block; margin-left:7px; padding-left:15px; line-height:1;
		background-image:url(../images/common/location.png); background-position:left 50%; background-repeat:no-repeat;
	}
	

	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {visibility:hidden; position:relative; display:block; margin:0 auto; overflow:hidden; text-align:center;}
	nav.pc .navbg {position:absolute; left:0; top:0; width:100%; height:100%;}
	nav.pc .navbg .dep1 {height:50px; border-top:1px solid #e5e5e5; border-bottom:3px solid #0064ca;}
	nav.pc .navbg .dep2 {height:100%; background-color:#fff; border-bottom:1px solid #0064ca;}
	nav.pc .gnb {position:relative; display:inline-block; max-width:1200px; text-align:left !important;}
	nav.pc .gnb>ul {margin:0 !important; line-height:1.6;}
	nav.pc .gnb>ul>li {position:relative; float:left; padding-right:90px;}
	nav.pc .gnb>ul>li:last-child {padding-right:50px !important;}
	nav.pc .gnb>ul>li>a {display:block; width:100%; height:50px; padding-top:18px; font-size:18px; font-weight:normal; line-height:1; color:#000;}
	nav.pc .gnb>ul>li>ul {position:absolute; top:80px; left:0; width:100% !important;}
	nav.pc .gnb>ul>li>ul>li a {display:inline-block; padding-bottom:10px; line-height:1; color:#666; font-size:16px; font-weight:normal;}
	nav.pc .gnb>ul>li>ul>li a:hover {color:#0064ca;}
	nav.pc .gnb>ul>li>ul>li.on a {color:#0064ca;}

	/*footer*/
	footer {clear:both; overflow:hidden; max-width:100%; color:#666; padding:40px 0 50px; font-weight:normal; background-color:#fff; border-top:5px solid #dce1e7; letter-spacing:.5px;}
	footer address {position:relative; width:1200px; margin:0 auto; font-size:13px;}
	footer address div:first-child a img {height:25px;}
	footer address div:nth-child(2) span {padding-right:15px;}
	footer address div:last-child {position:absolute; top:0; right:0;}
	
	

}



/* ************************ #2.태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {
	
	/* html {border:3px solid red;} */
	html,body {font-weight:normal; font-size:15px;}	
	.pc {display:none !important;}

	/*헤더*/
	header {z-index:999; width:100%; left:0; top:0;}
	header .head {width:100%; height:50px; overflow:hidden; line-height:1; background-color:#fff;}
	header .head .gnbView {display:block; float:right; width:50px; height:50px; border-left:1px solid #e7e7e7; background:url(../images/common/icon_menu.png)no-repeat center; background-size:25px;}
	header .head h1 {float:left; margin:0 !important; display:block;}
	header .head h1 a {display:inline-block; padding:10px 15px; text-align:center;}
	header .head h1 a img {display:block; height:25px; font-size:0; line-height:0;}
	
	/*sub_visual*/
	.sub_visual {display:none;}
	
	/*lnb*/
	.lnb {display:none;}
	
	/*location*/
	.contents .location h3 {background:#0064ca; color:#fff; text-align:center; padding:15px 0; font-size:18px; font-weight:normal;}
	.contents .location div {display:none;}
	.contents .con {overflow:hidden; padding:20px 15px;}
	
	/*gnb*/
	nav.mobile {z-index:9999; position:fixed; visibility:hidden; top:0; width:50%; height:100%; overflow:hidden; box-shadow:-5px 0 5px rgba(0,0,0,.3) !important; background-color:#fff;}
	nav.mobile .closeWrap {position:relative; height:50px; background-color:#0064ca; color:#fff;}
	nav.mobile .closeWrap .gnbClose {display:block; float:right; width:50px; height:50px; text-align:center; background:url(../images/common/icon_gnbclose.png) 50% 50% no-repeat; background-size:25px; border-left:1px solid rgba(255,255,255,.15);}
	nav.mobile .closeWrap .home {position:absolute; display:block; top:0; left:0; padding:20px; color:#fff; font-size:12px;}
	nav.mobile .closeWrap .lang {position:absolute; display:block; top:0; left:50px; padding:20px; color:#fff; font-size:12px;}
	.gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.6);}

	nav.mobile .gnb {position:relative; width:100%; height:100%; overflow-y:auto; text-align:left; /* background:#0064ca; */}
	nav.mobile .gnb * {width:100% !important;}
	nav.mobile .gnb>ul>li {clear:both; position:relative;}
	nav.mobile .gnb>ul>li>a {display:block; padding:10px 20px; font-size:16px; color:#000; border-bottom:1px solid #e0e0e0; background:#fff; letter-spacing:-1px;}
	nav.mobile .gnb>ul>li>a:hover {color:#4591e0;}
	nav.mobile .gnb>ul>li.on>a {color:#fff; background:#4591e0; border-bottom:1px solid #4591e0;}
	nav.mobile .gnb>ul>li>ul {display:none;}
	nav.mobile .gnb>ul>li>ul>li {position:relative;}
	nav.mobile .gnb>ul>li>ul>li a {
		display:block; padding:8px 15px 8px 30px; font-size:15px; color:#999; letter-spacing:-.5px; border-bottom:1px solid #f5f5f5;
		/* background:url(../images/common/dot_m.png) no-repeat #fff 30px 22px;  background-size:3px;*/
	}
	nav.mobile .gnb>ul>li>ul>li:last-child a {border-color:#e0e0e0;}
	nav.mobile .gnb>ul>li>ul>li a:hover {color:#4591e0; background-color:#f5f5f5;}
	nav.mobile .gnb>ul>li>ul>li.on a {color:#4591e0;}

	/*footer*/
	footer {clear:both; overflow:hidden; max-width:100%; color:#666; padding:20px 15px; font-weight:normal; background-color:#fff; border-top:5px solid #dce1e7;}
	footer address {position:relative; width:100%; margin:0 auto; font-size:13px; text-align:center;}
	footer address div:first-child {margin-bottom:10px;}
	footer address div:first-child a img {height:25px;}
	footer address div:nth-child(2) span {padding-right:10px; word-break:keep-all;}
	footer address div:last-child {position:static; margin-top:10px;}
	footer address div:last-child a img {width:35px;}

	

	
}



/* ************************ #3.모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {

	/* html {border:3px solid blue;} */
	nav.mobile {width:70%;}
	
	footer address div:nth-child(2) span.moBlock {display:block;}

	
	
}