/* ============================================================
   suwon-upgrade.css — 2026-09-20 1차 테스트 보강
   1) 헤더 브랜드 텍스트 "맨즈업남성의원 / 수원점"
   2) 우측 유틸 레일 가독성 + 헤더 상담·예약 버튼 강조
   3) 모바일·태블릿 하단 고정 상담바 (온라인상담 / 전화 / 톡톡 / 네이버 예약)
   4) 메인 히어로 인증 블록(Coloplast·AMS + 엠블럼 3종) 확대
   5) 메인 신규 섹션 — 진료 권역 · 지도 · FAQ
   6) 대표원장 소개 — 인사말 · 진료 원칙 · 진료 장면
   7) 더블업 확대수술 — 단면 일러스트 · 재료 카드 · 과정 · 비교표 · 회복 · 영상
   ============================================================ */

/* ---------- 1) 헤더 브랜드 ---------- */
#mansup-app .mu-header>a.mu-brand{gap:12px}
#mansup-app .mu-header>a.mu-brand img{height:42px!important}
#mansup-app .mu-brand-text{display:flex;flex-direction:column;gap:5px;align-items:flex-start;line-height:1}
#mansup-app .mu-brand-text>strong{font-size:19.5px;font-weight:800;letter-spacing:-.025em;color:#16223B;white-space:nowrap;line-height:1}
#mansup-app .mu-brand-text>span{display:inline-flex;align-items:center;gap:9px;font-size:10.5px;font-weight:600;letter-spacing:.14em;color:#8A9BB3;white-space:nowrap;line-height:1}
#mansup-app .mu-brand-text>span>em{font-style:normal;font-size:12.5px;font-weight:800;letter-spacing:.02em;color:#2E7BF0;background:none;border-radius:0;padding:0}
#mansup-app .mu-brand-text>span>b{font-family:'Poppins',sans-serif;font-size:11px;font-weight:600;letter-spacing:.12em;color:#8A9BB3;line-height:1}
#mansup-app .mu-brand-text>span>i{width:1px;height:10px;background:#D5DDE8;display:inline-block}
@media(max-width:760px){
 #mansup-app .mu-header>a.mu-brand img{height:36px!important}
 #mansup-app .mu-brand-text>strong{font-size:17px!important}
 #mansup-app .mu-brand-text>span>em{font-size:11.5px}
 #mansup-app .mu-brand-text>span>i,#mansup-app .mu-brand-text>span>b{display:none}
}
@media(max-width:400px){#mansup-app .mu-brand-text>strong{font-size:16px!important}}

/* ---------- 2) 우측 유틸 레일 · 헤더 버튼 ---------- */
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]{gap:22px}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a{font-size:13.5px!important;font-weight:700;color:#16223B!important;gap:7px!important;letter-spacing:-.02em;text-align:center;line-height:1.3;width:84px}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a>svg{width:44px;height:44px;padding:11px;box-sizing:border-box;border-radius:50%;background:#EEF4FB;color:#2E7BF0;transition:background .2s ease,color .2s ease,transform .2s ease}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a:hover>svg{background:#2E7BF0;color:#fff;transform:translateY(-2px)}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a:nth-child(3)>svg{background:#E9F9EF;color:#03A651}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a:nth-child(3):hover>svg{background:#03C75A;color:#fff}
#mansup-app #mu-header-utils>a[href="consult.html"]{background:#2E7BF0;border-color:#2E7BF0;color:#fff!important;font-weight:700;box-shadow:0 6px 16px rgba(46,123,240,.22)}
#mansup-app #mu-header-utils>a[href="consult.html"]:hover{background:#1F66D6;border-color:#1F66D6}
#mansup-app .mu-header #mu-gnb>.mu-nav-item>a{color:#16223B}

/* ---------- 3) 하단 고정 상담바 (레일이 사라지는 1240px 이하) ---------- */
#mansup-app .mu-quickbar{display:none}
@media(max-width:1240px){
 #mansup-app .mu-quickbar{position:fixed;left:0;right:0;bottom:0;z-index:120;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border-top:1px solid #E3E9F0;box-shadow:0 -10px 30px rgba(16,34,59,.10);padding-bottom:env(safe-area-inset-bottom,0)}
 #mansup-app .mu-quickbar>a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:62px;padding:8px 4px;font-size:11.5px;font-weight:700;letter-spacing:-.02em;color:#16223B;text-align:center;line-height:1.2;border-right:1px solid #EEF2F6}
 #mansup-app .mu-quickbar>a:last-child{border-right:0}
 #mansup-app .mu-quickbar>a>svg{width:22px;height:22px;color:#2E7BF0}
 #mansup-app .mu-quickbar>a.mu-qb-talk>svg{color:#03C75A}
 #mansup-app .mu-quickbar>a.mu-qb-book{background:#03C75A;color:#fff}
 #mansup-app .mu-quickbar>a.mu-qb-book>svg{color:#fff}
 #mansup-app .mu-quickbar>a.mu-qb-call{background:#2E7BF0;color:#fff}
 #mansup-app .mu-quickbar>a.mu-qb-call>svg{color:#fff}
 #mansup-app .mu-site-layout{padding-bottom:calc(62px + env(safe-area-inset-bottom,0))}
 #mansup-app .mu-footer{padding-bottom:70px!important}
}
@media print{#mansup-app .mu-quickbar{display:none!important}}

/* ---------- 4) 히어로 인증 블록 확대 ---------- */
@media(min-width:901px){
 #mansup-app .mu-home #mu-hero.mu-photo-hero{min-height:700px!important;max-height:960px!important}
 #mansup-app .mu-photo-hero .mu-slide{padding-bottom:210px}
 #mansup-app .mu-photo-hero .mu-hero-copy{width:58%!important}
 #mansup-app .mu-home .mu-hero-trust{left:auto;right:5%;bottom:34px;width:min(720px,54vw);box-sizing:border-box;gap:18px;padding:24px 28px 22px;border-radius:22px;background:rgba(9,20,34,.50);border:1px solid rgba(255,255,255,.16)}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert{gap:18px;padding:11px 26px;border-radius:999px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert img{height:clamp(28px,2.6vw,38px)}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert-sep{height:26px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert-text{font-size:clamp(15px,1.25vw,18.5px)}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert mark{padding:3px 10px;border-radius:7px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges{display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(14px,1.6vw,28px);width:100%}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li{width:auto;gap:12px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li img{width:clamp(78px,6.6vw,100px);filter:drop-shadow(0 8px 18px rgba(0,0,0,.45))}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li span{font-size:clamp(12.5px,.95vw,14px);line-height:1.55;color:#F7FAFD}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li span b{display:block;font-size:1.08em;font-weight:800;margin-bottom:4px;color:#fff;letter-spacing:-.02em}
}
@media(min-width:901px) and (max-width:1240px){
 #mansup-app .mu-home .mu-hero-trust{width:min(600px,56vw);padding:20px 20px 18px}
 #mansup-app .mu-photo-hero .mu-hero-copy{width:62%!important}
}
@media(max-width:900px){
 #mansup-app .mu-home .mu-hero-trust{padding:30px 6% 34px;gap:22px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert img{height:26px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert-text{font-size:15px;font-weight:800}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li img{width:72px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li span{font-size:12.5px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li span b{display:block;font-weight:800;color:#fff;margin-bottom:3px;font-size:13.5px}
}
@media(max-width:560px){
 #mansup-app .mu-home .mu-hero-trust .mu-trust-badges li img{width:64px;flex:0 0 64px}
 #mansup-app .mu-home .mu-hero-trust .mu-trust-cert img{height:24px}
}

/* ---------- 5) 메인 신규 섹션 공통 ---------- */
#mansup-app .su-section{padding:clamp(72px,7vw,120px) 64px;background:#fff}
#mansup-app .su-section>div{max-width:1640px;margin:0 auto}
#mansup-app .su-eyebrow{margin:0;font-family:'Poppins',sans-serif;font-size:13.5px;font-weight:600;letter-spacing:.2em;color:#4A93C8}
#mansup-app .su-title{margin:22px 0 0;font-size:clamp(30px,2.7vw,46px);font-weight:700;letter-spacing:-.03em;line-height:1.4;color:#101B33}
#mansup-app .su-lead{margin:22px 0 0;max-width:820px;font-size:16.5px;line-height:1.9;letter-spacing:-.01em;color:#5B6B7D}
#mansup-app .su-lead strong{color:#16223B;font-weight:700}

/* 진료 권역 */
#mansup-app #mu-area{background:#F5F8FB}
#mansup-app .su-area-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:clamp(40px,5vw,90px);align-items:start;margin-top:clamp(40px,4vw,64px)}
#mansup-app .su-area-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
#mansup-app .su-area-group{background:#fff;border:1px solid #E3E9F0;border-radius:16px;padding:24px 24px 22px}
#mansup-app .su-area-group>p{margin:0;font-size:13px;font-weight:700;letter-spacing:.06em;color:#7C8AA0}
#mansup-app .su-area-group>ul{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
#mansup-app .su-area-group>ul>li{font-size:14.5px;font-weight:600;color:#16223B;background:#F1F5FA;border-radius:999px;padding:8px 14px;letter-spacing:-.01em}
#mansup-app .su-area-group>ul>li.is-home{background:#2E7BF0;color:#fff}
#mansup-app .su-area-keywords{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#mansup-app .su-area-keywords>li>a{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid #E3E9F0;border-radius:12px;padding:16px 18px;font-size:15px;font-weight:600;color:#16223B;transition:border-color .2s ease,transform .2s ease}
#mansup-app .su-area-keywords>li>a:hover{border-color:#2E7BF0;color:#2E7BF0;transform:translateY(-2px)}
#mansup-app .su-area-keywords>li>a>span:last-child{color:#4A93C8}
#mansup-app .su-area-note{margin:24px 0 0;font-size:13.5px;line-height:1.7;color:#7C8AA0}

/* 지도 */
#mansup-app .su-map-wrap{position:relative;margin-top:0;background:#fff}
#mansup-app .su-map-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:0;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 30px 70px rgba(16,34,59,.12)}
#mansup-app .su-map-info{padding:clamp(34px,3.5vw,54px);display:flex;flex-direction:column;gap:22px;background:#fff;color:#16223B}
#mansup-app .su-map-info h3{margin:0;font-size:clamp(27px,2vw,35px);font-weight:800;letter-spacing:-.025em;line-height:1.35}
#mansup-app .su-map-info h3 small{display:block;font-size:14px;font-weight:600;letter-spacing:.1em;color:#4A93C8;margin-bottom:12px;font-family:'Poppins',sans-serif}
#mansup-app .su-map-info address{font-style:normal;font-size:16.5px;line-height:1.8;color:#3A465E}
#mansup-app .su-map-info address strong{display:block;font-size:17.5px;color:#16223B}
#mansup-app .su-map-steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#mansup-app .su-map-steps>li{display:flex;gap:12px;align-items:flex-start;font-size:15px;line-height:1.7;color:#3A465E}
#mansup-app .su-map-steps>li>span{flex:0 0 26px;height:26px;border-radius:50%;background:#EAF2FF;color:#2E7BF0;font-size:12px;font-weight:800;display:grid;place-items:center;margin-top:3px;font-family:'Poppins',sans-serif}
#mansup-app .su-map-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px}
#mansup-app .su-map-actions>a{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border-radius:999px;font-size:14px;font-weight:700;border:1px solid #D4DCE6;color:#16223B;background:#fff;transition:all .2s ease}
#mansup-app .su-map-actions>a:hover{border-color:#2E7BF0;color:#2E7BF0}
#mansup-app .su-map-actions>a.is-naver{background:#03C75A;border-color:#03C75A;color:#fff}
#mansup-app .su-map-actions>a.is-naver:hover{background:#02A94C}
#mansup-app .su-map-actions>a.is-kakao{background:#FEE500;border-color:#FEE500;color:#191919}
#mansup-app .su-map-frame{position:relative;min-height:420px;background:#E9EEF3}
#mansup-app .su-map-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
#mansup-app .su-map-frame>a{position:absolute;left:16px;bottom:16px;background:rgba(255,255,255,.95);border-radius:999px;padding:8px 14px;font-size:12.5px;font-weight:700;color:#16223B;box-shadow:0 6px 18px rgba(0,0,0,.14)}

/* FAQ (메인) */
#mansup-app #mu-faq{background:#fff}
#mansup-app .su-faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.5fr);gap:clamp(40px,5vw,100px);align-items:start}
#mansup-app .su-faq-list{margin:0;padding:0;border-top:1px solid #E3E9F0}
#mansup-app .su-faq-list details{border-bottom:1px solid #E3E9F0}
#mansup-app .su-faq-list summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 4px;font-size:17.5px;font-weight:700;letter-spacing:-.02em;color:#16223B;line-height:1.5}
#mansup-app .su-faq-list summary::-webkit-details-marker{display:none}
#mansup-app .su-faq-list summary>span:first-child{display:flex;gap:16px;align-items:flex-start}
#mansup-app .su-faq-list summary>span:first-child>b{flex:0 0 auto;font-family:'Poppins',sans-serif;font-size:13px;font-weight:700;color:#4A93C8;margin-top:5px;letter-spacing:.06em}
#mansup-app .su-faq-list summary>i{flex:0 0 28px;height:28px;border-radius:50%;border:1px solid #D4DCE6;display:grid;place-items:center;font-style:normal;font-size:18px;color:#4A93C8;transition:transform .25s ease,background .25s ease}
#mansup-app .su-faq-list details[open] summary>i{transform:rotate(45deg);background:#2E7BF0;color:#fff;border-color:#2E7BF0}
#mansup-app .su-faq-list details>div{padding:0 4px 26px 0}
#mansup-app .su-faq-list details>div>p{margin:0;font-size:15.5px;line-height:1.9;color:#4B5A70;max-width:900px;word-break:keep-all}
#mansup-app .su-faq-side{position:sticky;top:var(--mu-sticky-top)}
#mansup-app .su-faq-side .su-btn{margin-top:30px}
#mansup-app .su-btn{display:inline-flex;align-items:center;gap:14px;padding:16px 26px;border-radius:999px;background:#16223B;color:#fff;font-size:15px;font-weight:700;transition:background .2s ease}
#mansup-app .su-btn:hover{background:#2E7BF0;color:#fff}
#mansup-app .su-btn.is-light{background:#fff;color:#16223B;border:1px solid #D4DCE6}
#mansup-app .su-btn.is-light:hover{border-color:#2E7BF0;color:#2E7BF0}

@media(max-width:1240px){
 #mansup-app .su-section{padding-inline:40px}
}
@media(max-width:900px){
 #mansup-app .su-area-grid,#mansup-app .su-faq-grid,#mansup-app .su-map-grid{grid-template-columns:1fr;gap:36px}
 #mansup-app .su-faq-side{position:static}
 #mansup-app .su-map-frame{min-height:340px}
}
@media(max-width:760px){
 #mansup-app .su-section{padding:64px 24px}
 #mansup-app .su-area-groups,#mansup-app .su-area-keywords{grid-template-columns:1fr}
 #mansup-app .su-faq-list summary{font-size:16px;padding:20px 0}
 #mansup-app .su-map-info{padding:28px 22px}
}

/* ---------- 6) 대표원장 소개 ---------- */
#mansup-app .dr-greeting{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(40px,5vw,90px);align-items:center;margin-top:clamp(56px,6vw,96px)}
#mansup-app .dr-greeting figure{margin:0;position:relative;overflow:hidden;border-radius:18px}
#mansup-app .dr-greeting figure img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
#mansup-app .dr-greeting figure figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 26px;background:linear-gradient(0deg,rgba(9,20,34,.75),transparent);color:#fff;font-size:13.5px;letter-spacing:-.01em}
#mansup-app .dr-greeting-copy .eyebrow{margin:0;font-family:'Poppins',sans-serif;font-size:13.5px;font-weight:600;letter-spacing:.2em;color:#4A93C8}
#mansup-app .dr-greeting-copy h2{margin:22px 0 0;font-size:clamp(31px,2.6vw,45px);font-weight:700;letter-spacing:-.03em;line-height:1.45;color:#101B33}
#mansup-app .dr-greeting-copy h2 span{display:block;color:#2E7BF0}
#mansup-app .dr-greeting-copy p{margin:20px 0 0;font-size:16.5px;line-height:1.95;letter-spacing:-.01em;color:#4B5A70;word-break:keep-all}
#mansup-app .dr-greeting-copy p:first-of-type{margin-top:34px;font-size:17.5px;color:#16223B}
#mansup-app .dr-sign{margin-top:38px;display:flex;align-items:center;gap:20px;padding-top:26px;border-top:1px solid #E3E9F0}
#mansup-app .dr-sign>span{font-size:14px;color:#7C8AA0;line-height:1.6}
#mansup-app .dr-sign>strong{font-size:22px;font-weight:800;letter-spacing:-.02em;color:#16223B}
#mansup-app .dr-sign>strong small{display:block;font-size:13px;font-weight:600;color:#4A93C8;letter-spacing:.04em;margin-bottom:4px}

#mansup-app .dr-principles{margin-top:clamp(70px,7vw,110px);background:#F5F8FB;border-radius:24px;padding:clamp(40px,4vw,64px)}
#mansup-app .dr-principles>header{display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap}
#mansup-app .dr-principles>header h3{margin:0;font-size:clamp(29px,2.2vw,37px);font-weight:700;letter-spacing:-.03em;line-height:1.4;color:#101B33}
#mansup-app .dr-principles>header p{margin:0;max-width:460px;font-size:15px;line-height:1.8;color:#5B6B7D}
#mansup-app .dr-principle-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:38px}
#mansup-app .dr-principle-grid>article{background:#fff;border-radius:16px;padding:28px 26px 30px;border:1px solid #E3E9F0}
#mansup-app .dr-principle-grid>article>span{font-family:'Poppins',sans-serif;font-size:13px;font-weight:700;letter-spacing:.14em;color:#4A93C8}
#mansup-app .dr-principle-grid>article>h4{margin:16px 0 0;font-size:22px;font-weight:700;letter-spacing:-.02em;color:#16223B;line-height:1.45}
#mansup-app .dr-principle-grid>article>p{margin:12px 0 0;font-size:14.5px;line-height:1.85;color:#5B6B7D;word-break:keep-all}

#mansup-app .dr-scenes{margin-top:clamp(70px,7vw,110px)}
#mansup-app .dr-scenes>header{max-width:760px}
#mansup-app .dr-scenes>header h3{margin:0;font-size:clamp(29px,2.2vw,37px);font-weight:700;letter-spacing:-.03em;line-height:1.4;color:#101B33}
#mansup-app .dr-scenes>header p{margin:16px 0 0;font-size:15.5px;line-height:1.85;color:#5B6B7D}
#mansup-app .dr-scene-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:36px}
#mansup-app .dr-scene-grid figure{margin:0;border-radius:16px;overflow:hidden;background:#F1F5FA}
#mansup-app .dr-scene-grid figure img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .6s ease}
#mansup-app .dr-scene-grid figure:hover img{transform:scale(1.03)}
#mansup-app .dr-scene-grid figcaption{padding:18px 20px 22px}
#mansup-app .dr-scene-grid figcaption b{display:block;font-size:16.5px;font-weight:700;color:#16223B;letter-spacing:-.02em}
#mansup-app .dr-scene-grid figcaption span{display:block;margin-top:6px;font-size:14px;line-height:1.7;color:#5B6B7D}

#mansup-app .dr-timeline{margin-top:clamp(70px,7vw,110px);display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(40px,5vw,90px)}
#mansup-app .dr-timeline>div:first-child h3{margin:0;font-size:clamp(29px,2.2vw,37px);font-weight:700;letter-spacing:-.03em;line-height:1.4;color:#101B33}
#mansup-app .dr-timeline>div:first-child p{margin:16px 0 0;font-size:15.5px;line-height:1.85;color:#5B6B7D}
#mansup-app .dr-timeline dl{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border-top:1px solid #E3E9F0}
#mansup-app .dr-timeline dl>div{border-bottom:1px solid #E3E9F0;padding:20px 0}
#mansup-app .dr-timeline dt{font-size:13px;font-weight:700;letter-spacing:.06em;color:#7C8AA0}
#mansup-app .dr-timeline dd{margin:8px 0 0;font-size:16px;line-height:1.7;color:#16223B;font-weight:600}
#mansup-app .dr-fields{margin-top:clamp(56px,5vw,80px)}
#mansup-app .dr-fields h3{margin:0;font-size:25px;font-weight:700;letter-spacing:-.02em;color:#101B33}
#mansup-app .dr-fields ul{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
#mansup-app .dr-fields ul>li>a{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:999px;border:1px solid #D4DCE6;font-size:14.5px;font-weight:600;color:#16223B;background:#fff;transition:all .2s ease}
#mansup-app .dr-fields ul>li>a:hover{border-color:#2E7BF0;color:#2E7BF0}
@media(max-width:1000px){
 #mansup-app .dr-principle-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #mansup-app .dr-scene-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:800px){
 #mansup-app .dr-greeting,#mansup-app .dr-timeline{grid-template-columns:1fr;gap:34px}
 #mansup-app .dr-timeline dl{grid-template-columns:1fr}
 #mansup-app .dr-scene-grid{grid-template-columns:1fr}
 #mansup-app .dr-principles{padding:30px 22px;border-radius:18px}
}
@media(max-width:560px){#mansup-app .dr-principle-grid{grid-template-columns:1fr}}

/* ---------- 7) 더블업 확대수술 ---------- */
#mansup-app .du-illust{width:100%;max-width:1080px;margin:44px auto 0;background:#fff;border:1px solid #E3E9F0;border-radius:22px;padding:clamp(22px,3vw,40px);box-sizing:border-box}
#mansup-app .du-illust svg{display:block;width:100%;height:auto}
#mansup-app .du-illust figcaption{margin-top:18px;font-size:14px;line-height:1.75;color:#718596;text-align:center}
#mansup-app .du-illust-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;margin:18px 0 0;padding:0;list-style:none;font-size:13.5px;color:#3A465E}
#mansup-app .du-illust-legend>li{display:inline-flex;align-items:center;gap:8px}
#mansup-app .du-illust-legend i{width:14px;height:14px;border-radius:4px;display:inline-block}

#mansup-app .du-material-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;margin-top:44px}
#mansup-app .du-material-card{border:1px solid #E3E9F0;border-radius:20px;background:#fff;overflow:hidden;display:grid;grid-template-rows:auto 1fr}
#mansup-app .du-material-card>figure{margin:0;background:linear-gradient(160deg,#F5F8FB,#E9F1FA);padding:34px 30px;display:grid;place-items:center;min-height:230px}
#mansup-app .du-material-card>figure svg{width:min(100%,260px);height:auto}
#mansup-app .du-material-card>div{padding:28px 30px 32px}
#mansup-app .du-material-card>div>span{font-family:'Poppins',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.16em;color:#4A93C8}
#mansup-app .du-material-card>div>h3{margin:12px 0 0;font-size:27px;font-weight:700;letter-spacing:-.02em;color:#16223B;line-height:1.4}
#mansup-app .du-material-card>div>p{margin:14px 0 0;font-size:15.5px;line-height:1.85;color:#4B5A70;word-break:keep-all}
#mansup-app .du-material-card dl{margin:20px 0 0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:14px;line-height:1.7;border-top:1px solid #E9EEF3;padding-top:18px}
#mansup-app .du-material-card dt{font-weight:700;color:#7C8AA0;white-space:nowrap}
#mansup-app .du-material-card dd{margin:0;color:#3A465E}

#mansup-app .du-process{padding:clamp(70px,7vw,110px) 0;background:#F5F8FB}
#mansup-app .du-process h2{text-align:center;margin:0;font-size:clamp(33px,2.6vw,43px);font-weight:700;letter-spacing:-.03em;color:#101B33;line-height:1.4}
#mansup-app .du-process>.vr-container>p{text-align:center;max-width:760px;margin:20px auto 0;font-size:16px;line-height:1.85;color:#5B6B7D}
#mansup-app .du-steps{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;counter-reset:du}
#mansup-app .du-steps>li{background:#fff;border-radius:18px;padding:28px 24px 30px;border:1px solid #E3E9F0;position:relative}
#mansup-app .du-steps>li::before{counter-increment:du;content:"0" counter(du);font-family:'Poppins',sans-serif;font-size:13px;font-weight:700;letter-spacing:.14em;color:#4A93C8}
#mansup-app .du-steps>li>svg{display:block;width:40px;height:40px;margin-top:18px;color:#2E7BF0}
#mansup-app .du-steps>li>h3{margin:18px 0 0;font-size:22px;font-weight:700;letter-spacing:-.02em;color:#16223B;line-height:1.4}
#mansup-app .du-steps>li>p{margin:12px 0 0;font-size:14.5px;line-height:1.8;color:#5B6B7D;word-break:keep-all}

#mansup-app .du-compare{padding:clamp(70px,7vw,110px) 0 20px}
#mansup-app .du-compare h2{text-align:center;margin:0;font-size:clamp(33px,2.6vw,43px);font-weight:700;letter-spacing:-.03em;color:#101B33;line-height:1.4}
#mansup-app .du-compare>p{text-align:center;max-width:760px;margin:20px auto 0;font-size:16px;line-height:1.85;color:#5B6B7D}
#mansup-app .du-table-wrap{overflow-x:auto;margin-top:44px;border:1px solid #E3E9F0;border-radius:18px}
#mansup-app .du-table{width:100%;border-collapse:collapse;min-width:720px;font-size:15px}
#mansup-app .du-table th,#mansup-app .du-table td{padding:18px 20px;text-align:left;border-bottom:1px solid #E9EEF3;vertical-align:top;line-height:1.7;word-break:keep-all}
#mansup-app .du-table thead th{background:#F5F8FB;font-size:14px;font-weight:700;color:#7C8AA0;letter-spacing:.02em}
#mansup-app .du-table thead th.is-highlight{background:#2E7BF0;color:#fff}
#mansup-app .du-table tbody th{font-weight:700;color:#16223B;background:#FAFBFD;white-space:nowrap}
#mansup-app .du-table td.is-highlight{background:#F2F7FF;font-weight:600;color:#16223B}
#mansup-app .du-table tbody tr:last-child th,#mansup-app .du-table tbody tr:last-child td{border-bottom:0}
#mansup-app .du-table-note{margin:16px 0 0;font-size:13.5px;line-height:1.7;color:#7C8AA0}

#mansup-app .du-timeline{padding:clamp(70px,7vw,110px) 0}
#mansup-app .du-timeline h2{margin:0;font-size:clamp(33px,2.6vw,43px);font-weight:700;letter-spacing:-.03em;color:#101B33;line-height:1.4}
#mansup-app .du-timeline>.vr-container>p{max-width:760px;margin:20px 0 0;font-size:16px;line-height:1.85;color:#5B6B7D}
#mansup-app .du-tl{list-style:none;margin:44px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border-top:2px solid #E3E9F0}
#mansup-app .du-tl>li{padding:26px 26px 0 0;position:relative}
#mansup-app .du-tl>li::before{content:"";position:absolute;left:0;top:-2px;width:52px;height:2px;background:#2E7BF0}
#mansup-app .du-tl>li>span{font-family:'Poppins',sans-serif;font-size:13px;font-weight:700;letter-spacing:.14em;color:#2E7BF0}
#mansup-app .du-tl>li>h3{margin:12px 0 0;font-size:22px;font-weight:700;letter-spacing:-.02em;color:#16223B}
#mansup-app .du-tl>li>p{margin:12px 0 0;font-size:14.5px;line-height:1.85;color:#5B6B7D;word-break:keep-all}

#mansup-app .du-fit{padding:0 0 clamp(60px,6vw,90px)}
#mansup-app .du-fit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
#mansup-app .du-fit-grid>article{border-radius:18px;padding:32px 30px 34px;border:1px solid #E3E9F0;background:#fff}
#mansup-app .du-fit-grid>article.is-caution{background:#FFF8F2;border-color:#F5DCC6}
#mansup-app .du-fit-grid>article>h3{margin:0;font-size:23px;font-weight:700;letter-spacing:-.02em;color:#16223B}
#mansup-app .du-fit-grid>article>ul{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:10px}
#mansup-app .du-fit-grid>article>ul>li{position:relative;padding-left:22px;font-size:15px;line-height:1.75;color:#3A465E;word-break:keep-all}
#mansup-app .du-fit-grid>article>ul>li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:8px;border-radius:50%;background:#2E7BF0}
#mansup-app .du-fit-grid>article.is-caution>ul>li::before{background:#E4884A}

#mansup-app .du-video{padding:clamp(70px,7vw,110px) 0;background:#16223B;color:#fff}
#mansup-app .du-video .vr-container{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.3fr);gap:clamp(36px,5vw,80px);align-items:center}
#mansup-app .du-video h2{margin:0;font-size:clamp(31px,2.4vw,41px);font-weight:700;letter-spacing:-.03em;line-height:1.45;color:#fff}
#mansup-app .du-video p{margin:18px 0 0;font-size:15.5px;line-height:1.85;color:rgba(255,255,255,.8)}
#mansup-app .du-video .su-btn{margin-top:28px;background:#fff;color:#16223B}
#mansup-app .du-video .su-btn:hover{background:#2E7BF0;color:#fff}
#mansup-app .du-video-frame{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#0E1930;box-shadow:0 30px 70px rgba(0,0,0,.35)}
#mansup-app .du-video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
#mansup-app .du-photo-band{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:44px}
#mansup-app .du-photo-band figure{margin:0;border-radius:16px;overflow:hidden;background:#F1F5FA}
#mansup-app .du-photo-band img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
#mansup-app .du-photo-band figcaption{padding:14px 16px;font-size:13.5px;line-height:1.6;color:#5B6B7D}
#mansup-app .du-local{margin-top:44px;padding:30px 34px;border-radius:18px;background:#F5F8FB;display:grid;grid-template-columns:auto 1fr;gap:22px;align-items:center}
#mansup-app .du-local>svg{width:44px;height:44px;color:#2E7BF0}
#mansup-app .du-local>div>b{display:block;font-size:17px;color:#16223B;letter-spacing:-.02em}
#mansup-app .du-local>div>p{margin:8px 0 0;font-size:15px;line-height:1.8;color:#4B5A70;word-break:keep-all}
@media(max-width:1000px){
 #mansup-app .du-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
 #mansup-app .du-tl{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 0}
 #mansup-app .du-video .vr-container{grid-template-columns:1fr}
}
@media(max-width:760px){
 #mansup-app .du-material-cards,#mansup-app .du-fit-grid,#mansup-app .du-photo-band{grid-template-columns:1fr}
 #mansup-app .du-steps{grid-template-columns:1fr}
 #mansup-app .du-tl{grid-template-columns:1fr}
 #mansup-app .du-local{grid-template-columns:1fr;padding:24px 22px}
 #mansup-app .du-illust{border-radius:16px}
}

/* ---------- 8) 2026-09-20 (b) 광고주 회신 반영 ---------- */
/* 레일 5번째 "네이버 예약" */
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a.mu-rail-book>svg{background:#03C75A;color:#fff}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]>a.mu-rail-book:hover>svg{background:#02A94C}
#mansup-app .mu-rail nav[aria-label="빠른 메뉴"]{gap:18px}
/* PROOF 섹션 (구 IN NUMBERS) */
#mansup-app .su-proof .su-cert{margin:36px 0 0;max-width:380px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:16px;box-sizing:border-box}
#mansup-app .su-proof .su-cert img{display:block;width:100%;height:auto;border-radius:10px;box-shadow:0 18px 40px rgba(0,0,0,.35)}
#mansup-app .su-proof .su-cert figcaption{margin-top:14px;font-size:13px;line-height:1.6;color:rgba(255,255,255,.8)}
#mansup-app .su-proof .su-cert figcaption b{display:block;font-size:14.5px;color:#fff;margin-bottom:3px}
#mansup-app .su-proof .su-stat-basis{margin:10px 0 0;font-size:13px;line-height:1.65;color:rgba(255,255,255,.58);word-break:keep-all}
@media(max-width:900px){#mansup-app .su-proof .su-cert{max-width:320px}}
@media(max-width:760px){#mansup-app .su-proof .su-stat-basis{font-size:12px}#mansup-app .su-proof .su-cert{margin-top:26px;padding:12px}}
/* 원장 소개 — 자격증 */
#mansup-app .dr-cert{margin:28px 0 0;max-width:300px;background:#F5F8FB;border:1px solid #E3E9F0;border-radius:16px;padding:14px;box-sizing:border-box}
#mansup-app .dr-cert img{display:block;width:100%;height:auto;border-radius:8px;box-shadow:0 12px 30px rgba(16,34,59,.14)}
#mansup-app .dr-cert figcaption{margin-top:12px;font-size:12.5px;line-height:1.6;color:#5B6B7D}
#mansup-app .dr-cert figcaption b{display:block;font-size:14px;color:#16223B;margin-bottom:2px}


/* ============================================================
   R2 (2026-09-20) 2차 수정 — 메인 소식 카드 · 상담 배너 · PROOF ·
   원장 인사말/진료 원칙 · 오시는 길 지도/플레이스 · 푸터 SNS
   ============================================================ */

/* ---- 메인 PROOF ---- */
#mansup-app .su-proof-notes{list-style:none;margin:30px 0 0;padding:0;display:flex;flex-direction:column;gap:10px;max-width:520px}
#mansup-app .su-proof-notes>li{position:relative;padding-left:18px;font-size:14.5px;line-height:1.7;color:rgba(255,255,255,.82);word-break:keep-all}
#mansup-app .su-proof-notes>li::before{content:"";position:absolute;left:0;top:.72em;width:7px;height:7px;border-radius:50%;background:#9CC8EA}

/* ---- 메인 상담·예약 배너 ---- */
#mansup-app .su-contact-band{background:linear-gradient(90deg,#16223B 0%,#1F3A5F 100%);padding:0 64px}
#mansup-app .su-band-inner{max-width:1640px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
#mansup-app .su-band-item{display:flex;align-items:center;gap:18px;padding:34px 30px;color:#fff;text-decoration:none;border-left:1px solid rgba(255,255,255,.14);transition:background .25s ease}
#mansup-app .su-band-item:first-child{border-left:0}
#mansup-app .su-band-item:hover{background:rgba(255,255,255,.07)}
#mansup-app .su-band-ico{flex:0 0 54px;width:54px;height:54px;border-radius:50%;border:1px solid rgba(255,255,255,.35);display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.06)}
#mansup-app .su-band-ico svg{width:24px;height:24px}
#mansup-app .su-band-txt{display:flex;flex-direction:column;gap:6px;min-width:0}
#mansup-app .su-band-txt>b{font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1.2;white-space:nowrap}
#mansup-app .su-band-item--tel .su-band-txt>b{font-family:'Poppins',sans-serif;font-size:21px;letter-spacing:.02em}
#mansup-app .su-band-txt>small{font-size:13px;color:rgba(255,255,255,.7);line-height:1.5;word-break:keep-all}
@media(max-width:1100px){#mansup-app .su-band-inner{grid-template-columns:repeat(2,minmax(0,1fr))}#mansup-app .su-band-item:nth-child(3){border-left:0}#mansup-app .su-band-item:nth-child(n+3){border-top:1px solid rgba(255,255,255,.14)}}
@media(max-width:760px){#mansup-app .su-contact-band{padding:0 16px}#mansup-app .su-band-item{padding:22px 14px;gap:12px}#mansup-app .su-band-ico{flex-basis:44px;width:44px;height:44px}#mansup-app .su-band-txt>b{font-size:15.5px}#mansup-app .su-band-item--tel .su-band-txt>b{font-size:17px}#mansup-app .su-band-txt>small{font-size:12px}}
@media(max-width:480px){#mansup-app .su-band-inner{grid-template-columns:1fr}#mansup-app .su-band-item{border-left:0;border-top:1px solid rgba(255,255,255,.14)}#mansup-app .su-band-item:first-child{border-top:0}}

/* ---- 메인 소식 2행 2열 카드 ---- */
#mansup-app .su-news-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px clamp(40px,4vw,72px);margin-top:34px}
#mansup-app .su-news-col{min-width:0}
#mansup-app .su-news-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
#mansup-app .su-news-head h3{margin:0;font-size:21px;font-weight:700;color:#16223B;letter-spacing:-.01em}
#mansup-app .su-news-head a{font-size:13px;font-weight:600;color:#33415C;border:1px solid #D5DCE6;border-radius:999px;padding:6px 14px;transition:all .2s ease}
#mansup-app .su-news-head a:hover{border-color:#4A93C8;color:#4A93C8}
#mansup-app .su-news-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
#mansup-app .su-news-card{display:flex;align-items:center;gap:16px;min-width:0;height:100%;padding:14px;border:1px solid #E6EBF2;border-radius:14px;background:#fff;color:inherit;text-decoration:none;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
#mansup-app .su-news-card:hover{border-color:#BFD3EA;box-shadow:0 12px 28px rgba(22,40,63,.08);transform:translateY(-2px)}
#mansup-app .su-news-card>img{flex:0 0 96px;width:96px;height:96px;object-fit:cover;border-radius:10px;background:#EEF2F7}
#mansup-app .su-news-card>span{display:flex;flex-direction:column;gap:6px;min-width:0}
#mansup-app .su-news-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:15.5px;font-weight:600;line-height:1.5;color:#22304A;letter-spacing:-.01em;word-break:keep-all}
#mansup-app .su-news-date{font-size:12.5px;color:#9AA6B8}
@media(max-width:1200px){#mansup-app .su-news-card>img{flex-basis:80px;width:80px;height:80px}}
@media(max-width:900px){#mansup-app .su-news-grid{grid-template-columns:1fr}}
@media(max-width:560px){#mansup-app .su-news-cards{grid-template-columns:1fr}}

/* ---- 메인 FAQ 다단락 ---- */
#mansup-app .su-faq-list details>div>p+p{margin-top:12px}
#mansup-app .su-faq-list details>div>p>b{color:#16223B;font-weight:700}
#mansup-app .su-faq-list details>div>p>a{color:#2E7BF0;text-decoration:underline;text-underline-offset:3px}

/* ---- 원장 인사말 (사진 없이 편집형 구도) ---- */
#mansup-app .dr-greeting--editorial{grid-template-columns:minmax(0,.85fr) minmax(0,1.45fr);align-items:start;gap:clamp(40px,6vw,110px)}
#mansup-app .dr-greeting-head{position:sticky;top:var(--mu-sticky-top)}
#mansup-app .dr-greeting-head .eyebrow{margin:0;font-family:'Poppins',sans-serif;font-size:13.5px;font-weight:600;letter-spacing:.2em;color:#4A93C8}
#mansup-app .dr-greeting-head h2{margin:22px 0 0;font-size:clamp(31px,2.6vw,45px);font-weight:700;letter-spacing:-.03em;line-height:1.45;color:#101B33}
#mansup-app .dr-greeting-head h2 span{display:block;color:#2E7BF0}
#mansup-app .dr-greeting-quote{margin:30px 0 0;padding:22px 26px;border-left:3px solid #2E7BF0;background:#F5F8FB;border-radius:0 14px 14px 0;font-size:17px;font-weight:600;line-height:1.7;letter-spacing:-.02em;color:#16223B}
#mansup-app .dr-greeting-head .dr-sign{margin-top:34px}
#mansup-app .dr-greeting--editorial .dr-greeting-copy{border-left:1px solid #E3E9F0;padding-left:clamp(28px,4vw,64px)}
#mansup-app .dr-greeting--editorial .dr-greeting-copy p:first-of-type{margin-top:0;font-size:18px;color:#16223B;font-weight:500}
#mansup-app .dr-greeting--editorial .dr-greeting-copy p:first-of-type::first-letter{font-size:1.6em;font-weight:700;color:#2E7BF0;line-height:1;padding-right:2px}
@media(max-width:800px){#mansup-app .dr-greeting--editorial{grid-template-columns:1fr;gap:30px}#mansup-app .dr-greeting-head{position:static}#mansup-app .dr-greeting--editorial .dr-greeting-copy{border-left:0;padding-left:0;border-top:1px solid #E3E9F0;padding-top:26px}}

/* ---- 진료 원칙 (진한 남색) ---- */
#mansup-app .dr-principles{position:relative;overflow:hidden;background:linear-gradient(135deg,#0F1D38 0%,#1A2F52 55%,#1F3A5F 100%);color:#fff;border-radius:24px}
#mansup-app .dr-principles::before{content:"";position:absolute;right:-120px;top:-140px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(74,147,200,.28),rgba(74,147,200,0) 70%);pointer-events:none}
#mansup-app .dr-principles::after{content:"PRINCIPLES";position:absolute;left:clamp(20px,3vw,48px);bottom:14px;font-family:'Poppins',sans-serif;font-size:clamp(48px,7vw,110px);font-weight:700;letter-spacing:.04em;color:rgba(255,255,255,.04);pointer-events:none;line-height:1}
#mansup-app .dr-principles>header{position:relative;z-index:1}
#mansup-app .dr-principles>header h3{color:#fff}
#mansup-app .dr-principles>header h3::before{content:"OUR PRINCIPLES";display:block;font-family:'Poppins',sans-serif;font-size:12.5px;font-weight:600;letter-spacing:.2em;color:#9CC8EA;margin-bottom:14px}
#mansup-app .dr-principles>header p{color:rgba(255,255,255,.72);max-width:520px}
#mansup-app .dr-principle-grid{position:relative;z-index:1;gap:16px}
#mansup-app .dr-principle-grid>article{position:relative;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:30px 26px 32px;backdrop-filter:blur(4px);transition:transform .3s ease,background .3s ease,border-color .3s ease}
#mansup-app .dr-principle-grid>article:hover{transform:translateY(-6px);background:rgba(255,255,255,.1);border-color:rgba(156,200,234,.5)}
#mansup-app .dr-principle-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:rgba(156,200,234,.14);border:1px solid rgba(156,200,234,.35);color:#9CC8EA;margin-bottom:22px}
#mansup-app .dr-principle-ico svg{width:26px;height:26px}
#mansup-app .dr-principle-grid>article>span{position:absolute;right:22px;top:20px;font-family:'Poppins',sans-serif;font-size:30px;font-weight:700;letter-spacing:-.02em;color:rgba(255,255,255,.14)}
#mansup-app .dr-principle-grid>article>h4{color:#fff;margin-top:0}
#mansup-app .dr-principle-grid>article>p{color:rgba(255,255,255,.76)}
@media(max-width:800px){#mansup-app .dr-principles{border-radius:18px}#mansup-app .dr-principles::after{font-size:44px}}

/* ---- 오시는 길 : 경로 안내 + 지도 + 플레이스 ---- */
#mansup-app .su-route{list-style:none;margin:26px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;counter-reset:route}
#mansup-app .su-route>li{counter-increment:route;position:relative;display:flex;flex-direction:column;gap:6px;padding:16px 18px 16px 58px;border:1px solid #E3E9F0;border-radius:14px;background:#F8FAFC}
#mansup-app .su-route>li::before{content:counter(route,decimal-leading-zero);position:absolute;left:18px;top:16px;font-family:'Poppins',sans-serif;font-size:13px;font-weight:700;letter-spacing:.06em;color:#fff;background:#1F3A5F;border-radius:8px;padding:5px 7px;line-height:1}
#mansup-app .su-route>li>b{font-size:15.5px;font-weight:700;color:#16223B;letter-spacing:-.01em}
#mansup-app .su-route>li>span{font-size:14.5px;line-height:1.75;color:#4B5A70;word-break:keep-all}
#mansup-app .su-route>li>span>strong{color:#2E7BF0;font-weight:800}
#mansup-app .su-map-section{margin-top:clamp(50px,6vw,90px)}
#mansup-app .su-map-head .eyebrow{margin:0 0 12px;font-family:'Poppins',sans-serif;font-size:13px;font-weight:600;letter-spacing:.2em;color:#4A93C8}
#mansup-app .su-map-head h3{margin:0;font-size:clamp(27px,2.2vw,34px);font-weight:700;letter-spacing:-.03em;color:#101B33}
#mansup-app .su-map-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(320px,.9fr);gap:clamp(24px,3vw,44px);margin-top:28px;align-items:stretch}
#mansup-app .su-map-wrap{min-width:0}
#mansup-app .su-map-canvas{position:relative;width:100%;aspect-ratio:16/10;min-height:360px;border-radius:18px;overflow:hidden;background:#EEF2F7;border:1px solid #E3E9F0}
#mansup-app .su-map-canvas>iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
#mansup-app .su-map-note{margin:12px 0 0;font-size:13px;color:#8A9BB3}
#mansup-app .su-place-card{display:flex;flex-direction:column;background:#fff;border:1px solid #E3E9F0;border-radius:18px;padding:26px 26px 24px;box-shadow:0 14px 34px rgba(22,40,63,.06)}
#mansup-app .su-place-badge{margin:0;display:inline-flex;align-items:center;gap:8px;align-self:flex-start;font-size:12.5px;font-weight:700;letter-spacing:.02em;color:#03C75A}
#mansup-app .su-place-badge>span{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:#03C75A;color:#fff;font-family:'Poppins',sans-serif;font-size:13px;font-weight:800}
#mansup-app .su-place-card h4{margin:14px 0 0;font-size:25px;font-weight:800;letter-spacing:-.02em;color:#16223B}
#mansup-app .su-place-cat{margin:6px 0 0;font-size:13.5px;color:#7C8AA0}
#mansup-app .su-place-info{margin:20px 0 0;padding:0;border-top:1px solid #E3E9F0}
#mansup-app .su-place-info>div{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid #EEF2F6}
#mansup-app .su-place-info dt{font-size:12.5px;font-weight:700;color:#7C8AA0;letter-spacing:.04em;padding-top:2px}
#mansup-app .su-place-info dd{margin:0;font-size:14.5px;line-height:1.65;color:#22304A;word-break:keep-all}
#mansup-app .su-place-info dd a{color:#2E7BF0;font-weight:700}
#mansup-app .su-place-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:20px}
#mansup-app .su-place-btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 14px;border-radius:10px;border:1px solid #D4DCE6;font-size:14px;font-weight:700;color:#16223B;background:#fff;text-decoration:none;transition:all .2s ease;text-align:center}
#mansup-app .su-place-btn:hover{border-color:#2E7BF0;color:#2E7BF0}
#mansup-app .su-place-btn--primary{grid-column:1/-1;background:#03C75A;border-color:#03C75A;color:#fff}
#mansup-app .su-place-btn--primary:hover{background:#02B04F;border-color:#02B04F;color:#fff}
@media(max-width:1000px){#mansup-app .su-map-grid{grid-template-columns:1fr}#mansup-app .su-map-canvas{min-height:300px}}
@media(max-width:560px){#mansup-app .su-route>li{padding:14px 14px 14px 52px}#mansup-app .su-place-card{padding:20px 18px}#mansup-app .su-place-actions{grid-template-columns:1fr}}

/* ---- 푸터 SNS 4종 ---- */
#mansup-app .su-sns-row{display:flex;gap:12px;flex-wrap:wrap}
#mansup-app .su-sns{display:inline-flex;align-items:center;gap:9px;padding:7px 14px 7px 7px;border-radius:999px;background:#fff;border:1px solid #E2E7EE;color:#22314F;text-decoration:none;font-size:13px;font-weight:700;letter-spacing:-.01em;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
#mansup-app .su-sns svg{width:30px;height:30px;padding:7px;box-sizing:border-box;border-radius:50%;background:var(--sns);flex:0 0 30px}
#mansup-app .su-sns:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(22,40,63,.1);border-color:var(--sns)}
@media(max-width:560px){#mansup-app .su-sns span{display:none}#mansup-app .su-sns{padding:5px}}
/* 모바일에서도 푸터 SNS(블로그·클립·유튜브·톡톡) 링크 노출 — main.css의 기존 숨김 규칙 덮어씀 */
#mansup-app .mu-footer .su-sns-row{display:flex!important;width:100%;justify-content:flex-start}
@media(max-width:760px){#mansup-app .mu-footer .su-sns-row{gap:8px}#mansup-app .su-sns span{display:inline}#mansup-app .su-sns{padding:6px 12px 6px 6px;font-size:12.5px}}

/* ---------- 9) 2026-09-21 더블업 페이지 — 텍스트 강약 · 표 정렬 · 인용 블록 ---------- */

/* (1) 비교표 정렬 보정
   detail.css 전역 규칙 table{border-spacing:22px 0;width:calc(100% + 44px);margin-left:-22px;
   table-layout:fixed} 가 .du-table 에 그대로 상속돼 표가 감싸는 박스 왼쪽으로 22px 삐져나갔다.
   margin/border-spacing/width 만 되돌리고 table-layout:fixed 는 유지한 뒤 열 너비를 명시한다. */
#mansup-app .du-table{margin:0;border-spacing:0;width:100%;min-width:760px}
#mansup-app .du-table thead th:nth-child(1){width:13%}
#mansup-app .du-table thead th:nth-child(2){width:23.5%}
#mansup-app .du-table thead th:nth-child(3){width:23.5%}
#mansup-app .du-table thead th:nth-child(4){width:40%}
/* 강조 열 좌측 경계 — 테두리 대신 box-shadow(레이아웃 밀림 없음) */
#mansup-app .du-table .is-highlight{box-shadow:inset 1px 0 0 #CFE0F8}

/* (2) 본문 텍스트 강약 유틸리티 */
#mansup-app .du-em{font-weight:700;color:#16223B;word-break:keep-all}
#mansup-app .du-hl,#mansup-app .du-hl-warn{padding:0 3px;border-radius:2px;font-weight:700;line-height:inherit;word-break:keep-all;-webkit-box-decoration-break:clone;box-decoration-break:clone}
#mansup-app .du-hl{color:#16223B;background:linear-gradient(to top,#D9E9FF 44%,transparent 44%)}
#mansup-app .du-hl-warn{color:#8A4B12;background:linear-gradient(to top,#FFE6D2 44%,transparent 44%)}
#mansup-app .du-chip{display:inline-block;background:#EEF5FF;color:#1B4FA8;font-weight:700;font-size:.94em;padding:2px 9px;border-radius:7px;line-height:1.5;white-space:nowrap;word-break:keep-all}

/* (3) 「진료실에서 설명드립니다」 인용 블록 — vr-principles 카드 그리드 아래 */
#mansup-app .du-story-quote{max-width:880px;margin:clamp(52px,5.5vw,84px) auto 0;margin-inline:auto;margin-bottom:0;background:#fff;border:1px solid #E3E9F0;border-left:3px solid #2E7BF0;border-radius:16px;padding:clamp(24px,2.4vw,32px) clamp(24px,2.6vw,38px);box-sizing:border-box}
#mansup-app .du-story-quote blockquote{margin:0;padding:0;border:0;quotes:none}
#mansup-app .du-story-quote blockquote::before{content:"\201C";display:block;font-family:Georgia,'Times New Roman',serif;font-size:46px;line-height:.8;color:#C5DBF7;margin-bottom:6px}
#mansup-app .du-story-quote blockquote p{margin:0;font-size:clamp(16px,1.15vw,17.5px);line-height:1.9;color:#3A465E;word-break:keep-all;text-align:left}
#mansup-app .du-story-quote blockquote p+p{margin-top:14px}

/* (4) 3단계 모식도 그림 — du-satisfaction 본문 아래 (du-illust 와 동일 톤) */
#mansup-app .du-steps-illust{width:100%;max-width:1080px;margin:clamp(34px,3.4vw,52px) auto 0;background:#fff;border:1px solid #E3E9F0;border-radius:22px;padding:clamp(22px,3vw,40px);box-sizing:border-box}
#mansup-app .du-steps-illust svg{display:block;width:100%;height:auto}
#mansup-app .du-steps-illust figcaption{margin-top:18px;font-size:14px;line-height:1.75;color:#718596;text-align:center}

/* (5) 본문 가독성 소폭 보강 */
#mansup-app .du-satisfaction .du-sat-body{letter-spacing:-.005em}

@media(max-width:760px){
 #mansup-app .du-story-quote{margin-top:44px;padding:20px 18px}
 #mansup-app .du-story-quote blockquote::before{font-size:38px}
 #mansup-app .du-steps-illust{border-radius:16px}
}

/* (6) 모바일 — 모식도 축소 시 내부 주석 글자가 판독 불가가 되는 문제.
   폭을 억지로 줄이지 말고 표(.du-table-wrap)와 동일하게 가로 스크롤로 전환한다. */
@media(max-width:700px){
 #mansup-app .du-steps-illust,#mansup-app .du-illust{overflow-x:auto;-webkit-overflow-scrolling:touch}
 #mansup-app .du-steps-illust svg{min-width:780px}
 #mansup-app .du-illust svg{min-width:660px}
 #mansup-app .du-steps-illust figcaption,#mansup-app .du-illust figcaption{position:sticky;left:0}
 #mansup-app .du-steps-illust figcaption::after,#mansup-app .du-illust figcaption::after{content:"좌우로 밀어서 볼 수 있습니다";display:block;margin-top:7px;font-size:12.5px;color:#9AA8B6}
 #mansup-app .du-illust-legend{position:sticky;left:0}
}


/* ============================================================
   10) 2026-09-21 전 페이지 공통 — 신규 일러스트 카드 · 보형물 그리드 · 표 보정
   (더블업 페이지에서 검증한 패턴을 진료 페이지 전체로 확장)
   ============================================================ */

/* (1) 표준 일러스트 카드 — 새로 제작한 SVG 모식도를 담는 공통 틀.
   .du-steps-illust 와 동일 톤이지만 페이지 구분 없이 어디서나 쓴다. */
#mansup-app .mu-illust{width:100%;max-width:1080px;margin:clamp(30px,3vw,48px) auto 0;background:#fff;border:1px solid #E3E9F0;border-radius:22px;padding:clamp(22px,3vw,40px);box-sizing:border-box}
#mansup-app .mu-illust>svg{display:block;width:100%;height:auto}
#mansup-app .mu-illust figcaption{margin-top:18px;font-size:14px;line-height:1.75;color:#718596;text-align:center;word-break:keep-all}
/* 본문 옆(2단 레이아웃) 등 좁은 자리에 들어가는 축소판 */
#mansup-app .mu-illust.is-inline{max-width:520px;margin-top:0;padding:clamp(18px,2vw,26px);border-radius:18px}
#mansup-app .mu-illust.is-inline figcaption{margin-top:14px;font-size:13.5px}
/* 회색 바탕 섹션 위에 올라갈 때 */
#mansup-app .vr-principles .mu-illust,#mansup-app .du-process .mu-illust{border-color:#DCE5EF}

/* 범례 — .du-illust-legend 과 동일 규격 */
#mansup-app .mu-illust-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 22px;margin:18px 0 0;padding:0;list-style:none;font-size:13.5px;color:#3A465E}
#mansup-app .mu-illust-legend>li{display:inline-flex;align-items:center;gap:8px}
#mansup-app .mu-illust-legend i{width:14px;height:14px;border-radius:4px;display:inline-block;flex:0 0 auto}

/* (2) 보형물·재료 종류 그리드 — 저해상도 제품 사진을 대체하는 카드 세트 */
#mansup-app .mu-type-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:clamp(30px,3vw,44px);padding:0;list-style:none}
#mansup-app .mu-type-card{margin:0;background:#fff;border:1px solid #E3E9F0;border-radius:18px;overflow:hidden;display:grid;grid-template-rows:auto 1fr}
#mansup-app .mu-type-card>.mu-type-figure{margin:0;background:linear-gradient(160deg,#F5F8FB,#E9F1FA);padding:24px 20px;display:grid;place-items:center;min-height:170px}
#mansup-app .mu-type-card>.mu-type-figure svg{display:block;width:min(100%,230px);height:auto}
#mansup-app .mu-type-card>.mu-type-body{padding:22px 22px 26px}
#mansup-app .mu-type-card .mu-type-no{font-family:'Poppins',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.14em;color:#4A93C8}
#mansup-app .mu-type-card h3,#mansup-app .mu-type-card h4{margin:10px 0 0;font-size:22px;font-weight:700;letter-spacing:-.02em;color:#16223B;line-height:1.45;word-break:keep-all}
#mansup-app .mu-type-card p{margin:11px 0 0;font-size:14.5px;line-height:1.8;color:#5B6B7D;word-break:keep-all}
#mansup-app .mu-type-card dl{margin:16px 0 0;padding-top:14px;border-top:1px solid #E9EEF3;display:grid;grid-template-columns:auto 1fr;gap:7px 14px;font-size:13.5px;line-height:1.65}
#mansup-app .mu-type-card dt{font-weight:700;color:#7C8AA0;white-space:nowrap}
#mansup-app .mu-type-card dd{margin:0;color:#3A465E;word-break:keep-all}

/* (3) 07 복합수술처럼 "묶음 안의 구성요소" 를 표기하는 배지
   — 상위 번호(07)와 헷갈리지 않도록 숫자가 아닌 A/B/C 를 쓴다. */
#mansup-app .mu-part-badge{display:inline-flex;align-items:center;gap:8px;font-family:'Poppins',sans-serif;font-size:12.5px;font-weight:700;letter-spacing:.12em;color:#2E7BF0;background:#EAF2FE;border-radius:999px;padding:5px 14px;margin-bottom:12px;white-space:nowrap}
#mansup-app .mu-part-lead{max-width:860px;margin:18px 0 0;font-size:15.5px;line-height:1.85;color:#5B6B7D;word-break:keep-all}

/* (4) detail.css 전역 table 규칙(margin-left:-22px / border-spacing:22px)이
   클래스 없는 표에 그대로 새는 문제 — 진료 페이지 본문 표 전체에 차단 */
#mansup-app .mu-detail table,#mansup-app main table{margin-left:0;border-spacing:0}

@media(max-width:1000px){
 #mansup-app .mu-type-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 #mansup-app .mu-type-grid{grid-template-columns:1fr;gap:18px}
 #mansup-app .mu-illust{border-radius:16px;overflow-x:auto;-webkit-overflow-scrolling:touch}
 #mansup-app .mu-illust>svg{min-width:720px}
 #mansup-app .mu-illust.is-inline>svg{min-width:0}
 #mansup-app .mu-illust.is-inline{overflow-x:visible}
 #mansup-app .mu-illust figcaption,#mansup-app .mu-illust-legend{position:sticky;left:0}
 #mansup-app .mu-illust:not(.is-inline) figcaption::after{content:"좌우로 밀어서 볼 수 있습니다";display:block;margin-top:7px;font-size:12.5px;color:#9AA8B6}
}

/* === realistic illustration figures (2026-09-21) === */
#mansup-app .mu-illust.mu-real,#mansup-app .du-illust.mu-real{background:#fff;max-width:1240px;padding:clamp(16px,2vw,28px)}
#mansup-app .ur-explanation-media>figure.mu-real{background:#fff;padding:12px 0 16px}
#mansup-app .mu-real .mu-real-grid{display:grid;grid-template-columns:repeat(var(--n,1),minmax(0,1fr));gap:clamp(12px,1.6vw,24px);align-items:center;justify-items:center}
#mansup-app .mu-real-panel{display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0;width:100%}
#mansup-app .mu-real-panel>img{display:block;width:100%;height:auto;border-radius:14px}
#mansup-app .mu-real-grid[style*="--n:1"] .mu-real-panel>img{max-width:860px}
#mansup-app .mu-real-grid[style*="--n:2"] .mu-real-panel>img{max-width:560px}
#mansup-app .mu-real-panel>span{font-size:17px;font-weight:700;color:#1C2B4A;text-align:center;word-break:keep-all;letter-spacing:-.01em;line-height:1.45}
#mansup-app .mu-illust.mu-real figcaption{margin-top:18px;font-size:15px}
#mansup-app .mu-illust.mu-real.is-inline{max-width:100%}
#mansup-app .mu-illust.mu-real.is-inline .mu-real-panel>img{max-width:100%}
/* story card: photo + steps */
#mansup-app .mu-real-story .mu-story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(22px,3vw,44px);align-items:stretch}
#mansup-app .mu-story-photo{position:relative;border-radius:18px;overflow:hidden;background:#EEF3F8;min-height:360px;height:100%}
#mansup-app .mu-story-photo>img{display:block;width:100%;height:100%;object-fit:cover}
#mansup-app .mu-story-body{min-width:0;text-align:left}
#mansup-app .mu-story-title{display:block;font-size:clamp(22px,1.9vw,27px);font-weight:700;color:#16223B;letter-spacing:-.02em;line-height:1.35;word-break:keep-all}
#mansup-app .mu-story-pre{margin:12px 0 0;font-size:17px;line-height:1.75;color:#5B6B7D;word-break:keep-all}
#mansup-app .mu-story-list{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:12px;counter-reset:mus}
#mansup-app .mu-story-list>li{position:relative;padding:14px 18px 14px 60px;background:#F5F8FB;border-radius:14px;counter-increment:mus;min-height:52px}
#mansup-app .mu-story-list>li::before{content:counter(mus,decimal-leading-zero);position:absolute;left:16px;top:14px;width:30px;height:30px;border-radius:50%;background:#2E7BF0;color:#fff;font:700 13px/30px 'Poppins',sans-serif;text-align:center}
#mansup-app .mu-story-list>li>b{display:block;font-size:19px;font-weight:700;color:#1C2B4A;line-height:1.45;word-break:keep-all}
#mansup-app .mu-story-list>li>span{display:block;margin-top:5px;font-size:16px;line-height:1.7;color:#5B6B7D;word-break:keep-all}
#mansup-app .mu-story-note{margin:16px 0 0;padding:12px 16px;border-left:3px solid #E39A55;background:#FFF7EE;font-size:15.5px;line-height:1.7;color:#8A4B12;word-break:keep-all;border-radius:0 10px 10px 0}
#mansup-app .mu-real-story.is-inline .mu-story,#mansup-app .mu-real-story.ur-hero-visual .mu-story{grid-template-columns:1fr;gap:20px}
#mansup-app .mu-real-story.is-inline .mu-story-photo,#mansup-app .mu-real-story.ur-hero-visual .mu-story-photo{aspect-ratio:16/10;min-height:0;height:auto}
/* silicone type cards with photos */
#mansup-app .mu-type-card>.mu-type-figure.mu-real-type{background:#0E1622;padding:0;min-height:170px}
#mansup-app .mu-type-card>.mu-type-figure.mu-real-type>img{display:block;width:100%;height:230px;object-fit:cover}
@media (max-width:1100px){
 #mansup-app .mu-real .mu-real-grid[style*="--n:3"],#mansup-app .mu-real .mu-real-grid[style*="--n:4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
 #mansup-app .mu-illust.mu-real,#mansup-app .du-illust.mu-real{overflow-x:visible}
 #mansup-app .mu-illust.mu-real figcaption::after,#mansup-app .du-illust.mu-real figcaption::after{content:none}
 #mansup-app .mu-real .mu-real-grid{grid-template-columns:1fr}
 #mansup-app .mu-real .mu-real-grid[style*="--n:2"],#mansup-app .mu-real .mu-real-grid[style*="--n:4"]{grid-template-columns:repeat(2,minmax(0,1fr))}
 #mansup-app .mu-real-story .mu-story{grid-template-columns:1fr;gap:18px}
 #mansup-app .mu-story-photo{aspect-ratio:16/10;min-height:0;height:auto}
 #mansup-app .mu-story-list>li>b{font-size:17px}
 #mansup-app .mu-story-list>li>span{font-size:15px}
}

/* =========================================================================
   2026-09-22 · 광고주 지적 레이아웃·크기 보정 (combination / lengthening)
   ========================================================================= */

/* 1) combination.html 도입부 — 2단(그림|텍스트) → 1단(그림 위 / 텍스트 아래) */
#mansup-app .co-overview .co-overview-grid{display:block}
#mansup-app .co-overview .co-overview-grid>.mu-illust{width:100%;max-width:1240px;margin-left:auto;margin-right:auto;margin-bottom:46px}
#mansup-app .co-overview .co-overview-grid>.mu-illust>svg{display:block;width:100%;height:auto}

/* 2) combination.html 조루수술 비교 figure — 약 17% 확대 (해당 섹션 한정) */
#mansup-app .co-comparison .ur-explanation-media{max-width:1240px;margin-left:auto;margin-right:auto}
#mansup-app .co-comparison .ur-explanation-media .mu-real-grid[style*="--n:2"] .mu-real-panel>img{max-width:100%}

/* 3~5) lengthening.html 저해상도 도해 2종
   - 원본 픽셀(353x353 / 366x353)에 가깝게 축소해 라벨 글씨 뭉개짐 제거
   - 원본에 그려진 깨진 하늘색 원형 테두리를 CSS 링(#C9DCEA)으로 덮음 */
#mansup-app .mu-illust.mu-real.mu-ring-fix{width:100%;max-width:var(--mu-ring-card,520px);margin-left:auto;margin-right:auto}
#mansup-app .mu-illust.mu-real.mu-ring-fix .mu-real-grid{grid-template-columns:minmax(0,1fr)}
#mansup-app .mu-illust.mu-real.mu-ring-fix .mu-real-panel{position:relative;width:100%;max-width:var(--mu-ring-w,420px);margin-left:auto;margin-right:auto}
#mansup-app .mu-illust.mu-real.mu-ring-fix .mu-real-grid .mu-real-panel>img{width:100%;max-width:100%}
/* 링은 darken 합성 — 원본 테두리(rgb 202,220,231)의 끊긴 흰 구간만 메우고
   테두리를 가로지르는 라벨 글씨·지시선(더 어두운 색)은 그대로 살린다 */
#mansup-app .mu-illust.mu-real.mu-ring-fix .mu-real-panel::after{content:"";position:absolute;pointer-events:none;left:var(--mu-ring-x);top:var(--mu-ring-y);width:var(--mu-ring-s);aspect-ratio:1/1;mix-blend-mode:darken;background:radial-gradient(circle closest-side,rgba(201,220,234,0) 0 89.2%,#C9DCEA 89.9% 98.7%,rgba(201,220,234,0) 99.4%)}
#mansup-app .mu-ring-anatomy{--mu-ring-card:500px}
#mansup-app .mu-ring-anatomy .mu-real-panel{--mu-ring-w:430px;--mu-ring-x:1.42%;--mu-ring-y:1.42%;--mu-ring-s:97.45%}
#mansup-app .mu-ring-release{--mu-ring-card:470px}
#mansup-app .mu-ring-release .mu-real-panel{--mu-ring-w:400px;--mu-ring-x:4.92%;--mu-ring-y:1.42%;--mu-ring-s:93.99%}

/* 6) combination.html 「3T 조루치료」 story figure — 원장 사진 세로 극단 크롭 해소
   원인: 전역 .mu-story-photo 가 height:100% 라 오른쪽 목록(02 항목 설명이 길다)의
   높이를 그대로 따라가 세로로 늘어나고, 가로 원본(1600×1066 · 3:2)이
   object-fit:cover 로 좌우 70%가 잘려나감.
   해법: 이 figure 한 곳만 1단(사진 위 / 목록 아래)으로 바꾸고 사진 칸을
   원본 비율로 고정해 높이 종속을 끊는다. 전역 규칙은 건드리지 않는다. */
#mansup-app .mu-real-story.mu-story-wide .mu-story{grid-template-columns:minmax(0,1fr);gap:clamp(18px,2vw,26px);align-items:start}
#mansup-app .mu-real-story.mu-story-wide .mu-story-photo{height:auto;min-height:0;aspect-ratio:1600/1066;width:100%}
#mansup-app .mu-real-story.mu-story-wide .mu-story-photo>img{width:100%;height:100%;object-fit:cover;object-position:50% 42%}

@media (max-width:1000px){
 #mansup-app .co-overview .co-overview-grid>.mu-illust{margin-bottom:32px}
}

/* =========================================================================
   2026-09-22 (2차) · 저해상도 원본 과확대 보정 — 전 진료 페이지
   원인: 원본이 깨진 것이 아니라 327~456px 원본을 500~860px 로 1.5~3.0배
   확대 표시해 라벨 글씨가 뭉개지고 원형 테두리에 계단현상이 생긴 것.
   처리: (A) 표시 폭을 원본 해상도의 1.0~1.2배 이내로 제한
        (B) 원형 프레임 그림은 깨진 하늘색 테두리 위에 CSS 링(#C9DCEA)을
            mix-blend-mode:darken 으로 덮어 매끈하게 보정
            (darken 이라 테두리를 가로지르는 라벨 글씨·지시선은 보존된다)
   ※ 전역 규칙(.mu-illust / .mu-real-panel / .mu-type-figure)은 건드리지 않고
      해당 figure(또는 ul)에 클래스만 덧붙여 그 자리에만 적용한다.
   ========================================================================= */

/* (A) 크기 제한 전용 — 원형 테두리가 없는 그림(사진·흰 배경 도해) */
#mansup-app .mu-illust.mu-real.mu-fit{width:100%;max-width:var(--mu-fit-card,860px);margin-left:auto;margin-right:auto}
#mansup-app .mu-illust.mu-real.mu-fit .mu-real-panel{width:100%;max-width:var(--mu-fit-w,480px);margin-left:auto;margin-right:auto}
#mansup-app .mu-illust.mu-real.mu-fit .mu-real-grid .mu-real-panel>img{width:100%;max-width:100%}

/* (B) 크기 제한 + 원형 테두리 보정
   패널을 인라인 컨테이너로 만들어 cqw(= 패널 폭의 1%) 단위를 쓴다.
   라벨 <span> 이 붙은 패널은 패널 높이 ≠ 이미지 높이여서
   기존 mu-ring-fix 의 % 방식으로는 top 을 잡을 수 없기 때문.
   좌표는 모두 원본 픽셀에서 원의 중심·내반지름·외반지름을 실측해 환산했다. */
#mansup-app .mu-illust.mu-real.mu-ring2{width:100%;max-width:var(--mu-ring-card,860px);margin-left:auto;margin-right:auto}
#mansup-app .mu-illust.mu-real.mu-ring2 .mu-real-panel{position:relative;container-type:inline-size;width:100%;max-width:var(--mu-ring-w,420px);margin-left:auto;margin-right:auto}
#mansup-app .mu-illust.mu-real.mu-ring2 .mu-real-grid .mu-real-panel>img{width:100%;max-width:100%}
#mansup-app .mu-illust.mu-real.mu-ring2 .mu-real-panel::after{content:"";position:absolute;pointer-events:none;left:var(--mu-ring-x);top:var(--mu-ring-y);width:var(--mu-ring-s);aspect-ratio:1/1;mix-blend-mode:darken;background:radial-gradient(circle closest-side,rgba(201,220,234,0) 0 calc(var(--mu-ring-in,90.3%) - 1.1%),#C9DCEA var(--mu-ring-in,90.3%) 98.6%,rgba(201,220,234,0) 99.5%)}

/* --- (B) 적용 위치 ------------------------------------------------------ */

/* lengthening.html · 음낭피부 성형술 (415×356 / 354×356 → 527px · 최대 1.49배) */
#mansup-app .mu-ring-scrotalskin{--mu-ring-card:1000px}
#mansup-app .mu-ring-scrotalskin .mu-real-panel{--mu-ring-w:440px}
#mansup-app .mu-ring-scrotalskin .mu-real-panel:nth-of-type(1){--mu-ring-x:.98cqw;--mu-ring-y:.98cqw;--mu-ring-s:83.82cqw;--mu-ring-in:90.3%}
#mansup-app .mu-ring-scrotalskin .mu-real-panel:nth-of-type(2){--mu-ring-x:.58cqw;--mu-ring-y:1.15cqw;--mu-ring-s:98.27cqw;--mu-ring-in:90.3%}

/* lengthening.html · 다층미세봉합 Y, Z 성형술 (356×356 → 527px · 1.48배) */
#mansup-app .mu-ring-yz{--mu-ring-card:1000px}
#mansup-app .mu-ring-yz .mu-real-panel{--mu-ring-w:440px;--mu-ring-x:1.14cqw;--mu-ring-y:1.14cqw;--mu-ring-s:97.72cqw;--mu-ring-in:90.3%}

/* glans.html · 약물(필러) 주입 귀두확대술 (327×327 → 609px · 1.86배) */
#mansup-app .mu-ring-glansinj{--mu-ring-card:470px}
#mansup-app .mu-ring-glansinj .mu-real-panel{--mu-ring-w:380px;--mu-ring-x:.07cqw;--mu-ring-y:.07cqw;--mu-ring-s:99.56cqw;--mu-ring-in:89.7%}

/* glans.html · 복합 귀두확대술 재료 위치 (344×345 → 609px · 1.77배) */
#mansup-app .mu-ring-glanscombo{--mu-ring-card:490px}
#mansup-app .mu-ring-glanscombo .mu-real-panel{--mu-ring-w:400px;--mu-ring-x:2.09cqw;--mu-ring-y:2.09cqw;--mu-ring-s:95.82cqw;--mu-ring-in:90.4%}

/* circumcision.html · 복합포경수술 비교 2곳 (232×231 / 231×231 → 509·459px · 최대 2.20배) */
#mansup-app .mu-ring-circcombo{--mu-ring-card:660px}
#mansup-app .mu-ring-circcombo .mu-real-panel{--mu-ring-w:270px;--mu-ring-x:-.49cqw;--mu-ring-y:-.49cqw;--mu-ring-in:88.7%}
#mansup-app .mu-ring-circcombo .mu-real-panel:nth-of-type(1){--mu-ring-s:100.55cqw}
#mansup-app .mu-ring-circcombo .mu-real-panel:nth-of-type(2){--mu-ring-s:100.98cqw}

/* combination.html · 귀두의 층 구조 2곳 (344×345 → 517px · 1.50배) */
#mansup-app .mu-ring-combglans{--mu-ring-card:920px}
#mansup-app .mu-ring-combglans .mu-real-panel{--mu-ring-w:400px;--mu-ring-in:90.4%}
#mansup-app .mu-ring-combglans .mu-real-panel:nth-of-type(1){--mu-ring-x:1.80cqw;--mu-ring-y:1.94cqw;--mu-ring-s:96.11cqw}
#mansup-app .mu-ring-combglans .mu-real-panel:nth-of-type(2){--mu-ring-x:2.09cqw;--mu-ring-y:2.09cqw;--mu-ring-s:95.82cqw}

/* testicular.html · 보형물이 들어가는 자리 (409×409 → 860px · 2.10배) */
#mansup-app .mu-ring-testicular{--mu-ring-card:560px}
#mansup-app .mu-ring-testicular .mu-real-panel{--mu-ring-w:470px;--mu-ring-x:2.89cqw;--mu-ring-y:2.89cqw;--mu-ring-s:93.98cqw;--mu-ring-in:91.1%}

/* scrotal-web.html · 이어진 피부의 당김 (407×407 → 860px · 2.11배) */
#mansup-app .mu-ring-webexcess{--mu-ring-card:560px}
#mansup-app .mu-ring-webexcess .mu-real-panel{--mu-ring-w:470px;--mu-ring-x:.91cqw;--mu-ring-y:.91cqw;--mu-ring-s:98.18cqw;--mu-ring-in:90.3%}

/* --- (A) 적용 위치 ------------------------------------------------------ */

/* pe-treatment.html · 경구 약물 사진 (435×312 → 860px · 1.98배) */
#mansup-app .mu-fit-pemed{--mu-fit-card:600px}
#mansup-app .mu-fit-pemed .mu-real-panel{--mu-fit-w:500px}

/* ed-implant.html · 팽창형 보형물의 구성 (285×306 → 860px · 3.02배 · 최대 확대) */
#mansup-app .mu-fit-edimplant{--mu-fit-card:520px}
#mansup-app .mu-fit-edimplant .mu-real-panel{--mu-fit-w:330px}

/* silicone.html · 보형물 형태 구분 3분할 (220~230px 원본 → 379px · 최대 1.72배) */
#mansup-app .mu-fit-siltype{--mu-fit-card:920px}
#mansup-app .mu-fit-siltype .mu-real-panel{--mu-fit-w:250px}

/* bph.html · 전립선의 위치 2분할 (472×377 / 370×225 → 560px · 최대 1.51배) */
#mansup-app .mu-fit-bph{--mu-fit-card:1040px}
#mansup-app .mu-fit-bph .mu-real-panel{--mu-fit-w:450px}

/* (C) 실리콘 보형물 타입 카드 (penis.html / silicone.html)
   전역 .mu-real-type 이 height:230px + object-fit:cover 라
   220×127 급 제품 사진을 1.8~2.4배로 늘려 뭉개고 있었다.
   해당 그리드에만 원본 크기 표시(contain)로 되돌린다.
   같은 그리드의 TYPE 07(327×327 일러스트)은 1.05배라 기존 그대로 둔다. */
#mansup-app .mu-type-grid.mu-type-native>.mu-type-card>.mu-type-figure.mu-real-type{display:grid;place-items:center;min-height:230px}
#mansup-app .mu-type-grid.mu-type-native>.mu-type-card>.mu-type-figure.mu-real-type>img[src*="/silicone-"]{width:auto;height:auto;max-width:min(100%,240px);max-height:200px;object-fit:contain;margin:auto}

/* =========================================================================
   GNB 드롭다운 서브메뉴 hover / 포커스 피드백 (2026-09-22 추가)

   증상 : 상단 메뉴에 마우스를 올려 드롭다운이 열려도, 그 안의 항목
          (더블업 확대수술 / 음경확대술 …) 위에 올렸을 때 아무 변화가 없었다.
   원인 : 서브메뉴 <a> 에 인라인으로 color:#22304A 가 박혀 있어서,
          main.css 의 .mu-hover-7 ~ .mu-hover-43 :hover{color:#2E7BF0} 규칙이
          전부 무효화돼 있었다(인라인 스타일 > 외부 스타일시트).
          → 같은 색 규칙을 !important 로 되살리고 배경색을 함께 준다.
   범위 : 헤더 드롭다운(.mu-header .mu-dd) 안쪽 링크로만 한정한다.
          전역 a:hover 는 건드리지 않는다.
   ========================================================================= */

/* 항목 전체 행(좌우 패딩 포함)이 반응하도록 — 글자에만 걸리지 않게 */
#mansup-app .mu-header .mu-dd a{
  display:block;
  position:relative;
  transition:color .16s ease,background-color .16s ease!important;
}

/* 현재 보고 있는 페이지 항목 — hover 와 구분되도록 왼쪽 바 + 옅은 바탕 유지
   (글자색 #4A93C8 은 main.css 의 .mu-header a[aria-current=page] 가 담당) */
#mansup-app .mu-header .mu-dd a[aria-current="page"],
#mansup-app .mu-header .mu-dd a.active{
  background:#EDF3FD;
  font-weight:700;
  box-shadow:inset 3px 0 0 #4A93C8;
}

/* 마우스 오버 + 키보드 포커스 */
#mansup-app .mu-header .mu-dd a:hover,
#mansup-app .mu-header .mu-dd a:focus-visible{
  color:#2E7BF0!important;
  background:#F3F7FE;
}

/* 현재 페이지 항목 위에 올렸을 때는 한 단계 더 진하게 (현재 위치 표시 유지) */
#mansup-app .mu-header .mu-dd a[aria-current="page"]:hover,
#mansup-app .mu-header .mu-dd a[aria-current="page"]:focus-visible,
#mansup-app .mu-header .mu-dd a.active:hover,
#mansup-app .mu-header .mu-dd a.active:focus-visible{
  background:#E4EDFC;
}

/* 상위 메뉴(병원소개·남성확대 …) 도 같은 인라인 색 때문에 hover 가 죽어 있었다.
   인라인에 border-bottom:2px solid transparent 와 transition 이 이미
   준비돼 있으므로 색만 되살린다. 드롭다운이 열린 동안에도 켜 둔다. */
#mansup-app .mu-header #mu-gnb>.mu-nav-item>a:hover,
#mansup-app .mu-header #mu-gnb>.mu-nav-item>a:focus-visible,
#mansup-app .mu-header #mu-gnb>.mu-nav-item>a[aria-expanded="true"]{
  color:#2E7BF0!important;
  border-bottom-color:#2E7BF0!important;
}

/* 2뎁스 드롭다운 축소 260923 — 패널·링크 치수가 51개 HTML 인라인이라 !important 로 덮는다.
   상위 GNB 가 clamp(16,1.25vw,19) 이므로 링크를 16.5px/500 으로 낮춰 위계를 만든다. */
#mansup-app .mu-header .mu-dd{padding-top:8px!important}
#mansup-app .mu-header .mu-dd>span{min-width:300px!important;padding:14px 0 16px!important;box-shadow:0 12px 28px rgba(22,40,63,.12)!important}
#mansup-app .mu-header .mu-dd a{font-size:16.5px!important;font-weight:500!important;padding:11px 28px!important}
#mansup-app .mu-header .mu-dd a[aria-current="page"],
#mansup-app .mu-header .mu-dd a.active{font-weight:700!important}

/* ============================================================
   가로 스크롤 전수 수정 260923 — 55 HTML × 360~540px 실측에서 넘친 곳은 index 두 구획뿐
   ============================================================ */
/* A. PROOF 통계 2열: min-content(숫자+문구 nowrap)가 열을 398px로 늘리던 문제 → 열 최소 0, 문구는 줄바꿈 허용(숫자만 nowrap) */
#mansup-app .mu-home #mu-stats{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important}
#mansup-app .mu-home .mu-stat{min-width:0}
@media(max-width:480px){
 #mansup-app .mu-home .mu-stat>p[style*="nowrap"]{white-space:normal!important}
 #mansup-app .mu-home .mu-stat .mu-num{white-space:nowrap}
 #mansup-app .mu-home .mu-stat>p[style*="nowrap"]>span:not(.mu-num){display:inline-block;margin-top:6px}
}
/* B. 원장 초상: 1200px 원본 img(크롭 설계)의 고유 폭이 grid 열 최소값으로 잡혀 901~1240px에서 넘치던 문제 */
#mansup-app .mu-home .mu-director-portrait,#mansup-app .mu-home .mu-director-portrait>div:first-child{min-width:0}

/* ============================================================
   구도 정리 260924 — 클라이언트 2차 검수 (구도 부자연·답답함·답변 박스·배경 밴드)
   ============================================================ */
/* A. 스토리 카드(제목+리스트가 있는 카드)가 본문 제목보다 먼저 오던 2단 → 제목·본문 먼저, 카드는 아래 전폭
      (combination 3T · curvature 2 · foreign-body 2 · vasectomy · glans 복합 특징) */
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story):has(>div:not(.ur-explanation-media) :is(h2,h3)),
#mansup-app .ur-source-split.mu-stack{display:grid;grid-template-columns:minmax(0,1fr)!important;grid-auto-flow:row;gap:34px;align-items:start}
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story):has(>div:not(.ur-explanation-media) :is(h2,h3))>.ur-explanation-media{order:2;position:static;top:auto;width:100%;max-width:none;margin:0;justify-items:center}
#mansup-app .ur-source-split.mu-stack>.ur-explanation-media{order:0;position:static;top:auto;width:100%;max-width:none;margin:0;justify-items:center}
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story):has(>div:not(.ur-explanation-media) :is(h2,h3))>div:not(.ur-explanation-media),
#mansup-app .ur-source-split.mu-stack>div:not(.ur-explanation-media){max-width:1100px}
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story):has(>div:not(.ur-explanation-media) :is(h2,h3)) .ur-detail-list,
#mansup-app .ur-source-split.mu-stack .ur-detail-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 55px}
/* .ed-reverse/.co-reverse 가 자식에 준 grid-column/row(좌우 바꾸기)는 세로 흐름에서 해제 — 안 하면 88px 유령 열이 생김 */
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story):has(>div:not(.ur-explanation-media) :is(h2,h3))>*,
#mansup-app .ur-source-split.mu-stack>*{grid-column:auto!important;grid-row:auto!important}
/* 전폭에 놓인 스토리 카드: 사진 왼쪽 + 리스트 오른쪽 (is-inline 카드도 2열로) */
#mansup-app .ur-explanation-media:not([data-x])>figure.mu-real-story{max-width:100%;width:100%}
#mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story,
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>div:not(.ur-explanation-media) :is(h2,h3))>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(22px,3vw,44px)}
#mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story-photo,
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>div:not(.ur-explanation-media) :is(h2,h3))>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story-photo{aspect-ratio:auto;min-height:360px;height:100%}
/* 전폭에 놓인 도해 카드(is-inline)는 과대 확대 방지 */
#mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real.is-inline:not(.mu-real-story){width:100%;max-width:820px;margin:0 auto}
#mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real.is-inline:not(.mu-real-story) .mu-real-grid[style*="--n:1"] .mu-real-panel>img{max-width:540px}
#mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real.is-inline:not(.mu-real-story) .mu-real-grid[style*="--n:2"]{max-width:760px}
@media(max-width:760px){#mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story,#mansup-app .ur-source-split.ur-illustrated-explanation:has(>div:not(.ur-explanation-media) :is(h2,h3))>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story{grid-template-columns:1fr;gap:18px}
 #mansup-app .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story-photo,#mansup-app .ur-source-split.ur-illustrated-explanation:has(>div:not(.ur-explanation-media) :is(h2,h3))>.ur-explanation-media>figure.mu-real-story.is-inline .mu-story-photo{aspect-ratio:16/10;min-height:0;height:auto}
 #mansup-app .ur-source-split.mu-stack .ur-detail-list{grid-template-columns:1fr}}

/* B. 본문 제목이 오른쪽 열 첫 줄인 2단 → 위쪽 기준 정렬 (세로 가운데 정렬 때문에 제목이 중간에 떠 보이던 문제) */
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>div:not(.ur-explanation-media)>:is(.ed-section-heading,.co-section-heading)),
#mansup-app .ur-transcript-section .ur-source-split{align-items:start}

/* C. 원칙 구획: 스토리 카드 + 도해 2단(카드 텍스트 열이 좁아 답답·상단 높이 불일치) → 카드 전폭, 도해는 아래 가운데 (glans·ed·vasectomy) */
#mansup-app .ed-principle-visuals:has(.mu-real-story){grid-template-columns:minmax(0,1fr)}
#mansup-app .ed-principle-visuals:has(.mu-real-story)>.ed-principle-visual{grid-column:1/-1;width:100%}
#mansup-app .ed-principle-visuals:has(.mu-real-story)>.ed-principle-visual>figure.mu-real-story{max-width:1100px}
#mansup-app .ed-principle-visuals:has(.mu-real-story)>.ed-principle-visual>figure:not(.mu-real-story),#mansup-app .ed-principle-visuals:has(.mu-real-story)>.ed-principle-visual>div{max-width:760px}

/* D. 소제목 아래 직답 문단(geo-answer)·더블업 대표 문장 — 크게, 구분되는 답변 박스 */
#mansup-app .mu-detail .ur-source-section>.geo-answer,#mansup-app .mu-detail .vr-methods>.geo-answer,#mansup-app .mu-detail .ed-section-heading+.geo-answer,#mansup-app .mu-detail .co-section-heading+.geo-answer,
#mansup-app .mu-detail .vr-center-title+.geo-answer,#mansup-app .mu-detail .vr-principles .geo-answer,
#mansup-app .mu-detail .ur-transcript-section>.geo-answer,#mansup-app .mu-detail .ur-transcript-section .ur-explanation-copy>.geo-answer,
#mansup-app .du-satisfaction .du-sat-lead{font-size:clamp(18px,1.32vw,21px);line-height:1.85;font-weight:500;color:#1C2B4A;background:#F5F8FB;border:1px solid #E3EAF0;border-top:3px solid #2E7BF0;border-radius:14px;padding:clamp(20px,2vw,28px) clamp(22px,2.4vw,34px);margin-top:26px;margin-bottom:40px;box-sizing:border-box}
#mansup-app .mu-detail .ur-transcript-section>.geo-answer{margin-top:0;margin-bottom:34px}
#mansup-app .du-satisfaction .du-sat-lead{max-width:1100px;margin-inline:auto}

/* E. 더블업 — 도해 영역 확대 (컨테이너 폭 1320 기준) */
#mansup-app .urology-doubleup .du-opening .mu-illust.du-illust,#mansup-app .urology-doubleup .du-steps-illust{max-width:1320px;padding:clamp(24px,3vw,44px) clamp(20px,2.6vw,40px)}
#mansup-app .urology-doubleup .du-materials .ur-explanation-media{max-width:1100px}
#mansup-app .urology-doubleup .du-materials .ur-explanation-media .mu-real-panel>img{max-width:100%}

/* F. 홈 장비 소개 — 문단을 타임라인 텍스트 열과 같은 열(2열 그리드, 장면 그리드와 동일 비율)에 정렬 */
@media(min-width:1001px){#mansup-app .mu-equipment-heading{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8%;align-items:end;justify-content:normal}
 #mansup-app .mu-equipment-heading>p{max-width:600px;justify-self:start}}

/* G. 배경 밴드 — 주제가 바뀌는 구획 약 1/3 에 연한 전폭 배경 (box-shadow + clip-path 전폭, 스크롤 폭에 영향 없음) */
#mansup-app .mu-band{position:relative;background:#F3F7FA;box-shadow:0 0 0 100vmax #F3F7FA;clip-path:inset(0 -100vmax);margin-top:clamp(56px,5.5vw,84px);padding-top:clamp(64px,6vw,90px)!important;padding-bottom:clamp(64px,6vw,90px)!important}
#mansup-app .mu-band+.ur-source-section,#mansup-app .mu-band+.vr-methods{padding-top:clamp(64px,6vw,96px)}
#mansup-app article.ur-transcript-section.mu-band{border-top:0}
#mansup-app .mu-band .ur-explanation-media>figure,#mansup-app .mu-band .mu-illust,#mansup-app .mu-band .mu-real{background:#fff}
#mansup-app .mu-band .mu-story-list>li{background:#fff}

/* ============================================================
   구도 정리 2차 260925 — 광고주 4차 검수 (답변 박스 전폭·스토리 카드 여백·중앙 축 통일·중복 정리)
   ============================================================ */
/* H. 답변 박스가 2/3 폭에서 끊기고 오른쪽이 비던 문제 → 컨테이너 전폭. 가운데 축 구획(ed-text-section·principles·mu-center)만 글자 가운데 */
#mansup-app .mu-detail .ur-source-section>.geo-answer,#mansup-app .mu-detail .vr-methods>.geo-answer,#mansup-app .mu-detail .ed-section-heading+.geo-answer,#mansup-app .mu-detail .co-section-heading+.geo-answer,
#mansup-app .mu-detail .ur-transcript-section>.geo-answer,#mansup-app .mu-detail .ur-transcript-section .ur-explanation-copy>.geo-answer{max-width:none!important;width:100%;margin-left:0!important;margin-right:0!important;text-align:left!important}
#mansup-app .mu-detail .ed-text-section .ed-section-heading+.geo-answer,#mansup-app .mu-detail .mu-center .geo-answer{text-align:center!important;max-width:1080px!important;margin-left:auto!important;margin-right:auto!important}
/* 스토리 카드 앞 제목 세로 흐름(규칙 A)·mu-stack 의 본문 열도 카드와 같은 전폭 (1100 캡 → 카드 1320 과 폭 불일치 해소) */
#mansup-app .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story):has(>div:not(.ur-explanation-media) :is(h2,h3))>div:not(.ur-explanation-media),
#mansup-app .ur-source-split.mu-stack>div:not(.ur-explanation-media){max-width:none}

/* I. 스토리 카드 — 흰 카드 안의 리스트 항목 배경은 밴드 안에서도 유지(글자가 카드 왼쪽 선에 붙어 보이던 문제) */
#mansup-app .mu-band .mu-real .mu-story-list>li{background:#F5F8FB}
#mansup-app .mu-story-wide .mu-story-body{padding:6px 6px 0}
#mansup-app .mu-story-note a{color:inherit;font-weight:700;text-decoration:underline;text-underline-offset:3px}
/* 사진 왼쪽 + 리스트 오른쪽 2열 스토리 카드(전폭 배치용) */
#mansup-app .mu-real-story.mu-story-2col .mu-story{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(22px,3vw,44px);align-items:stretch}
#mansup-app .mu-real-story.mu-story-2col .mu-story-photo{aspect-ratio:auto;min-height:340px;height:100%}
/* 설명 열이 없는 단독 스토리 카드 — 분할 그리드 해제, 전폭 */
#mansup-app .ur-source-split.mu-solo{display:block}
#mansup-app .ur-source-split.mu-solo>.ur-explanation-media{position:static;top:auto;width:100%;max-width:none;margin:0}
#mansup-app .ur-source-split.mu-solo>.ur-explanation-media>figure{max-width:100%;width:100%;margin-top:0}
#mansup-app .bph-therapy-grid>.ur-explanation-media{max-width:none;width:100%}
#mansup-app .bph-therapy-grid>.ur-explanation-media>figure{max-width:100%;width:100%}

/* J. 가운데 축 구획(mu-center): 제목·이미지·설명·특징 리스트를 모두 1080 가운데 축에 (귀두확대 02~06 · 실리콘 02) */
#mansup-app .mu-center .ed-section-heading{text-align:center}
#mansup-app .mu-center>div:not(.ed-section-heading):not(.ur-source-split){max-width:1080px;margin-inline:auto}
#mansup-app .mu-center .ur-source-split.mu-stack>div:not(.ur-explanation-media),#mansup-app .mu-center .ur-source-split.mu-stack>.ur-explanation-media,
#mansup-app .mu-center .ur-source-split.ur-illustrated-explanation:has(>.ur-explanation-media>.mu-real-story)>*{max-width:1080px;margin-inline:auto;width:100%}
#mansup-app .mu-center .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real.is-inline:not(.mu-real-story){max-width:1080px}
#mansup-app .mu-center .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real.is-inline:not(.mu-real-story) .mu-real-grid[style*="--n:1"] .mu-real-panel>img{max-width:620px}
#mansup-app .mu-center .ur-source-split.mu-stack>.ur-explanation-media>figure.mu-real.is-inline:not(.mu-real-story) .mu-real-grid[style*="--n:2"]{max-width:none}
#mansup-app .mu-center .ur-source-split.mu-stack>div>p.vr-body,#mansup-app .mu-center>div>p.vr-body{text-align:center;max-width:1000px;margin-inline:auto}
#mansup-app .mu-center .gx-sub-heading,#mansup-app .mu-center .mu-stack-heading{text-align:center}
#mansup-app .mu-center .ed-wide-copy{max-width:1080px;margin-inline:auto}

/* K. 사진이 먼저 오는 세로 흐름 (실리콘 02: 제목 → 답변 → 사진 → 01~08) */
#mansup-app .ur-source-split.mu-stack.mu-media-first>.ur-explanation-media{order:0}
#mansup-app .ur-source-split.mu-stack.mu-media-first>.ur-explanation-media>figure.vr-photo{margin:0 auto;max-width:1080px;width:100%}
#mansup-app .ur-source-split.mu-stack.mu-media-first>.ur-explanation-media>figure.vr-photo>img{width:100%;height:auto;aspect-ratio:2/1;object-fit:cover;border-radius:18px}

/* L. 진료 과정 — 위 설명과 이어져 보이던 라벨을 키우고 밴드 색을 구분 (clinic-care-guide 전 페이지) */
#mansup-app .clinic-care-guide .vr-band-label:has(+.vr-process){position:relative;font-size:clamp(26px,2.1vw,32px);font-weight:700;color:#16223B;margin:clamp(56px,5vw,76px) 0 0;padding:clamp(44px,4vw,60px) 0 6px;background:#E3EDF6;box-shadow:0 0 0 100vmax #E3EDF6;clip-path:inset(0 -100vmax)}
#mansup-app .clinic-care-guide .vr-band-label:has(+.vr-process)+.vr-process{position:relative;background:#E3EDF6;box-shadow:0 0 0 100vmax #E3EDF6;clip-path:inset(0 -100vmax);padding:28px 0 clamp(48px,4.5vw,64px);margin-bottom:0}
#mansup-app .clinic-care-guide .vr-band-label:has(+.vr-process)+.vr-process+*{margin-top:clamp(48px,4.5vw,64px)}

/* M. 성병 '흔히 나타나는 변화' — 4칸 가로, 전폭 */
#mansup-app .ed-principle-visual.ed-visual-wide>.ur-assessment-visual{max-width:1100px}
#mansup-app .ur-assessment-visual.mu-4col .ur-visual-label{font-size:18px;font-weight:700;color:#1C2B4A}
#mansup-app .ur-assessment-visual.mu-4col .ur-assessment-grid p{font-size:15.5px;line-height:1.85}
@media(min-width:901px){#mansup-app .ur-assessment-visual.mu-4col .ur-assessment-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 30px}}

/* N. 남성갱년기 증상 표 — 3열(항목·증상·상담 기준) */
#mansup-app .ur-detail-table.mu-3col th:first-child{width:18%}
#mansup-app .ur-detail-table.mu-3col thead th{font-weight:700}
#mansup-app .ur-detail-table.mu-3col td.mu-crit{color:#1C2B4A;background:#F8FBFD;white-space:normal}
#mansup-app .mu-table-note{margin:18px 0 0;padding:14px 18px;border-left:3px solid #E39A55;background:#FFF7EE;font-size:15.5px;line-height:1.75;color:#8A4B12;border-radius:0 10px 10px 0;word-break:keep-all;text-align:left}

/* O. 음경확대술 페이지의 실리콘 종류 — 요약 카드(실리콘보형물수술 페이지와 다른 스타일) */
#mansup-app .mu-type-compact{list-style:none;margin:clamp(26px,3vw,40px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
#mansup-app .mu-type-compact>li{display:flex;align-items:center;gap:14px;padding:14px 16px;background:#fff;border:1px solid #E3E9F0;border-radius:16px;min-width:0}
#mansup-app .mu-type-compact img{flex:0 0 74px;width:74px;height:74px;object-fit:cover;border-radius:50%;background:#EEF3F8;border:1px solid #E3E9F0}
#mansup-app .mu-type-compact b{display:block;font-size:16px;font-weight:700;color:#16223B;line-height:1.4;word-break:keep-all}
#mansup-app .mu-type-compact span{display:block;margin-top:4px;font-size:13.5px;line-height:1.6;color:#5B6B7D;word-break:keep-all}
#mansup-app .mu-type-more{margin:26px 0 0;text-align:center;font-size:16px;color:#3A465E;line-height:1.8;word-break:keep-all}
#mansup-app .mu-type-more a{display:inline-flex;align-items:center;gap:8px;margin-left:10px;padding:10px 18px;border-radius:999px;background:#1C2B4A;color:#fff;font-weight:700;text-decoration:none;font-size:15px;vertical-align:middle}
@media(max-width:1000px){#mansup-app .mu-type-compact{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){#mansup-app .mu-type-compact{grid-template-columns:1fr}}

/* P. 트리믹스 — 사진 패널이 오른쪽 설명 열 높이에 맞춰 늘어남 (01 경구용과 같은 구도) */
#mansup-app .ed-reading-balanced .ur-source-split.mu-fill-media{align-items:stretch}
#mansup-app .ed-reading-balanced .ur-source-split.mu-fill-media>.ur-explanation-media{display:flex;flex-direction:column;height:100%;width:100%;max-width:560px}
#mansup-app .ed-reading-balanced .ur-source-split.mu-fill-media>.ur-explanation-media>figure.mu-real{flex:1;display:flex;flex-direction:column;margin-top:0;height:100%}
#mansup-app .ed-reading-balanced .ur-source-split.mu-fill-media>.ur-explanation-media>figure.mu-real .mu-real-grid{flex:1;align-content:center}

/* Q. 만곡증 원형 2패널 — 래스터 링(계단 현상) 제거, 링·라벨은 CSS·텍스트로 */
#mansup-app .mu-circle2 .mu-real-grid{gap:clamp(24px,4vw,60px);max-width:900px;margin:0 auto}
#mansup-app .mu-circle2 .mu-real-panel>img{width:100%;max-width:360px;aspect-ratio:1/1;object-fit:cover;border-radius:50%;border:7px solid #C9DCEA;background:#fff;box-sizing:border-box}
#mansup-app .mu-circle2 .mu-real-panel>span{font-size:19px}

/* R. 정관수술 무통 구획 — 무통주사기 도해 왼쪽 + 과정별 설명 오른쪽 */
#mansup-app .vs-comfort.mu-comfort2{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:32px clamp(32px,4vw,64px);align-items:start}
#mansup-app .vs-comfort.mu-comfort2 .vs-comfort-media{max-width:none}
#mansup-app .vs-comfort.mu-comfort2 .vs-comfort-media>figure{margin:0;width:100%;max-width:560px}
#mansup-app .vs-comfort.mu-comfort2 .vs-comfort-title{font-size:clamp(26px,2.1vw,32px)}
#mansup-app .vs-comfort.mu-comfort2 .mu-story-list{margin-top:26px}
#mansup-app .vs-comfort.mu-comfort2 .mu-story-note{margin-top:18px}

/* S. 발기부전 개요 — '발기가 이루어지는 과정' 카드: 해부 그림 왼쪽 + 4단계 오른쪽 */
#mansup-app .du-opening .mu-real-story.mu-story-2col.ur-hero-visual{max-width:1320px;text-align:left}
#mansup-app .du-opening .mu-real-story.mu-story-2col.ur-hero-visual .mu-story{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
#mansup-app .du-opening .mu-real-story.mu-story-2col.ur-hero-visual .mu-story-photo{aspect-ratio:auto;min-height:0;height:100%}
#mansup-app .du-opening .mu-real-story.mu-story-2col .mu-story-photo>img{object-position:50% 55%}
#mansup-app .du-opening .mu-real-story.mu-story-2col figcaption{text-align:center}

/* T. 개요 문단 폭 — 한두 단어만 다음 줄로 넘어가던 줄바꿈 완화 */
#mansup-app .du-opening>div{max-width:1160px}
#mansup-app .du-opening .vr-body{max-width:1160px}

@media(max-width:900px){#mansup-app .vs-comfort.mu-comfort2{grid-template-columns:1fr}#mansup-app .vs-comfort.mu-comfort2 .vs-comfort-media>figure{margin:0 auto}}
@media(max-width:760px){#mansup-app .mu-real-story.mu-story-2col .mu-story,#mansup-app .du-opening .mu-real-story.mu-story-2col.ur-hero-visual .mu-story{grid-template-columns:1fr;gap:18px}
 #mansup-app .mu-real-story.mu-story-2col .mu-story-photo,#mansup-app .du-opening .mu-real-story.mu-story-2col.ur-hero-visual .mu-story-photo{aspect-ratio:16/10;min-height:0;height:auto}
 #mansup-app .ur-source-split.mu-stack.mu-media-first>.ur-explanation-media>figure.vr-photo>img{aspect-ratio:16/10}
 #mansup-app .mu-circle2 .mu-real-panel>img{max-width:260px}}

/* U. 개요·설명 문단 줄 균형 — 한두 단어만 다음 줄로 떨어지는 고아 줄 방지 */
#mansup-app .du-opening .vr-body,#mansup-app .vr-principles .ur-story-explanation,#mansup-app .clinic-care-guide .vr-band-intro,#mansup-app .du-opening h2,#mansup-app .vr-center-title{text-wrap:balance}

/* V. 렌더 검증 보정 — 트리믹스 사진 열 늘림(sticky align-self 해제) · 전립선염 카드 전폭(인라인 640 캡 해제) · 성병 4칸 카드 전폭(centered 620 캡 해제) */
#mansup-app .ed-reading-balanced .ur-source-split.mu-fill-media>.ur-explanation-media{align-self:stretch}
#mansup-app .bph-therapy-grid>.ur-explanation-media{max-width:none!important;margin:0 0 36px!important}
#mansup-app .ed-principle-visual.ed-visual-wide.ed-visual-centered{max-width:1100px}

/* W. 5차 검수 보완 — 스토리 카드 글자 여백 · 만곡증 링 10px · 전립선염 증상 4칸 · 스톡 사진 초점 */
#mansup-app .mu-story-wide .mu-story-body{padding:8px 24px 0}
#mansup-app .mu-circle2 .mu-real-panel>img{border-width:10px;border-color:#BFD5E6}
#mansup-app .mu-symptoms{margin-top:clamp(26px,3vw,40px);border:1px solid #E3E9F0;border-radius:22px}
#mansup-app h4.ur-visual-label{margin:0 0 22px;font-size:20px;font-weight:700;color:#1C2B4A}
#mansup-app .mu-symptoms .ur-assessment-grid strong{font-size:18px}
#mansup-app .mu-symptoms .ur-assessment-grid p{font-size:15.5px;line-height:1.85;color:#5B6B7D}
#mansup-app .mu-story-photo>img[data-focus]{object-position:var(--focus,50% 50%)}