/* BASIC css start */
/* ============================================================
	피시위즈 모바일 리뉴얼 — 공통 + 헤더 CSS v2.0 (2026-07)
	KREAM풍 미니멀 : 블랙(#222) & 화이트 / 포인트 코랄레드 #EF6253
============================================================ */

/* ---------- 공통 유틸 (기존 클래스 유지 — 다른 페이지에서 사용) ---------- */
.cboth { clear:both;*zoom:1 }
.cboth:after { content:" "; display:block; clear:both; }
.fleft {float:left;}
.fright {float:right !important;}
.pdt5 {padding-top:5px;}

/* 각 페이지 상단 타이틀 */
#contents .h_title,
.page_location {padding:11px 12px; border-bottom:1px solid #F0F0F0; font-weight:bold; font-size:15px; color:#222;}
.page_location a {color:#888;}
.page_location li {display:inline-block;}
.page_location li + li:before {content:'>'; margin:0 5px; color:#CCC; font-weight:normal;}

/* 카테고리 열림 시 배경 마스크 */
#mask {top:0 !important; background:rgba(0,0,0,.45) !important;}

/* 더보기 버튼 */
#container .more {margin:5px 12px 20px;}
#container .more a,
#container .more .btn_moreGray {display:block; width:100%; height:44px; line-height:44px; text-align:center; border:1px solid #E5E5E5; border-radius:10px; background:#fff; color:#222; font-size:13px; font-weight:bold;}

/* 페이지 배경 — 콘텐츠 아래 흰 공간이 남지 않게 (2026-08) */
html, body {background:#F4F5F6;}
#container, #contents {background:transparent;}

/* ===== 카드 v3 260810 — 부품표(card-and-sortbar.md) 기준 · 여기가 하나뿐인 기준이다 =====
   header.1 은 모든 페이지가 <!--/include_header(1)/--> 로 불러오므로,
   이 블록 하나만 고치면 전 화면 상품 카드가 같이 바뀐다.
   ★ 페이지별 CSS 에 카드 규칙을 다시 적지 않는다. 페이지별로는 담는 칸(열 수·여백)만 적는다.

   줄 순서 · 높이   브랜드12 / 상품명33 / 정가13 / 판매가20 / 별점15 / 적립금15 / 품절15
   썸네일           정사각 · 흰 바탕 · 맞춰넣기(contain) · 모서리 10
   빈 줄도 자리를 남긴다 — 한 줄에 놓인 카드끼리 판매가 높이가 어긋나지 않게.
   ------------------------------------------------------------------------------ */

/* 썸네일 — 길쭉한 낚싯대가 잘리지 않게 contain. 배경은 흰색 */
#contents .list_shopping3x figure,
#contents .list_shopping2x figure,
#contents .list_shopping1x figure,
#contents .best_product figure {position:relative; margin:0; padding:0;
	border:0 !important; border-radius:0 !important; background:none !important; overflow:visible !important;}
#contents .list_shopping3x img.listPic,
#contents .list_shopping2x img.listPic,
#contents .best_product img.listPic {width:100% !important; height:auto !important;
	aspect-ratio:1/1 !important; object-fit:contain !important; display:block !important;
	background:#fff !important; border:0 !important; border-radius:10px !important;}

/* 1열(리스트) 보기의 썸네일 — 폭은 화면별 CSS 가 정하고, 나머지는 카드와 같게 */
#contents .list_shopping1x img.listPic {aspect-ratio:1/1 !important; object-fit:contain !important;
	background:#fff !important; border:0 !important; border-radius:10px !important;}

/* 뱃지 — NEW·재입고·순위는 왼쪽 위 8,8 / 할인율은 오른쪽 위 8,8 · 모서리 4 */
#contents .list_shopping3x .fw-rate,
#contents .list_shopping2x .fw-rate,
#contents .list_shopping1x .fw-rate,
#contents .best_product .fw-rate {position:absolute !important; top:8px !important; right:8px !important; left:auto !important;
	z-index:2; background:#EF6253 !important; color:#fff !important;
	font-size:10px !important; font-weight:800 !important; letter-spacing:-.2px;
	padding:3px 6px !important; border-radius:4px !important; line-height:1.3 !important;}
#contents .fw-rate:empty {display:none !important;}
#contents .list_shopping3x .fw-bd,
#contents .list_shopping2x .fw-bd,
#contents .list_shopping1x .fw-bd,
#contents .best_product .fw-bd {position:absolute !important; top:8px !important; left:8px !important; right:auto !important;
	z-index:2; background:#F0D025 !important; color:#14181D !important;
	font-size:10px !important; font-weight:800 !important;
	padding:3px 6px !important; border-radius:4px !important; line-height:1.3 !important;}
#contents .fw-bd.re, #contents .fw-bd.rank {background:#14181D !important; color:#fff !important;}
#contents .fw-bd:empty {display:none !important;}
#contents .fw-bd.new {font-family:'Space Grotesk',sans-serif; background:#F0D025 !important; color:#14181D !important;}
/* 썸네일을 덮는 품절 띠·덮개는 어떤 형태도 쓰지 않는다 (2026-08-10) — 맨 아래 글자줄로만 알린다 */
#contents .list_shopping3x .fw-sold-band,
#contents .best_product .fw-sold-band,
#contents .list_shopping3x figure .soldout,
#contents .best_product figure .soldout {display:none !important;}

/* 글자 상자 — 썸네일과 8 띄운다 */
#contents .list_shoppingInfo {text-align:left !important; margin:0 !important; padding:8px 0 0 !important;
	background:none !important;}
