@charset "utf-8";

/* 메인페이지 스타일만 정의 */

/* ************************ 데스크탑 (992~) ************************ */
@media screen and (min-width: 992px), print {
	
	/* -------------------- 제품소개::슬라이더 -------------------- */
	.main.product {clear:both; overflow:hidden; width:100%; padding-top:170px; background:#ececec;}
	.main.product .exWrap>div * {line-height:1;}
	.main.product .exWrap>div .tit span {display:inline-block; font-size:14px; font-weight:300; color:#000;}
	.main.product .exWrap>div .tit h2 {font-size:72px; color:#0c4da2; margin-top:20px;}
	.main.product .exWrap>div .tit p {font-size:36px; font-weight:300; color:#000; margin-top:5px;}
	.main.product .exWrap>div>p {position:relative; margin-top:70px; font-size:16px; font-weight:300; color:#666; padding-top:25px; line-height:1.6;}
	.main.product .exWrap>div>p:before {position:absolute; top:0; left:0; display:block; width:34px; height:4px; background:#000; content:"";}

	.main.product .product.slider {height:480px; background:#ececec;}
	.main.product .sliderObj>li {height:480px; background-size:cover !important; background-color:#ececec; background-repeat:no-repeat; background-position:center;}
	.main.product .sliderObj>li:nth-child(2), .main.product .sliderObj>li:nth-child(3) {display:none;}
	
	.main.product .sliderObj>li>span {height:auto; max-width:1200px; margin:0 auto;}
	.main.product .sliderObj>li>span img {display:none;}
	.main.product .sliderObj>li>.exWrap {position:relative; width:50%; height:290px; margin-top:50px; margin-left:160px;}
		
		
	.main.product .sliderObj>li>.exWrap>div  {position:absolute; top:0; right:0; width:600px; height:auto; z-index:2;}

	.main.product .sliderButton {width:1200px; height:74px; margin:120px auto 0; z-index:0; position:relative;}
	.main.product .sliderButton button {position:absolute; top:0; width:37px; height:74px; border:1px solid transparent; cursor:pointer !important;}
	.main.product .sliderButton button:first-child {background:url(../images/slider/left.png)no-repeat center; left:-37px;}
	.main.product .sliderButton button:last-child {background:url(../images/slider/right.png)no-repeat center; right:-37px;}
	
	/* -------------------- 제품::검색 -------------------- */
	.main.product_search {height:80px; background:#0c4ca3;}
	.main.product_search>div {max-width:1200px; width:100%; margin:0 auto; height:50px; padding:15px 0;}
	.main.product_search>div>.wrap {overflow:hidden; border-radius:30px; height:50px; display:table; width:100%;}
	.main.product_search>div>.wrap>* {display:table-cell;}
	.main.product_search>div>.wrap>.tit {
		width:14%; background:#00adef; color:#fff; font-size:15px; text-align:center; vertical-align:middle;
		border-radius:30px 0 0 30px; /*ie*/
	}
	.main.product_search>div>.wrap>.con {
		width:86%; background:#fff;
		border-radius:0 30px 30px 0; /*ie*/
	}

	.main.product_search>div>.wrap2{max-width:1200px; width:100%; margin:0 auto; height:50px; padding:30px 0;}


	/* form 검색박스2-pc */
	form.searchBox2 {position:relative;}
	form.searchBox2 input[type="text"] {	
		display:inline-block; height:50px; width:100%; padding:10px 100px 10px 20px; margin:0; vertical-align:initial !important; max-width:100%;
		font-size:inherit; line-height:1;	
		border-radius:0 30px 30px 0; background:#fff; color:#000 !important;
		float:inherit; border:1px solid #fff;
	}
	form.searchBox2 input:focus {outline:none !important;}
	form.searchBox2 a.icon {position:absolute; top:15px; right:30px; cursor:pointer;}
	form.searchBox2 a.icon img {height:20px;}
	form.searchBox2 a.icon span {font-size:14px; color:#0d4da4; display:inline-block; margin-left:5px;}
	
	form.searchBox2 input::-webkit-input-placeholder {color:#aaa !important;} /*크롬,사파리*/
	form.searchBox2 input::-moz-placeholder {color:#aaa !important;} /*파폭*/
	form.searchBox2 input::-ms-input-placeholder {color:#aaa !important;} /*ie*/
	
	
	/* -------------------- 제품::링크 -------------------- */
	.main.product_wrap {background:#fff;}
	.main.product_wrap>ul {overflow:hidden; max-width:1200px; width:100%; margin:0 auto; padding:80px 0;}
	.main.product_wrap>ul li {float:left; width:25%; padding:5px;}
	.main.product_wrap>ul li a {border:1px solid #e5e5e5; background:#fff; display:inline-block; width:100%;}
	.main.product_wrap>ul li a:hover {border:1px solid #1a78d7; box-shadow:1px 3px 5px rgba(0,0,0,.3);}
	.main.product_wrap>ul li a .inner {padding:40px 20px 20px;}
	.main.product_wrap>ul li a .inner .imgWrap {height:165px; text-align:center;}
	.main.product_wrap>ul li a .inner .imgWrap img {max-width:100%;}
	.main.product_wrap>ul li a .inner .nameWrap>* {display:block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; line-height:1; font-weight:300; text-align:right;}
	.main.product_wrap>ul li a .inner .nameWrap p {margin-top:30px; font-size:18px; color:#000;font-family:'NotoSansKR';font-weight:bold}
	.main.product_wrap>ul li a .inner .nameWrap span {font-size:12px; color:#999; margin-top:5px;}



	/* -------------------- 전자카탈로그 제품::링크 -------------------- */
	.main.e_book_product_wrap {background:#b0b0b0;}
	.main.e_book_product_wrap {overflow:hidden; max-width:1200px; width:100%; margin:0 auto; padding:20px 0;}
	.main.e_book_product_wrap li {float:left; width:14%; padding:5px;margin-left:2px}
	.main.e_book_product_wrap li a {border:1px solid #e5e5e5; background:#fff; display:inline-block; width:100%;}
	.main.e_book_product_wrap li a:hover {border:1px solid #1a78d7; box-shadow:1px 3px 5px rgba(0,0,0,.3);}
	.main.e_book_product_wrap li a .inner {padding:0px;}
	.main.e_book_product_wrap li a .inner .imgWrap {height:150px; text-align:center;padding-top:10px;padding-bottom:10px}
	.main.e_book_product_wrap li a .inner .imgWrap img {max-width:100%;max-height:100%}
	.main.e_book_product_wrap li a .inner .nameWrap>* {display:block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; line-height:1; font-weight:300; text-align:center;background-color:#0066ff;padding-top:5px;padding-bottom:5px}
	.main.e_book_product_wrap li a .inner .nameWrap p {margin-top:0px; font-size:18px; color:#fff;font-family:'NotoSansKR';font-weight:bold}
	.main.e_book_product_wrap li a .inner .nameWrap span {font-size:13px; color:#000; margin-top:0px;background-color:#fff;}


	
	/* -------------------- 바로가기:: -------------------- */
	.main.quick {background:#f5f5f5;}
	.main.quick>ul {overflow:hidden; max-width:1200px; width:100%; margin:0 auto; padding:50px 0;}
	.main.quick>ul li {float:left; width:33.3%; padding:0 5px;}
	.main.quick>ul li a {border:1px solid #e5e5e5; width:100%; display:inline-block; padding:40px; background:#fff;}
	.main.quick>ul li a:hover {background:#00aeef;}
	.main.quick>ul li a div {padding-left:80px; background-position:top left; background-repeat:no-repeat;}
	.main.quick>ul li:nth-child(1) a div {background-image:url(../images/main/i_quick1.png);}
	.main.quick>ul li:nth-child(2) a div {background-image:url(../images/main/i_quick2.png);}
	.main.quick>ul li:nth-child(3) a div {background-image:url(../images/main/i_quick3.png);}
	.main.quick>ul li a div .tit {font-size:18px; color:#000;}
	.main.quick>ul li a div .con {font-size:14px; color:#999;}
	.main.quick>ul li a:hover div > * {color:#fff;}

}


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

	
	
	/* -------------------- 제품소개::슬라이더 -------------------- */
	.main.product {clear:both; overflow:hidden; width:100%; padding-top:30px; background:#ececec;}
	.main.product .exWrap>div {margin-top:200px; padding:0 50px;}
	.main.product .exWrap>div * {line-height:1;}
	.main.product .exWrap>div .tit span {display:inline-block; font-size:13px; font-weight:300; color:#000;}
	.main.product .exWrap>div .tit h2 {font-size:38px; color:#0c4da2; margin-top:20px;}
	.main.product .exWrap>div .tit p {font-size:18px; font-weight:300; color:#000; margin-top:10px;}
	.main.product .exWrap>div>p {display:none; position:relative; margin-top:30px; font-size:14px; font-weight:300; color:#666; padding-top:25px; line-height:1.6;}
	.main.product .exWrap>div>p br {display:none;}
	/* .main.product .exWrap>div>p:before {position:absolute; top:0; left:50%; margin-left:-15px; display:block; width:30px; height:3px; background:#000; content:"";} */

	.main.product .product.slider {height:400px;}
	.main.product .sliderObj>li {height:0;}
	
	.main.product .sliderObj>li>span {width:100%; height:200px; display:inline-block;}
	.main.product .sliderObj>li>span img {display:none;}
	.main.product .sliderObj>li.product1>span {background:#ececec url(../images/slider/product1_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li.product2>span {background:#ececec url(../images/slider/product2_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li.product3>span {background:#ececec url(../images/slider/product3_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li.product4>span {background:#ececec url(../images/slider/product4_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li.product5>span {background:#ececec url(../images/slider/product5_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li.product6>span {background:#ececec url(../images/slider/product6_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li.product7>span {background:#ececec url(../images/slider/product7_mo.png)no-repeat top center!important; background-size:350px !important;}
	.main.product .sliderObj>li>.exWrap {text-align:center;}
		
		
	.main.product .sliderObj>li>.exWrap>div  {position:absolute; top:0; right:0; width:100%; height:auto; z-index:2; background:#ececec;}

	
	.main.product .sliderButton {width:100%; height:74px; margin:90px auto 0; z-index:3; position:relative;}
	.main.product .sliderButton button {position:absolute; top:0; width:22px; height:44px; border:1px solid transparent; background-size:18px !important; cursor:pointer !important;}
	.main.product .sliderButton button:first-child {background:url(../images/slider/left_mo.png)no-repeat center; left:20px;}
	.main.product .sliderButton button:last-child {background:url(../images/slider/right_mo.png)no-repeat center; right:20px;}
	
	/* -------------------- 제품::검색 -------------------- */
	.main.product_search {height:80px; background:#0c4ca3;}
	.main.product_search>div {max-width:1200px; width:100%; margin:0 auto; height:50px; padding:15px 20px;}
	.main.product_search>div>.wrap {overflow:hidden; border-radius:30px; height:50px; display:table; width:100%;}
	.main.product_search>div>.wrap>* {display:table-cell;}
	.main.product_search>div>.wrap>.tit {
		display:none;
	}
	.main.product_search>div>.wrap>.con {
		width:100%; background:#fff;
		border-radius:30px; /*ie*/
	}
	/* form 검색박스2-pc */
	form.searchBox2 {position:relative;}
	form.searchBox2 input[type="text"] {	
		display:inline-block; height:50px; width:100%; padding:10px 50px 10px 30px; margin:0; vertical-align:initial !important; max-width:100%;
		font-size:inherit; line-height:1;	
		border-radius:0 30px 30px 0; background:#fff; color:#000 !important;
		float:inherit; border:1px solid #fff;
	}
	form.searchBox2 input:focus {outline:none !important;}
	form.searchBox2 a.icon {position:absolute; top:13px; right:30px; cursor:pointer;}
	form.searchBox2 a.icon img {height:22px;}
	form.searchBox2 a.icon span {display:none;}
	
	form.searchBox2 input::-webkit-input-placeholder {color:#aaa !important;} /*크롬,사파리*/
	form.searchBox2 input::-moz-placeholder {color:#aaa !important;} /*파폭*/
	form.searchBox2 input::-ms-input-placeholder {color:#aaa !important;} /*ie*/
	
	
	/* -------------------- 제품::링크 -------------------- */
	.main.product_wrap {background:#fff;}
	.main.product_wrap>ul {overflow:hidden; max-width:1200px; width:100%; margin:0 auto; padding:30px 0px;}
	.main.product_wrap>ul li {float:left; width:50%; padding:5px;}
	.main.product_wrap>ul li a {border:1px solid #e5e5e5; background:#fff; display:inline-block; width:100%;}
	.main.product_wrap>ul li a:hover {border:1px solid #000; box-shadow:1px 3px 5px rgba(0,0,0,.3);}
	.main.product_wrap>ul li a .inner {padding:30px 20px 20px;}
	.main.product_wrap>ul li a .inner .imgWrap {height:auto; text-align:center; overflow:hidden;}
	.main.product_wrap>ul li a .inner .imgWrap img {/* max-width:100%; */ height:80px;width:auto !important;}
	.main.product_wrap>ul li a .inner .nameWrap>* {display:block; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; line-height:1; font-weight:300; text-align:right;}
	.main.product_wrap>ul li a .inner .nameWrap p {margin-top:30px; font-size:18px; color:#000;}
	.main.product_wrap>ul li a .inner .nameWrap span {font-size:12px; color:#999; margin-top:5px;}
	
	/* -------------------- 바로가기:: -------------------- */
	.main.quick {background:#f5f5f5;}
	.main.quick>ul {overflow:hidden; max-width:1200px; width:100%; margin:0 auto; padding:30px 20px;}
	.main.quick>ul li {float:left; width:100%; padding:0 5px;}
	.main.quick>ul li a {border:1px solid #e5e5e5; width:100%; display:inline-block; padding:40px; background:#fff;}
	.main.quick>ul li+li a {border-top:0;}
	.main.quick>ul li a:hover {background:#00aeef;}
	.main.quick>ul li a div {padding-left:60px; background-position:top left; background-repeat:no-repeat; background-size:35px;}
	.main.quick>ul li:nth-child(1) a div {background-image:url(../images/main/i_quick1.png);}
	.main.quick>ul li:nth-child(2) a div {background-image:url(../images/main/i_quick2.png);}
	.main.quick>ul li:nth-child(3) a div {background-image:url(../images/main/i_quick3.png);}
	.main.quick>ul li a div .tit {font-size:18px; color:#000;}
	.main.quick>ul li a div .con {font-size:14px; color:#999;}
	.main.quick>ul li a:hover div > * {color:#fff;}
	
	
	
	
	
	
	
}