#gnb > ul > li:hover > .submenu, #gnb > ul > li.open > .submenu{display:block}
/* ── 모바일 하단 고정 바 ───────────────────────── */
.vh-mbar{display:none}
@media (max-width:767px){
  .vh-mbar{display:grid;grid-template-columns:1fr 1.4fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:40;
    background:#fff;border-top:1px solid #e4ddd3;box-shadow:0 -6px 20px rgba(60,50,40,.14);
    padding-bottom:env(safe-area-inset-bottom,0px)}
  .vh-mbar a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    padding:11px 4px;font-size:12.5px;color:#554b39;font-weight:500;text-decoration:none;min-height:52px}
  .vh-mbar a+a{border-left:0}
  .vh-mbar-i{font-size:17px;line-height:1}
  /* B안: 흰 바탕 + 네이버 그린 글씨·테두리 — 브랜드 인식은 지키고 면적을 줄여 핑크 띠와의 충돌을 피함 */
  .vh-mbar-main{background:#fff;color:#03C75A!important;font-weight:800;font-size:15px;box-shadow:inset 0 0 0 2px #03C75A;border-radius:10px;margin:7px 6px}
  .vh-mbar-main::before{content:"N";display:inline-block;font-family:Pretendard,sans-serif;font-weight:900;font-size:13px;line-height:1;color:#fff;background:#03C75A;border-radius:4px;padding:3px 5px 2px;margin-right:7px;vertical-align:-1px}
  .vh-mbar-main:active{background:#f1fbf5}
  body{padding-bottom:58px}
  #top_btn{bottom:calc(72px + env(safe-area-inset-bottom,0px))!important}
  .quick-menu{display:none!important}
}
/* ── 모바일 내비게이션 ─────────────────────────── */
@media (max-width:1179px){
  #gnb{max-height:calc(100vh - 72px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  #gnb > ul > li{border-bottom:1px solid rgba(255,255,255,.14)}
  #gnb > ul > li > a{padding:15px 18px!important;justify-content:space-between!important;font-size:16px;position:relative}
  #gnb > ul > li > a::after{content:"";width:8px;height:8px;border-right:2px solid rgba(255,255,255,.7);border-bottom:2px solid rgba(255,255,255,.7);transform:rotate(45deg);transition:transform .2s ease;flex:none}
  #gnb > ul > li.open > a::after{transform:rotate(-135deg)}
  #gnb .submenu{background:#fffdf8;padding:4px 0}
  #gnb .submenu li a{display:block;padding:12px 30px;color:#554b39;font-size:15px;text-align:left}
  #gnb .submenu li+li{border-top:1px solid #efe9e2}
}
@media (prefers-reduced-motion:reduce){#gnb > ul > li > a::after{transition:none}}


/* ── 대표원장 소개: 모바일은 사진 → 약력 순서 ───────
   Tailwind Play CDN 이 런타임에 스타일을 뒤에 주입하므로 !important 로 못 박는다. */
@media (max-width:474px){
  .vh-ceo-wrap{background-image:none!important;padding-top:28px!important}
  .vh-ceo{display:flex!important;flex-direction:column!important;gap:16px!important}
  .vh-ceo > img{order:-1!important;width:100%!important;max-width:280px!important;margin:0 auto!important;display:block!important}
  .vh-ceo > div{order:1!important}
  .vh-ceo > div .pb-20{padding-bottom:0!important}
  .vh-ceo > div .mt-10{margin-top:0!important}
  .vh-ceo ul{padding-left:0!important}
}

/* ── 가로 넘침 차단 ─────────────────────────────
   슬라이더 래퍼 등 뷰포트보다 넓은 요소가 문서 전체를 넓혀
   섹션 배경이 오른쪽에서 끊기고 고정 바가 어긋나 보이던 문제. */
html{overflow-x:clip}
body{overflow-x:clip;max-width:100%}
.swiper-container{overflow:hidden}
img,video,iframe,table{max-width:100%}
.root_daum_roughmap{max-width:100%!important}

/* 하단 고정 바 — 뷰포트 기준으로 항상 꽉 차게 */
@media (max-width:767px){
  .vh-mbar{left:0;right:0;width:100%;box-sizing:border-box}
  body{padding-bottom:calc(58px + env(safe-area-inset-bottom,0px))}
}

/* ── 한국어 줄바꿈 품질 ─────────────────────────
   어절 중간에서 끊기지 않게 하고, 제목은 줄 길이를 고르게 분배. */
.vh-proc,.vh-info,.vh-home-faq{word-break:keep-all;overflow-wrap:break-word}
.vh-proc h1,.vh-proc h2,.vh-proc h3,.vh-info h1,.vh-info h2,.vh-info h3,.vh-home-faq-title{text-wrap:balance}
.vh-proc p,.vh-info p,.vh-home-faq details p,.vh-sub{text-wrap:pretty}
.vh-head h1{text-wrap:balance}
@media (max-width:767px){
  .vh-head{padding-left:4px;padding-right:4px}
  .vh-sub{font-size:15.5px;line-height:1.7}
  .vh-crumb{font-size:12.5px}
  /* 표·목차·카드 안의 긴 명사구가 잘리지 않도록 */
  .vh-toc li,.vh-tile b,.vh-tile span,.vh-appl p,.vh-card li{word-break:keep-all}
  .vh-price td:first-child{word-break:keep-all;min-width:9em}
}

/* 증례 배너 제목: 모바일 2줄 고정, PC 는 원본처럼 한 줄 + 줄바꿈 */
.vh-bl{display:block}
@media (min-width:640px){.vh-bl{display:inline}.vh-bl:last-child{display:block}}