diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index f6caad8b..c70c6527 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -17,7 +17,9 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
-      <body className={cn(inter.variable)}>{children}</body>
+      <body className={cn(inter.variable)}>
+        <div className="h-screen w-full bg-gray-05">{children}</div>
+      </body>
     </html>
   )
 }
diff --git a/src/components/left-nav-layout.tsx b/src/components/left-nav-layout.tsx
index d5ec451c..5ed5ec94 100644
--- a/src/components/left-nav-layout.tsx
+++ b/src/components/left-nav-layout.tsx
@@ -47,9 +47,8 @@ export const LeftNavLayout = ({ children }: PropsWithChildren) => {
 
   return (
     <div className={cn('flex', activeItem && 'pl-[240px]')}>
-      {children}
       {activeItem && (
-        <div className="fixed left-0 z-50 flex h-screen w-[240px] flex-col items-center border-r border-gray-20 p-5">
+        <div className="fixed left-0 z-50 flex h-screen w-[240px] flex-col items-center border-r border-gray-20 bg-white p-5">
           <div className="flex items-center gap-[14px]">
             <div className="size-9 rounded-lg bg-gray-20" />
             <LogoIcon />
@@ -74,6 +73,7 @@ export const LeftNavLayout = ({ children }: PropsWithChildren) => {
           </div>
         </div>
       )}
+      {children}
     </div>
   )
 }