#contents .list_shoppingInfo p {margin:0 !important; padding:0 !important;}
/* ★ 일곱 줄은 값이 없어도 자리를 남긴다 — 그래야 한 줄에 놓인 카드끼리 판매가 높이가 맞는다.
   없는 줄은 header.1.js 의 「카드 v3」 가 빈 줄로 만들어 넣는다. 여기서 접지 않는다. */
#contents .list_shoppingInfo > p:not([class]) {display:none !important;}

/* 브랜드 12 */
#contents .list_shoppingInfo .fw-brand {display:block !important; height:12px !important; line-height:12px !important;
	overflow:hidden !important; font-family:'Space Grotesk',sans-serif;
	font-size:9px !important; font-weight:700 !important; letter-spacing:.03em;
	color:#8A9099 !important; text-transform:uppercase; white-space:nowrap; text-overflow:ellipsis;}
/* 설명줄은 카드에서 뺀다 */
#contents .list_shoppingInfo .subname {display:none !important;}
/* 상품명 2줄 33 */
#contents .list_shoppingInfo .listName {display:-webkit-box !important; -webkit-line-clamp:2; -webkit-box-orient:vertical;
	height:33px !important; overflow:hidden !important; border-bottom:0 !important;
	font-size:12px !important; font-weight:400 !important; line-height:1.35 !important; color:#2B3138 !important;}
/* 정가 13 — 할인 상품은 .listDiscount del, 나머지는 .consumer. 둘이 같이 나오지는 않는다 */
#contents .list_shoppingInfo .listDiscount,
#contents .list_shoppingInfo .consumer {display:block !important; height:13px !important; line-height:13px !important;
	font-size:10px !important; color:#B3B9C0 !important; text-decoration:line-through !important;}
#contents .list_shoppingInfo .listDiscount del {font-size:10px !important; color:#B3B9C0 !important;
	text-decoration:line-through !important;}
/* 판매가 20 */
#contents .list_shoppingInfo .listPrice {display:block !important; height:20px !important; line-height:20px !important;
	font-size:14px !important; font-weight:800 !important; color:#14181D !important;}
#contents .list_shoppingInfo .listReplce {display:block !important; height:20px !important; line-height:20px !important;
	font-size:12px !important; font-weight:700 !important; color:#8A9099 !important;}
/* 별점·후기 15 — 별 개수만. 파워리뷰 간편형이 별 이미지를 내려준다 */
#contents .list_shoppingInfo .fw-review {display:flex !important; align-items:center !important; gap:4px !important;
	height:15px !important; overflow:hidden !important; font-size:10.5px !important; color:#E0A400 !important;}
