@charset "utf-8";
/* ============================================================================
   warehouse.css — 창고형 와이어프레임 스킨 (무채색 / 라이트 단일 · 주간 창고)
   daitg 테마 골격(헤더·카테고리·컨테이너·푸터) 오버라이드.
   head.sub.php 에서 style.css(prio 10) 뒤(prio 20)로 로드되어 최종 승리.
   ── 컨셉: 풀블리드 격자 / 순수 사각형(라운드·그림자 0) / 헤어라인 구획 /
            강조는 잉크 반전·굵기로만. 액센트 컬러 없음.
   ============================================================================ */

:root{
  --wh-paper:#ffffff;      /* 페이지 바탕 (화이트) */
  --wh-panel:#f4f4f2;      /* 밝은 패널 (hover·검색·게이지 트랙) */
  --wh-ink:#16150f;        /* 잉크(먹) */
  --wh-ink2:#57544b;       /* 보조 텍스트 */
  --wh-line:#cbc8bf;       /* 헤어라인 */
  --wh-line-2:#dbd9d1;     /* 옅은 라인 */
  --wh-strong:#16150f;     /* 강한 테두리 = 잉크 */
  --wh-gutter:clamp(16px,3vw,48px);
  --wh-mono:ui-monospace,"SF Mono",Menlo,Consolas,"Cascadia Mono","D2Coding",monospace;
}

/* ── 0. 풀블리드 해제: 1200px 고정 → 100% ─────────────────────────────── */
#hd, #wrapper, #ft{ min-width:0 !important; }
body{ background:var(--wh-paper); }

/* 라운드·그림자 전면 제거 (골격 범위) */
#hd, #hd *, #ft, #ft *, #category, #category *,
#hd_sch, #hd_sch *, .hd_login>li.login a, #hd_menu, #hd_menu *{
  border-radius:0 !important;
  box-shadow:none !important;
}

/* ── 1. 헤더 컨테이너 ─────────────────────────────────────────────────── */
#hd{
  background:var(--wh-paper);
  border-bottom:2px solid var(--wh-strong);
}

/* 상단 유틸리티 바 (tnb) — 얇은 데이터 스트립 */
#tnb{
  background:var(--wh-panel);
  border-bottom:1px solid var(--wh-line);
}
#tnb .inner{
  width:100%; max-width:none; box-sizing:border-box;
  padding:0 var(--wh-gutter);
  display:flex; align-items:center; justify-content:space-between;
}
#hd_define li, #hd_qnb li{
  border-right:1px solid var(--wh-line);
  line-height:34px;
  font-family:var(--wh-mono);
  font-size:11px; letter-spacing:.03em;
}
#hd_define li a, #hd_qnb li a{ color:var(--wh-ink2); }
#hd_define li a:hover, #hd_qnb li a:hover{ color:var(--wh-ink); }
#hd_define li.active a{ color:var(--wh-ink); font-weight:700; }
#hd_qnb li.bd a{ color:var(--wh-ink); font-weight:700; }

/* 로고 + 검색 + 로그인 줄 */
#hd_wrapper{
  width:100%; max-width:none; box-sizing:border-box;
  padding:0 var(--wh-gutter);
  height:80px;
  border-bottom:1px solid var(--wh-line);
}
#logo img{ height:34px; }

/* 검색창 — 라운드 그린 → 사각 잉크 아웃라인 */
.hd_sch_wr{ max-width:620px; margin:0 32px; }
#hd_sch{
  display:flex;
  border:2px solid var(--wh-strong);
  background:var(--wh-panel);
  overflow:hidden;
}
#hd_sch #sch_str{
  flex:1; height:44px; padding:0 16px;
  background:transparent; border:0; outline:none;
  font-family:var(--wh-mono); font-size:14px; color:var(--wh-ink);
}
#hd_sch #sch_str::placeholder{ color:var(--wh-ink2); }
#hd_sch #sch_submit{
  flex-shrink:0; width:56px; height:44px; border:0; cursor:pointer;
  background:var(--wh-ink); color:var(--wh-paper); font-size:16px;
}
#hd_sch #sch_submit:hover{ background:#000; }

