@import url(/resources/fonts/plex.css);
/* [p402 2026-10-10] 빙고 표준 표 서식 — 쇼핑몰 PC (대표님 지시 10-10 21시: ERP 견적 작성 화면 왼쪽 거래처 정보 표가 빙고 모든 표의 표준, 검색란 글씨체도 그대로)
   값 기준 docs/빙고-표준-표서식.md (3 방 실측). 머리말(mall/include/header.jsp) 맨 끝, design-a.css 다음에서 불러옴. 되돌리기 = 그 link 한 줄 삭제.
   변수 이름은 --vgs-* (표준 조각의 --vg-line 은 디자인 A 의 --vg-line(#D5DDE3)과 이름이 겹쳐 쇼핑몰 다른 선 색까지 바뀌므로 따로 둠).
   범위: #wrap 안의 표 table.list·table.view·table.write(장바구니·주문서·마이빙고·검색 텍스트 보기 등)와 검색칸 글씨. 표 폭·칸 폭·단추·그림·inline 정렬은 그대로. */
:root {
  --vgs-font: "IBM Plex Sans KR", 돋움, Dotum, "Malgun Gothic", sans-serif;
  --vgs-fs: 11.2px;
  --vgs-lh: 14.56px;
  --vgs-ink: #14212b;
  --vgs-th-bg: #eef2f5;
  --vgs-line: #e3e8ec;
  --vgs-line-top: #dfdfdf;
}
#wrap table.list, #wrap table.view, #wrap table.write {
  border-collapse: collapse; border-top: 1px solid var(--vgs-line-top);
  font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 300; line-height: var(--vgs-lh); color: var(--vgs-ink);
}
#wrap table.list tr, #wrap table.view tr, #wrap table.write tr { border-bottom: 1px solid var(--vgs-line); }
#wrap table.list th, #wrap table.list td,
#wrap table.view th, #wrap table.view td,
#wrap table.write th, #wrap table.write td {
  text-align: left; vertical-align: middle;
  font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 300; line-height: var(--vgs-lh); color: var(--vgs-ink);
  border-right: 1px solid var(--vgs-line);
}
/* 칸 여백 7px 10px 은 항목명·값 두 칸 표(view·write — 표준의 원래 표와 같은 꼴)만. 칸이 많은 목록표(list)는 화면마다 맞춘 여백 그대로
   (나의 주문내역 6px 4px 등 p033·p038 — 표준 여백을 넣으면 '7,000 원'·'부천 점'·'수 량' 처럼 좁은 칸이 두 줄로 꺾임, 10-10 비교 화면) */
#wrap table.view th, #wrap table.view td, #wrap table.write th, #wrap table.write td { padding: 7px 10px; }
#wrap table.list th, #wrap table.view th, #wrap table.write th {
  background: var(--vgs-th-bg); border-left: 1px solid var(--vgs-line); letter-spacing: -1px;
}
/* 머리글 왼쪽 정렬: p071(10-03, 머리글 가운데 '#wrap.mypage #container thead th' 등)보다 우선 — 이번 표준(머리글 왼쪽)이 그 뒤 대표님 지시 */
#wrap.mypage #container table thead th, #wrap.cart #container table thead th,
#wrap.mypage #container table th[scope="col"], #wrap.cart #container table th[scope="col"],
#wrap #container table.list thead th, #wrap #container table.list th[scope="col"],
#wrap #container table.view th, #wrap #container table.write th { text-align: left; }
/* 표 안 글자 조각(span·a·strong·p·입력칸)도 같은 글꼴·크기 — 강조 굵기·색(빨강 재고소진, 파랑 금액 등)은 각 화면 규칙 그대로 */
#wrap table.list td span, #wrap table.list td a, #wrap table.list td p, #wrap table.list td strong,
#wrap table.view td span, #wrap table.view td a, #wrap table.view td p,
#wrap table.write td span, #wrap table.write td a, #wrap table.write td p,
#wrap table.list td input, #wrap table.list td select, #wrap table.write td input, #wrap table.write td select, #wrap table.write td textarea {
  font-family: var(--vgs-font); font-size: var(--vgs-fs);
}
/* 검색칸: 글씨체만 표준(대표님 '검색란 글씨체도 그대로') — 칸 모양·가운데 정렬·밑줄은 쇼핑몰 그대로 */
#searchText {
  font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 400; color: var(--vgs-ink);
}

