fix. gnb 2depth 정확히 일치하는 경우만 1depth 활성화 되도록 수정

app/error.vue

@@ -3,39 +3,47 @@
     <LayoutsStoveHeader />
 
     <Transition name="fade">
-      <div v-if="!isLoading" class="flex-1 flex items-center justify-center p-25">
+      <div
+        v-if="!isLoading"
+        class="flex-1 flex items-center justify-center p-25"
+      >
         <div class="flex flex-col items-center gap-6 w-full">
-        <!-- Stove Logo -->
+          <!-- Stove Logo -->
-        <div class="flex items-center justify-center h-7">
+          <div class="flex items-center justify-center h-7">
-          <img 
+            <img
-            src="/images/common/logo-stove.svg" 
+              src="/images/common/logo-stove.svg"
-            alt="Stove" 
+              alt="Stove"
-            class="h-full w-auto"
+              class="h-full w-auto"
-          />
-        </div>
-
-        <!-- Error Icon and Text -->
-        <div class="flex flex-col items-center gap-4 w-full">
-          <!-- Error Icon -->
-          <div class="flex items-center justify-center">
-            <img 
-              src="/images/common/img_error.png" 
-              alt="Error" 
-              class="w-40 h-40 md:w-60 md:h-60"
             />
           </div>
 
-          <!-- Error Text -->
+          <!-- Error Icon and Text -->
-          <div class="flex flex-col items-center gap-2 w-full">
+          <div class="flex flex-col items-center gap-4 w-full">
-            <h1 class="font-medium text-xl md:text-2xl leading-[1.5] tracking-[-0.03em] text-center text-[#1F1F1F] m-0">
+            <!-- Error Icon -->
-              <span v-dompurify-html="errorTitle"></span>
+            <div class="flex items-center justify-center">
-            </h1>
+              <img
-            <p v-dompurify-html="errorMsg" class="font-normal text-sm md:text-base leading-[1.7] md:leading-[1.625] tracking-[-0.03em] text-center text-[#666666] m-0"></p>
+                src="/images/common/img_error.png"
-          </div>
+                alt="Error"
-        </div>
+                class="w-40 h-40 md:w-60 md:h-60"
+              />
+            </div>
 
-        <!-- Home Button -->              
+            <!-- Error Text -->
-        <AtomsButton
+            <div class="flex flex-col items-center gap-2 w-full">
+              <h1
+                class="font-medium text-xl md:text-2xl leading-[1.5] tracking-[-0.03em] text-center text-[#1F1F1F] m-0"
+              >
+                <span v-dompurify-html="errorTitle"></span>
+              </h1>
+              <p
+                v-dompurify-html="errorMsg"
+                class="font-normal text-sm md:text-base leading-[1.7] md:leading-[1.625] tracking-[-0.03em] text-center text-[#666666] m-0"
+              ></p>
+            </div>
+          </div>
+
+          <!-- Home Button -->
+          <AtomsButton
             type="action"
             button-size="size-small md:size-large"
             background-color="#FC4420"
@@ -50,7 +58,6 @@
   </div>
 </template>
 
