@charset "utf-8";
/* ═══════════════════════════════════════════════════════════════════════
   메인 "이번 주 증정 혜택" 섹션 (2026-08-06 신설) v1.0.0

   증정 시스템(ET_MASTER) 기준 자동 노출 섹션. 카테고리별 베스트 바로 아래.
   카드는 두레카드 표준(.dcz, dure_card.css)을 그대로 쓰고, 이 파일은
   ① 섹션 헤더 ② 가로 레일 ③ 증정 캡션(.eg-gift) 만 담당한다.
   전 선택자가 .eg- 프리픽스 또는 .eg-sec 하위 → 다른 화면 침투 0.
   ═══════════════════════════════════════════════════════════════════════ */

.eg-sec {
	margin: 34px 0 0;
}
.eg-inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0 16px;
}

/* ── 섹션 헤더 (cat_best 톤과 형제) ──────────────────────────────────── */
.eg-shead {
	margin-bottom: 14px;
}
.eg-eb {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .02em;
	color: #1f7a45;
}
.eg-stt {
	margin: 4px 0 0;
	font-size: 23px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -.03em;
	color: #1a1a1a;
}
.eg-stt em {
	font-style: normal;
	color: #1f7a45;
}
/* ⚠기간 안내 — 배송일 기준 판정이라 '배송분'을 반드시 노출(오인 방지) */
.eg-note {
	margin: 8px 0 0;
	font-size: 13px;
	line-height: 1.5;
	letter-spacing: -.02em;
	color: #5c7a68;
	word-break: keep-all;
}
.eg-pill {
	display: inline-block;
	margin-right: 6px;
	padding: 3px 9px;
	border-radius: 999px;
	background: #e8f4ec;
	color: #14532d;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: -.02em;
	white-space: nowrap;
}
.eg-rule {
	margin-top: 12px;
	height: 2px;
	background: linear-gradient(90deg, #1f7a45 0 56px, #e5e7e0 56px);
}

/* ── 가로 레일 ───────────────────────────────────────────────────────── */
/* 대상이 주 6종 수준이라 그리드보다 레일이 자연스럽다(빈칸 안 생김). */
.eg-rail {
	display: flex;
	gap: 12px;
	overflow-x: auto;
	padding: 14px 0 6px;
	scroll-snap-type: x proximity;
	-webkit-overflow-scrolling: touch;
}
.eg-rail::-webkit-scrollbar {
	height: 6px;
}
.eg-rail::-webkit-scrollbar-thumb {
	background: #d3ddd6;
	border-radius: 3px;
}
.eg-rail > .eg-card {
	flex: 0 0 auto;
	width: 210px;
	scroll-snap-align: start;
}

/* ── 증정 내용 캡션(이 섹션의 주인공) ────────────────────────────────── */
.eg-sec .eg-gift {
	display: flex;
	align-items: flex-start;
	gap: 5px;
	margin: 5px 0 2px;
	padding: 6px 8px;
	border-radius: 7px;
	background: #f3faf5;
	border: 1px solid #dcecdf;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: -.02em;
	color: #14532d;
	word-break: keep-all;
}
.eg-sec .eg-gi {
	flex: 0 0 auto;
	padding: 1px 5px;
	border-radius: 4px;
	background: #1f7a45;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
}

/* 품절 카드는 톤을 낮춘다(담기 비활성은 .dcz 공통 규칙) */
.eg-sec .eg-card.soldout .eg-gift {
	opacity: .55;
}

/* ── 모바일 ─────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
	.eg-sec {
		margin-top: 26px;
	}
	.eg-inner {
		padding: 0 12px;
	}
	.eg-stt {
		font-size: 19px;
	}
	.eg-note {
		font-size: 12px;
	}
	/* 레일이 화면 끝까지 흐르게(카드가 잘려 보여 '더 있다'는 신호가 된다) */
	.eg-rail {
		margin: 0 -12px;
		padding: 12px 12px 6px;
	}
	.eg-rail > .eg-card {
		width: 156px;
	}
	.eg-sec .eg-gift {
		font-size: 11px;
		padding: 5px 7px;
	}
}

/* OS 글자확대(body.dcbig) — 캡션이 잘리지 않게 카드 폭을 넉넉히 */
body.dcbig .eg-rail > .eg-card {
	width: 190px;
}

