diff --git a/Project/Web/Controller/TodoController.cs b/Project/Web/Controller/TodoController.cs
index 8fcdeaf..b56161e 100644
--- a/Project/Web/Controller/TodoController.cs
+++ b/Project/Web/Controller/TodoController.cs
@@ -57,7 +57,18 @@ namespace Project.Web.Controllers
                 string gcode = FCOMMON.info.Login.gcode;
                 string uid = FCOMMON.info.Login.no;
 
-                var sql = "SELECT * FROM EETGW_Todo WHERE gcode = @gcode AND uid = @uid ORDER BY flag DESC, seqno DESC, expire ASC, wdate ASC";
+                var sql = @"SELECT * FROM EETGW_Todo WHERE gcode = @gcode AND uid = @uid 
+                    ORDER BY  
+                             CASE 
+                                WHEN ISNULL(status,'0') = '1' THEN 1  -- 진행
+                                WHEN ISNULL(status,'0') = '0' THEN 2  -- 대기
+                                WHEN ISNULL(status,'0') = '3' THEN 3  -- 보류
+                                WHEN ISNULL(status,'0') = '5' THEN 4  -- 완료
+                                WHEN ISNULL(status,'0') = '2' THEN 5  -- 취소
+                                ELSE 6 
+                             END,  flag DESC,
+                             ISNULL(seqno, 0) DESC, 
+                             expire ASC";
                 var todos = DBM.Query<TodoModel>(sql, new { gcode = gcode, uid = uid });
 
                 return CreateJsonResponse(new
@@ -149,13 +160,35 @@ namespace Project.Web.Controllers
 
                 if (todo.seqno == null) todo.seqno = 0;
                 if (todo.flag == null) todo.flag = false;
+                if (todo.status == '\0') todo.status = '0';
+
+                // 새로 생성할 때 완료 상태면 완료일 설정
+                DateTime? okdateValue = null;
+                if (todo.status == '5')
+                {
+                    okdateValue = DateTime.Now;
+                }
 
                 var sql = @"
-                    INSERT INTO EETGW_Todo (gcode, uid, title, remark, flag, expire, seqno, request, wuid, wdate)
-                    VALUES (@gcode, @uid, @title, @remark, @flag, @expire, @seqno, @request, @wuid, @wdate);
+                    INSERT INTO EETGW_Todo (gcode, uid, title, remark, flag, expire, seqno, request, status, okdate, wuid, wdate)
+                    VALUES (@gcode, @uid, @title, @remark, @flag, @expire, @seqno, @request, @status, @okdate, @wuid, @wdate);
                     SELECT SCOPE_IDENTITY();";
 
-                var newId = DBM.QuerySingle<int>(sql, todo);
+                var newId = DBM.QuerySingle<int>(sql, new
+                {
+                    gcode = todo.gcode,
+                    uid = todo.uid,
+                    title = todo.title,
+                    remark = todo.remark,
+                    flag = todo.flag,
+                    expire = todo.expire,
+                    seqno = todo.seqno,
+                    request = todo.request,
+                    status = todo.status,
+                    okdate = okdateValue,
+                    wuid = todo.wuid,
+                    wdate = todo.wdate
+                });
 
                 return CreateJsonResponse(new
                 {
@@ -210,9 +243,24 @@ namespace Project.Web.Controllers
                 string gcode = FCOMMON.info.Login.gcode;
                 string uid = FCOMMON.info.Login.no;
 
+                // 상태가 완료('5')로 변경되고 아직 완료일이 설정되지 않은 경우 완료일 설정
+                DateTime? okdateValue = null;
+                if (todo.status == '5')
+                {
+                    // 기존 완료일이 있는지 확인
+                    var existingTodo = DBM.QuerySingleOrDefault<TodoModel>(
+                        "SELECT okdate FROM EETGW_Todo WHERE idx = @idx AND gcode = @gcode AND uid = @uid",
+                        new { idx = todo.idx, gcode = gcode, uid = uid });
+                    
+                    if (existingTodo?.okdate == null)
+                    {
+                        okdateValue = DateTime.Now;
+                    }
+                }
+
                 var sql = @"
                     UPDATE EETGW_Todo 
-                    SET title = @title, remark = @remark, flag = @flag, expire = @expire, seqno = @seqno, request = @request
+                    SET title = @title, remark = @remark, flag = @flag, expire = @expire, seqno = @seqno, request = @request, status = @status, okdate = @okdate
                     WHERE idx = @idx AND gcode = @gcode AND uid = @uid";
 
                 var affectedRows = DBM.Execute(sql, new
@@ -223,6 +271,8 @@ namespace Project.Web.Controllers
                     expire = todo.expire,
                     seqno = todo.seqno ?? 0,
                     request = todo.request,
+                    status = todo.status == '\0' ? '0' : todo.status,
+                    okdate = okdateValue,
                     idx = todo.idx,
                     gcode = gcode,
                     uid = uid
diff --git a/Project/Web/Model/TodoModel.cs b/Project/Web/Model/TodoModel.cs
index 094fdbd..8035822 100644
--- a/Project/Web/Model/TodoModel.cs
+++ b/Project/Web/Model/TodoModel.cs
@@ -74,5 +74,11 @@ namespace Project.Web.Model
         /// 자동 셋팅
         /// </summary>
         public DateTime wdate { get; set; } 
+
+        /// <summary>
+        /// 완료일
+        /// 상태를 완료로 변경할 때 자동 설정
+        /// </summary>
+        public DateTime? okdate { get; set; }
     }
 }
diff --git a/Project/Web/wwwroot/DashBoard/index.html b/Project/Web/wwwroot/DashBoard/index.html
index e31dc7e..b2572d1 100644
--- a/Project/Web/wwwroot/DashBoard/index.html
+++ b/Project/Web/wwwroot/DashBoard/index.html
@@ -252,9 +252,17 @@
                             </svg>
                             할일
                         </span>
-                        <button onclick="window.location.href='/Todo'" class="text-xs bg-white/20 hover:bg-white/30 px-3 py-1 rounded-full transition-colors">
-                            전체보기
-                        </button>
+                        <div class="flex items-center space-x-2">
+                            <button onclick="showDashboardAddTodoModal()" class="text-xs bg-primary-500/20 hover:bg-primary-500/30 text-primary-300 hover:text-primary-200 px-3 py-1 rounded-full transition-colors flex items-center">
+                                <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
+                                </svg>
+                                할일추가
+                            </button>
+                            <button onclick="window.location.href='/Todo'" class="text-xs bg-white/20 hover:bg-white/30 px-3 py-1 rounded-full transition-colors">
+                                전체보기
+                            </button>
+                        </div>
                     </h2>
                 </div>
                 <div class="p-4">
@@ -542,14 +550,20 @@
                                 </div>
                             </div>
                             
-                            <!-- 만료일 및 작성일 -->
-                            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                            <!-- 만료일, 완료일 및 작성일 -->
+                            <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
                                 <div>
                                     <label class="block text-white/70 text-sm font-medium mb-2">만료일</label>
                                     <div id="detailExpire" class="bg-white/10 rounded-lg px-4 py-3 text-white min-h-[2.5rem] flex items-center">
                                         -
                                     </div>
                                 </div>
+                                <div>
+                                    <label class="block text-white/70 text-sm font-medium mb-2">완료일</label>
+                                    <div id="detailOkdate" class="bg-white/10 rounded-lg px-4 py-3 text-white min-h-[2.5rem] flex items-center">
+                                        -
+                                    </div>
+                                </div>
                                 <div>
                                     <label class="block text-white/70 text-sm font-medium mb-2">작성일</label>
                                     <div id="detailWdate" class="bg-white/10 rounded-lg px-4 py-3 text-white min-h-[2.5rem] flex items-center">
@@ -572,6 +586,93 @@
                 </div>
             </div>
         </div>
+
+        <!-- 할일 추가 모달 -->
+        <div id="dashboardAddTodoModal" class="fixed inset-0 bg-black/50 backdrop-blur-sm hidden z-50">
+            <div class="flex items-center justify-center min-h-screen p-4">
+                <div class="glass-effect rounded-2xl w-full max-w-2xl animate-slide-up">
+                    <!-- 모달 헤더 -->
+                    <div class="px-6 py-4 border-b border-white/10 flex items-center justify-between">
+                        <h2 class="text-xl font-semibold text-white flex items-center">
+                            <svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
+                            </svg>
+                            새 할일 추가
+                        </h2>
+                        <button onclick="hideDashboardAddTodoModal()" class="text-white/70 hover:text-white transition-colors">
+                            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
+                            </svg>
+                        </button>
+                    </div>
+                    
+                    <!-- 모달 내용 -->
+                    <div class="p-6">
+                        <form id="dashboardTodoForm" class="space-y-4">
+                            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+                                <div>
+                                    <label class="block text-white/70 text-sm font-medium mb-2">제목 (선택사항)</label>
+                                    <input type="text" id="dashboardTodoTitle" class="w-full bg-white/20 backdrop-blur-sm border border-white/30 rounded-lg px-4 py-2 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400 transition-all" placeholder="할일 제목을 입력하세요">
+                                </div>
+                                <div>
+                                    <label class="block text-white/70 text-sm font-medium mb-2">만료일 (선택사항)</label>
+                                    <input type="date" id="dashboardTodoExpire" class="w-full bg-white/20 backdrop-blur-sm border border-white/30 rounded-lg px-4 py-2 text-white focus:outline-none focus:ring-2 focus:ring-primary-400 transition-all">
+                                </div>
+                            </div>
+                            <div>
+                                <label class="block text-white/70 text-sm font-medium mb-2">내용 *</label>
+                                <textarea id="dashboardTodoRemark" rows="3" class="w-full bg-white/20 backdrop-blur-sm border border-white/30 rounded-lg px-4 py-2 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400 transition-all" placeholder="할일 내용을 입력하세요 (필수)" required></textarea>
+                            </div>
+                            <div>
+                                <label class="block text-white/70 text-sm font-medium mb-2">요청자</label>
+                                <input type="text" id="dashboardTodoRequest" class="w-full bg-white/20 backdrop-blur-sm border border-white/30 rounded-lg px-4 py-2 text-white placeholder-white/50 focus:outline-none focus:ring-2 focus:ring-primary-400 transition-all" placeholder="업무 요청자를 입력하세요">
+                            </div>
+                            <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
+                                <div>
+                                    <label class="block text-white/70 text-sm font-medium mb-2">진행상태</label>
+                                    <input type="hidden" id="dashboardTodoStatus" value="0">
+                                    <div class="flex flex-wrap gap-2">
+                                        <button type="button" onclick="setDashboardTodoStatus('0')" id="dashboardStatusBtn0" class="px-3 py-1 rounded-lg text-xs font-medium bg-gray-500/20 text-gray-300 border border-gray-500/30 transition-all">대기</button>
+                                        <button type="button" onclick="setDashboardTodoStatus('1')" id="dashboardStatusBtn1" class="px-3 py-1 rounded-lg text-xs font-medium bg-white/10 text-white/50 border border-white/20 hover:bg-primary-500/20 hover:text-primary-300 transition-all">진행</button>
+                                        <button type="button" onclick="setDashboardTodoStatus('3')" id="dashboardStatusBtn3" class="px-3 py-1 rounded-lg text-xs font-medium bg-white/10 text-white/50 border border-white/20 hover:bg-warning-500/20 hover:text-warning-300 transition-all">보류</button>
+                                        <button type="button" onclick="setDashboardTodoStatus('2')" id="dashboardStatusBtn2" class="px-3 py-1 rounded-lg text-xs font-medium bg-white/10 text-white/50 border border-white/20 hover:bg-danger-500/20 hover:text-danger-300 transition-all">취소</button>
+                                        <button type="button" onclick="setDashboardTodoStatus('5')" id="dashboardStatusBtn5" class="px-3 py-1 rounded-lg text-xs font-medium bg-white/10 text-white/50 border border-white/20 hover:bg-success-500/20 hover:text-success-300 transition-all">완료</button>
+                                    </div>
+                                </div>
+                                <div>
+                                    <label class="block text-white/70 text-sm font-medium mb-2">중요도</label>
+                                    <select id="dashboardTodoSeqno" class="w-full bg-white/20 backdrop-blur-sm border border-white/30 rounded-lg px-4 py-2 text-white focus:outline-none focus:ring-2 focus:ring-primary-400 transition-all">
+                                        <option value="0">보통</option>
+                                        <option value="1">중요</option>
+                                        <option value="2">매우 중요</option>
+                                        <option value="3">긴급</option>
+                                    </select>
+                                </div>
+                                <div class="flex items-end">
+                                    <label class="flex items-center text-white/70 text-sm font-medium">
+                                        <input type="checkbox" id="dashboardTodoFlag" class="mr-2 text-primary-500 focus:ring-primary-400 focus:ring-offset-0 rounded">
+                                        플래그 (상단 고정)
+                                    </label>
+                                </div>
+                            </div>
+                        </form>
+                    </div>
+                    
+                    <!-- 모달 푸터 -->
+                    <div class="px-6 py-4 border-t border-white/10 flex justify-end space-x-3">
+                        <button type="button" onclick="hideDashboardAddTodoModal()" class="bg-white/20 hover:bg-white/30 text-white px-4 py-2 rounded-lg transition-colors">
+                            취소
+                        </button>
+                        <button type="submit" form="dashboardTodoForm" class="bg-primary-500 hover:bg-primary-600 text-white px-6 py-2 rounded-lg transition-colors flex items-center">
+                            <svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
+                            </svg>
+                            추가
+                        </button>
+                    </div>
+                </div>
+            </div>
+        </div>
     </div>
 
     <script>
@@ -938,9 +1039,12 @@
                 const expireText = todo.expire ? new Date(todo.expire).toLocaleDateString('ko-KR') : '';
                 const isExpired = todo.expire && new Date(todo.expire) < new Date();
                 const expireClass = isExpired ? 'text-danger-400' : 'text-white/60';
+                
+                // 만료일이 지난 경우 배경을 적색계통으로 강조
+                const expiredBgClass = isExpired ? 'bg-danger-600/30 border-danger-400/40 hover:bg-danger-600/40' : 'bg-white/10 hover:bg-white/15 border-white/20';
 
                 todoItems += `
-                    <div class="bg-white/10 backdrop-blur-sm rounded-lg p-3 hover:bg-white/15 transition-colors cursor-pointer border border-white/20" onclick="showTodoDetail(${todo.idx})">
+                    <div class="${expiredBgClass} backdrop-blur-sm rounded-lg p-3 transition-colors cursor-pointer border" onclick="showTodoDetail(${todo.idx})">
                         <div class="flex items-start justify-between mb-2">
                             <div class="flex items-center gap-1">
                                 ${flagIcon ? `<span class="text-xs">${flagIcon}</span>` : ''}
@@ -1049,6 +1153,11 @@
         const expireClass = isExpired ? 'text-danger-400' : 'text-white';
         document.getElementById('detailExpire').innerHTML = `<span class="${expireClass}">${expireText}</span>`;
         
+        // 완료일 표시
+        const okdateText = todo.okdate ? new Date(todo.okdate).toLocaleDateString('ko-KR') + ' ' + new Date(todo.okdate).toLocaleTimeString('ko-KR') : '-';
+        const okdateClass = todo.okdate ? 'text-success-400' : 'text-white';
+        document.getElementById('detailOkdate').innerHTML = `<span class="${okdateClass}">${okdateText}</span>`;
+        
         // 작성일 표시
         const wdateText = todo.wdate ? new Date(todo.wdate).toLocaleDateString('ko-KR') + ' ' + new Date(todo.wdate).toLocaleTimeString('ko-KR') : '-';
         document.getElementById('detailWdate').textContent = wdateText;
@@ -1070,6 +1179,88 @@
         alert(message); // 나중에 더 예쁜 toast나 modal로 변경 가능
     }
 
+    // 간단한 성공 표시 함수
+    function showSuccess(message) {
+        alert(message);
+    }
+
+    // 대시보드 할일 추가 모달 표시/숨기기
+    function showDashboardAddTodoModal() {
+        document.getElementById('dashboardAddTodoModal').classList.remove('hidden');
+        // 폼 초기화
+        document.getElementById('dashboardTodoForm').reset();
+        document.getElementById('dashboardTodoStatus').value = '0';
+        setDashboardTodoStatus('0');
+    }
+
+    function hideDashboardAddTodoModal() {
+        document.getElementById('dashboardAddTodoModal').classList.add('hidden');
+    }
+
+    // 대시보드에서 할일 상태 설정
+    function setDashboardTodoStatus(status) {
+        document.getElementById('dashboardTodoStatus').value = status;
+        
+        // 모든 버튼 초기화
+        ['0', '1', '2', '3', '5'].forEach(s => {
+            const btn = document.getElementById(`dashboardStatusBtn${s}`);
+            if (btn) {
+                btn.className = 'px-3 py-1 rounded-lg text-xs font-medium bg-white/10 text-white/50 border border-white/20 hover:bg-white/20 transition-all';
+            }
+        });
+        
+        // 선택된 버튼 활성화
+        const selectedBtn = document.getElementById(`dashboardStatusBtn${status}`);
+        if (selectedBtn) {
+            const statusClass = getTodoStatusClass(status).replace('bg-', 'bg-').replace('text-', 'text-');
+            const borderClass = statusClass.replace('bg-', 'border-').replace('text-', 'border-').replace('/20', '/30');
+            selectedBtn.className = `px-3 py-1 rounded-lg text-xs font-medium ${statusClass} ${borderClass} transition-all`;
+        }
+    }
+
+    // 대시보드에서 할일 추가
+    function addDashboardTodo() {
+        const formData = {
+            title: document.getElementById('dashboardTodoTitle').value,
+            remark: document.getElementById('dashboardTodoRemark').value,
+            expire: document.getElementById('dashboardTodoExpire').value || null,
+            seqno: parseInt(document.getElementById('dashboardTodoSeqno').value),
+            flag: document.getElementById('dashboardTodoFlag').checked,
+            request: document.getElementById('dashboardTodoRequest').value || null,
+            status: document.getElementById('dashboardTodoStatus').value
+        };
+
+        if (!formData.remark.trim()) {
+            showError('할일 내용을 입력해주세요.');
+            return;
+        }
+
+        showLoading();
+        fetch('/Todo/CreateTodo', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(formData)
+        })
+        .then(response => response.json())
+        .then(data => {
+            if (data.Success) {
+                hideDashboardAddTodoModal();
+                updateTodoList(); // 대시보드 할일 목록 새로고침
+                showSuccess(data.Message || '할일이 추가되었습니다.');
+            } else {
+                showError(data.Message || '할일 추가에 실패했습니다.');
+            }
+            hideLoading();
+        })
+        .catch(error => {
+            console.error('할일 추가 중 오류:', error);
+            showError('서버 연결에 실패했습니다.');
+            hideLoading();
+        });
+    }
+
     // Todo 목록 업데이트
     function updateTodoList() {
         showLoading();
@@ -1106,6 +1297,8 @@
                 const isExpired = todo.expire && new Date(todo.expire) < new Date();
                 const expireClass = isExpired ? 'text-danger-400' : 'text-white/60';
 
+                const okdateText = todo.okdate ? new Date(todo.okdate).toLocaleDateString('ko-KR') : '';
+
                 todoItems += `
                     <div class="bg-white/10 rounded-lg p-4 hover:bg-white/15 transition-colors cursor-pointer" onclick="showTodoDetail(${todo.idx})">
                         <div class="flex items-start justify-between mb-2">
@@ -1117,7 +1310,10 @@
                                     ${seqnoText}
                                 </span>
                             </div>
-                            ${expireText ? `<span class="text-xs ${expireClass}">${expireText}</span>` : ''}
+                            <div class="text-xs text-right">
+                                ${expireText ? `<div class="${expireClass}">만료: ${expireText}</div>` : ''}
+                                ${okdateText ? `<div class="text-success-400">완료: ${okdateText}</div>` : ''}
+                            </div>
                         </div>
                         <h4 class="text-white font-medium mb-1">${flagIcon}${todo.title || '제목 없음'}</h4>
                         <p class="text-white/70 text-sm line-clamp-2">${todo.remark || ''}</p>
@@ -1195,6 +1391,19 @@
         updateTodoList();
     }, 30000);
 
