@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
/* sub01_01 공장 및 매장소개 */
.introduce .items {margin-bottom:50px;}
.introduce .pic {position:relative; height:0; padding-bottom:75%; overflow:hidden;}
.introduce .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.introduce .slick-arrow {position:absolute; width:43px; height:84px; top:50%; transform:translateY(-50%); font-size:0; border:0; background-color:transparent; z-index:11; background-repeat:no-repeat; background-size:cover;}
.introduce .slick-prev {background-image:url('../images/sub/introduce-prev.png'); left:30px;}
.introduce .slick-next {background-image:url('../images/sub/introduce-next.png'); right:30px;}
.introduce .cnt {text-align:center;}
.introduce .cnt .img-box {padding-bottom:25px; margin-bottom:25px; border-bottom:1px solid #ddd;}
.introduce .cnt .txt p {line-height:1.9em;color:#454545;}
/* sub02 detail */
.detail-wrap {display:flex; margin-bottom:80px;}
.detail-wrap .img-box {width:41.66666666667%;}
.detail-wrap .origin {margin-bottom:20px; position:relative;}
.detail-wrap .origin:after {content:''; width:100%; height:100%; position:absolute; top:0; left:0; border:1px solid #ddd;}
.detail-wrap .origin .pic {position:relative; height:0; padding-bottom:75%; overflow:hidden;}
.detail-wrap .origin .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.detail-wrap .thumbs {padding:0 43px; position:relative;}
.detail-wrap .thumbs .slider {margin:0 -5px;}
.detail-wrap .thumbs .item {margin:0 5px; position:relative;}
.detail-wrap .thumbs .item:after {content:''; width:100%; height:100%; position:absolute; top:0; left:0; border:1px solid #ddd;}
.detail-wrap .thumbs .pic {position:relative; height:0; padding-bottom:75%; overflow:hidden;}
.detail-wrap .thumbs .pic img {position:absolute; top:50%; left:0; transform:translateY(-50%); width:100% !important; height:100% !important; max-width:100%; min-height:100%; object-fit:cover; transition:0.3s;}
.detail-wrap .thumbs .slick-arrow {width:23px; height:45px; position:absolute; top:50%; transform:translateY(-50%); border:0; background-color:transparent; z-index:11; font-size:0; background-repeat:no-repeat; background-size:cover;}
.detail-wrap .thumbs .slick-prev {background-image:url('../images/bbs/prev-arrow.png'); left:-38px;}
.detail-wrap .thumbs .slick-next {background-image:url('../images/bbs/next-arrow.png'); right:-38px;}
.detail-wrap .txt {flex:1 1 auto; width:1%; padding-left:50px;}
.detail-wrap .txt h3 {font-size:22px; color:#000; line-height:1.3em; padding-bottom:12px; border-bottom:1px solid #ddd;}
.detail-wrap .txt .box {height:375px; border-bottom:1px solid #ddd;}
.detail-wrap .txt .inner {padding:25px 0;}
.detail-wrap .txt dl {display:flex; margin-bottom:20px; line-height:1.8em; color:#454545;}
.detail-wrap .txt dt {width:140px; padding-left:20px; font-weight:500; position:relative;}
.detail-wrap .txt dt:before {content:''; width:8px; height:8px; border-radius:50%; background:#284592; position:absolute; top:11px; left:0;}
.detail-wrap .txt dd {flex:1 1 auto; width:1%;}
.detail-wrap .txt .backlist {text-align:center; margin-top:40px;}
.detail-wrap .txt a {display:inline-block; line-height:50px; background:#284592; padding:0 60px; color:#fff; font-weight:500;}
/* sub03_01 고객지원 */
.inquiry .wrap {display:flex; margin:0 -15px 50px;}
.inquiry .box {width:50%; margin:0 15px; border:1px solid #ddd; padding:30px; color:#242424; position:relative;}
.inquiry .box h3 {font-size:20px; line-height:1.6em; font-family:'NanumSquare'; margin-bottom:20px;}
.inquiry .box dl {display:flex; line-height:1.7em; margin-bottom:12px;}
.inquiry .box dl:last-child {margin-bottom:0;}
.inquiry .box:first-child dl:last-child dt {width:100%;}
.inquiry .box dt {width:90px; font-size:18px; font-weight:500;}
.inquiry .box dd {flex:1 1 auto; width:1%;}
.inquiry .box:after {content:''; width:120px; height:120px; top:50%; margin-top:-60px; right:30px; background-repeat:no-repeat; background-size:cover; position:absolute; opacity:0.3;}
.inquiry .box:first-child:after {background-image:url('../images/sub/inquiry01.png');}
.inquiry .box:last-child:after {background-image:url('../images/sub/inquiry02.png');}