@charset "utf-8"; 

/*
 * --------------------------------------------------------------------------
 * descript : 게시판 테마
 * --------------------------------------------------------------------------
 * version	: 2.0.0
 * author	: Yoodaekyung
 * update	: 2018.08.17
 * email	: eorud0818@naver.com
 * --------------------------------------------------------------------------
 */

/* --------------------------------------------------------------------------
   온라인상담
   -------------------------------------------------------------------------- */
.customer-form{position:relative; width:100%; padding:50px; display:inline-block; background:#f2f3f6; box-sizing:border-box; border-top:2px solid #1e3da1;}
.customer-form::before{position:absolute; display:inline-block; width:1px; height:90%; border-right:1px dashed #cfd3e1; left:calc(50% - 40px); top:50%; transform:translate(0, -50%);}
.customer-form ul{float:left; width:50%; }
.customer-form ul.customer-info li{position:relative; height:35px; line-height:35px; padding:0 80px 0 150px; margin-bottom:30px;}
.customer-form ul.customer-info li:last-child{margin-bottom:0;}
.customer-form ul.customer-info li label{position:absolute; left:0; top:0; width:140px; line-height:inherit; font-size:inherit; font-weight:700; color:#1e3da1;}
.customer-form ul.customer-info li i{float:left; display:inline-block; height:inherit; line-height:inherit; width:5%; text-align:center;}
.customer-form ul.customer-info li input{background:#fff; box-sizing:border-box; padding:0 5px; height:inherit; line-height:inherit; border:1px solid #d8d9dc;}
.customer-form ul.customer-info li select{background:#fff url('/assets/img/common/theme/select_bg.png') no-repeat 97% center; box-sizing:border-box; padding:0 5px; height:inherit; line-height:inherit; border:1px solid #d8d9dc; cursor:pointer;}

.customer-form ul.customer-info li select[data-name="문의분류"],
.customer-form ul.customer-info li input[data-name="회사명"],
.customer-form ul.customer-info li input[data-name="담당자·직책"],
.customer-form ul.customer-info li input[data-name="이메일"]{width:100%;}

.customer-form ul.customer-info li select[data-name="연락처"],
.customer-form ul.customer-info li input[data-name="연락처"]{float:left; width:30%;}


.customer-form ul.customer-txt li{position:relative; height:35px; line-height:35px; padding:0 20px 0 0; margin-bottom:20px;}
.customer-form ul.customer-txt li label{width:100%; line-height:inherit; font-size:inherit; font-weight:700; color:#1e3da1;}
.customer-form ul.customer-txt li textarea[data-name="문의내용"]{background:#fff; border:1px solid #d8d9dc; box-sizing:border-box; padding:0 5px; height:260px; line-height:25px; width:100%;}

/* 온라인 상담 체크박스, 라디오버튼 */
.customer-form-agree{text-align:center; margin-top:20px;}
.customer-form-agree button[type="button"]{letter-spacing:-1px; color:#ff722d; cursor:pointer;}

.customer-form-agree input[type="checkbox"]{display:none;}
.customer-form-agree input[type="checkbox"] + label{font-size:14px; position:relative; padding-left:30px; cursor:pointer; height:23px; line-height:23px;}
.customer-form-agree input[type="checkbox"] + label::before{content:""; display:inline-block; left:0; top:0; border:1px solid #ddd; width:23px; height:23px; box-sizing: border-box;}
.customer-form-agree input[type="checkbox"]:checked + label::after{content:""; display:inline-block; width:15px; height:15px; left:4px; top:4px; background:#ff722d}

.customer-form-agree input[type="radio"]{display:none;}
.customer-form-agree input[type="radio"] + label{font-size:14px; position:relative; padding-left:30px; cursor:pointer; height:23px; line-height:23px;}
.customer-form-agree input[type="radio"] + label::before{content:""; display:inline-block; left:0; top:0; border:1px solid #ddd; width:23px; height:23px; border-radius:23px; box-sizing: border-box;}
.customer-form-agree input[type="radio"]:checked + label::after{content:""; display:inline-block; width:15px; height:15px; border-radius:15px; left:4px; top:4px; background:#ff722d}

/* 전문보기 */
.pop-private{display:none; position:fixed; left:0; top:0; z-index:105; width:100%; height:100%; background:rgba(0,0,0,0.9);}
.pop-private .pop-inner{width:90%; max-width:640px; margin:100px auto 0 auto; background:#fff; border:5px solid #ff722d; border-radius:5px;}
.pop-private .pop-inner h3{text-align:center; padding:20px 0; background:#ff722d; color:#fff; font-size:17px; font-weight:700;}
.pop-private .pop-inner p{padding:15px; font-size:14px; line-height:24px; height:350px; overflow:auto;}
.pop-private .pop-inner p b{display:block; font-weight:700; color:#222;}
.pop-private .pop-inner button{display:block; width:100%; text-align:center; padding:10px 0; font-size:15px; cursor:pointer;}

/* --------------------------------------------------------------------------
   제품소개
   -------------------------------------------------------------------------- */

/* 리스트 */
.business-gallery-form{position:relative; width:100%; background:#f2f2f2; box-sizing:border-box; height:82px; border-top:2px solid #1e3da1;}
.business-gallery-form ul{display:inline-block; width:100%;}
.business-gallery-form label{line-height:80px; height:80px; background:#1e3da1 url(/assets/img/web/main/theme/process_arrow.png) no-repeat 90% center; color:#fff; font-size:20px; padding:0 50px; float:left;}
.business-gallery-form li{width:50%; float:left; height:80px; line-height:80px;}
.business-gallery-form li.business-gallery-select{}
.business-gallery-form li.business-gallery-select div.product-select{float:left; width:350px; margin-left:10px;}
.business-gallery-form li.business-gallery-select select{width:100%; border:1px solid #dddddd; padding:0 15px; height:40px; box-sizing:border-box; background:#fff url(/assets/img/common/theme/select_bg.png) no-repeat 90% center; cursor:pointer;}

.business-gallery-form li.business-gallery-search{position:relative; text-align:right;}
.business-gallery-form li.business-gallery-search form{position:absolute; right:20px; top:50%; transform:translate(0, -50%);}
.business-gallery-form li.business-gallery-search input[type="text"]{width:300px; height:40px; line-height:40px; padding:0 15px; background:#fff; float:left;}
.business-gallery-form li.business-gallery-search button[type="submit"]{width:100px; height:40px; line-height:40px; background:#003c9f; color:#fff; text-align:center; float:left; cursor:pointer;}


.business-gallery{position:relative; width:100%; margin-top:25px;}
.business-gallery ul.list{display:inline-block; width:100%;}
.business-gallery ul.list li.item{position:relative; float:left; width:calc(25% - 15px); margin-right:20px; margin-bottom:20px;}
.business-gallery ul.list li.item:nth-child(4n + 4){margin-right:0;}
.business-gallery ul.list li.item a{position:relative; display:block; width:100%; color:#222;}

.business-gallery ul.list li.item a .thumbnail{width:100%; height:300px;}

.business-gallery ul.list li.item a .info{background:#fff; display:inline-block; width:100%; box-sizing:border-box; padding:20px 10px; border-bottom:1px solid #1e3da1; background:#f9f9f9;}
.business-gallery ul.list li.item a .info b{float:left; display:inline-block; width:30%; height:25px; line-height:25px; color:#1e3da1; font-size:15px; font-weight:700;}
.business-gallery ul.list li.item a .info span{float:left; display:inline-block; width:70%; height:25px; line-height:25px; font-size:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.business-gallery ul.list li.item::after{position:absolute; display:inline-block; width:0; height:8px; left:20px; top:-4px; background:#ff722d;nnnnnnnnn-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.business-gallery ul.list li.item a::before{opacity:0; position:absolute; display:inline-block; width:100%; height:100%; background:rgba(0,0,0,0.6);nnnnnnnnn-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}
.business-gallery ul.list li.item a::after{opacity:0; position:absolute; content:'자세히 보기'; display:inline-block; width:100px; height:80px; line-height:80px; border:1px solid #fff; color:#fff; text-align:center; left:50%; top:50%; transform:translate(-50%, -50%);nnnnnnnnn-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;}

.business-gallery ul.list li.item:hover::after{width:60px;}
.business-gallery ul.list li.item:hover a::before{opacity:1;}
.business-gallery ul.list li.item:hover a::after{opacity:1;}

.business-gallery ul.list li.no-data{text-align:center; padding:50px 0; font-size:13px; color:#aaa;}

/* 뷰 */
.board-content{margin:50px 0;}

.board-title{height:70px; line-height:70px; border-bottom:1px solid #eee;}
.board-title .list{position:relative; float:left; width:250px; font-size:15px;}
.board-title .list:first-child::before{position:absolute; display:inline-block; width:7px; height:30px; background:url(/assets/img/common/theme/div_bg.png) no-repeat center top; right:40px; top:21px;}
.board-title .list b{color:#1e3da1; font-weight:700; display:inline-block; width:80px;}
.board-title .list span{}

.prev-next-list{width:100%; border-top:1px solid #cfd1d4;}
.prev-next-list ul{}
.prev-next-list ul li{background:#fff; border-bottom:1px solid #cfd1d4; text-align:left; font-size:13px; line-height:23px;}
.prev-next-list ul li span{display:inline-block; width:150px; padding:15px 0; background:#f2f2f2; font-weight:300; text-align:center; font-size:15px;}
.prev-next-list ul li a{display:inline-block; width:calc(100% - 150px); box-sizing:border-box; padding:0 25px; color:#222; font-size:15px;}

/* 페이징 */
#board-pagenation{width:100%;}
#board-pagenation{width:100%; max-width:1200px; margin:30px auto 100px auto; text-align:center;}
#board-pagenation a{position:relative; display:inline-block; width:35px; height:35px; line-height:35px; font-size:1em; color:#333; background:#ebebeb; margin:0 2px; box-sizing:border-box;}
#board-pagenation a:hover{text-decoration:underline;}
#board-pagenation a.on{background:#4f5c87; color:#fff; font-weight:300;}