feat: 관리자 설정 페이지(settings.php) 추가 및 admin 디렉토리 구성

src/admin/content_upload.php

@@ -0,0 +1,128 @@
+<?php
+include_once 'header.php';
+?>
+<main class="max-w-[1600px] mx-auto p-6">
+    
+    <header class="flex justify-between items-center mb-8">
+      <h2 class="text-3xl font-bold text-gray-800 tracking-tight">콘텐츠 입력</h2>
+      <button onclick="document.getElementById('upload-modal').classList.remove('hidden')" class="px-5 py-2.5 bg-[#114b3d] text-white rounded-lg font-bold flex items-center shadow-lg hover:bg-[#0d3a2f] transition">
+        <i class="fa-solid fa-plus mr-2"></i>새 콘텐츠 추가
+      </button>
+    </header>
+
+    <section class="bg-white p-6 rounded-2xl border border-gray-200 shadow-sm mb-8">
+      <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+        <div>
+          <label class="block text-sm font-bold text-gray-700 mb-2">추천 콘텐츠 (강좌)</label>
+          <select class="w-full border-gray-200 rounded-xl p-3 bg-gray-50 focus:ring-2 focus:ring-teal-500">
+            <option>전체</option>
+            <option>온보딩</option>
+            <option>리더십</option>
+            <option>인사이트</option>
+          </select>
+        </div>
+        <div>
+          <label class="block text-sm font-bold text-gray-700 mb-2">콘텐츠명 검색</label>
+          <div class="relative">
+            <input type="text" placeholder="콘텐츠명을 검색하세요" class="w-full border-gray-200 rounded-xl p-3 pl-11 bg-gray-50 focus:ring-2 focus:ring-teal-500">
+            <i class="fa-solid fa-magnifying-glass absolute left-4 top-4 text-gray-400"></i>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <section class="bg-white rounded-2xl border border-gray-200 shadow-sm overflow-hidden mb-12">
+      <table class="w-full text-left border-collapse">
+        <thead>
+          <tr class="bg-gray-50/50 border-b border-gray-100">
+            <th class="p-4 text-sm font-bold text-gray-500 w-24">분류</th>
+            <th class="p-4 text-sm font-bold text-gray-500">콘텐츠명</th>
+            <th class="p-4 text-sm font-bold text-gray-500">한맥PICK</th>
+            <th class="p-4 text-sm font-bold text-gray-500">콘텐츠구분</th>
+            <th class="p-4 text-sm font-bold text-gray-500">숨김</th>
+            <th class="p-4 text-sm font-bold text-gray-500 w-24">정렬순번</th>
+            <th class="p-4 text-sm font-bold text-gray-500 text-center w-24">관리</th>
+          </tr>
+        </thead>
+        <tbody class="divide-y divide-gray-50 text-sm">
+          <tr class="hover:bg-teal-50/30 transition">
+            <td class="p-4"><span class="px-2 py-1 bg-blue-50 text-blue-700 border border-blue-100 rounded text-xs font-bold">인사이트</span></td>
+            <td class="p-4 font-bold text-gray-800">(공통) 미리 사는 미래, 디지털 트윈</td>
+            <td class="p-4 text-gray-500">마이클래스</td>
+            <td class="p-4">영상</td>
+            <td class="p-4 text-gray-400">숨기지않음</td>
+            <td class="p-4 font-mono text-center">0</td>
+            <td class="p-4 text-center">
+              <button class="px-3 py-1 bg-teal-800 text-white rounded text-xs hover:bg-teal-900 transition">수정</button>
+            </td>
+          </tr>
+          <tr class="hover:bg-teal-50/30 transition">
+            <td class="p-4"><span class="px-2 py-1 bg-purple-50 text-purple-700 border border-purple-100 rounded text-xs font-bold">리더십</span></td>
+            <td class="p-4 font-bold text-gray-800">효과적인 팀 리딩 전략</td>
+            <td class="p-4 text-gray-500">마이클래스</td>
+            <td class="p-4">영상</td>
+            <td class="p-4 text-gray-400">숨기지않음</td>
+            <td class="p-4 font-mono text-center">1</td>
+            <td class="p-4 text-center">
+              <button class="px-3 py-1 bg-teal-800 text-white rounded text-xs hover:bg-teal-900 transition">수정</button>
+            </td>
+          </tr>
+          <tr class="hover:bg-teal-50/30 transition">
+            <td class="p-4"><span class="px-2 py-1 bg-green-50 text-green-700 border border-green-100 rounded text-xs font-bold">온보딩</span></td>
+            <td class="p-4 font-bold text-gray-800">회사 소개 및 조직 문화</td>
+            <td class="p-4 text-gray-500">선택없음</td>
+            <td class="p-4">영상</td>
+            <td class="p-4 text-gray-400">숨기지않음</td>
+            <td class="p-4 font-mono text-center">2</td>
+            <td class="p-4 text-center">
+              <button class="px-3 py-1 bg-teal-800 text-white rounded text-xs hover:bg-teal-900 transition">수정</button>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </section>
+
+  </main>
+
+  <div id="upload-modal" class="fixed inset-0 bg-black/60 flex items-center justify-center z-[100] hidden p-4">
+    <div class="bg-white w-full max-w-2xl rounded-2xl shadow-2xl overflow-hidden">
+      <div class="p-6 border-b border-gray-100 flex justify-between items-center bg-gray-50">
+        <h3 class="text-xl font-bold text-gray-800">새 콘텐츠 등록</h3>
+        <button onclick="document.getElementById('upload-modal').classList.add('hidden')" class="text-gray-400 hover:text-gray-600"><i class="fa-solid fa-xmark text-xl"></i></button>
+      </div>
+      <div class="p-8 space-y-5">
+        <div class="grid grid-cols-2 gap-4">
+          <div>
+            <label class="block text-xs font-bold text-gray-400 mb-2 uppercase">분류 선택</label>
+            <select class="w-full border-gray-200 rounded-lg p-2.5 bg-gray-50"><option>인사이트</option><option>리더십</option></select>
+          </div>
+          <div>
+            <label class="block text-xs font-bold text-gray-400 mb-2 uppercase">정렬 순번</label>
+            <input type="number" class="w-full border-gray-200 rounded-lg p-2.5 bg-gray-50" value="0">
+          </div>
+        </div>
+        <div>
+          <label class="block text-xs font-bold text-gray-400 mb-2 uppercase">콘텐츠명 (강좌명)</label>
+          <input type="text" class="w-full border-gray-200 rounded-lg p-2.5 bg-gray-50" placeholder="콘텐츠 제목을 입력하세요">
+        </div>
+        <div>
+          <label class="block text-xs font-bold text-gray-400 mb-2 uppercase">유튜브 URL (영상 주소)</label>
+          <input type="text" class="w-full border-gray-200 rounded-lg p-2.5 bg-gray-50" placeholder="https://youtu.be/...">
+        </div>
+        <div class="flex items-center space-x-6 py-2">
+          <label class="flex items-center space-x-2 cursor-pointer">
+            <input type="checkbox" class="w-4 h-4 text-teal-600 rounded"> <span class="text-sm font-bold">한맥 PICK 등록</span>
+          </label>
+          <label class="flex items-center space-x-2 cursor-pointer">
+            <input type="checkbox" class="w-4 h-4 text-red-600 rounded"> <span class="text-sm font-bold">사용자에게 숨김</span>
+          </label>
+        </div>
+      </div>
+      <div class="p-6 bg-gray-50 border-t border-gray-100 flex justify-end space-x-3">
+        <button onclick="document.getElementById('upload-modal').classList.add('hidden')" class="px-6 py-2 text-gray-500 font-bold hover:text-gray-700">취소</button>
+        <button class="px-8 py-2 bg-teal-800 text-white rounded-lg font-bold shadow-lg">저장하기</button>
+      </div>
+    </div>
+  </div>
+</body>
+</html>

