/* 하위 페이지(아임웹) 머리말·떠 있는 요소를 새 메인과 같게 (디자이너 2026-10-20 "첨부이미지의 네비게이션 영역 … 아직 반영이 안되었어요").
   PC: 헤더 · 왼쪽 아래 상담창 · 오른쪽 빠른 메뉴 / 모바일: 헤더 · 메뉴 서랍 · 하단 바 · 맨 위로.
   조각(nav.html)은 deploy.py 가 메인 index.src.html 에서 그대로 잘라 만들고, router.php → i18n_lib.php anz_nav() 가 아임웹 헤더 자리에 넣는다.
   값은 main.css 그대로. 아임웹 CSS(bootstrap 등)와 서로 섞이지 않게 모든 규칙을 .anz-nav 아래에 두고, 글꼴도 따로 이름 붙인다.
   하위 페이지에는 사진 히어로가 없어 헤더는 늘 밝은 상태 (메인 main.js 의 밝은 상태 · 시안 디자인 시스템 10 Header 밝은 줄 #F8F8FA). */

/* 글꼴: 메인과 같은 파일. 아임웹도 "Pretendard Variable"·"Pretendard"·"Noto Sans KR" 을 다른 파일로 정의하므로 이름을 따로 붙인다.
   한국어 페이지는 메인 main.css 와 같이 기본 두 글꼴만, 다른 언어 페이지는 메인 i18n.css 처럼 같은 이름 묶음에 보충 글꼴(몽골어 Ө·Ү·러시아어, 베트남어, 태국어, 아랍어)을 더한 "… T" 묶음 */