/* [p405 2026-10-11] 대표님 결정(관리 방 01:xx, 안 2 — 쇼핑몰도 ERP 처럼): 페이지 제목·단추를 표준 글꼴·작은 크기·보통 굵기로, 굵은 글씨 안 씀.
   값은 7 방 ERP p211 4판과 같음 — 제목 12.6px(표준 11.2px 의 1.125배), 단추 11.2px·높이 31px(31px 보다 큰 단추만 줄임, 작은 단추·그림 단추는 그대로).
   일부러 강조한 굵은 글씨(가격·주문 금액·할인)는 10-11 서버 1 PC 측정에서 굵게 그려지는 것이 없었음(default.css 가 strong·b 를 보통으로) — 목록은 p405 verify.txt. */
/* 페이지·구역 제목 */
#wrap .hd_mem .title, #wrap .sub_tit1 .title1, #wrap .sub_tit1 .title1 *, #wrap .sub_tit2 .title2,
#wrap .tit_mem, #wrap .tit_mem .h, #wrap .box_choice .title, #wrap .box_choice2 .title, #wrap .inner h2.tit,
#wrap .tbl_info h1.title, #wrap .tbl_info h1.title *, #wrap .tbl_tit .title, #wrap .nav_sch .tit, #wrap .nav_sch .tit * {
  font-family: var(--vgs-font); font-size: 12.6px; font-weight: normal; line-height: 1.3;
}
/* 굵게 기본 제거: 제목·표 머리글(선택 품목 상자 등 table.list 밖 표 포함). 로고(h1.logo)는 그림이라 영향 없음 */
#wrap h1, #wrap h2, #wrap h3, #wrap h4, #wrap h5, #wrap h6 { font-weight: normal; }
#wrap th { font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 300; }   /* table.list 밖 표(선택 품목 상자 13px 등)도 표준 글자 */
/* 단추: 글꼴·11.2px·보통 굵기 */
#wrap .btn-pk, #wrap .btn-pk span, #wrap .btn-pk_re, #wrap button.btn-pk, #wrap a.btn-pk {
  font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: normal;
}
/* 높이 31px: 큰 단추(.b 54px·.b2·.n 38px)와 입력표 옆 회색 단추(40px) — 위아래 여백만 줄임, 폭(min-width)은 그대로 */
#wrap .btn-pk.b, #wrap .btn-pk.b2, #wrap .btn-pk.n, #wrap .btn-pk.gray {
  height: 31px; line-height: 29px; padding-top: 0; padding-bottom: 0; vertical-align: middle;
}

/* [p405 2판 2026-10-11 00:4x] 대표님 기준(7 방 전달): 굵은 글씨는 예외 없이 안 씀 — 합계·총계·금액 강조도 보통 굵기(색 강조는 그대로).
   #wrap 안 모든 글자에 보통 굵기(ID 하나라 화면 class 의 굵게 규칙보다 우선, 위의 표·검색칸 300 같은 더 구체적인 규칙은 그대로) + b·strong·화면 안 style 굵게까지. */
#wrap * { font-weight: normal; }
#wrap b, #wrap strong, #wrap [style*="bold"], #wrap [style*="font-weight"] { font-weight: normal !important; }
#wrap table.list th, #wrap table.list td, #wrap table.view th, #wrap table.view td, #wrap table.write th, #wrap table.write td, #wrap th { font-weight: 300; }

/* [p407 2026-10-11] 새 로고(대표님 지시 03:2x): logo.png 를 2배 해상도(280x98)로 바꿔 화면 높이 49px 로 고정(전 128x49 원래 크기) — 휴대폰은 원래 규칙(높이 48%)대로 */
#wrap .header h1.logo img, #wrap h1.logo a img, h1.logo a img { height: 49px; width: auto; }

/* [p409 2026-10-11] 대표님(04:0x): 검색창 밑줄을 입력 글자 바로 아래로, 안내(p408 회색 한·두 줄)는 그 밑줄 아래로.
   검색 상자(.sch_cont)는 절대 위치(높이 약 196px)라 안내가 상자 안에 있으면 밑줄(상자 아래 선)이 안내 아래로 내려가고 흰 바탕이 아래 내용(마이빙고·장바구니 215px)을 덮음
   → 안내만 상자 밑에 띄우고(상자 높이에서 뺌), 안내가 있을 때만 아래 내용 자리를 그만큼 내림(마이빙고·장바구니 .sub_tit1 215px → 254px, 검색 결과 위 여백). */
