/* 굿스푼 새 스킨 v16 상세·구매 창 — 2026-10-13 (시안 v17c detail.html → 실제 스킨)
   원본: ~/goodspoon-skin/prototype/pages.css 의 상세(.dt-*·.dl·.blk·.rv-src·.with·.dtabs·.buybar)·아래에서 올라오는 창(.bs·.opt·.qty·.pickcount·.steps)
   - 상세 = goods/goods_view.html 의 .goods_view.gs-dt 안 · 칸 채우기는 js/gs_v16_detail.js
   - 구매 창 = 고도몰 옵션 레이어(goods/layer_option.html) — 상세(.detail_buy 안 .st_buy_content)·목록/메인 «담기»(#popupOption) 둘 다
   - 이름은 gs- 로 시작 · 고도몰 이름은 모양만 덮는다(옛 CSS 가 세서 #wrap 무게 + 필요한 곳만 !important)
   - 색은 gs_v15.css 의 --gs-* 그대로 · 주황은 쿠폰·특가 글자에만
   - 이 파일은 _header.html 에서 gs_v16.css 다음 줄에 붙는다 */

.gs-hide { display: none !important; }

/* ── 상세: 바탕 ── */
#wrap .goods_view.gs-dt { background: var(--gs-app); padding-bottom: 84px; }
#wrap .goods_view.gs-dt .detail_tab_info { display: none !important; }   /* 고도몰 «INFO» 떠 있는 단추 — 아래 탭 4칸이 같은 일을 한다 */

/* ── ① 사진 넘김(고도몰 slick 그대로 · 정사각 · 점·번호) ── */
#wrap .goods_view.gs-dt .cont_detail { position: relative; padding: 0; background: var(--gs-surface); }
#wrap .goods_view.gs-dt .goods_view_image_slider img { display: block; width: 100%; aspect-ratio: 1; object-fit: cover; }
#wrap .goods_view.gs-dt .goods_view_image_slider .slick-dots { position: absolute; left: 0; right: 0; bottom: 18px; height: auto; margin: 0; display: flex; justify-content: center; gap: 5px; pointer-events: none; }
#wrap .goods_view.gs-dt .goods_view_image_slider .slick-dots li { margin: 0; pointer-events: auto; }
#wrap .goods_view.gs-dt .goods_view_image_slider .slick-dots li button { width: 6px; height: 6px; border-radius: 4px; background: rgba(255, 255, 255, .55) !important; transition: width .2s; }
#wrap .goods_view.gs-dt .goods_view_image_slider .slick-dots li.slick-active button { width: 16px; background: #fff !important; }
#wrap .goods_view.gs-dt .gs-gal-n { position: absolute; right: 16px; bottom: 16px; z-index: 2; padding: 4px 10px; border-radius: 999px; background: rgba(36, 25, 15, .55); color: #fff; font-size: 12px; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: 0; pointer-events: none; }

/* ── ② 이름·값 칸 ── */
#wrap .goods_view.gs-dt .detail_info { border: 0; }
#wrap .goods_view.gs-dt .detail_info .detail_info_top { padding: 18px var(--gs-gutter) 22px; border: 0; }
.goods_view.gs-dt .gs-dt-crumb { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 18px; font-size: 13px; color: var(--gs-muted); }
.goods_view.gs-dt .gs-dt-rvlink { display: inline-flex; align-items: center; gap: 3px; margin-left: auto; color: var(--gs-sub); font-weight: 600; }
.goods_view.gs-dt .gs-dt-rvlink svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 1.8; }
#wrap .goods_view.gs-dt .detail_info .prd_icon { padding: 8px 0 0; }
#wrap .goods_view.gs-dt .detail_info .brand { padding: 8px 0 0; font-size: 13px; color: var(--gs-muted); }
.goods_view.gs-dt .gs-dt-name { margin-top: 8px; display: flex; align-items: flex-start; gap: 10px; }
#wrap .goods_view.gs-dt .detail_info .gs-dt-name h3 { flex: 1; min-width: 0; margin: 0; font-size: 20px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); word-break: keep-all; }
#wrap .goods_view.gs-dt .gs-dt-share { flex: 0 0 auto; width: 36px; height: 36px; padding: 0; border-radius: 50%; border: 1px solid var(--gs-line); background: #fff; display: grid; place-items: center; color: var(--gs-sub); }
#wrap .goods_view.gs-dt .gs-dt-share svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.8; }
.goods_view.gs-dt .gs-dt-taste { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--gs-sub); }
.goods_view.gs-dt .gs-dt-tags { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px; }
.goods_view.gs-dt .gs-dt-tags span { font-size: 12px; font-weight: 700; line-height: 24px; padding: 0 9px; border-radius: 8px; background: var(--gs-band); color: var(--gs-accent-ink); }
#wrap .goods_view.gs-dt .detail_info .price_box { margin-top: 16px; font-size: 13px; color: var(--gs-sub); }
#wrap .goods_view.gs-dt .detail_info .price_box .price, #wrap .goods_view.gs-dt .detail_info .price_box .won { font-size: 24px; font-weight: 800; letter-spacing: -0.02em; color: var(--gs-text); }
#wrap .goods_view.gs-dt .detail_info .price_box .gs-tilde { font-size: 24px; font-weight: 800; color: var(--gs-text); margin-left: 1px; }
#wrap .goods_view.gs-dt .detail_info .price_box .coupon_price, #wrap .goods_view.gs-dt .detail_info .price_box .time_sale_price { font-size: 13px; color: var(--gs-muted); }
.goods_view.gs-dt .gs-dt-sub { margin-top: 6px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--gs-sub); }
.goods_view.gs-dt .gs-dt-sub[hidden] { display: none; }
.goods_view.gs-dt .gs-dt-medical { margin: 12px 0 0; padding: 10px 12px; border-radius: 12px; background: var(--gs-surface); font-size: 13px; line-height: 1.5; color: var(--gs-sub); }
/* 쿠폰 받기(고도몰 단추 · 로그인 전이면 로그인 안내) — 시안 «쿠폰 받기» 알약 */
#wrap .goods_view.gs-dt .detail_info .coupon_box { padding: 0; margin-top: 12px; }
#wrap .goods_view.gs-dt .detail_info .coupon_box .detail_coupon_btn { display: inline-flex; align-items: center; gap: 6px; width: auto; height: 34px; padding: 0 14px 0 10px; margin: 0; border: 1px solid #ffd2bb; border-radius: 999px; background: #fffaf6; color: var(--gs-rate); font-size: 13px; font-weight: 700; line-height: 1; box-shadow: none; text-indent: 0; }
#wrap .goods_view.gs-dt .detail_info .coupon_box .detail_coupon_btn::before { content: '%'; width: 18px; height: 18px; border-radius: 50%; background: #ffb38a; color: #fff; display: grid; place-items: center; font-size: 11px; font-weight: 800; }
#wrap .goods_view.gs-dt .detail_info .price-result { display: none; }

/* ── ③ 구성·보관·배송·배송비(고도몰 제조사·원산지·배송비 줄 + 위 세 줄) ── */
#wrap .goods_view.gs-dt .detail_info .detail_sub_info { display: grid; grid-template-columns: 64px 1fr; gap: 9px 12px; margin: 0; padding: 18px var(--gs-gutter); border: 0; border-top: 8px solid var(--gs-surface); font-size: 14px; }
#wrap .goods_view.gs-dt .detail_info .detail_sub_info > dl { display: contents; }
#wrap .goods_view.gs-dt .detail_info .detail_sub_info > dl[hidden] { display: none; }
#wrap .goods_view.gs-dt .detail_info .detail_sub_info dl dt { display: block; width: auto; font-size: 14px; color: var(--gs-muted); font-weight: 400; }
#wrap .goods_view.gs-dt .detail_info .detail_sub_info dl dd { display: block; width: auto; margin: 0; font-size: 14px; line-height: 1.5; color: var(--gs-text); }
#wrap .goods_view.gs-dt .detail_info .detail_sub_info dl dd a { color: var(--gs-accent-ink); font-size: 13px; }
#wrap .goods_view.gs-dt .detail_info .detail_sub_info dl dd span { margin-right: 2px; }

/* ── ④ 칸 머리(후기·함께 고른 메뉴) ── */
.goods_view.gs-dt .gs-dt-blk { padding: 26px 0 22px; border-top: 8px solid var(--gs-surface); }
.goods_view.gs-dt .gs-dt-blk[hidden] { display: none; }
.goods_view.gs-dt .gs-blk-hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; padding: 0 var(--gs-gutter) 14px; }
.goods_view.gs-dt .gs-blk-hd h3 { margin: 0; font-size: 18px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); }
.goods_view.gs-dt .gs-blk-hd h3 em { font-style: normal; color: var(--gs-accent-ink); margin-left: 4px; }
.goods_view.gs-dt .gs-blk-hd p { margin: 3px 0 0; font-size: 13px; color: var(--gs-muted); }
.goods_view.gs-dt .gs-blk-hd a { flex: 0 0 auto; font-size: 13px; color: var(--gs-muted); }
.goods_view.gs-dt .gs-blk-hd a::after { content: ' ›'; }