/* ═══════════════════════════════════════════════════════════════════════
   [2026-09-05 담기 버튼 표준 통일] 모바일 메인(.mrdz) 증정 카드 v1.1.0
   .dc-cart 는 모바일 메인 스코프에 규칙이 없어 main_rd.css `.mrdz button{background:none;
   border:0}` 리셋에 걸려 '담기'가 배경·테두리 없는 맨 텍스트로 렌더되던 함정 피해자
   (있던 규칙은 .gvdt 상세 전용). 사이트 표준 담기 버튼(리뷰카드 .rvmo_add 규격:
   어두운 38px 원형 + 흰 카트 아이콘)으로 통일한다. 인라인 SVG 가 없어 흰 카트는
   background-image(data URI, .rvmo_add 와 동일 아이콘)로 넣고 '담기' 텍스트는 숨김.
   ⚠ 품절(.dc-soldout)은 사유(stopMsg)를 살려야 하므로 원형화 제외 → 회색 가로 알약.
   ⚠ 특이도 body .mrdz .eg-card .dc-cart:not(.dc-soldout) (0,4,1) 로 `.mrdz button`(0,1,1) 초과.
   롤백 = 이 블록 삭제 + JSP v 원복.
   ═══════════════════════════════════════════════════════════════════════ */
body .mrdz .eg-card .dc-cart:not(.dc-soldout){
	display: block;
	width: 38px;
	min-width: 38px;
	height: 38px;
	margin: 8px 0 2px auto;
	padding: 0;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	cursor: pointer;
	font-size: 0;
	line-height: 0;
	color: transparent;
	background-color: rgba(0,0,0,.5);
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 20px 20px;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2.2l2.1 11.2a1.6 1.6 0 0 0 1.6 1.3h8.5a1.6 1.6 0 0 0 1.6-1.3L21 8H6'/%3E%3Ccircle cx='9.6' cy='20' r='1.4'/%3E%3Ccircle cx='17.4' cy='20' r='1.4'/%3E%3C/svg%3E");
}
body .mrdz .eg-card .dc-cart:not(.dc-soldout):active{ background-color: rgba(0,0,0,.74); }
/* 품절 = 회색 가로 알약(주문 불가 사유 텍스트 유지) */
body .mrdz .eg-card .dc-cart.dc-soldout{
	display: block;
	width: auto;
	margin: 8px 0 2px;
	padding: 8px 10px;
	border: 0;
	border-radius: 10px;
	box-shadow: none;
	background: #e4e0d2;
	color: #6c7268;
	font-size: 12.5px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: default;
}

/* ═══════════════════════════════════════════════════════════════════════
   [2026-09-29 v1.2.0] 카드 본체 규칙 자체 보유 — 운영 모바일 가격·배지 깨짐 수정
   원인 = 이 카드 마크업(.thumb/.dc-badges/.dc-badge/.dc-nm/.dc-price/.dc-old/.dc-now/
   .dc-nonmem)의 규칙이 상품상세 시트(goods_view_rd.css) 안에 `.gvdt .dcz …` 로만 있어
   메인(.gvdt 없음)에서는 아무 규칙도 안 걸렸다. dure_card.css(.dcz 공용)는 metatop·
   specrow·칩만 갖고 카드 본체 규칙은 없다. 증정 대상이 생긴 주(9/28~ 배송분)에 처음
   노출되며 "증정10%" 맨글자·"13,200원11,900원" 붙은 가격으로 드러났다(팀장 보고).
   PC 메인도 같은 include 라 함께 고친다(PC 기본값 + 767 이하 모바일 값).
   가격줄 = 장바구니 추천 카드(psnl_recom .psnl-price)와 같은 문법:
   [판매가][원][정가 취소선 회색] 한 줄, 할인율은 사진 위 배지로만.
   전 선택자 .eg-sec 하위 → 다른 화면 침투 0. 롤백 = 이 블록 삭제 + JSP v 원복.
   ═══════════════════════════════════════════════════════════════════════ */
