diff --git a/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx b/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx
index cbd541ad6..888fb8c19 100644
--- a/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx
+++ b/frontend/src/components/MyPage/MyPagePostButton/MyPagePostButton.tsx
@@ -6,16 +6,18 @@ import { usePageRouter } from '@/hooks/usePageRouter';
 import useViewport from '@/hooks/useViewport';
 
 import { ReviewStatus } from '@/types/runnerPost';
-import React, { useContext, useMemo } from 'react';
+import React, { useContext } from 'react';
+import styled from 'styled-components';
 
 interface Props {
   runnerPostId: number;
   reviewStatus: ReviewStatus;
   isRunner: boolean;
   supporterId?: number;
+  handleDeletePost: (handleDeletePost: number) => void;
 }
 
-const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId }: Props) => {
+const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId, handleDeletePost }: Props) => {
   const { goToSupportSelectPage, goToSupporterFeedbackPage } = usePageRouter();
 
   const { isMobile } = useViewport();
@@ -27,14 +29,15 @@ const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId }:
     patchRequestWithAuth(`/posts/runner/${runnerPostId}/cancelation`, async (response) => {
       showCompletionToast(TOAST_COMPLETION_MESSAGE.REVIEW_CANCEL);
 
-      setTimeout(window.location.reload, 2000);
+      handleDeletePost(runnerPostId);
     });
   };
 
   const finishReview = () => {
     patchRequestWithAuth(`/posts/runner/${runnerPostId}/done`, async (response) => {
       showCompletionToast(TOAST_COMPLETION_MESSAGE.REVIEW_COMPLETE);
-      setTimeout(window.location.reload, 2000);
+
+      handleDeletePost(runnerPostId);
     });
   };
 
