 @charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
/* doc-tit */
.doc-tit {font-size:22px; font-weight:500; color:#242424; line-height:1.3em; margin-bottom:20px; padding-left:30px; position:relative;}
.doc-tit:before {content:''; width:20px; height:20px; background:url('../images/sub/doc-tit.png') 0 0 no-repeat; background-size:cover; position:absolute; left:0; top:50%; margin-top:-10px;}
/* sub01_01 */
.introduce .tit {margin-bottom:46px; text-align:center;}
.introduce .tit p {font-size:16px; line-height:1.7em; color:#454545;}
.introduce .cnt {margin-bottom:50px;}
.introduce .cnt01 {display:flex; align-items:center;}
.introduce .cnt01 .img-box {max-width:575px; width:100%; box-shadow:5px 5px 5px rgba(0,0,0,0.1);}
.introduce .cnt01 .txt {width:1%; flex:1 1 auto; padding-left:50px;}
.introduce .cnt01 .txt li {display:flex; font-size:16px; line-height:1.7em; margin-bottom:20px;}
.introduce .cnt01 .txt li:last-child {margin-bottom:0;}
.introduce .cnt01 .txt li .tt1 {width:125px; font-weight:500; color:#0c4da2;}
.introduce .cnt01 .txt li .tt2 {width:1%; flex:1 1 auto; color:#454545;}
.introduce .cnt02 ul {display:flex; flex-wrap:wrap; margin:0 -15px -30px;}
.introduce .cnt02 ul li {width:33.333333%; padding:0 15px; margin-bottom:30px;}
.introduce .cnt03 .box {background:#f5f5f5; display:flex; align-items:center; padding:30px;}
.introduce .cnt03 .img-box {max-width:420px; width:100%;}
.introduce .cnt03 .txt {width:1%; flex:1 1 auto; padding-left:40px;}
.introduce .cnt03 .txt li {font-size:16px; color:#454545; line-height:1.7em; margin-bottom:4px; position:relative; padding-left:8px;}
.introduce .cnt03 .txt li:before {content:''; width:4px; height:4px; border-radius:50%; background:#454545; position:absolute; left:0; top:12px;}
.introduce .cnt04 p {font-size:16px; line-height:1.7em; color:#454545; margin-bottom:26px;}
.introduce .cnt04 .txt {margin-bottom:26px;}
.introduce .cnt04 .txt:last-child {margin-bottom:0;}
.introduce .cnt04 .tt {display:flex; line-height:50px; margin-bottom:16px;}
.introduce .cnt04 .tt span {display:inline-block; width:50px; color:#fff; text-align:center; font-size:18px; font-weight:500; background:#123360;}
.introduce .cnt04 .tt h4 {background:#ecf2f9; color:#123360; font-size:18px; font-weight:500; width:1%; flex:1 1 auto; padding-left:20px;}
.introduce .cnt04 li {color:#454545; line-height:1.7em; font-size:18px;}
.introduce .cnt05 .col {display:flex;}
.introduce .cnt05 .img-box {max-width:427px; width:100%;}
.introduce .cnt05 .txt {width:1%; flex:1 1 auto; padding-left:70px;}
.introduce .cnt05 .txt h3 {font-size:20px; line-height:1.3em; color:#0c4da2; font-weight:500; margin-bottom:24px;}
.introduce .cnt05 .txt p {font-size:16px; line-height:1.8em; color:#454545; margin-bottom:36px;}
.introduce .cnt05 .txt .tt {font-size:16px; font-weight:500; color:#454545;}
/* sub01_03 */
.partners ul {display:flex; flex-wrap:wrap; margin:0 -15px;}
.partners ul li {width:25%; padding:0 15px; margin-bottom:30px;}
.partners ul li p {font-size:16px; text-align:center; color:#454545; line-height:1.7em; margin-top:12px;}
/* sub02_01 */
.equipment .cnt {margin-bottom:46px; background-repeat:no-repeat; background-size:cover; background-position:center center; height:440px; position:relative;}
.equipment .cnt01 {background-image:url('../images/sub/equipment-bg01.jpg');}
.equipment .cnt02 {background-image:url('../images/sub/equipment-bg02.jpg');}
.equipment .cnt03 {background-image:url('../images/sub/equipment-bg03.jpg');}
.equipment .cnt04 {background-image:url('../images/sub/equipment-bg04.jpg');}
.equipment .cnt05 {background-image:url('../images/sub/equipment-bg05.jpg');}
.equipment .cnt06 {background-image:url('../images/sub/equipment-bg06.jpg');}
.equipment .cnt07 {background-image:url('../images/sub/equipment-bg07.jpg');}
.equipment .cnt08 {background-image:url('../images/sub/equipment-bg08.jpg');}
.equipment .cnt09 {background-image:url('../images/sub/equipment-bg09.jpg');}
.equipment .cnt .txt {position:absolute; width:100%; height:100%; top:0; left:0; display:flex; align-items:center; justify-content:center; flex-direction:column;}
.equipment .cnt .txt .equipment-logo {margin-bottom:50px;}
.equipment .cnt .txt a {display:inline-block; min-width:310px; line-height:45px; border-radius:23px; background:#0c96a2; padding:0 26px; font-size:18px; font-weight:500; color:#fff; position:relative;}
.equipment .cnt .txt a:after {content:''; width:10px; height:18px; background:url('../images/sub/equipment-arrow.png') 0 0 no-repeat; background-size:cover; position:absolute; top:50%; margin-top:-9px; right:26px;}

.equipment .cnt .txt ul {display:flex; flex-wrap:wrap; margin:0 -10px -10px; justify-content:center;}
.equipment .cnt .txt ul li {padding:0 10px; margin-bottom:10px;}
.equipment .cnt .txt ul li:last-child a {padding:0 46px 0 26px;}
/* list */
.product-list {padding:25px 0 0; border-top:2px solid #686868;}
.product-list ul {display:flex; flex-wrap:wrap; margin:0 -13px;}
.product-list ul li {width:20%; padding:0 13px; margin-bottom:36px;}
.product-list ul li a {display:block;}
.product-list .img-box {}
.product-list .pic {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.product-list .pic:after {content:''; width:100%; height:100%; position:absolute; top:0; left:0; border:1px solid #ddd;}
.product-list .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;}
.product-list .tit {font-size:16px; color:#333; letter-spacing:0; line-height:1.5em; margin-top:16px; text-align:center;}
/* detail */
.detail {letter-spacing:0;}
.detail p {font-size:16px; line-height:1.7em; color:#505050;}
.detail .cnt {margin-bottom:50px; display:flex;}
.detail .cnt .img-box {max-width:400px; width:100%;}
.detail .cnt .pic {position:relative; height:0; padding-bottom:100%; overflow:hidden;}
.detail .cnt .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 .cnt .pic:after {content:''; width:100%; height:100%; position:absolute; top:0; left:0; border:1px solid #ddd;}
.detail .cnt .txt-box {width:1%; flex:1 1 auto; padding-left:40px;}
.detail .cnt h3 {font-size:28px; color:#333; line-height:1.3em; padding-bottom:26px; margin-bottom:26px; border-bottom:1px solid #ddd;}
.detail .wrap h4 {font-size:22px; line-height:1.3em; color:#333; margin-bottom:16px;}
.detail .wrap .txt {padding:26px 0; border-top:1px solid #ddd; border-bottom:1px solid #ddd; min-height:220px; margin-bottom:25px}
.detail .wrap .list {text-align:center;}
.detail .wrap .list a {display:inline-block; line-height:50px; color:#fff; padding:0 55px; font-size:18px; font-weight:500; background:#555555;}
/* sub04_03 */
.directions .root_daum_roughmap {width:100% !important; height:500px !important;}
.directions .root_daum_roughmap .wrap_map {height:500px !important;}
.directions .roughmap_lebel_text {line-height:0 !important; font-size:0 !important;}
.directions .roughmap_lebel_text:after {content:"댕기상사(주)"; font-size:12px; line-height:15px;}
.directions .cnt li {border-bottom:1px solid #ddd; line-height:50px; display:flex; font-size:16px; color:#454545;}
.directions .cnt li .tt1 {width:200px; text-align:center; font-weight:500;}
.directions .cnt li .tt2 {width:1%; flex:1 1 auto;}