diff --git a/apps/member/src/api/activity.ts b/apps/member/src/api/activity.ts
index ef9ebc52..f5efd324 100644
--- a/apps/member/src/api/activity.ts
+++ b/apps/member/src/api/activity.ts
@@ -337,7 +337,7 @@ export async function postActivityBoard({
     url: createPagination(END_POINT.ACTIVITY_GROUP_BOARD, params),
     body: {
       ...body,
-      fileUrls: fileUrl ? fileUrl : undefined,
+      fileUrls: fileUrl || undefined,
     },
   });
 
diff --git a/apps/member/src/components/calendar/ScheduleFormSection.tsx b/apps/member/src/components/calendar/ScheduleFormSection.tsx
deleted file mode 100644
index 4706aadc..00000000
--- a/apps/member/src/components/calendar/ScheduleFormSection.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import { useState } from 'react';
-
-import { Button, Grid, Input } from '@clab-platforms/design-system';
-
-import Textarea from '@components/common/Textarea/Textarea';
-
-import useToast from '@hooks/common/useToast';
-import { useScheduleMutation } from '@hooks/queries';
-
-interface Props {
-  onSubmit: () => void;
-}
-
-export function ScheduleFormSection({ onSubmit }: Props) {
-  const toast = useToast();
-  const [inputs, setInputs] = useState({
-    title: '',
-    detail: '',
-    startDateTime: '',
-    endDateTime: '',
-  });
-
-  const { scheduleMutate } = useScheduleMutation();
-
-  const { title, detail, startDateTime, endDateTime } = inputs;
-
-  const handleInputsChange = (
-    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
-  ) => {
-    setInputs((prev) => ({
-      ...prev,
-      [e.target.name]: e.target.value,
-    }));
-  };
-
-  const handleSubmitClick = () => {
-    if (!title || !detail || !startDateTime || !endDateTime) {
-      return toast({
-        state: 'error',
-        message: '모든 항목을 입력해주세요.',
-      });
-    }
-    scheduleMutate({
-      scheduleType: 'ALL',
-      title,
-      detail,
-      startDateTime,
-      endDateTime,
-      priority: 'HIGH',
-    });
-    onSubmit();
-  };
-
-  return (
-    <div className="space-y-2">
-      <Input
-        label="일정명"
-        id="title"
-        name="title"
-        placeholder="일정명을 입력해주세요."
-        value={title}
-        onChange={handleInputsChange}
-      />
-      <Textarea
-        label="내용"
-        id="detail"
-        name="detail"
-        placeholder="내용을 입력해주세요."
-        maxLength={200}
-        value={detail}
-        onChange={handleInputsChange}
-      />
-      <Grid gap="md" col="2">
-        <Input
-          label="시작일"
-          type="datetime-local"
-          id="startDateTime"
-          name="startDateTime"
-          value={startDateTime}
-          onChange={handleInputsChange}
-        />
-        <Input
-          label="마감일"
-          type="datetime-local"
-          id="endDateTime"
-          name="endDateTime"
-          value={endDateTime}
-          onChange={handleInputsChange}
-        />
-      </Grid>
-      <Button className="w-full" onClick={handleSubmitClick}>
-        일정 추가하기
-      </Button>
-    </div>
-  );
-}
diff --git a/apps/member/src/components/manage/ManageAlertSection/ManagerAlertSection.tsx b/apps/member/src/components/manage/ManageAlertSection/ManagerAlertSection.tsx
deleted file mode 100644
index b7feda50..00000000
--- a/apps/member/src/components/manage/ManageAlertSection/ManagerAlertSection.tsx
+++ /dev/null
@@ -1,135 +0,0 @@
-import { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
-
-import { Menubar, Table } from '@clab-platforms/design-system';
-import { toDecodeHTMLEntities } from '@clab-platforms/utils';
-
-import ActionButton from '@components/common/ActionButton/ActionButton';
-import Pagination from '@components/common/Pagination/Pagination';
-import { Section } from '@components/common/Section';
-import CommunityBoardForm from '@components/community/CommunityBoardForm/CommunityBoardForm';
-
-import { SERVICE_NAME } from '@constants/environment';
-import { TABLE_HEAD, TABLE_HEAD_ACTION } from '@constants/head';
-import { PATH_FINDER } from '@constants/path';
-import { useModal } from '@hooks/common/useModal';
-import { usePagination } from '@hooks/common/usePagination';
-import { useBoardByCategory, useBoardDeleteMutation } from '@hooks/queries';
-import { getCategoryTitle } from '@utils/community';
-import { toYYMMDD } from '@utils/date';
-
-import type { CommunityCategoryType } from '@type/community';
-
-interface ManagerAlertSectionProps {
-  category: CommunityCategoryType;
-}
-
-type ModeState = 'view' | 'add';
-
-const ManagerAlertSection = ({ category }: ManagerAlertSectionProps) => {
-  const navigate = useNavigate();
-  const { open } = useModal();
-  const { boardDeleteMutate } = useBoardDeleteMutation();
-  const { data } = useBoardByCategory({
-    hasPermission: true,
-    category: category,
-  });
-
-  const [mode, setMode] = useState<ModeState>('view');
-  const { page, size, handlePageChange } = usePagination({
-    sectionName: category,
-  });
-
-  const title = getCategoryTitle(category);
-
-  const handleTableRowClick = (id: number) => {
-    navigate(PATH_FINDER.COMMUNITY_POST(category, id));
-  };
-
-  const handleMenubarItemClick = (mode: ModeState) => setMode(mode);
-
-  const handleDeleteButtonClick = (
-    e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
-    id: number,
-  ) => {
-    e.stopPropagation();
-    return open({
-      title: `${title} 삭제`,
-      content: `해당 ${title}을 정말 삭제하시겠습니까?\n삭제된 데이터는 복구할 수 없습니다.`,
-      accept: {
-        text: '삭제',
-        onClick: () => boardDeleteMutate(id),
-      },
-    });
-  };
-
-  const renderView = {
-    view: (
-      <Table head={[...TABLE_HEAD.COMMUNITY_DETAIL, TABLE_HEAD_ACTION]}>
-        {data.items.map(({ id, title, writerId, writerName, createdAt }) => (
-          <Table.Row
-            key={id}
-            className="text-nowrap text-center"
-            onClick={() => handleTableRowClick(id)}
-          >
-            <Table.Cell>{id}</Table.Cell>
-            <Table.Cell className="w-full truncate text-left">
-              {toDecodeHTMLEntities(title)}
-            </Table.Cell>
-            <Table.Cell>
-              {writerId ? `${writerName} (${writerId})` : SERVICE_NAME}
-            </Table.Cell>
-            <Table.Cell>{toYYMMDD(createdAt)}</Table.Cell>
-            <Table.Cell className="space-x-2">
-              <ActionButton
-                color="red"
-                onClick={(e) => handleDeleteButtonClick(e, id)}
-              >
-                삭제
-              </ActionButton>
-            </Table.Cell>
-          </Table.Row>
-        ))}
-      </Table>
-    ),
-    add: <CommunityBoardForm category={category} />,
-  }[mode];
-
-  return (
-    <Section>
-      <Section.Header
-        title={title}
-        description={`${title}을 추가하거나 삭제할 수 있어요`}
-      >
-        <Menubar>
-          <Menubar.Item
-            selected={mode === 'view'}
-            onClick={() => handleMenubarItemClick('view')}
-          >
-            보기
-          </Menubar.Item>
-          <Menubar.Item
-            selected={mode === 'add'}
-            onClick={() => handleMenubarItemClick('add')}
-          >
-            추가
-          </Menubar.Item>
-        </Menubar>
-      </Section.Header>
-      <Section.Body>
-        {renderView}
-        {mode === 'view' && (
-          <Pagination
-            className="mt-4 justify-center"
-            totalItems={data.totalItems}
-            postLimit={size}
-            onChange={handlePageChange}
-            page={page}
-          />
-        )}
-      </Section.Body>
-    </Section>
-  );
-};
-
-export default ManagerAlertSection;
diff --git a/apps/member/src/components/manage/ManageBannerSection/ManageBannerSection.tsx b/apps/member/src/components/manage/ManageBannerSection/ManageBannerSection.tsx
deleted file mode 100644
index db03eaa8..00000000
--- a/apps/member/src/components/manage/ManageBannerSection/ManageBannerSection.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import { useState } from 'react';
-
-import { Button, Input } from '@clab-platforms/design-system';
-
-import ActivityPhotoBanner from '@components/common/ActivityPhotoBanner/ActivityPhotoBanner';
-import Hr from '@components/common/Hr/Hr';
-import { Section } from '@components/common/Section';
-import Uploader from '@components/common/Uploader/Uploader';
-
-import { PostActivityPhotoParams } from '@api/activity';
-import { ERROR_MESSAGE } from '@constants/message';
-import useToast from '@hooks/common/useToast';
-import { useActivityPhotoMutation } from '@hooks/queries';
-
-interface InputsState extends Pick<PostActivityPhotoParams, 'date' | 'title'> {
-  file?: File;
-}
-
-const ManageBannerSection = () => {
-  const toast = useToast();
-  const { activityPhotoMutate } = useActivityPhotoMutation();
-
-  const [inputs, setInputs] = useState<InputsState>({
-    title: '',
-    date: '',
-    file: undefined,
-  });
-
-  const { title, date, file } = inputs;
-
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setInputs((prev) => ({
-      ...prev,
-      [e.target.name]: e.target.value,
-    }));
-  };
-
-  const handleFileAccepted = (file?: File) => {
-    setInputs((prev) => ({
-      ...prev,
-      file,
-    }));
-  };
-
-  const handleOnSubmit = (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
-    if (!title || !date || !file) {
-      return toast({
-        state: 'error',
-        message: ERROR_MESSAGE.NO_DATA,
-      });
-    }
-    activityPhotoMutate({
-      title: title,
-      date: date,
-      file: file,
-    });
-  };
-
-  return (
-    <Section>
-      <Section.Header
-        title="활동 사진"
-        description="홈 화면에 있는 활동 사진을 변경할 수 있어요"
-      />
-      <Section.Body className="space-y-2">
-        <form onSubmit={handleOnSubmit} className="space-y-2">
-          <Input
-            id="title"
-            name="title"
-            label="제목"
-            placeholder="제목을 입력해주세요."
-            value={title}
-            onChange={handleInputChange}
-          />
-          <Input
-            id="date"
-            name="date"
-            type="date"
-            label="날짜"
-            value={date}
-            onChange={handleInputChange}
-          />
-          <Uploader
-            label="사진"
-            accept="image/*"
-            onFileAccepted={handleFileAccepted}
-          />
-          <Button className="w-full">활동 사진 변경하기</Button>
-        </form>
-        <Hr>현재 활동 사진</Hr>
-        <ActivityPhotoBanner />
-      </Section.Body>
-    </Section>
-  );
-};
-
-export default ManageBannerSection;
diff --git a/apps/member/src/components/manage/ManageCalendarSection/ManageCalendarSection.tsx b/apps/member/src/components/manage/ManageCalendarSection/ManageCalendarSection.tsx
deleted file mode 100644
index 342c8c8b..00000000
--- a/apps/member/src/components/manage/ManageCalendarSection/ManageCalendarSection.tsx
+++ /dev/null
@@ -1,128 +0,0 @@
-import { useState } from 'react';
-import { useNavigate } from 'react-router-dom';
-
-import { Menubar, Table } from '@clab-platforms/design-system';
-import { toDecodeHTMLEntities } from '@clab-platforms/utils';
-
-import { ScheduleFormSection } from '@components/calendar/ScheduleFormSection';
-import ActionButton from '@components/common/ActionButton/ActionButton';
-import Pagination from '@components/common/Pagination/Pagination';
-import { Section } from '@components/common/Section';
-
-import { TABLE_HEAD } from '@constants/head';
-import { PATH } from '@constants/path';
-import { useModal } from '@hooks/common/useModal';
-import { usePagination } from '@hooks/common/usePagination';
-import { useSchedule, useScheduleDeleteMutation } from '@hooks/queries';
-import { formattedDate, now } from '@utils/date';
-import { toPriorityText } from '@utils/string';
-
-type Mode = 'view' | 'add';
-
-const ManageCalendarSection = () => {
-  const navigate = useNavigate();
-  const { open } = useModal();
-
-  const [mode, setMode] = useState<Mode>('view');
-  const { page, size, handlePageChange } = usePagination({
-    sectionName: 'calendar',
-  });
-
-  const { data } = useSchedule({
-    // 오늘 기준으로 최근 1년 부터 ~ 이번달 까지
-    startDate: now().add(-1, 'year').toString(),
-  });
-  const { scheduleDeleteMutate } = useScheduleDeleteMutation();
-
-  const handleMenubarItemClick = (mode: Mode) => setMode(mode);
-
-  const handleTableRowClick = () => navigate(PATH.CALENDER);
-
-  const handleDeleteButtonClick = (
-    e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
-    id: number,
-  ) => {
-    e.stopPropagation();
-    return open({
-      title: '스케줄 삭제',
-      content: `해당 스케줄을 정말 삭제하시겠습니까?\n삭제된 데이터는 복구할 수 없습니다.`,
-      accept: {
-        text: '삭제',
-        onClick: () => scheduleDeleteMutate(id),
-      },
-    });
-  };
-
-  const renderView = {
-    view: (
-      <Table head={TABLE_HEAD.CALENDAR_SCHEDULE}>
-        {data.items.map(
-          ({ id, title, startDateTime, endDateTime, priority }) => (
-            <Table.Row
-              key={id}
-              className="text-nowrap text-center"
-              onClick={handleTableRowClick}
-            >
-              <Table.Cell>{id}</Table.Cell>
-              <Table.Cell className="w-full truncate text-left">
-                {toDecodeHTMLEntities(title)}
-              </Table.Cell>
-              <Table.Cell>{formattedDate(startDateTime)}</Table.Cell>
-              <Table.Cell>{formattedDate(endDateTime)}</Table.Cell>
-              <Table.Cell>{toPriorityText(priority)}</Table.Cell>
-              <Table.Cell className="space-x-2">
-                <ActionButton
-                  color="red"
-                  onClick={(e) => handleDeleteButtonClick(e, id)}
-                >
-                  삭제
-                </ActionButton>
-              </Table.Cell>
-            </Table.Row>
-          ),
-        )}
-      </Table>
-    ),
-    add: (
-      <ScheduleFormSection onSubmit={() => handleMenubarItemClick('view')} />
-    ),
-  }[mode];
-
-  return (
-    <Section>
-      <Section.Header
-        title="일정"
-        description="일정을 추가하거나 삭제할 수 있어요"
-      >
-        <Menubar>
-          <Menubar.Item
-            selected={mode === 'view'}
-            onClick={() => handleMenubarItemClick('view')}
-          >
-            보기
-          </Menubar.Item>
-          <Menubar.Item
-            selected={mode === 'add'}
-            onClick={() => handleMenubarItemClick('add')}
-          >
-            추가
-          </Menubar.Item>
-        </Menubar>
-      </Section.Header>
-      <Section.Body>
-        {renderView}
-        {mode === 'view' && (
-          <Pagination
-            className="mt-4 justify-center"
-            totalItems={data.totalItems}
-            postLimit={size}
-            onChange={handlePageChange}
-            page={page}
-          />
-        )}
-      </Section.Body>
-    </Section>
-  );
-};
-
-export default ManageCalendarSection;
diff --git a/apps/member/src/components/modal/index.ts b/apps/member/src/components/modal/index.ts
index 8da31641..264c3925 100644
--- a/apps/member/src/components/modal/index.ts
+++ b/apps/member/src/components/modal/index.ts
@@ -1,3 +1,2 @@
 export * from './CheckConfirmModal';
