diff --git a/package-lock.json b/package-lock.json
index 94767e4..260b5a7 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12,6 +12,7 @@
         "react-dom": "^18.2.0",
         "react-icons": "^4.11.0",
         "react-router-dom": "^6.15.0",
+        "react-svg": "^16.1.24",
         "styled-components": "^6.0.7",
         "styled-reset": "^4.5.1",
         "swiper": "^10.2.0"
@@ -2569,11 +2570,20 @@
       "integrity": "sha512-z/G02d+59gyyUb7KYhKi9jOhicek6QD2oMaotUyG+lUkybpXoV49dY9bj7Ah5Q+y7knK2jU67UTX9FyfGzaxQg==",
       "dev": true
     },
+    "node_modules/@tanem/svg-injector": {
+      "version": "10.1.62",
+      "resolved": "https://registry.npmjs.org/@tanem/svg-injector/-/svg-injector-10.1.62.tgz",
+      "integrity": "sha512-74/VTSpUfbdPstcIqzLKLcSp/DXfsrFpzxnh/FGGQFEqQZ59IqgFqjB2TALGwZihmepiC5JobKRA+hRnrjmzFA==",
+      "dependencies": {
+        "@babel/runtime": "^7.22.6",
+        "content-type": "^1.0.5",
+        "tslib": "^2.6.1"
+      }
+    },
     "node_modules/@types/prop-types": {
       "version": "15.7.5",
       "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz",
-      "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==",
-      "dev": true
+      "integrity": "sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w=="
     },
     "node_modules/@types/react": {
       "version": "18.2.21",
@@ -3034,6 +3044,14 @@
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
       "integrity": "sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg=="
     },
+    "node_modules/content-type": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
+      "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/convert-source-map": {
       "version": "1.9.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
@@ -4608,7 +4626,6 @@
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
       "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
-      "dev": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -4878,7 +4895,6 @@
       "version": "15.8.1",
       "resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
       "integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
-      "dev": true,
       "dependencies": {
         "loose-envify": "^1.4.0",
         "object-assign": "^4.1.1",
@@ -4948,8 +4964,7 @@
     "node_modules/react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
-      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==",
-      "dev": true
+      "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
     },
     "node_modules/react-router": {
       "version": "6.15.0",
@@ -4981,6 +4996,21 @@
         "react-dom": ">=16.8"
       }
     },
+    "node_modules/react-svg": {
+      "version": "16.1.24",
+      "resolved": "https://registry.npmjs.org/react-svg/-/react-svg-16.1.24.tgz",
+      "integrity": "sha512-7IKurvuoSxzmkZ7F6EjbpVpdxYOmRj4Ek3Ex4vGZE7D7UqdczfGUADAK1oj/a0p+Y2tCoG4I87Jt0POuILXo1w==",
+      "dependencies": {
+        "@babel/runtime": "^7.22.15",
+        "@tanem/svg-injector": "^10.1.62",
+        "@types/prop-types": "^15.7.5",
+        "prop-types": "^15.8.1"
+      },
+      "peerDependencies": {
+        "react": "^16.0.0 || ^17.0.0 || ^18.0.0",
+        "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0"
+      }
+    },
     "node_modules/readdirp": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
diff --git a/package.json b/package.json
index 4bf1b2a..fcddfd5 100644
--- a/package.json
+++ b/package.json
@@ -14,6 +14,7 @@
     "react-dom": "^18.2.0",
     "react-icons": "^4.11.0",
     "react-router-dom": "^6.15.0",
+    "react-svg": "^16.1.24",
     "styled-components": "^6.0.7",
     "styled-reset": "^4.5.1",
     "swiper": "^10.2.0"
diff --git a/src/App.jsx b/src/App.jsx
index 4d570e7..54df061 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -6,6 +6,7 @@ import Home from './pages/home/Home';
 import Feed from './pages/feed/Feed';
 import My from './pages/my/My';
 import MissionCertification from './pages/mission/MissionCertification';
+import MissionComplete from './pages/mission/MissionComplete';
 import Redirection from './pages/Redirection';
 import Splash from './pages/splash/Splash';
 
