/******************************************
	common.css (lfair)
	1px = 1rem (html font-size: 1px)
******************************************/

/* 토큰 */
:root {
	--green: #1EC95B;
	--green-600: #18A149;
	--green-700: #127937;
	--green-50: #ECFBF2;
	--green-100: #D2F4DE;
	--lime: #FFE629;
	--red: #FF3B30;
	--ink: #000;
	--t2: #333;
	--t3: #666;
	--t4: #999;
	--line: #E4E8F1;
	--bg-soft: #F8F9FA;
	--bg-band: #F5F5F7;
	--r12: 12rem;
	--r16: 16rem;
	--r24: 24rem;
	--rfull: 9999rem;
	--shadow-1: 0 4rem 10rem rgba(0,0,0,.04);
	--shadow-2: 0 8rem 20rem rgba(0,0,0,.06);
	--content: 1248rem;
	--z-header: 100;
	--ease: cubic-bezier(.2,.8,.2,1);
	--site-header-h: 80rem;
	--site-header-offset: var(--site-header-h);
	--site-header-motion: 0.2s ease-out;
	--catnav-h: 69rem;
}

/* sticky top은 즉시 전환 (iOS: transition/top 보간 시 sticky 이탈) */
html.is-header-hidden {
	--site-header-offset: 0;
}

/* 새로고침 스크롤 복원 전 최상단 노출 방지 */
html.lfair-scroll-pending,
html.lfair-scroll-pending body {
	visibility: hidden;
}

