diff --git a/index.html b/index.html
index 7439a27..a1f4b33 100644
--- a/index.html
+++ b/index.html
@@ -66,9 +66,6 @@
           <button id="btn-open-guide-header" class="btn btn-outline" title="프로세스 가이드">
             <i data-lucide="book-open"></i> 가이드
           </button>
-          <button id="btn-logout-header" class="btn btn-outline btn-sm" title="로그아웃">
-            로그아웃
-          </button>
         </div>
       </div>
     </header>
diff --git a/src/components/Navigation.ts b/src/components/Navigation.ts
index aa53723..197f9c1 100644
--- a/src/components/Navigation.ts
+++ b/src/components/Navigation.ts
@@ -28,6 +28,19 @@ export function renderNavigation(onTabChange: (tab: string) => void) {
   const headerContainer = document.querySelector('.header-container')!;
   if (!headerContainer) return;
 
+  const logoutAndReturnToLogin = async () => {
+    try {
+      await fetch('/api/auth/logout', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' }
+      });
+    } catch (error) {
+      console.error('Logout failed:', error);
+    }
+
+    window.location.href = '/';
+  };
+
   const render = () => {
     // 1. 헤더 구조 (Vercel Style: Clean Single Row)
     headerContainer.innerHTML = `
@@ -50,6 +63,7 @@ export function renderNavigation(onTabChange: (tab: string) => void) {
         <div class="notification-area">
            <button class="icon-btn" title="알림"><i data-lucide="bell" style="width:18px; height:18px;"></i></button>
         </div>
+        <button id="btn-logout-header" class="btn btn-outline btn-sm" title="로그아웃">로그아웃</button>
       </div>
     `;
 
@@ -121,6 +135,10 @@ export function renderNavigation(onTabChange: (tab: string) => void) {
       onTabChange(state.activeSubTab);
     });
 
+    document.getElementById('btn-logout-header')?.addEventListener('click', () => {
+      logoutAndReturnToLogin();
+    });
+
     // 아이콘 생성
     // @ts-ignore
     if (window.lucide) window.lucide.createIcons();
diff --git a/src/main.ts b/src/main.ts
index 648c059..1822703 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -118,19 +118,6 @@ async function refreshAllData() {
     refreshView();
 }
 
-async function logoutAndReturnToLogin() {
-  try {
-    await fetch('/api/auth/logout', {
-      method: 'POST',
-      headers: { 'Content-Type': 'application/json' }
-    });
-  } catch (error) {
-    console.error('Logout failed:', error);
-  }
-
-  window.location.href = '/';
-}
-
 // --- App Initialization ---
 function initApp() {
   const mainContent = document.getElementById('main-content')!;
@@ -213,11 +200,6 @@ function initApp() {
       pcFlowModal.open();
       return;
     }
-
-    if (target.closest('#btn-logout-header')) {
-      logoutAndReturnToLogin();
-      return;
-    }
   });
 
   createIcons({