 @charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */


.business-menu {margin-bottom:155px; text-align:center;}

.business-title {display:flex; color:#000; margin-bottom:50px;}
.business-title h2 {order:2; flex:1 1 auto; width:1%; min-width:0; font-size:56px; line-height:1.556em; padding-left:30px; text-align:right;}
.business-title .cnt {order:1; width:68%;  font-family: 'IBM Plex Sans KR', sans-serif;}
.business-title .cnt .tt {font-size:36px; line-height:1.4em; font-weight:600; color:#000; margin-bottom:25px;}
.business-title .cnt .txt {line-height:1.667em; font-size:18px;}
.business-title.type2 {display:block; margin-bottom:120px;}
.business-title.type2 h2 {text-align:left; width:100%;margin-bottom:10px; padding-left:0;}
.business-title.type2 .cnt {font-size:24px; width:100%; line-height:1.5em; color:#000; font-weight:600;}
.business-cnt {display:flex; font-family: 'IBM Plex Sans KR', sans-serif; overflow:hidden;}
.business-cnt .photo {width:675px; margin-right:95px;}
.business-cnt .photo img {width:100%}
.business-cnt .info {flex: 1 1 auto; width:1%; min-width:0;}
.business-cnt .info .group {margin-bottom:50px;}
.business-cnt .info dl {margin-bottom:25px;}
.business-cnt .info dl:last-child {margin-bottom:0;}
.business-cnt .info dl dt {position:relative; font-size:24px; line-height:1.4em; color:#242424;font-weight:500; margin-bottom:5px; padding-left:40px;}
.business-cnt .info dl dt:before {content:"";position:absolute; top:5px; left:0; width:25px; height:25px; background:url('../images/sub/icon_check.png') 50% 50% no-repeat; background-size:contain;}
.business-cnt .info dl dd {padding-left:40px; font-size:18px; line-height:1.5em;}
.business-cnt .info .cnt {font-size:16px; line-height:1.625em; color:#888}

#section1,#section2,#section3,#section4,#section5 {margin-bottom:120px;}

.business-step {padding:0 30px;}
.business-step ul {display:flex; flex-wrap:wrap; margin:0 -60px -50px;}
.business-step ul li {width:20%; position:relative; padding:0 60px; margin-bottom:50px; text-align:center; font-family: 'IBM Plex Sans KR', sans-serif;}
.business-step ul li:first-child:after {display:none}
.business-step ul li:after {content:""; position:absolute; top:30%; left:-20px; width:40px; height:40px; transform:translateY(-85%); background:url('../images/sub/business_arrow.png') 50% 50% no-repeat; background-size:contain;}
.business-step ul li:before {content:""; position:absolute; bottom:0; left:0; width:100%; height:40px; transform:rotate(90deg); background:url('../images/sub/business_arrow.png') 50% 50% no-repeat; opacity:0; background-size:contain;}
.business-step ul li:nth-child(5):before {opacity:1;}
.business-step ul li .icon {position:relative; width:183px; height:183px; margin:0 auto 20px; border-radius:100%; background-repeat:no-repeat; background-position:50% 50%; background-size:contain;}
.business-step ul li .icon:after {content:""; position:absolute; top:0; left:0; width:100%; height:100%; border:1px solid #ddd; border-radius:100%}
.business-step ul li .tit {font-size:24px; line-height:1.4em; color:#000;font-weight:700; margin-bottom:5px;}
.business-step ul li .cnt {font-size:16px; line-height:1.625em; color:#888;}
.business-step ul li:nth-child(10):after {display:none}
.business-step ul li:nth-child(1) .icon {background-image:url('../images/sub/business_icon1.png');}
.business-step ul li:nth-child(2) .icon {background-image:url('../images/sub/business_icon2.png');}
.business-step ul li:nth-child(3) .icon {background-image:url('../images/sub/business_icon3.png');}
.business-step ul li:nth-child(4) .icon {background-image:url('../images/sub/business_icon4.png');}
.business-step ul li:nth-child(5) .icon {background-image:url('../images/sub/business_icon5.png');}
.business-step ul li:nth-child(6) .icon {background-image:url('../images/sub/business_icon6.png');}
.business-step ul li:nth-child(6):after {transform:translateY(-85%) rotate(-180deg);}
.business-step ul li:nth-child(7):after {transform:translateY(-85%) rotate(-180deg);}
.business-step ul li:nth-child(8):after {transform:translateY(-85%) rotate(-180deg);}
.business-step ul li:nth-child(9):after {transform:translateY(-85%) rotate(-180deg);}
.business-step ul li:nth-child(7) .icon {background-image:url('../images/sub/business_icon7.png');}
.business-step ul li:nth-child(8) .icon {background-image:url('../images/sub/business_icon8.png');}
.business-step ul li:nth-child(9) .icon {background-image:url('../images/sub/business_icon9.png');}
.business-step ul li:nth-child(10) .icon {background-image:url('../images/sub/business_icon10.png');}
.business-step ul li:nth-child(1) {order:1}
.business-step ul li:nth-child(2) {order:2}
.business-step ul li:nth-child(3) {order:3}
.business-step ul li:nth-child(4) {order:4}
.business-step ul li:nth-child(5) {order:5}
.business-step ul li:nth-child(6) {order:10}
.business-step ul li:nth-child(7) {order:9}
.business-step ul li:nth-child(8) {order:8}
.business-step ul li:nth-child(9) {order:7}
.business-step ul li:nth-child(10) {order:6}
.business-step ul li.active .icon {background-color:#edb949;}
.business-step ul li.active .icon:after {border:10px solid #ebebeb;}
.business-step ul li.active:nth-child(1) .icon {background-image:url('../images/sub/business_icon1_on.png');}
.business-step ul li.active:nth-child(2) .icon {background-image:url('../images/sub/business_icon2_on.png');}
.business-step ul li.active:nth-child(3) .icon {background-image:url('../images/sub/business_icon3_on.png');}
.business-step ul li.active:nth-child(4) .icon {background-image:url('../images/sub/business_icon4_on.png');}
.business-step ul li.active:nth-child(5) .icon {background-image:url('../images/sub/business_icon5_on.png');}
.business-step ul li.active:nth-child(6) .icon {background-image:url('../images/sub/business_icon6_on.png');}
.business-step ul li.active:nth-child(7) .icon {background-image:url('../images/sub/business_icon7_on.png');}
.business-step ul li.active:nth-child(8) .icon {background-image:url('../images/sub/business_icon8_on.png');}
.business-step ul li.active:nth-child(9) .icon {background-image:url('../images/sub/business_icon9_on.png');}
.business-step ul li.active:nth-child(10) .icon {background-image:url('../images/sub/business_icon10_on.png');}

.contact {display:flex; font-family: 'IBM Plex Sans KR', sans-serif;}
.contact .info {width:570px}
.contact .sub-title {display:block; margin-bottom:30px;}
.contact .sub-title h2 {width:100%;}
.contact .group {margin-bottom:30px;}
.contact .tit {font-size:20px;line-height:1.4em; color:#000;font-weight:600; margin-bottom:15px;}
.contact .txt {font-size:16px; line-height:1.625em; color:#888;}
.contact .txt-group {display:flex; margin-bottom:15px;}
.contact .txt-group .col {width:50%}
.contact .txt-group .br {display:block; font-size:0; line-height:0;}
.contact .qr-group {display:flex; align-items:flex-end}
.contact .qr-group .qr {margin-right:30px;}
.contact .qr-group .links a {display:inline-block; padding:0 25px; background:#404040; color:#fff; font-size:15px; line-height:52px; height:52px;}
.contact .qr-group .links a:before {content:"";display:inline-block; vertical-align:top; width:15px; height:52px; background:url('../images/bbs/download.png') 50% 50% no-repeat; margin-right:10px;}
.contact .maps {flex:1 1 auto; min-width:0; width:1%; padding-left:100px;}

.root_daum_roughmap {width:100% !important; height:600px !important;}
.root_daum_roughmap .wrap_map {height:600px !important;}