@@ -68,42 +71,48 @@ const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId }:
   switch (reviewStatus) {
     case 'NOT_STARTED':
       return (
-        <Button
-          fontSize={isMobile ? '14px' : ''}
-          colorTheme="WHITE"
-          fontWeight={700}
-          width={isMobile ? '100%' : '180px'}
-          height="40px"
-          onClick={isRunner ? handleClickSupportSelectButton : handleClickCancelReviewButton}
-        >
-          {isRunner ? '서포터 선택하기' : '리뷰 제안 취소'}
-        </Button>
+        <S.PostButtonWrapper>
+          <Button
+            fontSize={isMobile ? '14px' : ''}
+            colorTheme="WHITE"
+            fontWeight={700}
+            width={isMobile ? '100%' : '180px'}
+            height="40px"
+            onClick={isRunner ? handleClickSupportSelectButton : handleClickCancelReviewButton}
+          >
+            {isRunner ? '서포터 선택하기' : '리뷰 제안 취소'}
+          </Button>
+        </S.PostButtonWrapper>
       );
     case 'IN_PROGRESS':
       return isRunner ? null : (
-        <Button
-          colorTheme="WHITE"
-          fontWeight={700}
-          fontSize={isMobile ? '14px' : ''}
-          width={isMobile ? '100%' : '180px'}
-          height="40px"
-          onClick={handleClickFinishButton}
-        >
-          리뷰 완료
-        </Button>
+        <S.PostButtonWrapper>
+          <Button
+            colorTheme="WHITE"
+            fontWeight={700}
+            fontSize={isMobile ? '14px' : ''}
+            width={isMobile ? '100%' : '180px'}
+            height="40px"
+            onClick={handleClickFinishButton}
+          >
+            리뷰 완료
+          </Button>
+        </S.PostButtonWrapper>
       );
     case 'DONE':
       return isRunner ? (
-        <Button
-          colorTheme="WHITE"
-          fontWeight={700}
-          fontSize={isMobile ? '14px' : ''}
-          width={isMobile ? '100%' : '180px'}
-          height="40px"
-          onClick={handleClickSupportFeedbackButton}
-        >
-          후기 작성
-        </Button>
+        <S.PostButtonWrapper>
+          <Button
+            colorTheme="WHITE"
+            fontWeight={700}
+            fontSize={isMobile ? '14px' : ''}
+            width={isMobile ? '100%' : '180px'}
+            height="40px"
+            onClick={handleClickSupportFeedbackButton}
+          >
+            후기 작성
+          </Button>
+        </S.PostButtonWrapper>
       ) : null;
     default:
       return null;
@@ -111,3 +120,14 @@ const MyPagePostButton = ({ runnerPostId, reviewStatus, isRunner, supporterId }:
 };
 
 export default MyPagePostButton;
+
+const S = {
+  PostButtonWrapper: styled.div`
+    width: 180px;
+
+    @media (max-width: 768px) {
+      width: 100%;
+      margin-top: 18px;
+    }
+  `,
+};
diff --git a/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx b/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx
index 95eaba401..6f64ab660 100644
--- a/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx
+++ b/frontend/src/components/MyPage/MyPagePostItem/MyPagePostItem.tsx
@@ -11,6 +11,7 @@ import useViewport from '@/hooks/useViewport';
 
 interface Props extends MyPagePost {
   isRunner: boolean;
+  handleDeletePost: (handleDeletePost: number) => void;
 }
 
 const MyPagePostItem = ({
@@ -23,6 +24,7 @@ const MyPagePostItem = ({
   applicantCount,
   isRunner,
   supporterId,
+  handleDeletePost,
 }: Props) => {
   const { goToRunnerPostPage } = usePageRouter();
 
@@ -34,73 +36,41 @@ const MyPagePostItem = ({
 
   return (
     <S.RunnerPostItemContainer onClick={handlePostClick}>
-      {isMobile && (
-        <>
-          <S.PostTitle>{title}</S.PostTitle>
-          <S.DeadLineContainer>
-            <S.DeadLine>{deadline.replace('T', ' ')} 까지</S.DeadLine>
-            <Label
-              colorTheme={reviewStatus === 'NOT_STARTED' ? 'WHITE' : reviewStatus === 'IN_PROGRESS' ? 'RED' : 'GRAY'}
-              fontSize={isMobile ? '10px' : ''}
-            >
-              {REVIEW_STATUS_LABEL_TEXT[reviewStatus]}
-            </Label>
-          </S.DeadLineContainer>
-        </>
-      )}
       <S.SideContainer>
-        <S.LeftSideContainer>
-          {!isMobile && (
-            <>
-              <S.PostTitle>{title}</S.PostTitle>
-              <S.DeadLineContainer>
-                <S.DeadLine>{deadline.replace('T', ' ')} 까지</S.DeadLine>
-                <Label
-                  colorTheme={
-                    reviewStatus === 'NOT_STARTED' ? 'WHITE' : reviewStatus === 'IN_PROGRESS' ? 'RED' : 'GRAY'
-                  }
-                  fontSize={isMobile ? '10px' : ''}
-                >
-                  {REVIEW_STATUS_LABEL_TEXT[reviewStatus]}
-                </Label>
-              </S.DeadLineContainer>
-            </>
-          )}
-          <S.TagContainer>
-            {tags.map((tag, index) => (
-              <S.Tag key={index}>#{tag}</S.Tag>
-            ))}
-          </S.TagContainer>
-        </S.LeftSideContainer>
-        <S.RightSideContainer>
-          <S.ChatViewContainer>
-            <S.statisticsContainer>
-              <S.statisticsImage src={eyeIcon} />
-              <S.statisticsText>{watchedCount}</S.statisticsText>
-              <S.statisticsImage src={applicantIcon} />
-              <S.statisticsText>{applicantCount}</S.statisticsText>
-            </S.statisticsContainer>
-          </S.ChatViewContainer>
-          {!isMobile && (
-            <S.PostButtonWrapper>
-              <MyPagePostButton
-                runnerPostId={runnerPostId}
-                isRunner={isRunner}
-                reviewStatus={reviewStatus}
-                supporterId={supporterId}
-              />
-            </S.PostButtonWrapper>
-          )}
-        </S.RightSideContainer>
+        <S.PostTitle>{title}</S.PostTitle>
+        <S.statisticsContainer>
+          <S.statisticsImage src={eyeIcon} />
+          <S.statisticsText>{watchedCount}</S.statisticsText>
+          <S.statisticsImage src={applicantIcon} />
+          <S.statisticsText>{applicantCount}</S.statisticsText>
+        </S.statisticsContainer>
       </S.SideContainer>
-      {isMobile && (
+      <S.DeadLineContainer>
+        <S.DeadLine>{deadline.replace('T', ' ')} 까지</S.DeadLine>
+        <Label
+          height={isMobile ? '18px' : '22px'}
+          colorTheme={reviewStatus === 'NOT_STARTED' ? 'WHITE' : reviewStatus === 'IN_PROGRESS' ? 'RED' : 'GRAY'}
+          fontSize={isMobile ? '10px' : ''}
+        >
+          {REVIEW_STATUS_LABEL_TEXT[reviewStatus]}
+        </Label>
+      </S.DeadLineContainer>
+
+      <S.BottomContainer>
+        <S.TagContainer>
+          {tags.map((tag, index) => (
+            <S.Tag key={index}>#{tag}</S.Tag>
+          ))}
+        </S.TagContainer>
+
         <MyPagePostButton
+          handleDeletePost={handleDeletePost}
           runnerPostId={runnerPostId}
           isRunner={isRunner}
           reviewStatus={reviewStatus}
           supporterId={supporterId}
         />
-      )}
+      </S.BottomContainer>
     </S.RunnerPostItemContainer>
   );
 };
@@ -138,6 +108,9 @@ const S = {
   SideContainer: styled.div`
     display: flex;
     justify-content: space-between;
+    align-items: end;
+
+    gap: 12px;
   `,
 
   PostTitle: styled.p`
@@ -160,7 +133,7 @@ const S = {
   `,
 
   DeadLine: styled.p`
-    margin-bottom: 60px;
+    margin-bottom: 40px;
 
     color: var(--gray-600);
 
@@ -171,43 +144,28 @@ const S = {
     }
   `,
 
-  TagContainer: styled.div`
-    & span {
-      margin-right: 10px;
-
-      font-size: 14px;
-      color: var(--gray-600);
-    }
-  `,
-  Tag: styled.span``,
+  TagContainer: styled.div``,
 
-  LeftSideContainer: styled.div``,
+  Tag: styled.span`
+    margin-right: 10px;
 
-  RightSideContainer: styled.div`
-    display: flex;
-    flex-direction: column;
-    justify-content: end;
-    gap: 15px;
+    font-size: 14px;
+    color: var(--gray-600);
 
-    & button:hover {
-      transition: all 0.3s ease;
-      background-color: var(--baton-red);
-      color: var(--white-color);
+    @media (max-width: 768px) {
+      font-size: 14px;
     }
   `,
 
-  PostButtonWrapper: styled.div`
-    padding-left: auto;
-    width: 140px;
-  `,
-
-  ChatViewContainer: styled.div`
+  BottomContainer: styled.div`
     display: flex;
-    justify-content: end;
-
-    gap: 10px;
+    justify-content: space-between;
+    align-items: end;
 
-    font-size: 12px;
+    @media (max-width: 768px) {
+      flex-direction: column;
+      align-items: start;
+    }
   `,
 
   statisticsContainer: styled.div`
@@ -226,9 +184,18 @@ const S = {
     width: 20px;
 
     margin-left: 8px;
+
+    @media (max-width: 768px) {
+      width: 15px;
+      margin-left: 4px;
+    }
   `,
 
   statisticsText: styled.p`
     font-size: 14px;
+
+    @media (max-width: 768px) {
+      font-size: 12px;
+    }
   `,
 };
diff --git a/frontend/src/components/MyPage/MyPagePostList/MyPagePostList.tsx b/frontend/src/components/MyPage/MyPagePostList/MyPagePostList.tsx
index 50466005f..d0a2cf687 100644
--- a/frontend/src/components/MyPage/MyPagePostList/MyPagePostList.tsx
+++ b/frontend/src/components/MyPage/MyPagePostList/MyPagePostList.tsx
@@ -6,15 +6,16 @@ import MyPagePostItem from '../MyPagePostItem/MyPagePostItem';
 interface Props {
   filteredPostList: MyPagePost[];
   isRunner: boolean;
+  handleDeletePost: (handleDeletePost: number) => void;
 }
 
-const MyPagePostList = ({ filteredPostList, isRunner }: Props) => {
+const MyPagePostList = ({ filteredPostList, isRunner, handleDeletePost }: Props) => {
   if (filteredPostList?.length === 0) return <p>게시글 정보가 없습니다.</p>;
 
   return (
     <S.RunnerPostWrapper>
       {filteredPostList?.map((item: MyPagePost) => (
-        <MyPagePostItem key={item.runnerPostId} {...item} isRunner={isRunner} />
+        <MyPagePostItem handleDeletePost={handleDeletePost} key={item.runnerPostId} {...item} isRunner={isRunner} />
       ))}
     </S.RunnerPostWrapper>
   );
diff --git a/frontend/src/components/RunnerPost/RunnerPostItem/RunnerPostItem.tsx b/frontend/src/components/RunnerPost/RunnerPostItem/RunnerPostItem.tsx
index 74d698d63..bbf15c434 100644
--- a/frontend/src/components/RunnerPost/RunnerPostItem/RunnerPostItem.tsx
+++ b/frontend/src/components/RunnerPost/RunnerPostItem/RunnerPostItem.tsx
@@ -29,6 +29,7 @@ const RunnerPostItem = ({
         <S.DeadLineContainer>
           <S.DeadLine>{deadline.replace('T', ' ')} 까지</S.DeadLine>
           <Label
+            height={isMobile ? '18px' : '22px'}
             colorTheme={reviewStatus === 'NOT_STARTED' ? 'WHITE' : reviewStatus === 'IN_PROGRESS' ? 'RED' : 'GRAY'}
             fontSize={isMobile ? '10px' : ''}
           >
diff --git a/frontend/src/components/common/Label/Label.tsx b/frontend/src/components/common/Label/Label.tsx
index 733b1cf46..1dee52747 100644
--- a/frontend/src/components/common/Label/Label.tsx
+++ b/frontend/src/components/common/Label/Label.tsx
@@ -46,7 +46,7 @@ const S = {
     font-weight: ${({ $fontWeight }) => $fontWeight || '400'};
 
     @media (max-width: 768px) {
-      padding: 5px 7px;
+      padding: 4px 6px;
 
       font-size: ${({ $fontSize }) => $fontSize};
     }
diff --git a/frontend/src/mocks/data/myPagePost/done.json b/frontend/src/mocks/data/myPagePost/done.json
deleted file mode 100644
index 3c68a6268..000000000
--- a/frontend/src/mocks/data/myPagePost/done.json
+++ /dev/null
@@ -1,23 +0,0 @@
-{
-  "data": [
-    {
-      "runnerPostId": 1,
-      "title": "끝난 리뷰입니다.",
-      "deadline": "마감기한",
-      "tags": ["java", "JAVA"],
-      "reviewStatus": "DONE",
-      "applicantCount": 4,
-      "watchedCount": 125,
-      "supporterId": 1
-    }
-  ],
-  "pageInfo": {
-    "isFirst": true,
-    "isLast": false,
-    "hasNext": true,
-    "totalPages": 4,
-    "totalElements": 48,
-    "currentPage": 1,
-    "currentSize": 12
-  }
-}
diff --git a/frontend/src/mocks/data/myPagePost/inProgress.json b/frontend/src/mocks/data/myPagePost/inProgress.json
deleted file mode 100644
index 7258eb9bc..000000000
--- a/frontend/src/mocks/data/myPagePost/inProgress.json
+++ /dev/null
@@ -1,51 +0,0 @@
-{
-  "data": [
-    {
-      "runnerPostId": 1,
-      "title": "진행중인 리뷰",
-      "deadline": "마감기한",
-      "tags": ["java", "JAVA"],
-      "reviewStatus": "IN_PROGRESS",
-      "applicantCount": 4,
-      "watchedCount": 125,
-      "supporterId": 1
-    },
-    {
-      "runnerPostId": 2,
-      "title": "진행중인 리뷰",
-      "deadline": "마감기한2",
-      "tags": ["java", "자바"],
-      "reviewStatus": "IN_PROGRESS",
-      "applicantCount": 4,
-      "watchedCount": 125
-    },
-    {
-      "runnerPostId": 3,
-      "title": "진행중인 리뷰2",
-      "deadline": "마감기한3",
-      "tags": ["java", "자바"],
-      "reviewStatus": "IN_PROGRESS",
-      "applicantCount": 4,
-      "watchedCount": 125
-    },
-    {
-      "runnerPostId": 4,
-      "title": "진행중인 리뷰4",
-      "deadline": "마감기한3",
-      "tags": ["java", "자바"],
-      "reviewStatus": "IN_PROGRESS",
-      "applicantCount": 4,
-      "watchedCount": 125,
-      "supporterId": 2
-    }
-  ],
-  "pageInfo": {
-    "isFirst": true,
-    "isLast": false,
-    "hasNext": true,
-    "totalPages": 4,
-    "totalElements": 48,
-    "currentPage": 1,
-    "currentSize": 12
-  }
-}
diff --git a/frontend/src/mocks/data/myPagePost/myPagePostList.json b/frontend/src/mocks/data/myPagePost/myPagePostList.json
new file mode 100644
index 000000000..93039c49b
--- /dev/null
+++ b/frontend/src/mocks/data/myPagePost/myPagePostList.json
@@ -0,0 +1,104 @@
+{
+  "data": [
+    {
+      "runnerPostId": 11,
+      "title": "글자글자글자글자글자글자글자글자글자글자글자글자글자글자글자",
+      "deadline": "2020-10-13T11:30",
+      "tags": ["java", "JAVA"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 4,
+      "watchedCount": 125,
+      "supporterId": 1
+    },
+    {
+      "runnerPostId": 22,
+      "title": "시작안한 리뷰2",
+      "deadline": "마감기한2",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 4,
+      "watchedCount": 125
+    },
+    {
+      "runnerPostId": 34,
+      "title": "시작안한 리뷰3",
+      "deadline": "마감기한3",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 4,
+      "watchedCount": 125
+    },
+    {
+      "runnerPostId": 45,
+      "title": "시작안한 리뷰3",
+      "deadline": "마감기한3",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 4,
+      "watchedCount": 125
+    },
+    {
+      "runnerPostId": 56,
+      "title": "시작안한 리뷰3",
+      "deadline": "마감기한3",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 4,
+      "watchedCount": 125
+    },
+    {
+      "runnerPostId": 67,
+      "title": "시작안한 리뷰3",
+      "deadline": "마감기한3",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 4,
+      "watchedCount": 125
+    },
+    {
+      "runnerPostId": 488,
+      "title": "테스트 리뷰1",
+      "deadline": "2023-10-01T12:00",
+      "tags": ["java", "JAVA"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 2,
+      "watchedCount": 50
+    },
+    {
+      "runnerPostId": 568,
+      "title": "테스트 리뷰2",
+      "deadline": "2023-10-02T13:00",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 3,
+      "watchedCount": 60
+    },
+    {
+      "runnerPostId": 6,
+      "title": "테스트 리뷰3",
+      "deadline": "2023-10-03T14:00",
+      "tags": ["java", "자바"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 5,
+      "watchedCount": 70
+    },
+    {
+      "runnerPostId": 7,
+      "title": "테스트 리뷰4",
+      "deadline": "2023-10-04T15:00",
+      "tags": ["java", "JAVA"],
+      "reviewStatus": "NOT_STARTED",
+      "applicantCount": 6,
+      "watchedCount": 80
+    }
+  ],
+  "pageInfo": {
+    "isFirst": true,
+    "isLast": false,
+    "hasNext": true,
+    "totalPages": 4,
+    "totalElements": 40,
+    "currentPage": 1,
+    "currentSize": 12
+  }
+}
diff --git a/frontend/src/mocks/data/myPagePost/notStarted.json b/frontend/src/mocks/data/myPagePost/notStarted.json
deleted file mode 100644
index c235775aa..000000000
--- a/frontend/src/mocks/data/myPagePost/notStarted.json
+++ /dev/null
@@ -1,41 +0,0 @@
-{
-  "data": [
-    {
-      "runnerPostId": 1,
-      "title": "글자글자글자글자글자글자글자글자글자글자글자글자글자글자글자",
-      "deadline": "2020-10=13T11:30",
-      "tags": ["java", "JAVA"],
-      "reviewStatus": "NOT_STARTED",
-      "applicantCount": 4,
-      "watchedCount": 125,
-      "supporterId": 1
-    },
-    {
-      "runnerPostId": 2,
-      "title": "시작안한 리뷰2",
-      "deadline": "마감기한2",
-      "tags": ["java", "자바"],
-      "reviewStatus": "NOT_STARTED",
-      "applicantCount": 4,
-      "watchedCount": 125
-    },
-    {
-      "runnerPostId": 3,
-      "title": "시작안한 리뷰3",
-      "deadline": "마감기한3",
-      "tags": ["java", "자바"],
-      "reviewStatus": "NOT_STARTED",
-      "applicantCount": 4,
-      "watchedCount": 125
-    }
-  ],
-  "pageInfo": {
-    "isFirst": true,
-    "isLast": false,
-    "hasNext": true,
-    "totalPages": 4,
-    "totalElements": 48,
-    "currentPage": 1,
-    "currentSize": 12
-  }
-}
diff --git a/frontend/src/mocks/handlers.ts b/frontend/src/mocks/handlers.ts
index 3a94fdef0..c72325c6f 100644
--- a/frontend/src/mocks/handlers.ts
+++ b/frontend/src/mocks/handlers.ts
@@ -1,4 +1,4 @@
-import { rest } from 'msw';
+import { DefaultBodyType, PathParams, ResponseComposition, RestContext, RestRequest, rest } from 'msw';
 import runnerPostList from './data/runnerPostList.json';
 import runnerPostDetails from './data/runnerPostDetails.json';
 import myPageRunnerProfile from './data/myPageRunnerProfile.json';
@@ -8,9 +8,7 @@ import supporterProfileInfo from './data/supporterProfileInfo.json';
 import supporterCandidate from './data/supporterCandidate.json';
 import headerProfile from './data/headerProfile.json';
 import supporterProfilePost from './data/supporterProfilePost.json';
-import notStarted from './data/myPagePost/notStarted.json';
-import inProgress from './data/myPagePost/inProgress.json';
-import done from './data/myPagePost/done.json';
+import myPagePostList from './data/myPagePost/myPagePostList.json';
 import tagList from './data/tagList.json';
 import { BATON_BASE_URL } from '@/constants';
 
@@ -23,7 +21,7 @@ export const handlers = [
     return res(ctx.delay(300), ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(headerProfile));
   }),
 
-  rest.put(`${BATON_BASE_URL}/posts/runner/:runnerPostId)`, async (req, res, ctx) => {
+  rest.put(`${BATON_BASE_URL}/posts/runner/:runnerPostId`, async (req, res, ctx) => {
     return res(ctx.delay(300), ctx.status(201));
   }),
 
@@ -39,40 +37,12 @@ export const handlers = [
     return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(myPageSupporterProfile));
   }),
 
-  rest.get(`${BATON_BASE_URL}/posts/runner/me/runner?size&page&reviewStatus`, async (req, res, ctx) => {
-    const reviewStatus = req.url.searchParams.get('reviewStatus');
-
-    switch (reviewStatus) {
-      case 'NOT_STARTED':
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(notStarted));
-
-      case 'IN_PROGRESS':
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(inProgress));
-
-      case 'DONE':
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(done));
-
-      default:
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json({}));
-    }
+  rest.get(`${BATON_BASE_URL}/posts/runner/me/runner`, async (req, res, ctx) => {
+    return handleRequest(req, res, ctx);
   }),
 
-  rest.get(`${BATON_BASE_URL}/posts/runner/me/supporter?size&page&reviewStatus`, async (req, res, ctx) => {
-    const reviewStatus = req.url.searchParams.get('reviewStatus');
-
-    switch (reviewStatus) {
-      case 'NOT_STARTED':
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(notStarted));
-
-      case 'IN_PROGRESS':
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(inProgress));
-
-      case 'DONE':
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json(done));
-
-      default:
-        return res(ctx.status(200), ctx.set('Content-Type', 'application/json'), ctx.json({}));
-    }
+  rest.get(`${BATON_BASE_URL}/posts/runner/me/supporter`, async (req, res, ctx) => {
+    return handleRequest(req, res, ctx);
   }),
 
   rest.get(`${BATON_BASE_URL}/profile/runner/me`, async (req, res, ctx) => {
@@ -193,4 +163,43 @@ export const handlers = [
       ctx.json(runnerPostDetails),
     );
   }),
+
+  rest.patch(`${BATON_BASE_URL}/posts/runner/:runnerPostId/done`, async (req, res, ctx) => {
+    return res(ctx.status(201));
+  }),
 ];
+
+const handleRequest = (
+  req: RestRequest<never, PathParams<string>>,
+  res: ResponseComposition<DefaultBodyType>,
+  ctx: RestContext,
+) => {
+  const reviewStatus = req.url.searchParams.get('reviewStatus');
+  const page = req.url.searchParams.get('page');
+
+  if (!reviewStatus || !page)
+    return res(
+      ctx.status(400),
+      ctx.set('Content-Type', 'application/json'),
+      ctx.json({ errorCode: 'FE001', message: '잘못된 요청' }),
+    );
+
+  const CopiedMyPagePostList = structuredClone(myPagePostList);
+
+  if (reviewStatus) {
+    CopiedMyPagePostList.data.forEach((post, idx) => {
+      post.runnerPostId = Date.now() + idx;
+      post.title = `${post.title} (${page})`;
+      post.reviewStatus = reviewStatus;
+    });
+
+    CopiedMyPagePostList.pageInfo.currentPage = Number(page);
+
+    return res(
+      ctx.delay(300),
+      ctx.status(200),
+      ctx.set('Content-Type', 'application/json'),
+      ctx.json(CopiedMyPagePostList),
+    );
+  }
+};
diff --git a/frontend/src/pages/MyPage.tsx b/frontend/src/pages/MyPage.tsx
index 86d377856..68c07a1c6 100644
--- a/frontend/src/pages/MyPage.tsx
+++ b/frontend/src/pages/MyPage.tsx
@@ -101,6 +101,12 @@ const MyPage = () => {
     getPostList(role, page + 1);
   };
 
+  const handleDeletePost = (runnerPostId: number) => {
+    const deletedPostList = myPagePostList.filter((post) => post.runnerPostId !== runnerPostId);
+
+    setMyPagePostList(deletedPostList);
+  };
+
   return (
     <Layout>
       <S.MyPageWrapper>
@@ -186,7 +192,7 @@ const MyPage = () => {
                 fontSize={isMobile ? '16px' : '26px'}
               />
             </S.FilterWrapper>
-            <MyPagePostList filteredPostList={myPagePostList} isRunner={isRunner} />
+            <MyPagePostList handleDeletePost={handleDeletePost} filteredPostList={myPagePostList} isRunner={isRunner} />
             <S.MoreButtonWrapper>
               {!isLast && (
                 <Button
diff --git a/frontend/src/pages/SupporterSelectPage.tsx b/frontend/src/pages/SupporterSelectPage.tsx
index 7abd4b4f6..a54034464 100644
--- a/frontend/src/pages/SupporterSelectPage.tsx
+++ b/frontend/src/pages/SupporterSelectPage.tsx
@@ -53,7 +53,7 @@ const S = {
   `,
 
   SupporterListContainer: styled.div`
-    padding: 0 20px;
+    padding: 20px;
 
     @media (max-width: 768px) {
       padding: 0;