src/admin/header.php

@@ -0,0 +1,67 @@
+<?php
+// 현재 파일명을 가져와서 메뉴 활성화에 사용
+$current_page = basename($_SERVER['PHP_SELF']);
+?>
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <script src="https://cdn.tailwindcss.com"></script>
+  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
+  <style>
+    @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
+    body { font-family: 'Noto Sans KR', sans-serif; }
+    .nav-active { background-color: rgba(255, 255, 255, 0.1); font-weight: bold; border-bottom: 4px solid rgba(255, 255, 255, 0.4); }
+  </style>
+</head>
+<body class="bg-[#f8fafc]">
+<nav class="w-full shadow-md font-['Noto_Sans_KR'] sticky top-0 z-50">
+  
+  <div class="bg-[#114b3d] text-white">
+    <div class="max-w-[1600px] mx-auto px-6 h-16 flex items-center justify-between">
+      
+      <div class="flex items-center">
+        <h1 class="text-xl font-bold flex items-center tracking-tight cursor-pointer" onclick="location.href='index.php'">
+          <span class="bg-white text-[#114b3d] p-1 rounded mr-2"><i class="fa-solid fa-graduation-cap"></i></span>
+          배움터 <span class="ml-2 text-sm font-light opacity-70">LMS 관리자</span>
+        </h1>
+      </div>
+
+      <div class="hidden md:flex items-center h-full text-sm">
+        <a href="index.php" class="px-5 h-16 flex items-center hover:bg-white/10 transition space-x-2 <?php echo ($current_page == 'index.php') ? 'nav-active' : ''; ?>">
+          <i class="fa-solid fa-chart-line opacity-80"></i>
+          <span>전체학습현황</span>
+        </a>
+        <a href="member_list.php" class="px-5 h-16 flex items-center hover:bg-white/10 transition space-x-2 <?php echo ($current_page == 'member_list.php') ? 'nav-active' : ''; ?>">
+          <i class="fa-solid fa-users opacity-80"></i>
+          <span>학습자관리</span>
+        </a>
+        <a href="legal_edu.php" class="px-5 h-16 flex items-center hover:bg-white/10 transition space-x-2 <?php echo ($current_page == 'legal_edu.php') ? 'nav-active' : ''; ?>">
+          <i class="fa-solid fa-book opacity-80"></i>
+          <span>법정의무교육</span>
+        </a>
+        <a href="content_upload.php" class="px-5 h-16 flex items-center hover:bg-white/10 transition space-x-2 <?php echo ($current_page == 'content_upload.php') ? 'nav-active' : ''; ?>">
+          <i class="fa-solid fa-pen-to-square opacity-80"></i>
+          <span>콘텐츠 입력</span>
+        </a>
+        <a href="settings.php" class="ml-2 px-4 h-10 self-center flex items-center bg-white/10 hover:bg-white/20 rounded-lg transition <?php echo ($current_page == 'settings.php') ? 'ring-2 ring-white/50' : ''; ?>">
+          <i class="fa-solid fa-gear mr-2"></i>설정
+        </a>
+      </div>
+      
+      <div class="flex items-center space-x-4">
+        <button class="bg-white/10 hover:bg-white/20 p-2 rounded-full transition"><i class="fa-solid fa-right-from-bracket"></i></button>
+      </div>
+    </div>
+  </div>
+
+  <div class="bg-[#0d3a2f] text-white/90 border-t border-white/5">
+    <div class="max-w-[1600px] mx-auto px-6 h-10 flex items-center text-[13px] space-x-8">
+      <div class="flex items-center"><span class="opacity-60 mr-2">법인명:</span><span class="font-bold">바른컨설턴트</span></div>
+      <div class="flex items-center border-l border-white/10 pl-8"><span class="opacity-60 mr-2">관리자 ID:</span><span class="font-bold">B24064</span></div>
+      <div class="flex items-center border-l border-white/10 pl-8"><span class="opacity-60 mr-2">전체 학습자 수:</span><span class="font-bold text-teal-300">74명</span></div>
+      <div class="flex items-center border-l border-white/10 pl-8"><span class="opacity-60 mr-2">법정의무교육 기간:</span><span class="font-bold">2026.11.01 ~ 2026.12.15</span></div>
+    </div>
+  </div>
+</nav>