-export * from './MemberInfoModal';
 export * from './ActivityBoardEditModal';
diff --git a/apps/member/src/hooks/common/useModal.ts b/apps/member/src/hooks/common/useModal.ts
index 62d61cd3..6aadf63e 100644
--- a/apps/member/src/hooks/common/useModal.ts
+++ b/apps/member/src/hooks/common/useModal.ts
@@ -43,7 +43,7 @@ export function useModal() {
       custom,
       ...(accept && { accept }),
       cancel: {
-        text: cancel?.text || '닫기',
+        text: cancel?.text ?? '닫기',
         onClick: cancel?.onClick || close,
       },
     });
diff --git a/apps/member/src/hooks/common/useView.ts b/apps/member/src/hooks/common/useView.ts
new file mode 100644
index 00000000..e2020ba7
--- /dev/null
+++ b/apps/member/src/hooks/common/useView.ts
@@ -0,0 +1,12 @@
+import { useCallback, useState } from 'react';
+
+/**
+ * 렌더링할 뷰를 관리합니다.
+ */
+export function useView<TView>(initialData: TView) {
+  const [view, setView] = useState<TView>(initialData);
+
+  const handleViewClick = useCallback((view: TView) => setView(view), []);
+
+  return { view, setView, handleViewClick } as const;
+}
diff --git a/apps/member/src/hooks/modal/useDeleteModal.ts b/apps/member/src/hooks/modal/useDeleteModal.ts
new file mode 100644
index 00000000..c7e0fdff
--- /dev/null
+++ b/apps/member/src/hooks/modal/useDeleteModal.ts
@@ -0,0 +1,30 @@
+import { useMemo } from 'react';
+
+import { useModal } from '@hooks/common/useModal';
+
+interface Options {
+  title: string;
+  onClick: () => void;
+}
+
+/**
+ * 삭제 모달을 엽니다.
+ */
+export function useDeleteModal() {
+  const { open } = useModal();
+
+  return useMemo(
+    () => ({
+      open: (options: Options) =>
+        open({
+          title: `${options.title} 삭제`,
+          content: `해당 ${options.title}을 정말 삭제하시겠습니까?\n삭제된 데이터는 복구할 수 없습니다.`,
+          accept: {
+            text: '삭제',
+            onClick: options.onClick,
+          },
+        }),
+    }),
+    [open],
+  );
+}
diff --git a/apps/member/src/hooks/queries/activity/index.ts b/apps/member/src/hooks/queries/activity/index.ts
index a2e8279c..d7e20efa 100644
--- a/apps/member/src/hooks/queries/activity/index.ts
+++ b/apps/member/src/hooks/queries/activity/index.ts
@@ -8,11 +8,8 @@ export * from './useActivityGroupMemberMutation';
 export * from './useActivityGroupMember';
 export * from './useMyActivityGroupMember';
 export * from './useActivityPhoto';
