/*
 * responsive.css — 시안 화면 공통 반응형 레이어 (v2 · 플랫폼형 최종 컨셉 반영)
 * 화면 파일의 스타일이 전부 인라인이라, 속성 선택자([style*=...])와 aria-label로 패턴을 잡아
 * 태블릿(≤1024px) · 모바일(≤768px) · 소형 모바일(≤480px)에서 레이아웃을 재배치합니다.
 * 데스크톱(>1024px)에서는 아무 영향이 없습니다.
 * 실제 개발로 옮길 때는 이 파일 대신 컴포넌트별 미디어쿼리/디자인 토큰으로 정리하세요.
 *
 * 구성
 *  1. 공통 안전장치
 *  2. 태블릿 이하 — 그리드 열 수 축소, 고정폭 사이드 컬럼 접기, 관리자/금손 센터 사이드바
 *  3. 모바일 — 헤더(GHeaderL 3단 · 구 Header 2단 · 기타), 본문 여백, 최종 컨셉 화면별 보정, 공통 패턴
 *  4. 소형 모바일 — 검색창 아이콘화, 간격 축소
 */

/* ---------- 1. 공통 안전장치 ---------- */
img, video, svg { max-width: 100%; }
img { height: auto; }
table { max-width: 100%; }

/* ---------- 2. 태블릿 이하 (≤1024px) ---------- */
@media (max-width: 1024px) {
  /* 그리드: 4열 → 2열, 5열 → 3열, 6열(빠른 안내) → 3열 */
  [style*="repeat(4, minmax(0, 1fr))"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [style*="repeat(5, minmax(0, 1fr))"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  [style*="repeat(6, minmax(0, 1fr))"] { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  [style*="repeat(8, minmax(0, 1fr))"] { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  [style*="repeat(10, minmax(0, 1fr))"] { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }

  /* 넓은 사이드 컬럼(곧 열리는 작품 380px · 커뮤니티 소식 340px · 공방 목록 400px · 정산 미리보기 320px) → 본문 아래로 */
  [style*="flex: 0 0 380px"], [style*="flex: 0 0 340px"], [style*="flex: 0 0 320px"] {
    flex: 1 1 100% !important; width: auto !important; max-width: none !important; min-width: 0 !important;
    border-left: 0 !important; padding-left: 0 !important; position: static !important;
  }
  div:has(> [style*="flex: 0 0 380px"]), div:has(> [style*="flex: 0 0 340px"]), div:has(> [style*="flex: 0 0 320px"]), div:has(> [style*="flex: 0 0 300px"]),
  form:has(> [style*="flex: 0 0 320px"]), section:has(> [style*="flex: 0 0 380px"]), section:has(> [style*="flex: 0 0 320px"]) { flex-wrap: wrap !important; }
  aside[aria-labelledby="g-pre"] { border-top: 1px solid #EEEEEE; padding-top: 32px !important; }

  /* 관리자(스튜디오·운영) 레이아웃: 사이드바 + 본문 → 세로 쌓기 */
  [style*="min-height: 1100px"][style*="display: flex"] { flex-direction: column !important; min-height: 0 !important; }
  [style*="flex: 0 0 240px"] { flex: 0 0 auto !important; width: 100% !important; }
  aside[aria-label="관리자 메뉴"] {
    width: 100% !important; min-height: 0 !important;
    padding: 16px !important; gap: 14px !important;
    border-right: 0 !important; border-bottom: 1px solid #EBEBEB;
  }
  aside[aria-label="관리자 메뉴"] > div:first-child { flex-direction: row !important; align-items: center; gap: 12px !important; }
  aside[aria-label="관리자 메뉴"] > div:first-child img { height: 30px !important; }
  aside[aria-label="관리자 메뉴"] nav {
    flex-direction: row !important; flex-wrap: nowrap !important; gap: 4px !important;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
    margin: 0 -16px; padding: 0 16px;
  }
  aside[aria-label="관리자 메뉴"] nav::-webkit-scrollbar { display: none; }
  aside[aria-label="관리자 메뉴"] nav > * { flex: 0 0 auto !important; white-space: nowrap; }
  aside[aria-label="관리자 메뉴"] > *:not(:first-child):not(nav) { display: none !important; }
  main[style*="padding: 32px 40px 48px"] { padding: 20px 16px 40px !important; }

  /* 금손 센터(PSell · GSell): 왼쪽 메뉴 → 위쪽 가로 스크롤 탭 */
  div:has(> nav[aria-label="금손 센터 메뉴"]), div:has(> dc-c > nav[aria-label="금손 센터 메뉴"]) { flex-direction: column !important; }
  nav[aria-label="금손 센터 메뉴"] {
    flex: 0 0 auto !important; min-height: 0 !important; width: 100%; box-sizing: border-box;
    flex-direction: row !important; gap: 4px !important; padding: 8px 12px !important;
    border-right: 0 !important; border-bottom: 1px solid #EAEDEF;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  nav[aria-label="금손 센터 메뉴"]::-webkit-scrollbar { display: none; }
  nav[aria-label="금손 센터 메뉴"] > * { flex: 0 0 auto !important; white-space: nowrap; }
  nav[aria-label="금손 센터 메뉴"] ~ main[style*="padding: 32px 40px"], dc-c:has(> nav[aria-label="금손 센터 메뉴"]) ~ main[style*="padding: 32px 40px"] { padding: 24px 16px 40px !important; }
  nav[aria-label="금손 센터 메뉴"] > div[style*="margin-top: auto"], nav[aria-label="금손 센터 메뉴"] > a[style*="height: 40px"] { display: none !important; }
}

/* ---------- 3. 모바일 (≤768px) ---------- */
@media (max-width: 768px) {
  /* 안전장치: 헤더 행은 각자 가로 스크롤, 문서 자체는 가로 스크롤 없음 */
  html, body { overflow-x: hidden; }
  header div[style*="max-width: 1"][style*="display: flex"], header nav[style*="max-width: 1"][style*="display: flex"],
  header nav[style*="height: 48px"][style*="display: flex"] {
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding-left: 16px !important; padding-right: 16px !important;
  }
  header div[style*="max-width: 1"][style*="display: flex"]::-webkit-scrollbar, header nav[style*="max-width: 1"]::-webkit-scrollbar { display: none; }
  header div[style*="max-width: 1"][style*="display: flex"] > * { flex-shrink: 0; }
  header div[style*="max-width: 1"][style*="display: flex"] > form[role="search"] { flex-shrink: 1; }
  /* 정렬·개수 표시 행, 에디토리얼 2단 그리드 */
  span[style*="display: flex; align-items: center; gap: 14px; font-size: 14px"] { flex-wrap: wrap; }
  [style*="grid-template-columns: 150px 1fr"] { grid-template-columns: 1fr !important; }
  /* --- 헤더 A: 플랫폼형 3단 헤더 (GHeaderL · 1256px 컨테이너) --- */
  /* 1단(40px 유틸 바): 왼쪽 브랜드 문구는 숨기고 오른쪽 링크만 */
  header > div[style*="max-width: 1256px"][style*="height: 40px"] { height: 34px !important; padding: 0 16px !important; font-size: 11px !important; }
  header > div[style*="max-width: 1256px"][style*="height: 40px"] > span:first-child { display: none !important; }
  header > div[style*="max-width: 1256px"][style*="height: 40px"] > span:last-child { margin-left: auto; gap: 10px !important; }
  header > div[style*="max-width: 1256px"][style*="height: 40px"] a[href="Login.html"] { height: 24px !important; padding: 0 8px !important; }
  /* 2단(64px): 로고 · 검색 · 장바구니를 한 줄에, 주 카테고리는 다음 줄로 */
  header > div[style*="max-width: 1256px"][style*="height: 64px"] {
    height: auto !important; min-height: 56px; padding: 10px 16px 8px !important;
    flex-wrap: wrap !important; gap: 8px 12px !important;
  }
  header > div[style*="max-width: 1256px"][style*="height: 64px"] img[alt="GEUMSON SIGNAL"] { height: 28px !important; }
  header > div[style*="max-width: 1256px"][style*="height: 64px"] nav[aria-label="주 카테고리"] {
    order: 3; flex: 1 1 100% !important; gap: 18px !important; font-size: 17px !important; padding-top: 2px;
  }
  header > div[style*="max-width: 1256px"][style*="height: 64px"] form[role="search"] {
    flex: 1 1 auto !important; width: auto !important; min-width: 0; height: 36px !important; padding: 0 12px !important;
  }
  header > div[style*="max-width: 1256px"][style*="height: 64px"] form[role="search"] input { font-size: 12px !important; }
  /* 3단(54px 서브 메뉴): 가로 스크롤 */
  header > div[style*="max-width: 1256px"][style*="height: 54px"] {
    height: 44px !important; padding: 0 16px !important; gap: 18px !important; font-size: 14px !important;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  header > div[style*="max-width: 1256px"][style*="height: 54px"]::-webkit-scrollbar { display: none; }
  header > div[style*="max-width: 1256px"][style*="height: 54px"] > * { flex: 0 0 auto; }

  /* --- 헤더 B: 구 마켓형 2단 헤더 (Header · 88px + 52px) --- */
  header > div[style*="height: 88px"] { height: 60px !important; gap: 10px !important; padding: 0 12px !important; }
  header > div[style*="height: 88px"] img[alt="GEUMSON SIGNAL"] { height: 32px !important; }
  header > div[style*="height: 88px"] form[role="search"] { flex: 1 1 auto !important; height: 36px !important; padding: 0 4px 0 12px !important; min-width: 0; }
  header > div[style*="height: 88px"] form[role="search"] input { font-size: 12px !important; }
  header > div[style*="height: 88px"] > div[style*="margin-left: auto"] { gap: 0 !important; }
  header > div[style*="height: 88px"] > div[style*="margin-left: auto"] a { width: 38px !important; }
  header > div[style*="height: 52px"] {
    height: 46px !important; gap: 12px !important; padding: 0 12px !important;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  header > div[style*="height: 52px"]::-webkit-scrollbar { display: none; }
  header > div[style*="height: 52px"] > span[aria-hidden="true"] { display: none !important; }
  header nav[aria-label="주 메뉴"] { flex-wrap: nowrap !important; gap: 0 18px !important; }
  header nav[aria-label="주 메뉴"] a { white-space: nowrap; font-size: 14px; }

  /* --- 헤더 C: 그 외 시안 헤더(GHeader · AHeader · CHeader · SHeader · LHeader) — 줄 높이 축소 + 가로 스크롤 --- */
  header div[style*="max-width: 1360px"], header div[style*="max-width: 1320px"], header div[style*="max-width: 1160px"],
  header div[style*="max-width: 1256px"][style*="height: 72px"], header div[style*="max-width: 1256px"][style*="height: 80px"],
  header nav[style*="max-width: 1360px"] {
    padding-left: 16px !important; padding-right: 16px !important; gap: 14px !important;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  header div[style*="height: 96px"], header div[style*="height: 84px"], header div[style*="height: 80px"], header div[style*="height: 72px"] { height: 60px !important; }
  header div[style*="height: 84px"][style*="display: grid"] { display: flex !important; align-items: center; gap: 16px; }
  header div[style*="max-width: 1360px"] form, header div[style*="max-width: 1160px"] form, header div[style*="max-width: 1320px"] form,
  header div[style*="height: 72px"] form, header div[style*="height: 80px"] form { flex: 1 1 120px !important; width: auto !important; min-width: 0; }
  header div[style*="height: 72px"] nav[aria-label="주 카테고리"], header div[style*="height: 80px"] nav[aria-label="주 메뉴"] { gap: 16px !important; font-size: 16px !important; }
  header nav[aria-label="내 메뉴"] { gap: 12px !important; }
  header nav[aria-label="내 메뉴"] a { font-size: 11px !important; }
  header div[style*="height: 84px"] > div[style*="margin-left: auto"] a { padding: 0 8px !important; font-size: 13px; }
  /* B 라이프스타일형 상단 띠 배너: 줄바꿈 허용 */
  header > div[style*="background: #E8202A"][style*="height: 52px"] { height: auto !important; min-height: 44px; padding: 6px 12px; font-size: 12px !important; white-space: normal !important; text-align: center; }
  header > div[style*="background: #E8202A"][style*="height: 52px"] a { white-space: normal !important; }
  header div[aria-label="실시간 인기 검색어"], header div[aria-label="인기 검색어"] { display: none !important; }
  header img[alt="GEUMSON SIGNAL"] { height: 28px !important; }

  /* --- 본문 여백 --- */
  main[style*="max-width: 1256px"], main[style*="max-width: 1280px"], main[style*="max-width: 1160px"], main[style*="max-width: 1360px"], main[style*="max-width: 1320px"] {
    padding-left: 16px !important; padding-right: 16px !important;
  }
  main[style*="padding: 32px 4%"], main[style*="padding: 40px 4%"], main[style*="padding: 24px 4%"], main[style*="padding: 48px 4%"], main[style*="padding: 56px 4%"] { padding-left: 16px !important; padding-right: 16px !important; }
  main[style*="padding: 40px 4% 0"] { padding-top: 24px !important; }
  main[style*="padding: 64px 6%"] { padding: 32px 16px !important; }
  main[style*="gap: 56px"], main[style*="gap: 48px"], main[style*="gap: 40px"] { gap: 24px !important; }
  footer > div[style*="padding: 40px 4%"] { padding: 32px 16px 40px !important; }
  [style*="padding-top: 80px"] { padding-top: 40px !important; }
  [style*="padding-top: 72px"] { padding-top: 36px !important; }
  [style*="padding-top: 56px"] { padding-top: 32px !important; }
  [style*="margin-top: 64px"] { margin-top: 36px !important; }

  /* --- 스토어 홈(GMainP · index): 컬러 배너 — 가운데 한 장만 화면 폭에 맞춰 --- */
  section[aria-label="기획 배너"] { height: 240px !important; margin-top: 12px !important; }
  section[aria-label="기획 배너"] > a[aria-hidden="true"] { display: none !important; }
  section[aria-label="기획 배너"] > a[style*="left: 50%"] {
    left: 16px !important; right: 16px !important; width: auto !important; height: 100% !important; margin-left: 0 !important; border-radius: 12px !important;
  }
  section[aria-label="기획 배너"] .g-fade { padding: 0 20px !important; gap: 8px !important; max-width: 70% !important; }
  section[aria-label="기획 배너"] .g-fade span[style*="font-size: 30px"] { font-size: 19px !important; }
  section[aria-label="기획 배너"] .g-fade span[style*="margin-top: 14px"] { margin-top: 6px !important; font-size: 13px !important; }
  section[aria-label="기획 배너"] div[aria-hidden="true"][style*="width: 470px"] {
    right: -120px !important; transform: scale(.5); transform-origin: right center; opacity: .9;
  }
  section[aria-label="기획 배너"] > div[style*="margin-left: 380px"] { left: auto !important; right: 28px !important; margin-left: 0 !important; bottom: 12px !important; }
  /* 카테고리 원형 아이콘 한 줄: 가로 스크롤 */
  nav[aria-label="카테고리"][style*="justify-content: center"] {
    justify-content: flex-start !important; gap: 18px !important; padding: 24px 0 0 !important;
    overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  nav[aria-label="카테고리"][style*="justify-content: center"]::-webkit-scrollbar { display: none; }
  nav[aria-label="카테고리"][style*="justify-content: center"] > * { flex: 0 0 auto; }
  /* 빠른 안내 6칸 → 3칸 (태블릿 규칙 상속), 인기 작품 3열 → 2열 */
  nav[aria-label="빠른 안내"] { gap: 8px !important; padding-top: 12px !important; }
  /* 둥근 플랫폼 카드 간격 축소 */
  [style*="gap: 40px 18px"], [style*="gap: 40px 16px"], [style*="gap: 36px 16px"], [style*="gap: 32px 12px"] { gap: 24px 12px !important; }

  /* --- 카테고리(PCategory): 왼쪽 카테고리 목록 → 상단 가로 칩 --- */
  aside[aria-label="카테고리 목록"] { position: static !important; gap: 12px !important; min-width: 0 !important; width: 100% !important; box-sizing: border-box; }
  aside[aria-label="카테고리 목록"] > ul { min-width: 0; max-width: 100%; box-sizing: border-box; flex-direction: row !important; flex-wrap: nowrap; gap: 4px !important; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 6px !important; }
  aside[aria-label="카테고리 목록"] > ul::-webkit-scrollbar { display: none; }
  aside[aria-label="카테고리 목록"] > ul > li { flex: 0 0 auto; }
  aside[aria-label="카테고리 목록"] > ul button { white-space: nowrap !important; }
  aside[aria-label="카테고리 목록"] > a.p-soft { display: none !important; }

  /* --- 작품 상세(PProduct): 이미지 + 정보 2단 → 세로 --- */
  section[aria-labelledby="pp-name"] { flex-wrap: wrap !important; gap: 20px !important; }
  section[aria-labelledby="pp-name"] > div { flex: 1 1 100% !important; }
  section[aria-labelledby="pp-name"] h1 { font-size: 22px !important; }
  section[aria-labelledby="pp-name"] b[style*="font-size: 32px"] { font-size: 26px !important; }
  section[aria-labelledby="pp-world"] { flex-wrap: wrap !important; padding: 20px 16px !important; gap: 16px !important; }
  section[aria-labelledby="pp-world"] > a.p-card { flex: 1 1 100% !important; aspect-ratio: 16 / 9 !important; }
  dl[style*="grid-template-columns: 160px 1fr 160px 1fr"] { grid-template-columns: 110px 1fr !important; }

  /* --- 작가 상세(PArtist): 영상 + 소개 2단 → 세로 --- */
  section[aria-labelledby="pa-name"] { flex-wrap: wrap !important; }
  section[aria-labelledby="pa-name"] > a.p-card { flex: 1 1 100% !important; height: 220px !important; }
  section[aria-labelledby="pa-name"] > div { flex: 1 1 100% !important; padding: 20px !important; }
  section[aria-labelledby="pa-studio"], section[aria-labelledby="ps-soon"] { flex-wrap: wrap !important; padding: 20px 16px !important; gap: 14px !important; }

  /* --- 금손 공방(PStudio): 목록 + 지도 → 지도 위, 목록 아래 --- */
  div:has(> section[aria-label="공방 목록"]) { flex-direction: column !important; height: auto !important; }
  section[aria-label="공방 목록"] { flex: 0 0 auto !important; order: 2; border-right: 0 !important; max-height: 420px; }
  section[aria-label="공방 목록"] > ul.gs-list { max-height: 360px; }
  section[aria-label="지도"] { flex: 0 0 360px !important; order: 1; border-bottom: 1px solid #EAEDEF; }
  section[aria-label="지도"] > div[style*="max-width: 520px"] { left: 12px !important; right: 12px !important; bottom: 12px !important; padding: 12px !important; }

  /* --- 금손 이야기(PStories): 히어로 가로 카드 → 세로 --- */
  a.p-card[style*="height: 380px"] { flex-direction: column !important; height: auto !important; }
  a.p-card[style*="height: 380px"] > span:first-child { flex: 0 0 auto !important; aspect-ratio: 16 / 9; }
  a.p-card[style*="height: 380px"] > *:not(:first-child) { padding: 20px !important; }

  /* --- 금손 센터(PSell): 입력 폼 + 정산 미리보기 세로 (태블릿 규칙 상속) --- */
  aside[aria-labelledby="gs-calc"] { position: static !important; }

  /* --- 공통: 고정폭 사이드 컬럼(필터·마이페이지 메뉴·상세 우측 패널 등) → 전체 폭 --- */
  [style*="flex: 0 0 200px"], [style*="flex: 0 0 210px"], [style*="flex: 0 0 220px"], [style*="flex: 0 0 280px"],
  [style*="flex: 0 0 300px"], [style*="flex: 0 0 360px"], [style*="flex: 0 0 400px"] {
    flex: 1 1 100% !important; width: auto !important; max-width: none !important; min-width: 0 !important;
  }
  [style*="flex: 1 1 380px"], [style*="flex: 0 1 380px"], [style*="flex: 1.4 1 480px"], [style*="flex: 1.3 1 480px"], [style*="flex: 1.1 1 480px"],
  [style*="flex: 1 1 640px"], [style*="flex: 1 1 600px"], [style*="flex: 1 1 560px"], [style*="flex: 1.4 1 560px"], [style*="flex: 1 1 520px"], [style*="flex: 2 1 520px"] { flex-basis: 100% !important; min-width: 0 !important; }
  [style*="position: sticky"] { position: static !important; }

  /* 필터 사이드(아티스트·스토어): 가로 칩 형태로 접기 */
  aside[aria-label="필터"] { gap: 16px !important; padding-bottom: 20px; border-bottom: 1px solid #EEEEEE; }
  aside[aria-label="필터"] > div { gap: 8px !important; }
  aside[aria-label="필터"] label[style*="height: 36px"], aside[aria-label="필터"] label[style*="height: 32px"] { height: 30px !important; }
  aside[aria-label="필터"] fieldset[style*="flex-direction: column"] { flex-direction: row !important; flex-wrap: wrap; gap: 6px 18px !important; padding-bottom: 16px !important; }
  aside[aria-label="필터"] fieldset[style*="flex-direction: column"] > legend { width: 100%; margin-bottom: 8px !important; }
  aside[aria-label="필터"] label[style*="justify-content: space-between"] { justify-content: flex-start !important; gap: 6px; }

  /* 마이페이지 메뉴(PMyNav): 프로필 카드 숨기고 그룹별 가로 칩 */
  aside[aria-label="마이페이지 메뉴"] > div[style*="background: #F5F6F8"] { display: none !important; }
  aside[aria-label="마이페이지 메뉴"] nav[aria-label="마이페이지 하위 메뉴"] { flex-direction: row !important; flex-wrap: wrap; gap: 8px 20px !important; }
  aside[aria-label="마이페이지 메뉴"] nav[aria-label="마이페이지 하위 메뉴"] > div { flex-direction: row !important; flex-wrap: wrap; align-items: center; gap: 2px 10px !important; }
  aside[aria-label="마이페이지 메뉴"] nav[aria-label="마이페이지 하위 메뉴"] > div > span:first-child { width: 100%; padding: 0 !important; }
  aside[aria-label="마이페이지 메뉴"] nav[aria-label="마이페이지 하위 메뉴"] a { margin: 0 !important; padding: 0 10px !important; min-height: 32px !important; border: 1px solid #E5E7EB; gap: 6px; white-space: nowrap; font-size: 14px !important; }
  /* 마이페이지 메뉴: 그룹별 가로 배치 */
  aside[aria-label="마이페이지 메뉴"] { width: 100% !important; gap: 16px !important; padding-bottom: 16px; border-bottom: 1px solid #EEEEEE; }
  aside[aria-label="마이페이지 메뉴"] a[style*="font-size: 28px"] { font-size: 22px !important; }
  aside[aria-label="마이페이지 메뉴"] nav { gap: 10px !important; }
  aside[aria-label="마이페이지 메뉴"] nav > div { flex-direction: row !important; flex-wrap: wrap; align-items: center; gap: 2px 14px !important; }
  aside[aria-label="마이페이지 메뉴"] nav > div > span:first-child { padding: 0 !important; flex: 0 0 auto; min-width: 32px; }
  aside[aria-label="마이페이지 메뉴"] nav > div > a { min-height: 36px !important; white-space: nowrap; }

  /* 2단(목록+상세, 캘린더+패널 등) 플렉스 컨테이너는 줄바꿈 허용 */
  div:has(> [style*="flex: 0 0 200px"]), div:has(> [style*="flex: 0 0 220px"]), div:has(> dc-c > [style*="flex: 0 0 220px"]), div:has(> dc-c > [style*="flex: 0 0 210px"]),
  div:not([style*="min-height: 1100px"]):has(> [style*="flex: 0 0 240px"]),
  div:has(> [style*="flex: 0 0 280px"]), div:has(> [style*="flex: 0 0 300px"]), div:has(> [style*="flex: 0 0 360px"]),
  section:has(> [style*="flex: 0 0 280px"]), section:has(> [style*="flex: 0 0 300px"]),
  main:has(> [style*="flex: 0 0 300px"]), div:has(> [style*="flex: 0 1 380px"]) { flex-wrap: wrap !important; }
  /* 제목 + 탭/버튼 묶음 행: 제목이 한 줄을 차지하고 버튼은 아래로 */
  div[style*="display: flex"]:not([style*="flex-direction: column"]):has(> h1) { flex-wrap: wrap !important; }
  div[style*="display: flex"]:not([style*="flex-direction: column"]) > h1 { flex: 1 1 100% !important; }
  div[style*="display: flex"]:not([style*="flex-direction: column"]):has(> div > h1) { flex-wrap: wrap !important; }
  /* 탭 목록(밑줄형): 가로 스크롤 */
  div[role="tablist"][style*="gap: 28px"], div[role="tablist"][style*="gap: 32px"],
  div[style*="border-bottom"][style*="gap: 28px"], div[style*="border-bottom"][style*="gap: 32px"], div[style*="border-bottom"][style*="gap: 36px"] {
    gap: 20px !important; overflow-x: auto; flex-wrap: nowrap !important; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  div[role="tablist"]::-webkit-scrollbar, div[style*="border-bottom"][style*="gap: 36px"]::-webkit-scrollbar { display: none; }
  div[role="tablist"] > *, div[style*="border-bottom"][style*="gap: 36px"] > * { white-space: nowrap !important; flex: 0 0 auto; }
  div[role="tablist"] { max-width: 100%; overflow-x: auto; flex-wrap: nowrap !important; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  /* width:100% + padding 조합의 박스 넘침 방지 */
  main [style*="width: 100%"][style*="padding"]:not([style*="box-sizing"]) { box-sizing: border-box !important; }

  /* 띠 배너(고정 높이 + 좌우 2단): 높이 자동, 글자 축소 */
  a[style*="height: 200px"][style*="overflow: hidden"] { height: auto !important; min-height: 160px; flex-wrap: wrap; }
  a[style*="height: 200px"][style*="overflow: hidden"] > div:first-child { padding: 20px 16px !important; gap: 6px !important; flex: 1 1 100% !important; }
  a[style*="height: 200px"][style*="overflow: hidden"] span[style*="font-size: 28px"] { font-size: 20px !important; }
  a[style*="height: 200px"][style*="overflow: hidden"] > img { width: 50% !important; height: 120px !important; flex: 1 1 50%; }
  /* 후기 작성 등 가로 묶음 */
  div[style*="display: flex; align-items: center; gap: 24px"] { flex-wrap: wrap; gap: 12px 16px !important; }
  /* 초기 모바일 시안 프레임(390px 고정) */
  [style*="width: 390px"] { width: 100% !important; max-width: 390px; }

  /* 테이블: 가로 스크롤 */
  table[style*="width: 100%"] { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
  table[style*="width: 100%"] th, table[style*="width: 100%"] td { padding-left: 8px !important; padding-right: 8px !important; position: relative; }

  /* 3열 그리드 → 2열, 5열 → 2열, 6열 → 3열 유지 */
  [style*="repeat(3, minmax(0, 1fr))"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [style*="repeat(5, minmax(0, 1fr))"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  [style*="grid-template-columns: 2fr 1fr"], [style*="grid-template-columns: 6fr 5fr"], [style*="grid-template-columns: 5fr 7fr"], [style*="grid-template-columns: 5fr 6fr"] { grid-template-columns: 1fr !important; }
  /* 카드 자동 그리드: 모바일에서 2열 */
  [style*="repeat(auto-fill, minmax(2"], [style*="repeat(auto-fit, minmax(2"],
  [style*="repeat(auto-fill, minmax(190px"], [style*="repeat(auto-fit, minmax(190px"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 12px !important; }
  /* 7열(캘린더·요일): 글자 축소 */
  [style*="repeat(7, minmax(0, 1fr))"] { font-size: 11px; gap: 2px !important; }
  [style*="repeat(7, minmax(0, 1fr))"] > * { min-width: 0; padding: 4px !important; overflow: hidden; }

  /* 버튼·탭·칩 묶음은 줄바꿈 허용 */
  div[style*="display: flex; gap: 6px"], div[style*="display: flex; gap: 8px"], div[style*="display: flex; gap: 10px"],
  div[style*="display: flex; gap: 12px"], div[style*="display: flex; align-items: center; gap: 12px"],
  div[style*="display: flex; align-items: center; gap: 16px"] { flex-wrap: wrap; }
  div[style*="display: flex; gap: 16px; font-size: 12px"] { flex-wrap: wrap; gap: 8px 14px !important; }

  /* 검색 라벨 등 고정폭 입력 */
  label[style*="width: 280px"], label[style*="width: 240px"], label[style*="width: 220px"] { width: 100% !important; }

  /* 제목·큰 글자 */
  h1[style*="font-size: 24px"], h1[style*="font-size: 26px"], h1[style*="font-size: 28px"], h1[style*="font-size: 30px"], h1[style*="font-size: 32px"] { font-size: 22px !important; }
  h1[style*="font-size: 36px"], h1[style*="font-size: 40px"], h1[style*="font-size: 44px"], h1[style*="font-size: 48px"] { font-size: 28px !important; }
  h2[style*="font-size: 24px"], h2[style*="font-size: 26px"], h2[style*="font-size: 28px"] { font-size: 20px !important; }
  [style*="white-space: nowrap"] { white-space: normal !important; }
  header [style*="white-space: nowrap"], header > div[style*="white-space: nowrap"], header nav a, header a,
  aside[aria-label="관리자 메뉴"] nav > *, nav[aria-label="금손 센터 메뉴"] > *, td, th { white-space: nowrap !important; }
  td > div[style*="display: flex"], td > button[style*="display: flex"] { width: max-content; }

  /* 랜딩 히어로 텍스트(절대배치 고정폭) */
  div[style*="position: absolute; left: 40px; width: 360px"] { left: 16px !important; right: 16px !important; width: auto !important; bottom: 20px !important; }
  div[style*="position: absolute; left: 40px; width: 360px"] span[style*="font-size: 30px"] { font-size: 22px !important; }
}

/* ---------- 4. 소형 모바일 (≤480px) ---------- */
@media (max-width: 480px) {
  /* 구 2단 헤더: 검색창 아이콘만 */
  header > div[style*="height: 88px"] form[role="search"] input::placeholder { color: transparent; }
  header > div[style*="height: 88px"] form[role="search"] { flex: 0 0 36px !important; padding: 0 !important; background: transparent !important; justify-content: flex-end; }
  header > div[style*="height: 88px"] form[role="search"] input { width: 0 !important; flex: 0 0 0 !important; padding: 0 !important; opacity: 0; }
  header > div[style*="height: 88px"] > div[style*="margin-left: auto"] a { width: 36px !important; }
  /* 플랫폼형 헤더: 주 카테고리 글자 축소 */
  header > div[style*="max-width: 1256px"][style*="height: 64px"] nav[aria-label="주 카테고리"] { font-size: 16px !important; gap: 14px !important; }
  section[aria-label="기획 배너"] { height: 210px !important; }
  section[aria-label="기획 배너"] .g-fade { max-width: 80% !important; }
  section[aria-label="기획 배너"] div[aria-hidden="true"][style*="width: 470px"] { opacity: .45; }
  [style*="repeat(2, minmax(0, 1fr))"][style*="gap: 24px"], [style*="repeat(2, minmax(0, 1fr))"][style*="gap: 32px"] { gap: 12px !important; }
  [style*="repeat(7, minmax(0, 1fr))"] { font-size: 10px; }
}
