/* 4쪽 공통 손질 (19판) — site.css 는 그대로 두고 덮어쓴다 */
.br-m { display: none; }
@media (max-width: 1023px) {
  .br-m { display: inline; }
  /* 목록: WATCHES 위첨자 개수가 오른쪽에서 잘리던 것 */
  .ptitle h1 { font-size: 10vw; }
  /* 분류 탭이 정렬 옆에서 잘려 보이던 것 — 오른쪽 끝을 흐려 옆으로 넘길 수 있음을 보여 준다 */
  .tabs { -webkit-mask-image: linear-gradient(to right, #000 80%, transparent); mask-image: linear-gradient(to right, #000 80%, transparent); }
  /* 맞춤제작: 제목이 4줄로 어색하게 끊기던 것 → 3줄 */
  .c-hero h1 { font-size: var(--fs-32); }
  /* 각인 미리 보기: 케이스백이 아래 입력칸 이름을 덮던 것 — 입력칸 높이만큼 비운다 */
  .eng { height: auto; min-height: calc(560 * var(--u)); }
  .eng .face { bottom: calc(248 * var(--u)); }
  .eng .back, .eng .face .pic-front { width: min(100%, calc(280 * var(--u))); }
  /* 앞면·뒷면 전환: 한 줄 전체를 반씩 */
  .eng .seg { display: grid; grid-template-columns: 1fr 1fr; }
}
/* 360 폭: 가운데 로고 BRANNEW 가 오른쪽 검색 아이콘에 붙던 것(실측) */
@media (max-width: 380px) {
  .head .util { gap: var(--sp-12); }
  .head .logo { font-size: var(--fs-16); }
}

/* 26판(PSPD): 웹사이트 전체 좌우 여백 100px — PC(1024 이상)만. 태블릿·폰은 그대로 */
@media (min-width: 1024px) { :root { --gut: calc(100 * var(--u)); } }
/* 푸터 영문 로고: 절반 크기, 왼쪽 맞춤(22판 PSPD 코멘트) — 메인(home.css)에만 있어 하위 3쪽은 예전 크기였다(26판 PSPD 지적) → 4쪽 공통으로 옮김 */
.foot .big { font-size: 5.8vw; text-align: left; margin-left: -0.05em; }

/* ══ 32판: 마디아 규칙 반영 (2026-10-28 PSPD, 4쪽 공통) ══ */
/* C-01·C-05: 보조 글자 #767676 이 메탈 바탕(#ebebeb)에서 3.81:1 → #505050 (#ebebeb 6.77:1, 배경 가장 어두운 #c8c8c8 에서도 4.82:1) */
:root { --muted: #505050; }
/* T-50: GNB 메뉴 글자 15 (14 였음) */
.head nav { font-size: calc(15 * var(--u)); }
/* T-18: 크고 굵은 제목은 Regular 로 (크기 유지). 사이트 Pretendard 는 400·600 두 굵기뿐이라 400 */
.hero h1, .panel h2, .sec-head h2, .custom-band blockquote, .c-hero h1, .form .side h2 { font-weight: 400; }
/* T-32: 행간 100% 금지 — 작은 Michroma 글자(.disp 기본 행간 1) */
.slogan.disp, span.disp { line-height: 1.4; }
/* T-01·T-47: 읽는 글자 12 → 14 (폰 목록 모델명, 각인 입력칸 이름) */
.eng label { font-size: var(--fs-14); }
@media (max-width: 1023px) {
  .grid .pcard .m { font-size: var(--fs-14); }
  /* K-10·K-11: 폰 머리 아이콘(검색·로그인 20×36, 장바구니 32×22) → 누르는 칸 40×40, 보이는 크기는 그대로 */
  .util button, .util .cartlink { min-width: calc(40 * var(--u)); min-height: calc(40 * var(--u)); justify-content: center; }
}

/* ══ 33판: 반응형 정리 (PSPD 2026-10-28) — 1024 이상 PC(1024~1439 는 1440 비율 축소), 1023 이하 모바일 ══
   태블릿(768~1023)은 폰 짜임을 쓰되 칸 수·폭만 화면에 맞게 (820 실측: 목록 카드 2칸이 한 장 380px 로 너무 큼) */
@media (min-width: 768px) and (max-width: 1023px) {
  :root { --gut: calc(40 * var(--u)); --head: calc(64 * var(--u)); }
  .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-40) var(--sp-16); }
  .rail { grid-auto-columns: 40vw; }
  .gal { grid-auto-columns: 64%; }
  .eng .back, .eng .face .pic-front { width: min(100%, 360px); }
}
/* 33판 K-10: 폰·태블릿 누르는 칸 40 이상 — 목록 정렬, 04 「자세히 보기」(보이는 크기는 그대로) */
@media (max-width: 1023px) {
  .sort select { min-height: 40px; }
  .p4b .meta a { display: inline-flex; align-items: center; min-height: 40px; }
}

/* 36판(PSPD): 푸터 줄바꿈 정리 — 사업자 정보를 「항목 / 값」 줄로 나눠, 한 줄 안에서 어중간하게 끊기지 않게(4쪽 공통) */
.foot .biz { margin: 0; display: grid; gap: var(--sp-4); }
.foot .biz > div { display: grid; grid-template-columns: calc(120 * var(--u)) 1fr; gap: var(--sp-12); }
.foot .biz dt { color: rgba(237, 237, 237, .5); }
.foot .biz dd { margin: 0; word-break: keep-all; }
.foot .biz dd a { margin-left: var(--sp-8); text-decoration: underline; text-underline-offset: 3px; }
.foot .copy { word-break: keep-all; }
.foot .nw { white-space: nowrap; }
@media (max-width: 1023px) {
  .foot { padding: var(--sp-48) var(--gut) var(--sp-32); }
  .foot .big { font-size: 9vw; margin-bottom: var(--sp-40); }
  .foot .slogan { font-size: var(--fs-12); white-space: nowrap; margin: calc(var(--sp-24) * -1) 0 var(--sp-32); }
  .foot .cols { grid-template-columns: 1fr 1fr; gap: var(--sp-24) var(--sp-16); }
  .foot .cols .biz { grid-column: 1 / -1; }
  .foot .biz > div { grid-template-columns: 112px 1fr; }
  .foot .links { gap: var(--sp-8); }
  .foot .copy { margin-top: var(--sp-32); }
}
/* 40판(PSPD 아이폰): 폰 머리 아이콘 간격이 멀던 것(아이콘 사이 40) — 누르는 칸이 이미 40×40 이라 칸 사이 간격을 빼서 아이콘 사이 20으로.
   장바구니는 아이콘을 칸 왼쪽 10 에 두고 개수를 붙여, 개수 끝이 오른쪽 여백 줄에 맞게 */
@media (max-width: 1023px) {
  .head .util { gap: 0; }
  .head .util .cartlink { gap: 2px !important; justify-content: flex-start; padding-left: 10px; }
}