@@ -20,6 +21,7 @@ function App() {
             <Route path="/feed" element={<Feed />}></Route>
             <Route path="/my" element={<My />}></Route>
             <Route path="/mission" element={<MissionCertification />}></Route>
+            <Route path="/mission2" element={<MissionComplete />}></Route>
             <Route path="/splash" element={<Splash />}></Route>
             <Route path="/kakao/callback" element={<Redirection />}></Route>
           </Routes>
diff --git a/src/pages/mission/MissionCertification.css b/src/pages/mission/MissionCertification.css
index 7ee8e07..a523ad8 100644
--- a/src/pages/mission/MissionCertification.css
+++ b/src/pages/mission/MissionCertification.css
@@ -34,19 +34,18 @@
 
 /* 하단바 스타일 */
 .bottom-bar {
-    position: fixed; /* 화면 하단에 고정 */
-    bottom: 0; /* 하단에 위치 */
-    width: 28%;
-    border-top: 1px solid #ccc; /* 상단과 구분하는 그레이 선 추가 */
-    padding: 20px;
-    text-align: center;
-    display: flex;
-    justify-content: center; /* 가로 가운데 정렬 */
-    align-items: center; /* 세로 가운데 정렬 */
-  }
+  width: min(100%, 430px);
+  max-width: 100%;
+  border: none;
+  margin: auto auto 0;
+  padding: 20px;
+
+  z-index: 1; /* 다른 요소보다 위에 표시 */
+ background-color: #fff;
+} 
+
+
 
-  
-  
   /* 업로드 버튼 스타일 */
   .upload-button {
     width: 100%;
@@ -54,7 +53,7 @@
     color: #fff; /* 버튼 텍스트 색상 */
     border: none;
     border-radius: 50px; /* 버튼을 타원형으로 만들기 위한 값 */
-    padding: 20px 20px; /* 버튼 내부 여백 설정 */
+    padding: 15px 20px; /* 버튼 내부 여백 설정 */
     font-size: 16px;
     cursor: pointer;
   }
@@ -67,10 +66,6 @@
 
 
 
