@charset "utf-8";

#sub_11 .sub-sec-visual{background-image: url('../sub/img/sub_doctor_visual.webp');}
#sub_21 .sub-sec-visual{background-image: url('../sub/img/sub_philosophy_visual.webp');}
#sub_61 .sub-sec-visual{background-image: url('../sub/img/sub_location_visual.webp');}
#sub_notice .sub-sec-visual{background-image: url('../sub/img/sub_notice_visual.webp');}
#sub_bna .sub-sec-visual{background-image: url('../sub/img/sub_bna_visual.webp');}
#sub_column .sub-sec-visual{background-image: url('../sub/img/sub_column_visual.webp');}

.sub-sec-visual{position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; height: 720px; padding: 207px 0 90px; background: #ffffff no-repeat center / cover; text-align: center; box-sizing: border-box;}
.sub-sec-visual .wrap{position: relative; display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 1200px; margin: 0 auto; box-sizing: border-box;}
.sub-sec-visual .visual-label{font-size: var(--fz-20); font-weight: 600; line-height: 1.6; letter-spacing: -0.01em; color: #333333; margin-bottom: 12px;}
.sub-sec-visual .visual-title{font-size: var(--fz-40); font-weight: 700; line-height: 1.5; letter-spacing: -0.02em; color: #222222;}
.sub-sec-visual .visual-desc{font-size: var(--fz-20); font-weight: 400; line-height: 1.6; letter-spacing: -0.01em; color: #333333; margin-top: 40px; word-break: keep-all;}

#sub_61 .sec-counsel { width: 100%; padding: 140px 0; }
#sub_61 .sec-counsel .wrap { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end; gap: 40px; width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_61 .sec-counsel .counsel-info {min-width: 320px; display: flex; flex-direction: column; gap: 50px; }
#sub_61 .sec-counsel .sec-title { font-size: var(--fz-36); font-weight: 600; color: #121212; line-height: 1.4444; margin: 0; }
#sub_61 .sec-counsel .info-list { display: flex; flex-direction: column; gap: 52px; }
#sub_61 .sec-counsel .info-item { display: flex; align-items: flex-start; }
#sub_61 .sec-counsel .item-label { width: 172px; flex-shrink: 0; padding-top: 4px; }
#sub_61 .sec-counsel .item-label p { font-size: var(--fz-24); font-weight: 600; color: #222222; margin: 0; line-height: 1.2; }
#sub_61 .sec-counsel .item-val { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: 24px; }
#sub_61 .sec-counsel .item-hours .item-val { gap: 12px; }
#sub_61 .sec-counsel .phone-num { font-size: var(--fz-32); font-weight: 600; color: #1b2ea3; letter-spacing: -0.01em; text-decoration: none; line-height: 1.25; pointer-events: none; cursor: default; }
#sub_61 .sec-counsel .btn-group { display: flex; gap: 10px; align-items: center; }
#sub_61 .sec-counsel .btn-kakao { display: inline-flex; align-items: center; justify-content: flex-start; gap: 6px; width: 139px; height: 50px; padding: 0 10px; background-color: #eeda1c; border-radius: 4px; color: #2d2c28; font-size: var(--fz-14); font-weight: 600; line-height: 1; text-decoration: none; box-sizing: border-box; letter-spacing: 0.02em; }
#sub_61 .sec-counsel .btn-naver { display: inline-flex; align-items: center; justify-content: flex-start; gap: 6px; width: 139px; height: 50px; padding: 0 10px; background-color: #27ab62; border-radius: 4px; color: #ffffff; font-size: var(--fz-14); font-weight: 600; line-height: 1; text-decoration: none; box-sizing: border-box; letter-spacing: 0.02em; }
#sub_61 .sec-counsel .btn-kakao .icon { width: 40px; height: 40px; object-fit: contain; flex-shrink: 0; }
#sub_61 .sec-counsel .btn-naver .icon { width: 20px; height: 20px; object-fit: contain; flex-shrink: 0; margin: 0 10px; }
#sub_61 .sec-counsel .reserve-desc { font-size: var(--fz-18); font-weight: 500; color: #444444; line-height: 1.7778; margin: 0; word-break: keep-all; }
#sub_61 .sec-counsel .hours-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 0; }
#sub_61 .sec-counsel .hours-list li { display: flex; gap: 20px; align-items: center; font-size: var(--fz-20); line-height: 2; color: #444444; }
#sub_61 .sec-counsel .hours-list .day { display: flex; justify-content: space-between; align-items: center; width: 88px; flex-shrink: 0; font-weight: 600; color: #444444; }
#sub_61 .sec-counsel .hours-list .time { font-weight: 400; color: #444444; letter-spacing: 0.01em; }
#sub_61 .sec-counsel .holiday-note { font-size: var(--fz-18); font-weight: 500; color: #878787; margin: 0; line-height: 2.2222; }
#sub_61 .sec-counsel .counsel-thumb { max-width: 653px; width: 100%; height: auto; aspect-ratio: 653/510; border-radius: 20px; overflow: hidden; background-color: #eaeaea; }
#sub_61 .sec-counsel .counsel-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

#sub_61 .sec-map { width: 100%; margin-bottom: 50px; }
#sub_61 .sec-map .wrap { width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_61 .sec-map .map-box { width: 100%; height: 650px; border-radius: 20px; overflow: hidden; background-color: #f0f0f0; }
#sub_61 .sec-map .map-box img { width: 100%; height: 100%; object-fit: cover; display: block; }

#sub_61 .sec-transport { width: 100%; padding-bottom: 140px; }
#sub_61 .sec-transport .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; gap: 40px; width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_61 .sec-transport .address-box { min-width: 300px; }
#sub_61 .sec-transport .address-text { font-size: var(--fz-30); font-weight: 600; color: #222222; line-height: 1.4667; margin: 0; word-break: keep-all; }
#sub_61 .sec-transport .transport-info-box { flex: 1 1 728px; max-width: 728px; width: 100%; display: flex; flex-direction: column; gap: 36px; }
#sub_61 .sec-transport .map-btn-group { display: flex; gap: 12px; width: 100%; }
#sub_61 .sec-transport .btn-find-map { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 12px; height: 74px; background-color: #1b2ea3; border-radius: 10px; color: #ffffff; font-size: var(--fz-21); font-weight: 500; text-decoration: none; letter-spacing: 0.02em; box-sizing: border-box; transition: background 0.2s ease; }
#sub_61 .sec-transport .btn-find-map:hover { background-color: #152482; }
#sub_61 .sec-transport .btn-find-map .icon { width: 24px; height: 24px; object-fit: contain; }
#sub_61 .sec-transport .parking-info-box { display: flex; align-items: center; justify-content: space-between; height: 74px; padding: 0 50px; border: 1.5px solid #e9e9e9; border-radius: 10px; box-sizing: border-box; background: #ffffff; }
#sub_61 .sec-transport .parking-title { font-size: var(--fz-24); font-weight: 500; color: #222222; }
#sub_61 .sec-transport .parking-desc { font-size: var(--fz-20); font-weight: 500; color: #444444; letter-spacing: -0.01em; }
#sub_61 .sec-transport .bus-info-card { width: 100%; border: 1.5px solid #e9e9e9; border-radius: 10px; padding: 40px 50px; box-sizing: border-box; background: #ffffff; }
#sub_61 .sec-transport .bus-card-title { font-size: var(--fz-24); font-weight: 500; color: #222222; margin: 0 0 28px 0; }
#sub_61 .sec-transport .bus-stop-list { display: flex; gap: 48px; align-items: flex-start; }
#sub_61 .sec-transport .bus-stop-item { display: flex; flex-direction: column; gap: 20px; }
#sub_61 .sec-transport .bus-stop-item:first-child { width: max-content; flex-shrink: 0; }
#sub_61 .sec-transport .bus-stop-item:last-child { flex: 1; min-width: 0; }
#sub_61 .sec-transport .stop-name { font-size: var(--fz-18); font-weight: 600; color: #222222; margin: 0; word-break: keep-all; }
#sub_61 .sec-transport .bus-lines { font-size: var(--fz-18); font-weight: 400; color: #666666; line-height: 1.7778; letter-spacing: -0.01em; margin: 0; word-break: keep-all; }

#sub_11 .sec-intro { width: 100%; padding: 160px 0 120px; background: #ffffff; }
#sub_11 .sec-intro .wrap { display: flex; flex-direction: column; gap: 80px; align-items: center; width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_11 .sec-intro .intro-thumb { width: 100%; height: 600px; border-radius: 20px; overflow: hidden; background-color: #f0f0f0; }
#sub_11 .sec-intro .intro-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
#sub_11 .sec-intro .intro-quote-box { display: flex; flex-direction: column; gap: 36px; align-items: center; text-align: center; width: 100%; max-width: 1100px; }
#sub_11 .sec-intro .quote-icon { width: 70px; height: 45px; margin: 0 auto; }
#sub_11 .sec-intro .quote-icon img { width: 100%; height: 100%; object-fit: contain; display: block; }
#sub_11 .sec-intro .quote-text-group { display: flex; flex-direction: column; gap: 40px; align-items: center; }
#sub_11 .sec-intro .text-sub { font-size: var(--fz-24); font-weight: 500; color: #222222; line-height: 1.5833; margin: 0; word-break: keep-all; }
#sub_11 .sec-intro .text-main { font-size: var(--fz-28); font-weight: 500; color: #222222; line-height: 1.6429; margin: 0; word-break: keep-all; }
#sub_11 .sec-intro .text-main .accent { color: #1b2ea3; font-weight: 700; }

#sub_11 .sec-profile { width: 100%; padding: 100px 0 120px; background: #ffffff; }
#sub_11 .sec-profile .wrap { width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_11 .sec-profile .sec-title { font-size: var(--fz-36); font-weight: 500; color: #121212; line-height: 1.4444; margin: 0; word-break: keep-all; }
#sub_11 .sec-profile .sec-title .accent { color: #1b2ea3; font-weight: 700; }
#sub_11 .sec-profile .profile-content { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; width: 100%; }
#sub_11 .sec-profile .profile-info { max-width: 750px; width: 100%; display: flex; flex-direction: column; gap: 48px; }
#sub_11 .sec-profile .doctor-badge-group { display: flex; align-items: center; gap: 65px; }
#sub_11 .sec-profile .name-block { display: flex; align-items: center; gap: 16px; }
#sub_11 .sec-profile .role-icon { width: 45px; height: 31px; object-fit: contain; flex-shrink: 0; }
#sub_11 .sec-profile .role { font-size: var(--fz-30); font-weight: 500; color: #182851; }
#sub_11 .sec-profile .name { font-size: var(--fz-40); font-weight: 600; color: #111111; }
#sub_11 .sec-profile .license-block { display: flex; align-items: center; gap: 12px; }
#sub_11 .sec-profile .badge-icon { width: 27px; height: 27px; object-fit: contain; }
#sub_11 .sec-profile .license-title { font-size: var(--fz-24); font-weight: 500; color: #222222; }
#sub_11 .sec-profile .history-list-wrap { display: flex; gap: 40px; align-items: flex-start; width: 100%; }
#sub_11 .sec-profile .history-col { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; flex: 1; min-width: 0; }
#sub_11 .sec-profile .history-col li { position: relative; padding-left: 14px; font-size: var(--fz-18); font-weight: 400; color: #444444; line-height: 1.5556; word-break: keep-all; }
#sub_11 .sec-profile .history-col li::before { content: ''; position: absolute; top: 10px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #444444; }
#sub_11 .sec-profile .profile-thumb { flex: 0 1 561px; max-width: 561px; width: 100%; height: auto; aspect-ratio: 561/839; border-radius: 20px; overflow: hidden; background-color: #f5f9ff; }
#sub_11 .sec-profile .profile-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }

#sub_11 .sec-philosophy { width: 100%; padding: 100px 0 160px; background: #ffffff; }
#sub_11 .sec-philosophy .wrap { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 80px; width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_11 .sec-philosophy .philosophy-thumb { max-width: 800px; width: 100%; height: auto; aspect-ratio: 800/480; border-radius: 20px; overflow: hidden; background-color: #f0f0f0; }
#sub_11 .sec-philosophy .philosophy-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
#sub_11 .sec-philosophy .philosophy-info { max-width: 480px; width: 100%; display: flex; flex-direction: column; gap: 40px; }
#sub_11 .sec-philosophy .text-sub { font-size: var(--fz-24); font-weight: 500; color: #222222; line-height: 1.5833; margin: 0; word-break: keep-all; }
#sub_11 .sec-philosophy .text-main { font-size: var(--fz-28); font-weight: 500; color: #222222; line-height: 1.6429; margin: 0; word-break: keep-all; }
#sub_11 .sec-philosophy .text-main .accent { color: #1b2ea3; font-weight: 700; }

#sub_11 .sec-lecture { position: relative; width: 100%; height: 250vh; background: #182472 url('../sub/img/sub_doctor_sec04_bg_260917.webp') center / cover no-repeat; overflow-x: clip; }
#sub_11 .sec-lecture .lecture-pin-wrap { position: relative; width: 100%; height: 100vh; overflow: hidden; }
#sub_11 .sec-lecture .lecture-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #182472 url('../sub/img/sub_doctor_sec04_bg_260917.webp') center / cover no-repeat; z-index: 0; pointer-events: none; }
#sub_11 .sec-lecture .lecture-images { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
#sub_11 .sec-lecture .lecture-imglist { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
#sub_11 .sec-lecture .lecture-img { position: absolute; border-radius: 10px; overflow: hidden; opacity: 0; clip-path: inset(100% 0% 0% 0%); will-change: transform, clip-path; margin: 0; background: rgba(255, 255, 255, 0.1); }
#sub_11 .sec-lecture .lecture-img::after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.38); pointer-events: none; z-index: 1; }
#sub_11 .sec-lecture .lecture-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
#sub_11 .sec-lecture .lecture-img.img-01 { top: 5%; right: 4%; width: 17.97%; aspect-ratio: 345/368; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-02 { top: 45%; right: 10%; width: 27.81%; aspect-ratio: 570/377; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-03 { top: 48%; right: 3%; width: 27.81%; aspect-ratio: 534/353; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-04 { top: 20%; left: 6%; width: 18.49%; aspect-ratio: 355/413; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-05 { top: 54%; left: 18%; width: 14.48%; aspect-ratio: 278/316; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-06 { top: 50%; left: 3%; width: 26.56%; aspect-ratio: 510/317; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-07 { top: 65%; left: 16%; width: 20.36%; aspect-ratio: 391/317; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }
#sub_11 .sec-lecture .lecture-img.img-08 { top: 65%; right: 28%; width: 13.75%; aspect-ratio: 267/334; box-shadow: -20px 60px 34px rgba(29, 30, 33, 0.15); }

#sub_11 .sec-lecture .lecture-text-wrap { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; max-width: 580px; text-align: center; margin: 0; padding: 0; }
#sub_11 .sec-lecture .lecture-main-title { font-size: var(--fz-36); font-weight: 600; color: #ffffff; line-height: 1.4444; margin: 0 0 60px 0; word-break: keep-all; }
#sub_11 .sec-lecture .lecture-desc-group { display: flex; flex-direction: column; gap: 40px; align-items: center; width: 100%; }
#sub_11 .sec-lecture .lecture-phrase { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; opacity: 0.35; transition: opacity 0.4s ease; }
#sub_11 .sec-lecture .lecture-phrase p { font-size: var(--fz-18); font-weight: 400; color: rgba(255, 255, 255, 0.7); line-height: 1.7778; margin: 0; word-break: keep-all; transition: all 0.4s ease; }
#sub_11 .sec-lecture .phrase-c p { font-size: var(--fz-20); font-weight: 600; line-height: 1.5; }
#sub_11 .sec-lecture .lecture-phrase.active { opacity: 1; }
#sub_11 .sec-lecture .lecture-phrase.active p { font-weight: 700; color: #ffffff; }

/* 진료철학 (#sub_21 - Figma Node 436:3920) */
#sub_21 .sec-kv { position: relative; width: 100%; background: #ffffff; }
#sub_21 .sec-kv .kv-pin-wrap { position: relative; width: 100%; height: 100vh; overflow: hidden; }
#sub_21 .sec-kv .kv-step { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; text-align: center; }
#sub_21 .sec-kv .step-01 { background: #ffffff url('../sub/img/sub_philosophy_visual_01.webp') center / cover no-repeat; z-index: 1; }
#sub_21 .sec-kv .step-02 { background: #000c55 url('../sub/img/sub_philosophy_visual_02.webp') 30% center / cover no-repeat; opacity: 0; z-index: 2; }
#sub_21 .sec-kv .kv-content { position: relative; z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 80px; width: 92%; max-width: 1440px; margin: 0 auto; }
#sub_21 .sec-kv .kv-title-group { display: flex; flex-direction: column; align-items: center; gap: 40px; text-align: center; }
#sub_21 .sec-kv .kv-sub-title { font-size: var(--fz-24); font-weight: 500; color: #1b2ea3; line-height: 1.5833; text-transform: uppercase; margin: 0; letter-spacing: 0.02em; }
#sub_21 .sec-kv .step-02 .kv-sub-title { color: #ffffff; }
#sub_21 .sec-kv .kv-main-title { font-size: var(--fz-64); font-weight: 700; color: #222222; line-height: 1.2; margin: 0; word-break: keep-all; letter-spacing: -1.28px; }
#sub_21 .sec-kv .kv-main-title .accent { color: #1b2ea3; font-weight: 700; letter-spacing: -1.28px; }
#sub_21 .sec-kv .step-02 .kv-main-title { color: #ffffff; }
#sub_21 .sec-kv .kv-scroll-hint { display: flex; flex-direction: column; align-items: center; gap: 40px; }
#sub_21 .sec-kv .kv-scroll-hint .line { width: 1px; height: 64px; background: #1b2ea3; }
#sub_21 .sec-kv .step-02 .kv-scroll-hint .line { background: #ffffff; opacity: 0.8; }
#sub_21 .sec-kv .kv-scroll-hint .text { font-size: var(--fz-16); font-weight: 200; color: #4877cf; letter-spacing: -0.16px; margin: 0; }
#sub_21 .sec-kv .step-02 .kv-scroll-hint .text { color: #ffffff; }

#sub_21 .sec-brand { width: 100%; padding: 140px 0 160px; background: #ffffff; }
#sub_21 .sec-brand .wrap { display: flex; flex-direction: column; gap: 80px; align-items: center; width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_21 .sec-brand .video-box { position: relative; width: 100%; height: 550px; border-radius: 20px; overflow: hidden; background-color: #ededed; }
#sub_21 .sec-brand .video-box img, #sub_21 .sec-brand .video-box video { width: 100%; height: 100%; object-fit: cover; display: block; }
#sub_21 .sec-brand .video-overlay-text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #ffffff; font-size: var(--fz-34); font-weight: 600; text-align: center; pointer-events: none; }
#sub_21 .sec-brand .brand-text-group { display: flex; flex-direction: column; gap: 40px; align-items: center; text-align: center; color: #222222; font-size: var(--fz-24); font-weight: 500; line-height: 1.5833; word-break: keep-all; }
#sub_21 .sec-brand .brand-text-group p { margin: 0; word-break: keep-all; }
#sub_21 .sec-brand .brand-text-group .desc-line1 { color: #222222; }
#sub_21 .sec-brand .brand-text-group .desc-line2 { color: #222222; }
#sub_21 .sec-brand .brand-text-group .desc-line2 strong { font-weight: 700; color: #121212; }
#sub_21 .sec-brand .brand-text-group .desc-line3 { font-size: var(--fz-28); line-height: 1.6429; }
#sub_21 .sec-brand .brand-text-group .accent { color: #1b2ea3; font-weight: 700; }

#sub_21 .sec-principles { width: 100%; padding: 140px 0 160px; background: #ffffff; }
#sub_21 .sec-principles .wrap { display: flex; flex-direction: column; gap: 110px; align-items: center; width: 92%; max-width: 1600px; margin: 0 auto; box-sizing: border-box; }
#sub_21 .sec-principles .section-header { display: flex; flex-direction: column; gap: 16px; align-items: center; text-align: center; }
#sub_21 .sec-principles .sec-title { font-size: var(--fz-44); font-weight: 500; color: #121212; line-height: 1.4545; margin: 0; letter-spacing: -0.02em; }
#sub_21 .sec-principles .sec-title .accent { color: #1b2ea3; font-weight: 700; }
#sub_21 .sec-principles .sec-desc { font-size: var(--fz-20); font-weight: 400; color: #333333; line-height: 1.6; margin: 0; word-break: keep-all; }
#sub_21 .sec-principles .principle-list { display: flex; flex-direction: column; gap: 80px; width: 100%; }
#sub_21 .sec-principles .principle-item { display: flex; align-items: center; justify-content: space-between; gap: clamp(40px, 6vw, 120px); width: 100%; }
#sub_21 .sec-principles .principle-item.reverse { flex-direction: row-reverse; padding-left: clamp(0px, 5vw, 80px); }
#sub_21 .sec-principles .principle-item .thumb-box { flex: 1 1 50%; max-width: 820px; width: 100%; height: auto; aspect-ratio: 820/500; border-radius: 30px; overflow: hidden; background-color: #dfdfdf; }
#sub_21 .sec-principles .principle-item .thumb-box img { width: 100%; height: 100%; object-fit: cover; display: block; }
#sub_21 .sec-principles .principle-item .info-box { flex: 1 1 45%; min-width: 0; display: flex; flex-direction: column; gap: 40px; }
#sub_21 .sec-principles .principle-item .item-head { display: flex; flex-direction: column; gap: 12px; }
#sub_21 .sec-principles .principle-item .item-body { display: flex; flex-direction: column; gap: 20px; }
#sub_21 .sec-principles .principle-item .badge-header { display: flex; align-items: center; gap: 16px; }
#sub_21 .sec-principles .principle-item .badge { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; background-color: #1b2ea3; border-radius: 8px; color: #ffffff; font-size: var(--fz-18); font-weight: 600; flex-shrink: 0; }
#sub_21 .sec-principles .principle-item .title { font-size: var(--fz-36); font-weight: 700; color: #151617; line-height: 1.4444; margin: 0; }
#sub_21 .sec-principles .principle-item .sub-title { font-size: var(--fz-24); font-weight: 600; color: #151617; line-height: 1.5833; margin: 0; word-break: keep-all; }
#sub_21 .sec-principles .principle-item .desc { font-size: var(--fz-18); font-weight: 500; color: #666666; line-height: 1.6667; margin: 0; word-break: keep-all; }
#sub_21 .sec-principles .principle-item .highlight { font-size: var(--fz-18); font-weight: 600; color: #222222; line-height: 1.6667; margin: 0; word-break: keep-all; }

#sub_21 .sec-quote-bg { position: relative; width: 100%; height: 600px; background: url('../sub/img/sub_philosophy_sec04_bg.webp') 60% center / cover no-repeat; display: flex; align-items: center; overflow: hidden; }
#sub_21 .sec-quote-bg .wrap { width: 92%; max-width: 1440px; margin: 0 auto; box-sizing: border-box; }
#sub_21 .sec-quote-bg .quote-content-box { display: flex; flex-direction: column; gap: 20px; align-items: flex-start; max-width: 590px; text-align: left; color: #ffffff; }
#sub_21 .sec-quote-bg .quote-icon-top { width: 43px; height: 28px; flex-shrink: 0; }
#sub_21 .sec-quote-bg .quote-icon-top img { width: 100%; height: 100%; object-fit: contain; display: block; }
#sub_21 .sec-quote-bg .quote-text-body { position: relative; display: flex; flex-direction: column; gap: 20px; padding: 0 45px 0 20px; }
#sub_21 .sec-quote-bg .quote-icon-bottom { position: absolute; right: 0; bottom: -5px; width: 43px; height: 28px; transform: rotate(180deg); flex-shrink: 0; }
#sub_21 .sec-quote-bg .quote-icon-bottom img { width: 100%; height: 100%; object-fit: contain; display: block; }
#sub_21 .sec-quote-bg .quote-main { font-size: var(--fz-28); font-weight: 700; color: #ffffff; line-height: 1.6429; margin: 0; word-break: keep-all; }
#sub_21 .sec-quote-bg .quote-sub { font-size: var(--fz-20); font-weight: 400; color: rgba(255, 255, 255, 0.9); line-height: 1.6; margin: 0; word-break: keep-all; letter-spacing: -0.01em; }
#sub_21 .sec-quote-bg .doctor-signature { display: flex; align-items: flex-end; align-self: flex-end; gap: 18px; margin-top: 40px; }
#sub_21 .sec-quote-bg .doctor-signature .name { font-size: var(--fz-24); font-weight: 700; color: #ffffff; letter-spacing: 0.5em; line-height: 1.5; }
#sub_21 .sec-quote-bg .doctor-signature .title { font-size: var(--fz-20); font-weight: 600; color: rgba(255, 255, 255, 0.9); line-height: 1.5; }

@media (max-width: 1024px) {
    #sub_11 .sub-sec-visual{background-image: url('../sub/img/sub_doctor_visual_m.webp');}
    #sub_notice .sub-sec-visual {background-image: url('../sub/img/sub_notice_visual_m.webp');}
    .sub-sec-visual{padding: 120px 20px 60px; height: 580px;}
    .sub-sec-visual .visual-label{font-size: var(--fz-16); line-height: 1.4; margin-bottom: 8px;}
    .sub-sec-visual .visual-title{font-size: var(--fz-32); line-height: 1.3;}
    .sub-sec-visual .visual-desc{font-size: var(--fz-16); line-height: 1.5; margin-top: 24px;}

    #sub_61 .sec-counsel { padding: 80px 0; }
    #sub_61 .sec-counsel .wrap { flex-direction: column-reverse; align-items: center; gap: 40px; }
    #sub_61 .sec-counsel .counsel-thumb { width: 100%; height: auto; aspect-ratio: 653/510; border-radius: 12px; }
    #sub_61 .sec-counsel .sec-title { font-size: var(--fz-26); line-height: 1.3; text-align: center;}
    #sub_61 .sec-counsel .counsel-info { gap: 40px; }
    #sub_61 .sec-counsel .info-list { gap: 44px; }
    #sub_61 .sec-counsel .info-item { flex-direction: column; gap: 20px; align-items: center;text-align: center;}
    #sub_61 .sec-counsel .item-label { width: 100%; padding-top: 0; }
    #sub_61 .sec-counsel .item-label p { font-size: 20px; }
    #sub_61 .sec-counsel .btn-group {justify-content: center;}
    #sub_61 .sec-counsel .phone-num { font-size: 28px; font-weight: 800; line-height: 1.3; pointer-events: auto; cursor: pointer; }
    #sub_61 .sec-counsel .reserve-desc { font-size: var(--fz-16); line-height: 1.5; }
    #sub_61 .sec-counsel .hours-list {gap: 20px;}
    #sub_61 .sec-counsel .hours-list li { font-size: var(--fz-16); line-height: 1.6; gap: 8px; flex-wrap: wrap; flex-direction: column; justify-content: center; align-items: center; }
    #sub_61 .sec-counsel .hours-list .day { display: flex; justify-content: space-between; width: 70px; font-size: 16px; }
    #sub_61 .sec-counsel .hours-list .time {font-size: 16px; text-align: center;}
    #sub_61 .sec-counsel .holiday-note { font-size: var(--fz-16); line-height: 1.5; margin: 0; }

    #sub_61 .sec-map { margin-bottom: 80px; }
    #sub_61 .sec-map .map-box { height: 360px; border-radius: 12px; }

    #sub_61 .sec-transport { padding-bottom: 80px; }
    #sub_61 .sec-transport .wrap { flex-direction: column; align-items: center; gap: 24px; }
    #sub_61 .sec-transport .address-text { font-size: var(--fz-22); line-height: 1.4; }
    #sub_61 .sec-transport .transport-info-box { width: 100%; gap: 16px; flex: auto;}
    #sub_61 .sec-transport .map-btn-group { flex-direction: row; gap: 10px; width: 100%; }
    #sub_61 .sec-transport .btn-find-map { flex: 1; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 20px 6px 16px; height: auto; border-radius: 16px; font-size: var(--fz-16); font-weight: 600; text-align: center; word-break: keep-all; letter-spacing: -0.02em; }
    #sub_61 .sec-transport .btn-find-map .icon { width: 28px; height: 28px; object-fit: contain; margin-bottom: 2px; }
    #sub_61 .sec-transport .parking-info-box { height: auto; padding: 20px; flex-direction: column; align-items: flex-start; gap: 8px; border-radius: 8px; }
    #sub_61 .sec-transport .parking-title { font-size: var(--fz-18); }
    #sub_61 .sec-transport .parking-desc { font-size: var(--fz-16); line-height: 1.4; }
    #sub_61 .sec-transport .bus-info-card { width: 100%; padding: 24px 20px; border-radius: 8px; margin-top: 8px; }
    #sub_61 .sec-transport .bus-card-title { font-size: var(--fz-20); margin-bottom: 20px; }
    #sub_61 .sec-transport .bus-stop-list { flex-direction: column; gap: 24px; }
    #sub_61 .sec-transport .bus-stop-item:first-child { width: 100%; }
    #sub_61 .sec-transport .stop-name { font-size: var(--fz-16); }
    #sub_61 .sec-transport .bus-lines { font-size: var(--fz-16); line-height: 1.6; }

    #sub_11 .sec-intro { padding: 80px 0; }
    #sub_11 .sec-intro .wrap { gap: 40px; }
    #sub_11 .sec-intro .intro-thumb { height: auto; aspect-ratio: 1440/600; border-radius: 12px; }
    #sub_11 .sec-intro .intro-quote-box { gap: 24px; }
    #sub_11 .sec-intro .quote-icon { width: 45px; height: 30px; }
    #sub_11 .sec-intro .quote-text-group { gap: 24px; }
    #sub_11 .sec-intro .text-sub { font-size: var(--fz-16); line-height: 1.5; }
    #sub_11 .sec-intro .text-main { font-size: var(--fz-18); line-height: 1.5; }

    #sub_11 .sec-profile { padding: 80px 0; }
    #sub_11 .sec-profile .sec-title { font-size: var(--fz-24); line-height: 1.4; text-align: center;}
    #sub_11 .sec-profile .profile-content { flex-direction: column-reverse; align-items: center; gap: 36px; }
    #sub_11 .sec-profile .profile-thumb { width: 100%; max-width: 100%; height: auto; aspect-ratio: 561/839; border-radius: 12px; }
    #sub_11 .sec-profile .profile-info { gap: 30px; width: 100%; max-width: 100%; }
    #sub_11 .sec-profile .doctor-badge-group { flex-direction: column; align-items: center; gap: 12px; }
    #sub_11 .sec-profile .name-block { gap: 10px; }
    #sub_11 .sec-profile .role-icon { width: 34px; height: 24px; }
    #sub_11 .sec-profile .role { font-size: var(--fz-20); }
    #sub_11 .sec-profile .name { font-size: var(--fz-28); letter-spacing: 0.15em; }
    #sub_11 .sec-profile .license-title { font-size: var(--fz-18); }
    #sub_11 .sec-profile .history-list-wrap { flex-direction: column; gap: 10px; align-items: center;}
    #sub_11 .sec-profile .history-col {align-items: center;}
    #sub_11 .sec-profile .history-col li { font-size: var(--fz-16); line-height: 1.6; }
    #sub_11 .sec-profile .history-col li::before { top: 8px; width: 4px; height: 4px; }

    #sub_11 .sec-philosophy { padding: 80px 0; }
    #sub_11 .sec-philosophy .wrap { flex-direction: column; align-items: center; gap: 36px; }
    #sub_11 .sec-philosophy .philosophy-thumb { width: 100%; height: auto; aspect-ratio: 800/480; border-radius: 12px; }
    #sub_11 .sec-philosophy .philosophy-info { gap: 24px; width: 100%; text-align: center;}
    #sub_11 .sec-philosophy .text-sub { font-size: var(--fz-16); line-height: 1.5; }
    #sub_11 .sec-philosophy .text-main { font-size: var(--fz-18); line-height: 1.5; }

    /* sec-lecture 모바일 패럴랙스 반응형 세팅 (스케일 및 텍스트 밸런스) */
    #sub_11 .sec-lecture .lecture-text-wrap { max-width: 90%; }
    #sub_11 .sec-lecture .lecture-main-title { font-size: var(--fz-24); line-height: 1.35; margin: 0 0 32px 0; }
    #sub_11 .sec-lecture .lecture-desc-group { gap: 24px; }
    #sub_11 .sec-lecture .lecture-phrase p { font-size: var(--fz-16); line-height: 1.6; }
    #sub_11 .sec-lecture .phrase-c p { font-size: var(--fz-16); }

    /* 모바일 뷰포트 카드 크기 확대 조정 */
    #sub_11 .sec-lecture .lecture-img.img-01 { width: 32%; right: 1%; }
    #sub_11 .sec-lecture .lecture-img.img-02 { width: 44%; right: 4%; }
    #sub_11 .sec-lecture .lecture-img.img-03 { width: 44%; right: 1%; }
    #sub_11 .sec-lecture .lecture-img.img-04 { width: 33%; left: 1%; }
    #sub_11 .sec-lecture .lecture-img.img-05 { width: 27%; left: 5%; }
    #sub_11 .sec-lecture .lecture-img.img-06 { width: 44%; left: 1%; }
    #sub_11 .sec-lecture .lecture-img.img-07 { width: 36%; left: 5%; }
    #sub_11 .sec-lecture .lecture-img.img-08 { width: 28%; right: 5%; }

    /* 진료철학 반응형 (#sub_21) */
    #sub_21 .sec-kv .kv-content { gap: 40px; }
    #sub_21 .sec-kv .kv-title-group { gap: 20px; }
    #sub_21 .sec-kv .kv-sub-title { font-size: var(--fz-18); line-height: 1.4; }
    #sub_21 .sec-kv .kv-main-title { font-size: var(--fz-32); line-height: 1.3; letter-spacing: -0.64px; }
    #sub_21 .sec-kv .kv-scroll-hint { gap: 20px; margin-top: 0; }
    #sub_21 .sec-kv .kv-scroll-hint .line { height: 40px; }
    #sub_21 .sec-kv .kv-scroll-hint .text { font-size: var(--fz-16); }

    #sub_21 .sec-brand { padding: 80px 0; }
    #sub_21 .sec-brand .wrap { gap: 40px; }
    #sub_21 .sec-brand .video-box { height: auto; border-radius: 12px; }
    #sub_21 .sec-brand .video-overlay-text { font-size: var(--fz-20); }
    #sub_21 .sec-brand .brand-text-group { gap: 24px; font-size: var(--fz-16); line-height: 1.5; }
    #sub_21 .sec-brand .brand-text-group .desc-line3 { font-size: var(--fz-18); line-height: 1.5; }

    #sub_21 .sec-principles { padding: 80px 0; }
    #sub_21 .sec-principles .wrap { gap: 40px; }
    #sub_21 .sec-principles .section-header { gap: 12px; }
    #sub_21 .sec-principles .sec-title { font-size: var(--fz-28); line-height: 1.35; }
    #sub_21 .sec-principles .sec-desc { font-size: var(--fz-16); line-height: 1.5; }
    #sub_21 .sec-principles .principle-list { gap: 60px; }
    #sub_21 .sec-principles .principle-item { flex-direction: column; gap: 24px; }
    #sub_21 .sec-principles .principle-item.reverse { flex-direction: column; padding-left: 0; }
    #sub_21 .sec-principles .principle-item .thumb-box { width: 100%; max-width: 100%; height: auto; aspect-ratio: 820/500; border-radius: 16px; }
    #sub_21 .sec-principles .principle-item .info-box { width: 100%; gap: 20px; text-align: center;}
    #sub_21 .sec-principles .principle-item .item-head { gap: 10px; }
    #sub_21 .sec-principles .principle-item .item-body { gap: 12px; }
    #sub_21 .sec-principles .principle-item .title { font-size: var(--fz-26); }
    #sub_21 .sec-principles .principle-item .sub-title { font-size: var(--fz-18); margin: 0; line-height: 1.4; }
    #sub_21 .sec-principles .principle-item .desc { font-size: var(--fz-16); line-height: 1.5; }
    #sub_21 .sec-principles .principle-item .highlight { font-size: var(--fz-16); line-height: 1.5; }
    #sub_21 .sec-principles .principle-item .badge-header { justify-content: center; gap: 12px }
    #sub_21 .sec-principles .principle-item .badge {width: 36px; height: 36px;}

    #sub_21 .sec-quote-bg { height: auto; min-height: 480px; padding: 60px 0;background-image: url('../sub/img/sub_philosophy_sec04_bg_m.webp');}
    #sub_21 .sec-quote-bg .quote-content-box { gap: 16px; max-width: 100%; }
    #sub_21 .sec-quote-bg .quote-icon-top { width: 32px; height: 21px; }
    #sub_21 .sec-quote-bg .quote-text-body { padding: 0 34px 0 14px; gap: 12px; }
    #sub_21 .sec-quote-bg .quote-icon-bottom { width: 32px; height: 21px; bottom: -2px; }
    #sub_21 .sec-quote-bg .quote-main { font-size: var(--fz-20); line-height: 1.45; }
    #sub_21 .sec-quote-bg .quote-sub { font-size: var(--fz-16); line-height: 1.5; }
    #sub_21 .sec-quote-bg .doctor-signature { padding: 0 34px 0 14px; flex-direction: column; align-items: flex-start; align-self: flex-start; gap: 4px; margin-top: 16px; }
    #sub_21 .sec-quote-bg .doctor-signature .name { font-size: var(--fz-20); letter-spacing: 0.3em; }
    #sub_21 .sec-quote-bg .doctor-signature .title { font-size: var(--fz-16); }
}