src/admin/index.php

@@ -1,59 +1,7 @@
-<!DOCTYPE html>
-<html lang="ko">
-<head>
-  <meta charset="UTF-8">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title>배움터 LMS 관리자 모드</title>
-  <script src="https://cdn.tailwindcss.com"></script>
-  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
-  <style>
-    @import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');
-    body { font-family: 'Noto Sans KR', sans-serif; }
-  </style>
-</head>
-<body class="bg-[#f8fafc]">
-
-  <nav class="sticky top-0 z-50 w-full bg-[#1e293b] text-white shadow-md">
-    <div class="max-w-[1600px] mx-auto px-6 h-16 flex items-center justify-between">
-      <div class="flex items-center space-x-8">
-        <h1 class="text-xl font-bold flex items-center tracking-tight">
-          <span class="bg-white text-[#1e293b] p-1 rounded mr-2"><i class="fa-solid fa-graduation-cap"></i></span>
-          배움터 <span class="ml-2 text-sm font-light opacity-80 italic">LMS 관리자</span>
-        </h1>
-        
-        <div class="hidden md:flex items-center space-x-1">
-          <a href="#" class="px-4 py-5 border-b-4 border-blue-400 bg-white/10 flex items-center text-sm font-medium">
-            <i class="fa-solid fa-chart-pie mr-2"></i>전체학습현황
-          </a>
-          <a href="#" class="px-4 py-5 border-b-4 border-transparent hover:bg-white/5 flex items-center text-sm font-medium transition">
-            <i class="fa-solid fa-users-gear mr-2"></i>학습자관리
-          </a>
-          <a href="#" class="px-4 py-5 border-b-4 border-transparent hover:bg-white/5 flex items-center text-sm font-medium transition">
-            <i class="fa-solid fa-scale-balanced mr-2"></i>법정의무교육
-          </a>
-          <a href="#" class="px-4 py-5 border-b-4 border-transparent hover:bg-white/5 flex items-center text-sm font-medium transition">
-            <i class="fa-solid fa-cloud-arrow-up mr-2"></i>콘텐츠 입력
-          </a>
-          <a href="#" class="px-4 py-5 border-b-4 border-transparent hover:bg-white/5 flex items-center text-sm font-medium transition">
-            <i class="fa-solid fa-sliders mr-2"></i>설정
-          </a>
-        </div>
-      </div>
-
-      <div class="flex items-center space-x-4">
-        <div class="text-right hidden sm:block">
-          <p class="text-xs opacity-70">권역: 바른컨설턴트</p>
-          <p class="text-sm font-bold">관리자ID: <span class="text-blue-300">B24064</span></p>
-        </div>
-        <button class="bg-white/10 hover:bg-white/20 p-2 rounded-full transition">
-          <i class="fa-solid fa-right-from-bracket"></i>
-        </button>
-      </div>
-    </div>
-  </nav>
-
-  <main class="max-w-[1600px] mx-auto p-6">
-    
+<?php
+include_once 'header.php';
+?>
+<main class="max-w-[1600px] mx-auto p-6">
     <header class="flex flex-col md:flex-row justify-between items-end md:items-center mb-6 gap-4">
       <div>
         <h2 class="text-2xl font-bold text-gray-800 flex items-center">
@@ -116,7 +64,7 @@
             <span class="text-sm font-medium text-gray-600">GAIA</span><span class="text-sm font-bold text-blue-600">14.1회</span>
           </div>
         </div>
-      </div>
+            </div>
 
       <div class="bg-white p-6 rounded-xl border border-gray-200 shadow-sm relative overflow-hidden">
         <h3 class="font-bold text-gray-800 mb-6">법인별 접속 추이</h3>
@@ -128,10 +76,10 @@
                 <circle cx="200" cy="35" r="3" fill="#0d9488" />
             </svg>
         </div>
-      </div>
+                </div>
     </section>
 
-    <section class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+    <section class="grid grid-cols-1 lg:grid-cols-2 gap-6 pb-12">
       <div class="bg-white rounded-xl border border-gray-200 shadow-sm overflow-hidden">
         <div class="p-6 border-b border-gray-50 flex justify-between items-center bg-gray-50/50">
           <h3 class="font-bold text-gray-800 flex items-center italic">
@@ -200,7 +148,6 @@
         </button>
       </div>
     </section>
-
-  </main>
+</main>
 </body>
-</html>
+</html>

src/admin/legal_edu.php