.eg-sec .dcz{ position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid #e4e0d2; border-radius:16px; overflow:hidden; }
.eg-sec .dcz .dcz-link{ display:block; color:inherit; text-decoration:none; }
.eg-sec .dcz .thumb{ position:relative; aspect-ratio:1/1; overflow:hidden; background:#f6f5ef; }
.eg-sec .dcz .thumb img{ display:block; width:100%; height:100%; object-fit:cover; }
.eg-sec .dcz .dc-badges{ position:absolute; top:10px; left:10px; z-index:1; display:flex; gap:6px; }
.eg-sec .dcz .dc-badge{ font-size:11px; font-weight:800; color:#fff; background:#D8352A; padding:3px 8px; border-radius:7px; line-height:1.5; white-space:nowrap; }
.eg-sec .dcz .dc-badge-g{ background:#3d6041; }
.eg-sec .dcz .dc-halt{ position:absolute; inset:0; z-index:1; background:rgba(27,36,28,.55); color:#fff; display:flex; align-items:center; justify-content:center; text-align:center; padding:12px; font-size:14px; font-weight:700; }
.eg-sec .dcz .body{ padding:13px 14px 15px; display:flex; flex-direction:column; flex:1; }
.eg-sec .dcz .farmer{ font-size:12.5px; color:#5F6B62; font-weight:600; line-height:1.3; margin:0 0 3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.eg-sec .dcz .dc-nm{ font-size:16px; font-weight:700; line-height:1.4; margin:0 0 6px; min-height:45px; color:#1D271E; word-break:keep-all; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.eg-sec .dcz .dc-price{ display:flex; align-items:baseline; flex-wrap:nowrap; column-gap:5px; margin-top:6px; min-width:0; font-variant-numeric:tabular-nums; }
.eg-sec .dcz .dc-now{ order:1; flex:0 0 auto; font-family:"Roboto","Pretendard",sans-serif; font-size:18px; font-weight:800; color:#1D271E; white-space:nowrap; }
.eg-sec .dcz .dc-now .u{ font-size:13px; font-weight:700; margin-left:1px; }
.eg-sec .dcz .dc-old{ order:2; flex:0 1 auto; min-width:0; font-family:"Roboto","Pretendard",sans-serif; font-size:12.5px; font-weight:500; color:#9AA39B; text-decoration:line-through; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* .dc-nonmem(비조합원 가격) = 2026-09-29 팀장 지시로 마크업에서 제거(메인 카드 전체 미노출 정책). v1.2.1 */
.eg-sec .dcz .dc-cart{ margin:11px 14px 14px; width:auto; height:36px; border:1.5px solid #3d6041; background:#fff; color:#3d6041; border-radius:12px; font-size:14px; font-weight:800; cursor:pointer; }
.eg-sec .dcz .dc-cart:hover{ background:#eaf1e8; }
.eg-sec .dcz .dc-cart.dc-soldout{ background:#e4e0d2; color:#6c7268; border-color:#e4e0d2; cursor:default; pointer-events:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.eg-sec .dcz.soldout .thumb img{ opacity:.6; }
@media (max-width:767px){
	.eg-sec .dcz{ border-radius:14px; }
	.eg-sec .dcz .dc-badges{ top:8px; left:8px; gap:5px; }
	.eg-sec .dcz .dc-badge{ font-size:10.5px; padding:3px 7px; border-radius:6px; }
	.eg-sec .dcz .body{ padding:10px 11px 11px; }
	.eg-sec .dcz .farmer{ font-size:12px; }
	.eg-sec .dcz .dc-nm{ font-size:14px; min-height:38px; margin-bottom:4px; }
	.eg-sec .dcz .dc-price{ margin-top:5px; column-gap:4px; }
	.eg-sec .dcz .dc-now{ font-size:17px; }
	.eg-sec .dcz .dc-now .u{ font-size:12px; }
	.eg-sec .dcz .dc-old{ font-size:12px; }
}

/* ═══ [2026-09-29 v1.2.2] 모바일 메인: 담기를 썸네일 안 표준 아이콘으로(팀장: "담기 버튼 썸네일 안에 있어야")
   card_flat_m.js 1.2.4 가 .eg-card 를 표준 카드로 처리 → .cfm-card(상자 해제)·.cfm-ph(사진)·.cfm-ic(38px 원형 담기).
   버튼 규칙은 card_flat_m.css §4(!important)가 v1.1.0 블록을 이긴다. 여기서는 상자가 풀린 뒤 글 영역을
   다른 플랫 카드와 같이 사진 좌측선에 맞추는 것만(.body 가 a.dcz-link 안에 있어 §3 직계 규칙이 못 닿는다). */
body .mrdz .eg-card .body{ padding-left:2px; padding-right:2px; }   /* 품절 카드(.cfm-card 미부여)도 같은 플랫 규격 */
body .mrdz .eg-card{ border:0; background:transparent; }
body .mrdz .eg-card .thumb{ border-radius:8px; overflow:hidden; }