diff --git a/frontend/src/pages/relay/TaskDetailPage.vue b/frontend/src/pages/relay/TaskDetailPage.vue
index 6793b24..2e65cf3 100644
--- a/frontend/src/pages/relay/TaskDetailPage.vue
+++ b/frontend/src/pages/relay/TaskDetailPage.vue
@@ -25,6 +25,7 @@ import {
 import type { ChecklistReviewItem } from '@/types/task'
 import { useTaskStore } from '@/stores/task.store'
 import { useAuthStore } from '@/stores/auth.store'
+import { useDialog } from '@/composables/useDialog'
 import UserAvatar from '@/components/UserAvatar.vue'
 import { attachmentKindOf, fileBadge } from '@/shared/utils/format'
 
@@ -35,6 +36,7 @@ const taskId = computed(() => Number(route.params.taskId))
 
 const taskStore = useTaskStore()
 const authStore = useAuthStore()
+const dialog = useDialog()
 
 // 업무 상세 — API 연동
 const task = ref<TaskDetail | null>(null)
@@ -115,19 +117,22 @@ const ActivityIcon = defineComponent({
  * 더보기 메뉴 / 모달
  * ============================================================ */
 const moreOpen = ref(false)
-const showDelete = ref(false)
 const showChanges = ref(false)
 
 function closeAllOverlays() {
-  showDelete.value = false
   showChanges.value = false
   moreOpen.value = false
 }
 
-// 모달에서 삭제 확정 → DELETE 후 프로젝트 상세로 이동
-async function confirmDelete() {
+// 삭제 — 공통 확인 다이얼로그로 확인받고 DELETE 후 프로젝트 상세로 이동
+async function askDelete() {
+  moreOpen.value = false
   if (!task.value) return
-  showDelete.value = false
+  const ok = await dialog.confirm(
+    `#${task.value.id} ${task.value.title} 업무와 체크리스트·댓글·첨부파일이 영구적으로 삭제됩니다. 이 작업은 되돌릴 수 없습니다.`,
+    { title: '업무를 삭제할까요?', variant: 'danger', confirmText: '삭제' },
+  )
+  if (!ok) return
   try {
     await taskStore.remove(projectId.value, task.value.id)
     router.push(`/projects/${projectId.value}`)
@@ -526,7 +531,7 @@ function badgeFor(name: string | undefined): { label: string; cls: string } {
               <button
                 class="menu-item danger"
                 type="button"
-                @click="showDelete = true; moreOpen = false"
+                @click="askDelete"
               >
                 <svg
                   viewBox="0 0 24 24"
@@ -1236,54 +1241,6 @@ function badgeFor(name: string | undefined): { label: string; cls: string } {
 
     <!-- ===== 모달 ===== -->
     <Teleport to="body">
-      <!-- 삭제 -->
-      <div
-        class="modal-backdrop"
-        :class="{ open: showDelete }"
-        @click.self="showDelete = false"
-      >
-        <div
-          class="modal"
-          role="dialog"
-          aria-modal="true"
-        >
-          <div class="modal-body">
-            <div class="modal-ico">
-              <svg
-                viewBox="0 0 24 24"
-                fill="none"
-                stroke="currentColor"
-                stroke-width="2"
-                stroke-linecap="round"
-                stroke-linejoin="round"
-              ><path d="M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6" /><path d="M10 11v6M14 11v6" /></svg>
-            </div>
-            <h2 class="modal-title">
-              업무를 삭제할까요?
-            </h2>
-            <p class="modal-desc">
-              <b>#{{ task?.id }} {{ task?.title }}</b> 업무와 체크리스트·댓글·첨부파일이 영구적으로 삭제됩니다. 이 작업은 되돌릴 수 없습니다.
-            </p>
-          </div>
-          <div class="modal-foot">
-            <button
-              class="mbtn"
-              type="button"
-              @click="showDelete = false"
-            >
-              취소
-            </button>
-            <button
-              class="mbtn danger"
-              type="button"
-              @click="confirmDelete"
-            >
-              삭제
-            </button>
-          </div>
-        </div>
-      </div>
-
       <!-- 할 일 완료 검토(수정 요청 / 승인) -->
       <div
         class="modal-backdrop"