@@ -0,0 +1,115 @@
+<?php
+include_once 'header.php';
+?>
+<main class="max-w-[1600px] mx-auto p-6">
+    
+    <header class="flex flex-col md:flex-row justify-between items-start md:items-center mb-8 gap-4">
+      <h2 class="text-2xl font-bold text-gray-800 italic">법정의무교육</h2>
+      <div class="flex flex-wrap gap-2">
+        <button class="px-4 py-2 bg-white border border-gray-200 rounded-md text-sm font-medium hover:bg-gray-50 flex items-center shadow-sm">
+          <i class="fa-solid fa-print mr-2"></i>이수증 출력
+        </button>
+        <button class="px-4 py-2 bg-white border border-gray-200 rounded-md text-sm font-medium hover:bg-gray-50 flex items-center shadow-sm">
+          <i class="fa-solid fa-file-excel mr-2"></i>교육결과보고서
+        </button>
+        <button class="px-4 py-2 bg-red-50 text-red-600 border border-red-100 rounded-md text-sm font-bold flex items-center hover:bg-red-100 shadow-sm transition">
+          <i class="fa-solid fa-bell mr-2"></i>미수료자 알림 (5명)
+        </button>
+        <button class="px-4 py-2 bg-gray-100 text-gray-600 rounded-md text-sm font-medium hover:bg-gray-200 flex items-center transition">
+          <i class="fa-solid fa-download mr-2"></i>다운로드
+        </button>
+      </div>
+    </header>
+
+    <section class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
+      <div class="bg-white p-6 rounded-xl border border-gray-200 shadow-sm">
+        <p class="text-xs font-bold text-gray-400 mb-1">전체 대상자</p>
+        <p class="text-3xl font-bold text-gray-800">15명</p>
+      </div>
+      <div class="bg-white p-6 rounded-xl border border-gray-200 shadow-sm">
+        <p class="text-xs font-bold text-gray-400 mb-1">수료 완료</p>
+        <p class="text-3xl font-bold text-teal-600">10명</p>
+      </div>
+      <div class="bg-white p-6 rounded-xl border border-gray-200 shadow-sm">
+        <p class="text-xs font-bold text-gray-400 mb-1">미수료</p>
+        <p class="text-3xl font-bold text-red-500">5명</p>
+      </div>
+    </section>
+
+    <section class="bg-white p-5 rounded-xl border border-gray-200 shadow-sm mb-6 flex flex-col md:flex-row gap-6">
+      <div class="flex-1">
+        <label class="block text-xs font-bold text-gray-500 mb-2">법인 선택</label>
+        <select class="w-full border-gray-200 rounded-lg text-sm p-2.5 bg-gray-50">
+          <option>전체</option>
+          <option>한맥기술</option>
+          <option>삼안</option>
+        </select>
+      </div>
+      <div class="flex-[2]">
+        <label class="block text-xs font-bold text-gray-500 mb-2">법정의무교육 과정</label>
+        <select class="w-full border-gray-200 rounded-lg text-sm p-2.5 bg-gray-50">
+          <option>전체</option>
+          <option>직장 내 성희롱 예방 교육</option>
+          <option>개인정보 보호 교육</option>
+        </select>
+      </div>
+    </section>
+
+    <section class="bg-white rounded-xl border border-gray-200 shadow-sm overflow-hidden mb-12">
+      <div class="overflow-x-auto">
+        <table class="w-full text-sm text-left">
+          <thead class="bg-gray-50 border-b border-gray-200 text-gray-500 font-bold italic">
+            <tr>
+              <th class="p-4">성명</th>
+              <th class="p-4">법인</th>
+              <th class="p-4">교육과정명</th>
+              <th class="p-4">교육 이수일</th>
+              <th class="p-4">학습시간</th>
+              <th class="p-4 w-48">진도율</th>
+              <th class="p-4 text-center">수료 구분</th>
+            </tr>
+          </thead>
+          <tbody class="divide-y divide-gray-100">
+            <tr class="hover:bg-gray-50 transition">
+              <td class="p-4 font-bold text-gray-800">김철수</td>
+              <td class="p-4 text-gray-400">바른컨설턴트</td>
+              <td class="p-4">직장 내 성희롱 예방 교육</td>
+              <td class="p-4 text-[11px] leading-tight">2026.01.17<br>15:32</td>
+              <td class="p-4">1시간 25분</td>
+              <td class="p-4">
+                <div class="flex items-center space-x-2">
+                  <div class="flex-1 h-2 bg-gray-100 rounded-full overflow-hidden">
+                    <div class="bg-teal-500 h-full" style="width: 100%;"></div>
+                  </div>
+                  <span class="text-[10px] font-bold text-teal-600">100%</span>
+                </div>
+              </td>
+              <td class="p-4 text-center">
+                <span class="px-3 py-1 bg-green-50 text-green-600 border border-green-100 rounded-full text-[11px] font-bold"><i class="fa-solid fa-check-circle mr-1"></i>수료</span>
+              </td>
+            </tr>
+            <tr class="hover:bg-gray-50 transition">
+              <td class="p-4 font-bold text-gray-800">백승훈</td>
+              <td class="p-4 text-gray-400">PTC</td>
+              <td class="p-4">산업안전보건 교육</td>
+              <td class="p-4 text-gray-300">-</td>
+              <td class="p-4">45분</td>
+              <td class="p-4">
+                <div class="flex items-center space-x-2">
+                  <div class="flex-1 h-2 bg-gray-100 rounded-full overflow-hidden">
+                    <div class="bg-gray-400 h-full" style="width: 70%;"></div>
+                  </div>
+                  <span class="text-[10px] font-bold text-gray-500">70%</span>
+                </div>
+              </td>
+              <td class="p-4 text-center">
+                <span class="px-3 py-1 bg-red-50 text-red-600 border border-red-100 rounded-full text-[11px] font-bold"><i class="fa-solid fa-circle-xmark mr-1"></i>미수료</span>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+    </section>
+</main>
+</body>
+</html>

src/admin/member_list.php