#contents .list_shoppingInfo .fw-review .st {color:#E0A400 !important;}
#contents .list_shoppingInfo .fw-review .st em {font-style:normal !important;}
#contents .list_shoppingInfo .fw-review .st img {height:12px !important; width:auto !important; vertical-align:-1px;}
#contents .list_shoppingInfo .fw-review .ct {color:#8A9099 !important;}
/* 적립금 15 — 언제나 원. % 는 쓰지 않는다 */
#contents .list_shoppingInfo .listReserve {display:block !important; height:15px !important; line-height:15px !important;
	font-size:10.5px !important; font-weight:500 !important; color:#8A7207 !important;}
/* 포인트 줄은 쓰지 않는다 — 미사용 기능이고 단위가 % 로 찍힌다 */
#contents .list_shoppingInfo .listPoint {display:none !important;}
/* 품절 15 — 카드 맨 아래 빨간 글자줄 하나로만 알린다 */
#contents .list_shoppingInfo .listSoldout {display:block !important; height:15px !important; line-height:15px !important;
	font-size:11px !important; font-weight:700 !important; color:#EF6253 !important;}
/* 줄 안에 섞여 들어오는 작은 아이콘(모바일할인 등) 크기만 맞춘다 */
#contents .list_shoppingInfo p img {height:13px; width:auto; vertical-align:middle;}

/* --- 담는 칸 : 3열 · 가로 8 · 세로 24 · 좌우 16 -------------------------------
   ★ common.css 가 420px 이상에서 4열로 바꾼다. 부품표는 화면이 넓어져도 3열이므로 덮어쓴다. */
#contents .list_shopping3x {padding:14px 12px 0;}
#contents .list_shopping3x ul {display:flex !important; flex-wrap:wrap !important; justify-content:flex-start !important;
	margin:0 !important; padding:0 !important; list-style:none !important;}
#contents .list_shopping3x ul:after {content:none !important;}
#contents .list_shopping3x ul > li {width:33.3333% !important; max-width:33.3333% !important;
	box-sizing:border-box !important; padding:0 4px 24px !important; margin:0 !important;
	float:none !important; clear:none !important; display:block !important;}
@media (min-width:420px) {
	#contents .list_shopping3x ul > li {width:33.3333% !important; max-width:33.3333% !important;}
}
@media (max-width:359px) {
	#contents .list_shopping3x {padding-left:8px; padding-right:8px;}
}
#contents .list_shopping3x li a {display:block; margin:0 !important; padding:0 !important;}

/* --- 가로 레일(메인 신상품·재입고)은 3열 격자에서 뺀다 (2026-08-15) -----------
   ★ 왜 필요한가 — 바로 위 `#contents .list_shopping3x ul` 이 아이디로 잡혀 있어
     세기가 세다. 레일 쪽 main.html 규칙(`.main .fw-railwrap ul.items`)은
     `!important` 를 붙여도 이 규칙을 못 이겼다.
     그래서 신상품·재입고가 **2줄이 아니라 1줄 3열**로 나오고 있었다.
     (크롬으로 재서 확인 — display 가 flex 로 덮여 있었다)
   ★ 레일은 「위→아래 2줄, 오른쪽으로 스크롤」 이다. 칸 폭 138 · 줄 사이 14 · 칸 사이 8. */
#contents .fw-railwrap ul.items {display:grid !important; grid-auto-flow:column !important;
	grid-template-rows:repeat(2,auto) !important; grid-auto-columns:138px !important;
	gap:14px 8px !important; flex-wrap:nowrap !important;
	justify-content:flex-start !important; padding:0 !important; margin:0 !important;}
#contents .fw-railwrap ul.items > li {width:auto !important; max-width:none !important;
	padding:0 !important; margin:0 !important; display:block !important;}

/* --- 정렬줄 : 높이 44 · 좌우 16 · 아래 여백 12 · 구분선 없음 --------------- */
#contents .list_array {display:flex !important; align-items:center !important; gap:8px;
	height:44px !important; min-height:44px !important; box-sizing:border-box !important;
	padding:0 16px !important; margin:0 0 12px !important; border:0 !important;}
