/* 굿스푼 새 스킨 v15 (모바일 한 벌) — 2026-10-10
   원본: ~/goodspoon-skin/prototype (base.css + themes/t05.css 민트) 를 고도몰 모바일 스킨 구조에 맞춰 옮김
   - 대표 10/10: 모바일 한 벌로 통일 · PC 손님도 m. 으로 넘어와 넓은 화면에서는 500px 가운데
   - 대표 10/10: 메인 색 = 민트 · 검정 면 대신 다른 색 · 어두워지지 않게 · 주황은 할인·특가 전용
   - 이 파일은 _header.html 에서 다른 CSS 뒤에 붙는다(덮어쓰기 전용) */

:root {
  --gs-page: #f1eee8; --gs-app: #fffcf7; --gs-surface: #f5f1ea; --gs-text: #24190f; --gs-sub: #5e4f40; --gs-muted: #7d6c5c; --gs-line: #ece5db;
  --gs-accent: #2CD3A0; --gs-accent-text: #053B31; --gs-accent-ink: #00785F; --gs-tint: #E6F8F2; --gs-band: #EEF9F5;
  --gs-sale: #ff6d37; --gs-rate: #C2410C;
  --gs-radius: 16px; --gs-card-radius: 14px; --gs-gutter: 20px;
  --gs-font: 'Pretendard', 'Pretendard Variable', -apple-system, 'Apple SD Gothic Neo', sans-serif;
}

/* ── 바탕·글꼴 ── */
html { background: var(--gs-page); }
body { background: var(--gs-page); color: var(--gs-text); font-family: var(--gs-font); -webkit-font-smoothing: antialiased; word-break: keep-all; letter-spacing: -0.02em; }
body, input, select, textarea, button, table { font-family: var(--gs-font); }
#wrap { background: var(--gs-app); max-width: 500px; margin: 0 auto; min-height: 100vh; position: relative; }

