@charset "utf-8";
/* doc.css는 디자인페이지 스타일을 정의합니다. */
.fz18 {font-size:18px !important;}
.fz20 {font-size:20px !important;}
.fz24 {font-size:24px !important;}

.doc-cnt30 {margin-bottom:30px !important;}
.doc-cnt45 {margin-bottom:45px !important;}
.doc-cnt60 {margin-bottom:60px !important;}

.fw500 {font-weight:500 !important;}
.fw600 {font-weight:600 !important;}

.c1 {color:#154c7b !important;}

.greeting {display:flex; position:relative;}
.greeting .col {width:50%;}
.greeting .col-l {color:#242424;}
.greeting .col-l strong {font-size:60px; letter-spacing:-.03em; line-height:1.25em; display:block;}
.greeting .fz24 {color:#000; line-height:1.46em; font-weight:600;}
.greeting p {line-height:1.65em;}
.greeting .last {font-weight:500;}
.greeting .last img {margin:-6px 0 0 20px; vertical-align:middle;}
.greeting .ab-txt {font-size:192px; position:absolute; bottom:-100px; left:0; font-weight:700; line-height:.7em; color:#000; opacity:.03;}

.root_daum_roughmap {width:100% !important;}
.directions .address-info {margin-bottom:30px;}
.directions .address-info .comp {color:#2679ad; font-weight:600; margin-bottom:2px;}
.directions .address-info .addr {color:#242424; font-size:23px; font-weight:600; line-height:1.33em; letter-spacing:-.03em; margin-bottom:5px;}
.directions .address-info .etc {color:#454545;}
.directions .address-info .etc span {display:inline-block; margin-right:16px;}
.directions .address-info .etc span:last-child {margin-right:0;}
.directions .contact-info {border-top:1px solid #ddd; line-height:1.5em;}
.directions .contact-info dl {display:flex; padding:28px 0; border-bottom:1px solid #ddd;}
.directions .contact-info dt {width:180px; padding-left:30px; color:#242424; font-size:1.125em; font-weight:500;}
.directions .contact-info dt svg {vertical-align:middle; margin:-.2em 15px 0 0;}
.directions .contact-info dt path {fill:#2679ad;}
.directions .contact-info dd {flex:1 1 auto; min-width:0; width:1%; color:#454545;}

.business-info {display:flex; align-items:center;}
.business-info .cnt {margin-left:60px; flex:1;}
.business-info ul li {margin-bottom:30px; display:flex;}
.business-info ul li:last-child {margin-bottom:0;}
.business-info ul li strong {width:110px; padding-left:25px; position:relative; font-weight:600; color:#242424;}
.business-info ul li strong:after {position:absolute; content:''; top:50%; transform:translateY(-50%); right:0; background-color:#ddd; width:1px; height:10px;}
.business-info ul li p {padding-left:20px; flex:1;}

.doc-tit {font-size:22px; padding-left:30px; margin-bottom:20px; position:relative; color:#242424;}
.doc-tit:before {width:20px; height:20px; left:0; top:3px; background-image:url('../images/sub/doctit.png'); background-size:contain; background-repeat:no-repeat; position:absolute; content:'';}

.progress {display:flex; text-align:center;}
.progress li {width:20%;}
.progress i {width:200px; height:200px; background-image:url('../images/sub/business-ico1.png'); background-repeat:no-repeat; background-position:50% 50%; display:inline-block; background-size:contain;}
.progress li:nth-child(even) i {background-image:url('../images/sub/business-ico2.png');}
.progress .fz18 {margin:20px 0 10px; font-weight:500; line-height:1.33em; letter-spacing:-.03em;}
.progress p {color:#686868;}

.sub-pad {padding:90px 0;}
.sub-pad.first {padding-top:0;}
.sub-pad.bgc {background-color:#f8f8f8;}

.plan {display:flex;}
.plan .cnt {margin-left:60px; flex:1;}
.plan .group {display:flex; position:relative;}
.plan .group:before {position:absolute; content:''; top:8px; bottom:-8px; left:106px; background-color:#ddd; width:1px;}
.plan .year {font-size:30px; width:100px; letter-spacing:-.03em;}
.plan .year ,.plan .month {font-weight:600; color:#242424;}
.plan .list {flex:1;}
.plan .list ul li {padding:0 0 25px 45px; display:flex; position:relative;}
.plan .list ul li .month {width:56px;}
.plan .list ul li p {flex:1;}
.plan .group:last-child:before {bottom:8px;}
.plan .group:last-child ul li:last-child {padding-bottom:0;}

.business-info ul li strong:before,
.plan .list ul li:before {width:14px; height:14px; top:6px; border:3px solid #3baa92; position:absolute; content:''; left:0; border-radius:100%; background-color:#fff;}

.history .group {padding-bottom:50px; position:relative;}
.history .group:before {content:""; position:absolute; left:50%; margin-left:-1px; top:0; bottom:0; width:1px; background:#ddd; z-index:-1;}
.history .group:last-child {padding-bottom:0;}
.history .group h2 {font-size:40px; margin-top:50px; letter-spacing:-.03em; color:#103073; position:relative;}
.history .group h2:before {width:20px; height:20px; top:4px; background-image:url('../images/sub/hisdot.jpg'); background-size:contain; background-repeat:no-repeat; position:absolute; content:'';}
.history .group ul li {margin-bottom:35px; align-items:center; display:flex; line-height:1.67em;}
.history .group ul li:last-child {margin-bottom:0;}
.history .group ul li .gr {display:flex; flex:1;}
.history .group ul li .month {font-weight:500; color:#242424;}
.history .group ul li p {flex:1;}
.history .group:nth-child(odd) {padding-left:50%;}
.history .group:nth-child(odd) h2,
.history .group:nth-child(odd) ul {padding-left:40px;}
.history .group:nth-child(odd) h2:before {left:-10px;}
.history .group:nth-child(odd) ul li p {margin:0 35px 0 20px;}
.history .group:nth-child(even) {padding-right:50%; text-align:right;}
.history .group:nth-child(even) h2,
.history .group:nth-child(even) ul {padding-right:40px;}
.history .group:nth-child(even) h2:before {right:-10px;}
.history .group:nth-child(even) ul li {justify-content:flex-end;}
.history .group:nth-child(even) ul li p {margin:0 20px 0 35px;}
.history .group:nth-child(even) ul li .gr {order:3;}
.history .group:nth-child(even) ul li .month {order:2;}