-
 <script setup lang="ts">
 interface ErrorProps {
   error?: {
@@ -62,7 +69,7 @@ interface ErrorProps {
 
 const { tm } = useI18n()
 const props = withDefaults(defineProps<ErrorProps>(), {
-  error: () => ({})
+  error: () => ({}),
 })
 const nuxtError = useError()
 const currentError = computed(() => props.error || nuxtError.value)
@@ -72,13 +79,12 @@ const isLoading = ref(true)
 const errorTitle = ref('')
 const errorMsg = ref('')
 
-//error clear 함수 생성 
+//error clear 함수 생성
 const localePath = useLocalePath()
 
 // const handleError = () => clearError({ redirect: '/' })
 const handleError = () => {
   window.location.href = localePath('/')
-  // clearError({ redirect: `${localePath('/brand')}` })
 }
 const handleBack = () => {
   // 에러 상태를 클리어하고 이전 페이지로 이동
@@ -90,15 +96,16 @@ const handleBack = () => {
 
 // 백스페이스 키 처리
 const handleKeydown = (e: KeyboardEvent) => {
-  if (e.key === 'Backspace' && 
+  if (
-      !['INPUT', 'TEXTAREA'].includes((e.target as HTMLElement).tagName)) {
+    e.key === 'Backspace' &&
+    !['INPUT', 'TEXTAREA'].includes((e.target as HTMLElement).tagName)
+  ) {
     e.preventDefault()
     handleBack()
   }
 }
 // 500 에러 발생 시 /error 페이지로 리다이렉트
 onMounted(() => {
-
   const statusCode = currentError.value?.statusCode
 
   if (statusCode === 500) {
@@ -108,19 +115,16 @@ onMounted(() => {
     errorTitle.value = tm('Error_404_Not_Found')
     errorMsg.value = tm('Error_404_Not_Found2')
   }
-  
+
   nextTick(() => {
     isLoading.value = false
   })
 
-  
   window.addEventListener('keydown', handleKeydown)
   window.addEventListener('popstate', handleBack)
-  
 })
 onUnmounted(() => {
   window.removeEventListener('keydown', handleKeydown)
   window.removeEventListener('popstate', handleBack)
 })
-
+</script>
-</script>

layers/components/layouts/Header.vue

@@ -10,6 +10,11 @@ import type {
 
 const MORE_WIDTH = 72
 const START_WIDTH_MARGIN = 40
+const PLATFORM_LABEL_KEY: Record<PlatformTransformType, string> = {
+  pc: 'PC',
+  google_play: 'Google Play',
+  app_store: 'App Store',
+}
 
 const route = useRoute()
 const { tm } = useI18n()
@@ -26,12 +31,12 @@ const { isPassedStoveGnb } = storeToRefs(scrollStore)
 const navAreaRef = ref<HTMLElement | null>(null)
 const startRef = ref<HTMLElement | null>(null)
 
+const { width: startWidth } = useElementSize(startRef)
+
 const isMenuOpen = ref(false)
 const navWidth = ref(0)
 const officialItemWidths = ref<number[]>([])
 const overflowNam = ref<number>(0)
-// const { width: navWidth } = useElementSize(navAreaRef)
-const { width: startWidth } = useElementSize(startRef)
 
 const gnbData = computed(() => gameData.value?.gnb)
 const gnb1depthButtonData = computed(
@@ -50,7 +55,7 @@ const supportedPlatforms = computed(
 
 const pathMatches = (base: string, current: string) => {
   if (!base || base === '/') return current === '/'
-  return current === base || current.startsWith(base + '/')
+  return current === base
 }
 
 /** 자식 중 활성 링크 존재 여부 */
@@ -151,12 +156,6 @@ const has2depthButton = (gnbItem: GameDataMenu) => {
 
 const highlight = (text: string) => `<span class="highlight">${text}</span>`
 
-const PLATFORM_LABEL_KEY: Record<PlatformTransformType, string> = {
-  pc: 'PC',
-  google_play: 'Google Play',
-  app_store: 'App Store',
-}
-
 const tmWithGameName = (key: string): string => {
   const raw = tm(key)
   if (typeof raw !== 'string') return ''
@@ -458,7 +457,7 @@ onMounted(() => {
 
 .nav-area {
   @apply flex flex-col w-[100vw] max-w-[360px] min-w-[320px] bg-theme-foreground-10 translate-x-[-100%]
-  md:inline-flex md:flex-row md:w-auto md:max-w-none md:h-full md:pl-[40px] md:items-center md:bg-transparent md:transform-none;
+  md:inline-flex md:flex-row md:w-auto md:max-w-[100%] md:h-full md:pl-[40px] md:items-center md:bg-transparent md:transform-none;
 }
 
 .nav-logo {
@@ -467,7 +466,7 @@ onMounted(() => {
 
 .nav-list {
   @apply overflow-hidden flex flex-col order-1 h-full mt-2 mb-4 px-2
-  md:flex-row md:order-none md:h-full md:my-0 md:ml-10 md:mr-6 md:px-0 md:overflow-visible;
+  md:flex-row md:order-none md:h-full md:my-0 md:ml-10 md:mr-6 md:px-0;
 }
 
 .nav-item {
@@ -513,7 +512,7 @@ onMounted(() => {
 }
 
 .official {
-  @apply overflow-x-hidden overflow-y-auto pb-2 md:flex md:items-center md:space-x-8 md:pb-0 md:overflow-visible;
+  @apply overflow-x-hidden overflow-y-auto pb-2 md:flex md:items-center md:space-x-8 md:pb-0;
 }
 .custom-theme-scrollbar::-webkit-scrollbar {
   @apply w-1;