@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:#000;}
a:visited {text-decoration:none; color:#000;}
a:hover {text-decoration:none; color:#000000}
a:active {text-decoration:none; color:#000;}
a,img,i {transition:all .1s linear;	-webkit-transition:all .1s linear; -moz-transition:all .1s linear;}
			
body {font-family:'Montserrat', 'NotoSansKR', sans-serif!important; font-size:16px; font-weight:400; line-height:1.8; letter-spacing:-.5px; color:#666; word-break:keep-all;}
/* #gotop {z-index:2000; position:fixed; display:none; width:35px; height:35px; right:20px; border-radius:3px; bottom:40px;} */

/* 컨텐츠 */
.contents img {max-width:100%; height:auto;}


/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {

	html,body {}
	.mobile {display:none !important;}

	/*헤더**/
	header {z-index:999; position:absolute; width:100%; top:0;}
	header .head {position:relative; margin:0;}
	header .headBg {position:absolute; width:100%; height:100px;}

	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {z-idex:99; visibility:hidden; position:absolute; display:block; width:100%; overflow:hidden;border-bottom: 1px solid rgba(255,255,255,.33);}
	nav.pc:hover {border-bottom:0;/*box-shadow:0px 5px 5px rgba(0,0,0,.08) !important;*/}
	nav.pc .navbg {opacity:0;
		transition:all .1s linear !important;
		-webkit-transition:all .1s linear !important;
		-moz-transition:all .1s linear !important;
	}
	nav.pc .navbg.on {opacity:1;background: rgba(0,0,0,.7);box-shadow:none;}
	/*nav.pc:hover .navbg .dep1 {border-bottom:1px solid #e1e1e1}*/
	nav.pc .navbg {position:absolute; left:0; top:0; width:100%; height:100%;}
	nav.pc .navbg .dep1 {z-index:1200; position:absolute; width:100%; height:100px;}
	nav.pc .navbg .dep2 {z-index:1100; position:absolute; height:100%; background-color:#fff;}

	nav.pc .wrap {z-index:1300; position:relative; display:block; max-width:1400px; height:100px; margin:0 auto;}

	nav.pc .gnb {position:relative; display:inline-block; max-width:1400px; width:100%;text-align: center;height: 100px;}
	nav.pc .gnb a.on {color:#bd0b4a;}
	nav.pc .gnb a:hover,nav .navWrap a:focus {color:#fff;}
	nav.pc .gnb>ul {margin:0 !important;display:inline-block;}
	nav.pc .gnb>ul>li {position:relative; float:left;}
	nav.pc .gnb>ul>li:last-child {padding-right:0 !important;}
	nav.pc .gnb>ul>li:nth-child(6) {padding-right:60px !important}
	nav.pc .gnb>ul>li>a {display:block; width:100%; height:100px;line-height:100px;font-size:20px; font-weight:400; color:#fff; letter-spacing:-1px;color:#fff;}
	nav.pc .gnb>ul>li.on>a {color:#fff;}
	nav.pc .gnb>ul>li>a:hover {color:#fff;}
	nav.pc .gnb>ul>li>ul {position:absolute; top:100px; left:0; width:100% !important;padding:10px 0;}
	nav.pc .gnb>ul>li>ul>li a {position: relative;display: inline-block;color: #fff;font-size:15px;margin: 7px 0;padding: 3px 0;line-height: 1;font-weight: 400;opacity:.8}
	nav.pc .gnb>ul>li>ul>li a:hover {color:#fff;opacity:1;}
	/*nav.pc .gnb>ul>li>ul>li a:hover:after {position:absolute; left:0; bottom:0; content:''; display:inline-block; width:100%; height:1px; background:#fff}*/
	nav.pc .gnb>ul>li>ul>li.on a {color:#b4d9ff;opacity:1;}
	/*nav.pc .gnb>ul>li>ul>li.on a:after {position:absolute; left:0; bottom:0; content:''; display:inline-block; width:100%; height:1px; background:#fff}*/
	nav.pc .gnb>ul>li:hover ul:before{position:absolute;top:-2px;left:50%;margin-left:-50px;width:100px;transform:scaleX(1);height:1.5px;background:#1f84ea;content:'';animation:wide .5s;}
	
	@keyframes wide {
	  from {transform:scaleX(0);}
	  to {transform:scaleX(1);}
	}
	
	nav.pc .gnb>ul>li>ul.sub01{left:-37px;}
	nav.pc .gnb>ul>li>ul.sub02{left:-36px;}
	nav.pc .gnb>ul>li>ul.sub03{left:-35px;}
	nav.pc .gnb>ul>li>ul.sub04{left:2px;}

	nav.pc .gnb .btn_logo {position:absolute;top:50%;margin-top:-20.5px;}
	nav.pc .gnb .btn_logo a {display:block;}
	nav.pc .gnb .btn_logo ul {top:100px !important; padding-left:0; left:0;}
	nav.pc .gnb .btn_sitemap{position: absolute;right: 0;top:50%;margin-top:-14px;}
	nav.pc .gnb .btn_sitemap a {}

	nav.pc .gnb .side {position:absolute; right:0; top:0; font-size:12px; line-height:1; height:50px; border-left:1px solid rgba(255,255,255,.2);}
	nav.pc .gnb .side li {float:left;}
	nav.pc .gnb .side li a {display:block; font-size:12px; font-family:"Abel"; color:#fff; letter-spacing:0; border-bottom:2px solid transparent; padding-left:25px; margin-top:35px;}
	nav.pc .gnb .side li a.i_eng {background:url(../images/main/eng.jpg)no-repeat 0; background-size:20px; image-rendering:-webkit-optimize-contrast;}
	nav.pc .gnb .side li:first-child a {margin-left:30px;}
	nav.pc .gnb .side li a:hover {color:#0dd1ac;}
	
	nav.pc:hover .gnb{border-bottom: 1px solid rgba(255,255,255,.31);}

	/* 서브페이지 일때 */
	header.on nav.pc .navbg .dep1  {background:#fff}

	/*footer*/
	footer{background:#414141;padding:60px 20px!important;text-align:center;font-weight:400}
	footer .ft_logo{display:block;margin:0 auto 30px;}
	footer .ft_logo img{opacity: .3;}
	footer address{letter-spacing: -.3px;font-size:14px;color:#fff;line-height: 2;}
	footer address span{position:relative;padding-left:12px;margin-left:9px;}
	footer address span:before{content: '';position: absolute;top: 3px;left: 0;width: 1px;height: 12px;background: #fff;opacity:.7}
	footer address span.left_none{margin-left:0;padding-left:0;}
	footer address span.left_none:before{display:none;}
	footer .copy{margin-top:20px;}
	footer .copy p{color: #d2d2d2;font-size:14px;}

	/* 서브 비주얼 */
	.s_visual{position: relative;height:408px;background:url(../images/sub/bg_sv.jpg) no-repeat 50%;}
	.s_visual .s_copy{max-width: 1400px;margin: 0 auto;padding: 180px 0px 0;}
	.s_visual .s_copy .big{line-height: 1.15;color:#fff;font-size:52px;text-shadow: 3px 2px 7px rgba(0,0,0,.16);margin-bottom:35px;}
	.s_visual .s_copy .big small{display:Block;font-size:42px;font-weight:400;}
	.s_visual .s_copy .navi{}
	.s_visual .s_copy .navi:after{content:'';display:Block;clear:both;}
	.s_visual .s_copy .navi>li{float: left;font-size: 15px;color: #fff;padding-left: 27px;margin-left: 13px;background: url(../images/sub/ico_arrow.png) no-repeat 0px 50%;line-height: 1;font-weight:400}
	.s_visual .s_copy .navi>li.home{margin-left:0;padding-left:0;background:none;}
	.s_visual .s_copy .navi>li.home img{vertical-align: text-top;}
		
	/* 서브메뉴 */
	.lnb{background:#f7f7f7;height:62px;}
	.lnb .lnb_wrap{max-width:1400px;margin:0 auto;}
	.lnb .lnb_wrap>ul:after{content:'';display:block;clear:both;}

	.lnb .lnb_wrap>ul.sub01>li{width:33.33%;}
	.lnb .lnb_wrap>ul.sub02>li{width:20%;}
	.lnb .lnb_wrap>ul.sub03>li{width:100%;}
	.lnb .lnb_wrap>ul.sub04>li{width:33.33%;}

	.lnb .lnb_wrap>ul>li{float:left;}
	.lnb .lnb_wrap>ul>li>a{height:100%;line-height:62px;display:block;text-align:center;color:#000;font-size:19px;word-spacing: -1px;}
	.lnb .lnb_wrap>ul>li.on>a{background:#fff;color:#145eaa;font-weight:bold;}
		
	/* 컨텐츠 영역 */
	.contentsWrap {padding:70px 20px 100px;}
	.contentsWrap .titleWrap{text-align:center;background: url(../images/sub/sub_title_bg.png) no-repeat 50% 100%;padding-bottom: 37px;line-height: 1;margin-bottom:60px;}
	.contentsWrap .titleWrap h2{font-size:35px;color:#000;font-weight: 600;letter-spacing: -2px;text-transform:uppercase;}
	.contentsWrap .contents_wrap {max-width:1400px;margin:0 auto;}

}




/* ************************ pc이하 태블릿 이상(992~1420) ************************ */
@media (min-width: 992px) and (max-width:1420px) {
	
	
	html,body {}
	.mobile {display:none !important;}

	/*헤더**/
	header {z-index:999; position:absolute; width:100%; top:0;}
	header .head {position:relative; margin:0;}
	header .headBg {position:absolute; width:100%; height:100px;border-bottom: 1px solid rgba(255,255,255,.33);}

	/*gnb*/
	nav.mobile {visibility:hidden;}
	nav.pc {z-idex:99; visibility:hidden; position:absolute; display:block; width:100%; overflow:hidden;}
	nav.pc:hover {border-bottom: 1px solid rgba(255,255,255,.2);/*box-shadow:0px 5px 5px rgba(0,0,0,.08) !important;*/}
	nav.pc .navbg {opacity:0;
		transition:all .1s linear !important;
		-webkit-transition:all .1s linear !important;
		-moz-transition:all .1s linear !important;
	}
	nav.pc .navbg.on {opacity:1;background: rgba(0,0,0,.7);box-shadow:none;}
	/*nav.pc:hover .navbg .dep1 {border-bottom:1px solid #e1e1e1}*/
	nav.pc .navbg {position:absolute; left:0; top:0; width:100%; height:100%;}
	nav.pc .navbg .dep1 {z-index:1200; position:absolute; width:100%; height:100px;}
	nav.pc .navbg .dep2 {z-index:1100; position:absolute; height:100%; background-color:#fff;}

	nav.pc .wrap {padding:0 20px;}

	nav.pc .gnb {position:relative; display:inline-block; max-width:1400px; width:100%;text-align: center;height: 100px;}
	nav.pc .gnb a.on {color:#bd0b4a;}
	nav.pc .gnb a:hover,nav .navWrap a:focus {color:#fff;}
	nav.pc .gnb>ul {margin:0 !important;display:inline-block;}
	nav.pc .gnb>ul>li {position:relative; float:left;}
	nav.pc .gnb>ul>li:last-child {padding-right:0 !important;}
	nav.pc .gnb>ul>li:nth-child(6) {padding-right:60px !important}
	nav.pc .gnb>ul>li>a {display:block; width:100%; height:100px;line-height:100px;font-size:20px; font-weight:400; color:#fff; letter-spacing:-1px;color:#fff;}
	nav.pc .gnb>ul>li.on>a {color:#fff;}
	nav.pc .gnb>ul>li>a:hover {color:#fff;}
	nav.pc .gnb>ul>li>ul {position:absolute; top:100px; left:0; width:100% !important;padding:10px 0;}
	nav.pc .gnb>ul>li>ul>li a {position: relative;display: inline-block;color: #fff;font-size: 15px;margin: 7px 0;padding: 3px 0;line-height: 1;font-weight: 400;opacity: .8;}
	nav.pc .gnb>ul>li>ul>li a:hover {color:#fff;opacity:1;}
	nav.pc .gnb>ul>li>ul>li.on a {color: #b4d9ff;opacity:1;}
	
	nav.pc .gnb>ul>li>ul.sub01{left:-34px;}
	nav.pc .gnb>ul>li>ul.sub02{left:-34px;}
	nav.pc .gnb>ul>li>ul.sub03{left:-37px;}
	nav.pc .gnb>ul>li>ul.sub04{left:0;}

	nav.pc .gnb .btn_logo {position:absolute;top:50%;margin-top:-20.5px;}
	nav.pc .gnb .btn_logo a {display:block;}
	nav.pc .gnb .btn_logo ul {top:100px !important; padding-left:0; left:0;}
	nav.pc .gnb .btn_sitemap{position: absolute;right: 0;top:50%;margin-top:-14px;}
	nav.pc .gnb .btn_sitemap a {}

	nav.pc .gnb .side {position:absolute; right:0; top:0; font-size:12px; line-height:1; height:50px; border-left:1px solid rgba(255,255,255,.2);}
	nav.pc .gnb .side li {float:left;}
	nav.pc .gnb .side li a {display:block; font-size:12px; font-family:"Abel"; color:#fff; letter-spacing:0; border-bottom:2px solid transparent; padding-left:25px; margin-top:35px;}
	nav.pc .gnb .side li a.i_eng {background:url(../images/main/eng.jpg)no-repeat 0; background-size:20px; image-rendering:-webkit-optimize-contrast;}
	nav.pc .gnb .side li:first-child a {margin-left:30px;}
	nav.pc .gnb .side li a:hover {color:#0dd1ac;}


	/* 서브페이지 일때 */
	header.on nav.pc .navbg .dep1  {background:#fff}


	/* 서브 비주얼 */
	.s_visual{padding:0 20px;height:350px;background-size:cover!important;}
	.s_visual .s_copy{padding-top:165px}
	.s_visual .s_copy .big{font-size:42px;text-shadow: 3px 2px 7px rgba(0,0,0,.16);margin-bottom:30px;}
	.s_visual .s_copy .big small{font-size:32px;}
	
	/* 컨텐츠 영역 */
	.contentsWrap .titleWrap h2{font-size:30px;text-transform:uppercase;}
}



/* ************************ 태블릿 이하(~991) ************************ */
@media screen and (max-width: 991px) {

	html,body {font-size:16px;font-family:'Montserrat', 'NotoSansKR', sans-serif;}	
	.pc {display:none !important;}
	
	/* body {border:10px solid yellow;} */

	/*헤더*/
	header {z-index:999; width:100%; left:0; top:0;}
	header .head {z-index:100; position:absolute; left:0; top:0; width:100%; height:60px; overflow:hidden; line-height:1;border-bottom:1px solid rgba(255,255,255,.3)}
	header .head .gnbView {display:block; float:right; width:60px; height:60px; background:url(../images/common/ico_menu.png)no-repeat center; border-left:1px solid rgba(255,255,255,.3)}
	header .head .gnbView img {height:15px;}
	header .head h1 {float:left; margin:0 !important; display:block;}
	header .head h1 a {display:inline-block; padding:17px 0 0 20px; text-align:center;}
	header .head h1 a img {display:block; height:28px; font-size:0; line-height:0;}
	
	
	/*gnb*/
	nav.mobile {z-index:9999; position:fixed; top:0; width:50%; height:100%; overflow:hidden; box-shadow:0 !important;    background: #145eaa;}
	nav.mobile .closeWrap {position:relative; height:60px;color:#fff;border-bottom: 1px solid rgba(255,255,255,.3);}
	nav.mobile .closeWrap .gnbClose {display:block; width:60px; height:60px; background:url(../images/common/i-close.png) no-repeat center; background-size:20px; border-left:1px solid rgba(255,255,255,.3); float:right;}
	nav.mobile .closeWrap .link {position:absolute; display:block; top:0; left:0; padding:0 20px;line-height:60px;color:#fff; font-size:20px;letter-spacing:0;}
	.gnbCover {z-index:9998; position:fixed; left:0; top:0; display:none; width:100%; height:100%; background:rgba(0,0,0,.5);}

	nav.mobile .gnb {position:relative; width:100%; height:100%; overflow-y:auto; text-align:left !important;}
	nav.mobile .gnb * {width:100% !important;}
	nav.mobile .gnb .home {display:block; width:100%; background-color:#f0f0f0; padding:12px 20px; border-bottom:1px solid #333;}
	nav.mobile .gnb>ul>li {clear:both; position:relative; font-weight:400;}
	nav.mobile .gnb>ul>li>a {display:block; padding:12px 20px;font-size:17px; color:#fff;opacity:.5;letter-spacing: -1px;font-weight:400;}
	nav.mobile .gnb>ul>li>a:hover {color:#fff;opacity:1;}
	nav.mobile .gnb>ul>li.on>a {color:#fff;opacity:1;}
	nav.mobile .gnb>ul>li>ul {display:none;}
	nav.mobile .gnb>ul>li>ul>li {position:relative;border-top: 1px solid #eee;}
	nav.mobile .gnb>ul>li>ul>li a {display:block; padding:8px 30px; font-size:15px; color:#888; letter-spacing:-.8px;background:#fff;}
	nav.mobile .gnb>ul>li>ul>li:last-child a {border-color:#e0e0e0;}
	nav.mobile .gnb>ul>li>ul>li a:hover {color:#000; background-color:#f5f5f5;}
	nav.mobile .gnb>ul>li>ul>li.on a {color:#v;}
	nav.mobile .gnb>.side {display:none;}

	/* footer */
	footer{background:#414141;padding:40px 20px!important;text-align:center;font-weight:400}
	footer .ft_logo{display:block;margin:0 auto 20px;}
	footer .ft_logo img{opacity: .3;}
	footer address{letter-spacing: -.3px;font-size:13px;color:#fff;line-height: 2;}
	footer address span{position:relative;padding-left:12px;margin-left:9px;}
	footer address span:before{content: '';position: absolute;top:3px;left: 0;width: 1px;height: 11px;background: #fff;opacity:.7}
	footer address span.left_none{margin-left:0;padding-left:0;}
	footer address span.left_none:before{display:none;}
	footer .copy{margin-top:20px;}
	footer .copy p{color: #d2d2d2;font-size:13px;}
	
	/* 서브 비주얼 */
	.s_visual{padding:0 20px;height:260px;position: relative;background:url(../images/sub/bg_sv.jpg) no-repeat 50%;background-size:cover!important;}
	.s_visual .s_copy{max-width: 1400px;margin: 0 auto;padding:107px 0px 0;}
	.s_visual .s_copy .big{line-height: 1.2;color:#fff;font-size:30px;text-shadow: 3px 2px 7px rgba(0,0,0,.16);margin-bottom:28px;}
	.s_visual .s_copy .big small{display:Block;font-size:25px;font-weight:400;}
	.s_visual .s_copy .navi{}
	.s_visual .s_copy .navi:after{content:'';display:Block;clear:both;}
	.s_visual .s_copy .navi>li{float: left;font-size:13px;color: #fff;padding-left: 27px;margin-left: 13px;background: url(../images/sub/ico_arrow.png) no-repeat 0px 50%;line-height: 14px;font-weight:400}
	.s_visual .s_copy .navi>li.home{margin-left:0;padding-left:0;background:none;}
	.s_visual .s_copy .navi>li.home img{vertical-align: baseline;}
	
	/* 서브메뉴 */
	.lnb{background:#f7f7f7;height:50px;}
	.lnb .lnb_wrap>ul:after{content:'';display:block;clear:both;}

	.lnb .lnb_wrap>ul.sub01>li{width:33.33%;}
	.lnb .lnb_wrap>ul.sub02>li{width:20%;}
	.lnb .lnb_wrap>ul.sub03>li{width:100%;}
	.lnb .lnb_wrap>ul.sub04>li{width:33.33%;}

	.lnb .lnb_wrap>ul>li{float:left;}
	.lnb .lnb_wrap>ul>li>a{height:100%;line-height:50px;display:block;text-align:center;color:#000;font-size:14px;letter-spacing:-.8px;font-weight: 400;}
	.lnb .lnb_wrap>ul>li.on>a{background:#fff;color:#145eaa;font-weight:bold;}

	/* 컨텐츠 영역 */
	.contentsWrap {padding:50px 20px 100px;}
	.contentsWrap .titleWrap{ text-align: center;background: url(../images/sub/sub_title_bg.png) no-repeat 50% 100%;padding-bottom:20px;line-height: 1;margin-bottom: 30px;background-size: 38px;}
	.contentsWrap .titleWrap h2{font-size:26px;color:#000;font-weight: 600;letter-spacing: -2px;text-transform:uppercase;}
	.contentsWrap .contents_wrap{max-width:1400px;margin:0 auto;}

}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	
	html,body {/* font-size:15px; */font-family:'Montserrat', 'NotoSansKR', sans-serif;}	
	nav.mobile {width:70%;}
	
	/*하단*/
	footer{padding:30px 20px!important;}
	footer address{font-size: 13px;}
	footer address a{color:#fff}
	footer address span{line-height:1.6;display:block;margin:0;padding:0;}
	footer address span:before{display:none;}
	footer address br{display:none;}
	footer .copy{margin-top:10px;}
	footer .copy p{font-size:13px;}
	
	/*컨텐츠*/
	.contentsWrap {padding:30px 20px 60px;}
	.contentsWrap .titleWrap h2 {font-size:24px; font-weight:700;}
	.contentsWrap .titleWrap span {position:relative; display:inline-block; color:#666; padding-top:18px; line-height:1.5; vertical-align:bottom}
	.contentsWrap .titleWrap span:before {position:absolute; left:0; top:0; content:''; display:inline-block; width:25px; height:2px; background:#000}
	.contentsWrap .sub-section {margin-top:30px;}
	.contentsWrap .sub-title {font-size:24px; margin-bottom:20px;}

	/* 서브 비주얼 */
	.sub_visual {height:100px;}
	
	/* 서브메뉴 */
	.lnb{display:none;}
	
	
}