/* 로그인 / 장바구니 */
.hd_login>li.login a{
  color:var(--wh-ink); border:2px solid var(--wh-strong);
  padding:8px 18px; font-weight:800; letter-spacing:.02em;
}
.hd_login>li.login a:hover{ background:var(--wh-ink); color:var(--wh-paper); }
.hd_login .fa-shopping-cart{ color:var(--wh-ink); }
.hd_login .count{
  background:var(--wh-ink); color:var(--wh-paper);
  min-width:16px; height:15px; line-height:13px;
  border:0; font-family:var(--wh-mono); font-size:10px; font-weight:700;
}

/* ── 2. 카테고리 메뉴 바 (hd_menu) — 통로(AISLE) 바 ─────────────────── */
#hd_menu{
  width:100%; max-width:none; box-sizing:border-box;
  padding:0 var(--wh-gutter);
  background:var(--wh-paper);
  border-top:0;
  border-bottom:2px solid var(--wh-strong);
  display:flex; align-items:stretch;
}
#hd_menu button#menu_open{
  float:none;
  width:auto; min-width:190px; height:50px;
  background:var(--wh-ink); color:var(--wh-paper);
  padding:0 24px; font-weight:800; font-size:1.05em; letter-spacing:.04em;
  border:0;
  display:flex; align-items:center; gap:10px;
}
#hd_menu button#menu_open:hover{ background:#000; }
.hd_menu{
  float:none; width:auto; display:flex; flex-wrap:wrap;
  border-left:1px solid var(--wh-line);
}
.hd_menu li{ float:none; padding:0; display:flex; }
.hd_menu li a{
  display:flex; align-items:center; height:50px;
  color:var(--wh-ink); font-weight:600;
  border-right:1px solid var(--wh-line);
  padding:0 22px;
  transition:background .12s, color .12s;
}
.hd_menu li a:hover{ background:var(--wh-ink); color:var(--wh-paper); }
.hd_menu li.daitg a{ font-weight:800; }

/* ── 3. 카테고리 메가 패널 (#category) ───────────────────────────────── */
#category{
  border:2px solid var(--wh-strong); border-top:0;
  background:var(--wh-paper);
}
#category h2{
  border-bottom:1px solid var(--wh-line);
  color:var(--wh-ink); font-weight:800;
  font-family:var(--wh-mono); letter-spacing:.08em; text-transform:uppercase;
}
#category .cate_li_1{ border-left:1px solid var(--wh-line); }
#category .cate_li_1_a{ color:var(--wh-ink); font-weight:800; }
#category .cate_li_2 a{ color:var(--wh-ink2); }
#category .cate_li_2 a:hover{ color:var(--wh-ink); text-decoration:underline; }
#category .close_btn{ color:var(--wh-ink2); }
#category_all_bg{ background:rgba(22,21,15,.14); }

/* ── 4. 본문 래퍼 / 컨테이너 — 풀스크린 ──────────────────────────────── */
#wrapper{ background:var(--wh-paper); }
#container{
  width:auto; max-width:none; margin:0;
  box-sizing:border-box;
  padding:0 var(--wh-gutter);
}
/* 존재하지 않는 #aside(265px) 용 좌측 여백 제거 → 풀블리드 */
#container .is_index{ margin-left:0; }

/* 메인 섹션 헤더를 산업형 라벨로 (도면 섹션 넘버 느낌) */
.sct_wrap > header{
  border-bottom:2px solid var(--wh-strong);
  padding-bottom:10px; margin-bottom:18px;
}
.sct_wrap > header h2{
  position:relative;
  padding-left:16px;
  font-weight:800; letter-spacing:-.01em; color:var(--wh-ink);
}
.sct_wrap > header h2::before{
  content:""; position:absolute; left:0; top:2px; bottom:2px;
  width:5px; background:var(--wh-ink);
}
.sct_wrap > header h2 a{ color:inherit; }

