@charset "utf-8";

/*
html {overflow: hidden; height: 100%;}
body {overflow: auto; height: 100%;}
*/

/* ******************** 공용 ******************** */
:root {
	--c_blue:#054477;
	--font_noto:'NotoSansKR';
	--ani_time:.2s;
}


body {font-family:'NotoSansKR' !important; font-size:16px; font-weight:400; line-height:1.8; color:#666; word-break:keep-all;}
body * {box-sizing:border-box;}

a {color:inherit; transition:all var(--ani_time) ease !important; -webkit-transition:all var(--ani_time) ease !important; -moz-transition:all var(--ani_time) ease !important;}
/* 색상 */
.c_acc {color:var(--c_blue) !important;} /* 초록 강조용 */
.c_green {color:#547c49 !important;} /* 녹색 강조용 */
.c_orange {color:#ec8322 !important;} /* 주황 강조용 */
.c_blue {color:#3d5d8a !important;} /* 파랑 강조용 */
.c_puple {color:#505782 !important;} /* 보랑 강조용 */
.c_beige {color:#f6f2d9 !important;} /* 상아 강조용 */
.c_red {color:#f00 !important;}

/* 폼 */
:focus {outline:0;}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

input {}
select {
	 -webkit-appearance:none; /* 크롬 화살표 없애기 */
    -moz-appearance:none; /* 파이어폭스 화살표 없애기 */
    appearance:none; /* 화살표 없애기 */
	padding:0 12px; line-height:48px; height:50px; border:1px solid #e5e5e5; cursor:pointer; background:url(../images/common/select-arrow.svg)calc(100% - 10px) 50% /auto no-repeat;
}
textarea {padding:0 12px; line-height:48px; height:50px; border:1px solid #e5e5e5;resize:none; width:100%; min-height:120px;}
input[type="text"] {padding:0 12px; line-height:48px; height:50px; border:1px solid #e5e5e5;}
input[readonly] {background-color:#f1f1f1; border:1px solid transparent;}
button {cursor:pointer; background:transparent; padding:0;}

.tableWrap {}
.tableWrap table {}

.tableWrap.type1 {}
.tableWrap.type1 table {text-align:center;border-left:1px solid #e5e5e5; border-top:1px solid #e5e5e5;}
.tableWrap.type1 thead {}
.tableWrap.type1 table tr {}
.tableWrap.type1 table tr>* {padding:7px 12px; border-right:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5;}
.tableWrap.type1 tbody {}
.tableWrap.type1 tbody tr {}
.tableWrap.type1 table th {background:#f9f9f9; color:#000; font-weight:500;}
.tableWrap.type1 table td {}

.tableWrap.type2 {border-top:1px solid #000;}
.tableWrap.type2 tr {}
.tableWrap.type2 tr>* {padding:12px 20px; border-bottom:1px solid #e5e5e5; font-weight:400;}
.tableWrap.type2 tr th {color:#000; text-align:left;}
.tableWrap.type2 tr td {}

.lnb.intro {background-image:url(../images/common/bg-intro.jpg)}
.lnb.product {background-image:url(../images/common/bg-product.jpg)}
.lnb.manual {background-image:url(../images/common/bg-manual.jpg)}
.lnb.customer {background-image:url(../images/common/bg-customer.jpg)}
.lnb.payment {background-image:url(../images/common/bg-payment.jpg)}

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

	.mobile {display:none !important}
	.w1200 { width:1200px; max-width:100%; margin:0 auto;}
	
	#google_translate_element {position:absolute; left:0; display:flex; align-items:center; height:100px;}

	header {position:absolute; left:0; top:0; width:100%; z-index:999999; min-width:1400px; transition:all var(--ani_time);}
	header:hover { background:#fff;}
	header .head {height:100px; position:relative;}
	header .head .logo {position:absolute; left:50%; transform:translateX(-50%);}
	header .head .logo a {font-size:48px; color:var(--c_blue); font-style:italic; display:flex; height:100px; align-items:center;}
	
	header aside {float:right;}
	header aside .asideWrap {display:flex; height:100px; align-items:center; position:relative;}
	header aside .asideWrap a {display:block; padding-left:27px; margin-left:20px; color:#999;}
	header aside .asideWrap a.youtube {background:url(../images/common/i-video.svg)0 center no-repeat;}
	header aside .asideWrap a.mail {background:url(../images/common/i-mail.svg)0 center no-repeat;}
	header aside .asideWrap a.skype {background:url(../images/common/i-skype.svg)0 center no-repeat;}
	
	.headerH {height:160px;}
	
	nav.pc {overflow:hidden; position:relative; width:100%;}
	nav.pc .gnb {}
	nav.pc .gnb>ul {padding-left:40px;}
	nav.pc .gnb>ul:after {clear:both; content:''; display:block;}
	nav.pc .gnb>ul>li {float:left;}
	nav.pc .gnb>ul>li:last-child {padding-right:35px !important}

	/* 1차 */
	nav.pc .gnb a:before, nav.pc .gnb a:after {
		transition:all var(--ani_time) ease !important;
		-webkit-transition:all var(--ani_time) ease !important;
		-moz-transition:all var(--ani_time) ease !important;
	}
	nav.pc .gnb>ul>li>a {border-bottom:1px solid transparent; padding:20px 0 9px; position:relative; display:block; font-size:16px; line-height:1; color:#000;}
	nav.pc .gnb>ul>li>a:before {content:""; position:absolute; left:0; bottom:-15px; width:0%; height:2px; background-color:var(--c_blue); opacity:0;}
	nav.pc .gnb>ul>li.on>a:before {width:calc(100% - 1px); opacity:1;}
	nav.pc .gnb>ul>li.on>a {color:var(--c_blue);}

	/* 2차 */
	nav.pc .gnb>ul>li>ul {position:absolute; top:55px; padding-top:25px;}
	nav.pc .gnb>ul>li>ul>li+li {margin-top:5px;}
	nav.pc .gnb>ul>li>ul>li a {font-size:15px; display:block;}
	nav.pc .gnb>ul>li>ul>li:hover a,
	nav.pc .gnb>ul>li>ul>li.on a {color:var(--c_blue);}

	nav.pc .navbg {position:absolute; left:0; top:0; width:100%;}
	nav.pc .navbg .dep1 {height:60px; border-top:1px solid rgba(0,0,0,.1); border-bottom:1px solid rgba(0,0,0,.1);}
	nav.pc .navbg .dep2 {position:absolute; left:0; top:60px;}


	/* ****** lnb ******* */
	.lnb {background:center /cover no-repeat;height:200px; position:relative;}
	.lnb:before {content:'';display:block; background:rgba(0,0,0,.3); position:absolute; left:0; top:0; width:100%; height:100%;}
	.lnb-tit {display:flex;height:200px;  justify-content:center; align-items:center; position:relative;}
	.lnb-tit h2 {color:#fff; font-size:30px;}
	.lnb-wrap {background:#fff; position:absolute; left:0; top:100%; width:100%; border-bottom:1px solid #e5e5e5; z-index:9;}
	.lnb-wrap.fixOn {position:fixed;top:0;box-shadow:0 5px 5px rgba(0,0,0,.1);}
	.lnb-menu {display:flex; height:60px;}
	.lnb-menu>* {}
	.lnb-menu a.home {width:60px; height:100%; background:var(--c_blue) url(../images/common/i-home.svg)center no-repeat; display:block;}
	.lnb-menu div {width:300px; height:60px;border-right:1px solid #e5e5e5;background:url(../images/common/i-selectArrow)calc(100% - 20px) center no-repeat;}
	.lnb-menu div a {padding:0 20px 0 30px; line-height:60px; display:block;}
	.lnb-menu div ul {border-left:1px solid #e5e5e5;border-top:1px solid #e5e5e5; display:none; box-shadow:0 5px 10px rgba(0,0,0,.1);}
	.lnb-menu div:hover ul {display:block;}
	.lnb-menu div ul li {border-right:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;}
	.lnb-menu div ul li a {padding:0 20px 0 30px; line-height:44px; display:block; background:#fff;}
	.lnb-menu div ul li a:hover {background:#f5f5f5;}
	.lnb-menu div ul li.on a {background:var(--c_blue); color:#fff;}
	
	
	
	/* ****** footer ******* */
	footer {padding:70px 0 60px; background:#f5f5f5;}
	footer .footer-wrap {position:relative;}
	footer .footer-logo {padding-bottom:30px; font-size:30px; font-weight:700; color:#666; letter-spacing:-1px; font-style:italic; line-height:1;}
	footer .footer-info {}
	footer .footer-info>p {}
	footer .footer-info address {}
	footer .footer-info address p {font-size:14px; color:#666; font-weight:300;}
	footer .footer-info address p span {padding-right:10px;}
	footer .footer-info address p.copy {}
	
	footer .customer {position:absolute; right:0; top:0; padding-left:60px; line-height:1;}
	footer .customer:after {content:''; width:48px; height:48px; display:block; background:#666 url(../images/common/i-footer.png)center no-repeat; border-radius:50%;position:absolute; left:0; top:0;}
	footer .customer p {font-size:14px; font-weight:300;}
	footer .customer a {font-size:24px; padding-top:10px; display:block;}
	
	
	
	/* ****** contents ******* */
	.contents {padding:120px 0; margin-top:60px;}
	
	
	
	/* 이메일무단수집거부 */
	#layerPop {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, .5); z-index:10000000}
	#layerPop .wrap {position:absolute; left:0; top:0; display:table; width:100%; height:100%; text-align:center;}
	#layerPop .wrap .inner {display:table-cell; vertical-align:middle;}
	#layerPop .wrap .inner>div {position:relative; display:inline-block; border-radius:10px; overflow:hidden; background:#fff}
	#layerPop .wrap .inner>div {width:700px;}
	#layerPop .wrap .inner>div h2 {display:block; width:100%; height:55px; padding:0 30px; line-height:55px; font-size:22px; font-weight:500; text-align:left; border-bottom:1px solid #ddd; background:#f9f9f9; color:#000;}
	#layerPop .wrap .inner>div a {position:absolute; right:0; top:0; width:55px; height:55px; border-left:1px solid #ddd; text-indent:100%; white-space:nowrap; overflow:hidden; background:url(../images/common/i-close.png) no-repeat center;}
	#layerPop .wrap .inner>div .email-inner {padding:30px 40px; color:#000;  text-align:left;}
	#layerPop .wrap .inner>div .top {padding:20px; background:#f5f5f5; border-radius:10px;}
	#layerPop .wrap .inner>div .bot {margin-top:20px;}
	#layerPop .wrap .inner>div p.start {padding-top:10px; text-align:right;}
	#layerPop .wrap .inner>div .ulType1 {}
	#layerPop .wrap .inner>div .ulType1 li {margin-top:5px;padding-left:15px; position:relative;}
	#layerPop .wrap .inner>div .ulType1 li:before {content:''; display:block; width:3px; height:3px; background:#666; position:absolute; left:0; top:12px; border-radius:50%;}
	

}




/* ************************ 태블릿 이하(~1024) ************************ */
@media screen and (max-width: 1024px) {
	
	.mobile {display:block}
	.pc {display:none !important}
	/* .w1400 {width:100%; padding:0 20px;} */
	
	#google_translate_element {position:absolute; left:20px; display:flex; align-items:center; height:60px;}

	header {position:relative; z-index:999; height:60px; box-shadow:0 0 10px rgba(0,0,0,.1);}
	header .head {}
	header .head .logo {z-index:999; top:0;}
	header .head .logo {position:absolute; left:50%; transform:translateX(-50%);}
	header .head .logo a {font-size:24px; color:var(--c_blue); font-style:italic; display:flex; height:60px; align-items:center;}

	header>aside {position:absolute; left:0; top:0; width:100%;}
	header>aside a {position:absolute; top:0; display:block; width:60px; height:60px; text-indent:-99999px; overflow:hidden; background-repeat:no-repeat; background-size:22px; background-position:center;}
	/* header>aside a.login {right:0; background-image:url(../images/common/icon_login.png);} */
	header>aside a.gnbView {right:0; background-image:url(../images/common/icon_gnbView.png); border-left:1px solid #e5e5e5;}


	/*gnb*/
	nav.mobile { z-index:9999; position:fixed; top:0; width:80%; height:100%; overflow:hidden; box-shadow:0 !important; background-color:#fff;}
	nav.mobile .closeWrap {position:relative; height:65px; background-color:#fff; color:#666; border-bottom:5px solid #efefef;}
	nav.mobile .closeWrap .btn {display:inline-block; font-size:12px; line-height:60px;margin-left:10px;}
	nav.mobile .closeWrap .gnbClose {display:block; width:60px; height:60px; background:url(../images/common/icon_close.png) no-repeat center; background-size:17px; border-left:1px solid #efefef; float:right; text-indent:100%; white-space:nowrap; overflow:hidden;}
	nav.mobile .closeWrap aside a {position:relative; float:left; display:inline-block; margin:0 20px; color:#666; font-size:12px; height:55px; line-height:55px; font-weight:400;}
	.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%; padding:0; overflow-y:auto; text-align:left !important;}
	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:15px; color:var(--c_blue); border-bottom:1px solid #e4e4e4; background:#fff;}
	nav.mobile .gnb>ul>li>ul {display:none; border-bottom:3px solid #eee;}
	nav.mobile .gnb>ul>li>ul>li {position:relative;}
	nav.mobile .gnb>ul>li>ul>li a {position:relative; display:block; padding:10px 0 10px 50px; font-size:15px; color:#000; border-bottom:1px solid #e5e5e5;}
	nav.mobile .gnb>ul>li>ul>li>a:before {
		position:absolute; top:22px; left:35px; transition:all var(--ani_time);
		display:block; content:""; border-radius:50%;
		width:3px; height:3px; background:#000;
	}

	nav.mobile .gnb>ul>li.on>a {color:#fff; background:var(--c_blue);}
	nav.mobile .gnb>ul>li>ul>li.on>a {color:var(--c_blue); border-bottom:1px solid var(--c_blue);}
	nav.mobile .gnb>ul>li>ul>li.on>a:before {background:var(--c_blue);}

	/* ****** footer ******* */
	footer {padding:50px 20px 40px; background:#f5f5f5;}
	footer .footer-wrap {position:relative;}
	footer .footer-logo {padding-bottom:15px; font-size:21px; font-weight:700; color:#666; letter-spacing:-1px; font-style:italic; line-height:1;}
	footer .footer-info {}
	footer .footer-info>p {font-size:15px;}
	footer .footer-info address {}
	footer .footer-info address p {font-size:14px; color:#666; font-weight:300;}
	footer .footer-info address p span {padding-right:10px; display:inline-block;}
	footer .footer-info address p.copy {}
	
	footer .customer {position:absolute; right:20px; top:0; padding-left:50px; line-height:1;}
	footer .customer:after {content:''; width:40px; height:40px; display:block; background:#666 url(../images/common/i-footer.png)center /60% no-repeat; border-radius:50%;position:absolute; left:0; top:0;}
	footer .customer p {font-size:12px; font-weight:300;}
	footer .customer a {font-size:19px; padding-top:10px; display:block;}
	
	/* ****** lnb ******* */
	.lnb {background:center /cover no-repeat;height:80px; position:relative;}
	.lnb:before {content:'';display:block; background:rgba(0,0,0,.3); position:absolute; left:0; top:0; width:100%; height:100%;}
	.lnb.intro {background-image:url(../images/common/bg-intro.jpg)}
	.lnb-tit {display:flex;height:80px; justify-content:center; align-items:center; position:relative;}
	.lnb-tit h2 {color:#fff; font-size:24px;}
	.lnb-wrap {background:#fff; position:absolute; left:0; top:100%; width:100%; border-bottom:1px solid #e5e5e5; z-index:9;}
	.lnb-wrap.fixOn {position:fixed;top:0;box-shadow:0 5px 5px rgba(0,0,0,.1);}
	.lnb-menu {display:flex; height:60px;}
	.lnb-menu>* {}
	.lnb-menu a.home {width:60px; height:100%; background:var(--c_blue) url(../images/common/i-home.svg)center no-repeat; display:block;}
	.lnb-menu div {width:300px; height:60px;border-right:1px solid #e5e5e5;background:url(../images/common/i-selectArrow)calc(100% - 20px) center no-repeat;}
	.lnb-menu div a {padding:0 20px 0 30px; line-height:60px; display:block;}
	.lnb-menu div ul {border-left:1px solid #e5e5e5;border-top:1px solid #e5e5e5; display:none; box-shadow:0 5px 10px rgba(0,0,0,.1);}
	.lnb-menu div:hover ul {display:block;}
	.lnb-menu div ul li {border-right:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;}
	.lnb-menu div ul li a {padding:0 20px 0 30px; line-height:44px; display:block; background:#fff;}
	.lnb-menu div ul li a:hover {background:#f5f5f5;}
	.lnb-menu div ul li.on a {background:var(--c_blue); color:#fff;}
	
	
	/* ****** contents ******* */
	.contents {padding:50px 20px;}
	
	
	/* 이메일무단수집거부 */
	#layerPop {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0, 0, 0, .5); z-index:10000000}
	#layerPop .wrap {position:absolute; left:0; top:0; display:table; width:100%; height:100%; text-align:center;}
	#layerPop .wrap .inner {display:table-cell; vertical-align:middle; padding:0 20px;}
	#layerPop .wrap .inner>div {position:relative; display:inline-block; border-radius:10px; overflow:hidden; background:#fff}
	#layerPop .wrap .inner>div {width:100%;}
	#layerPop .wrap .inner>div h2 {display:block; width:100%; height:55px; padding:0 30px; line-height:55px; font-size:19px; font-weight:500; text-align:left; border-bottom:1px solid #ddd; background:#f9f9f9; color:#000;}
	#layerPop .wrap .inner>div a {position:absolute; right:0; top:0; width:55px; height:55px; border-left:1px solid #ddd; text-indent:100%; white-space:nowrap; overflow:hidden; background:url(../images/common/i-close.png) no-repeat center;}
	#layerPop .wrap .inner>div .email-inner {padding:3vw 4vw; color:#000;  text-align:left; font-size:15px;}
	#layerPop .wrap .inner>div .top {padding:20px; background:#f5f5f5; border-radius:10px;}
	#layerPop .wrap .inner>div .bot {margin-top:20px;}
	#layerPop .wrap .inner>div p.start {padding-top:10px; text-align:right;}
	#layerPop .wrap .inner>div .ulType1 {}
	#layerPop .wrap .inner>div .ulType1 li {margin-top:5px;padding-left:15px; position:relative;}
	#layerPop .wrap .inner>div .ulType1 li:before {content:''; display:block; width:3px; height:3px; background:#666; position:absolute; left:0; top:12px; border-radius:50%;}
}





/* ************************ 모바일 (0~767) ************************ */
@media screen and (max-width:767px) {
	
	.lnb {}
	.lnb-tit h2 {font-size:21px;}
	
	/* ****** footer ******* */
	footer {padding:30px 20px;}
	
	
	/* ****** contents ******* */
	.contents {padding:30px 20px;}
	
	
	
}