@charset "utf-8";
.space-top {padding-top: var(--space-150);}
.space-bottom {padding-bottom: var(--space-150);}
.hyphen-list li {text-indent: -.8em; padding-left: 0.8em;}
.hyphen-list li:not(:last-child) {margin-bottom: 4px;}
.hyphen-list li:before {content: '-'; margin-right: 5px;}
.dot-list li:before {content: '•'; margin-right: 10px; font-weight: 900; color: #ccc;}
.dot-list.small li:before {content:'·'; font-weight: 400;}
.bg-gray{background: #F9F9F9;}

/* about */
.about-greeting {display: flex; justify-content: space-between; gap: clamp(30px, calc(70 / var(--inner) * 100vw), 70px);}
.greeting-left {gap: 30px;}
.greeting-title p {margin: 0;}
.greeting-img {width: clamp(300px, calc(372 / var(--inner) * 100vw), 372px);}
.greeting-img img {width: 100%; height: auto;}
.greeting-right {width: 50%; gap: var(--space-50);}
.greeting-sign {gap: 20px;}
.greeting-sign .sign-name {font-family: 'Nanum SonPyeonJiCe'; font-size: clamp(44px, calc(56 / var(--inner) * 100vw), 56px);}
.signature img {height: clamp(30px, calc(43 / var(--inner) * 100vw), 43px);}
.sec-imu {background: #F9F9F9;}

#vision {display: flex;}
.vision-group {position: relative; flex: 1; display: flex; align-items: center; justify-content: center; background: #EBE9E5; min-height: clamp(500px, calc(980 / var(--inner) * 100vw), 980px);}
.vision-leaf {position: absolute; left: 0; bottom: 0; width: clamp(300px, calc(400 / var(--inner) * 100vw), 400px);}
.vision-desc {line-height: 1.75em;}
.philosophy-group {position: relative; flex: 1; display: flex; align-items: center; justify-content: center;}
.philosophy-bg {position: absolute; inset: 0; background: url('/images/sub/bg-philosophy.jpg') no-repeat center center / cover; z-index: 0;}
.philosophy-group .contain {position: relative; z-index: 1; display: flex; flex-direction: column;}
.philosophy-list {display: flex; flex-direction: column; gap: var(--space-70);}
.philosophy-item {display: flex; gap: 10px var(--space-40); align-items: center;}
.philosophy-num {display: flex; gap: var(--space-40); font-size: clamp(34px, calc(56 / var(--inner) * 100vw), 56px); line-height: 1em;}
.philosophy-num:after {content: ''; display: block; width: 1px;  background: rgba(255,255,255,0.5);}
.philosophy-txt .desc {color: rgba(255,255,255,0.7);}

.root_daum_roughmap .cont {display: none;}
.root_daum_roughmap .wrap_map, .root_daum_roughmap {width: 100% !important; height: 100% !important;}
.direction-map {height: clamp(270px, calc(550 / var(--inner) * 100vw), 550px); border-radius: var(--radius-40); overflow: hidden;}
.info-list {width: 64.286%;}
.info-item {padding: var(--space-35) 0; border-top: 1px solid var(--dark-color);}
.info-item:last-child {border-bottom: 1px solid var(--dark-color);}
.info-buses {display: flex; gap: clamp(35px, calc(150 / var(--inner) * 100vw), 267px);}
.bus-group {flex: 1; display: flex; flex-direction: column; gap: var(--space-15);}
.bus-items {display: flex; flex-direction: column; gap: var(--space-10);}
.bus-item {display: flex; gap: var(--space-20); align-items: center;}
.bus-badge {display: inline-block; padding: 5px 10px; border-radius: 4px; font-size: var(--font-size-12); line-height: 1em; font-weight: 700; color: #fff;}
.badge-normal {background: #00AFBD;}
.badge-village {background: #47AF1B;}
.bus-number {font-size: var(--font-size-16); color: #505050;}

/* department */
.welcome-cnt .contain {max-width: calc(50% + 730px); padding-right: 0; margin-right: 0;}
.welcome-img {max-width: 1080px; width: 59.934%; border-radius: 800px 0 0 800px; overflow: hidden;}
.sec-internal-custom {position: relative; background: #F9F9F9; z-index :1;}
.sec-internal-custom:before {content:''; z-index: -1; position: absolute; left: 0; top: 0; bottom: 0; width: 50%; background: url('/images/sub/bg-internal-custom.jpg') no-repeat center center / cover;}
.sec-internal-custom .main-why-menu ul li {width: 100%;}
.internal-custom-slide h3 {width: fit-content; padding: var(--space-20) var(--space-50); margin-left: auto; margin-right: auto; background: var(--primary-color); border-radius: 100px; font-size: var(--font-size-24); line-height: 1em; font-weight: 700; color: #fff;}
.internal-custom-img {width: fit-content; margin-left: auto; margin-right: auto; padding: clamp(30px, calc(65 / var(--inner) * 100vw), 65px); background: #fff; border-radius: 100%;}
.internal-custom-img img {height: clamp(70px, calc(150 / var(--inner) * 100vw), 150px);}
.internal-custom-slide .dot-list {display: flex; flex-wrap: wrap; gap: 7px 0;}
.internal-custom-slide .dot-list li {width: 33.3335%; padding-right: 5px;}
.disease-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-20);}
.disease-item {display: flex; flex-direction: column; border-radius: var(--radius-16); overflow: hidden; background: #CFDEDB;}
.disease-item:nth-child(even) .disease-txt {background: #EBE9E5;}
.disease-img {aspect-ratio: 335/251; overflow: hidden;}
.disease-img img {width: 100%; height: 100%; object-fit: cover;}
.disease-txt {flex:1; display: flex; flex-direction: column; gap: var(--space-20); align-items: center; justify-content: center; text-align: center; padding: clamp(30px, calc(50 / var(--inner) * 100vw), 50px) clamp(15px, calc(30 / var(--inner) * 100vw), 30px);}
.disease-txt h3 {margin: 0;}
.disease-desc {font-size: var(--font-size-16); line-height: 1.5em; color: #505050;}
.disease-desc p {margin: 0;}

.sec-internal-process {background: #F4F4F4;}
.process-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(10px, calc(20 / var(--inner) * 100vw), 20px); align-items: center;}
.process-item {position: relative; aspect-ratio: 342/355;}
.process-item:not(:last-child)::after {content: ''; position: absolute; right: clamp(-24px, calc(-48 / var(--inner) * 100vw), -48px); top: 50%; transform: translateY(-50%); width: clamp(40px, calc(56 / var(--inner) * 100vw), 56px); height: clamp(40px, calc(56 / var(--inner) * 100vw), 56px); background: #eee url('/images/sub/arrow-right.svg') no-repeat center center; border-radius: 100%; box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.20); z-index: 2;}
.process-img {position: absolute; inset: 0; overflow: hidden; border-radius: var(--radius-24);}
.process-img img {width: 100%; height: 100%; object-fit: cover;}
.process-overlay {position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.5) 100%);}
.process-content {position: absolute; width: 100%; padding: var(--space-40) var(--space-30); left: 0; bottom: 0; display: flex; flex-direction: column; gap: var(--space-20); z-index: 1;}
.process-badge {display: inline-block; width: fit-content; padding: 7px clamp(8px, calc(10 / var(--inner) * 100vw), 10px); background: rgba(255,255,255,0.2); border-radius: 24px; font-weight: 600; color: #fff; line-height: 1em; font-family: 'NanumMyeongjo';}
.process-text {min-height:2.6em;}

.different-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(15px, calc(25 / var(--inner) * 100vw), 25px); align-items: start;}
.different-item {position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;}
.different-item:not(:last-child)::after {content: ''; position: absolute; right: 0; top: clamp(150px, calc(183 / var(--inner) * 100vw), 183px); width: clamp(20px, calc(32 / var(--inner) * 100vw), 32px); height: clamp(2px, calc(5 / var(--inner) * 100vw), 5px); background: rgba(13, 89, 77, 0.5); transform: translateX(100%) rotate(-45deg) ; z-index: 1;}
.different-img {width: clamp(250px, calc(350 / var(--inner) * 100vw), 350px); height: clamp(250px, calc(350 / var(--inner) * 100vw), 350px); border-radius: clamp(125px, calc(175 / var(--inner) * 100vw), 175px) clamp(125px, calc(175 / var(--inner) * 100vw), 175px) 0 0; overflow: hidden; box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.1); margin-bottom: var(--space-40);}
.different-img img {width: 100%; height: 100%; object-fit: cover;}

.sec-internal-qna {background: #EBE9E5;}
.internal-qna-header {background: url('/images/sub/bg-internal-banner.jpg') no-repeat center center / cover;}
.internal-qna-content {background: #fff;}
.qna-item:not(:last-child) {margin-bottom: var(--space-80);}

.sec-department-about {position: relative;}
.sec-department-about .hashtags {justify-content: flex-start; margin: 0; font-size: var(--font-size-16); line-height: 1em;}
.sec-department-about .hashtags span {background: #CFDEDB; border-color:#CFDEDB;}
.sec-department-about .en-department-title {margin-bottom: -0.4em; margin-left: -1em; font-size: clamp(35px, calc(88 / var(--inner) * 100vw), 88px); line-height: 1.1136em; font-weight: 600; font-family: 'NanumMyeongjo'; color: rgba(15, 89, 78, 0.10);}
.department-about-txt {min-height: 60vh; width: 50%; padding-right: var(--space-60);}
.department-about-img {position: absolute; right: 0; top: 0; width: 50%; height: 100%;}
.department-about-img img {width: 100%; height: 100%; object-fit: cover;}

.check-title {line-height: 1.75em;}
.check-grid {display: flex; flex-wrap: wrap; gap: var(--space-20);}
.check-item {position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; flex: 1 1 auto; min-width: calc((100% - var(--space-20) * 2) / 3); padding: var(--space-25) var(--space-40); background: #fff; border: 2px solid var(--primary-color); border-radius: 100px; line-height: 1em;}
.check-item::before {content: ''; display: block; width: clamp(16px, calc(20 / var(--inner) * 100vw), 20px); height: clamp(16px, calc(20 / var(--inner) * 100vw), 20px); background: url('/images/sub/check-icon.svg') no-repeat center center / contain;}
.check-grid.type2 .check-item {justify-content: flex-start; min-width: calc((100% - var(--space-20)) / 2);}

.sec-obesity-banner {background: url('/images/sub/bg-obesity-banner.jpg') no-repeat center center / cover; line-height: 2.125em;}
.sec-obesity-recipe {background: #EBE9E5;}
.sec-obesity-time {position: relative; background: url('/images/sub/obesity-time-bg.jpg') no-repeat center center / cover;}
.obesity-time-content {gap: clamp(30px, calc(60 / var(--inner) * 100vw), 60px);}
.obesity-time-left {backdrop-filter: blur(5px); background: rgba(255,255,255,0.1); border-radius: var(--radius-24); padding: var(--space-60) var(--space-50); gap: var(--space-20);}
.obesity-time-item {gap: var(--space-20); line-height: 1em;}
.obesity-time-item .label {opacity: 0.5;}
.obesity-time-arrow {flex-shrink: 0;}
.obesity-time-arrow img {width: clamp(60px, calc(100 / var(--inner) * 100vw), 100px); height: auto;}
.obesity-time-right { gap: var(--space-10);}
.obesity-time-main {position: relative; font-size: clamp(100px, calc(150 / var(--inner) * 100vw), 150px); font-weight: 700; line-height: 1em; color: var(--secondary-color);}
.obesity-time-main span {display: inline-block; width: 1.2em; text-align: center;}
.obesity-time-main:after {position: absolute; left: 0; content:'(상담시간, 바디측정 시간 제외)'; display: block; width: 100%; margin-top: var(--space-25); font-size: var(--font-size-16); line-height: 1.5em; color: #fff; font-weight: 400; font-family:'Pretendard';}
.obesity-time-sub {font-size: var(--font-size-24); font-weight: 700; line-height: 1em;}
.obesity-time-desc {margin: 0; font-size: clamp(24px, calc(32 / var(--inner) * 100vw), 32px); line-height: 1.75em;}
.sec-obesity-txt {background: url('/images/sub/bg-obesity-txt.jpg') no-repeat center right / cover;}

.program-list {display: flex; flex-direction: column; gap: var(--space-40);}
.program-item { gap: 20px clamp(35px, calc(100 / var(--inner) * 100vw), 100px);}
.program-img {flex-shrink: 0; width: 35.715%; height: fit-content; border-radius: var(--radius-24); overflow: hidden;}
.program-desc {font-family:'Pretendard';}
.program-desc span {display: inline-block;}
.program-list.type2 .program-desc p:not(:last-child) {margin-bottom: var(--space-15);}

.sec-blood-change {background: url('/images/sub/bg-blood-change.jpg') no-repeat top center / cover;}
.sec-blood-change .tit {line-height: 2.66667em;}
.sec-department-arrow .contain {gap: var(--space-30);}
.sec-department-arrow .arrow img {height: clamp(40px, calc(72 / var(--inner) * 100vw), 72px);}
.sec-department-arrow .line {display: block; height: 1px; width: clamp(50px, calc(120 / var(--inner) * 100vw), 200px); background: #000;}
.sec-department-arrow .emphasis {position: relative; display: flex; justify-content: center; gap: var(--space-20);}
.sec-department-arrow .emphasis:before,
.sec-department-arrow .emphasis:after {content: ''; display: block; width: clamp(30px, calc(54 / var(--inner) * 100vw), 54px); background: url('/images/sub/icon-emphasis.png') no-repeat top center / contain;}
.sec-department-arrow .emphasis:after {transform: rotate(180deg);}
.sec-blood-change .contain {position: relative; z-index: 1;}
.blood-formula {gap: clamp(20px, calc(40 / var(--inner) * 100vw), 40px);}
.formula-item {flex-shrink: 0;}
.formula-circle {width: clamp(180px, calc(240 / var(--inner) * 100vw), 240px); height: clamp(180px, calc(240 / var(--inner) * 100vw), 240px); border: 2px solid rgba(255,255,255,0.3); border-radius: 50%; display: flex; align-items: center; justify-content: center; padding: var(--space-30); background: rgba(255,255,255,0.1);}
.formula-circle p {margin: 0; line-height: 1.6em;}
.formula-symbol {line-height: 1em;}
.formula-result {flex-shrink: 0;}
.formula-result p {margin: 0; line-height: 1.33em;}
.color-mint {color: var(--secondary-color);}


.solution-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-60);}
.solution-item {display: flex; flex-direction: column; gap: var(--space-20);}
.solution-img {position: relative; border-radius: var(--radius-24); overflow: hidden;}
.solution-num {position: absolute; right: var(--space-30); top: var(--space-30); font-size: clamp(30px, calc(80 / var(--inner) * 100vw), 80px); font-weight: 700; line-height: 1em; color: rgba(255,255,255,0.5); z-index: 2;}
.solution-title {position: absolute; left: var(--space-30); bottom: var(--space-30); margin: 0; line-height: 1em; z-index: 2;}
.solution-info {gap: 3px 10px;}
.solution-badge {padding: 10px var(--space-15); background: #F4F4F4; border-radius: 40px; font-size: var(--font-size-14); font-weight: 600; line-height: 1em;}

.vaccination-list {display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-60);}
.vaccination-list-item {display: flex; gap: 5px;}
.vaccination-img {flex-shrink: 0; width: clamp(150px, calc(200 / var(--inner) * 100vw), 200px);border-radius: var(--radius-24); overflow: hidden;}
.vaccination-img img {height: 100%; object-fit: cover;}
.vaccination-info {flex: 1;  gap:var(--space-15); background: #F4F4F4; border-radius: var(--radius-24); padding: var(--space-30); display: flex; flex-direction: column; justify-content: center;}
.vaccination-name {margin: 0; font-size: var(--font-size-24); line-height: 1em;}
.vaccine-product {font-size: var(--font-size-16); font-weight: 400;}
.vaccination-desc span,
.vaccination-badge-wrap span {display: inline-block;}
.vaccination-badge-wrap {gap: var(--space-10);}
.vaccination-badge {padding: var(--space-10); border-radius: 8px; line-height: 1em; white-space: nowrap;}
.color-red {color: #DF2121;}

.sec-function-prevention {background: url('/images/sub/function-prevention-bg.jpg') no-repeat center center / cover; position: relative;}
.sec-function-prevention::before {content: ''; position: absolute; inset: 0; background: rgba(0,0,0,0.6); z-index: 0;}
.sec-function-prevention .contain {position: relative; z-index: 1;}
.prevention-title h2 {line-height: 1em;}
.prevention-title p {line-height: 1em;}
.prevention-grid {display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-40);}
.prevention-item {display: flex; flex-direction: column; gap: var(--space-30);}
.prevention-img {width: 100%; height: clamp(250px, calc(330 / var(--inner) * 100vw), 330px); border-radius: var(--radius-24); overflow: hidden;}
.prevention-img img {width: 100%; height: 100%; object-fit: cover;}
.prevention-txt {display: flex; flex-direction: column; gap: var(--space-15);}

.sec-blood-qna {background: #07362F;}
.qna-header {position: relative;}
.qna-deco {position: absolute; right: clamp(0px, calc(110 / var(--inner) * 100vw), 110px); top: -10px; pointer-events: none;}
.q-mark {position: absolute; color: rgba(255,255,255,0.5); font-family: 'Pretendard'; font-weight: 600; line-height: 1em;}
.q-mark.q1 {font-size: clamp(80px, calc(120 / var(--inner) * 100vw), 120px); right: 0; top: 0;}
.q-mark.q2 {font-size: clamp(150px, calc(200 / var(--inner) * 100vw), 200px); right: clamp(30px, calc(62 / var(--inner) * 100vw), 62px); top: clamp(-20px, calc(-10 / var(--inner) * 100vw), -10px); color: rgba(255,255,255,0.1); transform: rotate(15deg);}
.blood-qna-list {display: flex; flex-direction: column; gap: var(--space-30);}
.blood-qna-item {display: flex; flex-direction: column; gap: var(--space-15); padding-bottom: var(--space-30); border-bottom: 1px solid rgba(255,255,255,0.1);}
.blood-qna-item:last-child {border-bottom: none; padding-bottom: 0;}
.qna-q {text-indent: -0.8em; padding-left: 0.8em;}
.qna-q::before {content: '•'; font-weight: 900; color: var(--secondary-color);}
.qna-a {background: #fff; border-radius: var(--radius-24); padding: clamp(20px, calc(31 / var(--inner) * 100vw), 31px) var(--space-30);}
.qna-a p {margin: 0; font-family: 'Pretendard'; color: #121212; line-height: 1em;}

.sec-vaccination-table {background: url('/images/sub/bg-vaccination-table.jpg') no-repeat center center / cover; position: relative;}
.table-wrap {overflow-x: auto;}
.vaccination-table {width: 100%; border-collapse: collapse; border-top: 2px solid var(--primary-color); background: #fff; font-family: 'Pretendard';}
.vaccination-table thead {background: #F4F4F4;}
.vaccination-table th,
.vaccination-table td {padding: clamp(15px, calc(21 / var(--inner) * 100vw), 21px) clamp(10px, calc(15 / var(--inner) * 100vw), 15px); text-align: center; vertical-align: middle; border: 1px solid #DDD;}
.vaccination-table thead th {font-size: var(--font-size-18); font-weight: 700; color: var(--dark-color); border-color: #D9D9D9;}
.vaccination-table thead th:first-child {color: var(--primary-color);}
.vaccination-table tbody th {font-weight: 600; color: #121212; background: #fff; text-align: center; border-right: 1px solid #D9D9D9;}
.vaccination-table tbody td {color: #505050; font-weight: 400;}
.vaccination-table thead th:first-child, .vaccination-table tbody th {border-left: 0;}
.vaccination-table thead th:last-child, .vaccination-table tbody td:last-child {border-right: 0;}

.sec-function-circles {background: url('/images/sub/bg-function-circles.jpg') no-repeat center center / cover;}
.sec-function-circles h2 {line-height: 2.3333em;}
.sec-vaccination-banner {background: url('/images/sub/bg-vaccination-banner.jpg') no-repeat center center / cover;}
.sec-vaccination-banner .line {display: block; width: 1px; height: clamp(50px, calc(100 / var(--inner) * 100vw), 100px); margin-left: auto; margin-right: auto; background: rgba(255, 255, 255, 0.50);}
.sec-function-check {background: #CFDEDB;}
.function-circles {gap: var(--space-40);}
.function-circle {display: flex; flex-direction: column; justify-content: center; align-items: center; width: clamp(200px, calc(300 / var(--inner) * 100vw), 300px); height: clamp(200px, calc(300 / var(--inner) * 100vw), 300px); border-radius: 100%; background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.5); backdrop-filter: blur(5px);}