diff --git a/.mcp.json b/.mcp.json
new file mode 100644
index 0000000..06b1517
--- /dev/null
+++ b/.mcp.json
@@ -0,0 +1,11 @@
+{
+  "mcpServers": {
+    "figma": {
+      "command": "npx",
+      "args": ["-y", "figma-developer-mcp", "--stdio"],
+      "env": {
+        "FIGMA_ACCESS_TOKEN": "${FIGMA_ACCESS_TOKEN}"
+      }
+    }
+  }
+}
diff --git a/src/App.jsx b/src/App.jsx
index f133bd5..75785ba 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -7,6 +7,7 @@ import RecruitPage from '@/pages/visitor/RecruitPage';
 import SchedulePage from '@/pages/visitor/SchedulePage';
 import AboutPage from '@/pages/visitor/AboutPage';
 import AdminPage from '@/pages/admin/AdminPage';
+import RecruitManagePage from '@/pages/admin/RecruitManagePage';
 import MemberPage from '@/pages/admin/MemberPage';
 import MemberRegisterPage from '@/pages/admin/MemberRegisterPage';
 import MemberEditPage from '@/pages/admin/MemberEditPage';
@@ -21,6 +22,7 @@ function App() {
         <Route path={ROUTES.SCHEDULE} element={<SchedulePage />} />
         <Route path={ROUTES.ABOUT} element={<AboutPage />} />
         <Route path={ROUTES.ADMIN} element={<AdminPage />} />
+        <Route path={ROUTES.ADMIN_RECRUIT} element={<RecruitManagePage />} />
         <Route path="*" element={<NotFoundPage />} />
       </Route>
       {/* admin 명부 관리: 방문자 Layout(Header/Footer) 없이 렌더 */}
diff --git a/src/assets/images/Date_today_duotone_line1.svg b/src/assets/images/Date_today_duotone_line1.svg
new file mode 100644
index 0000000..5916303
--- /dev/null
+++ b/src/assets/images/Date_today_duotone_line1.svg
@@ -0,0 +1,5 @@
+<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="5.25" y="10.5" width="31.5" height="26.25" rx="2" stroke="#222222" stroke-width="1.2"/>
+<path d="M12.25 5.25L12.25 14" stroke="#222222" stroke-width="1.2" stroke-linecap="round"/>
+<path d="M29.75 5.25L29.75 14" stroke="#222222" stroke-width="1.2" stroke-linecap="round"/>
+</svg>
diff --git a/src/assets/images/Date_today_duotone_line2.svg b/src/assets/images/Date_today_duotone_line2.svg
new file mode 100644
index 0000000..4206f9d
--- /dev/null
+++ b/src/assets/images/Date_today_duotone_line2.svg
@@ -0,0 +1,5 @@
+<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="5.25" y="10.5" width="31.5" height="26.25" rx="2" stroke="#FF6B00" stroke-width="1.2"/>
+<path d="M12.25 5.25L12.25 14" stroke="#FF6B00" stroke-width="1.2" stroke-linecap="round"/>
+<path d="M29.75 5.25L29.75 14" stroke="#FF6B00" stroke-width="1.2" stroke-linecap="round"/>
+</svg>
diff --git a/src/assets/images/User1.svg b/src/assets/images/User1.svg
new file mode 100644
index 0000000..93a38b8
--- /dev/null
+++ b/src/assets/images/User1.svg
@@ -0,0 +1,4 @@
+<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M34.523 35.7824C33.7253 33.5498 31.9677 31.5769 29.5227 30.1698C27.0776 28.7627 24.0819 28 21 28C17.9181 28 14.9224 28.7627 12.4773 30.1698C10.0323 31.5769 8.27469 33.5497 7.47704 35.7824" stroke="#33363F" stroke-width="2" stroke-linecap="round"/>
+<circle cx="21" cy="14" r="7" stroke="#33363F" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/src/assets/images/User2.svg b/src/assets/images/User2.svg
new file mode 100644
index 0000000..7af5623
--- /dev/null
+++ b/src/assets/images/User2.svg
@@ -0,0 +1,4 @@
+<svg width="42" height="42" viewBox="0 0 42 42" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M34.523 35.7824C33.7253 33.5498 31.9677 31.5769 29.5227 30.1698C27.0776 28.7627 24.0819 28 21 28C17.9181 28 14.9224 28.7627 12.4773 30.1698C10.0323 31.5769 8.27469 33.5497 7.47704 35.7824" stroke="#FF6B00" stroke-width="2" stroke-linecap="round"/>
+<circle cx="21" cy="14" r="7" stroke="#FF6B00" stroke-width="2" stroke-linecap="round"/>
+</svg>
diff --git a/src/assets/images/search.svg b/src/assets/images/search.svg
new file mode 100644
index 0000000..89f0091
--- /dev/null
+++ b/src/assets/images/search.svg
@@ -0,0 +1,4 @@
+<svg width="27" height="27" viewBox="0 0 27 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M12.375 4.5C8.02576 4.5 4.5 8.02576 4.5 12.375C4.5 16.7242 8.02576 20.25 12.375 20.25C16.7242 20.25 20.25 16.7242 20.25 12.375C20.25 8.02576 16.7242 4.5 12.375 4.5ZM2.25 12.375C2.25 6.78312 6.78312 2.25 12.375 2.25C17.9669 2.25 22.5 6.78312 22.5 12.375C22.5 17.9669 17.9669 22.5 12.375 22.5C6.78312 22.5 2.25 17.9669 2.25 12.375Z" fill="#FF6B00"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M17.9357 17.9357C18.375 17.4964 19.0874 17.4964 19.5267 17.9357L24.4204 22.8295C24.8598 23.2688 24.8598 23.9811 24.4204 24.4204C23.9811 24.8598 23.2688 24.8598 22.8295 24.4204L17.9357 19.5267C17.4964 19.0874 17.4964 18.375 17.9357 17.9357Z" fill="#FF6B00"/>
+</svg>
diff --git a/src/components/layout/Header.jsx b/src/components/layout/Header.jsx
index 81e2918..1354831 100644
--- a/src/components/layout/Header.jsx
+++ b/src/components/layout/Header.jsx
@@ -1,17 +1,69 @@
-import { Link } from 'react-router-dom';
+import { NavLink } from 'react-router-dom';
+
 import { ROUTES } from '@/constants/routes';
+import { COLORS } from '@/constants/theme';
+import calendarBlackIcon from '@/assets/images/Date_today_duotone_line1.svg';    //검정 아이콘
+import calendarOrangeIcon from '@/assets/images/Date_today_duotone_line2.svg';  //주황 아이콘
+
+import userBlackIcon from '@/assets/images/User1.svg';  //검정 아이콘
+import userOrangeIcon from '@/assets/images/User2.svg'; //주황 아이콘
 
 function Header() {
   return (
-    <header>
-      <nav>
-        <Link to={ROUTES.HOME}>ONE</Link>
-        <Link to={ROUTES.ABOUT}>동아리 소개</Link>
-        <Link to={ROUTES.SCHEDULE}>연간 계획</Link>
-        <Link to={ROUTES.RECRUIT}>모집 신청</Link>
+    <header className="w-full bg-white shadow-[0_4px_24px_rgba(0,0,0,0.35)]">
+      <nav className="flex items-center justify-center gap-20 px-6 py-6">
+        <NavLink to={ROUTES.SCHEDULE}>
+  {({ isActive }) => (
+    <div className="flex items-center gap-3">
+      <img
+        src={
+          isActive
+            ? calendarOrangeIcon
+            : calendarBlackIcon
+        }
+        alt=""
+        className="h-10 w-10 object-contain"
+      />
+
+      <span
+        className="text-xl font-medium"
+        style={{
+          color: isActive ? COLORS.orange : '#000000',
+        }}
+      >
+        연간 계획
+      </span>
+    </div>
+  )}
+</NavLink>
+
+        <NavLink to={ROUTES.RECRUIT}>
+  {({ isActive }) => (
+    <div className="flex items-center gap-3">
+      <img
+        src={
+          isActive
+            ? userOrangeIcon
+            : userBlackIcon
+        }
+        alt=""
+        className="h-10 w-10 object-contain"
+      />
+
+      <span
+        className="text-xl font-medium"
+        style={{
+          color: isActive ? COLORS.orange : '#000000',
+        }}
+      >
+        신입 부원 모집
+      </span>
+    </div>
+  )}
+</NavLink>
       </nav>
     </header>
   );
 }
 
-export default Header;
+export default Header;
\ No newline at end of file
diff --git a/src/constants/routes.js b/src/constants/routes.js
index eed8b07..51068ef 100644
--- a/src/constants/routes.js
+++ b/src/constants/routes.js
@@ -8,6 +8,7 @@ export const ROUTES = {
   SCHEDULE: '/schedule',
   ABOUT: '/about',
   ADMIN: '/admin',
+  ADMIN_RECRUIT: '/admin/Memberpage',
   // 명부 관리: 외부에 노출하지 않는 admin 히든 경로 하위에 둔다. 방문자 내비에 링크하지 않는다.
   ADMIN_MEMBER: '/admin/members',
   // 부원 등록: 명부 관리에서 '부원 등록' 클릭 시 이동하는 폼 화면.
diff --git a/src/constants/theme.js b/src/constants/theme.js
index 61137ee..a69957c 100644
--- a/src/constants/theme.js
+++ b/src/constants/theme.js
@@ -7,6 +7,7 @@ export const COLORS = {
   primary: '#3B82F6',
   primaryDark: '#1E40AF',
   secondary: '#F59E0B',
+  orange: '#FF6B00', // 상단바 및 주요 액션 색상 (Figma 추출)
   background: '#FFFFFF',
   surface: '#F3F4F6',
   textPrimary: '#1F2937',
diff --git a/src/pages/admin/AdminPage.jsx b/src/pages/admin/AdminPage.jsx
index 6a8b0c0..9a9173d 100644
--- a/src/pages/admin/AdminPage.jsx
+++ b/src/pages/admin/AdminPage.jsx
@@ -7,4 +7,4 @@ function AdminPage() {
   );
 }
 
-export default AdminPage;
+export default AdminPage;
\ No newline at end of file
diff --git a/src/pages/admin/RecruitManagePage.jsx b/src/pages/admin/RecruitManagePage.jsx
new file mode 100644
index 0000000..99070d3
--- /dev/null
+++ b/src/pages/admin/RecruitManagePage.jsx
@@ -0,0 +1,223 @@
+import { useState } from 'react';
+import memberGroupIcon from '@/assets/images/member-group.svg';
+import searchIcon from '@/assets/images/search.svg';
+
+const APPLICANTS = [
+  {
+    id: 1,
+    name: '최현우',
+    studentId: '20301234',
+    department: '웹응용소프트웨어학과',
+    birthDate: '2025.01.01',
+    grade: '2',
+    gender: '남',
+    phone: '010-1111-2222',
+    appliedAt: '2026.08.08',
+    motivation: '동아리 활동을 하며 실무경험을 길러 보고 싶어 지원하게 되었습니다.',
+    usedTool: 'React, Figma',
+    goal: '프로젝트 경험 쌓기',
+    lastWord: '잘 부탁드립니다.',
+    isNew: false,
+  },
+  {
+    id: 2,
+    name: '최현우',
+    studentId: '20301234',
+    department: '웹응용소프트웨어학과',
+    birthDate: '2025.01.01',
+    grade: '2',
+    gender: '남',
+    phone: '010-1111-2222',
+    appliedAt: '2026.08.08',
+    motivation: '프로젝트를 함께 진행하며 성장하고 싶습니다.',
+    usedTool: 'JavaScript',
+    goal: '협업 능력 향상',
+    lastWord: '열심히 하겠습니다.',
+    isNew: false,
+  },
+  {
+    id: 3,
+    name: '최현우',
+    studentId: '20301234',
+    department: '웹응용소프트웨어학과',
+    birthDate: '2025.01.01',
+    grade: '2',
+    gender: '남',
+    phone: '010-1111-2222',
+    appliedAt: '2026.08.08',
+    motivation: '프론트엔드 개발 경험을 쌓고 싶어 지원했습니다.',
+    usedTool: 'HTML, CSS',
+    goal: '웹 프로젝트 참여',
+    lastWord: '잘 부탁드립니다.',
+    isNew: false,
+  },
+  {
+    id: 4,
+    name: '최현우',
+    studentId: '20301234',
+    department: '웹응용소프트웨어학과',
+    birthDate: '2025.01.01',
+    grade: '2',
+    gender: '남',
+    phone: '010-1111-2222',
+    appliedAt: '2026.08.08',
+    motivation: '팀 프로젝트에서 맡은 역할을 책임감 있게 수행하고 싶습니다.',
+    usedTool: 'React',
+    goal: '실무 경험 확보',
+    lastWord: '최선을 다하겠습니다.',
+    isNew: true,
+  },
+  {
+    id: 5,
+    name: '최현우',
+    studentId: '20301234',
+    department: '웹응용소프트웨어학과',
+    birthDate: '2025.01.01',
+    grade: '2',
+    gender: '남',
+    phone: '010-1111-2222',
+    appliedAt: '2026.08.08',
+    motivation: '동아리 활동을 통해 협업과 개발 역량을 키우고 싶습니다.',
+    usedTool: 'Figma',
+    goal: '포트폴리오 제작',
+    lastWord: '잘 부탁드립니다.',
+    isNew: true,
+  },
+];
+
+const TD_CLASS =
+  'h-[89px] border-b border-line text-[20px] font-normal text-ink';
+
+function RecruitManagePage() {
+  const [selectedApplicant, setSelectedApplicant] = useState(null);
+
+  const handleOpenDetail = (applicant) => setSelectedApplicant(applicant);
+  const handleCloseDetail = () => setSelectedApplicant(null);
+
+  return (
+    <section className="min-h-[calc(100vh-112px)] bg-brand-soft px-[5.75rem] py-7 max-lg:px-6">
+      <div className="relative mx-auto min-h-[842px] max-w-[1254px] rounded-card bg-white px-[60px] pt-[52px] pb-[28px] shadow-card">
+        <div className="mb-6 flex items-start justify-between gap-8 max-lg:flex-col">
+          <div className="flex items-center gap-3">
+            {/* 아이콘 + 총 N명을 세로로 묶기 */}
+            <div className="flex flex-col items-center">
+              <img src={memberGroupIcon} alt="" className="flex-shrink-0" />
+              <p className="-mt-2 text-[24px] font-[350] text-ink whitespace-nowrap">
+                총 <span className="text-brand">{APPLICANTS.length}</span>명
+              </p>
+            </div>
+            <h1 className="text-[40px] font-bold text-ink">신청 부원 조회</h1>
+          </div>
+          <p className="self-end text-[18px] text-ink-sub max-lg:self-auto">
+            최근 1년 동안 신청한 부원의 정보만 조회가능합니다
+          </p>
+        </div>
+
+        <div className="overflow-hidden rounded-card border border-tag max-lg:overflow-x-auto">
+          <table className="w-full min-w-[900px] border-collapse text-center text-[20px] text-ink">
+            <thead className="bg-brand-soft">
+              <tr>
+                {['NO', '이름', '학번', '전화번호', '신청날짜', '정보조회'].map((col) => (
+                  <th key={col} className="h-16 text-[24px] font-[350]">
+                    {col}
+                  </th>
+                ))}
+              </tr>
+            </thead>
+
+            <tbody>
+              {APPLICANTS.map((applicant) => (
+                <tr key={applicant.id}>
+                  <td className={TD_CLASS}>
+                    <span className="relative inline-flex items-center justify-center">
+                      <span>{applicant.id}</span>
+                      {applicant.isNew && (
+                        <span className="absolute left-full ml-2 inline-flex h-[18px] w-[19px] items-center justify-center rounded-sm bg-brand text-[14px] font-bold text-white">
+                          N
+                        </span>
+                      )}
+                    </span>
+                  </td>
+
+                  <td className={TD_CLASS}>{applicant.name}</td>
+                  <td className={TD_CLASS}>{applicant.studentId}</td>
+                  <td className={TD_CLASS}>{applicant.phone}</td>
+                  <td className={TD_CLASS}>{applicant.appliedAt}</td>
+                  <td className={TD_CLASS}>
+                    <button
+                      type="button"
+                      className="inline-flex h-[56px] w-[56px] items-center justify-center rounded-full bg-brand-soft text-brand"
+                      onClick={() => handleOpenDetail(applicant)}
+                    >
+                      <img src={searchIcon} alt="" className="h-[27px] w-[27px]" />
+                    </button>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+
+        <nav className="mt-8 flex items-center justify-center gap-9">
+          <button type="button" aria-label="이전 페이지" className="text-ink">
+            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" aria-hidden="true">
+              <path d="M15 18l-6-6 6-6" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+            </svg>
+          </button>
+          <button type="button" className="text-[20px] text-brand">1</button>
+          <button type="button" className="text-[20px]">2</button>
+          <button type="button" className="text-[20px]">3</button>
+          <button type="button" className="text-[20px]">4</button>
+          <button type="button" aria-label="다음 페이지" className="text-ink">
+            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" aria-hidden="true">
+              <path d="M9 18l6-6-6-6" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+            </svg>
+          </button>
+        </nav>
+      </div>
+
+      {selectedApplicant && (
+        <div
+          className="fixed inset-x-0 bottom-0 top-[112px] flex items-center justify-center bg-line/[0.78] p-8"
+          onClick={handleCloseDetail}
+        >
+          <section
+            className="relative max-h-[555px] w-full max-w-[514px] overflow-y-auto rounded-modal bg-white px-[36px] pt-[48px] pb-[32px]"
+            onClick={(e) => e.stopPropagation()}
+          >
+            <button
+              type="button"
+              className="absolute right-6 top-6 text-[32px]"
+              onClick={handleCloseDetail}
+            >
+              ×
+            </button>
+
+            <dl className="grid gap-7">
+              {[
+                ['이름', selectedApplicant.name],
+                ['학번', selectedApplicant.studentId],
+                ['학과', selectedApplicant.department],
+                ['생년월일', selectedApplicant.birthDate],
+                ['전화번호', selectedApplicant.phone],
+                ['학년', selectedApplicant.grade],
+                ['성별', selectedApplicant.gender],
+                ['지원동기', selectedApplicant.motivation],
+                ['사용해봤거나 들어본 언어 및 라이브러리', selectedApplicant.usedTool],
+                ['동아리에서 해 보고 싶은 것', selectedApplicant.goal],
+                ['마지막으로 하고 싶은 말', selectedApplicant.lastWord],
+              ].map(([label, value]) => (
+                <div key={label} className="grid grid-cols-[8.5rem_1fr] gap-6 max-sm:grid-cols-1">
+                  <dt className="text-[24px] font-bold text-brand/70">{label}</dt>
+                  <dd className="m-0 text-[20px] leading-[1.5] text-ink">{value}</dd>
+                </div>
+              ))}
+            </dl>
+          </section>
+        </div>
+      )}
+    </section>
+  );
+}
+
+export default RecruitManagePage;
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
index 9ee0595..7a7473f 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -27,6 +27,10 @@ export default {
         // 신청 부원 목록 모달.
         modal: '30px',
       },
+      boxShadow: {
+        // 명부 관리/신청 부원 카드 그림자 (시안 실측).
+        card: '0 4px 4px rgba(0,0,0,0.25)',
+      },
       // 부원 상태 배지 너비(시안 실측 150px).
       minWidth: {
         badge: '150px',