-export * from './useActivityPhotoMutation';
 export * from './useActivityGroupMemberApplied';
 export * from './useActivityGroupMemberRoleMutation';
-export * from './useActivityGroupDeleteMutation';
-export * from './useActivityGroupStatusMutation';
 export * from './useActivityGroupAdminMutation';
 export * from './useActivityGroupBoardByParent';
 export * from './useActivityGroupMemberList';
diff --git a/apps/member/src/hooks/queries/book-loan/index.ts b/apps/member/src/hooks/queries/book-loan/index.ts
index 8e1153a7..ea0dcc3c 100644
--- a/apps/member/src/hooks/queries/book-loan/index.ts
+++ b/apps/member/src/hooks/queries/book-loan/index.ts
@@ -1,5 +1,3 @@
 export * from './useBookLoanExtendMutation';
-export * from './useBookLoanRecordApproveMutation';
 export * from './useBookLoanRecordConditions';
-export * from './useBookLoanRecordOverdue';
 export * from './useBookLoanReturnMutation';
diff --git a/apps/member/src/hooks/queries/schedule/index.ts b/apps/member/src/hooks/queries/schedule/index.ts
index 76355118..adcae9ab 100644
--- a/apps/member/src/hooks/queries/schedule/index.ts
+++ b/apps/member/src/hooks/queries/schedule/index.ts
@@ -1,2 +1 @@
 export * from './useSchedule';
-export * from './useScheduleMutation';
diff --git a/apps/member/src/hooks/queries/schedule/useScheduleMutation.ts b/apps/member/src/hooks/queries/schedule/useScheduleMutation.ts
deleted file mode 100644
index c213f1a0..00000000
--- a/apps/member/src/hooks/queries/schedule/useScheduleMutation.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-import { useMutation, useQueryClient } from '@tanstack/react-query';
-
-import { deleteSchedule, postSchedule } from '@api/schedule';
-import { SCHEDULE_QUERY_KEY } from '@constants/key';
-import useToast from '@hooks/common/useToast';
-
-/**
- * 일정을 추가합니다.
- */
-export function useScheduleMutation() {
-  const queryClient = useQueryClient();
-  const toast = useToast();
-
-  const mutation = useMutation({
-    mutationFn: postSchedule,
-    onSuccess: (data) => {
-      if (!data) {
-        return toast({
-          state: 'error',
-          message: '일정 추가를 실패했어요.',
-        });
-      }
-
-      queryClient.invalidateQueries({ queryKey: SCHEDULE_QUERY_KEY.ALL });
-      toast({
-        state: 'success',
-        message: '새로운 일정이 추가됐어요.',
-      });
-    },
-  });
-
-  return { scheduleMutate: mutation.mutate };
-}
-
-/**
- * 일정을 삭제합니다.
- */
-export function useScheduleDeleteMutation() {
-  const queryClient = useQueryClient();
-  const toast = useToast();
-
-  const mutation = useMutation({
-    mutationFn: deleteSchedule,
-    onSuccess: (data) => {
-      if (!data) {
-        return toast({
-          state: 'error',
-          message: '일정 삭제를 실패했어요.',
-        });
-      }
-
-      queryClient.invalidateQueries({ queryKey: SCHEDULE_QUERY_KEY.ALL });
-      toast({
-        state: 'success',
-        message: '해당 일정이 삭제됐어요.',
-      });
-    },
-  });
-
-  return { scheduleDeleteMutate: mutation.mutate };
-}
diff --git a/apps/member/src/pages/ManagePage/ManagePage.tsx b/apps/member/src/pages/ManagePage/ManagePage.tsx
deleted file mode 100644
index affc4b1a..00000000
--- a/apps/member/src/pages/ManagePage/ManagePage.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import { Suspense } from 'react';
-
-import Content from '@components/common/Content/Content';
-import Header from '@components/common/Header/Header';
-import ManageActivitySection from '@components/manage/ManageActivitySection/ManageActivitySection';
-import ManagerAlertSection from '@components/manage/ManageAlertSection/ManagerAlertSection';
-import ManageBannerSection from '@components/manage/ManageBannerSection/ManageBannerSection';
-import ManageCalendarSection from '@components/manage/ManageCalendarSection/ManageCalendarSection';
-import ManageLevelSection from '@components/manage/ManageLevelSection/ManageLevelSection';
-import ManageLibrarySection from '@components/manage/ManageLibrarySection/ManageLibrarySection';
-import { SupportHistorySection } from '@components/support/SupportHistorySection';
-
-import { ROLE_LEVEL } from '@constants/state';
-import { useMyProfile } from '@hooks/queries';
-
-const ManagePage = () => {
-  const { data } = useMyProfile();
-
-  if (data.roleLevel < ROLE_LEVEL.ADMIN) {
-    throw new Error('접근 권한이 없습니다.');
-  }
-
-  return (
-    <Content>
-      <Header title="관리" />
-      <Suspense>
-        <SupportHistorySection title="회비" withPagination hasPermission />
-      </Suspense>
-      <Suspense>
-        <ManageLibrarySection />
-      </Suspense>
-      <Suspense>
-        <ManagerAlertSection category="notice" />
-      </Suspense>
-      <Suspense>
-        <ManagerAlertSection category="organization" />
-      </Suspense>
-      <Suspense>
-        <ManageCalendarSection />
-      </Suspense>
-      <Suspense>
-        <ManageLevelSection />
-      </Suspense>
-      <Suspense>
-        <ManageActivitySection />
-      </Suspense>
-      <Suspense>
-        <ManageBannerSection />
-      </Suspense>
-    </Content>
-  );
-};
-
-export default ManagePage;
diff --git a/apps/member/src/components/manage/ManageActivitySection/ManageActivitySection.tsx b/apps/member/src/pages/ManagePage/components/ActivitySection.tsx
similarity index 74%
rename from apps/member/src/components/manage/ManageActivitySection/ManageActivitySection.tsx
rename to apps/member/src/pages/ManagePage/components/ActivitySection.tsx
index ce0a7dda..b562da7e 100644
--- a/apps/member/src/components/manage/ManageActivitySection/ManageActivitySection.tsx
+++ b/apps/member/src/pages/ManagePage/components/ActivitySection.tsx
@@ -1,33 +1,31 @@
-import { useState } from 'react';
-
 import { Menubar, Table } from '@clab-platforms/design-system';
 
 import ActionButton from '@components/common/ActionButton/ActionButton';
 import EmptyBox from '@components/common/EmptyBox/EmptyBox';
 import Pagination from '@components/common/Pagination/Pagination';
 import { Section } from '@components/common/Section';
-import { CheckConfirmModal } from '@components/modal';
 
 import { TABLE_HEAD } from '@constants/head';
 import { GROUP_MESSAGE } from '@constants/message';
 import { ACTIVITY_STATE } from '@constants/state';
-import { useModal } from '@hooks/common/useModal';
 import { usePagination } from '@hooks/common/usePagination';
-import {
-  useActivityGroupDeleteMutation,
-  useActivityGroupMember,
-  useActivityGroupStatusMutation,
-} from '@hooks/queries';
+import { useView } from '@hooks/common/useView';
+import { useActivityGroupMember } from '@hooks/queries';
 
 import type { ActivityGroupStatusType } from '@type/activity';
 
-import { ActivityInfoModal } from './ActivityInfoModal';
+import { useActivityGroupConfirmModal } from '../hooks/useActivityGroupConfirmModal';
+import { useActivityGroupDeleteMutation } from '../hooks/useActivityGroupDeleteMutation';
+import { useActivityGroupInfoModal } from '../hooks/useActivityGroupInfoModal';
+import { useActivityGroupStatusMutation } from '../hooks/useActivityGroupStatusMutation';
 
