@charset "utf-8";

/* latest version 19101401 */
/* ************************************** *
 * in-wrap 컨텐츠 가로사이즈 조정
 * ************************************** */
.in-wrap { width: 1200px; margin: 0 auto;}
/* ////////////////////////////////////////////////// notebook */
@media all and (min-width:991px) and (max-width:1300px) {
	.in-wrap { width: 94%;}
}
/* ////////////////////////////////////////////////// tablet & mobile */
@media all and (max-width:990px) {
	.in-wrap { width: 90%;}
}





/* ************************************** *
 * common layout
 * ************************************** */
::selection { background: #ccc;}
.con-m { display: none;}/* mobile컨텐츠 숨김 */
.br-pc { display: block;}/* pc에서 br태그 효과 적용 */
.img-max { max-width: 100%;}
.img-ct-max { display: block; max-width: 100%; margin: 0 auto;}
.responsive { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%);}
.inquiry-pop,
.bg-body { display: none; z-index: 500; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.5);}
/* ////////////////////////////////////////////////// tablet & mobile */
@media all and (max-width:990px) {
	.con-pc { display: none !important;}/* pc컨텐츠 숨김 */
	.con-m { display: block !important;}/* mobile컨텐츠 보임 */
	.br-pc { display: inline-block;}/* pc에서 br태그 효과 해제 */
    .br-m { display: block;}/* mobile에서 br태그 효과 적용 */
}





/* ************************************** *
 * header layout
 * ************************************** */
/* header */
#header { z-index: 50; position: fixed; width: 100%; height: 100px;}
#header .header-in { position: relative; width: 94%; margin: 0 auto;}
#header h1 { position: absolute; top: 40px; left: 0;}

.header-in h1 img{ width:120px; height:36px; }

