/* v4 메뉴 상태·터치 영역·스크롤 계약. 사진과 본문 디자인은 v3를 이어 쓴다. */
.skm-v3 .v2-header .header-inner { position: relative; }
.skm-v3 .v2-nav-group { position: static; }
.skm-v3 .v2-desktop-nav { gap: 12px; }
.skm-v3 .v2-nav-expand { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; }
.skm-v3 .v4-nav-chevron { display: block; width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; transition: transform .18s ease; }
.skm-v3 [aria-expanded="true"] > .v4-nav-chevron { transform: rotate(180deg); }
.skm-v3 .v2-mega {
  inset: 100% 0 auto auto;
  width: 760px;
  max-width: calc(100vw - 48px);
  display: grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 24px;
  padding: 24px;
  border-radius: 0 0 10px 10px;
}
.skm-v3 .v4-mega-content { min-width: 0; }
.skm-v3 .v2-mega-intro { min-width: 0; gap: 4px; }
.skm-v3 .v2-mega-intro .eyebrow { margin: 0; }
.skm-v3 .v2-mega-intro strong { font-size: 22px; }
.skm-v3 .v2-mega-intro > a { margin-top: 0; }
.skm-v3 .v4-mega-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; margin-top: 18px; }
.skm-v3 .v2-mega-column { min-width: 0; }
.skm-v3 .v2-mega a { font-size: 16px; min-height: 44px; align-items: center; }
.skm-v3 .v4-mega-visual { position: relative; align-self: start; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: 8px; background: #252d32; }
.skm-v3 .v4-mega-visual img { display: block; width: 100%; height: 100%; object-fit: contain; }
.skm-v3 .v4-mega-visual figcaption { position: absolute; inset: auto 0 0; padding: 10px 12px; background: linear-gradient(180deg, transparent, #11181de8); color: #f4f6f5; font-size: 11px; line-height: 1.45; }
.skm-v3 .v3-page-hero-media, .skm-v3 .v3-wide-photo picture { background: #e8e9e5; }
.skm-v3 .v3-tuning .v3-close-photo picture { background: #20272c; }
.skm-v3 .v3-page-hero-media img, .skm-v3 .v3-wide-photo img, .skm-v3 .v3-close-photo img { object-fit: contain; }
.skm-v3 .v2-mega[hidden], .skm-v3 .v2-drawer[hidden],
.skm-v3 .v4-fallback-nav[hidden], .skm-v3 .v4-drawer-group > [hidden] { display: none; }
.skm-v3 .v2-drawer {
  display: flex;
  flex-direction: column;
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  padding: 20px;
  overflow: hidden;
  box-sizing: border-box;
}
.skm-v3 .v2-drawer-top { flex: 0 0 auto; margin-bottom: 12px; }
.skm-v3 .v2-drawer-scroll { overflow-y: auto; overscroll-behavior: contain; flex: 1; min-height: 0; }
.skm-v3 .v4-drawer-group { border-bottom: 1px solid #ffffff25; }
.skm-v3 .v4-drawer-group > div:first-child { display: flex; gap: 8px; align-items: center; min-height: 62px; }
.skm-v3 .v4-drawer-group > div:first-child > a { flex: 1; min-width: 0; font-size: 17px; font-weight: 700; padding-block: 14px; text-decoration: none; }
.skm-v3 .v4-drawer-expand { flex: 0 0 44px; width: 44px; height: 44px; background: transparent; color: #f28a3b; border: 1px solid #62696d; border-radius: 6px; }
.skm-v3 .v4-drawer-group > div:not(:first-child) > a { display: flex; align-items: center; min-height: 44px; padding: 8px 14px; color: #d0d5d8; font-size: 16px; text-decoration: none; }
.skm-v3 .v2-drawer-contact { flex: 0 0 auto; margin-top: 16px; padding-bottom: env(safe-area-inset-bottom); }
.skm-v3 .v2-drawer-contact > a { flex: 1; padding-inline: 10px; }
.skm-v3 .v4-fallback-nav { padding: 12px max(20px, calc((100vw - 1280px) / 2)); background: #252d32; color: #fff; }
.skm-v3 .v4-fallback-nav summary { min-height: 44px; display: flex; align-items: center; cursor: pointer; }
.skm-v3 .v4-fallback-nav a { display: inline-flex; padding: 12px; min-height: 44px; align-items: center; font-size: 15px; }
/* 소수 CSS 픽셀에서도 JS의 min-width:1200px와 정확히 맞춘다. */
@media (width < 1200px) {
  .skm-v3 .v2-desktop-nav { display: none; }
  .skm-v3 .v2-drawer-toggle { display: flex; }
  .skm-v3 .v2-header-actions { margin-left: auto; }
  .skm-v3 .v2-contact-top.button { display: inline-flex; }
}
@media (max-width: 767px) {
  .skm-v3 .v2-contact-top.button { display: none; }
  .skm-v3 .v2-drawer { width: 100%; max-width: 420px; }
}
@media (prefers-reduced-motion: reduce) {
  .skm-v3 .v2-drawer, .skm-v3 .v2-mega, .skm-v3 .v4-nav-chevron { transition: none; }
}