/* 후기 — 출처 알약 · 최근 후기 3개(고도몰 후기 게시판) */
.goods_view.gs-dt .gs-rv-src { display: flex; flex-wrap: wrap; gap: 6px; margin: -4px var(--gs-gutter) 14px; }
.goods_view.gs-dt .gs-rv-src span { display: inline-flex; align-items: center; gap: 5px; height: 30px; padding: 0 11px; border-radius: 999px; font-size: 13px; color: var(--gs-sub); background: var(--gs-surface); }
.goods_view.gs-dt .gs-rv-src b { color: var(--gs-text); font-weight: 700; }
.goods_view.gs-dt .gs-rvrow { display: flex; gap: 10px; overflow-x: auto; padding: 0 var(--gs-gutter) 4px; scrollbar-width: none; scroll-snap-type: x proximity; scroll-padding: 0 var(--gs-gutter); }
.goods_view.gs-dt .gs-rvrow::-webkit-scrollbar { display: none; }
.goods_view.gs-dt .gs-rvrow[hidden] { display: none; }
.goods_view.gs-dt .gs-rvcard { flex: 0 0 78%; scroll-snap-align: start; display: flex; flex-direction: column; gap: 8px; min-height: 118px; padding: 16px; border: 0; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); text-align: left; color: var(--gs-text); cursor: pointer; }
.goods_view.gs-dt .gs-rvcard .st { color: #F5A524; font-size: 13px; letter-spacing: 1px; }
.goods_view.gs-dt .gs-rvcard p { flex: 1; margin: 0; font-size: 14px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; word-break: keep-all; }
.goods_view.gs-dt .gs-rvcard .who { font-size: 12px; color: var(--gs-muted); }

/* 함께 고른 메뉴(3칸) */
.goods_view.gs-dt .gs-with { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; padding: 0 var(--gs-gutter); }
.goods_view.gs-dt .gs-mc { display: flex; flex-direction: column; gap: 6px; min-width: 0; color: var(--gs-text); }
.goods_view.gs-dt .gs-mc .ph { position: relative; display: block; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--gs-surface); }
.goods_view.gs-dt .gs-mc .ph img { width: 100%; height: 100%; object-fit: cover; }
.goods_view.gs-dt .gs-mc b { font-size: 13px; font-weight: 600; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 34px; }
.goods_view.gs-dt .gs-mc .pr { font-size: 13px; font-weight: 700; }

/* ── ⑤ 탭 4칸(상품정보·후기·배송·교환·문의) — 위에 붙는다(머리글이 떠 있으면 그 아래 · --gs-dt-top 은 js 가 잰다) ── */
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box { position: sticky; top: var(--gs-dt-top, 0px); z-index: 120; height: auto; border: 0; border-top: 8px solid var(--gs-surface); border-bottom: 1px solid var(--gs-line); background: var(--gs-app); }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu { position: static; }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul { display: grid; grid-template-columns: repeat(4, 1fr); width: 100%; margin: 0; }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul li { display: block; width: auto; height: 46px; padding: 0; border: 0; border-bottom: 2px solid transparent; margin-bottom: -1px; }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul li.selected { height: 46px; padding: 0; border-bottom: 2px solid var(--gs-accent-ink); }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul li a { display: flex !important; align-items: center; justify-content: center; gap: 3px; height: 100%; padding: 0 !important; font-size: 14px; line-height: 1; font-weight: 500; color: var(--gs-muted); white-space: nowrap; cursor: pointer; }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul li.selected a { color: var(--gs-text); font-weight: 700; }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul li a span.itemnum { display: inline; padding: 0; font-size: 12px; line-height: 1; font-weight: 600; color: var(--gs-muted); }
#wrap .goods_view.gs-dt .detail_btm_tab_menu_box .detail_btm_tab_menu ul li.selected a span.itemnum { color: var(--gs-accent-ink); }

/* 탭 아래 칸(상세 이미지·배송·교환 안내·후기·문의 게시판) */
#wrap .goods_view.gs-dt .detail_info_box { padding: 0; }
#wrap .goods_view.gs-dt .detail_info_box .view_box0 { padding: 0 0 8px; }
#wrap .goods_view.gs-dt .detail_info_box .view_box0 img { max-width: 100%; height: auto; }
#wrap .goods_view.gs-dt .openblock { margin: 16px var(--gs-gutter) 0; border: 0; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); overflow: hidden; }
#wrap .goods_view.gs-dt .openblock_header { padding: 14px 16px; background: transparent; }
#wrap .goods_view.gs-dt .openblock_header h3 { font-size: 15px; font-weight: 700; color: var(--gs-text); }
#wrap .goods_view.gs-dt .openblock .openblock_content { padding: 4px 16px 14px; border-top: 1px solid var(--gs-line); font-size: 13px; line-height: 1.6; color: var(--gs-sub); }
#wrap .goods_view.gs-dt .openblock_content dl dt { padding: 8px 0 2px; font-weight: 700; color: var(--gs-text); }
#wrap .goods_view.gs-dt .openblock_content dl dd { padding: 0 0 6px; color: var(--gs-sub); }
#wrap .goods_view.gs-dt .js_goods_description .gs-facts { margin-top: 16px; }
#wrap .goods_view.gs-dt .detail_board_box { padding: 14px 0 10px; }
#wrap .goods_view.gs-dt .detail_board_box .item_list_head .item_list_write_box { padding: 0 var(--gs-gutter) 14px; border-bottom: 1px solid var(--gs-line); text-align: right; }
#wrap .goods_view.gs-dt .detail_board_box .detail_write_btn { display: inline-flex; align-items: center; height: 34px; padding: 0 14px; border-radius: 999px; font-size: 13px; font-weight: 700; background: #fff; }
#wrap .goods_view.gs-dt .detail_board_box .item_list > div > ul > li, #wrap .goods_view.gs-dt .detail_board_box .item_list ul > li { padding-left: var(--gs-gutter); padding-right: var(--gs-gutter); }
#wrap .goods_view.gs-dt .related_goods { border-top: 8px solid var(--gs-surface); padding-top: 8px; }
/* 관련 상품(관리자 «관련 상품» 진열 · 고도몰 목록 조각) — 두 칸 바둑판 · 취소선 정가 숨김 */
#wrap .goods_view.gs-dt .related_goods ul.list { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 10px; padding: 0 var(--gs-gutter) 24px; font-size: 13px; }
#wrap .goods_view.gs-dt .related_goods ul.list > li { float: none; width: auto !important; margin: 0; padding: 0; }
#wrap .goods_view.gs-dt .related_goods .goods_prd_img, #wrap .goods_view.gs-dt .related_goods .img_box { width: 100%; margin: 0; padding: 0; }
#wrap .goods_view.gs-dt .related_goods .img_box img { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: var(--gs-card-radius); }
#wrap .goods_view.gs-dt .related_goods .goods_prd_content { padding: 8px 0 0; }
#wrap .goods_view.gs-dt .related_goods .prd_name { font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--gs-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#wrap .goods_view.gs-dt .related_goods .price, #wrap .goods_view.gs-dt .related_goods .c_price { font-size: 15px; font-weight: 700; color: var(--gs-text); }
#wrap .goods_view.gs-dt .related_goods .fixed_price { display: none !important; }
/* 배송·교환 칸 «정가» 줄은 보인다(대표 10/13 «정가 숨기지 마» · 예전 «.js_goods_detail_infotext del» 숨김 뺌 — js/gs_v16_detail.js 도 줄 숨김을 뺐다) */
#wrap .goods_view.gs-dt .related_goods > h3 { padding: 18px var(--gs-gutter) 12px; font-size: 18px; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); }

/* ── ⑥ 아래 구매 막대(찜 + 구매하기) ── */
#wrap .goods_view.gs-dt .detail_buy { border-top: 1px solid var(--gs-line); background: rgba(255, 252, 247, .96); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
#wrap .goods_view.gs-dt .detail_buy .detail_buy_top_btn .detail_open_close { display: none; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn .detail_prd_btn { padding: 10px var(--gs-gutter) calc(10px + env(safe-area-inset-bottom)); }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn .detail_prd_btn ul { display: flex; gap: 8px; width: 100%; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn .detail_prd_btn ul li { display: block; flex: 1 1 auto; width: auto; padding: 0; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn .detail_prd_btn ul li:has(> .detail_order_btn) { display: none; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn .detail_prd_btn ul li.gs-buy-wish { flex: 0 0 50px; }   /* 10/21 위 135행(ul li · 1 1 auto)이 더 강해 찜 칸이 반을 차지 → 같은 길로 올려 [구매하기]가 나머지를 꽉 채움 */
#wrap .goods_view.gs-dt .detail_buy #wishBtn { width: 50px; height: 50px; padding: 0; border-radius: 16px; border: 1px solid var(--gs-line); background: #fff; display: grid; place-items: center; color: var(--gs-sub); }
#wrap .goods_view.gs-dt .detail_buy #wishBtn svg { width: 22px; height: 22px; stroke: currentColor; fill: none; stroke-width: 1.7; }
#wrap .goods_view.gs-dt .detail_buy #wishBtn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_cart_btn, #wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_prd_no_btn, #wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_restock_btn {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 50px; padding: 0; border: 0; border-radius: 16px; font-size: 16px; font-weight: 700; line-height: 1; letter-spacing: -0.02em; cursor: pointer; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_cart_btn { background: var(--gs-accent) !important; color: var(--gs-accent-text) !important; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_restock_btn { background: #24190f; color: #fffaf4; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_restock_btn img { display: none; }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_prd_no_btn { background: var(--gs-surface); color: var(--gs-muted); }
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn li.restock { width: auto; }