+    // 대시보드 할일 추가 폼 이벤트 리스너
+    document.getElementById('dashboardTodoForm').addEventListener('submit', function(e) {
+        e.preventDefault();
+        addDashboardTodo();
+    });
+
+    // 대시보드 할일 추가 모달 외부 클릭으로 닫기
+    document.getElementById('dashboardAddTodoModal').addEventListener('click', function(event) {
+        if (event.target === this) {
+            hideDashboardAddTodoModal();
+        }
+    });
+
     // 공통 네비게이션 초기화
     initNavigation('dashboard');
 
@@ -1272,6 +1481,7 @@
             hidePurchaseNRModal();
             hidePurchaseCRModal();
             hideTodoDetailModal();
+            hideDashboardAddTodoModal();
         }
     });
 
@@ -1307,22 +1517,33 @@
                         const endDate = item.edate ? new Date(item.edate).toLocaleDateString('ko-KR') : '-';
                         const dateRange = startDate !== '-' && endDate !== '-' ? `${startDate} ~ ${endDate}` : '-';
                         
-                        // 요청일 포맷팅
-                        const requestDate = item.holyday ? new Date(item.holyday).toLocaleDateString('ko-KR') : '-';
+                        // 요청일 포맷팅 (holydays 컬럼은 숫자 형태)
+                        const requestDate = item.holydays || '-';
+                        
+                        // 휴가 종류별 색상 구분
+                        let cateColorClass = 'bg-white/20 text-white'; // 기본값 (흰색)
+                        const cateValue = item.cate || '';
+                        if (cateValue === '대체') {
+                            cateColorClass = 'bg-yellow-500/20 text-yellow-300'; // 노란색
+                        } else if (cateValue === '년차') {
+                            cateColorClass = 'bg-green-500/20 text-green-300'; // 녹색
+                        } else if (cateValue === '하기') {
+                            cateColorClass = 'bg-blue-500/20 text-blue-300'; // 파란색
+                        }
                         
                         tableRows += `
                             <tr class="hover:bg-white/5 transition-colors">
                                 <td class="px-6 py-4 whitespace-nowrap text-white">${item.uid || '-'}</td>
                                 <td class="px-6 py-4 whitespace-nowrap text-white">${item.name || '-'}</td>
                                 <td class="px-6 py-4 whitespace-nowrap">
-                                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-primary-500/20 text-primary-300">
+                                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${cateColorClass}">
                                         ${item.cate || '-'}
                                     </span>
                                 </td>
                                 <td class="px-6 py-4 whitespace-nowrap text-white/80">${dateRange}</td>
                                 <td class="px-6 py-4 whitespace-nowrap text-white/80">${requestDate}</td>
-                                <td class="px-6 py-4 whitespace-nowrap text-white/80">${item.holytime || '-'}</td>
-                                <td class="px-6 py-4 text-white/80">${item.remakr || '-'}</td>
+                                <td class="px-6 py-4 whitespace-nowrap text-white/80">${item.holytimes || '-'}</td>
+                                <td class="px-6 py-4 text-white/80">${item.HolyReason || '-'}</td>
                             </tr>
                         `;
                     });