-const ManageActivitySection = () => {
-  const [mode, setMode] = useState<ActivityGroupStatusType>(
+export function ActivitySection() {
+  const { open: openActivityGroupInfoModal } = useActivityGroupInfoModal();
+  const { open: openActivityGroupConfirmModal } =
+    useActivityGroupConfirmModal();
+  const { view, handleViewClick } = useView<ActivityGroupStatusType>(
     ACTIVITY_STATE.WAITING,
   );
-  const { open, close } = useModal();
   const { page, size, handlePageChange } = usePagination({
     defaultSize: 6,
     sectionName: 'activity',
@@ -35,53 +33,38 @@ const ManageActivitySection = () => {
   const { activityGroupDeleteMutate } = useActivityGroupDeleteMutation();
   const { activityGroupStatusMutate } = useActivityGroupStatusMutation();
   const { data: groupData } = useActivityGroupMember({
-    status: mode,
+    status: view,
     page,
     size,
   });
 
   const handleInfoButtonClick = (groupId: number) => {
-    return open({
-      title: '그룹 정보',
-      content: <ActivityInfoModal id={groupId} />,
-    });
-  };
-
-  const handleMenubarItemClick = (mode: ActivityGroupStatusType) => {
-    setMode(mode);
+    return openActivityGroupInfoModal({ groupId });
   };
 
   const handleApproveButtonClick = (
     id: number,
     status: ActivityGroupStatusType,
   ) => {
-    open({
-      content: (
-        <CheckConfirmModal
-          message="승인하시겠습니까?"
-          handleConfirmButton={() => {
-            activityGroupStatusMutate({
-              activityGroupId: id,
-              activityGroupStatus: status,
-            });
-          }}
-          handleClose={close}
-        />
-      ),
+    openActivityGroupConfirmModal({
+      title: '활동',
+      content: '해당 활동을 승인하시겠습니까?',
+      onClick: () => {
+        activityGroupStatusMutate({
+          activityGroupId: id,
+          activityGroupStatus: status,
+        });
+      },
     });
   };
 
   const handleRejectButtonClick = (id: number) => {
-    open({
-      content: (
-        <CheckConfirmModal
-          message="거절하시겠습니까?"
-          handleConfirmButton={() => {
-            activityGroupDeleteMutate(id);
-          }}
-          handleClose={close}
-        />
-      ),
+    openActivityGroupConfirmModal({
+      title: '활동',
+      content: '해당 활동을 종료하시겠습니까?',
+      onClick: () => {
+        activityGroupDeleteMutate(id);
+      },
     });
   };
 
@@ -142,25 +125,19 @@ const ManageActivitySection = () => {
                 {leaders ? `${leaders[0].name} (${leaders[0].id})` : '-'}
               </Table.Cell>
               <Table.Cell className="space-x-2">
-                <ActionButton
-                  color="blue"
-                  onClick={() => handleInfoButtonClick(id)}
-                >
+                <ActionButton onClick={() => handleInfoButtonClick(id)}>
                   정보
                 </ActionButton>
-                <ActionButton
-                  color="red"
-                  onClick={() => handleRejectButtonClick(id)}
-                >
-                  삭제
+                <ActionButton onClick={() => handleRejectButtonClick(id)}>
+                  승인
                 </ActionButton>
                 <ActionButton
-                  color="green"
+                  color="red"
                   onClick={() =>
                     handleApproveButtonClick(id, ACTIVITY_STATE.END)
                   }
                 >
-                  종료
+                  거절
                 </ActionButton>
               </Table.Cell>
             </Table.Row>
@@ -210,7 +187,7 @@ const ManageActivitySection = () => {
         )}
       </Table>
     ),
-  }[mode];
+  }[view];
 
   return (
     <Section>
@@ -220,20 +197,20 @@ const ManageActivitySection = () => {
       >
         <Menubar>
           <Menubar.Item
-            selected={mode === ACTIVITY_STATE.WAITING}
-            onClick={() => handleMenubarItemClick(ACTIVITY_STATE.WAITING)}
+            selected={view === ACTIVITY_STATE.WAITING}
+            onClick={() => handleViewClick(ACTIVITY_STATE.WAITING)}
           >
             신청
           </Menubar.Item>
           <Menubar.Item
-            selected={mode === ACTIVITY_STATE.PROGRESSING}
-            onClick={() => handleMenubarItemClick(ACTIVITY_STATE.PROGRESSING)}
+            selected={view === ACTIVITY_STATE.PROGRESSING}
+            onClick={() => handleViewClick(ACTIVITY_STATE.PROGRESSING)}
           >
             진행중
           </Menubar.Item>
           <Menubar.Item
-            selected={mode === ACTIVITY_STATE.END}
-            onClick={() => handleMenubarItemClick(ACTIVITY_STATE.END)}
+            selected={view === ACTIVITY_STATE.END}
+            onClick={() => handleViewClick(ACTIVITY_STATE.END)}
           >
             종료
           </Menubar.Item>
@@ -251,6 +228,4 @@ const ManageActivitySection = () => {
       </Section.Body>
     </Section>
   );
-};
-
-export default ManageActivitySection;
+}
diff --git a/apps/member/src/pages/ManagePage/components/AlertSection.tsx b/apps/member/src/pages/ManagePage/components/AlertSection.tsx
new file mode 100644
index 00000000..f8ee4dcd
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/components/AlertSection.tsx
@@ -0,0 +1,137 @@
+import { useCallback, useMemo } from 'react';
+import { useNavigate } from 'react-router-dom';
+
+import { Menubar, Table } from '@clab-platforms/design-system';
+import { toDecodeHTMLEntities } from '@clab-platforms/utils';
+
+import ActionButton from '@components/common/ActionButton/ActionButton';
+import Pagination from '@components/common/Pagination/Pagination';
+import { Section } from '@components/common/Section';
+import CommunityBoardForm from '@components/community/CommunityBoardForm/CommunityBoardForm';
+
+import { SERVICE_NAME } from '@constants/environment';
+import { TABLE_HEAD, TABLE_HEAD_ACTION } from '@constants/head';
+import { PATH_FINDER } from '@constants/path';
+import { usePagination } from '@hooks/common/usePagination';
+import { useView } from '@hooks/common/useView';
+import { useDeleteModal } from '@hooks/modal/useDeleteModal';
+import { useBoardByCategory, useBoardDeleteMutation } from '@hooks/queries';
+import { getCategoryTitle } from '@utils/community';
+import { toYYMMDD } from '@utils/date';
+
+import type { CommunityCategoryType } from '@type/community';
+
+type ModeState = 'view' | 'add';
+
+interface Props {
+  category: CommunityCategoryType;
+}
+
+export function AlertSection({ category }: Props) {
+  const navigate = useNavigate();
+  const { open } = useDeleteModal();
+  const { boardDeleteMutate } = useBoardDeleteMutation();
+  const { data } = useBoardByCategory({
+    hasPermission: true,
+    category: category,
+  });
+
+  const { view, handleViewClick } = useView<ModeState>('view');
+  const { page, size, handlePageChange } = usePagination({
+    sectionName: category,
+  });
+
+  const title = getCategoryTitle(category);
+
+  const handleTableRowClick = useCallback(
+    (id: number) => {
+      navigate(PATH_FINDER.COMMUNITY_POST(category, id));
+    },
+    [category, navigate],
+  );
+
+  const handleDeleteButtonClick = useCallback(
+    (e: React.MouseEvent<HTMLButtonElement, MouseEvent>, id: number) => {
+      e.stopPropagation();
+      return open({
+        title: title,
+        onClick: () => boardDeleteMutate(id),
+      });
+    },
+    [boardDeleteMutate, open, title],
+  );
+
+  const renderView = useMemo(
+    () =>
+      ({
+        view: (
+          <Table head={[...TABLE_HEAD.COMMUNITY_DETAIL, TABLE_HEAD_ACTION]}>
+            {data.items.map(
+              ({ id, title, writerId, writerName, createdAt }) => (
+                <Table.Row
+                  key={id}
+                  className="text-nowrap text-center"
+                  onClick={() => handleTableRowClick(id)}
+                >
+                  <Table.Cell>{id}</Table.Cell>
+                  <Table.Cell className="w-full truncate text-left">
+                    {toDecodeHTMLEntities(title)}
+                  </Table.Cell>
+                  <Table.Cell>
+                    {writerId ? `${writerName} (${writerId})` : SERVICE_NAME}
+                  </Table.Cell>
+                  <Table.Cell>{toYYMMDD(createdAt)}</Table.Cell>
+                  <Table.Cell className="space-x-2">
+                    <ActionButton
+                      color="red"
+                      onClick={(e) => handleDeleteButtonClick(e, id)}
+                    >
+                      삭제
+                    </ActionButton>
+                  </Table.Cell>
+                </Table.Row>
+              ),
+            )}
+          </Table>
+        ),
+        add: <CommunityBoardForm category={category} />,
+      })[view],
+    [data.items, category, view, handleTableRowClick, handleDeleteButtonClick],
+  );
+
+  return (
+    <Section>
+      <Section.Header
+        title={title}
+        description={`${title}을 추가하거나 삭제할 수 있어요`}
+      >
+        <Menubar>
+          <Menubar.Item
+            selected={view === 'view'}
+            onClick={() => handleViewClick('view')}
+          >
+            보기
+          </Menubar.Item>
+          <Menubar.Item
+            selected={view === 'add'}
+            onClick={() => handleViewClick('add')}
+          >
+            추가
+          </Menubar.Item>
+        </Menubar>
+      </Section.Header>
+      <Section.Body>
+        {renderView}
+        {view === 'view' && (
+          <Pagination
+            className="mt-4 justify-center"
+            totalItems={data.totalItems}
+            postLimit={size}
+            onChange={handlePageChange}
+            page={page}
+          />
+        )}
+      </Section.Body>
+    </Section>
+  );
+}
diff --git a/apps/member/src/pages/ManagePage/components/BannerSection.tsx b/apps/member/src/pages/ManagePage/components/BannerSection.tsx
new file mode 100644
index 00000000..5748d712
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/components/BannerSection.tsx
@@ -0,0 +1,118 @@
+import { useState } from 'react';
+
+import { Button, Input, Menubar } from '@clab-platforms/design-system';
+
+import ActivityPhotoBanner from '@components/common/ActivityPhotoBanner/ActivityPhotoBanner';
+import { Section } from '@components/common/Section';
+import Uploader from '@components/common/Uploader/Uploader';
+
+import { PostActivityPhotoParams } from '@api/activity';
+import { ERROR_MESSAGE } from '@constants/message';
+import useToast from '@hooks/common/useToast';
+import { useView } from '@hooks/common/useView';
+
+import { useActivityPhotoMutation } from '../hooks/useActivityPhotoMutation';
+
+interface InputsState extends Pick<PostActivityPhotoParams, 'date' | 'title'> {
+  file?: File;
+}
+
+type View = 'VIEW' | 'ADD';
+
+export function BannerSection() {
+  const toast = useToast();
+  const { view, handleViewClick } = useView<View>('VIEW');
+  const { activityPhotoMutate } = useActivityPhotoMutation();
+
+  const [inputs, setInputs] = useState<InputsState>({
+    title: '',
+    date: '',
+    file: undefined,
+  });
+
+  const { title, date, file } = inputs;
+
+  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+    setInputs((prev) => ({
+      ...prev,
+      [e.target.name]: e.target.value,
+    }));
+  };
+
+  const handleFileAccepted = (file?: File) => {
+    setInputs((prev) => ({
+      ...prev,
+      file,
+    }));
+  };
+
+  const handleOnSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    if (!title || !date || !file) {
+      return toast({
+        state: 'error',
+        message: ERROR_MESSAGE.NO_DATA,
+      });
+    }
+    activityPhotoMutate({
+      title: title,
+      date: date,
+      file: file,
+    });
+  };
+
+  const renderView = {
+    VIEW: (
+      <form onSubmit={handleOnSubmit} className="space-y-2">
+        <Input
+          id="title"
+          name="title"
+          label="제목"
+          placeholder="제목을 입력해주세요."
+          value={title}
+          onChange={handleInputChange}
+        />
+        <Input
+          id="date"
+          name="date"
+          type="date"
+          label="날짜"
+          value={date}
+          onChange={handleInputChange}
+        />
+        <Uploader
+          label="사진"
+          accept="image/*"
+          onFileAccepted={handleFileAccepted}
+        />
+        <Button className="w-full">활동 사진 변경하기</Button>
+      </form>
+    ),
+    ADD: <ActivityPhotoBanner />,
+  }[view];
+
+  return (
+    <Section>
+      <Section.Header
+        title="활동 사진"
+        description="홈 화면에 있는 활동 사진을 변경할 수 있어요"
+      >
+        <Menubar>
+          <Menubar.Item
+            selected={view === 'VIEW'}
+            onClick={() => handleViewClick('VIEW')}
+          >
+            보기
+          </Menubar.Item>
+          <Menubar.Item
+            selected={view === 'ADD'}
+            onClick={() => handleViewClick('ADD')}
+          >
+            추가
+          </Menubar.Item>
+        </Menubar>
+      </Section.Header>
+      <Section.Body className="space-y-2">{renderView}</Section.Body>
+    </Section>
+  );
+}
diff --git a/apps/member/src/pages/ManagePage/components/CalendarSection.tsx b/apps/member/src/pages/ManagePage/components/CalendarSection.tsx
new file mode 100644
index 00000000..7001cffd
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/components/CalendarSection.tsx
@@ -0,0 +1,218 @@
+import { useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+
+import {
+  Button,
+  Grid,
+  Input,
+  Menubar,
+  Table,
+} from '@clab-platforms/design-system';
+import { toDecodeHTMLEntities } from '@clab-platforms/utils';
+
+import ActionButton from '@components/common/ActionButton/ActionButton';
+import Pagination from '@components/common/Pagination/Pagination';
+import { Section } from '@components/common/Section';
+import Textarea from '@components/common/Textarea/Textarea';
+
+import { TABLE_HEAD } from '@constants/head';
+import { PATH } from '@constants/path';
+import { usePagination } from '@hooks/common/usePagination';
+import useToast from '@hooks/common/useToast';
+import { useView } from '@hooks/common/useView';
+import { useDeleteModal } from '@hooks/modal/useDeleteModal';
+import { useSchedule } from '@hooks/queries';
+import { formattedDate, now } from '@utils/date';
+import { toPriorityText } from '@utils/string';
+
+import { useScheduleDeleteMutation } from '../hooks/useScheduleDeleteMutation';
+import { useScheduleMutation } from '../hooks/useScheduleMutation';
+
+type Mode = 'view' | 'add';
+
+export function CalendarSection() {
+  const navigate = useNavigate();
+  const { open } = useDeleteModal();
+  const { view, handleViewClick } = useView<Mode>('view');
+  const { page, size, handlePageChange } = usePagination({
+    sectionName: 'calendar',
+  });
+
+  const { data } = useSchedule({
+    // 오늘 기준으로 최근 1년 부터 ~ 이번달 까지
+    startDate: now().subtract(1, 'year').toString(),
+  });
+  const { mutate: scheduleDeleteMutate } = useScheduleDeleteMutation();
+
+  const handleDeleteButtonClick = (
+    e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+    id: number,
+  ) => {
+    e.stopPropagation();
+    return open({
+      title: '일정',
+      onClick: () => scheduleDeleteMutate(id),
+    });
+  };
+
+  const renderView = {
+    view: (
+      <Table head={TABLE_HEAD.CALENDAR_SCHEDULE}>
+        {data.items.map(
+          ({ id, title, startDateTime, endDateTime, priority }) => (
+            <Table.Row
+              key={id}
+              className="text-nowrap text-center"
+              onClick={() => navigate(PATH.CALENDER)}
+            >
+              <Table.Cell>{id}</Table.Cell>
+              <Table.Cell className="w-full truncate text-left">
+                {toDecodeHTMLEntities(title)}
+              </Table.Cell>
+              <Table.Cell>{formattedDate(startDateTime)}</Table.Cell>
+              <Table.Cell>{formattedDate(endDateTime)}</Table.Cell>
+              <Table.Cell>{toPriorityText(priority)}</Table.Cell>
+              <Table.Cell className="space-x-2">
+                <ActionButton
+                  color="red"
+                  onClick={(e) => handleDeleteButtonClick(e, id)}
+                >
+                  삭제
+                </ActionButton>
+              </Table.Cell>
+            </Table.Row>
+          ),
+        )}
+      </Table>
+    ),
+    add: <ScheduleForm onSubmit={() => handleViewClick('view')} />,
+  }[view];
+
+  return (
+    <Section>
+      <Section.Header
+        title="일정"
+        description="일정을 추가하거나 삭제할 수 있어요"
+      >
+        <Menubar>
+          <Menubar.Item
+            selected={view === 'view'}
+            onClick={() => handleViewClick('view')}
+          >
+            보기
+          </Menubar.Item>
+          <Menubar.Item
+            selected={view === 'add'}
+            onClick={() => handleViewClick('add')}
+          >
+            추가
+          </Menubar.Item>
+        </Menubar>
+      </Section.Header>
+      <Section.Body>
+        {renderView}
+        {view === 'view' && (
+          <Pagination
+            className="mt-4 justify-center"
+            totalItems={data.totalItems}
+            postLimit={size}
+            onChange={handlePageChange}
+            page={page}
+          />
+        )}
+      </Section.Body>
+    </Section>
+  );
+}
+
+interface ScheduleFormProps {
+  onSubmit: () => void;
+}
+
+export function ScheduleForm({ onSubmit }: ScheduleFormProps) {
+  const toast = useToast();
+  const [inputs, setInputs] = useState({
+    title: '',
+    detail: '',
+    startDateTime: '',
+    endDateTime: '',
+  });
+
+  const { mutate: scheduleMutate } = useScheduleMutation();
+
+  const { title, detail, startDateTime, endDateTime } = inputs;
+
+  const handleInputsChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
+  ) => {
+    setInputs((prev) => ({
+      ...prev,
+      [e.target.name]: e.target.value,
+    }));
+  };
+
+  const handleSubmitClick = () => {
+    if (!title || !detail || !startDateTime || !endDateTime) {
+      return toast({
+        state: 'error',
+        message: '모든 항목을 입력해주세요.',
+      });
+    }
+    scheduleMutate(
+      {
+        scheduleType: 'ALL',
+        title,
+        detail,
+        startDateTime,
+        endDateTime,
+        priority: 'HIGH',
+      },
+      {
+        onSuccess: () => onSubmit(),
+      },
+    );
+  };
+
+  return (
+    <div className="space-y-2">
+      <Input
+        label="일정명"
+        id="title"
+        name="title"
+        placeholder="일정명을 입력해주세요."
+        value={title}
+        onChange={handleInputsChange}
+      />
+      <Textarea
+        label="내용"
+        id="detail"
+        name="detail"
+        placeholder="내용을 입력해주세요."
+        maxLength={200}
+        value={detail}
+        onChange={handleInputsChange}
+      />
+      <Grid gap="md" col="2">
+        <Input
+          label="시작일"
+          type="datetime-local"
+          id="startDateTime"
+          name="startDateTime"
+          value={startDateTime}
+          onChange={handleInputsChange}
+        />
+        <Input
+          label="마감일"
+          type="datetime-local"
+          id="endDateTime"
+          name="endDateTime"
+          value={endDateTime}
+          onChange={handleInputsChange}
+        />
+      </Grid>
+      <Button className="w-full" onClick={handleSubmitClick}>
+        일정 추가하기
+      </Button>
+    </div>
+  );
+}
diff --git a/apps/member/src/components/manage/ManageLibrarySection/ManageLibrarySection.tsx b/apps/member/src/pages/ManagePage/components/LibrarySection.tsx
similarity index 85%
rename from apps/member/src/components/manage/ManageLibrarySection/ManageLibrarySection.tsx
rename to apps/member/src/pages/ManagePage/components/LibrarySection.tsx
index 374ac469..70f546c1 100644
--- a/apps/member/src/components/manage/ManageLibrarySection/ManageLibrarySection.tsx
+++ b/apps/member/src/pages/ManagePage/components/LibrarySection.tsx
@@ -6,25 +6,23 @@ import ActionButton from '@components/common/ActionButton/ActionButton';
 import Pagination from '@components/common/Pagination/Pagination';
 import { Section } from '@components/common/Section';
 import BookLoanConditionStatusBadge from '@components/library/BookLoanConditionStatusBadge';
-import { MemberInfoModal } from '@components/modal';
 
 import { TABLE_HEAD } from '@constants/head';
-import { useModal } from '@hooks/common/useModal';
 import { usePagination } from '@hooks/common/usePagination';
-import {
-  useBookLoanRecordApproveMutation,
-  useBookLoanRecordConditions,
-  useBookLoanRecordOverdue,
-} from '@hooks/queries';
+import { useBookLoanRecordConditions } from '@hooks/queries';
 import { calculateDDay, formattedDate } from '@utils/date';
 
+import { useBookLoanRecordApproveMutation } from '../hooks/useBookLoanRecordApproveMutation';
+import { useBookLoanRecordOverdue } from '../hooks/useBookLoanRecordOverdue';
+import { useMemberInfoModal } from '../hooks/useMemberInfoModal';
+
 type Mode = 'condition' | 'overdue';
 
-const ManageLibrarySection = () => {
+export function LibrarySection() {
+  const { open } = useMemberInfoModal();
   const { page, size, handlePageChange } = usePagination({
     sectionName: 'library',
   });
-  const { open } = useModal();
 
   const [mode, setMode] = useState<Mode>('condition');
 
@@ -48,11 +46,8 @@ const ManageLibrarySection = () => {
     bookLoanRecordApproveMutate(id);
   };
 
-  const handleContactButtonClick = (id: string) => {
-    return open({
-      title: '멤버 정보',
-      content: <MemberInfoModal id={id} />,
-    });
+  const handleMemberInfoClick = (memberId: string) => {
+    open({ memberId: memberId });
   };
 
   const renderMode = {
@@ -87,9 +82,7 @@ const ManageLibrarySection = () => {
                     승인
                   </ActionButton>
                 )}
-                <ActionButton
-                  onClick={() => handleContactButtonClick(borrowerId)}
-                >
+                <ActionButton onClick={() => handleMemberInfoClick(borrowerId)}>
                   정보
                 </ActionButton>
               </Table.Cell>
@@ -109,9 +102,7 @@ const ManageLibrarySection = () => {
               <Table.Cell>{formattedDate(dueDate)}</Table.Cell>
               <Table.Cell>{calculateDDay(dueDate)}</Table.Cell>
               <Table.Cell>
-                <ActionButton
-                  onClick={() => handleContactButtonClick(borrowerId)}
-                >
+                <ActionButton onClick={() => handleMemberInfoClick(borrowerId)}>
                   정보
                 </ActionButton>
               </Table.Cell>
@@ -159,6 +150,4 @@ const ManageLibrarySection = () => {
       </Section.Body>
     </Section>
   );
-};
-
-export default ManageLibrarySection;
+}
diff --git a/apps/member/src/components/manage/ManageLevelSection/ManageLevelSection.tsx b/apps/member/src/pages/ManagePage/components/MemberRoleSection.tsx
similarity index 74%
rename from apps/member/src/components/manage/ManageLevelSection/ManageLevelSection.tsx
rename to apps/member/src/pages/ManagePage/components/MemberRoleSection.tsx
index 677de193..2606246a 100644
--- a/apps/member/src/components/manage/ManageLevelSection/ManageLevelSection.tsx
+++ b/apps/member/src/pages/ManagePage/components/MemberRoleSection.tsx
@@ -6,23 +6,26 @@ import { Section } from '@components/common/Section';
 import AddMemberForm from '@components/manage/ManageLevelSection/AddMemberForm.tsx';
 import RoleEditView from '@components/manage/ManageLevelSection/RoleEditView.tsx';
 
+import { useView } from '@hooks/common/useView';
 import { Suspense } from '@suspensive/react';
 
-import { Mode, Role } from '@type/manage.ts';
+import { Role } from '@type/manage.ts';
 
-const ManageLevelSection = () => {
+type View = 'view' | 'add';
+
+export function MemberRoleSection() {
   const [role, setRole] = useState<Role>('');
-  const [mode, setMode] = useState<Mode>('view');
+  const { view, setView, handleViewClick } = useView<View>('view');
 
   const handleMenubarItemClick = (role: Role) => {
     setRole(role);
-    setMode('view');
+    setView('view');
   };
 
   const renderView = {
     view: <RoleEditView role={role} />,
     add: <AddMemberForm />,
-  }[mode];
+  }[view];
 
   return (
     <Section>
@@ -32,32 +35,32 @@ const ManageLevelSection = () => {
       >
         <Menubar>
           <Menubar.Item
-            selected={role === '' && mode === 'view'}
+            selected={role === '' && view === 'view'}
             onClick={() => handleMenubarItemClick('')}
           >
             전체
           </Menubar.Item>
           <Menubar.Item
-            selected={role === 'SUPER' && mode === 'view'}
+            selected={role === 'SUPER' && view === 'view'}
             onClick={() => handleMenubarItemClick('SUPER')}
           >
             관리자
           </Menubar.Item>
           <Menubar.Item
-            selected={role === 'ADMIN' && mode === 'view'}
+            selected={role === 'ADMIN' && view === 'view'}
             onClick={() => handleMenubarItemClick('ADMIN')}
           >
             운영진
           </Menubar.Item>
           <Menubar.Item
-            selected={role === 'USER' && mode === 'view'}
+            selected={role === 'USER' && view === 'view'}
             onClick={() => handleMenubarItemClick('USER')}
           >
             일반
           </Menubar.Item>
           <Menubar.Item
-            selected={mode === 'add'}
-            onClick={() => setMode('add')}
+            selected={view === 'add'}
+            onClick={() => handleViewClick('add')}
           >
             추가
           </Menubar.Item>
@@ -76,6 +79,4 @@ const ManageLevelSection = () => {
       </Section.Body>
     </Section>
   );
-};
-
-export default ManageLevelSection;
+}
diff --git a/apps/member/src/pages/ManagePage/hooks/useActivityGroupConfirmModal.tsx b/apps/member/src/pages/ManagePage/hooks/useActivityGroupConfirmModal.tsx
new file mode 100644
index 00000000..afa4f6e7
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/hooks/useActivityGroupConfirmModal.tsx
@@ -0,0 +1,31 @@
+import { type ReactNode, useMemo } from 'react';
+
+import { UseModalResult, useModal } from '@hooks/common/useModal';
+
+interface Options {
+  title: string;
+  content: ReactNode;
+  onClick: () => void;
+}
+
+/**
+ * 멤버 정보 모달을 엽니다.
+ */
+export function useActivityGroupConfirmModal(): UseModalResult<Options> {
+  const { open } = useModal();
+
+  return useMemo(
+    () => ({
+      open: ({ title, content, onClick }: Options) =>
+        open({
+          title: title,
+          content: content,
+          accept: {
+            text: '확인',
+            onClick: onClick,
+          },
+        }),
+    }),
+    [open],
+  );
+}
diff --git a/apps/member/src/hooks/queries/activity/useActivityGroupDeleteMutation.ts b/apps/member/src/pages/ManagePage/hooks/useActivityGroupDeleteMutation.ts
similarity index 100%
rename from apps/member/src/hooks/queries/activity/useActivityGroupDeleteMutation.ts
rename to apps/member/src/pages/ManagePage/hooks/useActivityGroupDeleteMutation.ts
diff --git a/apps/member/src/components/manage/ManageActivitySection/ActivityInfoModal.tsx b/apps/member/src/pages/ManagePage/hooks/useActivityGroupInfoModal.tsx
similarity index 66%
rename from apps/member/src/components/manage/ManageActivitySection/ActivityInfoModal.tsx
rename to apps/member/src/pages/ManagePage/hooks/useActivityGroupInfoModal.tsx
index 59bedf1f..59a03795 100644
--- a/apps/member/src/components/manage/ManageActivitySection/ActivityInfoModal.tsx
+++ b/apps/member/src/pages/ManagePage/hooks/useActivityGroupInfoModal.tsx
@@ -1,31 +1,39 @@
+import { useMemo } from 'react';
+
 import { DetailsList } from '@clab-platforms/design-system';
 
 import Image from '@components/common/Image/Image';
 
+import { UseModalResult, useModal } from '@hooks/common/useModal';
 import { useActivityGroup } from '@hooks/queries';
 import { createImageUrl } from '@utils/api';
 
-interface MemberInfoModalProps {
-  id: number;
-}
-interface LongTextItemProps {
-  label: string;
-  text?: string;
+interface Options {
+  groupId: number;
 }
 
-const LongTextItem = ({ label, text }: LongTextItemProps) => {
-  return (
-    <li className="flex justify-between gap-4">
-      <span>{label}</span>
-      <span className="text-right font-semibold">{text || '-'}</span>
-    </li>
+/**
+ * 멤버 정보 모달을 엽니다.
+ */
+export function useActivityGroupInfoModal(): UseModalResult<Options> {
+  const { open } = useModal();
+
+  return useMemo(
+    () => ({
+      open: (options: Options) =>
+        open({
+          title: '그룹 정보',
+          content: <ActivityGroupInfoModal {...options} />,
+        }),
+    }),
+    [open],
   );
-};
+}
 
-export const ActivityInfoModal = ({ id }: MemberInfoModalProps) => {
-  const { data, isLoading } = useActivityGroup(+id);
+interface Props extends Options {}
 
-  if (isLoading) return null;
+function ActivityGroupInfoModal({ groupId }: Props) {
+  const { data } = useActivityGroup(groupId);
 
   const { imageUrl, name, content, category, subject, curriculum, techStack } =
     data;
@@ -50,4 +58,18 @@ export const ActivityInfoModal = ({ id }: MemberInfoModalProps) => {
       </DetailsList>
     </div>
   );
+}
+
+interface LongTextItemProps {
+  label: string;
+  text?: string;
+}
+
+const LongTextItem = ({ label, text }: LongTextItemProps) => {
+  return (
+    <li className="flex justify-between gap-4">
+      <span>{label}</span>
+      <span className="text-right font-semibold">{text ?? '-'}</span>
+    </li>
+  );
 };
diff --git a/apps/member/src/hooks/queries/activity/useActivityGroupStatusMutation.ts b/apps/member/src/pages/ManagePage/hooks/useActivityGroupStatusMutation.ts
similarity index 100%
rename from apps/member/src/hooks/queries/activity/useActivityGroupStatusMutation.ts
rename to apps/member/src/pages/ManagePage/hooks/useActivityGroupStatusMutation.ts
diff --git a/apps/member/src/hooks/queries/activity/useActivityPhotoMutation.ts b/apps/member/src/pages/ManagePage/hooks/useActivityPhotoMutation.ts
similarity index 100%
rename from apps/member/src/hooks/queries/activity/useActivityPhotoMutation.ts
rename to apps/member/src/pages/ManagePage/hooks/useActivityPhotoMutation.ts
diff --git a/apps/member/src/hooks/queries/book-loan/useBookLoanRecordApproveMutation.ts b/apps/member/src/pages/ManagePage/hooks/useBookLoanRecordApproveMutation.ts
similarity index 100%
rename from apps/member/src/hooks/queries/book-loan/useBookLoanRecordApproveMutation.ts
rename to apps/member/src/pages/ManagePage/hooks/useBookLoanRecordApproveMutation.ts
diff --git a/apps/member/src/hooks/queries/book-loan/useBookLoanRecordOverdue.ts b/apps/member/src/pages/ManagePage/hooks/useBookLoanRecordOverdue.ts
similarity index 100%
rename from apps/member/src/hooks/queries/book-loan/useBookLoanRecordOverdue.ts
rename to apps/member/src/pages/ManagePage/hooks/useBookLoanRecordOverdue.ts
diff --git a/apps/member/src/components/modal/MemberInfoModal.tsx b/apps/member/src/pages/ManagePage/hooks/useMemberInfoModal.tsx
similarity index 56%
rename from apps/member/src/components/modal/MemberInfoModal.tsx
rename to apps/member/src/pages/ManagePage/hooks/useMemberInfoModal.tsx
index c146f43c..25b499bb 100644
--- a/apps/member/src/components/modal/MemberInfoModal.tsx
+++ b/apps/member/src/pages/ManagePage/hooks/useMemberInfoModal.tsx
@@ -1,19 +1,40 @@
+import { useMemo } from 'react';
+
 import { DetailsList } from '@clab-platforms/design-system';
 
 import Image from '@components/common/Image/Image';
 
+import { UseModalResult, useModal } from '@hooks/common/useModal';
 import { useMembers } from '@hooks/queries/useMembers';
 import { createImageUrl } from '@utils/api';
 import { formattedDate } from '@utils/date';
 
-interface MemberInfoModalProps {
-  id: string;
+interface Options {
+  memberId: string;
+}
+
+/**
+ * 멤버 정보 모달을 엽니다.
+ */
+export function useMemberInfoModal(): UseModalResult<Options> {
+  const { open } = useModal();
+
+  return useMemo(
+    () => ({
+      open: (options: Options) =>
+        open({
+          title: '멤버 정보',
+          content: <MemberInfoModal {...options} />,
+        }),
+    }),
+    [open],
+  );
 }
 
-export const MemberInfoModal = ({ id }: MemberInfoModalProps) => {
-  const { data, isLoading } = useMembers({ id });
+interface Props extends Options {}
 
-  if (isLoading) return null;
+function MemberInfoModal({ memberId }: Props) {
+  const { data } = useMembers({ id: memberId });
 
   const { imageUrl, name, grade, contact, email, createdAt } = data.items[0];
 
@@ -23,7 +44,7 @@ export const MemberInfoModal = ({ id }: MemberInfoModalProps) => {
         <Image src={createImageUrl(imageUrl)} alt={name} />
       </div>
       <DetailsList>
-        <DetailsList.Item label="이름(학번)">{`${name}(${id})`}</DetailsList.Item>
+        <DetailsList.Item label="이름 (학번)">{`${name} (${memberId})`}</DetailsList.Item>
         <DetailsList.Item label="학년">{grade}</DetailsList.Item>
         <DetailsList.Item label="연락처">{contact}</DetailsList.Item>
         <DetailsList.Item label="이메일">{email}</DetailsList.Item>
@@ -33,4 +54,4 @@ export const MemberInfoModal = ({ id }: MemberInfoModalProps) => {
       </DetailsList>
     </div>
   );
-};
+}
diff --git a/apps/member/src/pages/ManagePage/hooks/useScheduleDeleteMutation.ts b/apps/member/src/pages/ManagePage/hooks/useScheduleDeleteMutation.ts
new file mode 100644
index 00000000..5c1fed7f
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/hooks/useScheduleDeleteMutation.ts
@@ -0,0 +1,32 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+
+import { deleteSchedule } from '@api/schedule';
+import { SCHEDULE_QUERY_KEY } from '@constants/key';
+import useToast from '@hooks/common/useToast';
+
+/**
+ * 일정을 삭제합니다.
+ */
+export function useScheduleDeleteMutation() {
+  const queryClient = useQueryClient();
+  const toast = useToast();
+
+  return useMutation({
+    mutationFn: deleteSchedule,
+    onSuccess: (data) => {
+      if (!data) {
+        return toast({
+          state: 'error',
+          message: '일정 삭제를 실패했어요.',
+        });
+      } else {
+        toast({
+          state: 'success',
+          message: '해당 일정이 삭제됐어요.',
+        });
+      }
+
+      queryClient.invalidateQueries({ queryKey: SCHEDULE_QUERY_KEY.ALL });
+    },
+  });
+}
diff --git a/apps/member/src/pages/ManagePage/hooks/useScheduleMutation.ts b/apps/member/src/pages/ManagePage/hooks/useScheduleMutation.ts
new file mode 100644
index 00000000..a2b7472e
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/hooks/useScheduleMutation.ts
@@ -0,0 +1,31 @@
+import { useMutation, useQueryClient } from '@tanstack/react-query';
+
+import { postSchedule } from '@api/schedule';
+import { SCHEDULE_QUERY_KEY } from '@constants/key';
+import useToast from '@hooks/common/useToast';
+
+/**
+ * 일정을 추가합니다.
+ */
+export function useScheduleMutation() {
+  const queryClient = useQueryClient();
+  const toast = useToast();
+
+  return useMutation({
+    mutationFn: postSchedule,
+    onSuccess: (data) => {
+      if (!data) {
+        return toast({
+          state: 'error',
+          message: '일정 추가를 실패했어요.',
+        });
+      }
+
+      queryClient.invalidateQueries({ queryKey: SCHEDULE_QUERY_KEY.ALL });
+      toast({
+        state: 'success',
+        message: '새로운 일정이 추가됐어요.',
+      });
+    },
+  });
+}
diff --git a/apps/member/src/pages/ManagePage/index.tsx b/apps/member/src/pages/ManagePage/index.tsx
new file mode 100644
index 00000000..541df012
--- /dev/null
+++ b/apps/member/src/pages/ManagePage/index.tsx
@@ -0,0 +1,77 @@
+import { Suspense } from 'react';
+
+import { QueryErrorResetBoundary } from '@tanstack/react-query';
+
+import Content from '@components/common/Content/Content';
+import ErrorSection from '@components/common/ErrorSection/ErrorSection';
+import Header from '@components/common/Header/Header';
+import { SupportHistorySection } from '@components/support/SupportHistorySection';
+
+import { ROLE_LEVEL } from '@constants/state';
+import { useMyProfile } from '@hooks/queries';
+import { ErrorBoundary } from '@suspensive/react';
+
+import { ActivitySection } from './components/ActivitySection';
+import { AlertSection } from './components/AlertSection';
+import { BannerSection } from './components/BannerSection';
+import { CalendarSection } from './components/CalendarSection';
+import { LibrarySection } from './components/LibrarySection';
+import { MemberRoleSection } from './components/MemberRoleSection';
+
+export default function ManagePage() {
+  const { data } = useMyProfile();
+
+  if (data.roleLevel < ROLE_LEVEL.ADMIN) {
+    throw new Error('접근 권한이 없습니다.');
+  }
+
+  return (
+    <QueryErrorResetBoundary>
+      {({ reset }) => (
+        <ErrorBoundary
+          onReset={reset}
+          fallback={({ reset }) => <ErrorSection reset={reset} />}
+        >
+          <Content>
+            <Header title="관리" />
+            <Suspense>
+              <SupportHistorySection
+                title="회비"
+                withPagination
+                hasPermission
+              />
+            </Suspense>
+
+            <Suspense>
+              <LibrarySection />
+            </Suspense>
+
+            <Suspense>
+              <AlertSection category="notice" />
+            </Suspense>
+
+            <Suspense>
+              <AlertSection category="organization" />
+            </Suspense>
+
+            <Suspense>
+              <CalendarSection />
+            </Suspense>
+
+            <Suspense>
+              <MemberRoleSection />
+            </Suspense>
+
+            <Suspense>
+              <ActivitySection />
+            </Suspense>
+
+            <Suspense>
+              <BannerSection />
+            </Suspense>
+          </Content>
+        </ErrorBoundary>
+      )}
+    </QueryErrorResetBoundary>
+  );
+}
diff --git a/apps/member/src/pages/MyPage/index.tsx b/apps/member/src/pages/MyPage/index.tsx
index 0ea04574..af5645ea 100644
--- a/apps/member/src/pages/MyPage/index.tsx
+++ b/apps/member/src/pages/MyPage/index.tsx
@@ -28,16 +28,20 @@ export default function MyPage() {
               <Suspense>
                 <ProfileSection />
               </Suspense>
+
               <Suspense>
                 <HistorySection category="지난 알림" />
               </Suspense>
+
               <Grid gap="md" className="md:grid-cols-2">
                 <MembershipHistorySection />
                 <HistorySection category="도서 대출 내역" />
               </Grid>
+
               <Suspense>
                 <ActivityGroupSection />
               </Suspense>
+
               <Suspense>
                 <Grid gap="md" className="md:grid-cols-2">
                   <HistorySection category="나의 게시글" />
diff --git a/apps/member/src/pages/Routes.tsx b/apps/member/src/pages/Routes.tsx
index a226d791..e9b12b96 100644
--- a/apps/member/src/pages/Routes.tsx
+++ b/apps/member/src/pages/Routes.tsx
@@ -45,7 +45,7 @@ const CalendarPage = lazy(() => import('@pages/CalendarPage'));
 const LoginPage = lazy(() => import('@pages/LoginPage'));
 const AuthPage = lazy(() => import('@pages/AuthPage'));
 const BlogPage = lazy(() => import('@pages/BlogPage'));
-const ManagePage = lazy(() => import('@pages/ManagePage/ManagePage'));
+const ManagePage = lazy(() => import('@pages/ManagePage'));
 
 const router = createBrowserRouter([
   {
diff --git a/apps/member/src/pages/SupportPage/index.tsx b/apps/member/src/pages/SupportPage/index.tsx
index ce51adcc..59820a3f 100644
--- a/apps/member/src/pages/SupportPage/index.tsx
+++ b/apps/member/src/pages/SupportPage/index.tsx
@@ -27,6 +27,7 @@ export default function SupportPage() {
             <Header title="회비" />
             <IntroduceSection />
             <RequestSection />
+
             <Suspense fallback={<SupportHistorySectionSkeleton />}>
               <SupportHistorySection />
             </Suspense>
diff --git a/apps/member/src/types/activity.ts b/apps/member/src/types/activity.ts
index a4bd3da2..40aa1ae7 100644
--- a/apps/member/src/types/activity.ts
+++ b/apps/member/src/types/activity.ts
@@ -10,14 +10,19 @@ import type { ResponseFile } from './api';
 
 export type MemberStatusType =
   (typeof ACTIVITY_MEMBER_STATE)[keyof typeof ACTIVITY_MEMBER_STATE];
+
 export type ActivityGroupBoardCategoryType =
   (typeof ACTIVITY_BOARD_CATEGORY_STATE)[keyof typeof ACTIVITY_BOARD_CATEGORY_STATE];
+
 export type ActivityGroupCategoryType =
   (typeof SELECT_ACTIVITY_GROUP_CATEGORY_TYPE)[keyof typeof SELECT_ACTIVITY_GROUP_CATEGORY_TYPE];
+
 export type ActivityMemberRoleType =
   (typeof ACTIVITY_MEMBER_ROLE)[keyof typeof ACTIVITY_MEMBER_ROLE];
+
 export type ActivityGroupStatusType =
   (typeof ACTIVITY_STATE)[keyof typeof ACTIVITY_STATE];
+
 type LeaderType = {
   id: string;
   name: string;
diff --git a/apps/member/src/types/manage.ts b/apps/member/src/types/manage.ts
index 81046c66..f158cf79 100644
--- a/apps/member/src/types/manage.ts
+++ b/apps/member/src/types/manage.ts
@@ -3,8 +3,6 @@ manage 섹션에서 사용되는 타입입니다.
  */
 export type Role = '' | 'ADMIN' | 'USER' | 'SUPER';
 
-export type Mode = 'view' | 'add';
-
 export interface AddMemberRequestType {
   id: string;
   password: string;