From 435f61ed05d71453c2157c850175e2e235eb6f06 Mon Sep 17 00:00:00 2001
From: clkim <clkim@smilegate.com>
Date: Fri, 13 Mar 2026 11:29:32 +0900
Subject: [PATCH] =?UTF-8?q?fix.=20scroll=20position=20=EB=B3=80=EC=88=98?=
 =?UTF-8?q?=EB=AA=85=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Made-with: Cursor
---
 app/app.vue                                   | 2 +-
 layers/components/blocks/Button/Home.vue      | 6 +++---
 layers/components/blocks/Lnb.vue              | 8 ++++----
 layers/components/layouts/EventNavigation.vue | 4 ++--
 layers/components/layouts/Header.vue          | 2 +-
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/app/app.vue b/app/app.vue
index b74de48..12bef91 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -144,7 +144,7 @@ onMounted(() => {
       }
       rafId = requestAnimationFrame(() => {
         document.documentElement.style.setProperty(
-          '--scroll-position',
+          '--scroll-stove-position',
           `${newValue}px`
         )
         rafId = null
diff --git a/layers/components/blocks/Button/Home.vue b/layers/components/blocks/Button/Home.vue
index 6de3012..34cd7ae 100644
--- a/layers/components/blocks/Button/Home.vue
+++ b/layers/components/blocks/Button/Home.vue
@@ -26,11 +26,11 @@ const analytics = {
 
 <style scoped>
 .empty-game + main .btn-home {
-  @apply mt-[var(--scroll-position,48px)] md:mt-[var(--scroll-position,64px)];
+  @apply mt-[var(--scroll-stove-position,48px)] md:mt-[var(--scroll-stove-position,64px)];
 }
 .btn-home {
-  @apply fixed top-3 right-3 mt-[calc(var(--scroll-position,48px)+48px)] shadow-[0_1.667px_3.333px_0_rgba(0,0,0,0.06)] backdrop-blur-[12.5px] z-[100]
-  sm:top-5 md:top-6 md:right-8 md:mt-[calc(var(--scroll-position,64px)+64px)];
+  @apply fixed top-3 right-3 mt-[calc(var(--scroll-stove-position,48px)+48px)] shadow-[0_1.667px_3.333px_0_rgba(0,0,0,0.06)] backdrop-blur-[12.5px] z-[100]
+  sm:top-5 md:top-6 md:right-8 md:mt-[calc(var(--scroll-stove-position,64px)+64px)];
 }
 .btn-home:hover :deep(.icon) {
   @apply scale-[1.08];
diff --git a/layers/components/blocks/Lnb.vue b/layers/components/blocks/Lnb.vue
index e949a9f..d4191bd 100644
--- a/layers/components/blocks/Lnb.vue
+++ b/layers/components/blocks/Lnb.vue
@@ -198,10 +198,10 @@ onUnmounted(() => {
 
 <style scoped>
 .empty-game + main .lnb-wrap {
-  @apply mt-[var(--scroll-position,48px)];
+  @apply mt-[var(--scroll-stove-position,48px)];
 }
 .lnb-wrap {
-  @apply fixed top-0 right-0 mt-[calc(var(--scroll-position,48px)+64px)] py-8 pr-10 bg-[radial-gradient(100%_50%_at_100%_50%,rgba(0,0,0,0.4)_25%,rgba(0,0,0,0)_100%)] transition-transform duration-[400ms] ease-in-out z-50;
+  @apply fixed top-0 right-0 mt-[calc(var(--scroll-stove-position,48px)+64px)] py-8 pr-10 bg-[radial-gradient(100%_50%_at_100%_50%,rgba(0,0,0,0.4)_25%,rgba(0,0,0,0)_100%)] transition-transform duration-[400ms] ease-in-out z-50;
 }
 .lnb-wrap:before {
   content: '';
@@ -261,9 +261,9 @@ button.is-active::after {
 }
 
 .main-promotion .lnb-wrap {
-  @apply mt-[calc(var(--scroll-position,48px)+64px+72px)];
+  @apply mt-[calc(var(--scroll-stove-position,48px)+64px+72px)];
 }
 .empty-game + .main-promotion .lnb-wrap {
-  @apply mt-[calc(var(--scroll-position,48px)+72px)];
+  @apply mt-[calc(var(--scroll-stove-position,48px)+72px)];
 }
 </style>
diff --git a/layers/components/layouts/EventNavigation.vue b/layers/components/layouts/EventNavigation.vue
index 46f67da..ebf3bb4 100644
--- a/layers/components/layouts/EventNavigation.vue
+++ b/layers/components/layouts/EventNavigation.vue
@@ -111,14 +111,14 @@ onMounted(async () => {
 
 <style scoped>
 .empty-game + main .navigation-wrap {
-  @apply mt-[var(--scroll-position,48px)];
+  @apply mt-[var(--scroll-stove-position,48px)];
 }
 .sns-wrap ~ .navigation-wrap {
   @apply pb-[60px] md:pb-[80px];
 }
 
 .navigation-wrap {
-  @apply fixed top-0 left-0 bottom-0 mt-[calc(var(--scroll-position,48px)+48px)] md:mt-[calc(var(--scroll-position,64px)+64px)] z-[90] transition-transform duration-300 ease-in-out;
+  @apply fixed top-0 left-0 bottom-0 mt-[calc(var(--scroll-stove-position,48px)+48px)] md:mt-[calc(var(--scroll-stove-position,64px)+64px)] z-[90] transition-transform duration-300 ease-in-out;
 }
 .navigation-container {
   @apply relative h-full p-3 sm:p-5 sm:pr-3
diff --git a/layers/components/layouts/Header.vue b/layers/components/layouts/Header.vue
index 8a9c132..e53b3ea 100644
--- a/layers/components/layouts/Header.vue
+++ b/layers/components/layouts/Header.vue
@@ -460,7 +460,7 @@ onMounted(() => {
 }
 
 .nav-wrap {
-  @apply fixed top-0 left-0 bottom-0 w-0 mt-[var(--scroll-position,48px)] md:relative md:w-full md:h-full md:mt-0;
+  @apply fixed top-0 left-0 bottom-0 w-0 mt-[var(--scroll-stove-position,48px)] md:relative md:w-full md:h-full md:mt-0;
 }
 .nav-wrap.is-open {
   @apply w-full;