diff --git a/Project/Web/wwwroot/Todo/index.html b/Project/Web/wwwroot/Todo/index.html
index 3e099b4..0071526 100644
--- a/Project/Web/wwwroot/Todo/index.html
+++ b/Project/Web/wwwroot/Todo/index.html
@@ -137,7 +137,33 @@
                     새 할일 추가
                 </button>
             </div>
-            <div class="overflow-x-auto">
+
+            <!-- 탭 메뉴 -->
+            <div class="px-6 py-2 border-b border-white/10">
+                <div class="flex space-x-1 bg-white/5 rounded-lg p-1">
+                    <button id="activeTab" onclick="switchTab('active')" class="flex-1 px-4 py-2 text-sm font-medium rounded-md transition-all duration-200 text-white bg-white/20 shadow-sm">
+                        <div class="flex items-center justify-center space-x-2">
+                            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z"></path>
+                            </svg>
+                            <span>진행중인 할일</span>
+                            <span id="activeCount" class="px-2 py-0.5 text-xs bg-primary-500/30 text-primary-200 rounded-full">0</span>
+                        </div>
+                    </button>
+                    <button id="completedTab" onclick="switchTab('completed')" class="flex-1 px-4 py-2 text-sm font-medium rounded-md transition-all duration-200 text-white/60 hover:text-white hover:bg-white/10">
+                        <div class="flex items-center justify-center space-x-2">
+                            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
+                            </svg>
+                            <span>완료된 할일</span>
+                            <span id="completedCount" class="px-2 py-0.5 text-xs bg-success-500/30 text-success-200 rounded-full">0</span>
+                        </div>
+                    </button>
+                </div>
+            </div>
+
+            <!-- 진행중인 할일 테이블 -->
+            <div id="activeTabContent" class="overflow-x-auto">
                 <table class="w-full">
                     <thead class="bg-white/10">
                         <tr>
