@charset "utf-8";
.sec-tit {margin-bottom: var(--space-30);}
.sec-tit .tag {margin-bottom: var(--space-20); font-size: var(--font-size-18); font-weight: 600; line-height: 1em; letter-spacing: .3em; color: var(--secondary-color);}
.sec-tit h3 {font-size: var(--font-size-32); font-weight: 600; line-height: 1.3em; color: var(--dark-color);}
.sec-tit.white-color > * {color: #fff;}
.root_daum_roughmap .wrap_map, .root_daum_roughmap, .direction-map iframe {width: 100% !important; height: 100% !important;}

.page-greetings {max-width: 2800px; margin: 0 auto;}
.page-greetings .contain {display: flex; max-width:calc(50% + 700px + var(--container-space)); padding-left: 0; margin-left: 0;}
.greeting-img {position: relative; width: 56%;}
.greeting-img .bg {height: 100%;}
.greeting-img .bg img {width: 100%; height: 100%; object-fit: cover;}
.greeting-logo {position: absolute; top: var(--space-40); left: var(--space-40);}
.greeting-txt {display: flex; flex-direction: column; justify-content: center; padding: var(--space-80); background: #F4F4F4;}
.greeting-sign {display: flex; align-items: center;}
.greeting-sign img {height: clamp(74px, calc(160 / var(--inner) * 100vw), 160px);}

.overview-table {border-top: 1px solid var(--dark-color);}
.overview-table ul {display: flex;}
.overview-table li {display: flex; flex: 1; gap: 7px var(--space-80); padding: clamp(8px, calc(17 / var(--inner) * 100vw), 17px) var(--space-30); border-bottom: 1px solid #ddd;}
.overview-table li:last-child {flex: none; width: 58%;}
.overview-table li.col-x2 {flex: none; width: 100%;}
.overview-table .tit {width: 76px; font-weight: 600; color: var(--dark-color);}

.sec-philosophy {position: relative; margin-top: var(--space-150); padding-top: 30px; z-index: 1;}
.sec-philosophy:before {content: ''; z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 60%; background: var(--primary-color);}
.philosophy-boxes {display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-20);}
.philosophy-box {display: flex; flex-direction: column; gap: var(--space-30); padding: var(--space-40) 15px; background: #fff; border: 1px solid #ddd;}
.philosophy-box .en-tit {color: var(--secondary-color);}
.philosophy-box .en-tit strong {display: block; margin-bottom: 5px; font-size: var(--font-size-88); line-height: 1em;}
.philosophy-box h4 {font-size: var(--font-size-24); font-weight: 600; line-height: 1.333em; color: var(--dark-color); margin-bottom: var(--space-15);}

.history-header {width: 50%; padding-right: 25px;}
.history-header .since {margin-bottom: calc(var(--space-40) * -1); font-size: var(--font-size-88); font-weight: 700; color: #eee; line-height: 1em;}
.history-header h3 {font-size: clamp(26px, calc(72 / var(--inner) * 100vw), 72px); font-weight: 700; line-height: 1.1667em; color: var(--dark-color);}
.history-list {position: relative; display: flex; flex-direction: column; gap: clamp(20px, calc(60 / var(--inner) * 100vw), 100px); margin-top: clamp(20px, calc(80 / var(--inner) * 100vw), 80px);}
.history-list:before {content: ''; position: absolute; top: 10px; left: 0; width: 1px; height: 100%; background: #ddd;}
.history-item {padding-left: var(--history-gap);}
.history-year {position: relative; margin-bottom: clamp(12px, calc(35 / var(--inner) * 100vw), 35px); font-size: var(--font-size-32); font-weight: 600; color: var(--dark-color);}
.history-year:before {content: ''; position: absolute; top: 50%; left: calc(var(--history-gap) * -1); width: 20px; height: 20px; transform: translate(-50%, -50%); background: url('/images/sub/history-dot.svg') no-repeat center center; background-size: contain;}
.history-item li {display: flex;}
.history-item li:not(:last-child) {margin-bottom: var(--space-20);}
.history-month {width: 80px; font-weight: 600; color: var(--dark-color);}
.history-month:before {content: '•'; color: #CCC; margin-right: 10px;}
.history-cnt {flex: 1 1 auto; min-width: 0;}

.page-license section {padding: var(--space-60) 0}
.page-license section:nth-child(odd) {background: #F4F4F4; border-bottom: 1px solid #ddd;}
.page-license section .contain:not(:last-child) {margin-bottom: var(--space-60);}
.page-license h3 {display: flex; gap: 10px; margin-bottom: var(--space-30); font-size: var(--font-size-32); font-weight: 600; color: var(--dark-color); line-height: 1.2em;}
.page-license h3:before {content: ''; display: block; width: 8px; height: 8px; background: var(--secondary-color);}
.license-list {display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-40);}
.license-list-item {position: relative; display: block; overflow: hidden;}
.license-list-item:before {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 1px solid #ddd; transition: 0.1s;}
.license-list-item:hover:before {border: 3px solid var(--primary-color);}
.license-list-item img {aspect-ratio: 320 / 454; transition: .4s;}
.license-list-item:hover img {transform: scale(1.05);}

.direction-txt {padding: clamp(30px, calc(100 / var(--inner) * 100vw), 100px) var(--space-50); background: var(--primary-color);}
.direction-txt li, .direction-txt li .txt {display: flex; gap: 10px; line-height: 1.5em;}
.direction-txt li:not(:last-child) {margin-bottom: var(--space-15);}
.direction-txt li .icon {display: flex; justify-content: center; align-items: center; width: 1.5em; height: 1.5em; border-radius: 100%; background: rgba(221, 221, 221, 0.25);}
.direction-map {position: relative;}
.direction-shortcuts {display: grid; grid-template-columns: repeat(3, 1fr); position: absolute; top: 0; right: 0; z-index: 1; text-align: center; font-size: 12px; line-height: 1.1667em; font-weight: 700;}
.direction-shortcut {display: flex; flex-direction: column; gap: 8px; padding: 10px var(--space-20);}
.direction-shortcut.tmap {border: 1px solid #ddd; background: #fff; color: var(--dark-color);}
.direction-shortcut.kakaomap {border: 1px solid #FFE600; background: #FFE600; color: #351C1C;}
.direction-shortcut.navermap {border: 1px solid #00C73C; background: #00C73C; color: #fff;}
.btn-copy {display: inline-block; width: 18px; height: 1.5em; margin-left: 5px; border: 0; background: url('/images/sub/icon-copy.svg') no-repeat center bottom; background-size: contain;}

.sec-project-ability {padding: var(--space-100) var(--space-50); margin-bottom: var(--space-120); background: #F0F0F0;}
.sec-project-ability .cnt {display: flex; gap: var(--space-40);}
.sec-project-ability .project-ability-info {display: flex; flex-direction: column; gap: var(--space-40);}
.sec-project-ability .project-ability-info .box {flex: 1 1 auto; border: 1px solid var(--primary-color); padding: var(--space-30); background: #fff; box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.25);}
.sec-project-ability .project-ability-info .items {display: grid; grid-template-columns: repeat(3, 1fr);}
.sec-project-ability .project-ability-info .item:not(:last-child) {border-right: 1px solid #ddd; }
.sec-project-ability .project-ability-info .item {padding: 0 var(--space-15);}
.project-ability-info h4 {margin-bottom: 20px; font-size: var(--font-size-18); font-weight: 600; color: var(--dark-color);}
.project-ability-info h5 {margin-bottom: 10px; font-weight: 400; font-size: var(--font-size-16);}
.project-ability-info .percent {font-size: var(--font-size-16); color: var(--primary-color); margin-bottom: 5px; line-height: 1em;}
.project-ability-info strong {font-size: var(--font-size-22); line-height: 1.2em; font-weight: 600; color: var(--dark-color);}
.project-ability-img img {height: 100%; width: 100%; object-fit: cover;}
.project-ability-img {max-width: 531px; width: 41%;}

.vbox-top {display: none !important;}
.vbox-backdrop {background: rgba(255, 255, 255, 0.5) !important; backdrop-filter: blur(10px) !important;}
.vbox-close svg path {fill: var(--dark-color) !important;}
.vbox-next span, .vbox-prev span {border-top-color: var(--dark-color) !important; border-right-color: var(--dark-color) !important;}