@charset "utf-8";
.page-greetings {gap: 25px 35px;}
.greeting-img {width: 49.231%;}
.greeting-txt {gap: 20px;}

/* History Page */
.history-image {position: relative; z-index:1;}
.history-image:after {content:''; width: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); height: clamp(30px, calc( 40 / var(--inner) * 100vw ), 40px); background: var(--primary-color); border-radius: 100%; border: clamp(8px, calc( 12 / var(--inner) * 100vw ), 12px) solid #fff; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 50%);}
.history-item {position: relative; width: 50%; padding-top: var(--space-120); }
.history-item:after {content: ''; position: absolute; top: calc(var(--space-120) * -1 - 5px); height: 100%; width: 1px; background: #ddd;}
.history-item .year {position: relative; margin-bottom: var(--space-35); font-size: var(--font-size-50); line-height: 1em; color: var(--primary-color); font-weight: 700; white-space: nowrap; }
.history-item .year:after {content: ''; z-index:1; position: absolute; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; background: var(--primary-color); border-radius: 100%;}
.history-item.left { margin-left: auto; padding-left: var(--space-40);}
.history-item.left:after {left: -1px;}
.history-item.left .year:after {left: calc(var(--space-40) * -1 - 7px);}
.history-item.right {padding-right: var(--space-40);}
.history-item.right:after {right: 0;}
.history-item.right .year { order: 1; text-align: right;}
.history-item.right .year:after {right: calc(var(--space-40) * -1 - 6px);}
.history-content {font-size: var(--font-size-18);}
.month-item { display: flex; gap: var(--space-30); align-items: flex-start; }
.month-item:not(:last-child) {margin-bottom: var(--space-15);}
.month-item .month {color: var(--dark-color); font-weight: 700;}
.month-item .desc {flex: 1; }
.history-item.right .month-item .month { order: 2; }
.history-item.right .month-item .desc { order: 1; text-align: right; }
.history-item.left .month-item .month { order: 1; }
.history-item.left .month-item .desc { order: 2; text-align: left; }

.page-direction .sec:not(:last-child) {margin-bottom: var(--space-120);}
.direction-map {height: clamp(350px, calc( 440 / var(--inner) * 100vw ), 440px); margin-bottom: var(--space-40);}
.headoffice-info {gap: 10px 35px;}
.headoffice-info ul {display: flex; gap: 5px var(--space-40);}
.headoffice-info li {display: flex; gap: var(--space-20);}
.headoffice-info li span {gap: var(--space-15)}
.headoffice-info li span:before {content: ''; display: block; width: 6px; height: 6px; background: var(--primary-color);}

.center-list>ul {display: flex; flex-wrap: wrap; margin: calc(var(--space-20) * -1);}
.center-list>ul>li {width: 50%; padding: var(--space-20);}
.center-item {height: 100%; padding: var(--space-50) var(--space-40); border: 1px solid #ddd;}
.center-tit {display: flex; align-items: center; gap: var(--space-15); padding-bottom: var(--space-30); margin-bottom: var(--space-30); border-bottom: 1px solid #ddd}
.center-tit:before {content: ''; display: inline-block; width:24px; height: 24px; background: url('/images/sub/icon-map.png') no-repeat center center; background-size: contain;}
.center-cnt {display: flex; gap: 20px;}
.center-cnt>ul {flex: 1;}
.center-cnt>ul>li {display: flex;}
.center-cnt>ul>li:not(:last-child) {margin-bottom: var(--space-15);}
.center-cnt .img {width: 25.55%;}
.center-cnt li strong {min-width: 95px;}

.page-business .sec {padding-bottom: var(--space-120);}
.page-business .sec-welcome {position: relative; margin-bottom: var(--space-120);}
.page-business .sec-welcome:before {content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 70%; background: #f8f8f8; z-index: -1;}
.page-business h2 {margin-bottom: var(--space-30);}
.process-table {border-top: 1px solid #ddd;}
.business-process {display: flex; border-bottom: 1px solid #ddd;}
.business-process .tit {display: flex; align-items: center; width: 18.5%; background: #F6F6F6; font-size: var(--font-size-22); font-weight: 600;}
.business-process .tit, .business-process ul {padding: var(--space-40);}
.business-process li {text-indent: -10px; padding-left: 10px;}
.business-process li:before {content: '-'; margin-right: 2px;}
.page-business .border-box {padding: var(--space-60) var(--container-space); text-align: center;}

/* Ethics Page */
.page-ethics {display: flex; flex-direction: column; gap: var(--space-40);}
.ethics-txt {display: flex; flex-direction: column; gap: var(--space-20);}
.ethics-txt h2 {font-size: var(--font-size-30); line-height: 1.6; color: var(--dark-color); font-weight: 700;}
.ethics-txt p {font-size: var(--font-size-18); line-height: 1.67; color: #505050;}
.ethics-content {display: flex; flex-direction: column; gap: var(--space-40);}
.ethics-list {display: flex; flex-direction: column; gap: var(--space-40);}
.line-divider {height: 1px; background: url('http://localhost:3845/assets/40732402572551436a32d96fbe1e9dfe8224c93d.svg') no-repeat center; background-size: cover;}
.ethics-declaration {display: flex; flex-direction: column; gap: var(--space-30);}
.declaration-item {display: flex; gap: var(--space-35); align-items: center; font-size: var(--font-size-18); line-height: 1.67;}
.declaration-item .num {color: var(--primary-color); font-weight: 600; flex-shrink: 0;}
.ethics-footer {font-size: var(--font-size-18); line-height: 1.67; color: #505050; font-weight: 600;}
.ethics-footer .highlight {color: var(--primary-color);}

/* Safety Page */
.page-safety {display: flex; flex-direction: column; gap: var(--space-150);}
.safety-intro {display: flex; align-items: flex-start; gap: 20px var(--space-60);}
.safety-intro h2 {font-size: var(--font-size-30); line-height: 1.6; color: var(--dark-color); font-weight: 700;}
.safety-intro p {font-size: var(--font-size-18); line-height: 1.67; color: #505050;}
.safety-goals h3 {font-size: var(--font-size-30); line-height: 1.6; color: var(--dark-color); font-weight: 700; margin-bottom: var(--space-40);}
.goals-list {position: relative; display: flex;}
.goal-item {display: flex; align-items: center;}
.goal-item .wrap{display: flex; flex-direction: column; gap: var(--space-20); align-items: center; text-align: center; width: 135px;}
.goal-item:not(:last-child):after {content: ''; display: block; height: 1px; width: clamp(40px, calc( 120 / var(--inner) * 100vw ), 120px); margin: 0 var(--space-50); background: #ddd;}
.goal-item .num {font-size: 36px; line-height: 0.83; color: #eaeaea; font-weight: 600; text-align: center;}
.goal-divider {height: 4px; width: 30px; background: url('http://localhost:3845/assets/12712c78381285919e622fd52f92ad381b127603.svg') no-repeat center; background-size: cover;}
.goal-item p {font-size: var(--font-size-22); line-height: 1.36; color: #505050; text-align: center;}
.safety-principles h3 {font-size: var(--font-size-30); line-height: 1.6; color: var(--dark-color); font-weight: 700; margin-bottom: var(--space-40);}
.principles-list {display: flex; flex-direction: column; gap: var(--space-60);}
.principle-item {display: flex; gap: var(--space-60); align-items: center;}
.principle-icon {position: relative; display: flex; flex-direction: column; align-items: center; width: clamp(120px, calc( 210 / var(--inner) * 100vw ), 210px); height: clamp(120px, calc( 210 / var(--inner) * 100vw ), 210px);  border-radius: 100%; justify-content: center; gap: var(--space-20); box-shadow: 0 4px 20px rgba(40, 139, 168, 0.25);}
.principle-icon span {font-size: var(--font-size-22); line-height: 1.36; color: #505050; font-weight: 600;}
.principle-item p {font-size: var(--font-size-18); line-height: 1.67; color: #505050; flex: 1;}
.safety-commitment h3 {font-size: var(--font-size-30); line-height: 1.6; color: var(--dark-color); font-weight: 700; margin-bottom: var(--space-40);}
.commitment-image {margin-bottom: var(--space-40);}
.commitment-list {display: flex; flex-direction: column; gap: var(--space-30);}
.commitment-item {display: flex; gap: var(--space-35); align-items: center; font-size: var(--font-size-18); line-height: 1.67;}
.commitment-item .num {color: var(--primary-color); font-weight: 600; flex-shrink: 0;}
.commitment-item p {color: #505050;}
.commitment-footer {font-size: var(--font-size-18); line-height: 1.67; color: #505050; font-weight: 600; margin-top: var(--space-30);}
.commitment-footer .highlight {color: var(--primary-color);}