@@ -0,0 +1,142 @@
+<?php
+include_once 'header.php';
+?>
+<main class="max-w-[1600px] mx-auto p-6">
+    
+    <header class="mb-6">
+      <h2 class="text-2xl font-bold text-gray-800 italic">학습자관리</h2>
+    </header>
+
+    <section class="bg-white p-6 rounded-xl border border-gray-200 shadow-sm mb-6">
+      <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
+        <div>
+          <label class="block text-xs font-bold text-gray-500 mb-2">법인 선택</label>
+          <select class="w-full border-gray-200 rounded-lg text-sm p-2 bg-gray-50 focus:ring-2 focus:ring-blue-500">
+            <option>전체</option>
+            <option>한맥기술</option>
+            <option>삼안</option>
+          </select>
+        </div>
+        <div>
+          <label class="block text-xs font-bold text-gray-500 mb-2">부서 선택</label>
+          <select class="w-full border-gray-200 rounded-lg text-sm p-2 bg-gray-50">
+            <option>전체</option>
+          </select>
+        </div>
+        <div>
+          <label class="block text-xs font-bold text-gray-500 mb-2">분기별 조회</label>
+          <select class="w-full border-gray-200 rounded-lg text-sm p-2 bg-gray-50">
+            <option>전체</option>
+            <option>1분기</option>
+          </select>
+        </div>
+        <div>
+          <label class="block text-xs font-bold text-gray-500 mb-2">사번 및 성명 검색</label>
+          <div class="relative">
+            <input type="text" placeholder="예: b24064 또는 홍길동" class="w-full border-gray-200 rounded-lg text-sm p-2 pl-8 bg-gray-50">
+            <i class="fa-solid fa-magnifying-glass absolute left-3 top-2.5 text-gray-400 text-xs"></i>
+          </div>
+        </div>
+      </div>
+    </section>
+
+    <section class="bg-white rounded-xl border border-gray-200 shadow-sm overflow-hidden mb-12">
+      <div class="overflow-x-auto">
+        <table class="w-full text-sm text-left">
+          <thead class="bg-gray-50 border-b border-gray-200 text-gray-500 font-bold">
+            <tr>
+              <th class="p-4">사번</th>
+              <th class="p-4">성명</th>
+              <th class="p-4">소속법인</th>
+              <th class="p-4">부서</th>
+              <th class="p-4 w-40">마이클래스</th>
+              <th class="p-4 w-40">법정의무교육</th>
+              <th class="p-4">학습시간</th>
+              <th class="p-4">최근 접속일</th>
+              <th class="p-4 text-center">뱃지 레벨</th>
+              <th class="p-4 text-center">관리</th>
+            </tr>
+          </thead>
+          <tbody class="divide-y divide-gray-100">
+            <tr class="hover:bg-blue-50/30 transition">
+              <td class="p-4 text-gray-500 font-medium">b24064</td>
+              <td class="p-4 font-bold text-gray-800">홍길동</td>
+              <td class="p-4">한맥기술</td>
+              <td class="p-4">전략기획팀</td>
+              <td class="p-4">
+                <div class="flex items-center space-x-2">
+                  <div class="progress-bar flex-1 h-2 bg-gray-100 rounded-full overflow-hidden"><div class="progress-fill bg-blue-500 h-full" style="width: 100%;"></div></div>
+                  <span class="text-[10px] font-bold text-blue-600">100%</span>
+                </div>
+              </td>
+              <td class="p-4">
+                <div class="flex items-center space-x-2">
+                  <div class="progress-bar flex-1 h-2 bg-gray-100 rounded-full overflow-hidden"><div class="progress-fill bg-teal-500 h-full" style="width: 100%;"></div></div>
+                  <span class="text-[10px] font-bold text-teal-600">100%</span>
+                </div>
+              </td>
+              <td class="p-4 font-bold">52시간</td>
+              <td class="p-4 text-gray-400">2026.02.24</td>
+              <td class="p-4 text-center">
+                <span class="px-2 py-1 bg-purple-100 text-purple-600 rounded-md text-[10px] font-bold uppercase"><i class="fa-solid fa-crown mr-1"></i>Master</span>
+              </td>
+              <td class="p-4 text-center">
+                <button class="text-gray-400 hover:text-blue-600 transition"><i class="fa-solid fa-circle-info text-lg"></i></button>
+              </td>
+            </tr>
+            <tr class="hover:bg-blue-50/30 transition">
+              <td class="p-4 text-gray-500 font-medium">h31245</td>
+              <td class="p-4 font-bold text-gray-800">이영희</td>
+              <td class="p-4">삼안</td>
+              <td class="p-4">설계2팀</td>
+              <td class="p-4">
+                <div class="flex items-center space-x-2">
+                  <div class="progress-bar flex-1 h-2 bg-gray-100 rounded-full overflow-hidden"><div class="progress-fill bg-blue-400 h-full" style="width: 60%;"></div></div>
+                  <span class="text-[10px] font-bold text-blue-500">60%</span>
+                </div>
+              </td>
+              <td class="p-4">
+                <div class="flex items-center space-x-2">
+                  <div class="progress-bar flex-1 h-2 bg-gray-100 rounded-full overflow-hidden"><div class="progress-fill bg-teal-400 h-full" style="width: 80%;"></div></div>
+                  <span class="text-[10px] font-bold text-teal-500">80%</span>
+                </div>
+              </td>
+              <td class="p-4 font-bold">18시간</td>
+              <td class="p-4 text-gray-400">2026.02.20</td>
+              <td class="p-4 text-center">
+                <span class="px-2 py-1 bg-blue-50 text-blue-500 rounded-md text-[10px] font-bold uppercase"><i class="fa-solid fa-star mr-1"></i>Elite</span>
+              </td>
+              <td class="p-4 text-center">
+                <button class="text-gray-400 hover:text-blue-600 transition"><i class="fa-solid fa-circle-info text-lg"></i></button>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
+      
+      <div class="p-4 bg-gray-50/50 border-t border-gray-100 flex justify-center space-x-1">
+        <button class="w-8 h-8 rounded border border-gray-200 bg-white text-gray-400"><i class="fa-solid fa-angle-left"></i></button>
+        <button class="w-8 h-8 rounded bg-blue-600 text-white font-bold">1</button>
+        <button class="w-8 h-8 rounded border border-gray-200 bg-white text-gray-600">2</button>
+        <button class="w-8 h-8 rounded border border-gray-200 bg-white text-gray-600">3</button>
+        <button class="w-8 h-8 rounded border border-gray-200 bg-white text-gray-400"><i class="fa-solid fa-angle-right"></i></button>
+      </div>
+    </section>
+
+    <section class="mt-6 flex flex-wrap gap-4 justify-center py-4 bg-white rounded-xl border border-dashed border-gray-300">
+      <div class="flex items-center text-xs font-medium text-gray-500">
+        <span class="w-3 h-3 rounded-full bg-gray-200 mr-2"></span> Rookie: 0-8시간
+      </div>
+      <div class="flex items-center text-xs font-medium text-gray-500">
+        <span class="w-3 h-3 rounded-full bg-green-200 mr-2"></span> Learner: 8-20시간
+      </div>
+      <div class="flex items-center text-xs font-medium text-gray-500">
+        <span class="w-3 h-3 rounded-full bg-blue-200 mr-2"></span> Elite: 20-40시간
+      </div>
+      <div class="flex items-center text-xs font-medium text-gray-500">
+        <span class="w-3 h-3 rounded-full bg-purple-200 mr-2"></span> Master: 40시간 이상
+      </div>
+    </section>
+</main>
+</body>
+</html>

