/* 파이어집 소개 페이지 (2026-11-04)
   html/business/firezip.php, html/en/business/firezip.php 에서만 불러온다. 모든 규칙은 .fzp 아래에만 건다. */

.fzp, .fzp-hero, .fzp-dock {
	--fz-red: #BC1C24;
	--fz-red2: #E8452C;
	--fz-deep: #A8102A;
	--fz-navy: #1E3A6E;
	--fz-ink: #1b1f27;
	--fz-gray: #5b6270;
}
.fzp *, .fzp-hero *, .fzp-dock * { box-sizing: border-box; }

/* ── 1. 히어로 (사이트 서브 비주얼 자리) ───────────────────────── */
#sub_visual.fzp-hero, #sub_visual.fzp-hero .backgroundimg { height: auto; background: #1a0d0d; }
#sub_visual.fzp-hero .visual_area { position: relative; display: block; height: auto; min-height: 720px; overflow: hidden; text-align: left; }
.fzp-hero-bg { position: absolute; inset: 0; z-index: 0; }
.fzp-hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; display: block; }
.fzp-hero-bg::after { /* 어두운 그라데이션 */
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(90deg, rgba(14, 8, 10, .92) 0%, rgba(14, 8, 10, .72) 42%, rgba(14, 8, 10, .25) 75%, rgba(14, 8, 10, .45) 100%),
	            linear-gradient(0deg, rgba(168, 16, 42, .55) 0%, rgba(168, 16, 42, 0) 30%);
}
.fzp-hero-in {
	position: relative; z-index: 1;
	width: 100%; max-width: 65%; margin: 0 auto;
	padding: 170px 0 70px;
	min-height: 720px;
	display: flex; flex-direction: column; justify-content: center;
}
.fzp-logo { display: inline-flex; align-items: center; align-self: flex-start; padding: 10px 16px; border-radius: 12px; background: #fff; box-shadow: 0 10px 30px -12px rgba(0, 0, 0, .6); }
.fzp-logo img { display: block; height: 34px; width: auto; }
.fzp-chip {
	display: inline-flex; align-items: center; gap: 8px; align-self: flex-start;
	margin: 22px 0 0; padding: 8px 16px; border-radius: 999px;
	font-size: 15px; font-weight: 600; color: #fff;
	background: linear-gradient(90deg, var(--fz-red), var(--fz-red2));
	box-shadow: 0 8px 20px -10px rgba(232, 69, 44, .9);
}
.fzp-chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #fff; }
.fzp-title {
	margin: 18px 0 0; max-width: 760px;
	font-size: 60px; line-height: 1.15; font-weight: 700; letter-spacing: -0.02em;
	color: #fff; text-align: left; word-break: keep-all;
}
.fzp-title small { display: block; font-size: 26px; font-weight: 600; letter-spacing: 0; color: rgba(255, 255, 255, .85); margin-bottom: 6px; }
.fzp-title strong { color: var(--fz-red2); text-shadow: 0 0 28px rgba(232, 69, 44, .45); }
.fzp-hero .fzp-sub { margin: 16px 0 0; font-size: 22px; line-height: 1.5; font-weight: 500; color: rgba(255, 255, 255, .92); word-break: keep-all; }
.fzp-badges { display: flex; flex-wrap: wrap; gap: 10px; margin: 34px 0 0; padding: 0; list-style: none; max-width: 860px; }
.fzp-badges li {
	list-style: none; display: inline-flex; align-items: center; gap: 8px;
	padding: 9px 14px; border-radius: 12px;
	font-size: 14px; line-height: 1.35; color: #fff;
	background: rgba(255, 255, 255, .1); border: 1px solid rgba(255, 255, 255, .28);
	backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
}
.fzp-badges li b { font-weight: 700; }
.fzp-badges li::before {
	content: ""; flex: 0 0 18px; width: 18px; height: 18px; border-radius: 50%;
	background: var(--fz-red2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/12px no-repeat;
}
.fzp-hero-prod { position: absolute; right: 2%; bottom: 40px; width: 34%; max-width: 460px; z-index: 1; pointer-events: none; }
.fzp-hero-prod img { display: block; width: 100%; height: auto; filter: drop-shadow(0 30px 30px rgba(0, 0, 0, .55)); }
.fzp-hero-prod--card { right: 6%; bottom: 90px; width: 300px; }
.fzp-hero-prod--card .fzp-logocard { display: flex; align-items: center; justify-content: center; height: 170px; border-radius: 24px; background: #fff; box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7); }
.fzp-hero-prod--card .fzp-logocard img { width: 78%; height: auto; filter: none; }
.fzp-float { animation: fzp-float 6s ease-in-out infinite; }
@keyframes fzp-float { 0%, 100% { transform: translateY(-8px); } 50% { transform: translateY(8px); } }

/* ── 본문 공통 ───────────────────────────────────────────────── */
.fzp { padding: 30px 0 40px; color: var(--fz-ink); text-align: left; }
.fzp-sec { clear: both; padding: 70px 0 0; }
.fzp-h2 {
	display: flex; align-items: center; gap: 14px;
	margin: 0 0 30px; padding: 16px 24px; border-radius: 14px;
	font-size: 26px; line-height: 1.35; font-weight: 700; color: #fff; text-align: left;
	background: linear-gradient(90deg, var(--fz-navy), #2c4f8f);
	word-break: keep-all;
}
.fzp-h2::before { content: ""; flex: 0 0 6px; align-self: stretch; border-radius: 3px; background: linear-gradient(180deg, var(--fz-red2), var(--fz-red)); }
.fzp-h3 { margin: 34px 0 14px; font-size: 20px; font-weight: 700; color: var(--fz-navy); text-align: left; word-break: keep-all; }
.fzp-lead { margin: 0; font-size: 19px; line-height: 1.7; color: #333; word-break: keep-all; }
.fzp-note { margin: 12px 0 0; font-size: 14px; color: var(--fz-gray); }
.fzp-big-line {
	margin: 40px 0 0; text-align: center;
	font-size: 30px; line-height: 1.4; font-weight: 800; color: var(--fz-red); word-break: keep-all;
}

/* ── 2. 연표 ─────────────────────────────────────────────────── */
.fzp-timeline { position: relative; margin: 0; padding: 0 0 0 34px; list-style: none; }
.fzp-timeline::before { content: ""; position: absolute; left: 9px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: linear-gradient(180deg, var(--fz-red2), var(--fz-deep)); }
.fzp-timeline li { position: relative; list-style: none; margin: 0 0 18px; padding: 20px 24px; border-radius: 14px; background: #fff; border: 1px solid #e7e9ee; box-shadow: 0 10px 24px -18px rgba(30, 58, 110, .45); }
.fzp-timeline li::before { content: ""; position: absolute; left: -32px; top: 26px; width: 16px; height: 16px; border-radius: 50%; background: #fff; border: 4px solid var(--fz-red); }
.fzp-tl-date { display: inline-block; font-size: 15px; font-weight: 800; color: var(--fz-red); letter-spacing: .02em; }
.fzp-tl-title { display: block; margin-top: 4px; font-size: 19px; font-weight: 700; color: var(--fz-navy); word-break: keep-all; }
.fzp-tl-desc { display: block; margin-top: 6px; font-size: 16px; line-height: 1.65; color: #444; word-break: keep-all; }

/* ── 3. 숫자 3개 ─────────────────────────────────────────────── */
.fzp-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin: 0; padding: 0; list-style: none; }
.fzp-nums li { list-style: none; padding: 34px 26px; border-radius: 20px; text-align: center; background: linear-gradient(160deg, #fff 0%, #fff4f1 100%); border: 1px solid #f3d6cf; box-shadow: 0 20px 40px -28px rgba(188, 28, 36, .55); }
.fzp-num { display: block; font-size: 64px; line-height: 1.05; font-weight: 900; color: var(--fz-red); font-variant-numeric: tabular-nums; white-space: nowrap; letter-spacing: -0.02em; }
.fzp-num em { font-style: normal; font-size: .5em; font-weight: 800; margin-left: 2px; }
.fzp-num-label { display: block; margin-top: 12px; font-size: 17px; line-height: 1.5; color: #333; word-break: keep-all; }

/* ── 4. 실험 ─────────────────────────────────────────────────── */
.fzp-pair { display: grid; grid-template-columns: 0.75fr 1.25fr; gap: 16px; align-items: stretch; }
.fzp-pair figure, .fzp-fig { margin: 0; border-radius: 16px; overflow: hidden; background: #111; box-shadow: 0 16px 36px -24px rgba(0, 0, 0, .7); }
.fzp-pair img, .fzp-fig img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fzp-compare { position: relative; border-radius: 16px; overflow: hidden; background: #333; aspect-ratio: 1600 / 299; box-shadow: 0 16px 36px -24px rgba(0, 0, 0, .7); user-select: none; -webkit-user-select: none; touch-action: pan-y; }
.fzp-compare img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.fzp-compare .fzp-cmp-top { clip-path: inset(0 calc(100% - var(--fz-pos, 50%)) 0 0); }
.fzp-cmp-label { position: absolute; top: 12px; z-index: 2; padding: 6px 12px; border-radius: 999px; font-size: 14px; font-weight: 700; color: #fff; }
.fzp-cmp-label--l { left: 12px; background: rgba(30, 58, 110, .9); }
.fzp-cmp-label--r { right: 12px; background: linear-gradient(90deg, var(--fz-red), var(--fz-red2)); }
.fzp-cmp-handle { position: absolute; top: 0; bottom: 0; left: var(--fz-pos, 50%); z-index: 3; width: 4px; margin-left: -2px; background: #fff; box-shadow: 0 0 0 1px rgba(0, 0, 0, .2); pointer-events: none; }
.fzp-cmp-handle::after { content: "◀ ▶"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); padding: 8px 10px; border-radius: 999px; background: #fff; color: var(--fz-red); font-size: 12px; font-weight: 800; white-space: nowrap; box-shadow: 0 6px 16px rgba(0, 0, 0, .35); }
.fzp-compare input[type=range] { position: absolute; inset: 0; z-index: 4; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.fzp-compare input[type=range]:focus-visible + .fzp-cmp-handle::after { outline: 3px solid var(--fz-red2); outline-offset: 2px; }
.fzp-cmp-hint { margin: 10px 0 0; font-size: 14px; color: var(--fz-gray); text-align: center; }
.fzp-videos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 30px; }
.fzp-video { position: relative; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: #111; box-shadow: 0 16px 36px -24px rgba(0, 0, 0, .7); }
.fzp-video button { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: none; cursor: pointer; }
.fzp-video img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fzp-video .fzp-poster { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: radial-gradient(circle at 50% 40%, #3a1418 0%, #12080a 75%); }
.fzp-video .fzp-poster img { width: 46%; height: auto; object-fit: contain; }
.fzp-play { position: absolute; left: 50%; top: 50%; width: 74px; height: 52px; margin: -26px 0 0 -37px; border-radius: 14px; background: rgba(188, 28, 36, .92); box-shadow: 0 10px 24px rgba(0, 0, 0, .45); transition: transform .25s ease, background .25s ease; }
.fzp-play::after { content: ""; position: absolute; left: 50%; top: 50%; margin: -11px 0 0 -7px; border-style: solid; border-width: 11px 0 11px 19px; border-color: transparent transparent transparent #fff; }
.fzp-video button:hover .fzp-play, .fzp-video button:focus-visible .fzp-play { transform: scale(1.08); background: var(--fz-red2); }
.fzp-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* ── 5. 비용 막대 ────────────────────────────────────────────── */
.fzp-cost { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 34px; align-items: center; }
.fzp-bars { margin: 0; padding: 0; list-style: none; }
.fzp-bars li { list-style: none; margin: 0 0 22px; }
.fzp-bar-label { display: block; margin-bottom: 8px; font-size: 16px; font-weight: 600; color: #333; word-break: keep-all; }
.fzp-bar { position: relative; display: block; height: 34px; border-radius: 10px; background: #eef0f4; overflow: hidden; }
.fzp-bar i { position: absolute; left: 0; top: 0; bottom: 0; width: var(--fz-w, 0%); border-radius: 10px; transition: width 1.4s cubic-bezier(.2, .7, .2, 1); }
.fzp-bar--a i { background: linear-gradient(90deg, #8b93a3, #5b6270); }
.fzp-bar--b i { background: linear-gradient(90deg, var(--fz-red), var(--fz-red2)); }
.fzp-js .fzp-bar i { width: 0; }
.fzp-js .is-in .fzp-bar i, .fzp-js .fzp-bars.is-in .fzp-bar i { width: var(--fz-w); }
.fzp-save {
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	width: 190px; height: 190px; border-radius: 50%;
	color: #fff; text-align: center;
	background: radial-gradient(circle at 35% 30%, var(--fz-red2), var(--fz-red) 60%, var(--fz-deep));
	box-shadow: 0 20px 40px -16px rgba(188, 28, 36, .8);
}
.fzp-save b { display: block; font-size: 56px; line-height: 1; font-weight: 900; }
.fzp-save > span { display: block; margin-top: 6px; font-size: 18px; font-weight: 700; letter-spacing: .04em; }

/* ── 6. 사용법 식 ────────────────────────────────────────────── */
.fzp-eq { display: flex; align-items: stretch; justify-content: center; gap: 14px; flex-wrap: wrap; }
.fzp-eq-item { flex: 1 1 200px; max-width: 290px; padding: 26px 18px; border-radius: 18px; text-align: center; background: #fff; border: 2px solid #e7e9ee; }
.fzp-eq-item b { display: block; font-size: 30px; font-weight: 900; color: var(--fz-navy); white-space: nowrap; }
.fzp-eq-item span { display: block; margin-top: 6px; font-size: 16px; color: #444; word-break: keep-all; }
.fzp-eq-item--fz { border-color: var(--fz-red); background: #fff6f4; }
.fzp-eq-item--fz b { color: var(--fz-red); }
.fzp-eq-item--res { border-color: var(--fz-navy); background: var(--fz-navy); }
.fzp-eq-item--res b, .fzp-eq-item--res span { color: #fff; }
.fzp-eq-op { display: flex; align-items: center; font-size: 40px; font-weight: 900; color: var(--fz-red); }
.fzp-eq-add { margin: 22px auto 0; max-width: 900px; padding: 16px 22px; border-radius: 14px; background: #f5f7fb; font-size: 17px; line-height: 1.6; color: #333; text-align: center; word-break: keep-all; }

/* ── 7. 비축 ─────────────────────────────────────────────────── */
.fzp-stock { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: center; }
.fzp-stock--text { grid-template-columns: 1fr; }
.fzp-stock-key { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: 0 0 16px; font-size: 30px; font-weight: 900; color: var(--fz-navy); word-break: keep-all; }
.fzp-stock-key b { color: var(--fz-red); }
.fzp-stock-key .fzp-arrow { color: var(--fz-red2); }

/* ── 8. 생분해 게이지 ────────────────────────────────────────── */
.fzp-gauges { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin: 0; padding: 0; list-style: none; }
.fzp-gauges li { list-style: none; text-align: center; padding: 26px 10px; border-radius: 20px; background: #fff; border: 1px solid #e7e9ee; }
.fzp-gauge { position: relative; width: 170px; height: 170px; margin: 0 auto; }
.fzp-gauge svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.fzp-gauge circle { fill: none; stroke-width: 12; }
.fzp-gauge .bg { stroke: #eef0f4; }
.fzp-gauge .fg { stroke: url(#fzp-grad); stroke-linecap: round; stroke-dasharray: 289.03; stroke-dashoffset: calc(289.03 * (1 - var(--fz-v, 0))); transition: stroke-dashoffset 1.6s cubic-bezier(.2, .7, .2, 1); }
.fzp-js .fzp-gauge .fg { stroke-dashoffset: 289.03; }
.fzp-js .is-in .fzp-gauge .fg { stroke-dashoffset: calc(289.03 * (1 - var(--fz-v, 0))); }
.fzp-gauge-val { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: 34px; font-weight: 900; color: var(--fz-red); font-variant-numeric: tabular-nums; }
.fzp-gauge-name { display: block; margin-top: 12px; font-size: 18px; font-weight: 700; color: var(--fz-navy); }

/* ── 9. 현장 선택 ────────────────────────────────────────────── */
.fzp-proof { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.fzp-cert { margin: 0; padding: 16px; border-radius: 18px; background: #fff; border: 1px solid #e7e9ee; box-shadow: 0 16px 34px -26px rgba(30, 58, 110, .6); }
.fzp-cert img { display: block; width: 100%; height: auto; border-radius: 8px; }
.fzp-cert figcaption { margin-top: 12px; font-size: 15px; line-height: 1.6; color: #333; word-break: keep-all; }
.fzp-cert figcaption b { display: block; color: var(--fz-navy); }
.fzp-cert--text { display: flex; flex-direction: column; justify-content: center; min-height: 160px; padding: 26px; border-left: 6px solid var(--fz-red); }
.fzp-buyers { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 24px 0 0; padding: 0; list-style: none; }
.fzp-buyers li { list-style: none; display: flex; align-items: center; justify-content: center; min-height: 92px; padding: 16px 12px; border-radius: 14px; text-align: center; font-size: 15px; line-height: 1.45; font-weight: 700; color: var(--fz-navy); background: #f5f7fb; border-top: 4px solid var(--fz-red); word-break: keep-all; }

/* ── 10. 판단 기준 ───────────────────────────────────────────── */
.fzp-criteria { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; list-style: none; }
.fzp-criteria li { list-style: none; padding: 24px 20px; border-radius: 18px; background: #fff; border: 1px solid #e7e9ee; box-shadow: 0 14px 30px -24px rgba(30, 58, 110, .55); }
.fzp-criteria li::before { content: ""; display: block; width: 40px; height: 40px; margin-bottom: 12px; border-radius: 12px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.2 4.2L19 7'/%3E%3C/svg%3E") center/22px no-repeat, linear-gradient(135deg, var(--fz-red), var(--fz-red2)); }
.fzp-criteria b { display: block; font-size: 19px; font-weight: 800; color: var(--fz-navy); letter-spacing: .02em; }
.fzp-criteria span { display: block; margin-top: 6px; font-size: 16px; line-height: 1.55; color: #444; word-break: keep-all; }

/* ── 11. 바로가기 ────────────────────────────────────────────── */
.fzp-cta { margin: 80px 0 20px; padding: 56px 24px; border-radius: 26px; text-align: center; background: radial-gradient(circle at 50% 0%, #3a1418 0%, #160a0c 70%); }
.fzp-cta-line { margin: 0 0 30px; font-size: 30px; line-height: 1.4; font-weight: 800; color: #fff; word-break: keep-all; }
.fzp-cta-btns { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 18px; }
.fzp-go {
	position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 14px;
	min-width: 380px; min-height: 80px; padding: 0 40px; border-radius: 999px;
	font-size: 26px; font-weight: 800; color: #fff; text-decoration: none; letter-spacing: -0.01em;
	background: linear-gradient(90deg, var(--fz-red), var(--fz-red2));
	box-shadow: 0 0 0 0 rgba(232, 69, 44, .55), 0 18px 34px -14px var(--fz-deep);
	animation: fzp-pulse 2.5s ease-in-out infinite;
	transition: transform .3s ease, filter .3s ease;
}
.fzp-go:hover, .fzp-go:focus-visible { color: #fff; transform: scale(1.05); filter: brightness(1.08); animation-duration: 1.6s; }
.fzp-go:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.fzp-go .fzp-arr { display: inline-block; animation: fzp-arr 1.2s ease-in-out infinite; }
@keyframes fzp-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(232, 69, 44, .55), 0 18px 34px -14px var(--fz-deep); }
	50% { box-shadow: 0 0 0 16px rgba(232, 69, 44, 0), 0 0 46px 6px rgba(232, 69, 44, .55), 0 18px 34px -14px var(--fz-deep); }
}
@keyframes fzp-arr { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(7px); } }
.fzp-ask {
	display: inline-flex; align-items: center; justify-content: center; min-height: 54px; padding: 0 26px;
	border-radius: 999px; font-size: 16px; font-weight: 700; color: #fff; text-decoration: none;
	border: 2px solid rgba(255, 255, 255, .7); transition: background .3s ease, color .3s ease;
}
.fzp-ask:hover, .fzp-ask:focus-visible { color: var(--fz-red); background: #fff; }

/* 모바일 화면 아래 고정 버튼 */
.fzp-dock { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 9990; display: none; align-items: center; gap: 8px; transform: translateY(140%); transition: transform .4s cubic-bezier(.2, .7, .2, 1); }
.fzp-dock.is-on { transform: none; }
.fzp-dock[hidden] { display: none !important; }
.fzp-dock a { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; border-radius: 999px; font-size: 17px; font-weight: 800; color: #fff; text-decoration: none; background: linear-gradient(90deg, var(--fz-red), var(--fz-red2)); box-shadow: 0 10px 24px -8px rgba(168, 16, 42, .9); }
.fzp-dock button { flex: 0 0 44px; width: 44px; height: 44px; border: 0; border-radius: 50%; font-size: 20px; line-height: 44px; color: #fff; background: rgba(20, 20, 24, .85); cursor: pointer; }

/* 스크롤해서 보일 때 차례로 나타나기 (.fzp-js 일 때만 숨김) */
.fzp-js .fzp-rv { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .2, 1); transition-delay: calc(var(--fz-i, 0) * 90ms); }
.fzp-js .fzp-rv.is-in { opacity: 1; transform: none; }

/* ── 화면 폭 ─────────────────────────────────────────────────── */
@media (max-width: 1500px) {
	.fzp-title { font-size: 50px; }
	.fzp-hero-prod { width: 30%; }
	.fzp-num { font-size: 54px; }
}
@media (max-width: 1280px) {
	.fzp-hero-in { max-width: 92%; }
	.fzp-hero-prod { width: 30%; right: 3%; }
	.fzp-buyers { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.fzp-criteria { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
	#sub_visual.fzp-hero .visual_area, .fzp-hero-in { min-height: 0; }
	.fzp-hero-in { padding: 110px 0 300px; }
	.fzp-title { font-size: 42px; }
	.fzp-title small { font-size: 22px; }
	.fzp-hero .fzp-sub { font-size: 19px; }
	.fzp-hero-prod { width: 300px; left: 50%; right: auto; bottom: 20px; margin-left: -150px; }
	.fzp-hero-prod--card { width: 260px; margin-left: -130px; bottom: 60px; }
	.fzp-hero-prod--card .fzp-logocard { height: 150px; }
	.fzp { padding: 10px 16px 30px; }
	.fzp-nums { grid-template-columns: 1fr; }
	.fzp-pair { grid-template-columns: 1fr; }
	.fzp-cost { grid-template-columns: 1fr; justify-items: center; }
	.fzp-bars { width: 100%; }
	.fzp-stock { grid-template-columns: 1fr; }
	.fzp-proof { grid-template-columns: 1fr; }
	.fzp-dock { display: flex; }
}
@media (max-width: 768px) {
	.fzp-hero-in { padding: 90px 0 270px; }
	.fzp-logo img { height: 26px; }
	.fzp-chip { font-size: 13px; padding: 7px 13px; }
	.fzp-title { font-size: 34px; }
	.fzp-title small { font-size: 18px; }
	.fzp-hero .fzp-sub { font-size: 16px; }
	.fzp-badges { gap: 8px; margin-top: 24px; }
	.fzp-badges li { font-size: 12.5px; padding: 7px 10px; }
	.fzp-hero-prod { width: 240px; margin-left: -120px; }
	.fzp-hero-prod--card { width: 220px; margin-left: -110px; }
	.fzp-hero-prod--card .fzp-logocard { height: 120px; }
	.fzp-sec { padding-top: 50px; }
	.fzp-h2 { font-size: 20px; padding: 13px 16px; }
	.fzp-lead { font-size: 16px; }
	.fzp-big-line { font-size: 22px; }
	.fzp-timeline { padding-left: 26px; }
	.fzp-timeline li { padding: 16px; }
	.fzp-timeline li::before { left: -25px; }
	.fzp-timeline::before { left: 5px; }
	.fzp-tl-title { font-size: 17px; }
	.fzp-tl-desc { font-size: 15px; }
	.fzp-num { font-size: 48px; }
	.fzp-num-label { font-size: 15px; }
	.fzp-compare { aspect-ratio: auto; height: auto; }
	.fzp-compare img { position: relative; height: auto; }
	.fzp-compare .fzp-cmp-top { position: absolute; inset: 0; height: 100%; }
	.fzp-cmp-label { font-size: 12px; padding: 5px 9px; top: 8px; }
	.fzp-videos { grid-template-columns: 1fr; }
	.fzp-save { width: 150px; height: 150px; }
	.fzp-save b { font-size: 44px; }
	.fzp-eq { flex-direction: column; align-items: center; }
	.fzp-eq-item { width: 100%; max-width: 360px; flex: 0 0 auto; padding: 18px; }
	.fzp-eq-item b { font-size: 26px; }
	.fzp-eq-op { font-size: 30px; line-height: 1; }
	.fzp-eq-add { font-size: 15px; }
	.fzp-stock-key { font-size: 22px; }
	.fzp-gauges { grid-template-columns: 1fr; }
	.fzp-gauge { width: 150px; height: 150px; }
	.fzp-buyers { grid-template-columns: 1fr 1fr; }
	.fzp-criteria { grid-template-columns: 1fr; }
	.fzp-cta { padding: 40px 16px; margin-top: 60px; }
	.fzp-cta-line { font-size: 22px; }
	.fzp-cta-btns { flex-direction: column; align-items: stretch; }
	.fzp-go { min-width: 0; width: 100%; min-height: 72px; font-size: 22px; padding: 0 20px; }
	.fzp-ask { width: 100%; }
}

/* 움직임 줄이기 설정이면 효과를 모두 끔 */
@media (prefers-reduced-motion: reduce) {
	.fzp-float, .fzp-go, .fzp-go .fzp-arr { animation: none; }
	.fzp-go, .fzp-go:hover { transition: none; transform: none; }
	.fzp-js .fzp-rv { opacity: 1; transform: none; transition: none; }
	.fzp-bar i, .fzp-gauge .fg, .fzp-dock { transition: none; }
	.fzp-js .fzp-bar i { width: var(--fz-w); }
	.fzp-js .fzp-gauge .fg { stroke-dashoffset: calc(289.03 * (1 - var(--fz-v, 0))); }
}