@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.blue-txt {color:#0f3d98;}
.green-txt {color:#198fa6;}
/*greeting*/
.greeting{position:relative; }
.greeting:before {content:""; position:absolute; background:#0f3d98; height:320px; width:100%; top:186px;}
.greeting .img img{border:50px solid #f0f0f0;}
.greeting .bg {display:flex; margin-bottom:42px;}
.greeting .txt-wrap {padding-left:55px; color:#fff; padding-top:84px;}
.greeting .txt-wrap .tit {font-size:62px; font-weight:700; letter-spacing:-0.04em; line-height:1.4em; color:#2c2c2c; margin-bottom:95px;}
.greeting .txt-wrap .t1 {font-size:32px; font-weight:500; letter-spacing:-0.04em; margin-bottom:15px;}
.greeting .txt-wrap .t2 {font-size:22px; font-weight:400; line-height:1.909em; margin-bottom:15px;}
.greeting .txt-wrap .t3 {font-size:18px; font-weight:300; letter-spacing:-0.04em; margin-right:26px;}
.greeting .txt-wrap .sign {display:flex; align-items: center;}

.greeting .cnt p {font-size:18px; font-weight:300; line-height:2.111em; letter-spacing:-0.04em; color:#2c2c2c; margin-bottom:30px;}
.greeting .cnt p:last-child {margin-bottom:0;}

/*mission*/
.mission .bg {background:url("../images/sub/mission_bg.png") no-repeat 50% 50%; background-size:contain; margin-bottom:80px;}
.mission .bg .img {text-align:center;}
.mission .cnt {display:flex; flex-wrap:wrap; margin:0 -30px -50px -30px;}
.mission .cnt > div {width:50%; padding:0 30px; text-align:center; margin-bottom:50px;}
.mission .cnt .img {margin-bottom:35px;}
.mission .cnt .txt {font-size:16px; font-weight:300; line-height:2em; color:#878787; letter-spacing:-0.04em;}
.mission .cnt .tit {font-size:28px; font-weight:700; line-height:1.4em; margin-bottom:20px;}

/*history*/
.history .info {display:flex; flex-wrap:wrap; margin-bottom:60px;}
.history .info > div {width:33.333%; border:1px solid #ddd; text-align:center; padding:70px 0; background-repeat:no-repeat; background-position: calc(100% - 40px) calc(100% - 40px);}
.history .info > div:nth-child(-n + 3) {border-bottom:0;}
.history .info > div:not(:last-child) {border-right:0;}
.history .info > div:nth-child(3) {border-right:1px solid #ddd;}
.history .info .tit {font-size:54px; font-weight:700; line-height:1.4em; margin-bottom:20px;}
.history .info .tit span {font-size:14px; font-weight:300; line-height:1.4em; letter-spacing:-0.04em; color:#878787;}
.history .info .sub-txt {font-size:16px; font-weight:500; line-height:1.6em; letter-spacing:-0.04em; color:#2c2c2c;}

.history .info .icon1 {background-image:url("../images/sub/info1.png");}
.history .info .icon2 {background-image:url("../images/sub/info2.png");}
.history .info .icon3 {background-image:url("../images/sub/info3.png");}
.history .info .icon4 {background-image:url("../images/sub/info4.png");}
.history .info .icon5 {background-image:url("../images/sub/info5.png");}
.history .info .icon6 {background-image:url("../images/sub/info6.png");}

.history .cnt h3 {position:relative; text-align:center; font-size:62px; font-weight:700; line-height:1.4em; letter-spacing:-0.04em; color:#2c2c2c; margin-bottom:130px;}
.history .cnt h3:before {content:""; position:absolute; width:1px; height:60px; background:#ddd; left:50%; bottom:-140px;}
.history .cnt h3:after {content:""; position:absolute; width:178px; height:51px; background:url("../images/sub/history.png") no-repeat 50% 50%; bottom:-80px; left:50%; margin-left:-89px;}

.history .cnt .group {position:relative; width:50%; padding-bottom:60px;}
.history .cnt .group:last-child {border:0 !important;}
.history .cnt .group:before {content:""; position:absolute; width:64px; height:64px; border:23px solid #cdd7e9; background:#fff; border-radius:100%;}
.history .cnt .group .year {font-size:36px; font-weight:700; line-height:1.4em; letter-spacing:-0.04em; color:#0f3d98; margin-bottom:18px;}
.history .cnt .group li {display:flex; font-size:17px; font-weight:300; line-height:1.4em; letter-spacing:-0.04em; color:#505050; margin-bottom:8px;}
.history .cnt .group li:last-child {margin-bottom:0;}
.history .cnt .group li  span {display:block; font-size:18px; font-weight:500; color:#2c2c2c;}

.history .cnt .group:nth-child(even) {margin-left:50%; padding-left:60px; border-left:1px solid #ddd;}
.history .cnt .group:nth-child(even)::before {top:-5px; left:-33px;}
.history .cnt .group:nth-child(even) li  span {margin-right:26px;}

.history .cnt .group:nth-child(odd) {text-align:right; padding-right:60px; margin-left:1px; border-right:1px solid #ddd;}
.history .cnt .group:nth-child(odd)::before {top:-5px; right:-33px;}
.history .cnt .group:nth-child(odd) li {flex-direction: row-reverse}
.history .cnt .group:nth-child(odd) li  span {margin-left:26px;}

/*service*/
.service .img {margin-bottom:55px; text-align:center;}
.service p {text-align:center; font-size:34px; font-weight:400; line-height:1.7em; letter-spacing:-0.06em;}
.service span {font-weight:500;}

/*business*/
.business {position:relative; padding-top:180px;}
.business .bg-box {background:#eaeef6; width:100%; min-height:285px; padding-top:165px; margin-bottom:65px; padding-left:15px; padding-right:15px; padding-bottom:40px;}
.business .bg {position:absolute; top:0; left:50%; transform:translateX(-50%); width:90%; max-width:1200px; height:300px; background-size:cover; background-repeat:no-repeat; background-position:50% 50%;}
.business.bis1 .bg {background-image:url("../images/sub/business1.jpg")}
.business.bis2 .bg {background-image:url("../images/sub/business2.jpg")}
.business.bis3 .bg {background-image:url("../images/sub/business3.jpg")}
.business.bis4 .bg {background-image:url("../images/sub/business4.jpg")}
.business.bis5 .bg {background-image:url("../images/sub/business5.jpg")}
.business .bg-box p {text-align:center; font-size:24px; font-weight:500; line-height:1.75em; letter-spacing:-0.04em; color:#2c2c2c;}

.business h3 {font-size:30px; font-weight:500; line-height:1em; letter-spacing:-0.04em; color:#2c2c2c; margin-bottom:22px;}
.business .cnt {display:flex; flex-wrap:wrap; margin-left:-22px; margin-bottom:-20px;}
.business .cnt > div {display:flex; align-items:center; width:calc(50% - 22px); margin-left:22px; margin-bottom:20px; padding-left: 30px; padding-right:10px; min-height:80px; border:1px solid #ddd;}
.business .cnt .check {width:21px; height:20px; background:url("../images/sub/check_icon.png") no-repeat 50% 50%; margin-right:20px;}
.business .cnt p {flex:1 1 auto; min-width:0; width:1%;; font-size:20px; font-weight:400; line-height:1.4em; letter-spacing:-0.04em; color:#2c2c2c;}
.business .cnt span {display:block; font-size:14px; font-weight:300; line-height:1.3em; letter-spacing:-0.04em; color:#a8a8a8;}
.mgt40 {margin-top:40px;}