@font-face { font-family: "ANZ Nav Sans"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/mainpage/fonts/PretendardVariable.subset.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; }
@font-face { font-family: "ANZ Nav Noto"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/mainpage/fonts/NotoSansKR-Variable.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "ANZ Nav Sans T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/mainpage/fonts/PretendardVariable.subset.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; }
@font-face { font-family: "ANZ Nav Sans T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/Inter-cyrillic-ext.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "ANZ Nav Sans T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/Inter-vietnamese.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: "ANZ Nav Sans T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/NotoSansThai-thai.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; unicode-range: U+02D7, U+0303, U+0331, U+0E01-0E5B, U+200C-200D, U+25CC; }
@font-face { font-family: "ANZ Nav Sans T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/NotoSansArabic-arabic.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC; }
@font-face { font-family: "ANZ Nav Sans T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/Inter-cyrillic.woff2) format("woff2"); font-weight: 45 920; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "ANZ Nav Noto T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/mainpage/fonts/NotoSansKR-Variable.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; }
@font-face { font-family: "ANZ Nav Noto T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/Inter-cyrillic-ext.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "ANZ Nav Noto T"; src: url(https://channel-static.rebeauty.co.kr/anzclinic/_anz/fonts/i18n/Inter-cyrillic.woff2) format("woff2"); font-weight: 100 900; font-style: normal; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }

/* 아임웹 헤더(PC 90 · 모바일 48)와 둥근 빠른 버튼(TOP·전화·오시는길·블로그·예약)은 끄고, 헤더 자리는 .anz-nav-sp 가 새 헤더 높이만큼 잡는다 */
#doz_header_wrap, #dwellFloatingSystem { display: none !important; }

.anz-nav {
  --ink: #000; --body: #525257; --brown-deep: #48321f; --brown: #70573d; --gold: #b6946e;
  --surface: #f8f8fa; --line: #dcdce1; --control: #85858d; --pad: 20px;
  --sans: "ANZ Nav Sans", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "ANZ Nav Noto", sans-serif;
  --noto: "ANZ Nav Noto", "ANZ Nav Sans", sans-serif;
  font-family: var(--sans); font-size: 16px; font-weight: 400; line-height: normal; letter-spacing: normal; text-align: start;
  color: var(--body); -webkit-font-smoothing: antialiased; word-break: keep-all;
}
/* main.css 기본값 + 아임웹(bootstrap·tailwind·사이트 CSS) 기본값 되돌리기 — 메인과 계산된 스타일을 요소마다 맞춰 본 결과 */
.anz-nav *, .anz-nav *::before, .anz-nav *::after { box-sizing: border-box; }
.anz-nav, .anz-nav * { transition: initial; }   /* 아임웹: 링크 등에 0.3초 전환 — 메인에는 없다 (글자 맞춤이 전환 중간 크기를 재는 일도 막는다) */
.anz-nav { -webkit-tap-highlight-color: initial; } .anz-nav * { -webkit-tap-highlight-color: inherit; }   /* 아임웹은 누를 때 표시를 끈다 — 메인은 기기 기본 */
html .anz-nav :is(span, a) { text-rendering: auto; }   /* 아임웹 site.css: 사파리에서 .is-safari span, a 를 optimizeSpeed(자간·합자 끔) — 메인에는 없다 */
.anz-nav a, .anz-nav a:hover, .anz-nav a:focus { color: inherit; text-decoration: none; }
.anz-nav img { display: block; max-width: 100%; border: 0; vertical-align: baseline; }
.anz-nav button, .anz-nav input { font: inherit; color: inherit; letter-spacing: inherit; margin: 0; }
.anz-nav button { cursor: pointer; background: none; border: 0; border-radius: 0; padding: 0; text-transform: none; text-align: center; -webkit-appearance: auto; appearance: auto; }
.anz-nav input[type="checkbox"] { margin: 3px 3px 3px 4px; }
.anz-nav label { display: inline; width: auto; max-width: none; margin: 0; font-weight: inherit; color: inherit; }
.anz-nav i { display: inline; }
.anz-nav strong { font-weight: 700; }
.anz-nav form { margin: 0; }
.anz-nav svg { fill: currentColor; }
.anz-nav-sp { height: 72px; }
@media (max-width: 1023px) { .anz-nav .pc { display: none !important; } }
@media (min-width: 1024px) { .anz-nav .mo { display: none !important; } }

/* 단추 */
.anz-nav .btn {
  display: inline-flex; align-items: center; justify-content: center; margin: 0; padding: 0; border: 0; border-radius: 0;
  font-family: var(--sans); font-weight: 500; color: var(--ink); vertical-align: baseline;
  cursor: pointer; white-space: nowrap; user-select: auto; box-shadow: none; background-image: none; touch-action: auto;
}
.anz-nav a.btn { text-align: inherit; letter-spacing: inherit; }
.anz-nav .btn-gold { background: var(--gold); color: #fff; }
.anz-nav .btn { transition: background-color .15s cubic-bezier(.33,1,.68,1); }
@media (hover: hover) {
  .anz-nav .btn-gold:hover { background-color: #a88661; color: #fff; }
  .anz-nav .fc-submit:hover { background-color: #a88661; color: #fff; }
}
.anz-nav .btn-gold:active, .anz-nav .btn-gold.is-pressed { background-color: #967650; }
.anz-nav :is(.btn, .qi, .hd-menu, .hd-lang) { -webkit-tap-highlight-color: transparent; }
.anz-nav .fc-submit:active { background-color: #967650; box-shadow: none; }

/* ---------- 헤더 ---------- */
.anz-nav .hd {
  position: fixed; z-index: 1040; top: 0; left: 0; right: 0; height: 72px;
  display: flex; align-items: center; padding: 0 var(--pad); background: var(--surface); color: var(--gold);
}
.anz-nav .hd-logo { display: block; width: 201.934px; height: 32px; }
.anz-nav .logo-v { position: relative; display: block; width: 201.934px; height: 32px; }
.anz-nav .hd-nav, .anz-nav .hd-badge { display: none; }
.anz-nav .hd-right { margin-left: auto; display: flex; align-items: center; }
.anz-nav .hd-lang {
  display: flex; align-items: flex-start; gap: 0; width: 44px; height: 44px; padding: 0 0 0 2px;
  font-weight: 600; font-size: 12px; line-height: 1; color: inherit;
}
.anz-nav .hd-lang > span:not(.ico) { width: 16px; margin-top: 14px; }
.anz-nav .hd-lang .ico { margin-top: 11.54px; }
.anz-nav .hd-langs { position: absolute; z-index: 50; min-width: 176px; padding: 6px; border-radius: 12px; background: #fff; box-shadow: 0 8px 24px rgba(0,0,0,.14); }
.anz-nav .hd-langs[hidden] { display: none; }
.anz-nav .hd-langs a { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 8px; font-size: 14px; line-height: 1.4; color: var(--ink); white-space: nowrap; }
.anz-nav .hd-langs img { flex: none; width: 20px; height: 20px; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 1px rgba(0,0,0,.08); }
.anz-nav .hd-langs a:hover { background: var(--surface); }
.anz-nav .hd-langs a.is-on { background: #f4eee6; font-weight: 600; color: var(--brown-deep); }
.anz-nav .hd-menu { position: relative; width: 36px; height: 36px; margin-left: 14px; }
.anz-nav .hd-menu i { position: absolute; left: 7px; width: 22px; height: 1.5px; background: currentColor; }
.anz-nav .hd-menu i:nth-child(1) { top: 11px; } .anz-nav .hd-menu i:nth-child(2) { top: 17px; } .anz-nav .hd-menu i:nth-child(3) { top: 23px; }

/* 모바일 메뉴 서랍: 오른쪽 40% */
.anz-nav .drawer { position: fixed; z-index: 1039; inset: 72px 0 0 0; }
.anz-nav .drawer[hidden] { display: none; }
.anz-nav .drawer-dim { position: absolute; inset: 0; background: rgba(0,0,0,.4); opacity: 0; transition: opacity .3s; }
.anz-nav .drawer-panel {
  position: absolute; top: 0; right: 0; bottom: 0; width: 40%; min-width: 150px; overflow-y: auto;
  display: flex; flex-direction: column; padding: 8px 18px 16px; background: #fff; box-shadow: -8px 0 24px rgba(0,0,0,.08);
  transform: translateX(100%); transition: transform .35s cubic-bezier(.33,1,.68,1);
}
.anz-nav .drawer.is-open .drawer-dim { opacity: 1; }
.anz-nav .drawer.is-open .drawer-panel { transform: none; }
.anz-nav .drawer a { color: var(--ink); }
.anz-nav .dr-it { border-bottom: 1px solid var(--line); }
.anz-nav .dr-tg { display: flex; align-items: center; gap: 2px; width: 100%; padding: 14px 0; font-weight: 600; font-size: 15px; line-height: 1.4; color: var(--gold); text-align: left; white-space: nowrap; }
.anz-nav .dr-tg > span:not(.ico) { flex: 1 1 auto; min-width: 0; }
.anz-nav .dr-tg .ico { margin-right: -6px; transition: transform .25s cubic-bezier(.33,1,.68,1); }
.anz-nav .dr-tg[aria-expanded="true"] .ico { transform: rotate(180deg); }
.anz-nav .dr-sub { padding: 0 0 10px 8px; }
.anz-nav .dr-sub[hidden] { display: none; }
.anz-nav .dr-sub a { display: block; padding: 7px 0; font-weight: 400; font-size: 14px; line-height: 1.4; color: #212121; }

/* ---------- 모바일 하단 바 · 맨 위로 (메인은 첫 화면 바가 화면을 벗어나면 붙는다 — 하위 페이지는 처음부터) ---------- */
.anz-nav .qbar {
  position: fixed; z-index: 1030; left: 0; right: 0; bottom: 0; height: 73px;
  display: flex; align-items: center; justify-content: space-between; padding: 10px var(--pad);
  background: #fff; box-shadow: 0 -4px 16px rgba(0,0,0,.06);
}
.anz-nav .qbar .btn { width: 129px; height: 44px; align-items: flex-start; padding-top: 14px; font-size: 13px; line-height: 1; }
.anz-nav .qi { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; width: 39px; height: 53px; font-weight: 500; font-size: 11px; line-height: 1; white-space: nowrap; }
.anz-nav .qi:last-child { width: 48px; }
.anz-nav .qi .ico { margin-left: 1.5px; }
.anz-nav .qi:last-child .ico { margin-left: 6px; }
.anz-nav .qi .qi-phone { color: var(--gold); }
.anz-nav .to-top {
  position: fixed; z-index: 1031; right: 20px; bottom: 88px; width: 36px; height: 36px; border-radius: 50%;
  background: #fff; color: var(--brown); display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
}
@media (max-width: 1023px) { body { padding-bottom: 73px !important; } }

/* ---------- 떠 있는 상담창 / 빠른 메뉴 (PC) ---------- */
.anz-nav .float-consult, .anz-nav .quick { display: none; }
.anz-nav .hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.anz-nav .fc-head strong.is-err { color: #a3332a; }
.anz-nav .float-consult input::placeholder { color: var(--body); opacity: 1; }
.anz-nav .fc-agree input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.anz-nav .fc-agree input:checked + i { background: var(--gold) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3.2L15 7' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") center / 100%; box-shadow: none; }

@media (min-width: 1024px) {
  .anz-nav-sp { height: 78px; }
  /* 헤더: 로고·메뉴·언어·배지 (1280 에서 시안 위치) */
  .anz-nav .hd { top: 0; height: 78px; padding: 0 72px; justify-content: space-between; align-items: flex-start; }
  .anz-nav .hd-logo { margin-top: 23px; }
  .anz-nav .hd-nav { display: flex; gap: 24px; margin-top: 30.5px; }
  .anz-nav .hd-it { position: relative; padding-bottom: 30.5px; margin-bottom: -30.5px; }
  .anz-nav .hd-it > a { display: block; height: 17px; font-weight: 600; font-size: 14.2222px; line-height: 1; white-space: nowrap; }
  .anz-nav .hd-it:nth-child(1) > a { width: 78px; } .anz-nav .hd-it:nth-child(2) > a { width: 37px; } .anz-nav .hd-it:nth-child(3) > a { width: 96px; }
  .anz-nav .hd-it:nth-child(4) > a { width: 62px; } .anz-nav .hd-it:nth-child(5) > a { width: 59px; } .anz-nav .hd-it:nth-child(6) > a { width: 66px; }
  .anz-nav .hd-it:nth-child(7) > a { width: 50px; }
  .anz-nav .hd-it > a:hover { opacity: .75; }
  .anz-nav .hd-sub { display: none; position: absolute; top: 100%; left: -20px; min-width: 160px; background: #fff; border-radius: 3px; box-shadow: 0 6px 12px rgba(0,0,0,.176); }
  .anz-nav .hd-it:hover > .hd-sub, .anz-nav .hd-it:focus-within > .hd-sub { display: block; }
  .anz-nav .hd-sub a { display: block; padding: 10px 20px; font-weight: 400; font-size: 13px; line-height: 18.5714px; color: #212121; white-space: nowrap; }
  .anz-nav .hd-sub a:hover { color: var(--gold); }
  .anz-nav .hd-right { margin-left: 0; align-items: flex-start; gap: 47.7087px; }
  .anz-nav .hd-lang { margin: 17px 0 0; width: 48px; padding: 0 0 0 6px; gap: 0; align-items: flex-start; }
  .anz-nav .hd-lang > span:not(.ico) { width: 16px; margin-top: 16px; }
  .anz-nav .hd-lang .ico { margin-top: 13.53px; }
  .anz-nav .hd-badge { display: flex; align-items: flex-start; gap: 4.93px; width: 150.94px; margin-top: 21px; }
  .anz-nav .hd-badge img { width: 36px; height: 36px; }
  .anz-nav .hd-badge span { margin-top: 1px; font-weight: 600; font-size: 12px; line-height: 1.4; white-space: nowrap; }
  .anz-nav .hd-menu { display: none; }

  .anz-nav .float-consult {
    position: fixed; z-index: 1030; left: 72px; bottom: 64.57px; width: 266px; height: 149.66px; display: flex; flex-direction: column; gap: 8.89px;
    padding: 14.21px 16px 0; background: #fff; filter: drop-shadow(0px 8.889px 12.44px rgba(168,137,95,0.15));
  }
  .anz-nav .fc-head { display: flex; justify-content: space-between; align-items: flex-start; height: 15px; font-family: var(--noto); }
  .anz-nav .fc-head strong { font-size: 12.4444px; line-height: 1; }
  .anz-nav .fc-close { width: 10px; margin-top: .5px; font-family: var(--noto); font-size: 11.5556px; line-height: 1; text-align: left; }
  .anz-nav .fc-row { position: static; display: flex; align-items: flex-start; gap: 3.55px; height: 34px; }
  .anz-nav .fc-row input { height: 34px; min-width: 0; padding: 0 0 4px 10.65px; border: 0; border-radius: 0; background: var(--surface); box-shadow: none; outline-offset: 0; font-family: var(--noto); font-size: 10.6667px; line-height: 1; }
  .anz-nav .fc-row input:first-child { flex: 0 0 71.11px; height: 33.77px; padding-left: 10.66px; } .anz-nav .fc-row input:last-child { flex: 0 0 159px; }
  .anz-nav .fc-submit { height: 33.55px; align-items: flex-start; padding-top: 10px; background: var(--gold); color: #fff; font-size: 11.5556px; line-height: 1; }
  .anz-nav .fc-agree { position: relative; display: flex; align-items: flex-start; gap: 5.33px; height: 12px; font-family: var(--noto); font-size: 9.77778px; line-height: 1; cursor: pointer; }
  .anz-nav .fc-agree i { width: 11.55px; height: 11.55px; margin-top: .22px; border-radius: 1.778px; background: #fff; box-shadow: inset 0 0 0 .8889px var(--control); }
  .anz-nav .float-consult.is-closed { display: none; }

  .anz-nav .quick {
    position: fixed; z-index: 1030; right: 69.23px; bottom: 53.12px; width: 101.77px; height: 167.11px; display: flex; flex-direction: column;
    gap: 17.78px; padding: 8.87px 8.89px 0 8.88px; background: #fff;
  }
  .anz-nav .quick a { position: relative; display: flex; align-items: flex-start; gap: 8px; height: 24px; font-family: var(--noto); font-weight: 700; font-size: 8.88889px; line-height: 1; white-space: nowrap; }
  .anz-nav .quick a > span:not(.ico) { margin-top: 6.5px; }
  .anz-nav .quick a + a::before { content: ""; position: absolute; left: 0; right: 0; top: -9.39px; border-top: 1px solid rgba(220,220,225,.3); }
  .anz-nav .quick .q-top { font-weight: 400; }
  .anz-nav .quick .q-top .ico { color: var(--brown); }
  .anz-nav .quick .q-phone { color: var(--brown); }
}
/* 1024~1279px: 메인은 화면 전체를 1280 기준으로 줄인다 (html zoom) — 하위 페이지는 이 요소들만 같은 배율로 */
@media (min-width: 1024px) and (max-width: 1055.98px) { .anz-nav > * { zoom: .8; } }
@media (min-width: 1056px) and (max-width: 1087.98px) { .anz-nav > * { zoom: .825; } }
@media (min-width: 1088px) and (max-width: 1119.98px) { .anz-nav > * { zoom: .85; } }
@media (min-width: 1120px) and (max-width: 1151.98px) { .anz-nav > * { zoom: .875; } }
@media (min-width: 1152px) and (max-width: 1183.98px) { .anz-nav > * { zoom: .9; } }
@media (min-width: 1184px) and (max-width: 1215.98px) { .anz-nav > * { zoom: .925; } }
@media (min-width: 1216px) and (max-width: 1247.98px) { .anz-nav > * { zoom: .95; } }
@media (min-width: 1248px) and (max-width: 1279.98px) { .anz-nav > * { zoom: .975; } }

/* ---------- 다른 언어 (html.anz-tr) — 메인 i18n.css 의 같은 규칙. 글 크기는 nav.js 가 칸에 맞춘다 ---------- */
html.anz-tr .anz-nav {
  --sans: "ANZ Nav Sans T", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "ANZ Nav Noto T", sans-serif;
  --noto: "ANZ Nav Noto T", "ANZ Nav Sans T", sans-serif;
}
@media (min-width: 1024px) {
  html.anz-tr .anz-nav .hd-it > a { width: auto !important; font-size: var(--nav-fs, 14.2222px); }
}
html.anz-tr .anz-nav :is(.quick a, .hd-badge, .qi, .btn) > * { min-width: 0; }
html.anz-tr .anz-nav :is(.drawer a, .dr-tg) { white-space: normal; }
html.anz-tr:is([lang="zh-CN"], [lang="zh-TW"], [lang="ja"]) .anz-nav, html.anz-tr:is([lang="zh-CN"], [lang="zh-TW"], [lang="ja"]) .anz-nav * { word-break: normal; }
html.anz-tr[lang="ja"] .anz-nav, html.anz-tr[lang="ja"] .anz-nav * { word-break: auto-phrase; }
html.anz-tr .anz-nav { overflow-wrap: break-word; }
html.anz-tr .anz-nav :is(.btn, .qi, .quick a > span:not(.ico)) { white-space: nowrap; overflow-wrap: normal; }
html.anz-tr .anz-nav .hd-lang { width: auto; }
html.anz-tr .anz-nav .hd-lang > span:not(.ico) { width: auto; white-space: nowrap; }