@charset "utf-8";
/* ═══════════════════════════════════════════════════════════════════════
   증정(사은) 안내 — 상세페이지 상단 카드 (2026-08-06 신설) v1.1.0

   [3면 역할 분담] 2026-08-06 사용자 지시
     · 카드 썸네일 = 「증정」 딱지만(기존 뱃지 그대로) → 이 파일은 카드 뱃지에 아무 규칙도 두지 않는다.
     · 상세페이지  = 기간 · 조건 · 증정품명 전체 정보 → .gvdt_etgift (이 파일).
     · 장바구니    = 진행상태·증정 행(order_ck.css / cart_ck.js, 별개 단위) → 무접촉.

   전 선택자가 `.gvdt` 하위로 스코프 → 상세 리뉴얼 화면 밖으로 침투 0.
   ═══════════════════════════════════════════════════════════════════════ */

/* 위치 = 가격(.price-box) 바로 아래.
   딥그린 톤(두레 브랜드) + 왼쪽 굵은 선으로 '혜택'임을 한눈에. PC/모바일 공용. */
.gvdt .gvdt_etgift {
	margin: 10px 0 0;
	padding: 12px 14px;
	border: 1px solid #cfe6d6;
	border-left: 4px solid #1f7a45;
	border-radius: 10px;
	background: #f3faf5;
}
.gvdt .gvdt_etgift .etg_head {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	margin-bottom: 6px;
}
.gvdt .gvdt_etgift .etg_ic {
	flex: 0 0 auto;
	color: #1f7a45;
}
.gvdt .gvdt_etgift .etg_tt {
	font-size: 13px;
	font-weight: 700;
	color: #1f7a45;
	letter-spacing: -.02em;
}
/* 기간 — 서버 렌더는 '공급기간 : 2026-08-10 ~ 2026-08-14', et_gift.js 가 '8/10~8/14' 로 줄인다. */
.gvdt .gvdt_etgift .etg_period {
	margin-left: auto;
	font-size: 12px;
	color: #4b6b58;
	letter-spacing: -.02em;
}
/* 증정 내용 한 줄 — 이 화면의 주인공(조건수량 + 증정품명 + 수량). JS 가 채운다. */
.gvdt .gvdt_etgift .etg_item {
	font-size: 15px;
	font-weight: 700;
	color: #14532d;
	line-height: 1.45;
	letter-spacing: -.02em;
	word-break: keep-all;
}
/* 사전이 없어 못 채운 경우 빈 줄이 남지 않게. */
.gvdt .gvdt_etgift .etg_item:empty {
	display: none;
}
/* 기획 안내문(ET_MASTER.BIGO) — 보조. 증정 내용이 이미 있으면 한 톤 낮춘다. */
.gvdt .gvdt_etgift .etg_desc {
	font-size: 13px;
	color: #3d5a49;
	line-height: 1.5;
	letter-spacing: -.02em;
	word-break: keep-all;
}
.gvdt .gvdt_etgift .etg_item + .etg_desc {
	margin-top: 3px;
	font-size: 12px;
	color: #5c7a68;
}
.gvdt .gvdt_etgift .etg_note {
	margin: 6px 0 0;
	font-size: 12px;
	color: #6b8878;
	letter-spacing: -.02em;
}

/* 모바일 상세는 좌우 폭이 좁다 — 기간을 아래 줄로 흘린다. */
@media (max-width: 767px) {
	.gvdt .gvdt_etgift {
		padding: 11px 12px;
	}
	.gvdt .gvdt_etgift .etg_period {
		margin-left: 0;
		width: 100%;
	}
	.gvdt .gvdt_etgift .etg_item {
		font-size: 14px;
	}
}