diff --git a/packages/ui/components/common/Header.vue b/packages/ui/components/common/Header.vue
index ad112f6e..6ca7545a 100644
--- a/packages/ui/components/common/Header.vue
+++ b/packages/ui/components/common/Header.vue
@@ -11,12 +11,13 @@ withDefaults(defineProps<HeaderProps>(), {
 })
 
 const { headerRef } = useHeader()
+const siteRoot = process.env.NODE_ENV === 'production' ? '/2024/' : '/'
 </script>
 
 <template>
   <header ref="headerRef" :style="{ top }">
     <div class="header-root">
-      <a class="link" href="/" aria-label="Vue Fes Japan 2024">
+      <a class="link" :href="siteRoot" aria-label="Vue Fes Japan 2024">
         <Logo class="logo" color="vue-blue" />
       </a>
       <slot />
diff --git a/packages/ui/components/common/SpHeader.vue b/packages/ui/components/common/SpHeader.vue
index 8899ea91..1a54dd33 100644
--- a/packages/ui/components/common/SpHeader.vue
+++ b/packages/ui/components/common/SpHeader.vue
@@ -11,12 +11,13 @@ withDefaults(defineProps<HeaderProps>(), {
 })
 
 const { headerRef } = useHeader()
+const siteRoot = process.env.NODE_ENV === 'production' ? '/2024/' : '/'
 </script>
 
 <template>
   <header ref="headerRef" :style="{ top }">
     <div class="header-root">
-      <a class="link" href="/" aria-label="Vue Fes Japan 2024">
+      <a class="link" :href="siteRoot" aria-label="Vue Fes Japan 2024">
         <Logo class="logo" color="vue-blue" />
       </a>
       <slot />