diff --git a/deundeun/src/app.jsx b/deundeun/src/app.jsx
index fec4639..ccf8b03 100644
--- a/deundeun/src/app.jsx
+++ b/deundeun/src/app.jsx
@@ -24,6 +24,7 @@ import ApplySuccessPage from 'pages/ApplySuccessPage/index';
 import RecruitSuccessPage from 'pages/RecruitSuccessPage/index';
 import MyApplyPage from 'pages/MyApplyPage/index';
 import ApplicationOverviewPage from 'pages/ApplicationOverviewPage/index';
+import ApplicationModifyPage from 'pages/ApplicationModifyPage/index';
 
 const ClubHomePage = loadable(() => import('pages/ClubHomePage'));
 const CategoryITPage = loadable(() => import('pages/CategoryITPage'));
@@ -130,6 +131,13 @@ const App = () => {
 					<ApplicationOverviewPage />
 				</ContainerRow>
 			</Route>
+			<Route exact path="/application/:clubName/:id/modify">
+				<HeaderContainer />
+				<ContainerRow>
+					<SideBar location={location} />
+					<ApplicationModifyPage />
+				</ContainerRow>
+			</Route>
 			{/* <Route exact path="/club/" */}
 			<Route component={LoginPage} path="/login" exact />
 			<Route component={RegisterInfoContainer} path="/register/1" exact />
diff --git a/deundeun/src/components/ApplicationFormCard/index.jsx b/deundeun/src/components/ApplicationFormCard/index.jsx
index 02a9c20..72bea8c 100644
--- a/deundeun/src/components/ApplicationFormCard/index.jsx
+++ b/deundeun/src/components/ApplicationFormCard/index.jsx
@@ -13,6 +13,10 @@ const ApplicationFormCard = ({ id, title, clubName, onDeleteApplication }) => {
 		[history, clubName, id]
 	);
 
+	const onModify = (e) => {
+		history.push(`/application/${clubName}/${id}/modify`);
+	};
+
 	return (
 		//
 		<Container>
@@ -22,7 +26,9 @@ const ApplicationFormCard = ({ id, title, clubName, onDeleteApplication }) => {
 			<Divider />
 			<ApplicationDetail>{clubName}</ApplicationDetail>
 			<ButtonContainer>
-				<Button style={{ marginRight: '16px' }}>수정하기</Button>
+				<Button onClick={onModify} style={{ marginRight: '16px' }}>
+					수정하기
+				</Button>
 				<Button id={id} onClick={onDeleteApplication}>
 					삭제하기
 				</Button>
diff --git a/deundeun/src/pages/ApplicationManagePage/index.jsx b/deundeun/src/pages/ApplicationManagePage/index.jsx
index fd51506..313d222 100644
--- a/deundeun/src/pages/ApplicationManagePage/index.jsx
+++ b/deundeun/src/pages/ApplicationManagePage/index.jsx
@@ -83,6 +83,9 @@ const ApplicationManagePage = ({ setAddNewForm }) => {
 					</SpinnerContainer>
 				</>
 			)}
+			{/* <SpinnerContainer>
+				<LoadingSpinner size="large" style={{ margin: '0 auto' }} />
+			</SpinnerContainer> */}
 			<DeleteApplicationModal
 				id={deleteId}
 				show={showDeleteModal}
diff --git a/deundeun/src/pages/ApplicationModifyPage/index.jsx b/deundeun/src/pages/ApplicationModifyPage/index.jsx
new file mode 100644
index 0000000..5a20dcd
--- /dev/null
+++ b/deundeun/src/pages/ApplicationModifyPage/index.jsx
@@ -0,0 +1,66 @@
+import LoadingSpinner from 'components/common/LoadingSpinner/index';
+import { API_BASE_URL, ACCESS_TOKEN } from 'constants/index';
+import { ApplicationTitleInput, Header, SubmitButton } from 'pages/ApplicationAddPage/styles';
+import React, { useEffect, useState } from 'react';
+import { useParams } from 'react-router';
+import { ContainerColumn, ContainerPage } from 'styles';
+import { SpinnerContainer } from './styles';
+import axios from '../../../node_modules/axios/index';
+import { TitleKorean } from 'pages/RecruitAddPage/styles';
+import QuestionList from 'components/QuestionList/index';
+import { Footer } from 'components/PostSection/styles';
+
+const ApplicationModifyPage = () => {
+	const { clubName, id } = useParams();
+	const [questionList, setQuestionList] = useState(null);
+	const [loading, setLoading] = useState(true);
+	const [title, setTitle] = useState('');
+
+	useEffect(() => {
+		axios({
+			method: 'get',
+			url: `${API_BASE_URL}/clubs/${clubName}/forms/${id}`,
+			headers: {
+				Authorization: 'Bearer ' + localStorage.getItem(ACCESS_TOKEN)
+			}
+		}).then((res) => {
+			setTitle(res.data.title);
+			setQuestionList(res.data.recruitQuestionResponseDtos);
+			setLoading(false);
+		});
+	}, []);
+
+	return (
+		//
+		<>
+			{!loading ? (
+				<>
+					<ContainerPage style={{ width: '1300px' }}>
+						<ContainerColumn style={{ marginBottom: '3em' }}>
+							<Header>지원서 수정하기</Header>
+							<TitleKorean>제목</TitleKorean>
+							<ApplicationTitleInput
+								type="text"
+								id="title"
+								name="title"
+								value={title ? title : ''}
+							></ApplicationTitleInput>
+							<TitleKorean style={{ marginBottom: '2em', marginTop: '2em' }}>질문</TitleKorean>
+							<QuestionList questionList={questionList} />
+							<SubmitButton>지원서 수정하기</SubmitButton>
+						</ContainerColumn>
+						<Footer />
+					</ContainerPage>
+				</>
+			) : (
+				<>
+					<SpinnerContainer>
+						<LoadingSpinner size="large" />
+					</SpinnerContainer>
+				</>
+			)}
+		</>
+	);
+};
+
+export default ApplicationModifyPage;
diff --git a/deundeun/src/pages/ApplicationModifyPage/styles.js b/deundeun/src/pages/ApplicationModifyPage/styles.js
new file mode 100644
index 0000000..6e6c271
--- /dev/null
+++ b/deundeun/src/pages/ApplicationModifyPage/styles.js
@@ -0,0 +1,8 @@
+import styled from '@emotion/styled';
+
+export const SpinnerContainer = styled.div`
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	width: 100%;
+`;
diff --git a/deundeun/src/pages/ApplicationOverviewPage/index.jsx b/deundeun/src/pages/ApplicationOverviewPage/index.jsx
index d564c8d..7aa84c4 100644
--- a/deundeun/src/pages/ApplicationOverviewPage/index.jsx
+++ b/deundeun/src/pages/ApplicationOverviewPage/index.jsx
@@ -36,7 +36,7 @@ const ApplicationOverviewPage = () => {
 				<>
 					<ContainerPage style={{ width: '1300px' }}>
 						<ContainerColumn style={{ marginBottom: '3em' }}>
-							<Header>지원서 양식 미리보기</Header>
+							<Header>지원서 미리보기</Header>
 							<TitleKorean>제목</TitleKorean>
 							<ApplicationTitleInput
 								type="text"