@charset "utf-8";
/* ==========================================================================
   관리자 «서브상단관리 / 서브하단관리» 반응형 보정
   /common/inc/shop_legacy_responsive.css        2026-08-23 정희찬(PRO4)

   왜 필요한가 —
     관리자 디자인템플릿으로 만든 서브상단/서브하단은 PC 고정폭으로 짜여 있다.
     endedit 실측(390px) : viewport 메타 없음 · .wrap_body 가 width/min-width 1300px
     · 문서 가로폭 1360px(화면 밖으로 980px 넘침).
     그 상·하단을 그대로 쓰면서 화면 폭에 맞게 «접히기만» 하도록 덧씌우는 파일이다.
     ⚠ 관리자 HTML 은 한 글자도 안 고친다 — 폭 제약만 푼다. 그래서 관리자에서
       내용을 바꿔도 이 파일은 계속 유효하다.

   짝이 되는 것 : 이 CSS 를 링크하는 쪽이 viewport 메타도 같이 내보내야 한다
     (레거시 헤더 /_include/header.asp 에는 viewport 가 없다).
     · /shop-legacy-pc.asp            ← 셸을 쓰는 화면 전부
     · /member/login·join·find_*.asp  ← 회원화면
     · /product/order.asp · /my/order_detail.asp

   되돌리기 : 이 파일을 링크하는 줄만 지우면 예전(고정폭) 상태로 돌아간다.
   ========================================================================== */

@media (max-width: 768px) {

	/* ── 1. 문서 전체 고정폭 해제 ─────────────────────────────────────────
	   .wrap_body 하나가 1300px 을 잡고 있어서 그 아래가 전부 딸려 나간다. */
	html, body { min-width: 0 !important; }
	.wrap_body { width: 100% !important; min-width: 0 !important; }

	/* topmenu.asp 가 찍는 «빈 폭맞춤 표»(width=1300) — 내용이 없으므로 그냥 뺀다 */
	#basisBody { display: none !important; }

	/* ── 2. 레거시 본문 골격 ──────────────────────────────────────────── */
	.location, .locationBox,
	.sub_contents, .sbc_width, .left_none,
	.PageWrapSize, .right_section, .right_cont {
		width: 100% !important; min-width: 0 !important; max-width: 100% !important;
		box-sizing: border-box !important; float: none !important;
	}
	.location, .locationBox { padding-left: 14px !important; padding-right: 14px !important; }


	/* ── 3·4·6 (서브상단 · 서브하단 · 가로스크롤 차단) 은 2026-08-24 에 여기서 뺐다 ──
	   그 규칙들은 전부 rroys 전용 선택자(.rr-* / .footer__*)였는데, rroys 는 이제
	   «메인과 같은» 반응형을 쓴다 — /common/inc/shop_rroys_responsive.css 로 옮겼다
	   (메인 화면의 반응형 <style> 을 그대로 가져온 파일. 햄버거 드로어 · 하단 탭바 ·
	    카테고리 4열 그리드까지 메인과 똑같이 나온다).
	   여기 남겨 두면 !important 로 그 규칙들을 덮어써 모바일 상·하단이 깨진다.
	   pro2·pro3 에는 애초에 그 선택자가 없어서(라이브 확인) 빼도 영향이 없다. */

	/* 가로 스크롤 차단(옛 6번) — 이건 사이트 공통이라 남기되 rroys 만 뺀다.
	   body 에 overflow-x:hidden 이 걸리면 position:sticky 헤더가 안 붙는데,
	   rroys 모바일 헤더는 메인과 같이 sticky 로 동작해야 한다. */
	html:not(:has(.rr-header-wrap)),
	html:not(:has(.rr-header-wrap)) body { overflow-x: hidden !important; }

	/* ── 5. 넘칠 만한 것들 공통 ───────────────────────────────────────── */
	img { max-width: 100%; height: auto; }
	table { max-width: 100% !important; }

	/* 이용안내의 입금계좌 표 — 4열이라 좁은 화면에서 min-content 가 화면을 넘긴다 */
	.ig-bankwrap { width: 100% !important; max-width: 100% !important; overflow-x: auto !important; }
	table.ig-bank { width: 100% !important; min-width: 0 !important; }
	table.ig-bank td.acc { white-space: normal !important; word-break: break-all; }
}