/* 메인 퀵메뉴 — 창고 안내도(DIRECTORY) 격자 */
.wh-quick{
  display:grid; grid-template-columns:repeat(8,1fr);
  border:1px solid var(--wh-strong); background:var(--wh-paper);
  margin:24px 0 32px;
}
.wh-quick__item{
  position:relative; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:10px;
  padding:24px 8px; text-align:center; color:var(--wh-ink);
  border-left:1px solid var(--wh-line);
  transition:background .12s, color .12s;
}
.wh-quick__item:first-child{ border-left:0; }
.wh-quick__item:hover{ background:var(--wh-ink); color:var(--wh-paper); }
.wh-quick__no{
  position:absolute; top:8px; left:9px;
  font-family:var(--wh-mono); font-size:10px; letter-spacing:.06em; color:var(--wh-ink2);
}
.wh-quick__item:hover .wh-quick__no{ color:var(--wh-paper); opacity:.65; }
.wh-quick__ic{ font-size:24px; line-height:1; }
.wh-quick__lb{ font-size:13px; font-weight:700; letter-spacing:-.01em; }
@media (max-width:1000px){
  .wh-quick{ grid-template-columns:repeat(4,1fr); }
  .wh-quick__item:nth-child(4n+1){ border-left:0; }
  .wh-quick__item:nth-child(n+5){ border-top:1px solid var(--wh-line); }
}

/* ── 5. 사이드 퀵버튼 (side_menu) 무채색화 ───────────────────────────── */
#side_menu{ border-left:1px solid var(--wh-line); box-shadow:none; }
#quick li button{ color:var(--wh-ink2); }
#quick li button:hover{ color:var(--wh-ink); }
.btn_sm_on i{ color:var(--wh-ink) !important; }
#top_btn{ background:var(--wh-ink); color:var(--wh-paper); border:0; border-radius:0; }

/* ── 6. 푸터 (#ft) — 도면 범례 밴드 ──────────────────────────────────── */
#ft{
  background:var(--wh-paper);
  border-top:2px solid var(--wh-strong);
  color:var(--wh-ink2);
}
#ft_top{ border-bottom:1px solid var(--wh-line); }
#ft_link li a{ color:var(--wh-ink2); font-family:var(--wh-mono); font-size:12px; letter-spacing:.02em; }
#ft_link li a:hover{ color:var(--wh-ink); }
.ft_sns li a{ color:var(--wh-ink2); }
.ft_sns li a:hover{ color:var(--wh-ink); }
#ft_wr{ border-bottom:1px solid var(--wh-line); }
#ft_company h2, .ft_col_tit{
  color:var(--wh-ink); font-family:var(--wh-mono);
  letter-spacing:.08em; text-transform:uppercase; font-size:12px;
}
#ft_company .ft_tel{ color:var(--wh-ink); font-family:var(--wh-mono); }
.ft_biz .lbl{ color:var(--wh-ink2); }
.ft_biz .val{ color:var(--wh-ink); }
#ft_copy{ color:var(--wh-ink2); }
#ft_copy .ft_copy_links a{ color:var(--wh-ink2); }
#ft_copy .ft_copy_links a:hover{ color:var(--wh-ink); }

/* ── 7. 상품 카드 — "선반 위의 박스" (사각 셀 / 모노 가격 / hover 반전) ── */
/*  메인 진열(smt_40) + 분류 그리드(sct_10/20/pv) 공통. 카드 내부 클래스는
    main.40 / list.*.skin.php 가 동일 사용(.sct_li·.sct_img·.sct_txt·.sct_cost). */

/* 진열 컨테이너 박스테두리 제거 → 셀 격자가 구획 담당 */
.smt_40{ background:var(--wh-paper) !important; border:0 !important; padding:0 !important; }

/* 카드 셀 */
.smt_40 .sct_li,
.sct_10 .sct_li, .sct_20 .sct_li, .sct_pv .sct_li{
  box-sizing:border-box;
  border:1px solid var(--wh-line);
  background:var(--wh-paper);
  border-radius:0; box-shadow:none;
  transition:border-color .12s, background .12s;
  padding:0;
}
.smt_40 .sct_li{ margin:0 8px; }
.smt_40 .sct_li:hover,
.sct_10 .sct_li:hover, .sct_20 .sct_li:hover, .sct_pv .sct_li:hover{
  border-color:var(--wh-strong);
  background:var(--wh-panel);
}
/* 도면 코너틱(장식) — 좌상단 */
.smt_40 .sct_li{ position:relative; }
.smt_40 .sct_li::before{
  content:""; position:absolute; top:6px; left:6px; width:8px; height:8px;
  border-top:2px solid var(--wh-strong); border-left:2px solid var(--wh-strong);
  opacity:.55; pointer-events:none; z-index:3;
}

