@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */

.greetings {position:relative; margin-bottom:70px;}
.greetings .img {text-align:center;}
.greetings .txt {font-size:16px; line-height:1.75em; color:#454545; margin-top:20px; text-align:center;} 
.greetings .txt span {font-weight:500;}
.greetings .txt-img {text-align:center; margin:40px 0 30px;}

.doc-tit {margin-bottom:15px;}
.doc-tit h5 {position:relative; font-size:18px; font-weight:500; letter-spacing:0; line-height:1.333em; padding-left:20px;}
.doc-tit h5:before {position:absolute; content:""; width:11px; height:11px; top:50%; margin-top:-5.5px; left:0; background:url("../images/sub/doc-tit.png")50% 50% no-repeat; background-size:contain;}

.file {display:flex; flex-direction:column; justify-content:center; position:absolute; width:150px; height:150px; background:#c40e1d; border-radius:100%; color:#fff; text-align:center; top:-100px; right:-250px;}
.file p {font-size:17px; font-weight:500; line-height:1.3em; margin-top:10px;}
.history {padding-top:224px; padding-left:60px; margin-bottom:100px; background:url("../images/sub/history.jpg") 100% 0 no-repeat; background-size:contain;}
.history .title {width:200px; display: inline-block; padding: 20px 20px 20px 20px; color: #fff; background:#c40e1d;}
.history .title h3 {font-size:30px; font-weight:400; line-height:1.3em; margin-bottom:12px;}
.history .title p {font-size:20px; font-weight:300; line-height:1.3em; margin-left:53px; text-align:right;}
.history .content {position:relative;}
.history .content:before {content:""; position:absolute; height:100%; left:108px; top:0; bottom:0; width:1px; background:#ddd;}
.history .group {padding-bottom:30px;}
.history .group h3 {float:left;font-family:"Roboto",sans-serif; font-size:22px; font-weight:700; line-height:1.2em; color:#c40e1d;}
.history .group .cnt {margin-left:108px; padding-left:42px; position:relative;}
.history .group .cnt:before {content:""; position:absolute; top:9px; left:-5.5px; width:11px; height:11px; background:#ddd; border-radius:100%;}
.history .group .cnt ul {margin-right:10px;}
.history .group .cnt ul li {position:relative; padding-left:43px; color:#454545; line-height:2.250em;}
.history .group .cnt ul li strong {color:#c40e1d; font-weight:700;}
.history .group .cnt ul li .month {position:absolute; top:0; left:0; font-family:"Roboto",sans-serif; font-size:18px; font-weight:700; color:#454545;}
.history .group .cnt .img {float:right;}
.history .group:first-child {padding-top:38px;} 

.root_daum_roughmap {width:100% !important; height:500px !important;}
.root_daum_roughmap .wrap_map {height:500px !important;}
.location-info dl {position:relative; display:flex; padding:10px 0; border-bottom:1px solid #ddd;}
.location-info dt {position:relative; font-size:16px; font-weight:500; width:220px; text-align:center;}
.location-info dt span {padding:0 5px;}
.location-info dd {flex:1 1 auto; min-width:0; width:1%; font-size:16px; color:#454545;}
.location-info dd span {color:#ce0000;}
.location.mg dl:last-child {padding:20px 0 0;}

.business {display:flex; align-items:flex-end; margin-bottom:200px;}
.business .icos {min-width:233px; padding:30px 0; border:1px solid #ddd; border-radius:5px; text-align:center; background:#f8f8f8;}
.business .icos p {font-size:20px; font-weight:500; letter-spacing:0; margin-top:10px;}
.business .txt-box {padding-left:40px;}
.business .txt-box .tit {color:#454545;}
.business .txt-box .button-flex {display:flex;}
.business .txt-box .btn {display:block; margin-top:40px; width:130px; line-height:43px; background:#454545; margin-right:10px; text-align:center; color:#fff; font-weight:500;}
.business .txt-box .btn.color {background:#c40e1d;}

.donation .tit {font-size:18px; font-weight:500; letter-spacing:0; margin-bottom:10px; margin-top:30px;}
.donation .total {text-align:center; padding:10px 0; font-weight:500;}
.donation .total span {color:#c40e1d;}
.donation-box {background:#f8f8f8; text-align:center; border-radius:0 30px 0 30px; padding:40px 0 50px;}
.donation-box h3 {font-size:20px; font-weight:500; letter-spacing:-.03em; margin-bottom:10px;}
.donation-box h3 span {color:#c40e1d;}
.donation-box p {color:#454545;}
.donation-box p span {color:#c40e1d; font-weight:500;}

.enterprise {position:relative; margin-top:25px;}
.enterprise ul {display:flex; justify-content:center; margin-left:-60px;}
.enterprise ul li {width:calc(20% - 60px); margin-left:60px; text-align:center;}
.enterprise ul li .box {display:flex; flex-direction:column; justify-content:flex-start; width:150px; height:150px; border:1px solid #c40e1d; border-radius:100%; margin:0 auto;}
.enterprise ul li span {font-family:"Roboto",sans-serif; font-weight:500; border-radius:100%; display:block; width:45px; line-height:43px; height:45px; background:#c40e1d; text-align:center; margin:0 auto; color:#fff; margin-top:-25px; margin-bottom:20px;}
.enterprise ul li .tit {font-size:18px; font-weight:500; letter-spacing:-.03em; margin:10px 0 5px;}
.enterprise ul li .txt {color:#454545;}

.star {font-size:15px; color:#454545;}
.star strong {color:#ff0000;}

.pop-contact-info {max-width:830px; min-width:830px; margin:0 auto; background:#fff; overflow:hidden; padding:30px; border:1px solid #c40e1d; border-radius:10px;}
.pop-contact-info.width {max-width:380px; min-width:380px;}
.pop-contact-info.width .txt-box .img-list {width:100%;} 
.pop-contact-info h2 {padding:25px 0; margin:0 40px; color:#242424; font-weight:500; font-size:30px; text-align:center; line-height:1.3em; letter-spacing:0; padding-bottom:25px; border-bottom:1px solid #ddd;}
.pop-contact-info .cnt {padding:50px;}
.pop-contact-info .review-list {display:flex; justify-content:center; margin-bottom:30px;}
.pop-contact-info .review-list.none {margin-bottom:0;}
.pop-contact-info .review-list .img {width:40%;}
.pop-contact-info .review-list .txt-box {width:60%; color: #454545; margin-left:20px; font-family:'Noto Sans KR','Open Sans',AppleGothic,helvetica,sans-serif;}
.pop-contact-info .review-list .txt-box .id-name {font-size:18px; color:#242424; font-weight:500; letter-spacing:-.03em; line-height:1.667em; margin:10px 0;}
.pop-contact-info .lg-txt {font-size:40px; color:#686868; font-weight:700; text-align:center; padding:100px 0;}

.performance-list {display:flex; justify-content:center;}
.performance-list li {width:160px;}
.performance-list li > a {display:block; color:#454545; text-align:center; font-size:18px; font-weight:500; letter-spacing:-.03em; height:48px; line-height:46px; border:1px solid #ddd; border-radius:30px; margin-right:10px;}
/* .performance-list li:first-child > a {background:#c40e1d; color:#fff;} */
.performance-list li.active > a {background:#c40e1d; color:#fff;}

.management h3 {font-size:25px; font-weight:500; margin-bottom:15px; letter-spacing:-.03em; line-height:1.3em;}
.management .colors {color:#c40e1d;}
.management .txt {color:#454545; margin-bottom:30px;}
.management .img-flex {display:flex; margin:0 -10px; margin-bottom:30px;}
.management .img-flex .img {text-align:center; font-size:18px; font-weight:500; padding:0 10px;}
.management .img-flex .img img {margin:0 auto 10px;}
.management .img-flex.mg {padding-bottom:40px; border-bottom:1px solid #ddd;}
.management .list-up ul {margin-bottom:30px;}
.management .list-up ul li span {color:#242424; font-weight:500;}
.management .list-flex {margin-bottom:30px;}
.management .list-flex ul {display:flex; margin-right:-60px; justify-content:center;}
.management .list-flex ul li {position:relative; margin-right:60px;}
.management .list-flex ul li:before {position:absolute; content:""; top:50%; margin-top:-16.5px; right:-40px; width:22px; height:33px; background:url("../images/sub/sub-arrow.png")50% 50% no-repeat; background-size:contain;}
.management .list-flex ul li:last-child:before {display:none;}
.management .list-flex ul li .box {font-size:18px; color:#454545; font-weight:500; letter-spacing:-.03em; display:flex; align-items:center; justify-content:center; width:120px; height:120px; border:5px solid #c40e1d; border-radius:100%;}
.management .note {border:1px solid #ddd; border-radius:10px; padding:10px 15px;}
.management .note h4 {font-weight:500;}
.management .note ul li {color:#454545; padding-left:10px; text-indent:-10px;}
.management .btns {display:block; width:300px; font-size:20px; font-weight:500; line-height:60px; background:#c40e1d; color:#ffff; text-align:center; margin:0 auto; margin-top:30px; border-radius:10px;}



/* 유지보수 */
.sub-info {background:#f6f6f6; padding:50px 0;}
.sub-info .contain {display:flex;}
.sub-info .contain .ceos {width:30%;}
.sub-info .contain .ceos .img img {width:100%;}
.sub-info .contain .ceos .txt-box {display:flex; flex-direction:column; justify-content:center; background:#fff; min-height:220px; padding:0 30px;}
.sub-info .contain .ceos .txt-box h3 {font-size:18px; font-weight:500; letter-spacing:0; margin-bottom:10px;}
.sub-info .contain .ceos .txt-box ul li {color:#454545;}
.sub-info .contain .txt-boxes {width:70%; padding-left:40px;}
.sub-info .contain .txt-boxes h4 {font-size:18px; font-weight:500; letter-spacing:0; line-height:1.333em; margin-bottom:10px;}
.sub-info .contain .txt-boxes .txt {color:#454545; margin-bottom:25px;}

.sub-awards {margin-top:40px;}
.sub-awards-list {display:flex;}
.sub-awards-list ul {width:33.3333%; flex-wrap:wrap;}
.sub-awards-list ul li {padding-left:0.5em; text-indent:-0.5em;}

.organization {display:flex;}
.organization .organization-list {width:33.3333%;}
.organization .organization-list ul li {color:#454545;}

.missions .cnt {margin-bottom:50px;}
.mission ul {display:flex; margin-left:-20px;}
.mission ul li {width:calc(50% - 20px); font-size:20px; font-weight:500; text-align:center; margin-left:20px; color:#fff; height:60px; line-height:60px; border-radius:20px; background:#c40e1d;}
.mission ul li:last-child {background:#665f60;}

.target-wrap ul {display:flex; border-top:3px solid #c40e1d;}
.target-wrap ul li {display:flex; flex-direction:column; justify-content:center; width:25%; text-align:center; border:1px solid #ddd; border-left:0; min-height:300px;}
.target-wrap ul li:first-child {border-left:1px solid #ddd;} 
.target-wrap ul li .tit {font-family:'Batang'; font-size:30px; font-weight:700; padding:25px 0 10px;}

.value {margin-top:30px;}
.value ul {display:flex; justify-content:center;}
.value ul li {position:relative; padding:0 10px;}
.value ul li:before {position:absolute; content:""; width:8px; height:8px; background:#c40e1d; border-radius:100%; top:50%; margin-top:-4px; right:-5px;}
.value ul li:last-child:before {display:none;}
.value ul li .circle {width:180px; height:180px; border-radius:100%; background:#f6f6f6; text-align:center; display:flex; flex-direction:column; justify-content:center;}
.value ul li .circle .tit {font-size:20px; letter-spacing:0; font-weight:500; margin-top:10px;}

.give {display:flex;}
.give li {display: flex; justify-content: center; align-items: center; min-width:150px; border:1px solid #c40e1d; text-align:center; height:44px; color:#221f1f; font-weight:500; margin-right:10px;}
.give.bg li {border-color:#ddd}
.give li.active {background:#c40e1d; color:#fff;}
.give.bg li.active {background:#221f1f;}
.give li a {display:block; width:100%;}


/* 유지보수 */
.major-business {width:100%; max-width:1160px; padding-left:30px; padding-right:30px; margin:0 auto;}

.major-business-flex {display:flex; justify-content:space-between; margin-bottom:80px;}
.major-business-flex .major-business-list .txt {font-size:16px; margin-bottom:15px;}
.major-business-flex .major-business-list ul {margin-bottom:-30px;}
.major-business-flex .major-business-list ul li {display:flex; align-items:baseline; margin-bottom:30px;}
.major-business-flex .major-business-list ul li .num {margin-right:20px; display:inline-block; width:auto; padding:0 15px; background:#c40e1d; height:30px; line-height:28px; border-radius:15px; text-align:center; color:#fff; font-weight:700;}
.major-business-flex .major-business-list ul li .list {font-size:16px; line-height:1.75em;}
.major-business-flex .major-business-list ul li .list .mgt {margin-top:30px;}
.major-business-flex .major-business-list ul li .list span {padding-left:2.5em;}
.major-business-flex .major-business-list ul li .list span.indent {padding-left:3em;}

.major-business-imgs ul {display:flex; margin:0 -5px; margin-bottom:-20px; flex-wrap:wrap;}
.major-business-imgs ul li {width:25%; padding:0 5px; margin-bottom:20px;}
.major-business-imgs .s-txt {font-size:13px; color:#454545; letter-spacing:0; line-height:1.3em; text-align:right; margin-top:5px;}

.major-business-box {margin-top:40px; padding:20px 0; text-align:center; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin-bottom:70px;}
.major-business-box .tit {font-size:16px; line-height:1.500em;}

.support-btn {font-size:16px; font-weight:500; display:block; margin:0 auto; width:130px; height:45px; line-height:45px; text-align:center; color:#fff; background:#c40e1d;}

.organization-wrap {display:flex; justify-content:space-between; padding:60px 100px 60px 70px; border:1px solid #ddd;}

.license-list ul {margin-bottom:-20px;}
.license-list ul li {font-size:18px; text-align:center; font-weight:700; color:#242424; letter-spacing:-.03em; width:150px; height:60px; line-height:60px; background:#f8f8f8; border-radius:10px; margin-bottom:20px;}
.license-list ul li:nth-child(2):hover,
.license-list ul li:nth-child(3):hover,
.license-list ul li:nth-child(5):hover {background:#c40e1d; color:#fff;}


.fancybox-skin {border-radius:10px !important;}

.pop-contact-info .txt-box {display:flex; flex-wrap:wrap; margin-bottom:-50px;}
.pop-contact-info .txt-box .img-list {display:flex; width:50%; margin-bottom:50px;}
.pop-contact-info .txt-box .img-list .tt-box {padding-left:30px; margin-top:20px;}
.pop-contact-info .txt-box .img-list .tt-box .tit {font-size:18px; color:#222; font-weight:700; letter-spacing:-.03em; line-height:1.556em; margin-bottom:30px;} 
.pop-contact-info .txt-box .img-list .tt-box .tit span {position:relative; font-size:16px; color:#222; font-weight:500; letter-spacing:-.03em; padding-left:20px; margin-left:20px;}
.pop-contact-info .txt-box .img-list .tt-box .tit span:before {position:absolute; content:""; width:1px; height:15px; background:#ddd; top:50%; margin-top:-7.5px; left:0;}
.pop-contact-info .txt-box .img-list .tt-box .txt {font-size:15px; color:#222; letter-spacing:-.03em; line-height:2.0em;} 
.pop-contact-info .txt-box .img-list .tt-box .txt strong {font-weight:500;}