/* ==========================================================
   개인정보 팝업 (MO 시안 1:14588 기준: 흰 박스 + #EFEFEF 본문 + X 닫기)
   + MO 720 시안 전용 레이아웃 (≤1024px)
   ========================================================== */
.modal {z-index:1100;}
.modal-privacy {background:rgba(0,0,0,.4);}
.modal-privacy .modal-box {width:640px;max-width:calc(100% - 40px);height:min(1180px, 86vh);border-radius:20px;background:#fff;overflow:hidden;display:flex;flex-direction:column;}
.modal-privacy .modal-head {flex:none;height:100px;padding:0 40px;background:#fff;display:flex;align-items:center;justify-content:space-between;}
.modal-privacy .modal-head strong {font-size:22px;font-weight:500;color:#000;line-height:normal;letter-spacing:0;}
.modal-privacy .modal-close {flex:none;width:40px;height:36px;padding:0;background:none;border:0;cursor:pointer;font-size:0;display:block;}
.modal-privacy .modal-close img {display:block;width:100%;height:100%;}
.modal-privacy .modal-contents {flex:1;height:auto;min-height:0;background:#efefef;overflow:hidden;}
.modal-privacy .modal-contents .inner {height:100%;overflow-y:auto;padding:36px 40px 36px;font-size:18px;line-height:30px;letter-spacing:-0.36px;color:#000;word-break:keep-all;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#7d7d7d transparent;}
.modal-privacy .modal-contents .inner p {margin:0;}
.modal-privacy .modal-contents .inner::-webkit-scrollbar {width:8px;}
.modal-privacy .modal-contents .inner::-webkit-scrollbar-track {background:transparent;margin:12px 0;}
.modal-privacy .modal-contents .inner::-webkit-scrollbar-thumb {background:#7d7d7d;border-radius:60px;}

/* PC에서는 MO 전용 요소 숨김 */
.mo-header, .mo-menu, .mo-page, .mo-bar, .reservation-dim, .reservation-handle {display:none;}

@media screen and (max-width:1024px) {
  :root {--vw: 100vw; --u: calc(var(--vw) / 720); --uh: min(calc(var(--vw) / 720), 0.75px);} /* --vw: 스크롤바 제외 실제 폭(JS가 clientWidth로 갱신, 데스크톱 창 축소 시 100vw가 스크롤바 폭만큼 커서 2열→1열로 깨지던 문제 해결). --uh: 헤더·하단바 전용(540px 이상에서 크기 고정) */
  html, body {background:#fffbf8;}
  #wrap {padding-top:0 !important;}
  body {padding-bottom:calc(var(--uh) * 133 + env(safe-area-inset-bottom));}

  /* PC 전용 영역 숨김 */
  .header, .page-main > .sec, .footer.ft, .fnb, .btn-burger {display:none !important;}

  .mo-page {display:block;width:100%;overflow:hidden;background:#fffbf8;color:#4b3529;}
  .mo-page p {margin:0;}
  .mo-page img {max-width:none;}
  .mo-page .fg-arrow {padding:0;background:none;border:0;}
  .mo-page .mo-intro-swiper {overflow:hidden;}
  .mo-page .mo-intro-swiper .swiper-wrapper {align-items:center;}

  /* 헤더 (상단 고정) 1:13873 */
  .mo-header {display:flex;position:fixed;left:0;right:0;top:0;z-index:20;height:calc(var(--uh) * 93);padding:calc(var(--uh) * 28) calc(var(--uh) * 32) calc(var(--uh) * 20);align-items:center;justify-content:space-between;transition:background-color .3s ease, box-shadow .3s ease;}
  .mo-header .mo-logo {display:block;width:calc(var(--uh) * 200);height:calc(var(--uh) * 45);}
  .mo-header .mo-logo img, .mo-menu .mo-logo img {display:block;width:100%;height:100%;object-fit:cover;}
  .mo-burger {display:flex;flex-direction:column;justify-content:center;gap:calc(var(--uh) * 8.84);width:calc(var(--uh) * 39.52);height:calc(var(--uh) * 27.04);padding:0;background:none;border:0;cursor:pointer;filter:drop-shadow(0 calc(var(--uh) * 4) calc(var(--uh) * 2) rgba(0,0,0,.25));box-sizing:content-box;}
  .mo-burger i {display:block;width:100%;height:calc(var(--uh) * 3.12);background:#fff;transition:background-color .3s ease;}
  .mo-header.scrolled {background:rgba(255,251,248,.96);box-shadow:0 1px 0 rgba(75,53,41,.08);}
  .mo-header.scrolled .mo-burger {filter:none;}
  .mo-header.scrolled .mo-burger i {background:#4b3529;}

  /* 메뉴 오픈 1:13897 */
  .mo-menu {display:block;position:fixed;inset:0;z-index:900;background:rgba(14,10,8,.92);opacity:0;visibility:hidden;transition:opacity .4s ease, visibility .4s;}
  .mo-menu.active {opacity:1;visibility:visible;}
  .mo-menu-inner {position:relative;height:100%;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;padding:calc(var(--u) * 180) calc(var(--u) * 48) calc(var(--u) * 80);}
  .mo-menu .mo-logo {position:absolute;left:calc(var(--uh) * 32);top:calc(var(--uh) * 28);width:calc(var(--uh) * 200);height:calc(var(--uh) * 45);display:block;}
  .mo-menu-close {position:absolute;left:auto;right:calc(var(--uh) * 32);top:calc(var(--uh) * 27);width:calc(var(--uh) * 40);height:calc(var(--uh) * 40);padding:0;background:none;border:0;cursor:pointer;}
  .mo-menu-close i {position:absolute;left:50%;top:50%;width:calc(var(--uh) * 40);height:2px;background:#fff;}
  .mo-menu-close i:first-child {transform:translate(-50%,-50%) rotate(45deg);}
  .mo-menu-close i:last-child {transform:translate(-50%,-50%) rotate(-45deg);}
  .mo-menu-label {margin:0;font-size:calc(var(--u) * 16);font-weight:500;letter-spacing:calc(var(--u) * 4.8);color:rgba(248,233,217,.7);line-height:normal;}
  .mo-menu-sub {margin:calc(var(--u) * 7) 0 0;font-size:calc(var(--u) * 22);font-weight:300;color:rgba(255,255,255,.55);line-height:normal;}
  .mo-menu-nav {margin-top:calc(var(--u) * 44);}
  .mo-menu-nav ul {margin:0;padding:0;list-style:none;}
  .mo-menu-nav li {border-top:1px solid rgba(255,255,255,.14);}
  .mo-menu-nav li:last-child {border-bottom:1px solid rgba(255,255,255,.14);}
  .mo-menu-nav a {display:flex;align-items:center;padding:calc(var(--u) * 26) 0;color:#fff;text-decoration:none;}
  .mo-menu-nav .no {flex:none;width:calc(var(--u) * 60);font-size:calc(var(--u) * 18);font-weight:300;letter-spacing:calc(var(--u) * .72);color:rgba(248,233,217,.8);}
  .mo-menu-nav .txt {flex:1;display:flex;flex-direction:column;gap:calc(var(--u) * 6);white-space:nowrap;line-height:normal;}
  .mo-menu-nav strong {font-size:calc(var(--u) * 36);font-weight:400;color:#fff;}
  .mo-menu-nav li.on strong {font-weight:600;}
  .mo-menu-nav em {font-style:normal;font-size:calc(var(--u) * 13);font-weight:500;letter-spacing:calc(var(--u) * 2.6);color:rgba(248,233,217,.55);}
  .mo-menu-nav .arr {flex:none;position:relative;width:calc(var(--u) * 24);height:calc(var(--u) * 24);}
  .mo-menu-nav .arr:before, .mo-menu-nav .arr:after {content:'';position:absolute;left:calc(var(--u) * 6.5);width:calc(var(--u) * 11);height:1.5px;background:rgba(248,233,217,.7);transform-origin:left center;}
  .mo-menu-nav .arr:before {top:calc(var(--u) * 12);transform:rotate(-45deg);}
  .mo-menu-nav .arr:after {top:calc(var(--u) * 12);transform:rotate(45deg);}
  .mo-menu-cs {margin-top:calc(var(--u) * 72);}
  .mo-menu-cs .lbl {margin:0;font-size:calc(var(--u) * 14);font-weight:500;letter-spacing:calc(var(--u) * 2.8);color:rgba(248,233,217,.6);}
  .mo-menu-cs .tel {display:block;margin-top:calc(var(--u) * 8);font-size:calc(var(--u) * 40);font-weight:300;letter-spacing:calc(var(--u) * -.4);color:#fff;line-height:normal;}
  .mo-menu-cs .hours {margin:calc(var(--u) * 6) 0 0;font-size:calc(var(--u) * 16);line-height:calc(var(--u) * 26);color:rgba(255,255,255,.5);white-space:nowrap;}
  .mo-menu-cs .btns {display:flex;gap:calc(var(--u) * 12);margin-top:calc(var(--u) * 32);align-items:center;}
  .mo-menu-cs .btns a, .mo-menu-cs .btns button {display:flex;align-items:center;justify-content:center;font-size:calc(var(--u) * 22);font-weight:500;line-height:normal;cursor:pointer;}
  .mo-menu-cs .b-call {width:calc(var(--u) * 306);height:calc(var(--u) * 50);border:1px solid rgba(255,255,255,.6);color:#fff;}
  .mo-menu-cs .b-cs {flex:1;height:calc(var(--u) * 48);background:#f8e9d9;color:#4b3529;border:0;}
  body.menu-open {overflow:hidden;}

  /* 하단 빠른상담 바 (하단 고정) 1:13880 */
  .mo-bar {display:flex;position:fixed;left:0;right:0;bottom:0;z-index:15;background:#4b3529;justify-content:space-between;align-items:flex-start;padding:calc(var(--uh) * 18) max(calc(var(--uh) * 40), calc((100% - var(--uh) * 640) / 2)) calc(var(--uh) * 22 + env(safe-area-inset-bottom));}
  .mo-bar-item {display:flex;flex-direction:column;align-items:center;gap:calc(var(--uh) * 8);padding:0;background:none;border:0;cursor:pointer;color:#f8e9d9;text-decoration:none;}
  .mo-bar-item .ic {display:flex;align-items:center;justify-content:center;width:calc(var(--uh) * 60.5);height:calc(var(--uh) * 60.5);border-radius:50%;background:#8e8965;}
  .mo-bar-item .ic img {display:block;width:calc(var(--uh) * 33.44);height:calc(var(--uh) * 33.44);object-fit:contain;}
  .mo-bar-item:nth-child(2) .ic img {width:calc(var(--uh) * 40.48);height:calc(var(--uh) * 40.48);}
  .mo-bar-item:nth-child(3) .ic img {width:calc(var(--uh) * 36.96);height:calc(var(--uh) * 36.96);}
  .mo-bar-item:nth-child(4) .ic img {width:calc(var(--uh) * 29.92);height:calc(var(--uh) * 27.03);}
  .mo-bar-item .tx {font-size:calc(var(--uh) * 20);line-height:normal;white-space:nowrap;color:#f8e9d9;}

  /* 빠른상담창 (바텀시트) 1:14465 */
  .reservation-dim {display:block;position:fixed;inset:0;z-index:950;background:rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .35s ease, visibility .35s;}
  body.cs-open .reservation-dim {opacity:1;visibility:visible;}
  .reservation {display:block;position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;z-index:960;background:#8e8965;color:#fff;border-radius:calc(var(--u) * 24) calc(var(--u) * 24) 0 0;padding:calc(var(--u) * 60) calc(var(--u) * 48) calc(var(--u) * 56 + env(safe-area-inset-bottom));transform:translateY(100%);visibility:hidden;transition:transform .4s cubic-bezier(.22,.61,.36,1), visibility .4s;}
  .reservation.active {transform:none;visibility:visible;}
  .reservation .reservation-handle {display:block;position:absolute;left:50%;top:calc(var(--u) * 14);width:calc(var(--u) * 56);height:calc(var(--u) * 5);margin-left:calc(var(--u) * -28);border-radius:calc(var(--u) * 3);background:rgba(255,255,255,.5);}
  .reservation .reservation-close {left:auto;right:0;top:0;width:calc(var(--u) * 88);height:calc(var(--u) * 88);background:#4b3529 url(../images/mo/ui/cs_close.png) no-repeat center/calc(var(--u) * 36);border-top-right-radius:calc(var(--u) * 24);}
  .reservation .title {font-size:calc(var(--u) * 34);font-weight:700;line-height:normal;margin:0;}
  .reservation .txt {font-size:calc(var(--u) * 20);line-height:calc(var(--u) * 30);margin:calc(var(--u) * 14) 0 0;width:calc(var(--u) * 560);}
  .reservation .txt .pc-br {display:none;}
  .reservation .form-wrap {margin-top:calc(var(--u) * 40);}
  .reservation .input-box {margin-bottom:calc(var(--u) * 18);}
  .reservation .form-row:last-of-type .input-box {margin-bottom:0;}
  .reservation .input-box span {left:calc(var(--u) * 28);font-size:calc(var(--u) * 20);color:#836969;}
  .reservation .input-box input {height:calc(var(--u) * 84);border-radius:calc(var(--u) * 6);padding:0 calc(var(--u) * 24) 0 calc(var(--u) * 48);font-size:calc(var(--u) * 22);}
  .reservation .input-box input::placeholder {color:rgba(128,128,128,.8);}
  .reservation .agree {margin-top:calc(var(--u) * 40);}
  .reservation .check {gap:calc(var(--u) * 12);font-size:calc(var(--u) * 20);}
  .reservation .agree i {width:calc(var(--u) * 30);height:calc(var(--u) * 30);flex:none;}
  .reservation .agree i:before {width:calc(var(--u) * 26);height:calc(var(--u) * 26);left:calc(var(--u) * 2);top:calc(var(--u) * 2);border-width:2px;}
  .reservation .agree input:checked + i {width:calc(var(--u) * 30);height:calc(var(--u) * 30);background:url(../images/mo/ui/cs_check.png) no-repeat center/contain;}
  .reservation .agree input:checked + i:before {display:none;}
  .reservation .btn-terms-more {font-size:calc(var(--u) * 17);color:rgba(255,255,255,.85);margin-top:calc(var(--u) * 8);padding-left:calc(var(--u) * 42);}
  .reservation .btn-submit {height:calc(var(--u) * 88);border-radius:calc(var(--u) * 6);font-size:calc(var(--u) * 22);margin-top:calc(var(--u) * 44);}

  /* 알림 팝업 (MO 1:14094 / 1:14279) */
  .modal {background:rgba(0,0,0,.45);}
  .modal-alert .modal-box {width:calc(var(--u) * 560);max-width:none;min-height:0;padding:calc(var(--u) * 56) calc(var(--u) * 40);border-radius:calc(var(--u) * 20);}
  .modal-alert .alert-icon {width:calc(var(--u) * 44);height:calc(var(--u) * 44);margin:0 auto calc(var(--u) * 24);}
  .modal-alert .modal-contents {font-size:calc(var(--u) * 22);line-height:calc(var(--u) * 34);letter-spacing:0;}
  .modal-alert .modal-contents p {margin:0;}
  .modal-alert .modal-btn {margin-top:calc(var(--u) * 40);}
  .modal-alert .modal-btn .btn-primary {width:calc(var(--u) * 180);height:calc(var(--u) * 60);line-height:calc(var(--u) * 60);border-radius:calc(var(--u) * 4);font-size:calc(var(--u) * 20);}

  /* 개인정보 팝업 MO 1:14588 (640x1180, 상단 150) */
  .modal-privacy {background:rgba(0,0,0,.4);}
  .modal-privacy .modal-box {width:calc(var(--u) * 640);max-width:none;height:min(calc(var(--u) * 1180), calc(100dvh - var(--u) * 80));border-radius:calc(var(--u) * 20);}
  .modal-privacy .modal-head {height:calc(var(--u) * 100);padding:0 calc(var(--u) * 40);}
  .modal-privacy .modal-head strong {font-size:calc(var(--u) * 22);}
  .modal-privacy .modal-close {width:calc(var(--u) * 40);height:calc(var(--u) * 36);}
  .modal-privacy .modal-contents .inner {padding:calc(var(--u) * 36) calc(var(--u) * 56) calc(var(--u) * 36) calc(var(--u) * 40);font-size:calc(var(--u) * 18);line-height:calc(var(--u) * 30);letter-spacing:calc(var(--u) * -.36);}
}

/* [rev1] MO 메뉴 소메뉴(Figma 48:14588 · 메뉴 오픈_소메뉴 펼침) */
@media screen and (max-width: 1024px) {
  .mo-menu-nav li.has-sub > a .arr:before, .mo-menu-nav li.has-sub > a .arr:after {transition:transform .3s ease, top .3s ease, left .3s ease;}
  .mo-menu-nav li.has-sub.open > a strong {font-weight:600;color:#f8e9d9;}
  .mo-menu-nav li.has-sub.open > a .arr:before {top:calc(var(--u) * 9);left:calc(var(--u) * 4);transform:rotate(45deg);}
  .mo-menu-nav li.has-sub.open > a .arr:after {top:calc(var(--u) * 17);left:calc(var(--u) * 11.6);transform:rotate(-45deg);}
  .mo-menu-nav .mo-menu-sub2 {display:none;margin:0;padding:calc(var(--u) * 6) 0 calc(var(--u) * 14) calc(var(--u) * 60);list-style:none;background:rgba(255,255,255,.04);}
  .mo-menu-nav li.has-sub.open > .mo-menu-sub2 {display:block;}
  .mo-menu-nav .mo-menu-sub2 li, .mo-menu-nav .mo-menu-sub2 li:last-child {border:0;}
  .mo-menu-nav .mo-menu-sub2 a {display:flex;align-items:center;gap:calc(var(--u) * 16);padding:calc(var(--u) * 14) 0;font-size:calc(var(--u) * 26);font-weight:400;line-height:normal;color:rgba(255,255,255,.78);}
  .mo-menu-nav .mo-menu-sub2 .dash {flex:none;width:calc(var(--u) * 14);height:1px;background:rgba(248,233,217,.45);}
  .mo-menu-nav .mo-menu-sub2 a.on {font-weight:500;color:#fff;}
  .mo-menu-nav .mo-menu-sub2 a.on .dash {background:rgba(248,233,217,.9);}
}

/* [rev1] 2열 카드(가치 4박스·노하우 4박스 등): 304+16+304=624 정확히 맞물려 실기기 소수점 반올림 시 1열로 떨어지던 문제 → 퍼센트 기준 + 여유 0.5px */
@media screen and (max-width: 1024px) {
  .mo-page .flex-wrap > .w-\[304px\] {width:calc(50% - var(--u) * 8 - 0.5px);}
}

/* [rev5] 하위 카테고리 없는 메뉴(병원소개·스킨부스터·성형후관리)는 우측 화살표 제거 (Figma 수정본) */
@media screen and (max-width: 1024px) {
  .mo-menu-nav > ul > li:not(.has-sub) > a .arr {visibility:hidden;}
}
