@charset "utf-8";
.overview-items {display: flex; gap: 30px; justify-content: space-between; max-width: 1146px; margin: 0 auto;}
.overview-items .item {max-width:330px; width: 100%;}
.overview-items .img {padding-bottom: 72.73%; background-size: cover; background-position: 50% 50%;}
.overview-items .item .txt {padding: 0 30px;}

.greetings .txt {padding-left: 62px; padding-right: 85px;}
.greetings .desc {position: relative; color: #242424; font-weight: 500; font-size: 18px; padding-left: 63px; padding-top: 37px; padding-right: 40px; line-height: 1.7647em;}
.greetings .desc:before,
.greetings .desc:after {position: absolute; content: ''; width: 39px; height: 34px;}
.greetings .desc:before {left: 0; top: 0; background: url('../images/sub/quotes-left.png') no-repeat center center; background-size: contain;}
.greetings .desc:after {right: 0; bottom: 0;background: url('../images/sub/quotes-right.png') no-repeat center center; background-size: contain;}
.greetings .sign {text-align: right; padding-right: 68px;}
.greetings .photo {position: relative;}
.greetings .photo strong {position: absolute; top: 42%; right: 70px; transform: translateY(-50%); text-align: right;}

.ci-logo .section:not(:last-child) {margin-bottom: 150px;}
.deco-txt {display: flex;}
.deco-txt h2 {display: flex; align-items: center; justify-content: center; position: relative; width: 18%; max-width: 250px; padding-bottom: 25px; text-align: center;}
.deco-txt p {position: relative;flex: 1; padding-bottom: 25px; padding-left: 32px; font-size: 18px;}
.deco-txt h2:before, .deco-txt p:before {position: absolute; content: ''; width: 100%; height: 4px; bottom: 0; left: 0;}
.deco-txt h2:before {background: #ffa133;}
.deco-txt p:before {background: #13235d;}
.ci-imgs {display: flex; justify-content: space-between; max-width: 942px; gap: 30px; margin: 0 auto;}
.ci-imgs .img {width: 240px; height: 240px;}

.history-cnt {position: relative;}
.history-cnt:before {position: absolute; content: ''; bottom: 0; left: 50%; margin-left: -5px; width: 11px; height: 11px; background: #253775; border-radius: 100%;}
.history-cnt:after {position: absolute; content: ''; top: 0; left: 50%; width: 1px; height: 100%; background: #ccc; z-index: -1;}
.history-cnt .item {display: flex; align-items:center; gap: 25px; width: 50%;  transform: translateX(50px); flex-direction: row-reverse; text-align: right; padding-bottom: 38px; font-size: 18px;}
.history-cnt .item:nth-child(odd) {margin-left: auto; transform: translateX(-50px); flex-direction: row; text-align: left;}
.history-year {display: flex; align-items: center; justify-content: center; width: 100px; min-width: 100px; height: 100px; font-size: 22px; font-weight: 700; background: #253775; border-radius: 100%; color: #faa819;}
.history-cnt .item:nth-child(even) .history-list li {display: flex; flex-direction: row-reverse;}
.history-list span {display: inline-block; min-width: 72px; margin-right: 15px;}
.item:nth-child(even) .history-list span {margin-right: 0; margin-left: 15px;}
.history-list li:not(:last-child) {margin-bottom: 2px;}
.history-list li {display: flex; height: 1.5556em;}

.root_daum_roughmap, .root_daum_roughmap .wrap_map {width: 100% !important;}
.root_daum_roughmap .wrap_controllers {display: none;}
.direction-items {display: flex;}
.direction-items h2 {position: relative; padding-right: 70px; margin-right: 70px;}
.direction-items h2:before {position: absolute; content: ''; width: 1px; height: 80px; top: 50%; right: 0; margin-top: -40px; background: #253775;}
.direction-info {display: flex; gap: 60px;}
.direction-info .item {display: flex; align-items: center; gap: 30px;}

.overview .welcome {display: flex; background: #f9f9f9; border: 1px solid #ddd;}
.overview .welcome .img {width: 28.6%; max-width: 400px;}
.overview .welcome .txt {flex: 1; padding: 55px 40px 30px 60px;}
.overview-links .items {display: flex; justify-content:center; gap: 60px; position: relative;}
.overview-links .items:before {position: absolute; content: ''; top: -77px; left: 50%; margin-left: -1px; width: 2px; height: 20px; background: #555;}
.overview-links .btn-detail {font-weight: 500; font-size: 16px; border-radius: 0; width: 100%; border: 1px solid #41548f;}
.overview-links .item:hover .btn-detail {background: #41548f; color: #fff;}
.overview-links .item:hover .btn-detail img {filter: brightness(100);}
.overview-links .item {padding: 38px 45px 33px; border: 1px solid #ddd;}
.overview-links .item h3 {height: 60px; display: flex; justify-content: center; align-items: center;}

.business .deco-txt h2,
.business .deco-txt .desc {padding-top: 35px; padding-bottom: 40px; display: flex; flex-direction: column; justify-content: center;}
.business .deco-txt .desc {padding-left: 22px; position: relative; flex: 1;}
.business .deco-txt h2:before, .business .deco-txt .desc:before {position: absolute; content: ''; width: 100%; height: 4px; top: 0; bottom: auto; left: 0;}
.business .deco-txt .desc:before {background: #253775;}
.business .deco-txt p:before {content: none; color: #444;}
.business .deco-txt p {padding: 0; line-height: 1.5em; display: flex; align-items :center;}
/* .business .deco-txt h2 {align-items: flex-start;} */
.business .desc p:not(:last-child) {margin-bottom: 26px;}

.business .flex-btns {padding-top: 65px; border-top: 1px solid #ddd;}
.flex-btns {display: flex; gap: 15px; justify-content: center;}
.business-btn {display: flex; align-items: center; justify-content: center; gap: 7px; width: 400px; height: 60px; background: #253775; font-size: 20px; font-weight: 700; color: #fff;}

.business-process {display: flex; gap:12px; justify-content: center;}
.business-process .box {display: flex; justify-content: center; align-items: center; max-width: 150px; width: 100%; padding: 10px 4px; border: 1px solid #ddd;}
.business-process .arrow {display: flex; align-items:center;font-size: 24px;}
.business-process.import-process {gap: 5px;}
.business-process.import-process .box {padding: 5px;}

.business-list {display: flex;}
.business-list .item {flex: 1; padding: 10px 30px 45px;}
.business-list .item:not(:last-child) {border-right: 1px solid #253775;}
.business-list .icon {width: 100%; height: 26px; background: url('../images/sub/icon-chk.png') no-repeat center center; background-size: contain;}

.filebox {display: flex;}