/* ── ⑦ 구매하기 → 아래에서 올라오는 창(고도몰 buyEffects 의 st_buy_open 그대로) ──
   창 전체가 한 번에 굴러간다: 이름 줄·골라담기 머리 = 위에 붙음 · 합계+장바구니/바로 구매 = 아래에 붙음 · 네이버페이·페이코 = 그 아래(고도몰 #divAddPay 그대로)
   (옛 화면처럼 옵션 칸만 굴리면 휴대폰 높이에서 네이버페이·페이코 233px 이 목록을 2~3줄로 줄인다 — 10/13 실측) */
.goods_view.gs-dt .gs-sheet-hd, .goods_view.gs-dt .gs-sheet-dim, .goods_view.gs-dt .gs-pay-jump { display: none; }
#wrap .st_buy_open .goods_view.gs-dt .gs-sheet-dim { display: block; position: fixed; inset: 0; z-index: 299; background: rgba(20, 12, 6, .45); }
html.gs-sheet-open, html.gs-sheet-open body { overflow: hidden !important; }
#wrap .st_buy_open .goods_view.gs-dt .detail_buy { max-height: 88vh; max-height: 88dvh; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; border: 0; border-radius: 24px 24px 0 0; background: var(--gs-app); box-shadow: 0 -10px 30px rgba(20, 12, 6, .12); -webkit-backdrop-filter: none; backdrop-filter: none; animation: gsUp .26s ease-out; }
@keyframes gsUp { from { transform: translateY(40px); opacity: .6; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { #wrap .st_buy_open .goods_view.gs-dt .detail_buy { animation: none; } }
#wrap .st_buy_open .goods_view.gs-dt .gs-sheet-hd { display: block; position: sticky; top: 0; z-index: 4; background: var(--gs-app); }
.goods_view.gs-dt .gs-sheet-grab { width: 40px; height: 4px; border-radius: 4px; background: #e4d8ca; margin: 10px auto 2px; }
.goods_view.gs-dt .gs-sheet-row { display: flex; align-items: center; gap: 8px; padding: 8px var(--gs-gutter) 10px; }
.goods_view.gs-dt .gs-sheet-row h3 { flex: 1; min-width: 0; margin: 0; font-size: 18px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-sheet-x { flex: 0 0 auto; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: var(--gs-surface); color: var(--gs-sub); font-size: 15px; line-height: 34px; text-align: center; cursor: pointer; }
#wrap .st_buy_open .goods_view.gs-dt .st_buy_content .js_layer_option { max-height: none !important; height: auto !important; overflow: visible; }
#wrap .st_buy_open .goods_view.gs-dt .st_buy_content .js_option_scroll { max-height: none !important; height: auto !important; min-height: 0 !important; overflow: visible !important; }
#wrap .st_buy_open .goods_view.gs-dt .st_buy_content .gs-pk { position: sticky; top: var(--gs-sheet-hd-h, 66px); z-index: 3; background: var(--gs-app); }
#wrap .st_buy_open .goods_view.gs-dt .st_buy_content .ly_buy_dn { position: sticky; bottom: 0; z-index: 3; box-shadow: 0 -1px 0 var(--gs-line); }
#wrap .st_buy_open .goods_view.gs-dt .gs-pay-jump { display: block; width: 100%; margin: 8px 0 0; padding: 4px 0; border: 0; background: none; font-size: 13px; font-weight: 600; color: var(--gs-sub); text-align: center; cursor: pointer; }
#wrap .st_buy_open .goods_view.gs-dt .gs-pay-jump[hidden] { display: none; }
#wrap .st_buy_open .goods_view.gs-dt .detail_buy #divAddPay { padding: 12px var(--gs-gutter) calc(12px + env(safe-area-inset-bottom)); }
#wrap .goods_view.gs-dt .detail_buy #divAddPay .snsbtn { padding: 4px 0 6px; text-align: center; }
#wrap .goods_view.gs-dt .detail_buy #divAddPay details { margin-top: 4px; font-size: 12px; line-height: 1.5; color: var(--gs-muted); text-align: left; }
#wrap .goods_view.gs-dt .detail_buy #divAddPay details summary { cursor: pointer; }
#wrap .goods_view.gs-dt .detail_buy #divAddPay br + br { display: none; }

/* ── 옵션 레이어 공통 모양(상세 창 · #popupOption) ── */
#wrap .gs-layer { background: var(--gs-app); color: var(--gs-text); }
#wrap .gs-layer .ly_buy_info { padding: 6px var(--gs-gutter) 4px; }
#wrap .gs-layer .ly_buy_info .ly_opt .bn_opt { height: 46px; border: 1px solid var(--gs-line); border-radius: 12px; background: #fff; font-size: 14px; color: var(--gs-sub); text-indent: 14px; }
#wrap .gs-layer .ly_buy_info .ly_opt .bn_opt.selected { border-color: var(--gs-accent-ink); }
#wrap .gs-layer .ly_buy_info .ly_opt li .optbx { margin-top: 4px; border: 1px solid var(--gs-line); border-radius: 12px; overflow: hidden; }
#wrap .gs-layer .ly_buy_info .ly_opt li .optbx .optlst li { border-bottom: 1px solid var(--gs-line); font-weight: 500; color: var(--gs-text); }
#wrap .gs-layer .ly_buy_info .ly_opt li .option_input input { height: 44px; border: 1px solid var(--gs-line); border-radius: 12px; }
#wrap .gs-layer .view_order_goods { padding: 12px var(--gs-gutter); background: #fff; border: 0; border-bottom: 1px solid var(--gs-line); }
#wrap .gs-layer .view_order_goods:first-child { border-top: 1px solid var(--gs-line); }
#wrap .gs-layer .view_order_goods .dp_option_img.dn { display: none; }
#wrap .gs-layer .view_order_goods dl dd { width: 100%; }
#wrap .gs-layer .view_order_goods .option_tit_s, #wrap .gs-layer .view_order_goods h2 { font-size: 14px; font-weight: 600; line-height: 1.4; color: var(--gs-text); }
#wrap .gs-layer .view_order_goods .price_info .count { display: inline-flex; align-items: center; width: auto; height: 34px; padding: 0; margin-top: 8px; border: 1px solid var(--gs-line); border-radius: 999px; background: #fff; vertical-align: middle; }
#wrap .gs-layer .view_order_goods .price_info .count button { width: 34px; height: 32px; padding: 0; margin: 0; border: 0; background: none !important; font-size: 0; color: var(--gs-text); position: relative; }
#wrap .gs-layer .view_order_goods .price_info .count button::before { font-size: 18px; line-height: 32px; }
#wrap .gs-layer .view_order_goods .price_info .count button.detail_down_btn::before { content: '−'; }
#wrap .gs-layer .view_order_goods .price_info .count button.detail_up_btn::before { content: '+'; }
#wrap .gs-layer .view_order_goods .price_info .count input[type=number] { width: 32px; height: 32px; border: 0; background: transparent; font-size: 14px; font-weight: 700; }
#wrap .gs-layer .view_order_goods .price_info .right .price { font-size: 15px; font-weight: 700; color: var(--gs-text); }
#wrap .gs-layer .select_box_view { padding: 10px var(--gs-gutter) 0; }
#wrap .gs-layer .select_box_view .bn_opt { height: 42px; border: 1px solid var(--gs-line); border-radius: 12px; background: #fff; }
#wrap .gs-layer .total_price_box { padding: 12px var(--gs-gutter); border-top: 1px solid var(--gs-line); }
#wrap .gs-layer .ly_buy_dn { padding: 10px var(--gs-gutter) 12px; border-top: 1px solid var(--gs-line); background: var(--gs-app); }
#wrap .gs-layer .ly_buy_dn .detail_prd_btn { padding: 0; }
#wrap .gs-layer .ly_buy_dn .detail_prd_btn ul.js_cart_btn { display: flex; gap: 8px; width: 100%; }
#wrap .gs-layer .ly_buy_dn .detail_prd_btn ul.js_cart_btn li { display: block; flex: 1 1 0; width: auto; padding: 0; }
#wrap .gs-layer .ly_buy_dn a.detail_cart_btn, #wrap .gs-layer .ly_buy_dn a.detail_order_btn, #wrap .gs-layer .ly_buy_dn a.detail_prd_no_btn, #wrap .gs-layer .ly_buy_dn a.detail_restock_btn, #wrap .gs-layer .ly_buy_dn a.detail_apply_btn {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 50px; padding: 0; border: 0; border-radius: 16px; font-size: 15px; font-weight: 700; line-height: 1; letter-spacing: -0.02em; box-sizing: border-box; }
#wrap .gs-layer .ly_buy_dn a.detail_cart_btn { background: #fff !important; color: var(--gs-text) !important; box-shadow: inset 0 0 0 1px var(--gs-line); }
#wrap .gs-layer .ly_buy_dn a.detail_order_btn, #wrap .gs-layer .ly_buy_dn a.detail_apply_btn { background: var(--gs-accent) !important; color: var(--gs-accent-text) !important; border: 0 !important; }
#wrap .gs-layer .ly_buy_dn a.detail_restock_btn { background: #24190f; color: #fffaf4; }
#wrap .gs-layer .ly_buy_dn a.detail_restock_btn img { display: none; }
#wrap .gs-layer .ly_buy_dn a.detail_prd_no_btn { background: var(--gs-surface); color: var(--gs-muted); }
#wrap .gs-layer .ly_buy_dn li.restock { width: auto; }
#wrap .gs-layer.gs-none .ly_buy_dn a.detail_cart_btn, #wrap .gs-layer.gs-none .ly_buy_dn a.detail_order_btn, #wrap .gs-layer.gs-none .ly_buy_dn a.detail_apply_btn { opacity: .45; }
#wrap .gs-layer .ly_buy_dn .myappDeepLinkBtn { margin-top: 8px; }

/* 옵션 줄(−/+) — 고른 수는 고도몰 수량 칸(goodsCnt[])에서 읽는다 */
#wrap .gs-layer.gs-rows .js_singel_option { display: none !important; }
#wrap .gs-layer.gs-rows .ly_buy_info { padding: 0; }
#wrap .gs-layer.gs-rows .option_display_area, #wrap .gs-layer.gs-rows .total_price_box { display: none !important; }
#wrap .gs-layer .gs-opts { padding: 0 var(--gs-gutter); }
#wrap .gs-layer .gs-opt { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--gs-line); }
#wrap .gs-layer .gs-opt[hidden] { display: none; }
#wrap .gs-layer .gs-opt img { width: 60px; height: 60px; border-radius: 12px; object-fit: cover; flex: 0 0 auto; background: var(--gs-surface); }
#wrap .gs-layer .gs-opt .t { flex: 1; min-width: 0; }
#wrap .gs-layer .gs-opt .t small { display: block; margin-bottom: 1px; font-size: 12px; color: var(--gs-muted); }
#wrap .gs-layer .gs-opt .t b { display: block; font-size: 14px; font-weight: 600; line-height: 1.35; letter-spacing: -0.03em; color: var(--gs-text); word-break: keep-all; }
#wrap .gs-layer .gs-opt .t > span { display: block; margin-top: 3px; font-size: 14px; font-weight: 700; color: var(--gs-text); }
#wrap .gs-layer .gs-opt .t > span em { font-style: normal; margin-left: 4px; padding: 1px 5px; border-radius: 4px; background: var(--gs-rate); color: #fff; font-size: 11px; font-weight: 700; vertical-align: 1px; }
#wrap .gs-layer .gs-opt.so { opacity: .45; }
#wrap .gs-layer .gs-opt.so .t > span::after { content: ' · 품절'; color: var(--gs-muted); font-weight: 500; }
#wrap .gs-layer .gs-opt.so .gs-rs-btn { opacity: 1; }
#wrap .gs-layer .gs-opt.has { background: linear-gradient(90deg, rgba(44, 211, 160, .08), transparent 70%); }
#wrap .gs-layer .gs-rs-btn { display: block; margin-top: 6px; height: 26px; padding: 0 10px; border: 1px solid #24190f; border-radius: 999px; background: #fff; color: #24190f; font-size: 12px; font-weight: 700; }
#wrap .gs-layer .gs-qty, #wrap .gs-pkd .gs-qty { display: inline-flex; align-items: center; flex: 0 0 auto; height: 34px; border: 1px solid var(--gs-line); border-radius: 999px; background: #fff; }
#wrap .gs-layer .gs-qty button, #wrap .gs-pkd .gs-qty button { width: 34px; height: 32px; padding: 0; border: 0; background: none; font-size: 18px; line-height: 1; color: var(--gs-text); display: grid; place-items: center; cursor: pointer; }
#wrap .gs-layer .gs-qty button[disabled], #wrap .gs-pkd .gs-qty button[disabled] { color: #d8ccbe; cursor: default; }
#wrap .gs-layer .gs-qty b, #wrap .gs-pkd .gs-qty b { min-width: 22px; text-align: center; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
#wrap .gs-layer .gs-qty.on, #wrap .gs-pkd .gs-qty.on { border-color: var(--gs-accent-ink); }
#wrap .gs-layer .gs-qty.on b, #wrap .gs-pkd .gs-qty.on b { color: var(--gs-accent-ink); }
#wrap .gs-layer .gs-sumline { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 0 0 10px; font-size: 13px; color: var(--gs-sub); }
#wrap .gs-layer .gs-sumline small { color: var(--gs-muted); font-weight: 500; }
#wrap .gs-layer .gs-sumline b { font-size: 18px; font-weight: 800; color: var(--gs-text); }

/* 골라담기: «N개 골라 담았어요» · 단계 · 묶음 칩 */
#wrap .gs-layer .gs-pk { padding: 4px var(--gs-gutter) 2px; border-bottom: 1px solid var(--gs-line); }
#wrap .gs-layer .gs-pk-count, #wrap .gs-pkd .gs-pk-count { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding-bottom: 10px; font-size: 13px; color: var(--gs-sub); }
#wrap .gs-layer .gs-pk-count b, #wrap .gs-pkd .gs-pk-count b { font-size: 18px; font-weight: 800; color: var(--gs-text); }
#wrap .gs-layer .gs-pk-count b em, #wrap .gs-pkd .gs-pk-count b em { font-style: normal; color: var(--gs-accent-ink); }
#wrap .gs-layer .gs-steps, #wrap .gs-pkd .gs-steps { padding: 4px 14px 2px 4px; }
#wrap .gs-layer .gs-steps .line, #wrap .gs-pkd .gs-steps .line { position: relative; height: 6px; margin: 0 6px; border-radius: 4px; background: #DCEFE8; }
#wrap .gs-layer .gs-steps .line i, #wrap .gs-pkd .gs-steps .line i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: var(--gs-accent); transition: width .25s; }
#wrap .gs-layer .gs-steps .marks, #wrap .gs-pkd .gs-steps .marks { position: relative; height: 34px; margin: 0 6px; }
#wrap .gs-layer .gs-steps .marks span, #wrap .gs-pkd .gs-steps .marks span { position: absolute; top: -10px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; font-size: 12px; font-weight: 600; color: var(--gs-muted); white-space: nowrap; }
#wrap .gs-layer .gs-steps .marks span:last-child, #wrap .gs-pkd .gs-steps .marks span:last-child { transform: translateX(-80%); }
#wrap .gs-layer .gs-steps .marks span::before, #wrap .gs-pkd .gs-steps .marks span::before { content: ''; width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 2px solid #DCEFE8; box-sizing: border-box; }
#wrap .gs-layer .gs-steps .marks span.on, #wrap .gs-pkd .gs-steps .marks span.on { color: var(--gs-accent-ink); }
#wrap .gs-layer .gs-steps .marks span.on::before, #wrap .gs-pkd .gs-steps .marks span.on::before { background: var(--gs-accent); border-color: var(--gs-accent-ink); }
#wrap .gs-layer .gs-chips, #wrap .gs-pkd .gs-chips { display: flex; gap: 8px; overflow-x: auto; margin: 0 calc(-1 * var(--gs-gutter)); padding: 6px var(--gs-gutter) 10px; scrollbar-width: none; }
#wrap .gs-layer .gs-chips::-webkit-scrollbar, #wrap .gs-pkd .gs-chips::-webkit-scrollbar { display: none; }
#wrap .gs-layer .gs-chips button, #wrap .gs-pkd .gs-chips button { flex: 0 0 auto; height: 34px; padding: 0 14px; border: 1px solid var(--gs-line); border-radius: 999px; background: #fff; color: var(--gs-sub); font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; }
#wrap .gs-layer .gs-chips button[aria-pressed="true"], #wrap .gs-pkd .gs-chips button[aria-pressed="true"] { background: var(--gs-accent); border-color: var(--gs-accent-ink); color: var(--gs-accent-text); font-weight: 700; }

/* ── 목록·메인 «담기» 창(#popupOption) — 아래에서 올라오는 창 ── */
#popupOption.ly_show { background: rgba(20, 12, 6, .45); }
#popupOption.ly_show ~ .ly_overlay { background: transparent; }
#wrap #popupOption > .ly_wrap { position: absolute; left: 0; right: 0; bottom: 0; top: auto; width: 100% !important; height: auto !important; max-height: 88vh; max-height: 88dvh; display: flex; flex-direction: column; border-radius: 24px 24px 0 0; background: var(--gs-app); overflow: hidden; box-shadow: 0 -10px 30px rgba(20, 12, 6, .12); }
#wrap #popupOption > .ly_wrap > .layer_option.ly_ct { position: relative; display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; height: auto !important; max-height: 88vh; max-height: 88dvh; overflow: hidden; padding-top: 14px; }
#wrap #popupOption > .ly_wrap > .layer_option.ly_ct:not(.gs-rows) { height: 88vh !important; height: 88dvh !important; }   /* 고도몰 고르기 화면(분리형·장바구니 옵션 바꾸기 등)은 펼침 목록 높이를 레이어 높이로 잰다 */
#wrap #popupOption .layer_option > form { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; }
#wrap #popupOption .layer_option .js_option_scroll { flex: 1 1 auto; min-height: 0; max-height: none !important; height: auto !important; overflow-y: auto; }
#wrap #popupOption .layer_option .ly_head { flex: none; padding: 8px 64px 10px var(--gs-gutter); border: 0; background: none; height: auto; }
#wrap #popupOption .layer_option .ly_head .h_tit { margin: 0; padding: 0; font-size: 18px; line-height: 1.35; font-weight: 800; letter-spacing: -0.035em; color: var(--gs-text); text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#wrap #popupOption .layer_option .close_btn { position: absolute; top: 18px; right: var(--gs-gutter); z-index: 11; }   /* gd_common .ly_head 가 z-index 10 이라 5면 머리 칸 밑에 깔려 ✕가 안 눌렸다(10/14 미리보기 실측) */
#wrap #popupOption .layer_option .close_btn .ly_btn_close { width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: var(--gs-surface); font-size: 0; color: var(--gs-sub); }
#wrap #popupOption .layer_option .close_btn .ly_btn_close::before { content: '✕'; font-size: 15px; line-height: 34px; }
#wrap #popupOption .layer_option .popup_dn { position: static !important; left: auto !important; width: auto !important; margin-left: 0 !important; flex: none; }
#wrap #popupOption .layer_option .popup_dn .btn_box2 span { margin: 0; }
#wrap #popupOption .layer_option .total_price_box.popup_price { flex: none; }
@media (min-width: 520px) { #wrap #popupOption > .ly_wrap { left: 0 !important; width: 100% !important; } }

/* ═════════════ v18o 이식 P-B(2026-10-17) — 시안 proto-v18o pages.css v18b·v18c·v18h(상세·구매 창·골라담기 화면) ═════════════ */
/* 이름 아래 후기 두 줄 상자(v18h) — 위 = 후기 N · 스마트스토어 N · 아래 = 구매 고객 후기 보러가기 · 오른쪽 민트 화살표 */
.goods_view.gs-dt .gs-dt-rvbar { display: flex; align-items: center; gap: 10px; margin: 10px 0 2px; padding: 10px 10px 10px 11px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line), 0 1px 3px rgba(36, 25, 15, .05); color: var(--gs-text); text-decoration: none; -webkit-tap-highlight-color: transparent; }
.goods_view.gs-dt .gs-dt-rvbar:active { background: var(--gs-surface); }
.goods_view.gs-dt .gs-dt-rvbar .rvb-ic { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 50%; background: #FFF1CC; display: grid; place-items: center; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-ic svg { width: 17px; height: 17px; fill: #FFD25E; stroke: #B86E00; stroke-width: 1.8; stroke-linejoin: round; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-n { font-size: 14px; line-height: 20px; font-weight: 600; color: var(--gs-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; letter-spacing: -.01em; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-n b { font-size: 16px; font-weight: 800; color: var(--gs-text); font-variant-numeric: tabular-nums; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-n i { font-style: normal; color: #c9bcae; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-go { font-size: 13px; line-height: 17px; font-weight: 800; color: var(--gs-accent-ink); white-space: nowrap; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-ar { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: var(--gs-accent); display: grid; place-items: center; }
.goods_view.gs-dt .gs-dt-rvbar .rvb-ar svg { width: 15px; height: 15px; fill: none; stroke: #fff; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 359px) { .goods_view.gs-dt .gs-dt-rvbar { gap: 8px; } .goods_view.gs-dt .gs-dt-rvbar .rvb-ic { width: 28px; height: 28px; } .goods_view.gs-dt .gs-dt-rvbar .rvb-n { font-size: 13px; } .goods_view.gs-dt .gs-dt-rvbar .rvb-n b { font-size: 14px; } }

/* 골라담기 상세: 사진 넘김 칸을 낮게(첫 화면에 격자 머리) · 쿠폰 + «상세 설명 보기» 한 줄(v18h 민트 단추) */
/* 10/21 대표 «상세 이미지가 작게 나와» → 골라담기도 다른 상세와 같은 1:1(2:1 자르기 끔) */
.goods_view.gs-dt .gs-pkd-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
#wrap .goods_view.gs-dt .detail_info .gs-pkd-row .coupon_box { margin-top: 0; }
.goods_view.gs-dt .gs-pkd-jump { display: inline-flex; align-items: center; gap: 5px; height: 34px; margin-left: auto; padding: 0 5px 0 11px; border-radius: 999px; background: var(--gs-tint); box-shadow: inset 0 0 0 1px #bfe9da; color: var(--gs-accent-text); font-size: 14px; font-weight: 800; white-space: nowrap; text-decoration: none; -webkit-tap-highlight-color: transparent; }
.goods_view.gs-dt .gs-pkd-jump:active { background: #d3f2e7; }
.goods_view.gs-dt .gs-pkd-jump .pj-doc { width: 16px; height: 16px; fill: none; stroke: var(--gs-accent-ink); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.goods_view.gs-dt .gs-pkd-jump .pj-ar { width: 24px; height: 24px; border-radius: 50%; background: var(--gs-accent); display: grid; place-items: center; }
.goods_view.gs-dt .gs-pkd-jump .pj-ar svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }

/* 골라담기 메뉴 사진 격자(v18c) — 상세 = 제목·가격 아래 칸(#gsPkd) · 골라담기 화면 = 레이어 안(.gs-pick-layer) · 같은 카드 */
.goods_view.gs-dt .gs-pkd { border-top: 8px solid var(--gs-surface); }
.goods_view.gs-dt .gs-pkd[hidden] { display: none; }
#wrap .goods_view.gs-dt .gs-pkd .gs-pk { position: sticky; top: var(--gs-dt-top, 0px); z-index: 18; padding: 14px var(--gs-gutter) 0; background: var(--gs-app); border-bottom: 1px solid var(--gs-line); }
.gs-pk-hint { margin: 0; padding: 12px var(--gs-gutter) 0; font-size: 13px; color: var(--gs-sub); }
#wrap .gs-pk-grid, #wrap .gs-pick-layer .gs-pk-grid.gs-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 22px 12px; padding: 12px var(--gs-gutter) 28px; }
#wrap .gs-pick-layer .gs-opts[hidden] { display: none !important; }
@media (max-width: 360px) { #wrap .gs-pk-grid, #wrap .gs-pick-layer .gs-pk-grid.gs-opts { gap: 18px 10px; padding-left: 14px; padding-right: 14px; } }
.gs-mcard { display: flex; flex-direction: column; min-width: 0; }
.gs-mcard[hidden] { display: none; }
.gs-mcard .im { position: relative; display: block; width: 100%; aspect-ratio: 1; padding: 0; margin: 0; border: 0; border-radius: 16px; overflow: hidden; background: var(--gs-surface); box-shadow: 0 6px 18px rgba(120, 70, 30, .08); font: inherit; color: inherit; text-align: left; cursor: pointer; transition: box-shadow .2s; -webkit-tap-highlight-color: transparent; }
.gs-mcard .im img { display: block; width: 100%; height: 100%; object-fit: cover; }
.gs-mcard.has .im { box-shadow: 0 0 0 2.5px var(--gs-accent), 0 6px 18px rgba(44, 211, 160, .18); }
.gs-mcard .im .tg { position: absolute; top: 8px; left: 8px; z-index: 2; font-size: 11px; font-weight: 700; line-height: 20px; padding: 0 7px; border-radius: 8px; background: var(--gs-accent); color: var(--gs-accent-text); }
.gs-mcard .im .q { position: absolute; top: 8px; right: 8px; z-index: 2; height: 36px; padding: 0 11px 0 10px; border-radius: 16px; background: var(--gs-accent); color: var(--gs-accent-text); font-size: 13px; font-weight: 800; line-height: 36px; box-shadow: 0 3px 10px rgba(0, 0, 0, .2); }
.gs-mcard .im .q[hidden] { display: none; }
.gs-mcard .im .q b { font-size: 24px; font-weight: 900; letter-spacing: -0.5px; margin-right: 1px; vertical-align: -2px; }
.gs-mcard .im .tap { position: absolute; right: 8px; bottom: 8px; z-index: 2; width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, .95); color: var(--gs-accent-ink); display: grid; place-items: center; box-shadow: 0 2px 8px rgba(0, 0, 0, .16); }
.gs-mcard .im .tap svg { width: 16px; height: 16px; }
.gs-mcard.has .im .tap { background: var(--gs-accent); color: var(--gs-accent-text); }
.gs-mcard.so .im { cursor: default; }
.gs-mcard.so .im::after { content: '품절'; position: absolute; inset: 0; z-index: 3; display: grid; place-items: center; background: rgba(36, 25, 15, .45); color: #fff; font-weight: 700; }
.gs-mcard.pop .im { animation: gsMpPop .3s ease; }
@keyframes gsMpPop { 0% { transform: scale(1); } 40% { transform: scale(.95); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .gs-mcard.pop .im { animation: none; } }
/* 사진이 아직 없는 메뉴 = 글자 카드(메뉴 이름 크게 · 참고 사진 ✗) — 사진은 고도몰 관리자 «옵션 사진» 칸에 넣으면 저절로 바뀐다 */
.gs-mcard .ph-slot { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; padding: 16px 12px 30px; text-align: center; background: linear-gradient(160deg, #F2FBF7, #FBF6EF); border-radius: 16px; box-shadow: inset 0 0 0 1px var(--gs-line); }
.gs-mcard .ph-slot b { font-size: 16px; font-weight: 800; line-height: 1.3; letter-spacing: -0.04em; color: var(--gs-text); word-break: keep-all; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.gs-mcard .ph-slot small { font-size: 12px; font-weight: 700; color: var(--gs-accent-ink); }
.gs-mcard > small.gp { margin-top: 10px; height: 16px; overflow: hidden; font-size: 12px; color: var(--gs-muted); }
.gs-mcard .mn { margin-top: 1px; height: 38px; font-size: 14px; font-weight: 600; line-height: 19px; letter-spacing: -0.03em; color: var(--gs-text); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; word-break: keep-all; }
.gs-mcard .pr { margin-top: 4px; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
.gs-mcard .pr > span { font-size: 15px; font-weight: 800; color: var(--gs-text); white-space: nowrap; }
#wrap .gs-mcard .gs-qty, .gs-mcard .gs-qty { display: inline-flex; align-items: center; flex: 0 0 auto; height: 32px; border: 1px solid var(--gs-line); border-radius: 999px; background: #fff; }
#wrap .gs-mcard .gs-qty button, .gs-mcard .gs-qty button { width: 30px; height: 30px; padding: 0; border: 0; background: none; font-size: 18px; line-height: 1; color: var(--gs-text); display: grid; place-items: center; cursor: pointer; }
.gs-mcard .gs-qty button[disabled] { color: #d8ccbe; cursor: default; }
.gs-mcard .gs-qty b { min-width: 18px; text-align: center; font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums; }
.gs-mcard .gs-qty.on { border-color: var(--gs-accent-ink); }
.gs-mcard .gs-qty.on b { color: var(--gs-accent-ink); }
.gs-mcard.so .gs-qty { visibility: hidden; }
/* 창 안 메뉴 줄: 사진이 없는 메뉴 자리(사진 있는 메뉴와 줄 맞춤) */
#wrap .gs-layer .gs-opt .gs-ph-mini { flex: 0 0 auto; width: 60px; height: 60px; border-radius: 12px; background: linear-gradient(160deg, #F2FBF7, #FBF6EF); box-shadow: inset 0 0 0 1px var(--gs-line); }
/* 상세 창 «넓은 화면에서 고르기 ›» */
#wrap .gs-layer .gs-pk-wide { display: block; margin-top: 10px; text-align: center; font-size: 13px; color: var(--gs-muted); }

/* 다음 혜택 알약(v18b · 스위치 GS_PERKS.on 일 때만 그려진다) — 연민트 · 다음 혜택까지 3팩 이하면 진초록 · 다 받으면 민트 */
#wrap .gs-layer .gs-pk-count, #wrap .gs-pkd .gs-pk-count { flex-wrap: wrap; row-gap: 8px; align-items: center; }
.gs-pk-count .gs-pk-perk { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 6px 12px 6px 9px; border-radius: 999px; background: var(--gs-tint); color: var(--gs-accent-text); font-size: 13px; font-weight: 600; line-height: 1.25; box-shadow: inset 0 0 0 1px rgba(0, 120, 95, .2); transition: background .2s, color .2s, box-shadow .2s; }
.gs-pk-count .gs-pk-perk svg { width: 17px; height: 17px; flex: none; color: var(--gs-accent-ink); }
.gs-pk-count .gs-pk-perk b { font-size: inherit; font-weight: 800; color: inherit; }
.gs-pk-count .gs-pk-perk em { font-style: normal; font-weight: 900; font-size: 15px; letter-spacing: -.2px; color: var(--gs-accent-ink); }
.gs-pk-count .gs-pk-perk.near { background: var(--gs-accent-ink); color: #fff; box-shadow: 0 4px 12px rgba(0, 120, 95, .3); }
.gs-pk-count .gs-pk-perk.near svg, .gs-pk-count .gs-pk-perk.near em { color: #fff; }
.gs-pk-count .gs-pk-perk.near em { font-size: 16px; }
.gs-pk-count .gs-pk-perk.done { background: var(--gs-accent); color: var(--gs-accent-text); box-shadow: none; }
.gs-pk-count .gs-pk-perk.done svg { color: var(--gs-accent-text); }
.gs-pk-count .gs-pk-perk.two { border-radius: 16px; padding: 5px 12px 6px 9px; }
.gs-pk-count .gs-pk-perk.two > span { display: flex; flex-direction: column; align-items: flex-start; }
.gs-pk-count .gs-pk-perk small { font-size: 12px; font-weight: 700; line-height: 1.25; opacity: .85; }
.gs-pk-count .gs-pk-perk small::before { content: '✓ '; }
.gs-pk-count .gs-pk-perk.bump { animation: gsPkBump .45s ease; }
@keyframes gsPkBump { 0% { transform: scale(1); } 40% { transform: scale(1.07); } 100% { transform: scale(1); } }
@media (prefers-reduced-motion: reduce) { .gs-pk-count .gs-pk-perk.bump { animation: none; } }
.gs-pk-base { margin: -4px 0 6px; font-size: 12px; font-weight: 600; color: var(--gs-accent-ink); text-align: right; }
.gs-pk-base[hidden] { display: none; }
#wrap .gs-steps.has-perk .marks { height: 52px; }
.gs-steps .marks .gs-pk-mk { font-style: normal; font-size: 11px; font-weight: 800; line-height: 16px; padding: 0 6px; border-radius: 8px; white-space: nowrap; background: var(--gs-tint); color: var(--gs-accent-ink); }
.gs-steps .marks span.on .gs-pk-mk { background: var(--gs-accent-ink); color: #fff; }
.gs-steps .marks .gs-pk-mk.off { background: #FFF1EA; color: var(--gs-rate); }
.gs-steps .marks span.on .gs-pk-mk.off { background: var(--gs-sale); color: #24190f; }

/* 골라담기 화면: 담은 메뉴와 «같이 많이 담은 메뉴»(자사몰 실측) — 아래 막대 위 */
.gs-with-hint { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(132px + env(safe-area-inset-bottom)); z-index: 309; width: calc(100% - 24px); max-width: 476px; box-sizing: border-box; padding: 10px 34px 10px 12px; border-radius: 16px; background: #24190f; color: #fffaf4; font-size: 13px; box-shadow: 0 10px 30px rgba(36, 25, 15, .25); display: flex; flex-direction: column; gap: 8px; }
.gs-with-hint[hidden] { display: none; }
.gs-with-hint .r { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.gs-with-hint .r::-webkit-scrollbar { display: none; }
.gs-with-hint .r button { flex: 0 0 auto; border: 0; border-radius: 999px; background: rgba(255, 255, 255, .12); color: #fff; font-size: 12px; padding: 6px 10px; cursor: pointer; }
.gs-with-hint .r button::before { content: '+ '; color: #7BE8C6; font-weight: 700; }
.gs-with-hint .x { position: absolute; right: 6px; top: 4px; width: 28px; height: 28px; border: 0; background: none; color: #fff; opacity: .6; font-size: 14px; cursor: pointer; }

/* 상세 «함께 고른 메뉴»(골라담기 · 같은 상품 안 메뉴 짝) — 앵커 한 줄 + 3칸 · + = 1팩 */
.goods_view.gs-dt .gs-with-anchor { margin: 0 var(--gs-gutter) 12px; padding: 10px 12px; border-radius: 12px; background: var(--gs-band); font-size: 13px; color: var(--gs-sub); word-break: keep-all; }
.goods_view.gs-dt .gs-with-anchor b { color: var(--gs-text); }
.goods_view.gs-dt .gs-dt-mwith .gs-mc .ph .add { position: absolute; right: 6px; bottom: 6px; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 50%; background: var(--gs-accent); color: var(--gs-accent-text); font-size: 18px; line-height: 26px; cursor: pointer; }
.goods_view.gs-dt .gs-dt-mwith .gs-mc .ph .ph-name { position: absolute; inset: 0; display: grid; place-items: center; padding: 8px 8px 26px; text-align: center; font-size: 12px; font-weight: 800; line-height: 1.3; color: var(--gs-text); background: linear-gradient(160deg, #F2FBF7, #FBF6EF); word-break: keep-all; }

/* 골라담기 상세 아래 막대 — 격자에서 고르면 «합계 · 배송비» + 장바구니 + 바로 구매(창이 열리면 숨김) */
.gs-pkd-bar { position: fixed; left: 50%; bottom: 0; transform: translateX(-50%); z-index: 301; width: 100%; max-width: 500px; box-sizing: border-box; display: flex; gap: 8px; align-items: center; padding: 10px var(--gs-gutter) calc(10px + env(safe-area-inset-bottom)); background: rgba(255, 252, 247, .96); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid var(--gs-line); }
.gs-pkd-bar[hidden], html.gs-sheet-open .gs-pkd-bar { display: none; }
.gs-pkd-bar .sum { flex: 1.6; min-width: 0; padding: 0; border: 0; background: none; font: inherit; text-align: left; color: var(--gs-sub); font-size: 12px; line-height: 1.35; cursor: pointer; }
.gs-pkd-bar .sum > span { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-pkd-bar .sum b { display: block; font-size: 18px; font-weight: 800; color: var(--gs-text); white-space: nowrap; }
.gs-pkd-bar .sum b i { font-style: normal; color: var(--gs-muted); font-weight: 600; }
.gs-pkd-bar .gs-btn { flex: 1; min-width: 0; height: 50px; padding: 0 6px; border: 0; border-radius: 16px; background: var(--gs-accent); color: var(--gs-accent-text); font-size: 15px; font-weight: 800; white-space: nowrap; cursor: pointer; }
.gs-pkd-bar .gs-btn.ghost { flex: .85; background: #fff; color: var(--gs-text); box-shadow: inset 0 0 0 1px var(--gs-line); }
html.gs-pkd-has:not(.gs-sheet-open) #wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn { visibility: hidden; }

/* 짧은 알림(품절 사진 누름 등) */
.gs-toast { position: fixed; left: 50%; bottom: calc(96px + env(safe-area-inset-bottom)); z-index: 400; transform: translate(-50%, 12px); max-width: calc(100% - 40px); padding: 10px 16px; border-radius: 999px; background: rgba(36, 25, 15, .92); color: #fff; font-size: 13px; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s; }
.gs-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ══ v18v 이식 P-B(2026-10-19 · 시안 proto-v18v@e82af53 · js/gs_v16_detail.js 같은 날짜 줄) ══ */
/* 결정 3: 위 가격 칸 취소선 = 타임세일·상품 할인만(js priceMarks 가 gs-was 를 붙인다) — 정가 취소선은 지웠다 · gs_v15.css «price_box del 숨김»에서 이 둘만 되살린다 */
#wrap .goods_view.gs-dt .price_box del.gs-was, #wrap .goods_view.gs-dt .price_box .won1.gs-was { display: inline !important; font-size: 14px; font-weight: 500; color: var(--gs-muted); }
#wrap .goods_view.gs-dt .price_box del.gs-was { margin-left: 6px; }
/* 결정 7: 단종 옵션(GS_V18V_PICK.hideOpts · 서버 품절일 때만) — 고도몰 옵션 고르기 목록에서도 숨김 */
#wrap li[data-gs-hidden] { display: none !important; }
/* v18t ①: 묶음 칩으로 숨긴 카드·줄이 다른 display 규칙에 지지 않게(시안은 v10부터 이 탓에 칩이 안 먹었다 · 스킨은 같은 고장 없음 — 안전망) */
#wrap .gs-mcard[hidden], #wrap .gs-layer .gs-opt[hidden], #wrap .gs-pick-layer .gs-opt[hidden] { display: none !important; }
/* v18t A④: 좁은 폰(카드 148px 미만)에서 가격 + −/+ 가 한 줄에 안 들어가면 −/+ 를 다음 줄로 */
#wrap .gs-mcard .pr { flex-wrap: wrap; row-gap: 6px; }
#wrap .gs-mcard .pr > .gs-qty { margin-left: auto; }
@media (max-width: 351px) {
  #wrap .gs-mcard .pr > .gs-qty { flex: 1 1 100%; justify-content: space-between; }
  #wrap .gs-mcard .pr > .gs-qty button { width: 40px; }
}
/* 결정 4: 조건 한 줄(«15팩 무료배송 · 30팩 닭가슴살 4팩 사은품(네이버페이 결제 시 제외)» · 혜택 켰을 때만) · 사은품 덧말 */
.gs-pk-cond { margin: -4px 0 8px; font-size: 12px; line-height: 1.45; color: var(--gs-sub); word-break: keep-all; }
.gs-pk-note { display: block; font-size: 12px; font-weight: 500; line-height: 1.4; color: var(--gs-sub); }
.gs-pk-count .gs-pk-perk .gs-pk-note { display: none; }
/* v18q: «지금 N팩» 손잡이 · 다음 혜택까지 남은 구간 빗금 · 혜택 눈금은 크게(켰을 때만 그려짐) */
#wrap .gs-layer .gs-steps.has-perk, #wrap .gs-pkd .gs-steps.has-perk { padding-top: 28px; }
#wrap .gs-steps.has-perk .line i::after { content: ''; position: absolute; right: -6px; top: 50%; width: 12px; height: 12px; margin-top: -6px; border-radius: 50%; background: #fff; border: 3px solid var(--gs-accent-ink); box-sizing: border-box; z-index: 2; }
#wrap .gs-steps .line .gs-pk-gap { position: absolute; top: 0; bottom: 0; border-radius: 4px; text-decoration: none; z-index: 1; background: repeating-linear-gradient(-45deg, rgba(0, 120, 95, .42) 0 3px, rgba(0, 120, 95, .1) 3px 6px); transition: left .25s, width .25s; }
#wrap .gs-steps .line .gs-pk-gap[hidden] { display: none; }
#wrap .gs-steps .line .gs-pk-now { position: absolute; bottom: 13px; transform: translateX(-50%); z-index: 3; font-style: normal; font-size: 12px; font-weight: 700; line-height: 20px; padding: 0 8px; border-radius: 8px; background: var(--gs-text); color: #fff; white-space: nowrap; transition: left .25s; pointer-events: none; }
#wrap .gs-steps .line .gs-pk-now span { font-weight: 500; opacity: .8; }
#wrap .gs-steps .line .gs-pk-now em { font-style: normal; font-variant-numeric: tabular-nums; }
#wrap .gs-steps .line .gs-pk-now::after { content: ''; position: absolute; left: 50%; bottom: -4px; margin-left: -4px; border: 4px solid transparent; border-bottom: 0; border-top-color: var(--gs-text); }
#wrap .gs-steps .line .gs-pk-now.edge-l { transform: translateX(-10px); }
#wrap .gs-steps .line .gs-pk-now.edge-l::after { left: 10px; }
#wrap .gs-steps .line .gs-pk-now.edge-r { transform: translateX(calc(-100% + 10px)); }
#wrap .gs-steps .line .gs-pk-now.edge-r::after { left: auto; right: 6px; margin-left: 0; }
#wrap .gs-steps.has-perk .marks { z-index: 4; }
#wrap .gs-steps.has-perk .marks span:not(.pk-at)::before { width: 8px; height: 8px; margin: 2px 0; border-width: 2px; }
#wrap .gs-steps.has-perk .marks span.pk-at::before { width: 16px; height: 16px; margin: -2px 0; border-width: 3px; border-color: #cfe9e0; }
#wrap .gs-steps.has-perk .marks span.pk-at.on::before { border-color: var(--gs-accent-ink); }
@media (prefers-reduced-motion: reduce) { #wrap .gs-steps .line .gs-pk-gap, #wrap .gs-steps .line .gs-pk-now { transition: none; } }
/* v18s ④(보수판 B): 큰 담기 머리는 고정을 풀고(스크롤로 지나감) 지나간 뒤 머리글 아래 한 줄 막대 — 상세 격자 머리 · 골라담기 화면 머리 */
html.gs-pkfold #wrap .goods_view.gs-dt .gs-pkd .gs-pk, html.gs-pkfold #wrap .gs-pick-layer .gs-pk { position: static; }
.gs-pkmini { position: fixed; left: 50%; transform: translateX(-50%); z-index: 290; width: 100%; max-width: 500px; box-sizing: border-box; background: var(--gs-app); border-bottom: 1px solid var(--gs-line); box-shadow: 0 2px 8px rgba(36, 25, 15, .06); }
.gs-pkmini[hidden], html.gs-sheet-open .gs-pkmini { display: none; }
.gs-pkmini .in { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 44px; padding: 4px var(--gs-gutter); border: 0; background: none; color: var(--gs-text); font: inherit; text-align: left; cursor: pointer; }
.gs-pkmini [data-gs-mini-n] { flex: 0 0 auto; font-size: 16px; font-weight: 800; white-space: nowrap; }
.gs-pkmini [data-gs-mini-n] em { font-style: normal; color: var(--gs-accent-ink); }
.gs-pkmini .gs-mini-msg { min-width: 0; margin-left: auto; font-size: 12px; color: var(--gs-sub); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-pkmini .gs-mini-msg.gs-pk-perk { display: inline-flex; align-items: center; gap: 5px; max-width: calc(100% - 48px); padding: 4px 10px 4px 8px; border-radius: 999px; background: var(--gs-tint); color: var(--gs-accent-text); font-weight: 600; }
.gs-pkmini .gs-mini-msg.gs-pk-perk.near { background: var(--gs-accent-ink); color: #fff; }
.gs-pkmini .gs-mini-msg.gs-pk-perk.done { background: var(--gs-accent); color: var(--gs-accent-text); }
.gs-pkmini .gs-mini-msg svg { width: 14px; height: 14px; flex: none; }
.gs-pkmini .gs-mini-msg > span { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-pkmini .gs-mini-msg small { display: none; }
.gs-pkmini .gs-mini-msg em { font-style: normal; font-weight: 900; }
.gs-pkmini .line { height: 3px; background: var(--gs-line); }
.gs-pkmini .line i { display: block; height: 100%; background: var(--gs-accent); transition: width .2s; }
/* v18s ⑥ «지난번 메뉴» 칩 */
#wrap .gs-chips button.gs-chip-last { border-color: var(--gs-accent-ink); color: var(--gs-accent-ink); font-weight: 700; }
/* v18q «맨 위로» — 아래 구매 막대·골라담기 막대 위 · 500px 가운데 화면 오른쪽 */
.gs-totop { position: fixed; z-index: 296; right: max(16px, calc((100vw - 500px) / 2 + 16px)); bottom: calc(96px + env(safe-area-inset-bottom, 0px)); width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: #fff; color: var(--gs-text); display: grid; place-items: center; cursor: pointer; box-shadow: 0 2px 10px rgba(0, 0, 0, .14), inset 0 0 0 1px var(--gs-line); }
.gs-totop[hidden], html.gs-sheet-open .gs-totop { display: none; }
.gs-totop svg { width: 22px; height: 22px; }
/* v18r: 상세 설명 «더 보기» 접기(처음 1,400px) */
#wrap .goods_view.gs-dt .gs-desc-fold.gs-dfold { position: relative; max-height: 1400px; overflow: hidden; }
#wrap .goods_view.gs-dt .gs-desc-fold.gs-dfold::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; background: linear-gradient(rgba(255, 255, 255, 0), #fff); pointer-events: none; }
#wrap .goods_view.gs-dt .gs-desc-fold.gs-dfold.gs-open { max-height: none; overflow: visible; }
#wrap .goods_view.gs-dt .gs-desc-fold.gs-dfold.gs-open::after { display: none; }
#wrap .goods_view.gs-dt .gs-desc-more { padding: 4px var(--gs-gutter) 22px; background: #fff; }
#wrap .goods_view.gs-dt .gs-desc-more[hidden] { display: none; }
#wrap .goods_view.gs-dt .gs-desc-more button { width: 100%; min-height: 50px; display: flex; align-items: center; justify-content: center; gap: 6px; border: 0; border-radius: 12px; cursor: pointer; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); color: var(--gs-text); font-size: 15px; font-weight: 700; }
#wrap .goods_view.gs-dt .gs-desc-more svg { width: 18px; height: 18px; transition: transform .2s; }
#wrap .goods_view.gs-dt .gs-desc-more button[aria-expanded="true"] svg { transform: rotate(180deg); }
@media (prefers-reduced-motion: reduce) { #wrap .goods_view.gs-dt .gs-desc-more svg { transition: none; } }
/* v18q·v18r 조리·보관·자주 묻는 질문(글자 · 스위치 GS_DT_TEXT 켰을 때만 그려짐) */
#wrap .goods_view.gs-dt .gs-how { margin: 16px var(--gs-gutter) 18px; padding: 18px 16px 16px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--gs-line); text-align: left; }
#wrap .goods_view.gs-dt .gs-how h3, #wrap .goods_view.gs-dt .gs-faq h3 { margin: 0; font-size: 18px; font-weight: 800; line-height: 1.4; color: var(--gs-text); }
#wrap .goods_view.gs-dt .gs-how-sub { margin: 2px 0 12px; font-size: 13px; color: var(--gs-sub); }
#wrap .goods_view.gs-dt .gs-how dl { display: grid; grid-template-columns: 76px 1fr; gap: 12px; margin: 12px 0 0; font-size: 15px; line-height: 1.6; }
#wrap .goods_view.gs-dt .gs-how dt { color: var(--gs-sub); font-size: 14px; font-weight: 700; }
#wrap .goods_view.gs-dt .gs-how dd { margin: 0; color: var(--gs-text); }
#wrap .goods_view.gs-dt .gs-how dd + dt, #wrap .goods_view.gs-dt .gs-how dd + dt + dd { border-top: 1px solid var(--gs-line); padding-top: 12px; }
#wrap .goods_view.gs-dt .gs-how ol, #wrap .goods_view.gs-dt .gs-how ul { margin: 0; padding-left: 18px; }
#wrap .goods_view.gs-dt .gs-how ol { list-style: decimal; } #wrap .goods_view.gs-dt .gs-how ul { list-style: disc; }
#wrap .goods_view.gs-dt .gs-how li { margin: 2px 0; }
#wrap .goods_view.gs-dt .gs-how-way { display: block; margin: 0 0 2px; font-size: 13px; font-weight: 700; color: var(--gs-accent-ink); }
#wrap .goods_view.gs-dt .gs-how-note { margin: 12px 0 0; font-size: 12px; line-height: 1.5; color: var(--gs-muted); }
#wrap .goods_view.gs-dt .gs-faq { padding: 22px 0 6px; border-top: 8px solid var(--gs-surface); text-align: left; }
#wrap .goods_view.gs-dt .gs-faq h3 { padding: 0 var(--gs-gutter) 8px; }
#wrap .goods_view.gs-dt .gs-acc { border-top: 1px solid var(--gs-line); }
#wrap .goods_view.gs-dt .gs-acc > summary { list-style: none; display: flex; align-items: center; min-height: 48px; padding: 10px var(--gs-gutter); font-size: 15px; line-height: 1.5; cursor: pointer; }
#wrap .goods_view.gs-dt .gs-acc > summary::-webkit-details-marker { display: none; }
#wrap .goods_view.gs-dt .gs-acc > summary b, #wrap .goods_view.gs-dt .gs-acc .in b { margin-right: 6px; color: var(--gs-accent-ink); }
#wrap .goods_view.gs-dt .gs-acc .in { padding: 0 var(--gs-gutter) 14px; font-size: 15px; line-height: 1.6; color: var(--gs-text); }
#wrap .goods_view.gs-dt .gs-acc .in b { color: var(--gs-sub); }
#wrap .goods_view.gs-dt .gs-faqc { border-top: 1px solid var(--gs-line); }
#wrap .goods_view.gs-dt .gs-faqc > summary { list-style: none; display: flex; justify-content: space-between; align-items: center; min-height: 48px; padding: 0 var(--gs-gutter); font-size: 14px; font-weight: 600; color: var(--gs-sub); cursor: pointer; }
#wrap .goods_view.gs-dt .gs-faqc > summary::-webkit-details-marker { display: none; }
#wrap .goods_view.gs-dt .gs-demo { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 4px; background: #FFF4CC; color: #7A5A00; font-size: 11px; font-weight: 700; line-height: 18px; vertical-align: 2px; }
/* v18r ③-1 누르는 영역 44 — 그림·글자 크기는 그대로, 눌리는 칸만(가운데 겹친 투명 칸) */
.gs-with-hint .x::after, #wrap .goods_view.gs-dt .gs-dt-mwith .gs-mc .ph .add::after { content: ''; position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); }
#wrap .goods_view.gs-dt .gs-dt-mwith .gs-mc .ph .add { overflow: visible; }
#wrap .gs-mcard .gs-qty button, #wrap .gs-layer .gs-opt .gs-qty button { position: relative; }
#wrap .gs-mcard .gs-qty button::after, #wrap .gs-layer .gs-opt .gs-qty button::after { content: ''; position: absolute; left: 50%; top: 50%; width: 36px; height: 44px; transform: translate(-50%, -50%); }
/* v18t A③: 품절 «재입고 알림 받기» 진갈색 꽉 찬 면 → 연민트 면 + 진초록 글자 */
#wrap .goods_view.gs-dt .detail_buy .js_goods_view_buy_btn a.detail_restock_btn, #wrap .gs-layer .ly_buy_dn a.detail_restock_btn { background: #E6F8F2; color: #053B31; box-shadow: inset 0 0 0 1px #BFE9DA; }
/* v18r ③-1(이어서): 창 ✕(34px) → 눌리는 칸 44 · 글자 링크(«전체 보기 ›»·«상품 설명 ›»·«메뉴 사진 크게 보기 ›»)는 위아래로만 넓힘(줄 높이·배치 그대로 · 시안 .sec-hd .more 와 같은 방식) */
.gs-sheet-x { position: relative; }
.gs-sheet-x::after { content: ''; position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; transform: translate(-50%, -50%); }
.goods_view.gs-dt .gs-blk-hd a { padding: 12px 0; margin: -12px 0; }
#wrap .gs-pk-prod > a { padding: 12px 0; margin: -12px 0; }
#wrap .gs-layer .gs-pk-wide { padding: 10px 0; margin-top: 0; margin-bottom: -10px; }
/* v18s ①: 칸 머리 «전체 보기»는 칸 제목보다 약하게(회색 · 보통 굵기 — 이미 그렇다) */