/* 이미지 영역 — 정사각 프레임 + 하단 헤어라인, 로딩 전 해칭 */
.smt_40 .sct_img,
.sct_10 .sct_img, .sct_20 .sct_img{
  position:relative; text-align:center;
  border-bottom:1px solid var(--wh-line);
  background:
    repeating-linear-gradient(45deg, transparent 0 9px, rgba(22,21,15,.05) 9px 10px);
}
.smt_40 .sct_img img,
.sct_10 .sct_img img, .sct_20 .sct_img img{ vertical-align:top; max-width:100%; height:auto; }

/* 정보 영역 — main.40=.sct_info · list.10=.sct_ct_wrap · list.20=래퍼없음(직속) */
.smt_40 .sct_info,
.sct_10 .sct_ct_wrap{ padding:12px 12px 14px; }
/* list.20 은 텍스트 래퍼가 없어 이미지는 풀블리드, 텍스트만 인셋 */
.sct_20 .sct_li{ padding-bottom:12px; }
.sct_20 .wh-meta, .sct_20 .sct_txt, .sct_20 .sct_basic,
.sct_20 .sct_cost, .sct_20 .wh-stock, .sct_20 .sct_icon{ padding-left:10px; padding-right:10px; }
.sct_20 .wh-meta{ margin-top:10px; }
.smt_40 .sct_star{ margin:0 0 6px; }
.sct_li .sct_star img, .sct_li img.sit_star{ filter:grayscale(1) contrast(1.1); }

/* 상품명 */
.smt_40 .sct_txt, .sct_10 .sct_txt, .sct_20 .sct_txt{
  display:block; margin:0 0 8px; font-size:14px; line-height:1.45;
  border-bottom:0; padding-bottom:0;
}
.sct_txt a, .smt_40 .sct_txt a, .sct_40 .sct_txt a{
  color:var(--wh-ink) !important; font-weight:600 !important; font-size:14px !important;
}
.sct_basic{ color:var(--wh-ink2) !important; font-family:var(--wh-mono); font-size:11px; letter-spacing:.02em; margin-bottom:8px; }

/* 가격 — 모노스페이스 대형 (도면 수치 느낌) */
.sct_cost, .smt_40 .sct_cost, .sct_10 .sct_cost, .sct_20 .sct_cost, .sct_pv .sct_cost{
  margin:6px 0 0 !important; position:static !important; right:auto !important; top:auto !important;
  font-family:var(--wh-mono); font-weight:800; font-size:18px; letter-spacing:-.02em;
  color:var(--wh-ink);
}