/* 리셋·기본 — overflow-x는 html이 아닌 body (iOS sticky 깨짐 방지) */
html {font-size: 1px;}
html, body {min-height: 100%; margin: 0; font-family: 'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; color: var(--ink); background: #fff; line-height: 1.5; letter-spacing: -.01em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
body {font-size: 20rem; overflow-x: clip;}
body, p, h1, h2, h3, h4, h5, h6, ul, ol, li, dl, dt, dd, table, th, td, form, fieldset, legend, input, textarea, button, select {margin: 0; padding: 0;}
header, footer, section, article, aside, nav, menu, figure, figcaption {display: block; margin: 0; padding: 0;}
ul, ol {list-style: none; font-size: 0;}
input, textarea, select, th, td, li, p {font-size: 14rem; font-family: 'Pretendard','Pretendard Variable',-apple-system,BlinkMacSystemFont,system-ui,sans-serif; line-height: 1.5; letter-spacing: -.01em;}
img, fieldset {margin: 0; padding: 0; border: 0; vertical-align: middle;}
input, select, button {vertical-align: middle;}
button {font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; -webkit-appearance: none; appearance: none;}
em, address, i, cite {font-style: normal;}
a {text-decoration: none; color: inherit;}
* {box-sizing: border-box; margin: 0; padding: 0;}
.formWrap {width: 100%; max-width: 1080rem; margin: 0 auto;}
*[class^="mo-"] {display: none;}
legend, caption {overflow: hidden; width: 1rem; height: 1rem; font-size: 0; line-height: 0;}
main {padding-top: var(--site-header-h);}

/* 푸터 */
footer {background: #000; color: #999999; padding: 100rem 0;}
footer .foot-grid {display: grid; grid-template-columns: 1.4fr 1fr; gap: 40rem;}
footer .foot-contact {text-align: right;}
footer .foot-logo {display: flex; align-items: center; margin-bottom: 40rem;}
footer .foot-logo svg {width: 188rem; height: 35rem; display: block; object-fit: contain;}
footer .foot-info {font-size: 14rem; line-height: 1.9; color: #9aa39e;}
footer .foot-info b {color: #cfd6d2; font-weight: 600;}
footer .foot-corp {font-size: 18rem; line-height: 150%; letter-spacing: -.018em;}
footer .foot-corp .fc-ceo {margin-left: 12rem;}
footer .foot-corp .fc-biz {margin-left: 12rem;}
footer .foot-contact > .foot-info {font-size: 20rem; font-weight: 600; line-height: 150%; letter-spacing: -.2rem;}
footer .foot-tel {font-size: 40rem; font-weight: 700; letter-spacing: -0.8rem; margin: 0; color: #fff; line-height: 130%;}
footer .copyright {font-size: 18rem; margin-top: 4rem; letter-spacing: -0.18rem; line-height: 150%;}
footer .ssl {display: flex; align-items: flex-start; gap: 8rem; margin-top: 24rem; white-space: nowrap; max-width: none;}
footer .ssl span {font-size: 14rem; line-height: 150%; letter-spacing: -0.14rem;}

/* 탑 버튼 */
footer .top-btn {display: none; position: fixed; right: 16rem; bottom: 96rem; z-index: 1002; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(14rem); transition: opacity .25s cubic-bezier(.2, .8, .2, 1), visibility .25s, transform .35s ease;}
footer .top-btn.show {opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0);}
body:has(#floating) footer .top-btn {bottom: 110rem;}
footer .top-btn button, footer .top-btn > span {display: flex; align-items: center; justify-content: center; width: 44rem; height: 44rem; padding: 0; border-radius: 9999rem; background: #fff; box-shadow: 0 0 0 1px #E2E2E5, 0 4rem 14rem rgba(0,0,0,.15); color: #333; cursor: pointer; font-size: 0; transition: transform .2s cubic-bezier(.2, .8, .2, 1), box-shadow .2s cubic-bezier(.2, .8, .2, 1);}
footer .top-btn button:hover, footer .top-btn > span:hover {transform: translateY(-2rem); box-shadow: 0 0 0 1px #E2E2E5, 0 8rem 20rem rgba(0,0,0,.12);}
footer .top-btn svg {width: 22rem; height: 22rem; display: block;}


/* 공용 배너 */
.title-banner {padding: 120rem 0 50rem; text-align: center;}
.title-banner > h1 {font-size: 50rem; color: #fff;}

/* floating */
.floating { position:fixed; left:0; right:0; bottom:0; z-index:1001; transform:translateY(120%); transition:transform .35s ease; pointer-events:none; }
.floating.show { transform:translateY(0); pointer-events:auto; }
body:has(#floating) .m-inquiry-bar { display:none !important; }
.floating-in { width:min(1248rem,100% - 48rem); margin:0 auto; padding:0 0 18rem; max-width:1248rem; }
.floating-bar { pointer-events:auto; background:rgba(51,51,51,.8); backdrop-filter:blur(15rem); -webkit-backdrop-filter:blur(15rem); border-radius:12rem; box-shadow:none; padding:12rem 24rem; min-height:72rem; display:flex; align-items:center; justify-content:space-between; gap:20rem; }
.floating-msg { color:#fff; font-size:20rem; font-weight:700; letter-spacing:-.02em; }
.floating-msg span { color:#FFE629; }
.floating-btns { display:flex; gap:12rem; }
.floating-btns .btn { display:inline-flex; align-items:center; justify-content:center; height:48rem; padding:0 60rem; border-radius:8rem; font-size:16rem; font-weight:700; text-decoration:none; border:none; cursor:pointer; font-family:inherit; transition:background .2s; }
.floating-btns .btn-green { background:#1EC95B; color:#fff; }
.floating-btns .btn-green:hover { background:#18A149; }
.floating-btns .btn-sm { height:48rem; padding:0 60rem; font-size:16rem; }


/* 공통 섹션 (bzone / panel) */
.saf-main-width {width: min(var(--content), 100% - 48rem); max-width: 1248rem; margin: 0 auto;}
main .panel {position: relative; background: #fff; border-radius: 32rem; padding: 74rem 46rem 76rem; max-width: 1248rem; margin: 0 auto; box-shadow: 0 12rem 40rem rgba(0,0,0,.06);}
main .ptab {position: absolute; top: 0; left: 50%; transform: translate(-50%, -50%); background: linear-gradient(90deg, #FC1D01, #FDA245); color: #fff; font-weight: 600; font-size: clamp(15rem, 1.9vw, 22rem); padding: 8rem 24rem; border-radius: var(--rfull); white-space: nowrap; box-shadow: none; display: inline-flex; align-items: center; gap: 8rem;}
main .panel-sub {text-align: center; font-size: clamp(18rem, 2.4vw, 26rem); font-weight: 700; color: #000; letter-spacing: -.02em; margin-bottom: 36rem;}

/* 혜택 존 (bzone) */
.bzone-wrap {position: relative; overflow: hidden; background: radial-gradient(50% 30% at 30% 3%, rgba(255,224,242,.85), rgba(255,224,242,0) 60%), radial-gradient(40% 22% at 6% 34%, rgba(208,196,247,.85), rgba(208,196,247,0) 60%), radial-gradient(36% 16% at 60% 74%, rgba(247,243,193,.75), rgba(247,243,193,0) 62%), radial-gradient(42% 24% at 97% 50%, rgba(255,232,246,.7), rgba(255,232,246,0) 60%), radial-gradient(40% 20% at 8% 90%, rgba(208,196,247,.6), rgba(208,196,247,0) 62%), linear-gradient(160deg, #BFE6FB 0%, #C6E7FA 30%, #BFE5FB 55%, #CCE8F8 78%, #D6EAF6 100%);}
.bzone-floats {position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden;}
main .bzone-floats .bf {position: absolute; display: block; filter: drop-shadow(0 14rem 24rem rgba(110, 90, 180, .18)); animation: bfdrift var(--dur, 16s) ease-in-out var(--delay, 0s) infinite; will-change: transform;}
main .bzone-floats .bf:nth-child(1) {width: 96rem; top: 2.5%; left: 3.5%; --dur: 7s; --delay: 0s; --dx: 14rem; --dy: -22rem; --rot: -4deg; --spin: 5deg;}
main .bzone-floats .bf:nth-child(2) {width: 200rem; top: 5.5%; right: 2%; --dur: 9s; --delay: -2s; --dx: -20rem; --dy: 24rem; --rot: 8deg; --spin: -7deg;}
main .bzone-floats .bf:nth-child(3) {width: 150rem; top: 23%; left: 1.5%; --dur: 10s; --delay: -5s; --dx: 22rem; --dy: 28rem; --rot: -9deg; --spin: 6deg;}
main .bzone-floats .bf:nth-child(4) {width: 70rem; top: 38%; right: 4.5%; --dur: 6.5s; --delay: -1s; --dx: -12rem; --dy: -20rem; --rot: 0deg; --spin: 8deg;}
main .bzone-floats .bf:nth-child(5) {width: 230rem; top: 50%; right: 1%; --dur: 11s; --delay: -7s; --dx: -24rem; --dy: -26rem; --rot: 7deg; --spin: -5deg;}
main .bzone-floats .bf:nth-child(6) {width: 130rem; top: 66%; left: 2.5%; --dur: 9.5s; --delay: -3s; --dx: 20rem; --dy: -24rem; --rot: -6deg; --spin: 7deg;}
main .bzone-floats .bf:nth-child(7) {width: 110rem; top: 81%; right: 3%; --dur: 8s; --delay: -6s; --dx: -16rem; --dy: 22rem; --rot: 3deg; --spin: -6deg;}
main .bzone-floats .bf:nth-child(8) {width: 175rem; top: 89%; left: 3%; --dur: 10.5s; --delay: -4s; --dx: 18rem; --dy: -20rem; --rot: 10deg; --spin: -8deg;}
@keyframes bfdrift {
	0% {transform: translate(0, 0) rotate(var(--rot, 0deg));}
	50% {transform: translate(var(--dx, 18rem), var(--dy, -26rem)) rotate(calc(var(--rot, 0deg) + var(--spin, 6deg)));}
	100% {transform: translate(0, 0) rotate(var(--rot, 0deg));}
}
@media (prefers-reduced-motion: reduce) {
	.bzone-floats .bf {animation: none;}
}
main .sec.bzone {position: relative; z-index: 1; padding: 0; background: transparent;}
main .sec.bzone.first {padding-top: 140rem;}
main .sec.bzone.last {padding-bottom: 140rem;}

/* winners */
main .winner-photos {display: grid; grid-template-columns: repeat(3, 1fr); gap: 16rem;}
main .winner-photo {border-radius: var(--r16); overflow: hidden; background: transparent;}
main .winner-photo img {width: 100%; height: 300rem; object-fit: cover; object-position: center; display: block; border-radius: var(--r12); border: none;}

@media screen and (max-width: 1080px) {
	/* 페이지 공통 */
	.formWrap {max-width: 100%; padding: 0 2.8vw; box-sizing: border-box;}
}

@media screen and (max-width: 1024px) {
	/* 푸터 */
	footer .foot-grid {grid-template-columns: 1fr 1fr; gap: 32rem;}

	/* winners */
	main .winner-photos {grid-template-columns: repeat(2, 1fr);}
	main .winner-photos > .winner-photo:last-child:nth-child(odd) {grid-column: 1 / -1; width: 50%; justify-self: center;}
}

@media screen and (max-width: 991px) {
	:root {
		--site-header-h: 64rem;
		--site-header-offset: var(--site-header-h);
		--catnav-h: 54rem;
	}

	/* 페이지 공통 */
	main {padding-top: var(--site-header-h);}
	.saf-main-width {padding: 0; width: calc(100% - 32rem);}

	/* 푸터 */
	footer {padding: 24rem 0 60rem;}
	/* floating은 footer 앞(content 안)에 있으므로 인접 형제 셀렉터 불가 → body:has */
	body:has(#floating.show) footer {padding-bottom: 141rem;}
	footer .foot-grid {display: flex; flex-direction: column; grid-template-columns: none; gap: 32rem; padding-bottom: 0;}
	footer .foot-contact {text-align: left; order: -1; display: flex; align-items: baseline; gap: 8rem;}
	footer .foot-contact > .foot-info {font-size: 16rem !important;}
	footer .foot-tel {font-size: 22rem !important;}
	footer .foot-logo {margin: 0 0 20rem !important;}
	footer .foot-logo svg {width: 120rem !important; height: 22rem !important;}
	footer .foot-info {font-size: 14rem !important; line-height: 1.7;}
	footer .foot-corp {font-size: 14rem !important;}
	footer .foot-corp .fc-ceo {margin-left: 2rem;}
	footer .foot-corp .fc-biz {margin-left: 0; display: block;}
	footer .foot-corp br {display: none;}
	footer .foot-corp .fc-addr {display: block; margin-top: 2rem;}
	footer .ssl {white-space: normal;}
	footer .ssl span {font-size: 13rem !important;}
	footer .copyright {font-size: 13rem !important;}

	/* 탑 버튼 */
	footer .top-btn { right: 16rem; display: block; }
	body:has(#floating) footer .top-btn { bottom: 96rem; }
	body:not(:has(#floating)) footer .top-btn { bottom: 88rem; }

	/* 모바일 하단 바 */
	.floating-in { width:100%; padding:0; }
	.floating-bar { flex-direction:column; gap:0; padding:12rem 16rem; min-height:0; border-radius:0; background:#fff; backdrop-filter:none; -webkit-backdrop-filter:none; box-shadow:none; border-top:1rem solid #E4E8F1; }
	.floating-msg { display:none; }
	.floating-btns { width:100%; }
	.floating-btns .btn { flex:1; height:56rem; padding:0 12rem; box-shadow:none; }
	.floating-btns .btn-green { background:#1EC95B; color:#fff; }

	/* 혜택 존 (bzone) */
	main .sec.bzone {padding: 0 !important;}
	main .sec.bzone + .sec.bzone {margin-top: 60rem;}
	main .sec.bzone.first {padding-top: 0 !important;}
	main .sec.bzone.last {padding-bottom: 60rem !important;}
	main .panel {padding: 40rem 16rem !important; border-radius: 24rem;}
	main .panel-sub {margin-bottom: 24rem !important;}
	main .ptab {font-size: 13rem; padding: 7rem 16rem;; letter-spacing: -0.13rem; line-height: 150%;}

	/* winners */
	main .winner-photos {column-gap: 8rem; row-gap: 16rem; justify-items: stretch;}
	main .winner-photo {width: 100%;}
	main .winner-photo img {width: 100% !important; height: auto !important; aspect-ratio: 1 / 1; object-fit: cover;}
}

@media screen and (max-width: 780px) {
	/* pc/mo 분기 */
	*[class^="pc-"] {display: none;}
	*[class^="mo-"] {display: inline-block;}
}

@media screen and (max-width: 720px) {
	/* 공용 배너 */
	.title-banner {padding: 100rem 0 30rem;}
	.title-banner > h1 {font-size: 6vw;}
}