#wrap .sch_cont .p400-hint { position: absolute; top: 100%; left: 50%; transform: translateX(-50%); margin-top: 5px; white-space: nowrap; }
#wrap.mypage:has(.sch_cont .p400-hint) .sub_tit1, #wrap.cart:has(.sch_cont .p400-hint) .sub_tit1 { height: 254px; }
#wrap:has(.sch_cont .p400-hint) #container > .inr-c > .sch_txt::before, #wrap:not(.mypage):not(.cart):has(.sch_cont .p400-hint) #container > .inr-c > .sub_tit1::before { content: ""; display: block; height: 40px; }   /* 검색 결과 '… 검색되었습니다'·고객센터 제목을 40px 내림(두 줄 안내 252px 까지). margin 은 위로 겹쳐(collapse) 검색 상자까지 함께 내려가서 빈 칸으로 */

/* [p412 2026-10-11] 빙고 공통 표준(7 방 p236, 대표님 지시 10:3x·10:4x) 쇼핑몰 PC 판: 선택창·펼친 목록·입력칸·안내 글(placeholder)·체크/라디오 옆 글자 = IBM Plex 11.2px·굵기 400,
   입력칸·선택창 높이 22px, 표 칸 위아래 여백 4px(좌우 그대로). 위쪽 큰 검색창(#searchText)은 모양 그대로(글씨만 표준 — p402). 휴대폰은 16px 예외 그대로(p403). 배지는 쇼핑몰 화면에 없음(머리 장바구니 숫자 원은 그대로). */
#wrap input[type="text"]:not(#searchText), #wrap input[type="password"], #wrap input[type="tel"], #wrap input[type="number"], #wrap input[type="email"], #wrap input[type="search"]:not(#searchText),
#wrap select, #wrap select option, #wrap textarea {
  font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 400;
}
#wrap input[type="text"]:not(#searchText), #wrap input[type="password"], #wrap input[type="tel"], #wrap input[type="number"], #wrap input[type="email"], #wrap input[type="search"]:not(#searchText), #wrap select {
  height: 22px; line-height: 20px; padding-top: 0; padding-bottom: 0; box-sizing: border-box;
}
#wrap input::placeholder, #wrap textarea::placeholder { font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 400; }
#wrap label:has(input[type="checkbox"]), #wrap label:has(input[type="radio"]), #wrap input[type="checkbox"] + label, #wrap input[type="radio"] + label {
  font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 400;
}
#wrap table.list th, #wrap table.list td, #wrap table.view th, #wrap table.view td, #wrap table.write th, #wrap table.write td { padding-top: 4px; padding-bottom: 4px; }

/* [p414 2026-10-11] 대표님(11:2x·11:3x) 쇼핑몰 화면 묶음:
   ② 모든 표 줄 높이 약 20% 줄임 — 옛 CSS 의 칸 최소 높이(.tbl_basic td·th 38px, table.write th 40px)를 30px 로(위아래 여백 4px 는 p412)
   ③ 주문서 '주문서1 : 부천점' 머리 = 굵고 크게·붉게(대표님 지정 — 굵은 글씨 없음 원칙의 예외)
   ④ 주문서 안내 글 속 '퀵 가능여부' 글자의 붉은 강조 빼기 ⑤ [배송지 목록]·[퀵 가능여부] 단추 줄과 아래 표 사이 띄우기
   ⑥ 주문서 오른쪽 상자(주문자 정보 값 13px → 표준 11.2px·보통, 결제금액 숫자는 크기 그대로·굵게 없음) */
#wrap .tbl_basic tbody td, #wrap .tbl_basic tbody th, #wrap .tbl_basic thead th, #wrap .tbl_basic table.write th, #wrap table.list td, #wrap table.list th, #wrap table.write td, #wrap table.write th { height: 30px; }
#wrap #container table.list thead th.ta-l[colspan] { font-size: 14px; font-weight: 700; color: #B3261E; }
#wrap p.fz-s1 button.c-red[onclick^="qick_yn"] { color: inherit !important; }
#wrap .area_mem_inp .info > .tit_mem.fl { margin-bottom: 12px; }
#wrap .box_order_total td, #wrap .box_order_total th, #wrap .box_order_total td * { font-family: var(--vgs-font); font-size: var(--vgs-fs); font-weight: 400; }
#wrap .box_order_total th { font-weight: 300; }
#wrap table.list td div.img { height: 40px; width: 40px; }   /* 장바구니·주문서 그림 칸 50~60px → 40px(줄 높이 20% 줄이기) — 그림 칸(div.img)만, 글자 칸(.prd_td)은 그대로 */
#wrap table.list td div.img img { max-width: 40px; max-height: 40px; }