#contents .list_array .list_arrayLeft {float:none !important; margin:0 !important; min-width:0; flex:1 1 auto;}
#contents .list_array .list_arrayRight {float:none !important; margin:0 !important;
	display:flex; align-items:center; gap:12px; flex:none;}
#contents .list_array .fw-count {font-size:13px; font-weight:500; color:#14181D; white-space:nowrap;}
#contents .list_array .fw-count em {font-style:normal; font-weight:700;}
/* 정렬 드롭다운 — 접히면 지금 정렬 이름만, 펼치면 네 가지 */
#contents .fw-sortdd {position:relative; flex:none;}
#contents .fw-sortnow {display:inline-flex !important; align-items:center; gap:4px;
	height:32px; padding:0 2px; margin:0; border:0; background:none;
	font-family:inherit; font-size:13px; font-weight:400; color:#8A9099;
	-webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent;}
#contents .fw-sortnow .ar {font-size:11px; line-height:1;}
#contents .fw-sortdd.on .fw-sortnow {color:#14181D;}
#contents .fw-sortmenu {display:none; position:absolute; right:0; top:36px; z-index:30;
	min-width:118px; margin:0; padding:6px 0; list-style:none; background:#fff;
	border:1px solid #DFE3E8; border-radius:10px; box-shadow:0 6px 20px rgba(20,24,29,.10);}
#contents .fw-sortdd.on .fw-sortmenu {display:block;}
#contents .fw-sortmenu li {margin:0; padding:0; border:0; float:none; list-style:none;}
#contents .fw-sortmenu a {display:block; padding:9px 14px; font-size:13px; color:#41474E;
	text-decoration:none; white-space:nowrap;}
#contents .fw-sortmenu a.on {color:#14181D; font-weight:700;}
/* 필터 칩 · 정렬 · 보기 전환 단추 — 높이 32 · 모서리 8 */
#contents .fw-tool {box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:5px;
	height:32px !important; padding:0 12px; margin:0;
	border:1px solid #DFE3E8; border-radius:8px !important; background:#fff;
	font-family:inherit; font-size:12.5px; font-weight:500; line-height:1; color:#14181D;
	white-space:nowrap; text-decoration:none; vertical-align:middle; flex:none;
	-webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent;}
#contents .fw-tool svg {width:14px; height:14px; display:block; flex:none;}
#contents .fw-tool-ico {width:32px !important; padding:0;}
#contents .fw-tool-ico svg {width:16px; height:16px; fill:#C4C8CC;}
#contents .fw-tool-ico.on {border-color:#14181D; background:#14181D;}
#contents .fw-tool-ico.on svg {fill:#fff;}
/* --- 더보기 단추 : 가운데 정렬 (2026-08-10 · 2차 정정) -----------------------
   ★ 진짜 원인 : 공용 CSS 가 `.more {width:100%}` 를 준다. 거기에 우리가 좌우 안여백 12 를
     더하니 `content-box` 계산 때문에 칸이 24 넘쳐서 그만큼 오른쪽으로 밀렸다.
     단추만 `border-box` 로 바꿔도 안 고쳐진다 — 담는 칸(.more)을 고쳐야 한다.
   그래서 `.more` 는 폭을 스스로 계산하게 두고(width:auto), 셋 다 못박는다. */
#contents .more {box-sizing:border-box !important; width:auto !important;
	max-width:100% !important; margin-left:0 !important; margin-right:0 !important;
	float:none !important; text-align:center !important; overflow:visible;}
#contents .more > a {display:block !important; width:100% !important;
	margin:0 auto !important; padding:0 !important; float:none !important; text-decoration:none;}
#contents .more .btn_moreGray {box-sizing:border-box !important; display:block !important;
	width:100% !important; max-width:100% !important; margin:0 auto !important;
	padding:0 !important; float:none !important; text-align:center !important;}

/* --- 뒤로 버튼 (2026-08-11 신규 부품) -----------------------------------------
   검색결과에서 상품을 눌러 상세로 들어가면 돌아갈 길이 없었다.
   브레드크럼은 분류로 보내니 검색결과로는 못 돌아간다.
   그래서 「어디서 왔는지」 를 읽어 그 이름을 적어 주는 단추를 둔다.
   글자를 정하는 것과 눌렀을 때 돌아가는 것은 header.1.js 가 한다. */
