diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.ts
index 615445f4..11d5b16f 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.ts
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/components/left-sidenav/message.component.ts
@@ -20,7 +20,10 @@ import {
   AlertDialogResult,
   AlertDialogData
 } from '@ucap-webmessenger/ui';
-import { LoginResponse } from '@ucap-webmessenger/protocol-authentication';
+import {
+  LoginResponse,
+  RoleCode
+} from '@ucap-webmessenger/protocol-authentication';
 import { KEY_LOGIN_RES_INFO } from '@app/types/login-res-info.type';
 import {
   MessageApiService,
@@ -51,6 +54,13 @@ import {
 import * as AppStore from '@app/store';
 import * as MessageStore from '@app/store/messenger/message';
 import { TranslateService } from '@ngx-translate/core';
+import {
+  MessageWriteDialogComponent,
+  MessageWriteDialogResult,
+  MessageWriteDialogData
+} from '../../dialogs/message/message-write.dialog.component';
+import { UserInfo } from '@ucap-webmessenger/protocol-sync';
+import { EmployeeType } from '@ucap-webmessenger/protocol-room';
 
 export interface MessageTypeData {
   displayName: string;
@@ -172,6 +182,7 @@ export class MessageBoxComponent
             MessageDetailDialogResult
           >(MessageDetailDialogComponent, {
             width: '600px',
+            hasBackdrop: false,
             data: {
               detail: info,
               loginRes: this.loginRes,
@@ -192,6 +203,10 @@ export class MessageBoxComponent
                 // 단건 발송취소(예약)
                 this.doMessageCancelReservation(result.messageInfo);
                 break;
+              case 'REPLY':
+                // 답장
+                this.doMessageReply(result.messageInfo);
+                break;
               case 'UPDATE':
                 // 예약 수정
                 this.getRetrieveMessage(MessageType.Reservation, 0);
@@ -367,6 +382,24 @@ export class MessageBoxComponent
     );
   }
 
+  doMessageReply(messageInfo: MessageDetailInfo): void {
+    this.dialogService.open<
+      MessageWriteDialogComponent,
+      MessageWriteDialogData,
+      MessageWriteDialogResult
+    >(MessageWriteDialogComponent, {
+      width: '600px',
+      height: '600px',
+      disableClose: true,
+      hasBackdrop: false,
+      data: {
+        loginRes: this.loginRes,
+        environmentsInfo: this.environmentsInfo,
+        receiverList: [this.convertDetailReceivertoUserInfo(messageInfo)]
+      }
+    });
+  }
+
   private setMessageTypeData() {
     const messageTypeData = this.translateService.instant('message.type');
 
@@ -394,4 +427,40 @@ export class MessageBoxComponent
 
     this.messageTypeList = messageTypeList;
   }
+
+  private convertDetailReceivertoUserInfo(base: MessageDetailInfo): UserInfo {
+    return {
+      seq: base.sendUserSeq,
+      name: base.sendUserName,
+      profileImageFile: '',
+      grade: '',
+      intro: '',
+      companyCode: '',
+      hpNumber: '',
+      lineNumber: '',
+      email: '',
+      isMobile: false,
+      deptName: '',
+      isFavorit: false,
+      isBuddy: false,
+      isActive: false,
+      roleCd: RoleCode.Self,
+      employeeNum: '',
+      madn: '',
+      hardSadn: '',
+      fmcSadn: '',
+      nameEn: '',
+      nameCn: '',
+      gradeEn: '',
+      gradeCn: '',
+      deptNameEn: '',
+      deptNameCn: '',
+      isPrivacyAgree: false,
+      isValidLogin: false,
+      employeeType: EmployeeType.Regular,
+      nickName: '',
+
+      order: ''
+    };
+  }
 }
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
index 65cb4915..9c0121a0 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html
@@ -1,5 +1,5 @@
 <mat-card class="confirm-card mat-elevation-z">
-  <mat-card-header>
+  <mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-card-title>
       <ng-container [ngSwitch]="messageInfo.type">
         <span *ngSwitchCase="MessageType.Receive">{{
@@ -249,11 +249,14 @@
       </mat-drawer>
     </mat-drawer-container>
   </mat-card-content>
-  <!-- <mat-card-actions class="button-farm flex-row">
+  <mat-card-actions class="button-farm flex-row">
     <button mat-stroked-button (click)="onClickConfirm()" class="mat-primary">
-      Confirm
+      {{ 'common.messages.confirm' | translate }}
     </button>
-  </mat-card-actions> -->
+    <button mat-flat-button (click)="onClickReply()" class="mat-primary">
+      {{ 'message.sendReply' | translate }}
+    </button>
+  </mat-card-actions>
 </mat-card>
 
 <mat-menu #messageMenu="matMenu" xPosition="after" yPosition="below">
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.ts b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.ts
index 6ffb3c7d..b27766a5 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.ts
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.ts
@@ -655,4 +655,11 @@ export class MessageDetailDialogComponent implements OnInit {
       returnType: 'CLOSE'
     });
   }
+
+  onClickReply(): void {
+    this.dialogRef.close({
+      returnType: 'REPLY',
+      messageInfo: this.messageInfo
+    });
+  }
 }
diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-write.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-write.dialog.component.html
index 2618a662..9192de70 100644
--- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-write.dialog.component.html
+++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-write.dialog.component.html
@@ -1,5 +1,5 @@
 <mat-card class="confirm-card mat-elevation-z">
-  <mat-card-header>
+  <mat-card-header cdkDrag cdkDragRootElement=".cdk-overlay-pane" cdkDragHandle>
     <mat-card-title>
       {{ (isModify ? 'message.modify' : 'message.sendTo') | translate }}
     </mat-card-title>
diff --git a/projects/ucap-webmessenger-app/src/assets/i18n/en.json b/projects/ucap-webmessenger-app/src/assets/i18n/en.json
index 476cf86f..a66e1fc9 100644
--- a/projects/ucap-webmessenger-app/src/assets/i18n/en.json
+++ b/projects/ucap-webmessenger-app/src/assets/i18n/en.json
@@ -295,6 +295,7 @@
     "modify": "Modify message",
     "sendTo": "Send message",
     "sendReservation": "Send reservation",
+    "sendReply": "Send reply",
     "placeholderForSearch": "search for name, title, content",
     "searchTypeName": "Name",
     "searchTypeTitle": "Title",
diff --git a/projects/ucap-webmessenger-app/src/assets/i18n/ko.json b/projects/ucap-webmessenger-app/src/assets/i18n/ko.json
index 0fd8399b..2acce2d4 100644
--- a/projects/ucap-webmessenger-app/src/assets/i18n/ko.json
+++ b/projects/ucap-webmessenger-app/src/assets/i18n/ko.json
@@ -295,6 +295,7 @@
     "modify": "쪽지 수정",
     "sendTo": "쪽지 보내기",
     "sendReservation": "쪽지 예약 보내기",
+    "sendReply": "답장",
     "placeholderForSearch": "이름, 제목, 내용 검색",
     "searchTypeName": "이름",
     "searchTypeTitle": "제목",