@charset "utf-8";
.root_daum_roughmap .wrap_map, .root_daum_roughmap, .direction-map iframe {width: 100% !important; height: 100% !important;}
.deco-tit {position: relative; width: fit-content; margin-bottom: var(--space-60); padding-top: 10px; font-size: var(--font-size-32); font-weight: 600; color: var(--dark-color); line-height: 1em;}
.deco-tit.white-color {color: #fff;}
.deco-tit:after {content: ''; position: absolute; bottom: 100%; right: 0; width: 6px; height: 6px; background: var(--primary-color); border-radius: 100%;}
.group-tit .deco-tit {margin-bottom:  var(--space-30);}

.page-greetings .full-img {margin-bottom: var(--space-60); border-radius: var(--radius-16); overflow:hidden;}
.greeting-cnt {gap: 25px 35px;}
.greeting-cnt h3 {font-size: var(--font-size-40); font-weight: 400; line-height: 1.45em; color: var(--dark-color);}
.greeting-cnt .desc {width: 50%;}

.page-vision .deco-tit, .page-infra .deco-tit {margin-left: auto; margin-right: auto;}
.page-vision section:not(:last-child), .page-infra section:not(:last-child) {margin-bottom: var(--space-120);}
.sec-vision {padding: var(--space-150) 0; background: url('/images/sub/bg-vision.jpg') no-repeat center center / cover;}

.philosophy-cnt {gap: 25px var(--space-60);}
.philosophy-img {border-radius: var(--radius-16); overflow:hidden; max-width: 585px; width: 41.8%;}
.philosophy-txt h4 {position: relative; padding-bottom: var(--space-40); margin-bottom: var(--space-40); border-bottom: 2px solid #ddd;}
.philosophy-txt h4:after {content: ''; position: absolute; left: 0; bottom: -2px; width: var(--header-height); height: 2px; background: var(--primary-color);}
.ideology-cards {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-25);}
.ideology-card {display: flex; flex-direction: column; justify-content:space-between; gap: clamp(15px, calc(40 / var(--inner) * 100vw), 100px); padding: var(--space-40); border-radius: var(--radius-16); background: url('/images/sub/bg-ideology.jpg') no-repeat center center / cover; color: #fff;}
.ideology-card .icon {text-align: right;}
.ideology-card h4 {margin: var(--space-20) 0 var(--space-10); font-size: var(--font-size-20); font-weight: 600; line-height: 1.2em;}
.ideology-card p {font-size: var(--font-size-24); font-weight: 600; line-height: 1.2em;}

.page-history {display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 25px 35px;}
.page-history .head {flex: 1; min-width: 0;}
.page-history .tit {margin: 0; font-size: var(--font-size-40); font-weight: 600; line-height: 1.45; letter-spacing: -0.03em; color: var(--dark-color);}
.page-history .tit .brand {color: var(--primary-color);}
.page-history .tit .reg {font-weight: 400;}
.page-history .tit .em {font-weight: 600;}
.page-history .timeline { max-width: 831px; width: 70%; margin: 0; padding: 0; list-style: none;}
.page-history .timeline .block {display: flex; flex-wrap: wrap; align-items: flex-start; gap: 8px clamp(20px, calc(50 / var(--inner) * 100vw), 100px); padding: clamp(15px, calc(55 / var(--inner) * 100vw), 55px) 0; border-top: 1px solid #ddd;}
.page-history .timeline .block:first-child {padding-top: 0; border-top: 0;}
.page-history .yr {display: flex; flex-direction: column; align-items: flex-end; gap: 4px; flex: 0 0 78px; width: 78px; max-width: 100%;}
.page-history .dot {display: block; width: 6px; height: 6px; border-radius: 50%; background: var(--primary-color);}
.page-history .num {font-size: var(--font-size-32); font-weight: 600; line-height: 1; letter-spacing: -0.03em; color: var(--dark-color); text-align: right;}
.page-history .events {display: flex; flex-direction: column; gap: var(--space-25); flex: 1 1 0; min-width: 0; padding-top: 10px;}
.page-history .row {display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-20);}
.page-history .mo {flex: 0 0 26px; width: 26px; font-size: var(--font-size-20); font-weight: 600; letter-spacing: -0.03em; color: var(--dark-color);}
.page-history .txt {flex: 1 1 0; min-width: 0; margin: 0; font-size: var(--font-size-18); line-height: 1.56; letter-spacing: -0.03em;}

.page-directions {gap: 25px clamp(35px, calc(50 / var(--inner) * 100vw), 120px);}
.direction-txt h3 {position: relative; border-bottom: 2px solid #ddd; padding-bottom: clamp(10px, calc(50 / var(--inner) * 100vw), 50px); margin-bottom: clamp(10px, calc(50 / var(--inner) * 100vw), 50px);}
.direction-txt h3:before {content: ''; position: absolute; left: 0; bottom: -2px; width: var(--header-height); height: 2px; background: var(--primary-color);}
.direction-info ul {display: flex; flex-direction: column; justify-content: space-between; gap: var(--space-50); height: 100%;}
.direction-info li {display: flex; align-items: flex-start;}
.direction-info li .tit {display: flex; align-items: center; gap: 10px; min-width: 120px;}

.business-welcome .contain {max-width: 1780px;}
.business-full-img {border-radius: var(--radius-16); overflow:hidden; margin-bottom: var(--space-80);}
.business-body .contain {display: flex; justify-content: space-between; gap: 0 35px;}
.business-body .business-cnt {max-width: 1080px; width: 78%;}
.business-body .btn-arrow {margin-left: auto;}

.page-infra .layout-cnt {position: relative; border-radius: var(--radius-16); overflow:hidden;}
.page-infra .layout-cnt .txt {position: absolute; left: 0; bottom: 0; width: 100%; padding: var(--space-40);}
.page-infra .function-cnt {display: flex; justify-content: space-between; gap: 25px 35px;}
.page-infra .function-img {position: relative; max-width: 641px; width: 45.8%; border-radius: var(--radius-16); overflow:hidden;}
.page-infra .function-img img {position: absolute; height: 100%; width: 100%; object-fit: cover;}
.page-infra .function-list {max-width: 698px;}
.page-infra .function-list ol {display: flex; flex-direction: column; gap: var(--space-20);}
.page-infra .function-list li {display: flex; align-items: center; gap: var(--space-15); padding: var(--space-30); border: 1px solid #ddd; border-radius: var(--radius-16);}
.page-infra .function-list .num {display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border-radius: 100%; background: var(--primary-color); font-weight: 600; color: #fff;}

.expectation-circles {display: flex; justify-content: center; gap: clamp(20px, calc(50 / var(--inner) * 100vw), 100px);}
.expectation-circles .item {position: relative; display: flex; flex-direction: column; gap: 10px; justify-content: center; align-items: center; width: 230px; height: 230px; border-radius: 100%; background: #328EEA;}
.expectation-circles .item:before {content: ''; position: absolute; top: calc(var(--space-15) * -1); bottom: calc(var(--space-15) * -1); left: calc(var(--space-15) * -1); right: calc(var(--space-15) * -1); border-radius: 100%; background: inherit; z-index: -1; opacity: .2;}
.expectation-circles .item:nth-child(2) {background: #19B1E7;}
.expectation-circles .item:nth-child(3) {background: #26CAD7;}
.expectation-circles p {font-size: var(--font-size-20); font-weight: 600; line-height: 1.4em;}