src/admin/settings.php

@@ -0,0 +1,260 @@
+<?php
+include_once 'header.php';
+?>
+<main class="max-w-[1600px] mx-auto p-8">
+    <header class="mb-8">
+      <h2 class="text-3xl font-bold text-gray-800 tracking-tight">설정</h2>
+    </header>
+
+    <div class="flex flex-col lg:flex-row gap-8">
+      
+      <!-- 사이드 탭 메뉴 -->
+      <aside class="w-full lg:w-64 flex-shrink-0">
+        <nav class="bg-white border border-gray-200 rounded-2xl p-2 space-y-1 shadow-sm sticky top-24">
+          <button onclick="showTab('tab-corp')" id="btn-corp" class="w-full flex items-center gap-3 p-3.5 text-sm font-bold text-white bg-[#114b3d] rounded-xl transition">
+            <i class="fa-solid fa-building w-5 text-center"></i>법인 관리
+          </button>
+          <button onclick="showTab('tab-auth')" id="btn-auth" class="w-full flex items-center gap-3 p-3.5 text-sm font-bold text-gray-500 rounded-xl transition hover:bg-gray-50">
+            <i class="fa-solid fa-user-shield w-5 text-center"></i>관리자 권한 관리
+          </button>
+          <button onclick="showTab('tab-course')" id="btn-course" class="w-full flex items-center gap-3 p-3.5 text-sm font-bold text-gray-500 rounded-xl transition hover:bg-gray-50">
+            <i class="fa-solid fa-book-open w-5 text-center"></i>교육 과정 관리
+          </button>
+          <button onclick="showTab('tab-msg')" id="btn-msg" class="w-full flex items-center gap-3 p-3.5 text-sm font-bold text-gray-500 rounded-xl transition hover:bg-gray-50">
+            <i class="fa-solid fa-bell w-5 text-center"></i>알림 템플릿 관리
+          </button>
+          <button onclick="showTab('tab-period')" id="btn-period" class="w-full flex items-center gap-3 p-3.5 text-sm font-bold text-gray-500 rounded-xl transition hover:bg-gray-50">
+            <i class="fa-solid fa-calendar-check w-5 text-center"></i>법정의무교육 기간 설정
+          </button>
+        </nav>
+      </aside>
+
+      <!-- 탭 콘텐츠 영역 -->
+      <section class="flex-1 min-h-[600px]">
+
+        <!-- 법인 관리 탭 -->
+        <div id="tab-corp" class="tab-content bg-white border border-gray-200 rounded-2xl shadow-sm overflow-hidden">
+          <div class="p-6 border-b border-gray-100 flex justify-between items-center bg-gray-50/30">
+            <h3 class="font-bold text-gray-800">법인 관리</h3>
+            <button class="px-4 py-2 bg-[#114b3d] text-white rounded-lg text-xs font-bold shadow-md hover:bg-[#0d3a2f] transition">
+              <i class="fa-solid fa-plus mr-1"></i> 법인 추가
+            </button>
+          </div>
+          <table class="w-full text-sm text-left">
+            <thead class="bg-gray-50/50 text-gray-500 font-bold">
+              <tr>
+                <th class="p-4">법인명</th>
+                <th class="p-4">학습자 수</th>
+                <th class="p-4">상태</th>
+                <th class="p-4 text-center">관리</th>
+              </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-50">
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">한맥기술</td>
+                <td class="p-4 text-gray-500">450명</td>
+                <td class="p-4"><span class="px-2 py-1 bg-teal-50 text-teal-600 rounded-full text-[10px] font-bold">활성</span></td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">삼안</td>
+                <td class="p-4 text-gray-500">520명</td>
+                <td class="p-4"><span class="px-2 py-1 bg-teal-50 text-teal-600 rounded-full text-[10px] font-bold">활성</span></td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">바른컨설턴트</td>
+                <td class="p-4 text-gray-500">74명</td>
+                <td class="p-4"><span class="px-2 py-1 bg-teal-50 text-teal-600 rounded-full text-[10px] font-bold">활성</span></td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <!-- 관리자 권한 관리 탭 -->
+        <div id="tab-auth" class="tab-content hidden bg-white border border-gray-200 rounded-2xl shadow-sm p-8">
+          <h3 class="font-bold text-xl text-gray-800 mb-6">관리자 권한 관리</h3>
+          <div class="space-y-8">
+            <div class="border-b border-gray-100 pb-6">
+              <div class="flex justify-between items-center mb-4">
+                <h4 class="font-bold text-gray-700">최고 관리자</h4>
+                <span class="text-xs text-gray-400 font-medium px-3 py-1 bg-gray-100 rounded-full">현재 사용자: B24064</span>
+              </div>
+              <p class="text-sm text-gray-500 leading-relaxed">모든 기능에 대한 전체 접근 권한을 가집니다. 법인 추가, 교육 기간 설정 등 시스템 전반을 관리합니다.</p>
+            </div>
+            <div>
+              <h4 class="font-bold text-gray-700 mb-4">접근 가능 메뉴 설정</h4>
+              <div class="grid grid-cols-2 md:grid-cols-4 gap-4">
+                <label class="flex items-center space-x-3 p-3 bg-gray-50 rounded-xl cursor-pointer hover:bg-gray-100 transition">
+                  <input type="checkbox" checked class="w-4 h-4 text-[#114b3d] rounded focus:ring-0">
+                  <span class="text-sm font-medium">전체학습현황</span>
+                </label>
+                <label class="flex items-center space-x-3 p-3 bg-gray-50 rounded-xl cursor-pointer hover:bg-gray-100 transition">
+                  <input type="checkbox" checked class="w-4 h-4 text-[#114b3d] rounded focus:ring-0">
+                  <span class="text-sm font-medium">학습자관리</span>
+                </label>
+                <label class="flex items-center space-x-3 p-3 bg-gray-50 rounded-xl cursor-pointer hover:bg-gray-100 transition">
+                  <input type="checkbox" checked class="w-4 h-4 text-[#114b3d] rounded focus:ring-0">
+                  <span class="text-sm font-medium">법정의무교육</span>
+                </label>
+                <label class="flex items-center space-x-3 p-3 bg-gray-50 rounded-xl cursor-pointer hover:bg-gray-100 transition">
+                  <input type="checkbox" checked class="w-4 h-4 text-[#114b3d] rounded focus:ring-0">
+                  <span class="text-sm font-medium">콘텐츠 입력</span>
+                </label>
+                <label class="flex items-center space-x-3 p-3 bg-gray-50 rounded-xl cursor-pointer hover:bg-gray-100 transition">
+                  <input type="checkbox" checked class="w-4 h-4 text-[#114b3d] rounded focus:ring-0">
+                  <span class="text-sm font-medium">설정</span>
+                </label>
+              </div>
+            </div>
+            <div class="flex justify-end pt-4">
+              <button class="px-6 py-2.5 bg-[#114b3d] text-white rounded-lg font-bold text-sm shadow-md hover:bg-[#0d3a2f] transition">권한 저장</button>
+            </div>
+          </div>
+        </div>
+
+        <!-- 교육 과정 관리 탭 -->
+        <div id="tab-course" class="tab-content hidden bg-white border border-gray-200 rounded-2xl shadow-sm overflow-hidden">
+          <div class="p-6 border-b border-gray-100 flex justify-between items-center bg-gray-50/30">
+            <h3 class="font-bold text-gray-800">교육 과정 관리</h3>
+            <button class="px-4 py-2 bg-[#114b3d] text-white rounded-lg text-xs font-bold shadow-md hover:bg-[#0d3a2f] transition">
+              <i class="fa-solid fa-plus mr-1"></i> 과정 추가
+            </button>
+          </div>
+          <table class="w-full text-sm text-left">
+            <thead class="bg-gray-50/50 text-gray-500 font-bold">
+              <tr>
+                <th class="p-4">과정명</th>
+                <th class="p-4">구분</th>
+                <th class="p-4 text-center">교육 시간</th>
+                <th class="p-4 text-center">관리</th>
+              </tr>
+            </thead>
+            <tbody class="divide-y divide-gray-50">
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">직장 내 성희롱 예방 교육</td>
+                <td class="p-4"><span class="px-2 py-0.5 bg-red-50 text-red-500 rounded text-[10px] font-bold">법정의무</span></td>
+                <td class="p-4 text-center text-gray-500">1시간</td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">개인정보 보호 교육</td>
+                <td class="p-4"><span class="px-2 py-0.5 bg-red-50 text-red-500 rounded text-[10px] font-bold">법정의무</span></td>
+                <td class="p-4 text-center text-gray-500">1시간 10분</td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">산업안전보건 교육</td>
+                <td class="p-4"><span class="px-2 py-0.5 bg-red-50 text-red-500 rounded text-[10px] font-bold">법정의무</span></td>
+                <td class="p-4 text-center text-gray-500">1시간</td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+              <tr class="hover:bg-gray-50/50 transition">
+                <td class="p-4 font-bold">인생이 바뀌는 환경을 셋업하는 뇌과학적 방법</td>
+                <td class="p-4"><span class="px-2 py-0.5 bg-blue-50 text-blue-500 rounded text-[10px] font-bold">마이클래스</span></td>
+                <td class="p-4 text-center text-gray-500">45분</td>
+                <td class="p-4 text-center text-xs">
+                  <button class="text-blue-500 mr-2 font-bold hover:underline">수정</button>
+                  <button class="text-red-400 font-bold hover:underline">삭제</button>
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+
+        <!-- 알림 템플릿 관리 탭 -->
+        <div id="tab-msg" class="tab-content hidden space-y-6">
+          <div class="bg-white border border-gray-200 rounded-2xl p-6 shadow-sm">
+            <h3 class="font-bold text-gray-800 mb-2">미수료자 알림</h3>
+            <p class="text-xs text-gray-400 mb-4">사용 가능한 변수: <code class="bg-gray-100 px-1 py-0.5 rounded">{학습자명}</code>, <code class="bg-gray-100 px-1 py-0.5 rounded">{과정명}</code>, <code class="bg-gray-100 px-1 py-0.5 rounded">{종료일}</code></p>
+            <textarea class="w-full border border-gray-200 rounded-xl p-4 bg-gray-50 text-sm focus:ring-2 focus:ring-teal-500 outline-none resize-none" rows="4">안녕하세요, {학습자명}님. 아직 완료하지 못한 학습 과정이 있습니다. 기한 내 수료를 부탁드립니다.</textarea>
+            <div class="flex justify-end mt-4">
+              <button class="px-6 py-2 bg-[#114b3d] text-white rounded-lg font-bold text-xs flex items-center shadow-md hover:bg-[#0d3a2f] transition">
+                <i class="fa-solid fa-save mr-2"></i>저장
+              </button>
+            </div>
+          </div>
+          <div class="bg-white border border-gray-200 rounded-2xl p-6 shadow-sm">
+            <h3 class="font-bold text-gray-800 mb-2">법정의무교육 안내</h3>
+            <p class="text-xs text-gray-400 mb-4">사용 가능한 변수: <code class="bg-gray-100 px-1 py-0.5 rounded">{학습자명}</code>, <code class="bg-gray-100 px-1 py-0.5 rounded">{시작일}</code>, <code class="bg-gray-100 px-1 py-0.5 rounded">{종료일}</code></p>
+            <textarea class="w-full border border-gray-200 rounded-xl p-4 bg-gray-50 text-sm focus:ring-2 focus:ring-teal-500 outline-none resize-none" rows="4">안녕하세요, {학습자명}님. 법정의무교육 기간이 시작되었습니다. 기간: {시작일} ~ {종료일}</textarea>
+            <div class="flex justify-end mt-4">
+              <button class="px-6 py-2 bg-[#114b3d] text-white rounded-lg font-bold text-xs flex items-center shadow-md hover:bg-[#0d3a2f] transition">
+                <i class="fa-solid fa-save mr-2"></i>저장
+              </button>
+            </div>
+          </div>
+        </div>
+
+        <!-- 법정의무교육 기간 설정 탭 -->
+        <div id="tab-period" class="tab-content hidden bg-white border border-gray-200 rounded-2xl p-8 shadow-sm">
+          <h3 class="font-bold text-xl text-gray-800 mb-8">법정의무교육 기간 설정</h3>
+          <div class="grid grid-cols-1 md:grid-cols-2 gap-8 mb-8">
+            <div>
+              <label class="block text-xs font-bold text-gray-400 mb-3 uppercase tracking-wider">교육 시작일</label>
+              <input type="date" value="2026-11-01" class="w-full border border-gray-200 rounded-xl p-3.5 bg-gray-50 focus:ring-2 focus:ring-teal-500 font-medium outline-none">
+            </div>
+            <div>
+              <label class="block text-xs font-bold text-gray-400 mb-3 uppercase tracking-wider">교육 종료일</label>
+              <input type="date" value="2026-12-15" class="w-full border border-gray-200 rounded-xl p-3.5 bg-gray-50 focus:ring-2 focus:ring-teal-500 font-medium outline-none">
+            </div>
+          </div>
+          <div class="bg-blue-50 border border-blue-100 p-5 rounded-xl mb-8 flex items-start">
+            <i class="fa-solid fa-circle-info text-blue-500 mt-1 mr-4 text-lg"></i>
+            <div>
+              <p class="text-sm text-blue-800 font-bold leading-tight">현재 설정된 기간: 2026.11.01 ~ 2026.12.15</p>
+              <p class="text-xs text-blue-600 mt-1.5 opacity-80 leading-relaxed">기간을 변경하면 시스템에 등록된 모든 법인 학습자에게 동일하게 기간이 적용됩니다.</p>
+            </div>
+          </div>
+          <div class="flex justify-center">
+            <button class="px-12 py-3.5 bg-[#114b3d] text-white rounded-xl font-bold shadow-xl hover:bg-[#0d3a2f] transition flex items-center">
+              <i class="fa-solid fa-calendar-check mr-2"></i>기간 저장
+            </button>
+          </div>
+        </div>
+
+      </section>
+    </div>
+</main>
+
+<script>
+  function showTab(tabId) {
+    // 모든 탭 콘텐츠 숨기기
+    document.querySelectorAll('.tab-content').forEach(el => el.classList.add('hidden'));
+    // 선택된 탭 보이기
+    document.getElementById(tabId).classList.remove('hidden');
+
+    // 사이드 버튼 활성화 상태 변경
+    document.querySelectorAll('aside nav button').forEach(btn => {
+      btn.classList.remove('text-white', 'bg-[#114b3d]');
+      btn.classList.add('text-gray-500');
+    });
+    const btnId = 'btn-' + tabId.split('-')[1];
+    const activeBtn = document.getElementById(btnId);
+    if (activeBtn) {
+      activeBtn.classList.add('text-white', 'bg-[#114b3d]');
+      activeBtn.classList.remove('text-gray-500');
+    }
+  }
+</script>
+</body>
+</html>