@charset "utf-8";

/* ************************ 공용 ************************ */
a {text-decoration:none !important; outline:none !important; selector-dummy:expression(this.hideFocus=true) !important; color:inherit;}
a:link {text-decoration:none; color:inherit;}
a:visited {text-decoration:none; color:inherit;}
a:hover {text-decoration:none; color:inherit}
a:active {text-decoration:none; color:inherit;}
a,img,i,button {transition:all .5s ease;	-webkit-transition:all .5s ease; -moz-transition:all .5s ease;}

body {font-family:'NanumSquare', 'NotoSansKR' ,sans-serif !important; font-size:14px; font-weight:400; line-height:1.6; letter-spacing:-.3px; color:#000; word-break:keep-all; }
button {cursor:pointer;}


/* 네이비 색 조정이 많아서 */
.bgNavy {background-color:#323c5b; color:#fff;}
.c_red {color:red;}
.c_acc {color:#323c5b;}

/* lnb 세팅 */
/*.lnb.company {background-image:url(../images/common/subtop_company.jpg);}
.lnb.brand {background-image:url(../images/common/subtop_brand.jpg);}
.lnb.product {background-image:url(../images/common/subtop_product.jpg);}
.lnb.notice {background-image:url(../images/common/subtop_notice.jpg);}
.lnb.qna {background-image:url(../images/common/subtop_qna.jpg);}*/

/* ************************ 데스크탑 (1367~) ************************ */
@media screen and (min-width: 1367px), print {
	html,body { }
	.mobile {display:none !important;}
	
	/*헤더**/
	header {z-index:999; position:absolute; width:100%; top:0; left:0; height:180px; background:ease-gradient(to bottom, rgba(0,0,0,.7), transparent); }
	header .head {max-width:1620px; margin:0 5%; position:relative;}
	header .head h1 {position:absolute; z-index:99999; left:0; top:50px;}
	header .head h1 a {}
	header .head h1 a img {}

	header aside {position:absolute; right:0; top:60px; z-index:999; overflow:hidden;}
	header aside>* {float:left;}
	

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

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

	nav.pc .gnb {padding-left:10%; position:relative; width:100%; max-width:90%; margin:0 5%; letter-spacing:0;}
	nav.pc .gnb a.on {color:#bd0b4a;}
	nav.pc .gnb>ul>li {position:relative; float:left; padding-top:45px;}
	
	nav.pc .gnb>ul>li>a {display:block; color:#fff; font-size:28px; font-weight : 600;}
	nav.pc .gnb>ul>li>a:hover {color:#2145bf!important;} 
	nav.pc .gnb>ul>li>ul {
		position:absolute; top:90px; left:0; width:100% !important;padding:40px 0 60px;
		transition:all .3s ease !important; -webkit-transition:all .3s ease !important; -moz-transition:all .3s ease !important;
	}
	nav.pc.on .gnb>ul>li>ul {top:80px;}
	nav.pc .gnb>ul>li>ul>li a {position: relative;display:block;color: #333!important; letter-spacing:-.5px; font-size : 18px; font-weight : 600; transition : 0.5s;}
	nav.pc .gnb>ul>li>ul>li+li a {margin-top:10px;}
	nav.pc .gnb>ul>li>ul>li a:hover { color :#2145bf!important;  }
	nav.pc .gnb>ul>li>ul>li.on a { color:#2145bf!important; }
	@keyframes wide {
	  from {transform:scaleX(0);}
	  to {transform:scaleX(1);}
	}
	nav.pc .gnb .gnb_switch { position : absolute; right : 0; top : 55px; }
	nav.pc .gnb .gnb_switch img { display : none; }
	nav.pc .gnb .gnb_switch img.on { display : block; }
	nav.pc .gnb .gnb_switch span { display : none;  background : url(../images/common/arrow_home.png) no-repeat center bottom; width : 67px; text-align : right; }
	nav.pc .gnb .gnb_switch span.on { display : block; }


	/*footer*/
	a.gotop { display : block; text-align : center; margin-bottom : 30px; color : #7c829d; font-weight : 600; 
	background : url(../images/common/gotop_arrow.png) no-repeat 50% 4px; padding-top : 20px; transform: rotate(0.03deg);}
	footer {padding:70px 0 70px!important; background : #07175d; letter-spacing:0;}
	footer .footer-wrap { margin : 0 5%; height : 80px;}
	footer .footer-info {float:left!important;;overflow:hidden!important;;}
	footer .footer-info>div {float:left;transform: rotate(0.03deg);}
	footer .footer-logo {}
	footer .footer-logo img {height:30px;}
	footer .footer-address {padding-left:30px; font-weight:400; line-height:1.429; color:#333;}
	footer .footer-address address { color : #fff; margin-bottom : 20px;}
	footer .footer-address address span {padding-right:30px;}
	footer .footer-address p.copy { color : #fff;}
	footer .footer-address p.copy a { color : #fff;}
	footer .footer-contact {float:right; overflow:hidden; }
	footer .footer-contact ul { display : flex; gap : 30px; transform: rotate(0.03deg);}
	footer .footer-contact ul li { padding-left : 10px; position : relative;}
	footer .footer-contact ul li:before { content : ""; display : block; width : 1px; height : 35px; background : rgba(255,255,255,0.3); position : absolute; top : 4px; left : 0; }
	footer .footer-contact ul li span { color : #fff;  }
	footer .footer-contact ul li a { display : block; color : #fff!important;}
	footer .footer-btn>* {float:left;}
	footer a[class *='footer-'] {margin-left:1px; line-height:1; padding:10px 20px; background:#000; text-align:center; display:block; color:#fff; font-size:12px;}
	footer .footer-sns {margin-left:0; overflow:hidden;}
	footer .footer-sns a {margin-left:26px; float:left; width:21px; height:33px; background:center no-repeat;}
	footer .footer-sns a.facebook {background-image:url(../images/common/footer-i-facebook.png)}
	/*22-04-18:스마트스토어 링크추가*/
	footer .footer-sns a.smartstore {background-image:url(../images/common/footer-i-smartstore.png)}
	footer .footer-sns a.blog {background-image:url(../images/common/footer-i-blog.png)}
	footer .footer-sns a.insta {background-image:url(../images/common/footer-i-insta.png)}
	
	/*22-08-16::IE, 모바일 오류로 수정*/
	footer ul.footer-sns {display:flex;}
	footer ul.footer-sns button {background:none; opacity:0;}
	

	/* lnb */
	.lnb {
		position:relative; height:550px; opacity:0;
		/*background-attachment:fixed;*/ background-position:center top; background-repeat:no-repeat; background-size:cover;
	}
	.lnb.on {margin-top:0; opacity:1;}
	.lnb .cover {position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.0); z-index : 2;}
	.lnb.on .cover {background:rgba(0,0,0,0);}
	.lnb-wrap {position:relative; height:100%;}
	.lnb-wrap:after { content : ""; display : block; border-bottom : 1px solid #dfe1e9; width : 100%; position : absolute; bottom : -149px; left : 0; z-index : -1; }
	.lnb-wrap > img { position : absolute; bottom : 0; width : 100%; }
	.lnb-wrap .titwrap { position : absolute; left : 50%; top : 50%; transform : translate(-50%,-50%); z-index : 5;}
	.lnb-wrap .titwrap .tit { font-size:60px; font-weight:800; text-align : center; color : #fff;  }
	.lnb-menu { position:absolute; top : 300px; left : 50%; transform : translate(-50%); width:100%; z-index:99;}
	.lnb-menu.fixOn {position:fixed; top:0; box-shadow:0 5px 10px rgba(0,0,0,.1); background:#fff;}
	.lnb-menu > div { position: relative; max-width: 1400px;
    margin: 0 auto;}
	.lnb-menu div p { color:#fff; font-size:60px; font-weight:800; text-align : center; }
	.lnb-menu div p.on {position:absolute; top:50%; transform:translateY(-50%); color:#2145bf; font-size:26px; line-height:1;}
	.lnb-menu div ul { display : flex; justify-content : center; gap : 20px; margin-top : 20px; }
	.lnb-menu.fixOn div ul { margin-top : 0;}
	.lnb-menu div a.lnb_gotop { display : none; text-align : center; top:50%; transform:translateY(-50%); color : #7c829d; font-weight : 400; background : url(../images/common/gotop_arrow.png) no-repeat 0 7px; padding : 0 20px; position: absolute;
    right: 0; } 
	.lnb-menu.fixOn div a.lnb_gotop { display : block; }
	.lnb-menu div ul li {}
	.lnb-menu div ul li+li:before {content:''; display:none; width:1px; height:12px; background:#b2b2b2; position:absolute; left:0; top:0;}
	.lnb-menu div ul li a {padding: 25px 50px; line-height:1; display:block; background : #fff; color : #000; border-radius : 10px; font-size : 18px; font-weight : 600; }
	.lnb-menu div ul li.on a {background : #2145bf; color : #fff; border : 1px solid #5479f6;}
	.lnb-menu.fixOn div ul li a { border-radius : 0;}
	.lnb .site_loca { display : flex; justify-content : space-between; padding-top : 100px;} 
	/*.lnb .site_loca:after { content : ""; display : block; border-bottom : 1px solid #dfe1e9; width : 100%; position : absolute; bottom : -149px; left : 0; z-index : -1; }*/
	.lnb .site_loca p { font-size : 24px; font-weight : 800; color : #2145bf; padding-bottom : 10px; border-bottom : 1px solid #2145bf;}
	.lnb .site_loca ul { display : flex; position : relative; margin-top : 5px; }
	.lnb .site_loca ul:before { content : ""; display : block; width : 13px; height : 12px; background : url(../images/common/i-home.png) no-repeat; position : absolute; left : -20px; top : 4px; }
	.lnb .site_loca ul li { font-size : 14px; color : #7b8190; font-weight : 500; position : relative; transform: rotate(0.03deg);}
	.lnb .site_loca ul li:nth-child(1) { margin-right : 35px;  }
	.lnb .site_loca ul li:nth-child(1):after { content : ""; display : block; width : 6px; height : 10px; position : absolute; background : url(../images/common/site_arrow.png) no-repeat; right : -21px; top : 6px; }
	
	/*컨텐츠*/
	.contents {}
	.contents .wrapper {max-width:1400px; padding:240px 0 130px; margin:0 auto; width:100%;}
	.contents .wrapper.assembly { max-width : 100%; padding : 0; }
	.contents .wrapper.assembly.part1 { padding-top : 240px; }
	.contents .wrapper.assembly > div { max-width : 1400px; margin : 0 auto ; }
	.contents h2 {font-size:50px; font-weight:800; letter-spacing:-1px; line-height:1.2; margin-bottom:55px; color:#000;}
	.w1400 {max-width:1400px; margin:0 auto; width : 100%; }
	.w1620 {max-width:1620px; margin:0 auto; width : 100%; }

}


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

	.pc {display:none !important;}

	/*헤더*/
	header {position:absolute; left:0; top:0; width:100%; z-index:999; height:60px; background:ease-gradient(to bottom, rgba(0,0,0,.7), transparent);}
	header .head {}
	header .head .gnbView {position:absolute; right:0; top:0; width:60px; height:60px; background:url(../images/common/icon_gnbView.png)center /22px no-repeat ;}
	header .head .gnbView img {}
	header .head h1 {}
	header .head h1 a {height:60px; display:flex; align-items:center; padding-left:20px;}
	header .head h1 a img {height:30px;}


	/*gnb*/
	nav.mobile {z-index:9999; position:fixed; top:0; width:50%; min-width:320px; height:100%; overflow:hidden; box-shadow:0 !important; background:#fff;}
	nav.mobile .closeWrap {position:relative; height:60px;border-bottom: 1px solid rgba(0,0,0,.15); overflow:hidden;}
	nav.mobile .closeWrap .gnbClose {display:block; width:60px; height:60px; background:url(../images/common/icon_close.png)center no-repeat; background-size:20px; border-left:1px solid rgba(0,0,0,.15); float:right;}
	nav.mobile .closeWrap .link {float:left; padding:0 20px;line-height:60px; font-size:12px;}
	nav.mobile .closeWrap .link+.link {padding-left: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; border-bottom:1px solid #e5e5e5;}
	nav.mobile .gnb>ul>li>a {display:block; padding:20px; font-size:17px;}
	nav.mobile .gnb>ul>li.on {border-color:#2145bf;}
	nav.mobile .gnb>ul>li.on>a {background:#2145bf; color:#fff;}
	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:15px 40px; font-size:15px; color:#000; 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:#2145bf; }
	nav.mobile .gnb>ul>li>ul>li.on:after { content: ""; display: block; height: 2px; width: 6px; background: #2145bf; position: absolute; left: 23px; top: 25px; }
	nav.mobile .gnb>.side {display:none;}


	/*footer*/
	footer {padding:60px 20px; text-align:center; background : #07175d;}
	footer .footer-btn>a {line-height:1; padding:10px 20px; background:#fff; text-align:center; display:inline-block; color:#fff; font-size:12px;}
	footer .footer-wrap {}
	footer .footer-info {overflow:hidden;}
	footer .footer-info>div {}
	footer .footer-logo {padding-bottom:20px;}
	footer .footer-logo img {height:30px;}
	footer .footer-address {padding-left:0px; font-weight:300; line-height:1.429; color:#fff;}
	footer .footer-address address span {display:inline-block; padding:0 10px; color:#fff;}
	footer .footer-contact ul { margin-top : 15px;}
	footer .footer-contact ul li span { color : #fff; margin-right : 20px;  }
	footer .footer-contact ul li a { display : inline-block; color : #fff;}
	
	

	/*22-08-16::IE, 모바일 오류로 수정*/
	footer ul.footer-sns {display:flex; justify-content: center;}
	footer ul.footer-sns button {background:none; opacity:0;}

	/* lnb */
	.lnb {
		position:relative; height:30vh; opacity:0;
		background-position:center; background-repeat:no-repeat; background-size:cover;
	}
	.lnb.on {margin-top:0; opacity:1;}
	.lnb .cover {position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(0,0,0,.0); }
	.lnb.on .cover {background:rgba(0,0,0,0); z-index : 2; }
	.lnb-wrap {position:relative; height:100%;}
	.lnb-wrap > img { position: absolute; bottom: 0; width: 100%; width: 100%; height: 100%; object-fit: cover; }
	.lnb-wrap .titwrap {position:absolute; width:100%; bottom:7vh; font-weight:500; color:#fff; text-align:center;}
	.lnb-wrap .titwrap .tit {font-size:22px; letter-spacing:-1px; }
	.lnb-wrap .titwrap p {font-size:14px;}
	.lnb .site_loca { display : flex; justify-content : flex-end; padding : 10px 30px;} 
	.lnb .site_loca:after { content : ""; display : none; border-bottom : 1px solid #dfe1e9; width : 100%; position : absolute; bottom : -149px; left : 0; z-index : -1; }
	.lnb .site_loca p { position: absolute; font-size: 36px;
    font-weight: 800; color: #fff; padding-bottom: 10px;
    border-bottom: none; top: 41%; left: 50%;
    transform: translateX(-50%); z-index : 5; width:100%; text-align:center;}
	.lnb .site_loca ul { display : flex; position : relative; margin-top : 5px; }
	.lnb .site_loca ul:before { content : ""; display : block; width : 13px; height : 12px; background : url(../images/common/i-home.png) no-repeat; position : absolute; left : -20px; top : 4px; }
	.lnb .site_loca ul li { font-size : 14px; color : #7b8190; font-weight : 500; position : relative; }
	.lnb .site_loca ul li:nth-child(1) { margin-right : 35px;  }
	.lnb .site_loca ul li:nth-child(1):after { content : ""; display : block; width : 6px; height : 10px; position : absolute; background : url(../images/common/site_arrow.png) no-repeat; right : -21px; top : 6px; }

	/*컨텐츠*/
	.contents {position:relative;}
	.contents .wrapper {width:100%; padding:80px 30px 60px;}
	.contents .wrapper.technology { padding:80px 0 60px;}
	.contents h2 {font-size:36px; font-weight:800; letter-spacing:-1px; line-height:1.2; margin-bottom:30px; color:#000;}

	a.gotop { display : block; text-align : center; margin-bottom : 30px; color : #7c829d; font-weight : 600; 
	background : url(../images/common/gotop_arrow.png) no-repeat 50% 4px; padding-top : 20px; }
	
	
	


}


/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width: 767px) {
	.lnb { height : 25vh; }
	.contents .wrapper {width:100%; padding:80px 30px 50px;}
	.contents h2 {font-size:26px; font-weight:800; letter-spacing:-1px; line-height:1.2; margin-bottom:30px; color:#000;}
	
	.lnb .site_loca p { font-size: 26px; width: 100%; text-align: center; }
	
	footer {padding:40px 20px; text-align:center; background : #07175d;}






}