Merge pull request 'dev' (#61) from dev into main

Reviewed-on: http://39.117.244.52:3000/kjs/ERP-node/pulls/61

frontend/app/(main)/admin/batch-management/page.tsx

@@ -186,7 +186,7 @@ export default function BatchManagementPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 헤더 */}
         <div className="flex items-center justify-between">
           <div>

frontend/app/(main)/admin/collection-management/page.tsx

@@ -163,7 +163,7 @@ export default function CollectionManagementPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 헤더 */}
         <div className="flex items-center justify-between">
           <div>

frontend/app/(main)/admin/commonCode/page.tsx

@@ -12,7 +12,7 @@ export default function CommonCodeManagementPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/company/page.tsx

@@ -6,7 +6,7 @@ import { CompanyManagement } from "@/components/admin/CompanyManagement";
 export default function CompanyPage() {
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/dataflow/edit/[diagramId]/page.tsx

@@ -59,7 +59,7 @@ export default function DataFlowEditPage() {
   }
 
   return (
-    <div className="space-y-6">
+    <div className="space-y-8">
       {/* 헤더 */}
       <div className="flex items-center justify-between">
         <div className="flex items-center space-x-4">

frontend/app/(main)/admin/dataflow/page.tsx

@@ -77,7 +77,7 @@ export default function DataFlowPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>
@@ -93,10 +93,10 @@ export default function DataFlowPage() {
         </div>
 
         {/* 단계별 내용 */}
-        <div className="space-y-6">
+        <div className="space-y-8">
           {/* 관계도 목록 단계 */}
           {currentStep === "list" && (
-            <div className="space-y-6">
+            <div className="space-y-8">
               <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-4">
                 <h2 className="text-xl font-semibold text-gray-800">{stepConfig.list.title}</h2>
               </div>
@@ -106,7 +106,7 @@ export default function DataFlowPage() {
 
           {/* 관계도 설계 단계 */}
           {currentStep === "design" && (
-            <div className="space-y-6">
+            <div className="space-y-8">
               <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-4">
                 <h2 className="text-xl font-semibold text-gray-800">{stepConfig.design.title}</h2>
               </div>

frontend/app/(main)/admin/external-call-configs/page.tsx

@@ -162,7 +162,7 @@ export default function ExternalCallConfigsPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
       {/* 페이지 헤더 */}
       <div className="flex items-center justify-between">
         <div>

frontend/app/(main)/admin/external-connections/page.tsx

@@ -221,7 +221,7 @@ export default function ExternalConnectionsPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/i18n/page.tsx

@@ -5,7 +5,7 @@ import MultiLang from "@/components/admin/MultiLang";
 export default function I18nPage() {
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6">
+      <div className="w-full max-w-none px-4 py-8">
         <MultiLang />
       </div>
     </div>

frontend/app/(main)/admin/layouts/page.tsx

@@ -221,7 +221,7 @@ export default function LayoutManagementPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/menu/page.tsx

@@ -5,7 +5,7 @@ import { MenuManagement } from "@/components/admin/MenuManagement";
 export default function MenuPage() {
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/monitoring/page.tsx

@@ -6,7 +6,7 @@ import MonitoringDashboard from "@/components/admin/MonitoringDashboard";
 export default function MonitoringPage() {
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 헤더 */}
         <div>
           <h1 className="text-2xl font-bold">모니터링</h1>

frontend/app/(main)/admin/page.tsx

@@ -1,18 +1,27 @@
-import { Users, Shield, Settings, BarChart3, Palette, Layout, Database, Package } from "lucide-react";
+import { 
+  Users, Shield, Settings, BarChart3, Palette, Layout, Database, Package
+} from "lucide-react";
 import Link from "next/link";
+
 /**
  * 관리자 메인 페이지
  */
 export default function AdminPage() {
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 pt-12 pb-16 space-y-16">
-      {/* 관리자 기능 카드들 */}
+      
-      <div className="mx-auto max-w-7xl grid gap-6 md:grid-cols-2 lg:grid-cols-3">
+      {/* 주요 관리 기능 */}
+      <div className="mx-auto max-w-7xl space-y-10">
+        <div className="text-center mb-8">
+          <h2 className="text-2xl font-bold text-gray-900 mb-2">주요 관리 기능</h2>
+          <p className="text-gray-600">시스템의 핵심 관리 기능들을 제공합니다</p>
+        </div>
+        <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
         <Link href="/admin/userMng" className="block">
           <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
             <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-blue-200 to-blue-300">
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-blue-100">
                 <Users className="h-6 w-6 text-blue-600" />
               </div>
               <div>
@@ -25,7 +34,7 @@ export default function AdminPage() {
 
         <div className="rounded-lg border bg-white p-6 shadow-sm">
           <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-emerald-200 to-emerald-300">
+            <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-emerald-100">
               <Shield className="h-6 w-6 text-emerald-600" />
             </div>
             <div>
@@ -37,7 +46,7 @@ export default function AdminPage() {
 
         <div className="rounded-lg border bg-white p-6 shadow-sm">
           <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-violet-200 to-violet-300">
+            <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-violet-100">
               <Settings className="h-6 w-6 text-violet-600" />
             </div>
             <div>
@@ -49,7 +58,7 @@ export default function AdminPage() {
 
         <div className="rounded-lg border bg-white p-6 shadow-sm">
           <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-amber-200 to-amber-300">
+            <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-amber-100">
               <BarChart3 className="h-6 w-6 text-amber-600" />
             </div>
             <div>
@@ -62,7 +71,7 @@ export default function AdminPage() {
         <Link href="/admin/screenMng" className="block">
           <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
             <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-indigo-200 to-indigo-300">
+              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-indigo-100">
                 <Palette className="h-6 w-6 text-indigo-600" />
               </div>
               <div>
@@ -73,15 +82,19 @@ export default function AdminPage() {
           </div>
         </Link>
         </div>
+      </div>
 
       {/* 표준 관리 섹션 */}
-      <div className="mx-auto max-w-7xl space-y-4">
+      <div className="mx-auto max-w-7xl space-y-10">
-        <h2 className="text-xl font-semibold text-gray-900">표준 관리</h2>
+        <div className="text-center mb-8">
+          <h2 className="text-2xl font-bold text-gray-900 mb-2">표준 관리</h2>
+          <p className="text-gray-600">시스템 표준 및 컴포넌트를 통합 관리합니다</p>
+        </div>
         <div className="grid gap-6 md:grid-cols-2 lg:grid-cols-4">
-          <Link href="/admin/standards" className="block">
+          <Link href="/admin/standards" className="block h-full">
-            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50 h-full">
               <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-teal-200 to-teal-300">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-teal-100">
                   <Database className="h-6 w-6 text-teal-600" />
                 </div>
                 <div>
@@ -92,10 +105,10 @@ export default function AdminPage() {
             </div>
           </Link>
 
-          <Link href="/admin/templates" className="block">
+          <Link href="/admin/templates" className="block h-full">
-            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50 h-full">
               <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-emerald-200 to-emerald-300">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-emerald-100">
                   <Layout className="h-6 w-6 text-emerald-600" />
                 </div>
                 <div>
@@ -106,10 +119,10 @@ export default function AdminPage() {
             </div>
           </Link>
 
-          <Link href="/admin/tableMng" className="block">
+          <Link href="/admin/tableMng" className="block h-full">
-            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50 h-full">
               <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-cyan-200 to-cyan-300">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-cyan-100">
                   <Database className="h-6 w-6 text-cyan-600" />
                 </div>
                 <div>
@@ -120,10 +133,10 @@ export default function AdminPage() {
             </div>
           </Link>
 
-          <Link href="/admin/components" className="block">
+          <Link href="/admin/components" className="block h-full">
-            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50 h-full">
               <div className="flex items-center gap-4">
-              <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-gradient-to-br from-violet-200 to-violet-300">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-violet-100">
                   <Package className="h-6 w-6 text-violet-600" />
                 </div>
                 <div>
@@ -136,32 +149,55 @@ export default function AdminPage() {
         </div>
       </div>
 
-      {/* 최근 활동 */}
+      {/* 빠른 액세스 */}
-      <div className="rounded-lg border bg-white p-6 shadow-sm">
+      <div className="mx-auto max-w-7xl space-y-10">
-        <h3 className="mb-4 text-lg font-semibold">최근 관리자 활동</h3>
+        <div className="text-center mb-8">
-        <div className="space-y-4">
+          <h2 className="text-2xl font-bold text-gray-900 mb-2">빠른 액세스</h2>
-          <div className="flex items-center justify-between border-b border-gray-100 py-2 last:border-0">
+          <p className="text-gray-600">자주 사용하는 관리 기능에 빠르게 접근할 수 있습니다</p>
+        </div>
+        <div className="grid gap-6 md:grid-cols-3">
+          <Link href="/admin/menu" className="block">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+              <div className="flex items-center gap-4">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-blue-100">
+                  <Layout className="h-6 w-6 text-blue-600" />
+                </div>
                 <div>
-              <p className="font-medium text-gray-900">새로운 사용자 추가</p>
+                  <h3 className="font-semibold text-gray-900">메뉴 관리</h3>
-              <p className="text-sm text-gray-600">김철수 사용자가 생성되었습니다.</p>
+                  <p className="text-sm text-gray-600">시스템 메뉴 및 네비게이션 설정</p>
                 </div>
-            <span className="text-sm text-gray-500">2분 전</span>
               </div>
-          <div className="flex items-center justify-between border-b border-gray-100 py-2 last:border-0">
+            </div>
+          </Link>
+          
+          <Link href="/admin/external-connections" className="block">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+              <div className="flex items-center gap-4">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-green-100">
+                  <Database className="h-6 w-6 text-green-600" />
+                </div>
                 <div>
-              <p className="font-medium text-gray-900">권한 변경</p>
+                  <h3 className="font-semibold text-gray-900">외부 연결 관리</h3>
-              <p className="text-sm text-gray-600">이영희 사용자의 권한이 수정되었습니다.</p>
+                  <p className="text-sm text-gray-600">외부 데이터베이스 연결 설정</p>
                 </div>
-            <span className="text-sm text-gray-500">15분 전</span>
               </div>
-          <div className="flex items-center justify-between border-b border-gray-100 py-2 last:border-0">
+            </div>
+          </Link>
+          
+          <Link href="/admin/commonCode" className="block">
+            <div className="rounded-lg border bg-white p-6 shadow-sm transition-colors hover:bg-gray-50">
+              <div className="flex items-center gap-4">
+                <div className="flex h-12 w-12 items-center justify-center rounded-lg bg-purple-100">
+                  <Settings className="h-6 w-6 text-purple-600" />
+                </div>
                 <div>
-              <p className="font-medium text-gray-900">시스템 설정 변경</p>
+                  <h3 className="font-semibold text-gray-900">공통 코드 관리</h3>
-              <p className="text-sm text-gray-600">비밀번호 정책이 업데이트되었습니다.</p>
+                  <p className="text-sm text-gray-600">시스템 공통 코드 및 설정</p>
                 </div>
-            <span className="text-sm text-gray-500">1시간 전</span>
               </div>
             </div>
+          </Link>
+        </div>
       </div>
       </div>
     </div>

frontend/app/(main)/admin/screenMng/page.tsx

@@ -67,7 +67,7 @@ export default function ScreenManagementPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-6">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>
@@ -80,7 +80,7 @@ export default function ScreenManagementPage() {
         <div className="flex-1 overflow-hidden">
           {/* 화면 목록 단계 */}
           {currentStep === "list" && (
-            <div className="space-y-6">
+            <div className="space-y-8">
               <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-4">
                 <h2 className="text-xl font-semibold text-gray-800">{stepConfig.list.title}</h2>
                 <Button className="bg-blue-600 hover:bg-blue-700 shadow-sm" onClick={() => goToNextStep("design")}>
@@ -100,7 +100,7 @@ export default function ScreenManagementPage() {
 
           {/* 화면 설계 단계 */}
           {currentStep === "design" && (
-            <div className="space-y-6">
+            <div className="space-y-8">
               <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-4">
                 <h2 className="text-xl font-semibold text-gray-800">{stepConfig.design.title}</h2>
                 <Button variant="outline" className="shadow-sm" onClick={() => goToStep("list")}>
@@ -113,7 +113,7 @@ export default function ScreenManagementPage() {
 
           {/* 템플릿 관리 단계 */}
           {currentStep === "template" && (
-            <div className="space-y-6">
+            <div className="space-y-8">
               <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-4">
                 <h2 className="text-xl font-semibold text-gray-800">{stepConfig.template.title}</h2>
                 <div className="flex gap-2">

frontend/app/(main)/admin/standards/[webType]/edit/page.tsx

@@ -204,7 +204,7 @@ export default function EditWebTypePage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
       {/* 헤더 */}
       <div className="mb-6 flex items-center gap-4">
         <Link href={`/admin/standards/${webType}`}>
@@ -231,7 +231,7 @@ export default function EditWebTypePage() {
             <CardTitle>기본 정보</CardTitle>
             <CardDescription>웹타입의 기본적인 정보를 수정해주세요.</CardDescription>
           </CardHeader>
-          <CardContent className="space-y-6">
+          <CardContent className="space-y-8">
             {/* 웹타입 코드 (읽기 전용) */}
             <div className="space-y-2">
               <Label htmlFor="web_type">웹타입 코드</Label>

frontend/app/(main)/admin/standards/[webType]/page.tsx

@@ -81,7 +81,7 @@ export default function WebTypeDetailPage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
       {/* 헤더 */}
       <div className="mb-6 flex items-center justify-between">
         <div className="flex items-center gap-4">
@@ -114,7 +114,7 @@ export default function WebTypeDetailPage() {
         </div>
       </div>
 
-      <Tabs defaultValue="overview" className="space-y-6">
+      <Tabs defaultValue="overview" className="space-y-8">
         <TabsList>
           <TabsTrigger value="overview" className="flex items-center gap-2">
             <Eye className="h-4 w-4" />
@@ -131,7 +131,7 @@ export default function WebTypeDetailPage() {
         </TabsList>
 
         {/* 개요 탭 */}
-        <TabsContent value="overview" className="space-y-6">
+        <TabsContent value="overview" className="space-y-8">
           <div className="grid grid-cols-1 gap-6 md:grid-cols-2">
             {/* 기본 정보 */}
             <Card>
@@ -212,7 +212,7 @@ export default function WebTypeDetailPage() {
         </TabsContent>
 
         {/* 설정 탭 */}
-        <TabsContent value="config" className="space-y-6">
+        <TabsContent value="config" className="space-y-8">
           <div className="grid grid-cols-1 gap-6 md:grid-cols-2">
             {/* 기본 설정 */}
             <Card>
@@ -269,7 +269,7 @@ export default function WebTypeDetailPage() {
         </TabsContent>
 
         {/* JSON 데이터 탭 */}
-        <TabsContent value="json" className="space-y-6">
+        <TabsContent value="json" className="space-y-8">
           <Card>
             <CardHeader>
               <CardTitle>전체 JSON 데이터</CardTitle>

frontend/app/(main)/admin/standards/new/page.tsx

@@ -160,7 +160,7 @@ export default function NewWebTypePage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
       {/* 헤더 */}
       <div className="mb-6 flex items-center gap-4">
         <Link href="/admin/standards">
@@ -182,7 +182,7 @@ export default function NewWebTypePage() {
             <CardTitle>기본 정보</CardTitle>
             <CardDescription>웹타입의 기본적인 정보를 입력해주세요.</CardDescription>
           </CardHeader>
-          <CardContent className="space-y-6">
+          <CardContent className="space-y-8">
             {/* 웹타입 코드 */}
             <div className="space-y-2">
               <Label htmlFor="web_type">

frontend/app/(main)/admin/standards/page.tsx

@@ -128,7 +128,7 @@ export default function WebTypesManagePage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/tableMng/page.tsx

@@ -541,7 +541,7 @@ export default function TableManagementPage() {
   }, [selectedTable, columns.length, totalColumns, columnsLoading, pageSize, loadColumnTypes]);
 
   return (
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
       {/* 페이지 제목 */}
       <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
         <div>

frontend/app/(main)/admin/templates/page.tsx

@@ -130,7 +130,7 @@ export default function TemplatesManagePage() {
 
   if (error) {
     return (
-      <div className="container mx-auto p-6">
+      <div className="w-full max-w-none px-4 py-8">
         <Card>
           <CardContent className="flex flex-col items-center justify-center py-8">
             <p className="mb-4 text-red-600">템플릿 목록을 불러오는 중 오류가 발생했습니다.</p>
@@ -146,7 +146,7 @@ export default function TemplatesManagePage() {
 
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/userMng/page.tsx

@@ -9,7 +9,7 @@ import { UserManagement } from "@/components/admin/UserManagement";
 export default function UserMngPage() {
   return (
     <div className="min-h-screen bg-gray-50">
-      <div className="container mx-auto p-6 space-y-6">
+      <div className="w-full max-w-none px-4 py-8 space-y-8">
         {/* 페이지 제목 */}
         <div className="flex items-center justify-between bg-white rounded-lg shadow-sm border p-6">
           <div>

frontend/app/(main)/admin/validation-demo/page.tsx

@@ -357,7 +357,7 @@ export default function ValidationDemoPage() {
   };
 
   return (
-    <div className="container mx-auto space-y-6 py-6">
+    <div className="container mx-auto space-y-8 py-6">
       {/* 헤더 */}
       <div className="flex items-center justify-between">
         <div>

frontend/app/(main)/main/page.tsx

@@ -9,7 +9,7 @@ import { Badge } from "@/components/ui/badge";
  */
 export default function MainPage() {
   return (
-    <div className="space-y-6">
+    <div className="pt-10 space-y-6">
       {/* 메인 컨텐츠 */}
       {/* Welcome Message */}
       <Card>

frontend/app/(main)/multilang/page.tsx

@@ -219,7 +219,7 @@ export default function MultiLangPage() {
   const filteredLangKeys = getFilteredLangKeys();
 
   return (
-    <div className="container mx-auto space-y-6 p-6">
+    <div className="w-full max-w-none px-4 py-8 space-y-8">
       <div className="flex items-center justify-between">
         <h1 className="text-3xl font-bold">다국어 관리</h1>
         <Button>새 키 추가</Button>

frontend/app/(main)/page.tsx

@@ -1,6 +1,6 @@
 export default function MainHomePage() {
   return (
-    <div className="space-y-6">
+    <div className="pt-10 space-y-6">
       {/* 대시보드 컨텐츠 */}
       <div className="rounded-lg border bg-white p-6 shadow-sm">
         <h3 className="mb-4 text-lg font-semibold">WACE 솔루션에 오신 것을 환영합니다!</h3>

frontend/app/(main)/screens/[screenId]/page.tsx

@@ -147,7 +147,7 @@ export default function ScreenViewPage() {
   const screenHeight = layout?.screenResolution?.height || 800;
 
   return (
-    <div className="h-full w-full overflow-auto bg-white">
+    <div className="h-full w-full overflow-auto bg-white pt-10">
       {layout && layout.components.length > 0 ? (
         // 캔버스 컴포넌트들을 정확한 해상도로 표시
         <div

frontend/components/layout/AppLayout.tsx

@@ -451,8 +451,8 @@ function AppLayoutInner({ children }: AppLayoutProps) {
           </div>
         </aside>
 
-        {/* 가운데 컨텐츠 영역 */}
+        {/* 가운데 컨텐츠 영역 - overflow 문제 해결 */}
-        <main className="flex-1 min-w-0 bg-white overflow-hidden">{children}</main>
+        <main className="flex-1 min-w-0 bg-white overflow-auto">{children}</main>
       </div>
 
       {/* 프로필 수정 모달 */}

frontend/components/screen/ScreenDesigner.tsx

@@ -3144,9 +3144,9 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
         isSaving={isSaving}
       />
 
-      {/* 메인 캔버스 영역 (스크롤 가능한 컨테이너) */}
+      {/* 메인 캔버스 영역 (스크롤 가능한 컨테이너) - 좌우 최소화, 위아래 넉넉한 여유 */}
-      <div className="relative flex-1 overflow-auto bg-gray-100 p-8">
+      <div className="relative flex-1 overflow-auto bg-gray-100 px-2 py-6">
-        {/* 해상도 정보 표시 */}
+        {/* 해상도 정보 표시 - 적당한 여백 */}
         <div className="mb-4 flex items-center justify-center">
           <div className="rounded-lg border bg-white px-4 py-2 shadow-sm">
             <span className="text-sm font-medium text-gray-700">
@@ -3155,7 +3155,7 @@ export default function ScreenDesigner({ selectedScreen, onBackToList }: ScreenD
           </div>
         </div>
 
-        {/* 실제 작업 캔버스 (해상도 크기) */}
+        {/* 실제 작업 캔버스 (해상도 크기) - 반응형 개선 */}
         <div
           className="mx-auto bg-white shadow-lg"
           style={{