@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */

#wrapper {overflow:hidden;}

#sub .contain {max-width:1260px;}

.doc-cnt {margin-bottom:70px;}

.sub-tit {text-align:center; color:#333; letter-spacing:-.03em; font-size:40px; font-weight:700; line-height:1.3em; margin-bottom:40px;}

.table-tit {font-size:30px; font-weight:600; color:#333; letter-spacing:-.03em; line-height:1.667em; margin-bottom:10px;}

.ui-table {width:100%; border-collapse:collapse; border-spacing:0px; color:#505050; border-top:1px solid #242424;} 
.ui-table th {font-size:16px; border-top:0; font-weight:600; height:50px; background:#f1f1f1; border:1px solid #ddd; color:#333; text-align:center;}  
.ui-table td {font-size:16px; color:#454545; border:1px solid #ddd; text-align:center; height:50px; line-height:1.556em; padding:10px 15px;} 
.ui-table td.bg {background:#fafafa;}
.ui-table td.left {text-align:left; padding-left:25px;}
.ui-table th:first-child,
.ui-table td:first-child {border-left:0; border-top:0;}
.ui-table th:nth-child(2),
.ui-table td:nth-child(2) {border-top:0;}
.ui-table th:last-child,
.ui-table td:last-child {border-right:0; border-top:0;}

.greetings {text-align:center; padding:100px 0;}
.greetings.none {padding:0;}
.greetings .greetings-tit {font-size:38px; color:#242424; letter-spacing:-.03em; line-height:; font-weight:600;}
.greetings .greetings-line {padding:45px 0;}
.greetings .greetings-line .line-img {}
.greetings .greetings-txt {font-size:18px; letter-spacing:-.03em; line-height:1.556em; color:#454545;}
.greetings .greetings-txt strong {}
.greetings .greetings-txt span {color:#354197; font-weight:600;}
.greetings .greetings-txt span.bold {font-weight:700;}
.greetings .greetings-list {margin:100px 0;}
.greetings .greetings-list ul {display:flex;}
.greetings .greetings-list ul li {width:25%; padding:0 15px; text-align:center;}
.greetings .greetings-list ul li .img {}
.greetings .greetings-list ul li .tit {margin-top:20px; font-size:20px; font-weight:600; color:#333; letter-spacing:-.03em; line-height:;}

.greeting-bg {margin-bottom:160px;}
.greeting-bg .img {width:100%;}
.greeting-bg .img img {width:100%;}
.greeting-bg .txt-box {display:flex; justify-content:center; align-items:flex-end; position:relative; background:#fff; min-height:100px; text-align:center; width:100%; max-width:1200px; margin:0 auto; margin-top:-100px;}
.greeting-bg .txt-box:before {position:absolute; content:""; background:url('../images/sub/greeting-txt.png')50% 50% no-repeat; background-size:contain; width:262px; height:59px; top:0; left:25px;}
.greeting-bg .txt-box p {display:inline-block; position:relative; font-size:30px; font-weight:500; letter-spacing:-.03em; color:#333; padding-top:7px; padding-left:7px;}
.greeting-bg .txt-box p:before {position:absolute; content:""; width:7px; height:7px; background:#354197; border-radius:50%; top:0; left:0;}

.business {background:#f8f8f8; padding:100px 0;}
.business .business-list {display:flex; margin-left:-30px;}
.business .business-list ul {width:49%; display:flex;}
.business .business-list ul:last-child {width:51%; flex-wrap:wrap; margin:0 -15px; margin-bottom:-30px; margin-left:0;}
.business .business-list ul:last-child li {width:50%; padding:0 15px; margin-bottom:30px;}
.business .business-list ul li {}
.business .business-list ul li .imgs {}

.contact {margin-top:150px;}
.contact .location-wrap {margin-bottom:80px;}
.contact .location-wrap .map {}
.contact .location-wrap .location {height:80px; line-height:80px; border-bottom:1px solid #ddd;}
.contact .location-wrap .location dl {display:flex;}
.contact .location-wrap .location dl dt {min-width:155px; font-size:16px; font-weight:600; letter-spacing:-.03em; color:#333;}
.contact .location-wrap .location dl dt span img {vertical-align:middle; margin-right:8px;}
.contact .location-wrap .location dl dd {font-size:20px; font-weight:600; color:#333; letter-spacing:-.03em;}
.contact .location-wrap .location dl dd strong {color:#354197;}

.map .root_daum_roughmap {width:100% !important; height:300px !important;}
.map .root_daum_roughmap .wrap_map {height:300px !important;}

.contact-list {display:flex; align-items:center; justify-content:center; background:#354197; min-height:150px; border-radius:10px; padding:0 90px;}
.contact-list ul {width:100%; display:flex; margin:0 -60px;}
.contact-list ul li {position:relative; width:33.3333%; display:flex; color:#fff; padding:0 60px;}
.contact-list ul li:before {position:absolute; content:""; width:5px; height:5px; background:#ccc; border-radius:50%; top:50%; margin-top:-2.5px; right:0;}
.contact-list ul li:last-child:before {display:none;}
.contact-list ul li .ico-wrap {min-width:80px; display:flex;}
.contact-list ul li .ico-wrap .ico {font-size:16px; font-weight:600; letter-spacing:-.03em;}
.contact-list ul li .ico-wrap .ico img {vertical-align:middle; margin-right:7px;} 
.contact-list ul li .num {}

.historys {text-align:center; padding:100px 0;}
.history-bg {} 
.history-bg h3 {font-size:22px; color:#333; font-weight:600; letter-spacing:-.03em; line-height:1.3em;}

.history {position:relative; background:#f7f8fb; margin-top:50px;}
.history:before {position:absolute; content:""; width:1618px; height:670px; background:url('../images/sub/his-bg.png')50% 50% no-repeat; background-size:contain; top:50%; margin-top:-335px; left:50%; margin-left:-809px;}
.history .logo img {border-radius:50%;}
.history .group {position:relative;}
.history .group:before {content:""; position:absolute; top:-30px; height:130%; left:50%; bottom:0; width:1px; background:#ddd;}
.history .group:last-child:before {display:none;}
.history .group .inner {display:flex; align-items:baseline; position:relative; padding-bottom:70px;}
.history .group .bullet:after {position:absolute; content:""; width:48px; height:48px; top:30px; margin-top:-35px; left:50%; margin-left:-24px; background:url("../images/sub/dots.png")50% 50% no-repeat; background-size:contain;}
.history .group:nth-child(even) .bullet:after {background-image: url('../images/sub/dots2.png');}
.history .group h3 {color:#333; font-size:22px; line-height:1.3em; font-weight:600; text-align:left;}
.history .group ul {margin-bottom:-12px;}
.history .group ul li {display:flex; position:relative; color:#505050; font-size:18px; font-weight:400; line-height:1.3em; letter-spacing:-.02em; margin-bottom:12px;}
.history .group ul li .day {padding-left:50px; font-weight:600; color:#981515; font-size:20px; padding-right:18px; margin-top:3px;}
.history .group:last-child {padding-bottom:0;}
.history .group:nth-child(even) h3 {text-align:right;}
.history .group:first-child {margin-top:50px;}
.history .group:nth-child(odd) .inner {margin-left:50%; padding-left:50px;}
.history .group:nth-child(odd) .bullet:after {left:0;}
.history .group:nth-child(odd) .bullet:before {left:0;}
.history .group:nth-child(odd) ul li .day {left:0;}
.history .group:nth-child(odd) p {font-size:20px; text-align:left; line-height:1.5em; font-weight:500; color:#333;} 
.history .group:nth-child(even) p {font-size:20px; font-weight:500; line-height:1.5em; color:#333;}
.history .group:nth-child(even) {text-align:right;}
.history .group:nth-child(even) .inner {flex-direction:row-reverse; margin-right:50%; padding-right:50px;}
.history .group:nth-child(even) .bullet:after {left:100%;}
.history .group:nth-child(even) .bullet:before {right:0}
.history .group:nth-child(even) ul li {flex-direction: row-reverse; }
.history .group:nth-child(even) ul li .day {padding:0 50px 0 18px; color:#122686;}
.history .group .sb {font-size:16px; color:#878787;}

.introduce {}
.introduce .introduce-list {margin-bottom:130px;}
.introduce .introduce-list ul {}
.introduce .introduce-list ul li {display:flex; align-items:center; margin-top:100px;}
.introduce .introduce-list ul li:last-child {flex-direction:row-reverse;}
.introduce .introduce-list ul li:last-child .txt-box {padding-left:0; padding-right:90px;}
.introduce .introduce-list ul li .img {width:50%;}
.introduce .introduce-list ul li .txt-box {width:50%; padding-left:90px;}
.introduce .introduce-list ul li .txt-box .tit {font-size:30px; font-weight:600; color:#333; letter-spacing:-.03em; line-height:1.667em;}
.introduce .introduce-list ul li .txt-box .txt {font-size:18px; color:#333; letter-spacing:-.03em; line-height:1.667em; margin-top:23px;}
.introduce .introduce-list ul li .txt-box .txt strong {font-weight:600;}
.introduce .introduce-list ul li .txt-box .txt span {color:#354197; font-weight:600;}

.introduce-tit {font-size:26px; font-weight:500; color:#333; text-align:center; margin-bottom:150px;}
.introduce-tit.none {margin-bottom:0;}
.introduce-tit.mb {margin-bottom:20px;}
.introduce-tit strong {color:#122686;}
.introduce-tit span img {display:inline-block; margin-top:-20px; padding:0 15px;}
.introduce-tit p {margin:10px 0 25px; font-size:22px; font-weight:500; letter-spacing:-.03em; line-height:;}
.introduce-tit p.fz {font-size:20px; font-weight:400;}
.introduce-tit p.fz strong {color:#454545;}
.introduce-tit p.fz strong.bold {font-weight:700; color:#242424;}
.introduce-tit p strong {font-weight:600;}
.introduce-tit .s-tt {font-size:18px; color:#333; letter-spacing:-.03em; line-height:1.556em;}

.introduce-bg {text-align:center; margin-bottom:130px; margin-top:150px;}
.introduce-bg .img {}
.introduce-bg .tit {font-size:20px; color:#454545; letter-spacing:-.03em; line-height:1.800em; margin-top:40px;}
.introduce-bg .tit strong {}

.certification {}
.certification .certification-list {}
.certification .certification-list ul {display:flex; justify-content:center; margin:0 -15px;}
.certification .certification-list ul li {width:16.6666%; padding:0 15px;}
.certification .certification-list ul li .img {} 

.mb {}
.mb .img {margin-bottom:60px;}

.color-wrap {border-top:1px solid #242424;}
.color-wrap .color-list {}
.color-wrap .color-list ul {}
.color-wrap .color-list ul li {width:100%; display:flex; align-items:center; padding:30px 0 20px; border-bottom:1px solid #ddd;}
.color-wrap .color-list ul li .tit {min-width:150px; font-size:30px; font-weight:600; color:#333; letter-spacing:-.03em; line-height:1.667em;}
.color-wrap .color-list ul li .list {width:87.5%; display:flex; margin:0 -20px;}
.color-wrap .color-list ul li .list .img-wrap {width:20%; padding:0 20px;}
.color-wrap .color-list ul li .list .img-wrap .img {}
.color-wrap .color-list ul li .list .img-wrap .txt {text-align:center; font-size:20px; color:#333; letter-spacing:-.03em; line-height:1.3em; font-weight:500; margin-top:10px;}

.functional {}
.functional .functional-list {}
.functional .functional-list ul {border-top:1px solid #242424; border-bottom:1px solid #ddd;}
.functional .functional-list ul li {display:flex; align-items:center; padding-left:35px; height:100px;}
.functional .functional-list ul li:nth-child(even) {background:#f1f1f1;}
.functional .functional-list ul li .tit {min-width:180px; font-size:18px; font-weight:600; color:#333;}
.functional .functional-list ul li .tit span {}
.functional .functional-list ul li .txt {font-size:18px; color:#454545; letter-spacing:-.03em; line-height:1.667em;}

.field {margin-bottom:-70px;}
.field .field-list {display:flex; margin-bottom:70px;}
.field .field-list:nth-child(even) {flex-direction:row-reverse;}
.field .field-list:nth-child(even) .txt-box {flex-direction:row-reverse; padding-right:0; padding-left:60px;}
.field .field-list:nth-child(even) .txt-box .tt-box {text-align:left;}
.field .field-list:nth-child(even) .txt-box .tt-box .tit {padding-left:0; padding-right:5px;}
.field .field-list:nth-child(even) .txt-box .tt-box .tit:before {left:auto; right:0;}
.field .field-list .txt-box {width:41.7%; display:flex; padding-right:60px;}
.field .field-list .txt-box .num {font-size:180px; font-weight:500; opacity:0.05; letter-spacing:0; line-height:0.6em;}
.field .field-list .txt-box .tt-box {text-align:right;}
.field .field-list .txt-box .tt-box .tit {display:inline-block; position:relative; font-size:30px; font-weight:600; color:#333; letter-spacing:-.03em; line-height:1.533em; padding-left:5px; padding-top:5px; margin-bottom:50px;}
.field .field-list .txt-box .tt-box .tit:before {position:absolute; content:""; width:7px; height:7px; background:#354197; border-radius:50%; top:0; left:0;}
.field .field-list .txt-box .tt-box .txt {font-size:18px; color:#354197; letter-spacing:-.03em; font-weight:600; line-height:1.3em; margin-bottom:20px;}
.field .field-list .txt-box .tt-box .list {}
.field .field-list .img-list {display:flex; margin-right:-10px;}
.field .field-list .img-list .img {margin-right:10px;}










