/* =====================================================================
 * 약관 페이지 (이용약관 / 개인정보처리방침)
 *
 * 원문 HTML(project/H&B Asia/약관/원본/)은 자체 <style>을 갖고 있었으나,
 * 사이트와 따로 노는 문서가 되지 않도록 그 스타일을 걷어내고 ENVY 토큰
 * (--envy-*)으로 다시 짰다. 마크업 클래스명은 원문 그대로 유지한다
 * (.doc / .toc / .clauses / .callout / .buchik) — 원문을 갱신해도 그대로 붙게.
 *
 * 대표 지시(2026-08-11): 이 페이지엔 **사이트 헤더를 넣지 않고 푸터만** 둔다.
 * ===================================================================== */

.envy-legal {
	margin: 0;
	font-family: "Pretendard", "Apple SD Gothic Neo", -apple-system, BlinkMacSystemFont, "Malgun Gothic", sans-serif;
	color: var(--envy-ink, #1d1f1c);
	line-height: 1.75;
	background: #fff;
	-webkit-text-size-adjust: 100%;
}

.envy-legal__wrap {
	max-width: 820px;
	margin: 0 auto;
	padding: 56px 20px 80px;
}

/* ── 문서 머리말 ── */
.envy-legal header.doc {
	border-bottom: 2px solid var(--envy-ink, #1d1f1c);
	padding-bottom: 18px;
	margin-bottom: 26px;
}
.envy-legal h1 {
	font-size: 28px;
	font-weight: 700;
	margin: 0 0 8px;
	letter-spacing: -0.02em;
	color: var(--envy-ink, #1d1f1c);
}
.envy-legal .meta { color: var(--envy-gray, #8a8f88); font-size: 14px; }
.envy-legal .company { color: var(--envy-gray, #8a8f88); font-size: 15px; margin: 4px 0 0; }

.envy-legal .note {
	background: var(--envy-bg, #f6f7f4);
	border: 1px solid var(--envy-line, #e7e9e5);
	border-radius: 8px;
	padding: 12px 16px;
	margin: 0 0 26px;
	font-size: 14px;
	color: var(--envy-sub, #666);
}

/* ── 목차 ── */
.envy-legal .toc {
	background: var(--envy-bg, #f6f7f4);
	border: 1px solid var(--envy-line, #e7e9e5);
	border-radius: 8px;
	padding: 18px 22px;
	margin: 0 0 32px;
}
.envy-legal .toc h2 { margin: 0 0 10px; font-size: 16px; padding-top: 0; }
.envy-legal .toc ol { columns: 2; column-gap: 28px; margin: 0; padding-left: 20px; }
.envy-legal .toc a { color: var(--envy-ink, #1d1f1c); text-decoration: none; }
.envy-legal .toc a:hover { text-decoration: underline; color: var(--envy-green, #4f8a3d); }

/* ── 조항 ── */
.envy-legal h2 {
	font-size: 18px;
	font-weight: 700;
	margin: 34px 0 10px;
	padding-top: 6px;
	letter-spacing: -0.01em;
	color: var(--envy-ink, #1d1f1c);
	scroll-margin-top: 24px;   /* 목차 앵커 이동 시 제목이 상단에 붙지 않게 */
}
.envy-legal h2 .num { color: var(--envy-green, #4f8a3d); font-weight: 700; margin-right: 6px; }

.envy-legal p { margin: 0 0 12px; }
.envy-legal ol.clauses { margin: 0 0 14px; padding-left: 22px; }
.envy-legal ol.clauses > li { margin: 0 0 8px; }
.envy-legal ul { margin: 6px 0 14px; padding-left: 20px; }
.envy-legal li { margin: 0 0 6px; }

/* ── 강조 박스 ── */
.envy-legal .callout {
	border-left: 4px solid var(--envy-green, #4f8a3d);
	background: var(--envy-bg, #f6f7f4);
	padding: 14px 16px;
	border-radius: 0 8px 8px 0;
	margin: 16px 0;
}
.envy-legal .callout .tag {
	display: inline-block;
	font-weight: 700;
	color: var(--envy-green, #4f8a3d);
	margin-bottom: 6px;
}
/* 신선식품 청약철회 등 '주의' 성격 박스 — 사이트에 경고 토큰이 없어 이 페이지 한정 색 */
.envy-legal .callout.warn { border-left-color: #8a5a00; background: #fbf6ec; }
.envy-legal .callout.warn .tag { color: #8a5a00; }

/* ── 머리말 박스 (개인정보처리방침 도입부) ── */
.envy-legal .intro {
	background: var(--envy-bg, #f6f7f4);
	border: 1px solid var(--envy-line, #e7e9e5);
	border-radius: 8px;
	padding: 16px 18px;
	margin: 0 0 26px;
	font-size: 15px;
}

/* ── 개인정보 보호책임자 표 (성명/직책/이메일) ──
 * 원문은 라벨(.k)과 값(.v)을 flex 2열 표로 그린다. 이 규칙이 없으면 라벨과 값이
 * 그대로 붙어 "성명임정균"처럼 읽힌다(2026-08-11 렌더 확인에서 발견).
 */
.envy-legal .officer {
	list-style: none;
	padding: 0;
	margin: 8px 0 14px;
	border: 1px solid var(--envy-line, #e7e9e5);
	border-radius: 8px;
	overflow: hidden;
}
.envy-legal .officer li {
	display: flex;
	margin: 0;
	border-bottom: 1px solid var(--envy-line, #e7e9e5);
}
.envy-legal .officer li:last-child { border-bottom: 0; }
.envy-legal .officer .k {
	flex: 0 0 110px;
	background: var(--envy-bg, #f6f7f4);
	padding: 9px 14px;
	font-weight: 600;
	color: var(--envy-sub, #666);
}
.envy-legal .officer .v { padding: 9px 14px; }

/* ── 문서 꼬리말 / 부칙 ── */
.envy-legal footer.doc {
	margin-top: 40px;
	padding-top: 18px;
	border-top: 1px solid var(--envy-line, #e7e9e5);
	color: var(--envy-gray, #8a8f88);
	font-size: 14px;
}
.envy-legal .buchik {
	margin-top: 36px;
	padding: 16px 18px;
	border: 1px solid var(--envy-line, #e7e9e5);
	border-radius: 8px;
	background: var(--envy-bg, #f6f7f4);
}
.envy-legal .buchik h2 { margin: 0 0 8px; }

.envy-legal a { color: var(--envy-green, #4f8a3d); }

@media (max-width: 600px) {
	.envy-legal .toc ol { columns: 1; }
	.envy-legal__wrap { padding: 32px 16px 60px; }
	.envy-legal h1 { font-size: 24px; }
}

@media print {
	.envy-legal .toc,
	.envy-legal + .envy-footer,
	.envy-footer { display: none; }
	.envy-legal { font-size: 11pt; }
}
