fix. 하이드레이션 에러 수정

app/app.vue

@@ -194,7 +194,6 @@ onBeforeUnmount(() => {
   <BlocksModalToast />
 
   <!-- 로딩 컴포넌트 -->
-  <AtomsLoadingSimple />
   <AtomsLoadingFull />
   <AtomsLoadingLocal />
 </template>

layers/assets/css/base/_transition.css

@@ -1,13 +1,3 @@
-/* page-fade */
-.page-fade-enter-active,
-.page-fade-leave-active {
-  transition: opacity 0.6s cubic-bezier(0.33, 1, 0.68, 1);
-}
-.page-fade-enter-from,
-.page-fade-leave-to {
-  opacity: 0;
-}
-
 /* fade */
 .fade-enter-active,
 .fade-leave-active {
@@ -18,6 +8,23 @@
   opacity: 0;
 }
 
+/* fade-out */
+.fade-out-enter-active,
+.fade-out-enter-from,
+.fade-out-enter-to {
+  transition: none;
+  opacity: 1;
+}
+.fade-out-leave-active {
+  transition: opacity 0.3s ease-out;
+}
+.fade-out-leave-from {
+  opacity: 1;
+}
+.fade-out-leave-to {
+  opacity: 0;
+}
+
 .slide-up-enter-active,
 .slide-up-leave-active {
   transition:

layers/components/atoms/loading/Simple.vue

@@ -1,47 +0,0 @@
-<script setup lang="ts">
-interface Props {
-  isLoading?: boolean
-}
-
-const isLoading = ref(true)
-
-const router = useRouter()
-
-// 페이지 전환 감지 및 로딩 상태 관리
-if (import.meta.client) {
-  router.beforeEach((to, from) => {
-    if (from.path !== to.path) {
-      isLoading.value = true
-    }
-  })
-
-  router.afterEach(() => {
-    isLoading.value = false
-  })
-}
-
-onMounted(() => {
-  isLoading.value = false
-})
-</script>
-
-<template>
-  <div v-if="isLoading" class="spinner-wrap">
-    <div class="spinner"></div>
-  </div>
-</template>
-
-<style scoped>
-.spinner-wrap {
-  @apply fixed inset-0 flex items-center justify-center bg-black z-[90];
-}
-.spinner {
-  @apply w-[80px] h-[80px] bg-cover bg-center bg-no-repeat bg-[url('/images/common/publisning_template_loader_black.png')];
-}
-
-[data-theme='light'] {
-  .spinner {
-    @apply bg-[url('/images/common/publisning_template_loader_white.png')];
-  }
-}
-</style>

layers/components/layouts/Header.vue

@@ -63,13 +63,11 @@ const hasActiveChild = (children?: GameDataMenuChildren) => {
 const isNavItemActive = (gnbItem: GameDataMenu): boolean => {
   const cur = currentPath.value
   const base = gnbItem?.url_path
-  if (import.meta.client) {
-    const selfActive =
-      !!base &&
-      isInternalUrl(base) &&
-      pathMatches(formatPathWithoutLocale(base), cur)
-    return selfActive || hasActiveChild(gnbItem.children)
-  }
+  const selfActive =
+    !!base &&
+    isInternalUrl(base) &&
+    pathMatches(formatPathWithoutLocale(base), cur)
+  return selfActive || hasActiveChild(gnbItem.children)
 }
 
 // navAreaRef의 넓이를 구하는 함수

layers/templates/FxCoupon01/index.vue

@@ -16,6 +16,7 @@ import type { ReqCouponList } from '#layers/types/api/couponData'
 
 // Props
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -485,8 +486,9 @@ onMounted(async () => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Coupon_Page_Title')"
-    :resourcesData="backgroundData"
+    :resources-data="backgroundData"
   />
 
   <div class="section-container static">

layers/templates/FxDownload01/index.vue

@@ -6,6 +6,7 @@ import type { Platform } from '#layers/types/components/button'
 
 // Props
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -131,6 +132,7 @@ const handleMoveFocus = (target: 'pc' | 'mobile') => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Download_Page_Title')"
     :resources-data="backgroundData"
   />

layers/templates/FxSecure01/index.vue

@@ -5,6 +5,7 @@ import { getImageHost } from '#layers/utils/styleUtil'
 
 // Props
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -47,7 +48,10 @@ const checkLoginValidation = async () => {
   const validateTokenResult = await handleTokenValidation(
     accessToken.value || ''
   )
-  console.log("🚀 ~ checkLoginValidation ~ validateTokenResult:", validateTokenResult)
+  console.log(
+    '🚀 ~ checkLoginValidation ~ validateTokenResult:',
+    validateTokenResult
+  )
   isLogin.value = validateTokenResult
 }
 
@@ -142,6 +146,7 @@ onMounted(() => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Secure_Page_Title') || '보안 강화 캠페인'"
     :resources-data="backgroundData"
     class="mx-auto"

layers/templates/FxVideo01/index.vue

@@ -11,6 +11,7 @@ import type { PageDataTemplateComponents } from '#layers/types/api/pageData'
 import type { OperateGroupItem } from '#layers/types/api/operateResources'
 
 interface Props {
+  id?: string
   components: PageDataTemplateComponents
   pageVerTmplSeq: number
 }
@@ -119,10 +120,10 @@ const handleLoadMoreRecent = () => {
 
 <template>
   <WidgetsFixMainTitle
+    :id="props.id"
     :title="tm('Video_Page_Title')"
     :resources-data="backgroundData"
   />
-
   <div class="section-container static">
     <section class="section-static">
       <WidgetsFixSubTitle