diff --git a/Cunkebao/app/clientLayout.tsx b/Cunkebao/app/clientLayout.tsx
index 512d186b3..cb105ad8d 100644
--- a/Cunkebao/app/clientLayout.tsx
+++ b/Cunkebao/app/clientLayout.tsx
@@ -18,11 +18,13 @@ function LayoutContent({ children }: { children: React.ReactNode }) {
     pathname === "/" || pathname === "/devices" || pathname === "/content" || pathname === "/profile"
 
   return (
-    <main className="max-w-[390px] mx-auto bg-white min-h-screen flex flex-col relative">
-      {children}
-      {showBottomNav && <BottomNav />}
-      {showBottomNav && <VideoTutorialButton />}
-    </main>
+    <div className="mx-auto w-full">
+      <main className="w-full mx-auto bg-white min-h-screen flex flex-col relative lg:max-w-7xl xl:max-w-[1200px]">
+        {children}
+        {showBottomNav && <BottomNav />}
+        {showBottomNav && <VideoTutorialButton />}
+      </main>
+    </div>
   )
 }
 
diff --git a/Cunkebao/app/components/BottomNav.tsx b/Cunkebao/app/components/BottomNav.tsx
index cc2235518..969385051 100644
--- a/Cunkebao/app/components/BottomNav.tsx
+++ b/Cunkebao/app/components/BottomNav.tsx
@@ -16,7 +16,7 @@ export default function BottomNav() {
 
   return (
     <nav className="fixed bottom-0 left-0 right-0 bg-white border-t border-gray-200">
-      <div className="max-w-md mx-auto flex justify-around">
+      <div className="w-full mx-auto flex justify-around">
         {navItems.map((item) => (
           <Link
             key={item.href}
diff --git a/Cunkebao/app/components/LayoutWrapper.tsx b/Cunkebao/app/components/LayoutWrapper.tsx
index 30d84d72a..6e12898a2 100644
--- a/Cunkebao/app/components/LayoutWrapper.tsx
+++ b/Cunkebao/app/components/LayoutWrapper.tsx
@@ -13,11 +13,13 @@ export default function LayoutWrapper({ children }: { children: React.ReactNode
   const showBottomNav = mainPages.includes(pathname)
 
   return (
-    <main className="max-w-[390px] mx-auto bg-white min-h-screen flex flex-col relative">
-      {children}
-      {showBottomNav && <BottomNav />}
-      {showBottomNav && <VideoTutorialButton />}
-    </main>
+    <div className="mx-auto w-full">
+      <main className="w-full mx-auto bg-white min-h-screen flex flex-col relative lg:max-w-7xl xl:max-w-[1200px]">
+        {children}
+        {showBottomNav && <BottomNav />}
+        {showBottomNav && <VideoTutorialButton />}
+      </main>
+    </div>
   )
 }
 
diff --git a/Cunkebao/app/layout.tsx b/Cunkebao/app/layout.tsx
index ef99c4ccb..482ed3213 100644
--- a/Cunkebao/app/layout.tsx
+++ b/Cunkebao/app/layout.tsx
@@ -28,8 +28,4 @@ export default function RootLayout({
       </body>
     </html>
   )
-}
-
-
-
-import './globals.css'
\ No newline at end of file
+}
\ No newline at end of file