#contents .fw-back {box-sizing:border-box; display:inline-flex; align-items:center; gap:4px;
	height:32px; padding:0 12px; border:1px solid #DFE3E8; border-radius:8px; background:#fff;
	font-size:12.5px; font-weight:500; color:#14181D; text-decoration:none;
	white-space:nowrap; flex:none; -webkit-tap-highlight-color:transparent;}
#contents .fw-back .ar {font-size:13px; line-height:1;}
#contents .fw-back[hidden] {display:none !important;}

/* ===== 카드 v3 260810 끝 ===== */


/* 리스트형(1열) */
.list_shopping1x {text-align:center;}
.list_shopping1x ul {width:100%; display:table; table-layout:fixed; box-sizing:border-box; text-align:left; font-size:0;}
.list_shopping1x li {width:98%; display:inline-block; vertical-align:top; margin:1%; border:0 !important; box-sizing:border-box; overflow:hidden; background:#fff;}
.list_shopping1x li a {display:block; padding:0 !important; position:relative; overflow:hidden; zoom:1;}
.list_shopping1x li img.listPic {width:40%; float:right;}
.list_shopping1x .list_shoppingInfo {width:54%; float:left; padding:3% 2% 3% 3%; font-size:12px; text-align:left;}

/* 버튼 (기존 클래스명 유지) : 구매 계열 = 코랄레드 */
.btn_Red {background-color:#EF6253 !important; border:1px solid #EF6253 !important; color:#fff !important;}

/* 갤러리 게시판 배경 흰색 */
#gallery-list .item {background-color:#fff;}

.menu_on {height:100%; overflow:hidden;}
.menu_off {height:auto; overflow:initial;}

/* 로딩 바 */
#nprogress { pointer-events:none; }
#nprogress .bar { background:#222; position:fixed; z-index:1031; top:0; left:0; width:100%; height:2px; }
#nprogress .peg { display:block; position:absolute; right:0px; width:100px; height:100%; box-shadow:0 0 10px #fff, 0 0 5px #fff; opacity:1.0; transform:rotate(3deg) translate(0px,-4px); }
.nprogress-custom-parent { overflow:hidden; position:relative; }
.nprogress-custom-parent #nprogress .bar { position:absolute; }

/* ---------- 헤더 ---------- */
/* 1단 유틸 바 */
#header {background:#fff;}
#header .hd-util {height:30px; overflow:hidden; background:#fff; border-bottom:1px solid #F5F5F5; font-size:11px;}
#header .hd-util a {color:#888; display:block; line-height:30px; padding:0 9px;}
#header .hd-util .inner1 {float:left; margin-left:4px;}
#header .hd-util .inner1 li {float:left;}
#header .hd-util .inner2 {float:right; margin-right:4px;}
#header .hd-util .inner2 li {float:left;}
#header .hd-util .inner2 li + li {border-left:1px solid #F0F0F0;}

/* 2단 로고 줄 */
#header .hd-main {height:56px; display:flex; align-items:center; justify-content:space-between; padding:0 6px; position:relative;}
#header .hd-btn {width:40px; height:40px; border:0; background:none; display:inline-flex; align-items:center; justify-content:center; position:relative; padding:0;}
#header .hd-btn svg {width:23px; height:23px; stroke:#222; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round;}
#header .hd-logo {position:absolute; left:50%; transform:translateX(-50%);}
#header .hd-logo img {height:34px; vertical-align:middle;}
#header .hd-right {display:flex;}
#header .hd-cart-cnt {position:absolute; top:2px; right:0; min-width:16px; height:16px; line-height:16px; border-radius:8px; background:#222; color:#fff; font-size:10px; font-weight:bold; text-align:center; padding:0 4px;}
#header .hd-cart-cnt:empty {display:none;}

/* 3단 검색창 (상시 노출 — KREAM풍 그레이 필) */
#header .hd-search {position:relative; margin:0 12px 10px; height:40px; border:0; border-radius:10px; background:#F4F4F4; padding-right:44px; overflow:visible;}
#header .hd-search fieldset {border:0; margin:0; padding:0;}
#header .hd-search legend {position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}
#header .hd-search .searchBox {position:relative; width:100%;}
#header .hd-search .searchBox input {width:100%; height:40px; border:0; background:none; padding:0 16px; font-size:14px; box-sizing:border-box; outline:none; color:#222;}
#header .hd-search .searchBox input::placeholder {color:#AAA;}
#header .hd-search .btn_search {position:absolute; top:0; right:0; width:44px; height:40px; display:flex; align-items:center; justify-content:center;}
#header .hd-search .btn_search svg {width:18px; height:18px; stroke:#222; fill:none; stroke-width:2.2; stroke-linecap:round;}

/* 4단 프로모 스트립 */
#header .hd-promo {height:32px; line-height:32px; background:#222; color:#fff; font-size:12px; text-align:center; letter-spacing:-0.2px;}
#header .hd-promo b {color:#fff;}

/* 5단 GNB — KREAM풍 화이트 텍스트 탭 */
#header .hd-gnb {display:flex; align-items:stretch; background:#fff; height:44px; border-bottom:1px solid #F0F0F0;}
#header .hd-gnb .gnb-all {flex:0 0 auto; display:flex; align-items:center; padding:0 12px; color:#222; font-size:14px; font-weight:800; background:#fff; border-right:1px solid #F0F0F0;}
#header .hd-gnb .gnb-scroll {flex:1; display:flex; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap; scrollbar-width:none;}
#header .hd-gnb .gnb-scroll::-webkit-scrollbar {display:none;}
#header .hd-gnb .gnb-scroll a {flex:0 0 auto; display:flex; align-items:center; padding:0 11px; color:#444; font-size:14px; font-weight:600;}
#header .hd-gnb .gnb-sale {font-weight:800; color:#EF6253 !important;}

/* ---------- 슬라이드 메뉴 (aside) — 화이트 미니멀 ---------- */
aside {position:fixed; width:82%; max-width:340px; height:100%; top:0; left:0; bottom:0; background:#fff; overflow-y:auto; -webkit-overflow-scrolling:touch; z-index:1001; display:none; padding:0;}

aside .aside-login {background:#fff; padding:14px 16px; border-bottom:1px solid #F0F0F0;}
aside .aside-login ul {margin:0; padding:0; font-size:0;}
aside .aside-login li {display:inline-block; margin-right:8px;}
aside .aside-login li a {display:block; font-size:12px; font-weight:bold; line-height:30px; padding:0 15px; border-radius:16px; color:#222; border:1px solid #DDD;}
aside .aside-login li.login a {background:#222; color:#fff; border-color:#222;}
aside .aside-login li.close {float:right; margin:0;}
aside .aside-login li.close a {border:0; font-size:16px; padding:0 4px; color:#222;}

aside .aside-quick {border-bottom:1px solid #F0F0F0; padding:12px 8px;}
aside .aside-quick ul {margin:0; padding:0; display:flex;}
aside .aside-quick li {flex:1; text-align:center; position:relative;}
aside .aside-quick li a {display:block; font-size:11px; color:#222; font-weight:600;}
aside .aside-quick .q-ico {display:block; font-size:20px; margin-bottom:4px;}
aside .aside-quick .slide_count {display:inline-block; position:absolute; top:-4px; right:14px; min-width:15px; padding:0 3px; height:15px; line-height:15px; background:#222; color:#fff; font-weight:bold; font-size:10px; border-radius:8px; text-align:center;}
aside .aside-quick .slide_count:empty {display:none;}

aside .section2 {border:0;}
aside .section2 .asideTop {background:#fff; font-size:0; border-bottom:1px solid #E5E5E5;}
aside .section2 .asideTop a {width:33.33%; line-height:44px; height:44px; text-align:center; display:inline-block; font-size:13px; color:#AAA; font-weight:bold; box-sizing:border-box;}
aside .section2 .asideTop a.act {color:#222; background:#fff; border-bottom:2px solid #222;}

aside nav li {border-bottom:1px solid #F5F5F5; position:relative;}
aside nav li a {display:block; height:44px; line-height:44px; padding:0 0 0 16px; margin-right:44px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:600; color:#222;}
aside nav li .fa {position:absolute; top:0; right:0; width:44px; text-align:center; height:44px; line-height:44px; color:#CCC; cursor:pointer;}
aside nav .fa-angle-down:after {content:'▾';}
aside nav .fa-rotate-180 {transform:rotate(180deg);}

aside nav li > ul {background:#FAFAFA; display:none; border-top:1px solid #F5F5F5;}
aside nav li > ul > li {border-bottom:0; border-top:1px solid #F5F5F5;}
aside nav li > ul > li:first-child {border-top:0;}
aside nav li > ul > li a {padding:0 44px 0 26px; margin:0; height:38px; line-height:38px; font-size:12.5px; font-weight:normal; color:#555;}
aside nav li > ul > li .fa {height:38px; line-height:38px;}
aside nav li > ul > li > ul {border-top:1px solid #F5F5F5;}
aside nav li > ul > li > ul > li {border-bottom:0;}
aside nav li > ul > li > ul > li a {padding:0 0 0 38px; margin:0; background:#F4F4F4; height:36px; line-height:36px; font-size:12px; color:#666;}

aside .navCommunity {display:none;}
aside .navMypage {display:none;}

/* 브랜드 전체보기 — 헤더 레이어에서 이전한 개별페이지(page.20180482)로 연결 */
aside nav li.nav-brand-all {background:#fdf6cf;}
aside nav li.nav-brand-all a {display:flex; align-items:center; margin-right:0; font-weight:700; color:#14181d;}
aside nav li.nav-brand-all a em {margin-left:auto; font-style:normal; font-weight:700; font-size:12px; color:#8a7207; padding-right:16px;}

aside .aside-cs {padding:20px 16px 90px; font-size:12px; color:#888; line-height:1.7;}
aside .aside-cs .aside-tel {margin-bottom:12px;}
aside .aside-cs .aside-tel a {display:block; text-align:center; line-height:40px; border:1px solid #222; border-radius:10px; color:#222; font-size:13px; font-weight:bold;}

/* ---------- 최근 본 상품 레이어 ---------- */
#ly_lastView {width:100%; position:absolute; top:86px; left:0; background:#fff; z-index:101; padding-bottom:20px; box-shadow:0 6px 16px rgba(0,0,0,.15); display:none;}
#ly_lastView .h_layerTitle h3 {font-size:14px; padding:12px 14px; border-bottom:1px solid #F0F0F0;}
#ly_lastView .h_layerTitle .fa-times {float:right; cursor:pointer; color:#999; font-size:16px;}

/* ---------- 검색 자동완성 (다찾다) ---------- */
.search-auto-complete-list {display:none; z-index:10; position:absolute; top:44px; left:0; width:100%; line-height:14px; background:#fff; box-shadow:0px 0px 5px 0px rgb(0 0 0 / 15%); border-radius:10px; overflow:hidden;}
.search-auto-complete-list ul {width:100%; padding:8px 0 10px; border-bottom:1px solid #eee;}
.search-auto-complete-list ul li {text-align:left;}
.search-auto-complete-list ul li a {display:block; padding:8px 14px 7px; color:#222; background:none; font-size:12px; letter-spacing:-0.5px;}
.search-auto-complete-list ul li a strong {color:#EF6253;}
.search-auto-complete-list ul li a:hover {background:#f5f5f5;}
.search-auto-complete-list .search-list-close {display:block; padding:10px 11px; text-align:right; color:#888; font-size:11px;}

/* 검색창 스타일 수정 (기존 유지) */
.xans-layout-searchheader {top:5% !important; width:90%; margin:0 auto;}
.xans-search-form .inner {margin-bottom:15px;}

/* ============================================================
   FISHWIZ 모바일 헤더 블랙+골드 통일 (오버라이드)
   → 기존 header.1.css 맨 아래에 추가. 코랄(#EF6253) 제거.
   세일/품절 = 주황 #C8420F · 구매/기본 = 블랙 #14181D · 포인트 = 골드 #F0D025
   ============================================================ */
.btn_Red { background-color:#14181d !important; border-color:#14181d !important; color:#fff !important; }
.listSoldout { color:#c8420f !important; }
#header .hd-gnb .gnb-sale { color:#c8420f !important; }
.search-auto-complete-list ul li a strong { color:#14181d !important; }
/* 골드 포인트 — GNB 현재 카테고리 강조 */
#header .hd-gnb .gnb-scroll a.on,
#header .hd-gnb .gnb-scroll a.active { color:#14181d !important; border-bottom:2px solid #F0D025 !important; }


/* ============================================================
   전체 카테고리 드로어 2열 (v3.0 · 2026-08)
   - 위 아코디언 규칙은 커뮤니티·마이페이지 탭에서 계속 쓰이므로 지우지 않았다.
   - aside 를 화면 전체로 넓히고 세로 flex 로 바꿔, 목록만 안에서 스크롤되게 한다.
   ============================================================ */
aside {width:100%; max-width:none; overflow:hidden;}
aside.on {display:flex; flex-direction:column;}
aside .aside-login, aside .aside-quick {flex:none;}
aside .section2 {display:flex; flex-direction:column; flex:1 1 auto; min-height:0;}
aside .section2 .asideTop {flex:none;}

aside .navCategory {display:none; flex:1 1 auto; min-height:0;}
aside .navCategory.on {display:flex;}
aside .navCommunity, aside .navMypage {display:none; flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch;}
aside .navCommunity.on, aside .navMypage.on {display:block;}

/* 카테고리 탭에서는 하단 고객센터 블록을 감춘다 — 타일 높이를 벌기 위해 */
aside.cate-on .aside-cs {display:none;}
aside .aside-cs {flex:none; padding-bottom:24px;}

.dw-cate {display:flex; align-items:stretch; width:100%; flex:1 1 auto; min-height:0;}
.dw-c1 {flex:0 0 118px; background:#FAFAFA; border-right:1px solid #EDEEF0; overflow-y:auto; -webkit-overflow-scrolling:touch;}
.dw-c1 .dw-c1-i {display:block; text-decoration:none; padding:13px 12px; font-size:13px; line-height:18px; font-weight:500; color:#666; word-break:keep-all;}
.dw-c1 .dw-c1-i.on {background:#fff; color:#222; font-weight:800; box-shadow:inset 3px 0 0 #222;}
.dw-c1 .dw-c1-brand {color:#8a7207; font-weight:700;}
.dw-c1 .dw-c1-brand.on {color:#8a7207; box-shadow:inset 3px 0 0 #F0D025;}

.dw-c2 {flex:1 1 auto; min-width:0; overflow-y:auto; -webkit-overflow-scrolling:touch; background:#fff;}
.dw-p {display:none;}
.dw-p.on {display:block;}
.dw-all {text-decoration:none; display:flex; align-items:center; padding:13px 14px; font-size:13px; line-height:18px; font-weight:800; color:#222; border-bottom:1px solid #F5F5F5;}
.dw-all i {font-style:normal; margin-left:5px; font-size:15px; line-height:1;}
.dw-note {margin:14px; font-size:12px; line-height:1.6; color:#8A8F96;}

.dw-grid {padding:12px 14px 28px; display:grid; grid-template-columns:repeat(3,1fr); grid-gap:12px 8px; gap:12px 8px;}
.dw-t {display:block; text-decoration:none;}
.dw-th {position:relative; display:block; height:0; padding-top:100%; background:#F4F5F7; overflow:hidden;}
.dw-th img {position:absolute; top:0; left:0; width:100%; height:100%; object-fit:cover; display:block;}
.dw-th:after {content:attr(data-ini); position:absolute; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:800; color:#C8CDD3;}
.dw-th.has-img:after {display:none;}
.dw-tn {display:block; margin-top:6px; font-size:11px; line-height:1.3; font-weight:600; color:#222; word-break:keep-all;}

/* 발송 안내 띠 — 오늘 발송이 되는 날은 노란 강조, 마감 뒤·휴무일은 옅게 */
.hd-promo .fw-shipnow{font-weight:800;color:#FFD400;}
.hd-promo.fw-shipoff .fw-shipnow{color:#c9ced4;}


/* BASIC css end */