@@ -151,8 +177,30 @@
                             <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">작업</th>
                         </tr>
                     </thead>
-                    <tbody id="todoTable" class="divide-y divide-white/10">
-                        <!-- 데이터가 여기에 표시됩니다 -->
+                    <tbody id="activeTable" class="divide-y divide-white/10">
+                        <!-- 진행중인 할일이 여기에 표시됩니다 -->
+                    </tbody>
+                </table>
+            </div>
+
+            <!-- 완료된 할일 테이블 -->
+            <div id="completedTabContent" class="overflow-x-auto hidden">
+                <table class="w-full">
+                    <thead class="bg-white/10">
+                        <tr>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">진행상태</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">플래그</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">제목</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">내용</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">요청자</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">중요도</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">만료일</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">완료일</th>
+                            <th class="px-6 py-4 text-left text-xs font-medium text-white/70 uppercase tracking-wider">작업</th>
+                        </tr>
+                    </thead>
+                    <tbody id="completedTable" class="divide-y divide-white/10">
+                        <!-- 완료된 할일이 여기에 표시됩니다 -->
                     </tbody>
                 </table>
             </div>
@@ -477,63 +525,40 @@
             });
     }
 
-    // 할일 목록 표시
+    // 할일 목록 표시 (탭별로 분리)
     function displayTodos(todos) {
-        const tableBody = document.getElementById('todoTable');
+        if (!todos || todos.length === 0) {
+            displayEmptyTodos();
+            return;
+        }
+
+        // 완료(5)와 진행중(0,1,2,3) 할일 분리
+        const activeTodos = todos.filter(todo => (todo.status || '0') !== '5');
+        const completedTodos = todos.filter(todo => (todo.status || '0') === '5');
+
+        // 각 탭에 표시
+        displayActiveTodos(activeTodos);
+        displayCompletedTodos(completedTodos);
+
+        // 카운트 업데이트
+        document.getElementById('activeCount').textContent = activeTodos.length;
+        document.getElementById('completedCount').textContent = completedTodos.length;
+    }
+
+    // 진행중인 할일 표시
+    function displayActiveTodos(todos) {
+        const tableBody = document.getElementById('activeTable');
         let tableRows = '';
 
         if (todos && todos.length > 0) {
             todos.forEach(todo => {
-                const statusClass = getStatusClass(todo.status);
-                const statusText = getStatusText(todo.status);
-                
-                const flagClass = todo.flag ? 'bg-warning-500/20 text-warning-300' : 'bg-white/10 text-white/50';
-                const flagText = todo.flag ? '고정' : '일반';
-                
-                const seqnoClass = getSeqnoClass(todo.seqno);
-                const seqnoText = getSeqnoText(todo.seqno);
-                
-                const expireText = todo.expire ? new Date(todo.expire).toLocaleDateString('ko-KR') : '-';
-                const isExpired = todo.expire && new Date(todo.expire) < new Date();
-                const expireClass = isExpired ? 'text-danger-400' : 'text-white/80';
-
-                tableRows += `
-                    <tr class="hover:bg-white/5 transition-colors cursor-pointer" onclick="editTodo(${todo.idx})">
-                        <td class="px-6 py-4 whitespace-nowrap">
-                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${statusClass}">
-                                ${statusText}
-                            </span>
-                        </td>
-                        <td class="px-6 py-4 whitespace-nowrap">
-                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${flagClass}">
-                                ${flagText}
-                            </span>
-                        </td>
-                        <td class="px-6 py-4 text-white">${todo.title || '제목 없음'}</td>
-                        <td class="px-6 py-4 text-white/80 max-w-xs truncate">${todo.remark || ''}</td>
-                        <td class="px-6 py-4 text-white/80">${todo.request || '-'}</td>
-                        <td class="px-6 py-4 whitespace-nowrap">
-                            <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${seqnoClass}">
-                                ${seqnoText}
-                            </span>
-                        </td>
-                        <td class="px-6 py-4 whitespace-nowrap ${expireClass}">${expireText}</td>
-                        <td class="px-6 py-4 whitespace-nowrap text-sm" onclick="event.stopPropagation();">
-                            <button onclick="editTodo(${todo.idx})" class="text-primary-400 hover:text-primary-300 mr-3 transition-colors">
-                                수정
-                            </button>
-                            <button onclick="deleteTodo(${todo.idx})" class="text-danger-400 hover:text-danger-300 transition-colors">
-                                삭제
-                            </button>
-                        </td>
-                    </tr>
-                `;
+                tableRows += generateTodoRow(todo, false); // 완료일 컬럼 제외
             });
         } else {
             tableRows = `
                 <tr>
                     <td colspan="8" class="px-6 py-8 text-center text-white/50">
-                        등록된 할일이 없습니다
+                        진행중인 할일이 없습니다
                     </td>
                 </tr>
             `;
@@ -542,6 +567,100 @@
         tableBody.innerHTML = tableRows;
     }
 
+    // 완료된 할일 표시
+    function displayCompletedTodos(todos) {
+        const tableBody = document.getElementById('completedTable');
+        let tableRows = '';
+
+        if (todos && todos.length > 0) {
+            todos.forEach(todo => {
+                tableRows += generateTodoRow(todo, true); // 완료일 컬럼 포함
+            });
+        } else {
+            tableRows = `
+                <tr>
+                    <td colspan="9" class="px-6 py-8 text-center text-white/50">
+                        완료된 할일이 없습니다
+                    </td>
+                </tr>
+            `;
+        }
+
+        tableBody.innerHTML = tableRows;
+    }
+
+    // 할일 행 생성 (공통 함수)
+    function generateTodoRow(todo, includeOkdate = false) {
+        const statusClass = getStatusClass(todo.status);
+        const statusText = getStatusText(todo.status);
+        
+        const flagClass = todo.flag ? 'bg-warning-500/20 text-warning-300' : 'bg-white/10 text-white/50';
+        const flagText = todo.flag ? '고정' : '일반';
+        
+        const seqnoClass = getSeqnoClass(todo.seqno);
+        const seqnoText = getSeqnoText(todo.seqno);
+        
+        const expireText = todo.expire ? new Date(todo.expire).toLocaleDateString('ko-KR') : '-';
+        const isExpired = todo.expire && new Date(todo.expire) < new Date();
+        const expireClass = isExpired ? 'text-danger-400' : 'text-white/80';
+
+        const okdateText = todo.okdate ? new Date(todo.okdate).toLocaleDateString('ko-KR') : '-';
+        const okdateClass = todo.okdate ? 'text-success-400' : 'text-white/80';
+
+        return `
+            <tr class="hover:bg-white/5 transition-colors cursor-pointer" onclick="editTodo(${todo.idx})">
+                <td class="px-6 py-4 whitespace-nowrap">
+                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${statusClass}">
+                        ${statusText}
+                    </span>
+                </td>
+                <td class="px-6 py-4 whitespace-nowrap">
+                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${flagClass}">
+                        ${flagText}
+                    </span>
+                </td>
+                <td class="px-6 py-4 text-white">${todo.title || '제목 없음'}</td>
+                <td class="px-6 py-4 text-white/80 max-w-xs truncate">${todo.remark || ''}</td>
+                <td class="px-6 py-4 text-white/80">${todo.request || '-'}</td>
+                <td class="px-6 py-4 whitespace-nowrap">
+                    <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${seqnoClass}">
+                        ${seqnoText}
+                    </span>
+                </td>
+                <td class="px-6 py-4 whitespace-nowrap ${expireClass}">${expireText}</td>
+                ${includeOkdate ? `<td class="px-6 py-4 whitespace-nowrap ${okdateClass}">${okdateText}</td>` : ''}
+                <td class="px-6 py-4 whitespace-nowrap text-sm" onclick="event.stopPropagation();">
+                    <button onclick="editTodo(${todo.idx})" class="text-primary-400 hover:text-primary-300 mr-3 transition-colors">
+                        수정
+                    </button>
+                    <button onclick="deleteTodo(${todo.idx})" class="text-danger-400 hover:text-danger-300 transition-colors">
+                        삭제
+                    </button>
+                </td>
+            </tr>
+        `;
+    }
+
+    // 빈 할일 목록 표시
+    function displayEmptyTodos() {
+        document.getElementById('activeTable').innerHTML = `
+            <tr>
+                <td colspan="8" class="px-6 py-8 text-center text-white/50">
+                    진행중인 할일이 없습니다
+                </td>
+            </tr>
+        `;
+        document.getElementById('completedTable').innerHTML = `
+            <tr>
+                <td colspan="9" class="px-6 py-8 text-center text-white/50">
+                    완료된 할일이 없습니다
+                </td>
+            </tr>
+        `;
+        document.getElementById('activeCount').textContent = '0';
+        document.getElementById('completedCount').textContent = '0';
+    }
+
     // 중요도 클래스 반환
     function getSeqnoClass(seqno) {
         switch(seqno) {
@@ -645,6 +764,12 @@
                 loadTodos();
                 // 모달 닫기
                 hideEditModal();
+                // 현재 탭 상태 유지
+                setTimeout(() => {
+                    if (typeof maintainCurrentTab === 'function') {
+                        maintainCurrentTab();
+                    }
+                }, 100);
                 showSuccess(`상태가 '${getStatusText(status)}'(으)로 변경되었습니다.`);
             } else {
                 showError(data.Message || '상태 변경에 실패했습니다.');
@@ -712,6 +837,12 @@
             if (data.Success) {
                 hideAddTodoModal();
                 loadTodos();
+                // 현재 탭 상태 유지
+                setTimeout(() => {
+                    if (typeof maintainCurrentTab === 'function') {
+                        maintainCurrentTab();
+                    }
+                }, 100);
                 showSuccess(data.Message || '할일이 추가되었습니다.');
             } else {
                 showError(data.Message || '할일 추가에 실패했습니다.');
@@ -795,6 +926,12 @@
             if (data.Success) {
                 hideEditModal();
                 loadTodos();
+                // 현재 탭 상태 유지
+                setTimeout(() => {
+                    if (typeof maintainCurrentTab === 'function') {
+                        maintainCurrentTab();
+                    }
+                }, 100);
                 showSuccess(data.Message || '할일이 수정되었습니다.');
             } else {
                 showError(data.Message || '할일 수정에 실패했습니다.');
@@ -822,6 +959,12 @@
         .then(data => {
             if (data.Success) {
                 loadTodos();
+                // 현재 탭 상태 유지
+                setTimeout(() => {
+                    if (typeof maintainCurrentTab === 'function') {
+                        maintainCurrentTab();
+                    }
+                }, 100);
                 showSuccess(data.Message || '할일이 삭제되었습니다.');
             } else {
                 showError(data.Message || '할일 삭제에 실패했습니다.');
@@ -901,10 +1044,41 @@
         }
     });
 
+    // 탭 전환 기능
+    let currentTab = 'active';
+
+    function switchTab(tabName) {
+        // 이전 탭 버튼 스타일 제거
+        document.getElementById('activeTab').className = 'flex-1 px-4 py-2 text-sm font-medium rounded-md transition-all duration-200 text-white/60 hover:text-white hover:bg-white/10';
+        document.getElementById('completedTab').className = 'flex-1 px-4 py-2 text-sm font-medium rounded-md transition-all duration-200 text-white/60 hover:text-white hover:bg-white/10';
+        
+        // 이전 탭 컨텐츠 숨기기
+        document.getElementById('activeTabContent').classList.add('hidden');
+        document.getElementById('completedTabContent').classList.add('hidden');
+        
+        // 선택된 탭 버튼 활성화
+        if (tabName === 'active') {
+            document.getElementById('activeTab').className = 'flex-1 px-4 py-2 text-sm font-medium rounded-md transition-all duration-200 text-white bg-white/20 shadow-sm';
+            document.getElementById('activeTabContent').classList.remove('hidden');
+        } else {
+            document.getElementById('completedTab').className = 'flex-1 px-4 py-2 text-sm font-medium rounded-md transition-all duration-200 text-white bg-white/20 shadow-sm';
+            document.getElementById('completedTabContent').classList.remove('hidden');
+        }
+        
+        currentTab = tabName;
+    }
+
+    // 할일 상태 변경 후 현재 탭 유지
+    function maintainCurrentTab() {
+        switchTab(currentTab);
+    }
+
+
     // 페이지 초기화
     document.addEventListener('DOMContentLoaded', function() {
         initNavigation('todo');
         loadTodos();
+        switchTab('active'); // 기본적으로 진행중 탭 선택
     });
     </script>
 </body>