/* 담기 버튼 → 사각 잉크 */
.btn_cart, .sct_cart{
  border-radius:0 !important; background:var(--wh-ink) !important; color:var(--wh-paper) !important;
  border:0 !important; font-weight:700; letter-spacing:.02em;
}
.btn_cart:hover, .sct_cart:hover{ background:#000 !important; }
.sct_cart_ov{ background:transparent; }

/* 위시/공유 버튼 무채색 + 그림자·확대 제거 */
.sct_op_btn>button{ color:var(--wh-ink2) !important; background:transparent !important; box-shadow:none !important; transform:none !important; }
.sct_op_btn>button:hover{ color:var(--wh-ink) !important; transform:none !important; box-shadow:none !important; }

/* 아이콘/품절 무채색 */
.sit_icon_li img{ filter:grayscale(1); }
.sct_soldout_ov{ background:rgba(22,21,15,.62) !important; }
.sct_soldout_ov span{
  border:2px solid #fff !important; border-radius:0 !important;
  font-family:var(--wh-mono); letter-spacing:.12em; background:transparent !important;
}

/* 창고형 실데이터 라벨: 좌표 · SKU (main.40.skin.php) */
.wh-meta{
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  margin:0 0 8px; font-family:var(--wh-mono); font-size:10px; letter-spacing:.04em;
  color:var(--wh-ink2); line-height:1.4;
}
.wh-coord{
  color:var(--wh-paper); background:var(--wh-ink);
  padding:1px 6px; font-weight:700; letter-spacing:.06em; flex-shrink:0;
}
.wh-sku{
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:right;
}

/* 정가 취소선 (판매가 옆) */
.sct_cost .wh-oldprice{
  margin-left:8px; font-family:var(--wh-mono); font-weight:500; font-size:12px;
  color:var(--wh-ink2); text-decoration:line-through; letter-spacing:0;
}

/* 재고 게이지 */
.wh-stock{ display:flex; align-items:center; gap:8px; margin-top:10px; }
.wh-bar{
  flex:1; height:7px; border:1px solid var(--wh-strong);
  position:relative; overflow:hidden; background:var(--wh-panel);
}
.wh-bar > i{
  display:block; height:100%;
  background:repeating-linear-gradient(45deg, var(--wh-ink) 0 4px, #3a382e 4px 8px);
}
.wh-bar--low > i{ background:repeating-linear-gradient(45deg, var(--wh-ink) 0 3px, transparent 3px 6px); }
.wh-stocklabel{
  flex-shrink:0; font-family:var(--wh-mono); font-size:10px; letter-spacing:.03em;
  color:var(--wh-ink2);
}
.wh-bar--low + .wh-stocklabel{ color:var(--wh-ink); font-weight:700; }

/* 분류 리스트 정가(소비자가) — list.10/20 의 .sct_dict 취소선 */
.sct_dict{
  font-family:var(--wh-mono); font-weight:500; font-size:12px;
  color:var(--wh-ink2) !important; text-decoration:line-through; letter-spacing:0;
}
/* 분류 리스트 품절 아이콘 무채색 (list.10) */
.shop_icon_soldout{ background:rgba(22,21,15,.62) !important; }
.shop_icon_soldout .soldout_txt{
  border:2px solid #fff !important; border-radius:0 !important;
  font-family:var(--wh-mono); letter-spacing:.12em; background:transparent !important; color:#fff !important;
}
/* 가로형 리스트(list.30/40) — 격자 삽입은 안 하고 색/사각만 정리 */
.sct_30 .sct_li, .sct_40 .sct_li{ border-radius:0 !important; box-shadow:none !important; }
.sct_30 .sct_li{ border:1px solid var(--wh-line) !important; background:var(--wh-paper) !important; }
.sct_40 .sct_li{ border-bottom:1px solid var(--wh-line) !important; }
.sct_30 .sct_cost, .sct_40 .sct_cost{ font-family:var(--wh-mono); font-weight:800; color:var(--wh-ink); }

/* 상품 리스트 상단 위치/정렬 셀렉트 라운드 제거 */
.shop_select_to_html .menulist{ border-radius:0 !important; box-shadow:0 0 0 1px var(--wh-line) !important; }
.shop_select_to_html .option.selected, .shop_select_to_html .option.selected a,
.shop_select_to_html:hover .category_title, .shop_select_to_html:hover .category_title i{ color:var(--wh-ink) !important; }

/* ── 8. 마우스 오버 효과 제거 — 확대(scale)·그림자 금지 (플랫 와이어프레임) ──
   출처: css/style.css 의 hover scale/box-shadow 규칙들. warehouse.css 가 뒤에 로드되어 무효화. */
.sct_10 .sct_li:hover .sct_img img,
.sct_20 .sct_li:hover .sct_img img,
.sct_30 .sct_li:hover .sct_img img,
.sct_40 .sct_li:hover .sct_img img,
.smt_40 .sct_li:hover .sct_img img,
.dt-hero__link:hover img,
.dt-deal__card:hover .dt-deal__thumb img{
  transform:none !important;
}
/* 이미지 확대 트랜지션 자체 제거 */
.sct_img img, .dt-hero__link img, .dt-deal__thumb img{ transition:none !important; }

/* hover 그림자·들림(translate)·확대 일괄 제거 (상품·키워드·카테고리·히어로·특가 카드) */
.smt_40 .sct_li:hover, .sct_10 .sct_li:hover, .sct_20 .sct_li:hover,
.sct_30 .sct_li:hover, .sct_40 .sct_li:hover,
.dt-kwbar__list a:hover, .dt-kwbar--item .dt-kwbar__list a:hover,
.daitg-catcard .daitg-catcard-item a:hover,
.dt-hero__link:hover, .dt-deal__card:hover{
  box-shadow:none !important;
  transform:none !important;
}

/* ── 9. 팝업/기타 라운드 잔재 정리 ───────────────────────────────────── */
.hd_pops{ border:1px solid var(--wh-line); border-radius:0; }