/* lnb : 네비게이션 메뉴 */
#lnb { z-index: 200; position: absolute; top: 30px; right: 0;}
.lnb-pc .lnb-navi > li { position: relative; float: left;}
.lnb-pc .lnb-navi > li > a { display: block; margin: 0 30px; line-height: 60px; font-size: 16px; color: #fff;}
.lnb-pc .lnb-navi > li > a:hover,
.lnb-pc .lnb-navi > li.on > a { color: #fff799;}
.lnb-pc .lnb-dep2 { display: none; z-index: 200; position: absolute; top: 57px; left: 50%; margin-left: -75px; width: 150px; padding: 15px 0; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);}
.lnb-pc .lnb-dep2 > li a { display: block; font-size: 14px; color: #555; line-height: 32px; text-align: center;}
.lnb-pc .lnb-dep2 > li a:hover { background: #1973c2; color: #fff;}
.lnb-m { display: none;}
.lnb-m .btn-menu { z-index: 199; overflow: hidden; position: absolute; top: 9px; right: 0; cursor: pointer;}
.lnb-m .btn-close { z-index: 201; position: absolute; top: 40px; right: 40px; cursor: pointer;}
.lnb-m .lnb-box { z-index: 200; display: none; position: fixed; top: 0; right: 0; width: 50%; height: 100%; background: #fff;}
.lnb-m .lnb-box .lnb-navi { position: absolute; top: 50%; left: 50px; width:100%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%);}
.lnb-m .lnb-box .lnb-navi > li > a { display: block; font-size: 30px; font-weight: 200; letter-spacing: -0.075em; line-height: 60px; color: #222;}
.lnb-m .lnb-box .lnb-navi > li > a:hover,
.lnb-m .lnb-box .lnb-navi > li.on > a { color: #1973c2;}
.lnb-m .lnb-box .lnb-dep2 { display: none; padding: 10px 0;}
.lnb-m .lnb-box .lnb-dep2 a { display: block; padding-left: 5%; font-size: 14px; line-height: 30px; color: #555;}
.lnb-m .lnb-box .lnb-dep2 a:hover { font-weight: 700;}
.lnb-m .lnb-box .lnb-dep2 a:before { content: "- ";}
/* scrollTop */
#header.scroll-top { height: 60px; background: #fff; box-shadow: 0 0 10px rgba(0,0,0,0.2); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.2); -moz-box-shadow: 0 0 10px rgba(0,0,0,0.2);}
#header.scroll-top h1 { top: 14px;}
#header.scroll-top h1 img { width: 150px;}
#header.scroll-top #lnb { top: 0;}
#header.scroll-top .lnb-pc .lnb-navi > li > a { color: #333;}
#header.scroll-top .lnb-pc .lnb-navi > li > a:hover,
#header.scroll-top .lnb-pc .lnb-navi > li.on > a { color: #1973c2;}
/* ////////////////////////////////////////////////// tablet & mobile */
@media all and (max-width:990px) {
	/* lnb : 네비게이션 메뉴 */
	#lnb { right: 0;}
	.lnb-pc { display: none;}
	.lnb-m { display: block;}
}
/* ////////////////////////////////////////////////// tablet */
@media all and (min-width:641px) and (max-width:990px) {
	/* gnb : 글로벌네비게이션 메뉴 */
	#gnb { right: 60px;}
}
/* ////////////////////////////////////////////////// mobile */
@media all and (max-width:640px) {
	/* header */
	#header .header-in { width: 90%;}
	#header h1 { top: 25px;}
	#header h1 img { width: 120px;}
	/* lnb : 네비게이션 메뉴 */
	#lnb { top: 23px;}
    .lnb-m .btn-menu { top: 0;}
	.lnb-m .btn-menu img { height: 31px;}
    .lnb-m .btn-close { top: 25px; right: 25px;}
	.lnb-m .btn-close img { height: 25px;}
    .lnb-m .lnb-box { width: 70%;}
    .lnb-m .lnb-box .lnb-navi { left: 40px;}
    .lnb-m .lnb-box .lnb-navi > li > a { font-size: 25px; line-height: 50px;}
    .lnb-m .lnb-box .lnb-dep2 { padding: 7px 0;}
    .lnb-m .lnb-box .lnb-dep2 a { line-height: 26px;}
	/* gnb : 글로벌네비게이션 메뉴 */
	#gnb { top: 33px; right: 40px;}
	#gnb li a { font-size: 11px;}
	/* scrollTop */
	#header.scroll-top { height: 50px;}
	#header.scroll-top h1 img { width: 110px;}
	#header.scroll-top #gnb { top: 19px;}
	#header.scroll-top #lnb { top: 10px;}
}





/* ************************************** *
 * main layout
 * ************************************** */
/* 메인비주얼 */
.main-visual{ position:relative; display:block; box-sizing:border-box; height:895px; overflow:hidden; }
.main-visual .main-visual01{ width:100%; height:895px; position:relative; }
.main-visual-wrap { position: relative; height:895px; }
.main-visual .slick-slide { height: 1000px; -webkit-background-size: cover !important; -moz-background-size: cover !important; background-size: cover !important;}
.main-visual01 { background: url('../images/visual01.jpg') no-repeat center;}
.main-visual02 { background: url('../images/visual01.jpg') no-repeat center;}
.main-visual03 { background: url('../images/visual01.jpg') no-repeat center;}
.tit-main-visual { z-index: 10; position: absolute; top:121px; left: 5%; width: 90%; color: #fff; text-align: center;}
.tit-main-visual h3 { padding-bottom: 15px; font-size: 50px; font-family: 'Maven Pro', sans-serif !important; line-height: 1.1em; text-transform: uppercase;}
.tit-main-visual p { font-size: 20px;}
.tit-main-visual .line { width: 45px; height: 4px; margin: 40px auto; background: #fff;}
.tit-main-visual .visual-ico { display: table; margin: 0 auto;}
.tit-main-visual .visual-ico li { float: left; margin: 0 10px; width: 160px; height: 160px; border-radius: 50%; text-align: center; background-position: center 35px !important;}
/* .tit-main-visual .visual-ico .main-ico01 { background: #1973c2 url('../image/ico-visual01.png') no-repeat;}
.tit-main-visual .visual-ico .main-ico02 { background: #1973c2 url('../image/ico-visual02.png') no-repeat;} */
.tit-main-visual .visual-ico p { padding-top: 95px; font-size: 14px; color: #fff; letter-spacing: 0; text-transform: capitalize;}
.hp_bg{ height:568px; z-index:9; margin:0 auto; overflow:hidden; position:absolute; top:330px; left:5%; width:90%; color:#fff; text-align:center; }
.hp_bg > img{ width:400px; height:568px;  }

.ver_align_wrap_bx{ position:relative; display:table; width:80%; margin:0 auto; }
.ver_align_wrap_bx.error{ border:1px solid #ff0000 !important; }
.ver_align_wrap_bx .left{ display:table-cell; vertical-align:middle; text-align:left; word-break:break-all; }
.ver_align_wrap_bx .right{ display:table-cell; vertical-align:middle; text-align:right; word-break:break-all; }
.ver_align_wrap_bx .normal{ display:table-cell; width:auto; vertical-align:middle; word-break:break-all; }
.ver_align_wrap_bx .center{ display:table-cell; vertical-align:middle; text-align:center; word-break:break-all;}
.ver_align_wrap_bx:after{ content:""; display:block; clear:both; }

.main-tpk-box{ margin:0 auto; height:650px; background:#fff; color:#000; text-align: center; font-size:20px; font-weight:bold; padding-top:50px; }
.ver_align_wrap_bx img{ width:240px; height:508px; border:1px #999 solid; }
.ver_align_wrap_bx p{ padding-bottom:20px; }

/* 메인제품소개 */
.main-products { padding: 100px 0;}
.tit-products { text-align: center;}
.tit-products h3 { font-size: 32px; color: #002b5f; font-family: 'Maven Pro', sans-serif !important;}
.tit-products p { font-size: 18px;}
.products-container { width: 1200px; margin: 0 auto; padding-top: 50px;}
.products-container li { float: left; width: 30.33%; margin: 0 1.5%; text-align: center;}
.products-container li .txt-box h3 { font-size: 25px; padding: 30px 0 10px;}
.products-container li .txt-box p { font-size: 15px;}
/* 메인공지사항 */
.main-notice { position: relative; width:100%; height: 580px; background:url('image/bg-notice.jpg') no-repeat center top;}
.notice-wrap { position: absolute; left: 20%; top: 0; width: 580px; height: 580px; padding: 60px 110px; box-sizing: border-box; background:url('image/bg-notice-box.png') no-repeat center; color: #fff;}
.notice-wrap .tit-notice h3 { font-size: 35px; font-family: 'Maven Pro', sans-serif !important;}
.notice-wrap .tit-notice p { font-size: 18px; padding-bottom: 20px;}
.notice-wrap .tit-notice .line { width: 40px; height: 3px; background: #fff;}
.notice-wrap .notice-list { padding-top: 30px;}
.notice-wrap .notice-list a { color: #fff;}
.notice-wrap .notice-list h4 { font-size: 20px; padding-bottom: 20px; line-height: 1.4em;}
.notice-wrap .notice-list p { font-size: 14px; line-height: 1.5em; height: 105px; overflow: hidden; word-break: keep-all;}
/* ////////////////////////////////////////////////// notebook & tablet & mobile */
@media all and (max-width:1300px) {
	/* 메인제품소개 */
	.products-container { width: 94%;}
	/* 메인공지사항 */
	.notice-wrap { left: 10%;}
}
/* ////////////////////////////////////////////////// mobile */
@media all and (max-width:640px) {
	/* 메인비주얼 */
	.main-visual .slick-slide { height: 600px;}
	.tit-main-visual h3 { padding-bottom: 10px; font-size: 35px;}
	.tit-main-visual p { font-size: 14px;}
	.tit-main-visual .line { width: 25px; height: 2px; margin: 25px auto;}
	.tit-main-visual .visual-ico li { margin: 0 5px; width: 120px; height: 120px; background-position: center 25px !important; background-size: 45px !important;}
	.tit-main-visual .visual-ico p { padding-top: 70px; font-size: 11px;}
	/* 메인제품소개 */
	.main-products { padding: 60px 0 20px;}
	.tit-products h3 { font-size: 27px;}
	.tit-products p { font-size: 15px;}
	.products-container { padding-top: 35px;}
	.products-container li { float: none; width: 90%; margin: 0 auto 40px;}
	.products-container li .txt-box h3 { font-size: 18px; padding: 20px 0 6px;}
	.products-container li .txt-box p { font-size: 13px;}
	/* 메인공지사항 */
	.main-notice { height: 450px;}
	.notice-wrap { left: 0; width: 350px; height: 450px; padding: 40px 90px 40px 40px; background:url('image/bg-notice-box.png') no-repeat right;}
	.notice-wrap .tit-notice h3 { font-size: 25px;}
	.notice-wrap .tit-notice p { font-size: 15px; padding-bottom: 12px;}
	.notice-wrap .tit-notice .line { width: 26px; height: 2px;}
	.notice-wrap .notice-list { padding-top: 20px;}
	.notice-wrap .notice-list h4 { font-size: 16px; padding-bottom: 12px;}
	.notice-wrap .notice-list p { font-size: 13px; height: 80px;}

}






/* ************************************** *
 * sub layout
 * ************************************** */
/* 서브비주얼 */
.sub-visual { position: relative; width: 100%; height: 445px; background: url('image/sub-visual.jpg') no-repeat center top; -webkit-background-size: cover; -ms-background-size: cover; background-size: cover; text-align: center;}
.sub-visual .tit-sub-visual { position: absolute; top: 50%; left: 5%; width: 90%; -webkit-transform: translate(0, -40%); -ms-transform: translate(0, -40%); transform: translate(0, -40%); color: #fff; text-align: center;}
.sub-visual .tit-sub-visual h3 { padding-bottom: 12px; font-size: 30px; font-weight: 200; line-height: 1.1em; letter-spacing: -0.075em;}
.sub-visual .tit-sub-visual p { font-size: 15px; line-height: 1.3em; word-break: keep-all;}
/* 서브네비게이션 type1:선택타입 */
#snb .snb-select { width: 100%; height: 60px; background: #2f2f2f;}
#snb .snb-select > ul { width: 1400px; margin: 0 auto;}
#snb .snb-select > ul > li { float: left; border-right: 1px solid #595959; box-sizing: border-box;}
#snb .snb-select > ul > li.home { width: 60px; border-left: 1px solid #595959; text-align: center; line-height: 60px;}
#snb .snb-select > ul > li.sub-menu { position: relative; width: 250px; padding: 0 20px;}
#snb .snb-select > ul > li.sub-menu > a { display: inline-block; width: 100%; line-height: 60px; background: url('image/bg-snbarr-down-white.png') no-repeat; background-position: right center; font-size: 16px; color: #fff;}
#snb .snb-select > ul > li.sub-menu > a.on { background: url('image/bg-snbarr-up-white.png') no-repeat; background-position: right center;}
#snb .snb-select .snb-deps-list { display: none; z-index: 50; position: absolute; top: 60px; left: 0; width: 100%; background: #ddd;}
#snb .snb-select .snb-deps-list li a { display: block; width: 90%; padding: 12px 0 12px 10%; border-top: solid 1px #aaa; font-size: 14px; color: #111;}
#snb .snb-select .snb-deps-list li a:hover { font-weight: 700;}
/* 서브네비게이션 type2:리스트타입 */
#snb { width: 100%; position: absolute; top: 75%;}
#snb .snb-list { display: table; margin: 0 auto;}
#snb .snb-list li { float: left; width: 200px; margin: 0 2px; text-align: center;}
#snb .snb-list li a { display: block; height: 54px; line-height: 54px; border-radius: 27px; background: #f0f0f0; font-size: 15px; font-weight: 700; color: #555;}
#snb .snb-list li.on a,
#snb .snb-list li a:hover { background: #1973c2; color: #fff;}
/* 서브타이틀 */
#stle { padding-bottom: 30px; margin: 60px 0; background: url('image/bg_line.jpg') no-repeat center bottom; text-align: center;}
#stle h2 { font-size: 35px; color: #222; letter-spacing: -0.075em;}
#stle p { padding-top: 10px; font-size: 17px; line-height: 1.5em;}
/* 컨텐츠영역 */
#container { z-index: 1; width: 100%;}
.content-box { width: 1200px; margin: 0 auto 120px; min-height: 500px;}
/* ////////////////////////////////////////////////// notebook */
@media all and (min-width:991px) and (max-width:1300px) {
	/* 서브네비게이션 type2:리스트타입 */
 	#snb .snb-list.snb-deps-num7,
 	#snb .snb-list.snb-deps-num8,
 	#snb .snb-list.snb-deps-num9 { width: 90%;}
 	#snb .snb-list.snb-deps-num7 li { width: 13.7%; margin: 0 0.25%;}
 	#snb .snb-list.snb-deps-num8 li { width: 12%; margin: 0 0.25%;}
 	#snb .snb-list.snb-deps-num9 li { width: 10.6%; margin: 0 0.25%;}
 	/* 컨텐츠영역 */
 	.content-box { width: 94%;}
 }
 /* ////////////////////////////////////////////////// tablet & mobile */
 @media all and (max-width:990px) {
 	/* 서브네비게이션 type1:선택타입 */
 	#snb .snb-select > ul { width: 100%;}
 	/* 서브네비게이션 type2:리스트타입 */
 	#snb .snb-list { width: 90%;}
	#snb .snb-list.snb-deps-num1 li { margin-left: 25%;}
 	/* 컨텐츠영역 */
 	.content-box { width: 90%;}
 }
 /* ////////////////////////////////////////////////// tablet */
 @media all and (min-width:641px) and (max-width:990px) {
 	/* 서브네비게이션 type2:리스트타입 */
 	#snb .snb-list li { margin: 0.5%;}
	#snb .snb-list.snb-deps-num1 li,
 	#snb .snb-list.snb-deps-num2 li { width: 49%;}
 	#snb .snb-list.snb-deps-num3 li,
 	#snb .snb-list.snb-deps-num5 li,
 	#snb .snb-list.snb-deps-num6 li { width: 32.33%;}
 	#snb .snb-list.snb-deps-num4 li,
 	#snb .snb-list.snb-deps-num7 li,
 	#snb .snb-list.snb-deps-num8 li { width: 24%;}
 	#snb .snb-list.snb-deps-num9 li { width: 19%;}
 }
 /* ////////////////////////////////////////////////// mobile */
 @media all and (max-width:640px) {
 	/* 서브비주얼 */
 	.sub-visual { height: 300px;}
 	.sub-visual .tit-sub-visual h3 { padding-bottom: 25px; font-size: 25px;}
 	.sub-visual .tit-sub-visual p { width: 60%; padding: 0 20%; font-size: 14px;}
 	/* 서브네비게이션 type1:선택타입 */
 	#snb .snb-select { height: 50px;}
 	#snb .snb-select > ul > li.home { display: none;}
 	#snb .snb-select > ul > li.sub-menu { width: 50%; padding: 0 5%;}
 	#snb .snb-select > ul > li.sub-menu > a { line-height: 50px; background-size: 12px; font-size: 13px;}
 	#snb .snb-select > ul > li.sub-menu > a.on { background-size: 12px;}
 	#snb .snb-select .snb-deps-list { top: 50px;}
 	#snb .snb-select .snb-deps-list li a { padding: 10px 0 10px 10%; font-size: 13px;}
 	/* 서브네비게이션 type2:리스트타입 */
 	#snb .snb-list li { margin: 1%;}
	#snb .snb-list.snb-deps-num1 li,
 	#snb .snb-list.snb-deps-num2 li,
 	#snb .snb-list.snb-deps-num4 li,
 	#snb .snb-list.snb-deps-num8 li { width: 48%;}
 	#snb .snb-list.snb-deps-num3 li,
 	#snb .snb-list.snb-deps-num5 li,
 	#snb .snb-list.snb-deps-num6 li,
 	#snb .snb-list.snb-deps-num7 li,
 	#snb .snb-list.snb-deps-num9 li { width: 31.33%;}
 	#snb .snb-list li a { height: 42px; line-height: 42px; border-radius: 21px; font-size: 13px;}
 	/* 서브타이틀 */
	#stle { padding-bottom: 20px; margin: 40px 0; background-size: 25px;}
	#stle h2 { font-size: 25px;}
	#stle p { padding-top: 7px; font-size: 14px;}
 	/* 컨텐츠영역 */
 	.content-box { margin: 0 auto 70px;}
 }





/* ************************************** *
 * footer layout
 * ************************************** */
/* footer */
#footer { width:100%; padding:40px 0 40px; background: #222; color: #fff; text-align: center;}
#footer .footer-in { position: relative; width: 1200px; margin: 0 auto;}
#footer .foo-privacy { display: table; margin: 0 auto;}
#footer .foo-privacy li { float: left; margin: 0 10px;}
#footer .foo-privacy li a { display: block; font-size: 14px; color: #656565;}
#footer .foo-privacy li a:hover { opacity: .7;}
#footer address { margin:10px 0 10px; font-size: 14px; color: #fff; line-height: 1.5em; letter-spacing: 0;}
#footer address span { margin-right: 20px;}
#footer .copyright small { font-size: 14px; color: #fff;}
#footer .btn-top { display: none; z-index: 10; position: absolute; top: -40px; right: 0;}
/* ////////////////////////////////////////////////// notebook */
@media all and (max-width:1300px) {
	/* footer */
	#footer .footer-in { width: 94%;}
}
/* ////////////////////////////////////////////////// tablet & mobile */
@media all and (max-width:990px) {
	/* footer */
	#footer .btn-top { bottom: 0; top: inherit;}
}
/* ////////////////////////////////////////////////// mobile */
@media all and (max-width:640px) {
	/* footer */
	#footer { padding: 26px 0;}
	#footer .foo-privacy li { margin: 0 5px;}
	#footer .foo-privacy li a { font-size: 13px;}
	#footer address { margin: 12px 0 7px; font-size: 12px;}
	#footer .copyright small { font-size: 12px;}
	#footer .btn-top img { width: 42px;}
}