-
-
-  /* 새로 추가된 스타일 시작 */
-
 /* 미션 페이지 이미지 업로드 스타일 */
 input[type="file"] {
     display: none; /* 파일 업로드 인풋 숨김 */
@@ -93,9 +88,9 @@ input[type="file"] {
   /* MissionPage의 하단 바 스타일 */
   /* 하단 바 배경색 및 여백 설정 */
   .note1 {
-    font-size: 14px; /* 글자 크기 설정 */
-    color: #777; /* 글자 색상 설정 */
-    margin-top: 16px; /* 상단 여백 추가 */
+    font-size: 14px; 
+    color: #777; 
+    margin-top: 16px; 
     padding-left: 5%;
     padding-right: 5%;
   }
@@ -129,10 +124,10 @@ input[type="file"] {
 }
 
 .optional-text2 {
-    color: #888; /* 연한 회색 색상 */
-    font-weight: normal; /* 폰트 굵기 일반으로 설정 */
+    color: #888; 
+    font-weight: normal; 
     
-    margin-left: auto; /* 오른쪽으로 이동 */
+    margin-left: 72%; 
 }
       
   
@@ -144,11 +139,15 @@ input[type="file"] {
 .ms-box2{
     background-color: #f2f2f2c2;
 }
-.ms-txtarea{
-    background-color: #f2f2f2c2;
-    padding: 3%;
-    border-radius: 10px;
+.ms-txtarea {
+  background-color: #f2f2f2c2;
+  padding: 3%;
+  border-radius: 10px;
+  border: 1px solid #ccc;
+}
 
+.ms-txtarea:focus {
+  border-color: #02B550 !important;
 }
 
 /* 글자수 제한 색깔표시 */
@@ -164,7 +163,7 @@ input[type="file"] {
  }
 
 
-  /* 새로 추가된 스타일 끝 */
+
  
   
 
@@ -241,16 +240,28 @@ input[type="file"] {
   
   
   .popup-content button.popup-close-button {
-    position: absolute; /* 절대 위치 설정 */
-    top: 40%; /* 위로 5px 올림 */
-    right: 40%; /* 오른쪽에서 떨어진 위치 */
-    font-size: 24px; /* 아이콘 크기 설정 */
-    border: none; /* 테두리 없음 */
-    background: none; /* 배경 없음 */
+   
+    font-size: 24px; /
+    border: none; 
+    background: none; 
     cursor: pointer;
    
   }
   
+  /* 챌린지 제목 입력 상자 스타일 */
+.challenge-title-input {
+  margin: 20px 20px; /* 적절한 여백 설정 */
+}
+
+.challenge-title-input input {
+  width: 100%;
+  padding: 10px;
+  border: 1px solid #ccc;
+  border-radius: 5px;
+  font-size: 16px;
+  outline: none;
+}
+
   
   
   
diff --git a/src/pages/mission/MissionCertification.jsx b/src/pages/mission/MissionCertification.jsx
index 70985e3..be6069c 100644
--- a/src/pages/mission/MissionCertification.jsx
+++ b/src/pages/mission/MissionCertification.jsx
@@ -117,7 +117,7 @@ function MissionCertification() {
   };
 
   const handleClose = () => {
-    setShowPopup(true); // x 버튼 클릭 시 팝업을 엽니다.
+    setShowPopup(true); // x 버튼 클릭 시 팝업을 열기(true)
   };
 
   const handlePopupClose = () => {
@@ -125,7 +125,7 @@ function MissionCertification() {
   };
 
   const handlePopupContinue = () => {
-    setShowPopup(false); // "계속 작성하기" 버튼 클릭 시 팝업을 닫습니다.
+    setShowPopup(false); // "계속 작성하기" 버튼 클릭 시 팝업을 닫기(false)
   };
 
   const handlePopupConfirm = () => {
@@ -146,6 +146,20 @@ function MissionCertification() {
           <FaTimes />
         </button>
       </header>
+
+
+      {/* 챌린지 제목 입력 상자 */}
+      <div className="challenge-title-input">
+      <div className="mission-feedback-title">챌린지</div>
+        <input
+          type="text"
+          placeholder="챌린지 제목을 입력하세요."
+          // 아래의 value에 챌린지 제목을 바인딩할 수 있습니다.
+          // 예: value={challengeTitle}
+          // onChange 핸들러로 challengeTitle 상태를 업데이트하세요.
+        />
+      </div>
+
       <MissionPage />
       <footer className="bottom-bar">
         <button className="upload-button">챌린지피드에 업로드하기</button>
diff --git a/src/pages/mission/MissionComplete.css b/src/pages/mission/MissionComplete.css
new file mode 100644
index 0000000..3a25fd0
--- /dev/null
+++ b/src/pages/mission/MissionComplete.css
@@ -0,0 +1,68 @@
+/* MissionComplete.css */
+
+
+/* 하단바 스타일 */
+.gohome-bottom-bar {
+    width: min(100%, 430px);
+    max-width: 100%;
+    border: none;
+    margin: auto auto 0;
+    padding: 20px;
+  
+    position: fixed;
+    bottom: 0;
+   background-color: #fff;
+  } 
+  
+  
+  
+    /* 업로드 버튼 스타일 */
+    .gohome-button {
+      width: 100%;
+      background-color: #02B550; 
+      color: #fff;
+      border: none;
+      border-radius: 50px; 
+      padding: 15px 20px; 
+      font-size: 16px;
+      cursor: pointer;
+    }
+    
+    .gohome-button:hover {
+      background-color: #45a049; 
+    }
+
+    .comp-title {
+        text-align: center;
+        font-weight: bold;
+        font-size: 24px;
+        margin-top: 20px;
+       
+      }
+
+.comp-sub{
+    margin-top: 10px;
+    font-size: 12px;
+    text-align: center;
+}
+.comp-sub2{
+    font-size: 12px;
+    text-align: center;
+}
+
+.container {
+    display: flex;
+    flex-direction: column;
+    align-items: center; 
+    justify-content: center; 
+    height: 80vh; 
+  }
+  
+  .center-content {
+    text-align: center;
+  }
+  
+  
+  
+  
+  
\ No newline at end of file
diff --git a/src/pages/mission/MissionComplete.jsx b/src/pages/mission/MissionComplete.jsx
new file mode 100644
index 0000000..52c199d
--- /dev/null
+++ b/src/pages/mission/MissionComplete.jsx
@@ -0,0 +1,57 @@
+import React from 'react';
+import { useNavigate, Link } from 'react-router-dom';
+import './MissionComplete.css';
+
+
+
+function MissionComplete() {
+  const navigate = useNavigate();
+
+  return (
+    <div className="container">
+      <div className="center-content">
+    
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width="70"
+          height="70"
+          viewBox="0 0 50 50"
+          fill="none"
+          style={{
+            display: 'block',
+            margin: 'auto',
+          }}
+        >
+          <circle cx="25" cy="25" r="24" fill="#02B550" />
+          <path
+            d="M15 25L22 32L36 18"
+            stroke="#FFFFFF"
+            strokeWidth="4"
+            strokeLinecap="round"
+            strokeLinejoin="round"
+          />
+        </svg>
+
+        <div className="comp-title">
+          인증완료!
+        </div>
+
+        <div className="comp-sub">
+          챌린지피드에 정상적으로 업로드 됐어요!
+        </div>
+        <div className="comp-sub2">
+          내일도 함께 도전해요!
+        </div>
+      </div>
+
+      {/* 홈으로 돌아가기 버튼 */}
+      <footer className="gohome-bottom-bar">
+        <button className="gohome-button" onClick={() => navigate('/')}>
+          홈으로 돌아가기
+        </button>
+      </footer>
+    </div>
+  );
+}
+
+export default MissionComplete;