@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */

#sub .cnt {margin-bottom:70px;}

.doc-tit {position:relative; padding:60px 0 30px 0;}
.doc-tit.flex {display:flex; justify-content:space-between;}
.doc-tit.flex .txt.bg {background:#004ea2;}
.doc-tit.flex .txt {position:relative; font-size:14px; color:#fff; width:196px; line-height:30px; background:#e78034; border-radius:5px; padding-left:20px;}
.doc-tit.flex .txt:before {position:absolute; content:""; width:25px; height:8px; top:50%; margin-top:-2px; right:20px; background:url("/img/landing/sub/sub-arrow.png")50% 50% no-repeat; background-size:contain;}/*
.doc-tit.flex .txt.bg {}
.doc-tit.border h3:after {position:absolute; content:""; height:1px; width:100%; bottom:0; left:0; border:1px solid transparent; border-image-slice:1; border-image: linear-gradient (to right, #00a4e7, #003f8d;} */
.doc-tit.border {border-width:1px; border-style:solid; border-image:linear-gradient(to right, #00a4e7, #003f8d) 1; border-top:0; border-left:0; border-right:0;}
.doc-tit h3:before {position:absolute; content:""; top:65px; left:0; width:20px; height:20px; background:url("/img/landing/sub/doc-tit.png")50% 50% no-repeat; background-size:contain;}
.doc-tit h3 {font-family: 'NanumSquare', sans-serif; font-size:23px; font-weight:800; letter-spacing:-.03em; line-height:1.478em; padding-left:30px;}
.doc-tit.mg {padding:0 0 30px 0; margin-top:-40px;}
.doc-tit.mg h3:before {top:5px;}
.doc-tit.mb {padding:60px 0 0 0;}

.table01 {max-width:1200px; margin:0 auto; width:100%; font-family: 'Noto Sans KR','Open Sans',AppleGothic,helvetica,sans-serif; border-collapse:collapse; border-spacing:0px; font-size:18px; color:#fff; background:#fff; border-top:1px solid #a8a8a8;}
.table01 th {color:#2c2c2c; text-align:center; font-size:16px; padding:15px 20px; background:#f4f4f4; font-weight:500; line-height:1.5em; letter-spacing:-.01em; border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
.table01 td {padding:11px 15px; text-align:center; color:#505050; border:1px solid #dfdfdf; line-height:1.750em; font-size:16px; letter-spacing:-.01em;}
.table01 td.color {font-family:'GmarketSans'; color:#ff0000; font-weight:500;}
.table01 td .bg {display:inline-block; font-family:'GmarketSans'; color:#fff; font-weight:500; border:1px solid #ff0000; background:#ff0000; border-radius:30px; padding:0 13px; line-height:35px;}
.table01 tr th:first-child,
.table01 tr td:first-child {border-left:0;}
.table01 tr th:last-child,
.table01 tr td:last-child {border-right:0;}
.table01 tr.bg-color {font-size:20px; background:#fe9001;}
.table01 tr.bg-color td {border:none; font-size:20px; color:#fff;}

.greetings {background:url("/img/landing/sub/greetings1_m.png")50% 50% no-repeat; background-size:contain; width:100%; height:260px; padding:40px 10px 10px 70px;}
.gree-txts {text-align:center; margin-top:40px;}
.gree-txts .lg-tit {font-family: 'NanumSquare', sans-serif; font-size:30px; font-weight:700; letter-spacing:-.03em; line-height:1.500em;}
.gree-txts .txt {font-family: 'NanumSquare', sans-serif; font-size:18px; color:#454545; letter-spacing:-.03em; line-height:1.722em; margin-top:20px;}

.organization {background:url("/img/landing/sub/organization_img.png")50% 50% no-repeat; background-size:contain; width:100%; height:600px; padding:40px 10px 10px 70px;}

.history {background:url("/img/landing/sub/history-bg.jpg")50% 50% no-repeat; background-size:contain; width:100%; height:260px; padding:40px 10px 10px 70px;}
.history .years {color:#fff; background:#004ea2; max-width:200px; min-height:120px; padding:20px;}
.history .years p {font-family: 'NanumSquare', sans-serif; font-size:30px; font-weight:700; letter-spacing:-.01em; line-height:1.5em; padding-left:45px; text-indent:-45px;}
.history .years p span {font-family: 'NanumSquare', sans-serif; font-size:20px;}
.historys {padding:0 50px;}
.historys .content {position:relative; display:flex; margin-top:60px; border-top:1px solid #ddd; padding-top:40px;}
.historys .content:before {position:absolute; content:""; top:-1px; left:0; width:140px; height:2px; background:#242424;}
.historys .content .cont-box {position:relative; width:40%;}
.historys .content .cont-box .years {position:relative; font-family: 'NanumSquare', sans-serif; font-size:35px; font-weight:800; letter-spacing:-.03em; line-height:1.3em; margin-top:30px; padding-top:30px;}
.historys .content .cont-box .years:before {position:absolute; content:""; left:0; top:0; width:40px; height:3px; background:#004ea2;}
.historys .content .cont-box .txt {font-family: 'NanumSquare', sans-serif; font-size:20px; font-weight:700; letter-spacing:-.03em; line-height:1.5em; margin-top:10px;}
.historys .content .history-list {width:60%;}
.historys .content .history-list ul li {position:relative; font-size:17px; color:#454545; letter-spacing:-.03em; line-height:2.0em; padding-left:10px;}
.historys .content .history-list ul li:before {position:absolute; content:""; width:4px; height:4px; top:15px; left:0; background:#004ea2; border-radius:100%;}


.certification ul {display:flex; flex-wrap:wrap; margin-bottom:-40px;}
.certification ul li {width:20%; padding:0 10px; text-align:center; margin-bottom:40px;}
.certification ul li .img {color:#686868;}
.certification ul li img {display:block; margin:0 auto 10px;}

.root_daum_roughmap {width:100% !important;}

.location-info dl {display:flex; padding:30px 0; border-bottom:1px solid #ddd;}
.location-info dl.bb {border-top:1px solid #ddd;}
.location-info dt {font-size:18px; font-weight:500; width:175px; position:relative;}
.location-info dt img {margin:5px 15px 0 30px;}
.location-info dd {flex:1 1 auto; min-width:0; width:1%; font-size:16px; color:#454545;}
.location-box {margin:35px 0 20px 0;}
.location-box .lg-tit {font-family: 'NanumSquare', sans-serif; font-size:23px; font-weight:700; letter-spacing:-.03em; line-height:1.0em; margin:8px 0 10px 0;}


.certifications {display:flex; align-items:center; border:1px solid #ddd; border-radius:5px; padding:35px 0 35px 40px;}
.certifications.bg {background:#fafafa;}
.certifications .txt-box {padding-left:40px;}
.certifications .txt-box p {color:#454545; letter-spacing:-.03em; line-height:1.750em;}
.certifications .txt-box span {font-size:18px; color:#242424; font-weight:500; margin-bottom:10px;}
.certifications .txt-box .po-color {font-size:16px; color:#004ea2; font-weight:500;}
.certifications .txt-box .point-color {font-size:16px; color:#e78034; font-weight:500;}

.step {background:#fafafa; padding-bottom:70px;}
.step ul {display:flex; justify-content:center; margin-left:-20px; flex-wrap:wrap; margin-top:10px;}
.step ul li {width:calc(16.6666% - 20px); margin-left:20px; text-align:center; border:1px solid #ddd; background:#fff; border-radius:10px; padding-bottom:30px;}
.step .institutions {margin:0 -40px;}
.step .institutions li {position:relative; border:0; margin-left:0; padding:0 40px; width:16.6666%; background:none; text-align:center;}
.step .institutions li .img {position:relative; font-family:'NanumSquare', sans-serif; font-size:18px; color:#454545; font-weight:800; letter-spacing:-.03em;}
.step .institutions li .img:before {position:absolute; content:""; top:50%; right:-50%; margin-right:13.5px; margin-top:-21px; width:21px; height:22px; background:url("../images/sub/sub-next.png")50% 50% no-repeat;}	
.step .institutions li:last-child .img:before {display:none;}
.step .institutions li img {display:block; margin:0 auto 15px;}
.step.wd ul li strong {font-size:14px; font-weight:400;}
.step ul li span {font-family:'Roboto', sans-serif; display:block; width:40px; line-height:38px; color:#fff; font-weight:500; border-radius:100%; text-align:center; margin:0 auto; margin-top:-20px;}
.step ul li:nth-child(even) span {background:#007add;}
.step ul li:nth-child(odd) span {background:#004ea2;}
.step ul li .img {margin:25px 0 20px 0;}
.step ul li .tit {font-weight:500; line-height:1.438em;}
.step.bg {background:none; padding-bottom:0;}
.step .mt {margin-top:50px;}

.effect ul {display:flex; justify-content:center; flex-wrap:wrap; margin:0 -40px; margin-top:40px;}
.effect ul li {text-align:center; padding:0 40px;}
.effect ul li .img {font-family:'NanumSquare', sans-serif; font-size:20px; font-weight:700; letter-spacing:-.03em; line-height:1.5em;}
.effect ul li img {display:block; margin:0 auto 15px;}

.etc ul {display:flex; flex-wrap:wrap; margin:0 -15px;}
.etc ul li {width:33.3333%; padding:0 15px; text-align:center; margin-bottom:40px;}
.etc ul li .tit {display:flex; align-items:center; justify-content:center; position:relative; font-family:'NanumSquare', sans-serif; font-size:18px; color:#fff; font-weight:800; letter-spacing:-.03em; line-height:1.389em; background:rgba(0, 0, 0, 0.6); margin-top:-80px; border-radius:0 0 5px 5px; padding:15px 0; min-height:80px;}

.evaluation ul {display:flex; flex-wrap:wrap; margin-left:-30px; margin-bottom:-30px;}
.evaluation ul li {width:calc(50% - 30px);display:flex; align-items:center; margin-left:30px; display:flex; border:1px solid #ddd; background:#fafafa; border-radius:10px; padding:20px 0 20px 40px; margin-bottom:30px;}
.evaluation ul li .txts {padding-left:30px;}
.evaluation ul li .txts .tit {font-family:'NanumSquare', sans-serif; font-size:20px; color:#ee5f4a; font-weight:800; margin-bottom:10px;}
.evaluation ul li .txts .txt {color:#454545;}

.quick {position:absolute; top:150px; right:90px; width:125px; text-align:center; z-index:90;}
.quick ul {border-radius:10px; border:1px solid transparent; box-shadow:1px 3px 8px rgba(0, 0 ,0 ,0.3);}
.quick ul li {background:#fafafa;}
.quick ul li .ico {display:block; margin:0 auto; width:45px; height:45px; background:url("../images/main/main-link2.png")50% 50% no-repeat; background-size:contain; margin-bottom:15px;}
.quick ul li:hover .ico {background-image: url("../images/main/main-link2_w.png");}
.quick ul li:nth-child(3) .ico {background-image:url("../images/main/main-link3.png");}
.quick ul li:nth-child(3):hover .ico {background-image:url("../images/main/main-link3_w.png");}
.quick ul li:nth-child(4) .ico {background-image:url("../images/main/main-link4.png");}
.quick ul li:nth-child(4):hover .ico {background-image:url("../images/main/main-link4_w.png");}
.quick ul li:nth-child(5) .ico {background-image:url("../images/main/main-link5.png");}
.quick ul li:nth-child(5):hover .ico {background-image:url("../images/main/main-link5_w.png");}
.quick ul li:hover {background:#004ea2;}
.quick ul li:first-child:hover {background:#f9e000;}
.quick ul li:first-child:hover a {color:#454545;}
.quick ul li:hover a {color:#fff;}
.quick ul li:first-child {border-radius:10px 10px 0 0;}
.quick ul li:last-child {border-radius:0 0 10px 10px;}
.quick ul li:last-child a {border-bottom:0;}
.quick ul li a {display:block; padding:20px 0 15px 0; font-size:16px; font-weight:500; color:#454545; line-height:1.3em; letter-spacing:-.03em; border-bottom:1px solid #ddd;}
.quick ul li img {display:block; margin:0 auto 15px;}

/* 유지보수 */
.education ul {display:flex; flex-wrap:wrap; margin:0 -15px; margin-bottom:-40px;}
.education ul li {width:33.3333%; padding:0 15px; margin-bottom:40px;}
.education ul li .tit {display:flex; justify-content:center; align-items:center; font-family:'NanumSquare', sans-serif; font-size:18px; font-weight:800; letter-spacing:-.03em; line-height:1.389em; color:#fff; text-align:center; background:rgba(0, 0, 0, 0.6); height:80px; margin-top:-80px; border-radius:0 0 10px 10px; position: relative;}