/* ── 머리글 ── */
#header_wrap header { background: rgba(255, 252, 247, .97); }
#header_wrap header.h_on { box-shadow: 0 1px 0 var(--gs-line); }
.gs-strip { display: flex; align-items: center; justify-content: center; gap: 6px; height: 34px; padding: 0 var(--gs-gutter); font-size: 12px; font-weight: 600; background: var(--gs-tint); color: #05443A; }
.gs-strip b { color: var(--gs-accent-ink); font-weight: 800; }
#header_wrap header .header_box { display: flex; align-items: center; justify-content: space-between; height: 52px; padding: 0 12px 0 var(--gs-gutter); }
#header_wrap header .header_box .h_logo { height: auto; padding: 0; margin: 0; text-align: left; line-height: 0; }
#header_wrap header .header_box .h_logo a { display: inline-block; }
#header_wrap header .header_box .h_logo img { height: 26px; width: auto; margin: 0; }
#header_wrap header .header_box .left_menu { display: none; }
#header_wrap header .header_box .right_menu { position: static; display: flex; gap: 2px; }
#header_wrap header .header_box .right_menu li { display: block; }
#header_wrap header .header_box .right_menu a { display: grid; place-items: center; width: 40px; height: 40px; padding: 0; color: var(--gs-text); position: relative; }
#header_wrap header .header_box .right_menu svg { width: 24px; height: 24px; }
#header_wrap header .header_box .btn_cart strong { right: 2px; top: 3px; width: 17px; height: 17px; line-height: 17px; font-size: 11px; font-weight: 700; background: var(--gs-accent); color: var(--gs-accent-text); }
#header_wrap header .hd_search { padding: 0 var(--gs-gutter) 10px; }
#wrap #header_wrap ._header_search { width: 100%; }
#wrap #header_wrap ._header_search .layer_search_box { border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px #e6ece8; }
#wrap #header_wrap ._header_search .layer_search_box dl dd .keyword_box input { height: 42px; background: transparent; color: var(--gs-text); font-size: 16px; text-indent: 18px; }   /* v18j: 16px(아이폰 확대 방지) */
#wrap #header_wrap ._header_search .layer_search_box dl dd .keyword_box input::placeholder { color: var(--gs-muted); }

/* 가로 탭 7개 */
.gs-tabs { display: flex; gap: 20px; overflow-x: auto; padding: 0 var(--gs-gutter); scrollbar-width: none; border-bottom: 1px solid var(--gs-line); background: rgba(255, 252, 247, .97); }
.gs-tabs::-webkit-scrollbar { display: none; }
.gs-tabs a { flex: 0 0 auto; height: 44px; display: flex; align-items: center; font-size: 15px; font-weight: 500; color: var(--gs-muted); border-bottom: 3px solid transparent; margin-bottom: -1px; }
.gs-tabs a.on { color: var(--gs-accent-ink); font-weight: 700; border-bottom-color: var(--gs-accent); }
#header_wrap .header_lnb { display: none; }   /* 옛 카테고리 줄 — 새 탭으로 바꿈(카테고리는 아래 탭바 «카테고리»로) */

/* 하위 화면 머리(뒤로·제목) */
.sub_top { background: var(--gs-app); border-bottom: 1px solid var(--gs-line); }
.sub_top h2 { font-size: 16px; font-weight: 700; color: var(--gs-text); }

/* ── 메인 ── */
.gs-main { padding-bottom: 8px; }
.gs-hero { position: relative; padding: 16px var(--gs-gutter) 0; }
.gs-hero-track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; border-radius: 16px; background: #fff; }
.gs-hero-track::-webkit-scrollbar { display: none; }
.gs-slide { flex: 0 0 100%; scroll-snap-align: start; position: relative; aspect-ratio: 16 / 10; overflow: hidden; display: block; background: #fff; }
.gs-slide img { width: 100%; height: 100%; object-fit: cover; object-position: right bottom; }
.gs-slide-txt { position: absolute; left: 18px; top: 18px; right: 40%; color: var(--gs-text); }
.gs-slide-txt .k { display: inline-block; font-size: 11px; font-weight: 700; color: var(--gs-accent-ink); background: var(--gs-tint); border-radius: 8px; padding: 1px 7px; }
.gs-slide-txt h2 { margin: 8px 0 0; font-size: 20px; line-height: 1.32; font-weight: 800; letter-spacing: -0.035em; white-space: pre-line; }
.gs-slide-txt p { margin-top: 6px; font-size: 12px; line-height: 1.45; color: var(--gs-sub); white-space: pre-line; }
.gs-hero-count { position: absolute; right: calc(var(--gs-gutter) + 12px); bottom: 12px; z-index: 2; padding: 3px 9px; border-radius: 999px; background: rgba(36, 25, 15, .38); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: 0; font-variant-numeric: tabular-nums; }

/* 바로가기 8칸 */
.gs-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px 8px; padding: 20px var(--gs-gutter) 4px; }
.gs-tile { display: flex; flex-direction: column; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; text-align: center; color: var(--gs-text); letter-spacing: -0.02em; white-space: nowrap; }
.gs-tile-img { position: relative; width: 100%; max-width: 60px; aspect-ratio: 1; border-radius: 16px; background: var(--tile, var(--gs-surface)); display: grid; place-items: center; }
.gs-tile-img img { width: 70%; height: 70%; object-fit: contain; }
.gs-tile-badge { position: absolute; top: -5px; right: -8px; padding: 0 5px; border-radius: 999px; font-size: 11px; font-weight: 700; line-height: 16px; font-style: normal; letter-spacing: -0.02em; white-space: nowrap; background: var(--gs-tint); color: var(--gs-accent-ink); box-shadow: 0 0 0 2px var(--gs-app); }
.gs-tile:first-child .gs-tile-badge { background: var(--gs-sale); color: var(--gs-text); }
.gs-tile:nth-child(8n+1) { --tile: #ffe9df; } .gs-tile:nth-child(8n+2) { --tile: #e3f6ef; } .gs-tile:nth-child(8n+3) { --tile: #ffe8e3; } .gs-tile:nth-child(8n+4) { --tile: #e9f3e3; }
.gs-tile:nth-child(8n+5) { --tile: #fff3d6; } .gs-tile:nth-child(8n+6) { --tile: #e3f6ef; } .gs-tile:nth-child(8n+7) { --tile: #eceaf6; } .gs-tile:nth-child(8n+8) { --tile: #fff3d6; }

/* 공통 칸 머리 */
.gs-sec { padding-top: 36px; }
.gs-sec-hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; padding: 0 var(--gs-gutter) 14px; }
.gs-sec-hd h3 { font-size: 20px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); }
.gs-sec-hd .sub { margin-top: 3px; font-size: 13px; color: var(--gs-muted); }
.gs-more { flex: 0 0 auto; font-size: 13px; color: var(--gs-muted); }
.gs-more::after { content: ' ›'; }
/* 진열 위젯이 붙이는 옛 제목은 숨긴다(칸 제목은 gs-sec-hd 하나) */
.gs-main ._goods_display_main .main_title_box, .gs-main ._goods_display_main .btn_box { display: none; }
.gs-main ._goods_display_main .contents { padding: 0 var(--gs-gutter); }

/* ── 상품 카드(고도몰 목록 틀 list_01 그대로 · 모양만) ──
   옛 gd_layout.css 가 #wrap #container … (아이디 2개)로 걸어 두어서 같은 무게 + !important 로 덮는다 */
#wrap ._goods_display_main .main_prd_list { padding: 0 var(--gs-gutter) !important; margin: 0 !important; text-align: left; font-size: 14px; }
#wrap .gd_list_custom { display: block !important; width: auto !important; margin: 0 !important; padding: 0 !important; float: none !important; position: relative; font-size: 14px; }
#wrap .gd_list_custom .goods_prd_item2_box { position: relative; }
#wrap .gd_list_custom .item_icon_area { display: none !important; }
#wrap .gd_list_custom .goods_prd_img { width: 100% !important; padding: 0 !important; }
#wrap .gd_list_custom .goods_prd_img .img_box { position: relative; border-radius: var(--gs-card-radius); overflow: hidden; background: var(--gs-surface); aspect-ratio: 1; box-shadow: 0 6px 18px rgba(60, 50, 30, .07); }
#wrap .gd_list_custom .goods_prd_img .img_box a { display: block; width: 100%; height: 100%; }
#wrap .gd_list_custom .goods_prd_img .img_box .img { width: 100%; height: 100%; border-radius: 0; }
#wrap .gd_list_custom .goods_prd_img .img_box .img img { width: 100%; height: 100%; object-fit: cover; }
#wrap .main_content .gd_list_custom .goods_prd_img .item_dc { display: none !important; }
#wrap #container .gd_list_custom .goods_prd_content { padding: 10px 0 0 !important; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list { min-height: 0; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list li { font-size: 13px; line-height: 1.45; color: var(--gs-sub); }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list li:not(.fixed_price):not(.item_dc) { display: block !important; float: none !important; width: auto !important; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list li.prd_name { font-size: 14px; font-weight: 500; line-height: 20px; height: 40px; padding: 0; color: var(--gs-text); white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; letter-spacing: -0.03em; word-break: keep-all; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list .price { margin-top: 4px; font-size: 16px; line-height: 22px; font-weight: 800; color: var(--gs-text); letter-spacing: -0.02em; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list .price span, #wrap #container .gd_list_custom .goods_prd_content .goods_info_list .price em { font-size: inherit; font-weight: inherit; vertical-align: baseline; font-family: inherit; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list .price em { font-size: 14px; font-weight: 700; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list .fixed_price { display: none !important; }   /* 취소선 정가 숨김(대표 10/8 — 정가 실판매 기록 0) */
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list li.short_des { font-size: 12px; color: var(--gs-muted); height: auto; }
#wrap #container .gd_list_custom .goods_prd_content .goods_info_list li[style*="f95a29"] { color: var(--gs-accent-ink) !important; font-weight: 600; font-size: 12px !important; }
#wrap #container .gd_list_custom .goods_prd_content li.item_dc { display: none !important; }
/* 담기 버튼 = 사진 오른쪽 아래 흰 동그라미 */
#wrap .gd_list_custom .item_link { box-sizing: border-box !important; position: absolute !important; top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important; width: 100% !important; height: auto !important; aspect-ratio: 1; padding: 8px; pointer-events: none; display: flex; align-items: flex-end; justify-content: flex-end; margin: 0; }
#wrap .gd_list_custom .item_link li { pointer-events: auto; }
#wrap #container .gd_list_custom .goods_prd_content, #wrap #container .gd_list_custom .goods_prd_content .goods_list_info { position: static !important; }
#wrap .gd_list_custom .item_link .related_cart_btn { position: static !important; width: 32px !important; height: 32px !important; border-radius: 50%; border: 0 !important; font-size: 0; color: transparent; cursor: pointer; background: #fff url("../img/gs/ui_add.svg") center / 18px no-repeat !important; box-shadow: 0 0 0 1.5px #bfe9da, 0 2px 6px rgba(0, 0, 0, .06); }
#wrap .gd_list_custom .soldout_img { border-radius: var(--gs-card-radius); }

/* 가로로 넘기는 줄(핫딜) */
#wrap .gs-row .main_prd_list { display: flex !important; gap: 12px; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; scroll-padding: 0 var(--gs-gutter); }
#wrap .gs-row .main_prd_list::-webkit-scrollbar { display: none; }
#wrap .gs-row .main_prd_list > li.gd_list_custom { flex: 0 0 40% !important; width: 40% !important; scroll-snap-align: start; }
#wrap .gs-row .main_prd_list > li.no_bx { flex-basis: 100% !important; width: 100% !important; }
/* 두 칸 바둑판(테마 탭 · 목록 화면) */
#wrap .gs-grid .main_prd_list, #wrap .goods_list .goods_product_list, #wrap .goods_main .main_prd_list, #wrap .goods_main .goods_product_list, #wrap .goods_search .goods_product_list { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px 12px; padding: 0 var(--gs-gutter) !important; margin: 0 !important; }
#wrap .goods_list .goods_product_list::after, #wrap .goods_main .goods_product_list::after, #wrap .goods_search .goods_product_list::after { display: none; }
/* [10/13] 베스트·골라담기(goods_main.php — 진열 목록은 ul.goods_product_list · main_prd_list 가 아니다)가 1줄 1개로 나오던 원인 = 위 줄에 goods_main 목록이 빠져 있었고
   카드 규칙(#wrap .gd_list_custom { width:auto; float:none } · 10/10 64cfc8a)이 고도몰의 반 폭 float 를 지웠다 → 같은 2칸 바둑판에 넣음 ·
   목록 보기를 «리스트(02)·큰 사진(09)»으로 바꾸면 그 카드는 한 줄을 다 쓴다 */
#wrap .goods_list .goods_product_list > li.goods_prd_item, #wrap .goods_list .goods_product_list > li.goods_prd_item1, #wrap .goods_search .goods_product_list > li.goods_prd_item, #wrap .goods_search .goods_product_list > li.goods_prd_item1, #wrap .goods_main .goods_product_list > li.goods_prd_item, #wrap .goods_main .goods_product_list > li.goods_prd_item1 { grid-column: 1 / -1; width: 100% !important; min-width: 0; max-width: 100%; float: none !important; box-sizing: border-box; table-layout: fixed; }
#wrap .gs-grid .main_prd_list::after { display: none; }
/* [10/21] 검색 «더보기» 뒤 바둑판 구멍(대표 10:5x · 닭가슴살) — 고도몰 목록 조각(goods/list/list_01·02·09·11) 끝의 찜 폼 <form id="frmWishTemplateView">(숨은 칸 3개뿐)이
   ul.goods_product_list 안에 같이 그려져 바둑판 칸 하나를 먹었다 · 더보기는 조각을 통째로 이어 붙여(append) 쪽마다 한 벌 더 → 첫 쪽 끝 왼쪽 칸이 비고 다음 카드가 한 칸씩 밀림 ·
   보기 09·02 = 그 자리 줄 사이 24px · 첫 화면 = 목록 아래 빈 줄 12px · 뒤로 가기(세션에 저장한 목록 되살림)도 같음 → 폼은 칸을 안 차지하게(값·serialize·submit 은 그대로)
   · 시험 tools/buy_qa/searchgrid1021_check.mjs */
#wrap .goods_product_list > form#frmWishTemplateView { display: none !important; }

/* 베스트 = 번호 목록(1~) */
#wrap .gs-best .main_prd_list { display: flex !important; flex-direction: column; gap: 12px; counter-reset: gsrank; }
#wrap .gs-best .main_prd_list > li.gd_list_custom { counter-increment: gsrank; }
#wrap .gs-best .gd_list_custom .goods_prd_item2_box { display: flex; align-items: center; gap: 12px; }
#wrap .gs-best .gd_list_custom .goods_prd_item2_box::before { content: counter(gsrank); flex: 0 0 18px; text-align: center; font-size: 18px; font-weight: 800; color: var(--gs-accent-ink); font-variant-numeric: tabular-nums; }
#wrap .gs-best .gd_list_custom .goods_prd_img { flex: 0 0 72px; width: 72px !important; }
#wrap .gs-best .gd_list_custom .goods_prd_img .img_box { border-radius: 12px; box-shadow: none; }
#wrap #container .gs-best .gd_list_custom .goods_prd_content { flex: 1; min-width: 0; padding: 0 !important; }
#wrap #container .gs-best .gd_list_custom .goods_prd_content .goods_info_list li.prd_name { height: auto; font-weight: 600; }
#wrap #container .gs-best .gd_list_custom .goods_prd_content .goods_info_list .price { font-size: 15px; margin-top: 3px; }
#wrap .gs-best .gd_list_custom .item_link { display: none !important; }
#wrap .gs-best .main_prd_list > li:nth-child(n+11) { display: none !important; }

/* 테마 칩 */
.gs-chips { display: flex; gap: 8px; overflow-x: auto; padding: 0 var(--gs-gutter) 16px; scrollbar-width: none; }
.gs-chips::-webkit-scrollbar { display: none; }
.gs-chips a { flex: 0 0 auto; height: 34px; padding: 0 14px; display: flex; align-items: center; border: 1px solid #e6ece8; background: #fff; color: var(--gs-sub); border-radius: 999px; font-size: 13px; font-weight: 500; white-space: nowrap; }
.gs-chips a.on { background: var(--gs-tint); border-color: var(--gs-accent-ink); color: var(--gs-accent-ink); font-weight: 700; }
.gs-theme .tab_cont { display: none; }
.gs-theme .tab_cont.on { display: block; }

/* 가입 유도 */
.gs-join { margin: 36px var(--gs-gutter) 0; padding: 18px 20px; border-radius: var(--gs-radius); background: var(--gs-tint); color: var(--gs-text); display: flex; align-items: center; gap: 14px; }
.gs-join-txt { flex: 1; min-width: 0; }
.gs-join h4 { font-size: 15px; font-weight: 700; line-height: 1.35; letter-spacing: -0.03em; }
.gs-join p { margin-top: 2px; font-size: 13px; color: var(--gs-sub); }
.gs-btn { display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 999px; background: var(--gs-accent); color: var(--gs-accent-text); height: 38px; padding: 0 16px; font-size: 13px; font-weight: 700; white-space: nowrap; }

/* 후기 */
.gs-reviews { display: flex; gap: 12px; overflow-x: auto; padding: 0 var(--gs-gutter) 4px; scrollbar-width: none; scroll-snap-type: x proximity; scroll-padding: 0 var(--gs-gutter); }
.gs-reviews::-webkit-scrollbar { display: none; }
.gs-rv { flex: 0 0 72%; scroll-snap-align: start; display: flex; gap: 12px; padding: 14px; border-radius: var(--gs-radius); background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); }
.gs-rv-img { flex: 0 0 64px; width: 64px; height: 64px; border-radius: 12px; overflow: hidden; background: var(--gs-surface); }
.gs-rv-img img { width: 100%; height: 100%; object-fit: cover; }
.gs-rv-txt { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.gs-rv-star { color: #f5a524; font-size: 12px; letter-spacing: 1px; }
.gs-rv-sub { font-size: 14px; font-weight: 700; line-height: 1.35; color: var(--gs-text); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.gs-rv-body { font-size: 13px; line-height: 1.45; color: var(--gs-sub); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* 이 달의 혜택 */
.gs-events { display: grid; grid-template-columns: 1fr; gap: 12px; padding: 0 var(--gs-gutter); }
.gs-evt { display: block; border-radius: var(--gs-radius); overflow: hidden; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); }
.gs-evt-img, .gs-evt-txt { display: block; }
.gs-evt-img img { width: 100%; display: block; }
.gs-evt-txt { padding: 12px 14px; }
.gs-evt-txt b { display: block; font-size: 14px; font-weight: 700; color: var(--gs-text); }
.gs-evt-txt span { font-size: 12px; color: var(--gs-muted); }

/* ── 바닥글(옛 바닥글 마크업 그대로 · 밝은 바탕에 맞게 다시 칠함) ── */
#wrap #footer { margin: 40px 0 0; background: var(--gs-app); border-top: 1px solid var(--gs-line); }
#wrap #footer footer { background: transparent; }
.gs-ft-logo { padding: 26px var(--gs-gutter) 0; }
.gs-ft-logo img { height: 22px; width: auto; opacity: .4; }
#wrap #footer .foot_cont_box { margin-top: 0; padding: 18px var(--gs-gutter) 20px; border-top: 0; }
#wrap #footer .foot_cont { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
#wrap #footer .foot_cont > div + div { margin-top: 0; }
#wrap #footer .foot_cont div h3 { font-size: 12px; color: var(--gs-muted); font-weight: 600; margin-bottom: 6px; letter-spacing: 0; }
#wrap #footer .foot_cont .foot_cs .cs_num { margin-top: 0; }
#wrap #footer .foot_cont .foot_cs .cs_num a { font-size: 20px; color: var(--gs-text); font-weight: 800; letter-spacing: -0.01em; }
#wrap #footer .foot_cont .foot_cs .cs_hours { margin-top: 4px; }
#wrap #footer .foot_cont .foot_cs .cs_hours span { font-size: 12px; color: var(--gs-muted); font-family: inherit; }
#wrap #footer .foot_cont .foot_bank p { margin: 0 0 4px; }
#wrap #footer .foot_cont .foot_bank .bank_name { font-size: 12px; color: var(--gs-sub); margin: 0; line-height: 1.4; }
#wrap #footer .foot_cont .foot_bank p strong { display: block; margin-top: 2px; font-size: 14px; color: var(--gs-text); font-weight: 700; line-height: 1.4; }
#wrap #footer .foot_cont .foot_bank .depositer { border: 0; padding: 0; font-size: 12px; color: var(--gs-muted); }
#wrap #footer .quick_menu { background: transparent; padding: 0 var(--gs-gutter); }
#wrap #footer .quick_menu ul { display: flex; flex-wrap: wrap; gap: 6px; }
#wrap #footer .quick_menu ul::after { display: none; }
#wrap #footer .quick_menu ul li { float: none; width: auto; border: 0 !important; }
#wrap #footer .quick_menu ul li a { padding: 7px 12px; border-radius: 999px; background: var(--gs-surface); font-size: 12px; color: var(--gs-sub); }
#wrap #footer .foot_info_box { background: transparent; padding: 18px var(--gs-gutter) 28px; text-align: left; }
#wrap #footer .ft_menu { margin: 0 0 12px; text-align: left; }
#wrap #footer .ft_menu li { padding: 0; }
#wrap #footer .ft_menu li + li { padding-left: 14px; }
#wrap #footer .ft_menu li a { color: var(--gs-sub); font-size: 12px; font-weight: 600; }
#wrap #footer .foot_info, #wrap #footer .foot_info address, #wrap #footer .foot_info address * { color: var(--gs-muted) !important; font-size: 12px; line-height: 1.75; font-style: normal; text-align: left; }
#wrap #footer .foot_info .copy { color: var(--gs-muted) !important; font-size: 12px; margin-top: 10px; }
#wrap #footer .foot_sns, #wrap #footer .foot_certify { padding-top: 10px; text-align: left; }
.gs-has-tabbar #footer { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }

/* ── 하단 탭바 ── */
.gs-tabbar { position: fixed; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 400; width: 100%; max-width: 500px; display: grid; grid-template-columns: repeat(5, 1fr);
  background: rgba(255, 252, 247, .97); border-top: 1px solid var(--gs-line); padding: 7px 0 calc(7px + env(safe-area-inset-bottom)); }
.gs-tabbar a { display: flex; flex-direction: column; align-items: center; gap: 3px; font-size: 12px; font-weight: 500; color: var(--gs-muted); }
.gs-tabbar a svg { width: 24px; height: 24px; }
.gs-tabbar a.on { color: var(--gs-accent-ink); font-weight: 700; }
.gs-has-tabbar .kakao_ch { bottom: calc(76px + env(safe-area-inset-bottom)); }

/* ── 버튼·색(옛 주황 → 민트) ── */
.btn_order_buy, .btn_add_order, .btn_claim_ok, .btn_member_join, .member_login_box .btn_login, .btn_confirm_js { background: var(--gs-accent) !important; border-color: var(--gs-accent) !important; color: var(--gs-accent-text) !important; }

/* ── 넓은 화면(PC 손님): 500px 가운데 · 화면 고정 요소도 500px ── */
@media (min-width: 520px) {
  #wrap { box-shadow: 0 0 0 1px rgba(0, 0, 0, .03), 0 30px 80px rgba(0, 0, 0, .06); }
  #header_wrap header.h_on { left: 50% !important; width: 500px !important; min-width: 0; margin-left: -250px; }
  #wrap nav, #wrap nav .bg { left: 50% !important; width: 500px !important; margin-left: -250px; }
  #wrap nav .nav_bg_box .nav_box { left: 50% !important; width: 500px !important; transform: translateX(-50%); }
  .ly_pop { left: 50% !important; width: 500px !important; margin-left: -250px !important; }
  .ly_pop .ly_wrap { width: 100% !important; }
  .detail_buy, .goods_view .detail_tab_info, .goods_view .ly_share, .brand_wrap .brand_search_box.h_on, .simple_join_push,
  .layer_option .popup_dn, .layer_coupon_apply .btn_box, .layer_coupon_apply_order .btn_box, .plus_review_popup_alike_search .btn_box {
    left: 50% !important; width: 500px !important; margin-left: -250px !important; }
  .kakao_ch { right: calc(50% - 250px + 14px); }
}

/* 등장 애니메이션(AOS) 끔 — 새 메인은 바로 보이게(카드가 투명하게 남는 일 방지) */
[data-aos] { opacity: 1 !important; transform: none !important; transition: none !important; }
.gs-hero-track { scroll-behavior: smooth; }
#wrap #footer .foot_info address { padding: 0 !important; margin: 0; }

/* 상세 — 취소선 정가 숨김(대표 10/8 «정가 실판매 기록 0 → 취소선·할인율 숨김») */
#wrap .goods_view .detail_info_top .price_box del, #wrap .goods_view .detail_info_top .price_box .won1 { display: none !important; }
#wrap .goods_view .detail_info_top .price_box .price { color: var(--gs-text); font-weight: 800; }

/* 목록 화면 — 하위 분류 알약 · 정렬 줄 */
#wrap .goods_list .goods_list_category { padding: 14px var(--gs-gutter) 4px; background: transparent; border: 0; }
#wrap .goods_list .goods_list_category ul { display: flex; flex-wrap: wrap; gap: 6px; }
#wrap .goods_list .goods_list_category ul li { float: none; width: auto; margin: 0; padding: 0; border: 0; }
#wrap .goods_list .goods_list_category ul li a { display: inline-flex; align-items: center; gap: 3px; height: 32px; padding: 0 12px; border-radius: 999px; background: #fff; box-shadow: inset 0 0 0 1px #e6ece8; font-size: 13px; color: var(--gs-sub); }
#wrap .goods_list .goods_list_category ul li a span { color: var(--gs-muted); font-size: 12px; }
#wrap .goods_list .goods_list_category ul li.selected a { background: var(--gs-tint); box-shadow: inset 0 0 0 1px var(--gs-accent-ink); color: var(--gs-accent-ink); font-weight: 700; }
#wrap .goods_list .goods_top_box { padding: 12px var(--gs-gutter); background: transparent; border: 0; }

/* [GS-SEO 2026-10-11] 상세 «한눈에 보는 정보» · 메인 소개 글 — 검색엔진·AI 가 읽는 글자(tools/seo_gen.py 가 HTML 을 만든다) */
.gs-facts { margin: 18px var(--gs-gutter) 8px; padding: 18px 18px 14px; background: var(--gs-surface); border-radius: var(--gs-radius); color: var(--gs-text); }
.gs-facts-h { margin: 0 0 10px; font-size: 16px; font-weight: 800; letter-spacing: -0.03em; }
.gs-facts-dl { display: grid; grid-template-columns: 64px 1fr; gap: 7px 12px; margin: 0; font-size: 13px; line-height: 1.5; }
.gs-facts-dl dt { color: var(--gs-muted); font-weight: 600; }
.gs-facts-dl dd { margin: 0; color: var(--gs-text); word-break: keep-all; }
.gs-facts-nut { margin-top: 14px; max-width: 100%; overflow-x: auto; }   /* 10/21 표가 화면보다 넓어 상세 전체가 옆으로 밀림(오른쪽 회색 여백) → 칸 안에서 맞춤 */
.gs-facts-nut h3 { margin: 0 0 8px; font-size: 14px; font-weight: 800; }
.gs-facts-nut table { width: 100%; table-layout: fixed; border-collapse: collapse; font-size: 12px; text-align: right; }
.gs-facts-nut th, .gs-facts-nut td { padding: 6px 3px; border-bottom: 1px solid var(--gs-line); font-weight: 500; overflow-wrap: anywhere; }
.gs-facts-nut thead th { color: var(--gs-muted); font-weight: 600; font-size: 12px; line-height: 1.3; vertical-align: bottom; white-space: normal; word-break: keep-all; }
.gs-facts-nut thead th:first-child, .gs-facts-nut tbody th { width: 34%; }
.gs-facts-nut tbody th { text-align: left; color: var(--gs-text); font-weight: 600; word-break: keep-all; }
.gs-facts-note { margin: 8px 0 0; font-size: 12px; color: var(--gs-muted); }
.gs-about { margin: 28px var(--gs-gutter) 12px; padding-top: 18px; border-top: 1px solid var(--gs-line); color: var(--gs-sub); font-size: 13px; line-height: 1.65; }
.gs-about-h { margin: 0 0 6px; font-size: 15px; font-weight: 800; color: var(--gs-text); letter-spacing: -0.03em; }
.gs-about p { margin: 0 0 4px; word-break: keep-all; }

/* [v16b 2026-10-11] 휴대폰 폭 사진 배치(대표 «모바일에서는 이미지가 더 최적화되게») — 쿠캣·시안 360·390·500 실측(source/bench/모바일사진배치·카테고리밀도_2026-10-11.md)
   ≤420px 만 바깥 여백 20→14·카드 사이 12→8 → 사진 폭 약 43%→45%(면적 +10%) · 500px(PC)은 그대로 */
@media (max-width: 420px) {
  #wrap .gs-grid .main_prd_list, #wrap .goods_list .goods_product_list, #wrap .goods_main .main_prd_list, #wrap .goods_main .goods_product_list, #wrap .goods_search .goods_product_list { padding: 0 14px !important; column-gap: 8px; row-gap: 22px; }
}
@media (max-width: 380px) {
  #wrap .gs-grid .main_prd_list, #wrap .goods_list .goods_product_list, #wrap .goods_main .main_prd_list, #wrap .goods_main .goods_product_list, #wrap .goods_search .goods_product_list { row-gap: 16px; }
}

/* [GS v18j 2026-10-17 · v18o 이식 P-A] 전 화면 점검(대표 10/15) 공통
   ② 글자 입력칸 16px — 아이폰 사파리는 16px 보다 작은 입력칸을 누르면 화면을 확대하고 안 돌아온다(시안 pages.css .inp·.sel·.srch input = 16px)
   ④ Tab·키보드로 옮긴 초점이 아래 탭바·따라다니는 배너·구매 막대(최대 140px)에 가리지 않게(위쪽은 각 화면 scroll-margin 이 맡는다) */
#wrap input[type="text"], #wrap input[type="search"], #wrap input[type="tel"], #wrap input[type="email"], #wrap input[type="password"], #wrap input[type="number"],
#wrap input:not([type]), #wrap select, #wrap textarea { font-size: 16px !important; }
/*   P4 10/17: 위 규칙(id 1개)이 화면별 «15px !important»(id 2개 · gs_v16_member·mypage·order(로그인)·board(검색)·plan(브랜드 검색))에 져서
     로그인·회원가입·찾기·회원정보 변경·비밀번호 확인·탈퇴·게시판 검색·고객센터 검색이 15px(아이폰 확대)이었다 → 같은 규칙을 id 3겹으로 한 번 더(화면별 파일은 안 고침) */
#wrap#wrap#wrap input[type="text"], #wrap#wrap#wrap input[type="search"], #wrap#wrap#wrap input[type="tel"], #wrap#wrap#wrap input[type="email"], #wrap#wrap#wrap input[type="password"], #wrap#wrap#wrap input[type="number"],
#wrap#wrap#wrap input:not([type]), #wrap#wrap#wrap select, #wrap#wrap#wrap textarea { font-size: 16px !important; }
html { scroll-padding-bottom: 140px; }