diff --git a/src/containers/common/Header/const/pathData.tsx b/src/containers/common/Header/const/pathData.tsx
index 3a557117..265d2faf 100644
--- a/src/containers/common/Header/const/pathData.tsx
+++ b/src/containers/common/Header/const/pathData.tsx
@@ -11,11 +11,11 @@ export const menuItems = {
     },
   ],
   학교생활: [
-    { name: '공지사항', path: '/notice?category=central&sub-category=all' },
+    { name: '공지사항', path: '/notice' },
     // { name: '일정', path: '/menu7' },
     { name: '제휴안내', path: '/partnership' },
     { name: '분실물게시판', path: '/lost-article?category=state' },
-    { name: '캠퍼스맵', path: '/campus' },
+    { name: '캠퍼스맵', path: '/campus-map' },
   ],
   학생자치기구: [
     // { name: '산하기구', path: '/affiliated_organization' },
diff --git a/src/pages/audit/component/AuditContent.tsx b/src/pages/audit/component/AuditContent.tsx
deleted file mode 100644
index 1df60a93..00000000
--- a/src/pages/audit/component/AuditContent.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-import { useNavigate } from 'react-router-dom';
-import { PostCardBasic } from '@/components/PostCard/PostCardBasicMissing';
-import { formatYYYYMMDD } from '@/utils/formatYYYYMMDD';
-import { Size } from '@/components/PostCard/const/state';
-import { useEffect, useState } from 'react';
-import { useResponseBoard } from '@/hooks/useResponseBoard';
-import { handleCardClick } from '../utils/cardHandler';
-import auditLogo from '@/assets/image/logo/audit_logo.png';
-import AuditContentLoading from './AuditContentLoading';
-
-interface AuditContentProps {
-  initPosts?: Array<{
-    postId: number;
-    title: string;
-    content: string;
-    category: string;
-    date: string;
-    thumbNail: string | null;
-    status: string | null;
-  }>;
-  className?: string;
-  isLoading: boolean;
-}
-
-export function AuditContent({ initPosts, isLoading }: AuditContentProps) {
-  const navigate = useNavigate();
-  const { size } = useResponseBoard();
-  const screenWidth: number = window.innerWidth;
-  const [posts, setPosts] = useState(initPosts);
-
-  useEffect(() => {
-    setPosts(initPosts);
-  }, [initPosts]);
-
-  if (isLoading) {
-    return <AuditContentLoading screenWidth={screenWidth} />;
-  } else {
-    if (!posts || posts.length === 0) {
-      return (
-        <div className="flex h-[32rem] w-full items-center justify-center text-gray-600">등록된 게시물이 없습니다</div>
-      );
-    }
-    if (screenWidth >= 1920) {
-      return (
-        <div className="flex flex-col justify-between">
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(0, 3).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(3, 6).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between">
-            {posts.slice(6, 9).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-        </div>
-      );
-    } else if (screenWidth >= 1440 && screenWidth < 1920) {
-      return (
-        <div className="flex flex-col justify-between">
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(0, 2).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(2, 4).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between">
-            {posts.slice(4, 6).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-        </div>
-      );
-    } else {
-      return (
-        <div className="flex flex-col justify-between">
-          {posts.map((post) => (
-            <RenderCard key={post.postId} post={post} size={size} />
-          ))}
-        </div>
-      );
-    }
-  }
-
-  function RenderCard({
-    post,
-    size,
-  }: {
-    post: {
-      postId: number;
-      title: string;
-      content: string;
-      date: string;
-      thumbNail: string | null;
-      status: string | null;
-      category: string;
-    };
-    size: Size;
-  }) {
-    const formattedDate = post.date ? formatYYYYMMDD(post.date) : '';
-    const status = post.status === '새로운' ? 'New' : 'Default';
-    const thumbnail = post.thumbNail || undefined;
-
-    return (
-      <div key={post.postId} className="xs-pb[20px] sm:pb-[20px] md:pb-[20px] lg:pb-[20px]">
-        <PostCardBasic
-          size={size}
-          imgUrl={thumbnail}
-          title={post.title}
-          subtitle={post.content}
-          date={formattedDate}
-          badgeType={status}
-          profileImg={auditLogo}
-          profileName={'중앙감사위원회 한빛'}
-          className="cursor-pointer"
-          onClick={() => handleCardClick(post.postId.toString(), post.postId, navigate)}
-        />
-      </div>
-    );
-  }
-}
diff --git a/src/pages/audit/component/AuditContentLoading.tsx b/src/pages/audit/component/AuditContentLoading.tsx
deleted file mode 100644
index ff4974a1..00000000
--- a/src/pages/audit/component/AuditContentLoading.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import { Skeleton } from '@/components/ui/skeleton';
-
-interface AuditContentLoadingProps {
-  screenWidth: number;
-}
-
-export default function AuditContentLoading({ screenWidth }: AuditContentLoadingProps) {
-  const emptyFive = Array(5).fill(null);
-  const emptyThree = Array(3).fill(null);
-  const emptyTwo = Array(2).fill(null);
-  if (screenWidth >= 1920) {
-    return (
-      <div className="flex flex-col justify-between">
-        {emptyThree.map((_, index) => (
-          <div key={index} className="flex flex-row justify-between pb-[30px]">
-            {emptyThree.map((_, i) => (
-              <Skeleton key={i} className="h-[209px] min-w-[400px] px-[16px] py-[16px]" />
-            ))}
-          </div>
-        ))}
-      </div>
-    );
-  } else if (screenWidth >= 1440 && screenWidth < 1920) {
-    return (
-      <div className="flex flex-col justify-between">
-        {emptyThree.map((_, index) => (
-          <div key={index} className="flex flex-row justify-between pb-[30px]">
-            {emptyTwo.map((_, i) => (
-              <Skeleton key={i} className="h-[209px] min-w-[400px] px-[16px] py-[16px]" />
-            ))}
-          </div>
-        ))}
-      </div>
-    );
-  } else {
-    return (
-      <div className="flex flex-col justify-between">
-        {emptyFive.map((_, index) => (
-          <Skeleton key={index} className="h-[10.69rem] w-full px-5 py-[1.44rem]" />
-        ))}
-      </div>
-    );
-  }
-}
diff --git a/src/pages/audit/page.tsx b/src/pages/audit/page.tsx
index 677ee296..81358581 100644
--- a/src/pages/audit/page.tsx
+++ b/src/pages/audit/page.tsx
@@ -1,11 +1,11 @@
 import { HeadLayout } from '@/template/HeadLayout';
 import { BodyLayout } from '@/template/BodyLayout';
-import { AuditContent } from './component/AuditContent';
 import { IntroNavSection } from '../intro/container/IntroNavSection';
 import { BoardSelector } from '@/components/Board/BoardSelector';
 import { useAuditBoard } from './hooks/useAuditBoard';
 import { categoryMap } from './const/data';
 import { useNavigate } from 'react-router-dom';
+import { BoardContent } from '@/template/board/BoardContent';
 
 export function AuditPage() {
   const boardCode = '감사기구게시판';
@@ -44,7 +44,7 @@ export function AuditPage() {
             }}
           />
         }
-        children={<AuditContent initPosts={data?.data.postListResDto} isLoading={isLoading} />}
+        children={<BoardContent data={data?.data.postListResDto} boardName="감사기구게시판" isLoading={isLoading} />}
         totalPages={totalPages}
         currentPage={currentPage}
         onPageChange={handlePageChange}
diff --git a/src/pages/lost-article/component/lostContent.tsx b/src/pages/lost-article/component/lostContent.tsx
deleted file mode 100644
index 4b8154c5..00000000
--- a/src/pages/lost-article/component/lostContent.tsx
+++ /dev/null
@@ -1,109 +0,0 @@
-import { useNavigate } from 'react-router-dom';
-import { PostCardMissing } from '@/components/PostCard/PostCardBasicMissing';
-import { formatYYYYMMDD } from '@/utils/formatYYYYMMDD';
-import { Size } from '@/components/PostCard/const/state';
-import { useEffect, useState } from 'react';
-import { useResponseBoard } from '@/hooks/useResponseBoard';
-import { handleCardClick } from '../utils/navigation';
-import AuditContentLoading from '@/pages/audit/component/AuditContentLoading';
-import { LostArticleContentResponse } from '../types';
-
-interface LostContentProps {
-  initPosts?: LostArticleContentResponse[];
-  className?: string;
-  isLoading: boolean;
-}
-
-interface RenderCardProps {
-  post: LostArticleContentResponse;
-  size: Size;
-}
-
-export function LostContent({ initPosts, isLoading }: LostContentProps) {
-  const navigate = useNavigate();
-  const { size } = useResponseBoard();
-  const screenWidth: number = window.innerWidth;
-  const [posts, setPosts] = useState(initPosts);
-
-  useEffect(() => {
-    setPosts(initPosts);
-  }, [initPosts]);
-
-  if (isLoading) {
-    return <AuditContentLoading screenWidth={screenWidth} />;
-  } else {
-    if (!posts || posts.length === 0) {
-      return (
-        <div className="flex h-[32rem] w-full items-center justify-center text-gray-600">등록된 게시물이 없습니다</div>
-      );
-    }
-    if (screenWidth >= 1920) {
-      return (
-        <div className="flex flex-col justify-between">
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(0, 3).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(3, 6).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between">
-            {posts.slice(6, 9).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-        </div>
-      );
-    } else if (screenWidth >= 1440 && screenWidth < 1920) {
-      return (
-        <div className="flex flex-col justify-between">
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(0, 2).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between pb-[30px]">
-            {posts.slice(2, 4).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-          <div className="flex flex-row justify-between">
-            {posts.slice(4, 6).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
-            ))}
-          </div>
-        </div>
-      );
-    } else {
-      return (
-        <div className="flex flex-col justify-between">
-          {posts.map((post) => (
-            <RenderCard key={post.postId} post={post} size={size} />
-          ))}
-        </div>
-      );
-    }
-  }
-
-  function RenderCard({ post, size }: RenderCardProps) {
-    const formattedDate = post.date ? formatYYYYMMDD(post.date) : '';
-    const thumbnail = post.thumbNail || undefined;
-
-    return (
-      <div key={post.postId} className="xs-pb[20px] sm:pb-[20px] md:pb-[20px] lg:pb-[20px]">
-        <PostCardMissing
-          size={size}
-          imgUrl={thumbnail ? thumbnail : `image/default/thumbnail/default_thumbnail.png`}
-          title={post.title}
-          subtitle={post.content}
-          date={formattedDate}
-          className="cursor-pointer"
-          onClick={() => handleCardClick(post.postId.toString(), post.postId, navigate)}
-        />
-      </div>
-    );
-  }
-}
diff --git a/src/pages/lost-article/page.tsx b/src/pages/lost-article/page.tsx
index 850c6873..e1462792 100644
--- a/src/pages/lost-article/page.tsx
+++ b/src/pages/lost-article/page.tsx
@@ -4,7 +4,7 @@ import { BoardSelector } from '@/components/Board/BoardSelector';
 import { useNavigate } from 'react-router-dom';
 import { categoryMap } from './const/data';
 import { useLostBoard } from './hook/useLostBoard';
-import { LostContent } from './component/lostContent';
+import { BoardContent } from '@/template/board/BoardContent';
 
 export function LostArticlePage() {
   const boardCode = '분실물게시판';
@@ -33,7 +33,7 @@ export function LostArticlePage() {
             }}
           />
         }
-        children={<LostContent initPosts={data?.data.postListResDto} isLoading={isLoading} />}
+        children={<BoardContent data={data?.data.postListResDto} boardName="분실물게시판" isLoading={isLoading} />}
         totalPages={totalPages}
         currentPage={currentPage}
         onPageChange={handlePageChange}
diff --git a/src/pages/notice/component/NoticeNavSection.tsx b/src/pages/notice/component/NoticeNavSection.tsx
index ea6857a1..5428621b 100644
--- a/src/pages/notice/component/NoticeNavSection.tsx
+++ b/src/pages/notice/component/NoticeNavSection.tsx
@@ -1,5 +1,4 @@
 import { BoardNavigator } from '@/components/Board/BoardNavigator';
-import { useNoticeSwitch } from '../utils/switchUtils';
 import { cn } from '@/libs/utils';
 
 interface NoticeNavSectionProps {
@@ -7,7 +6,6 @@ interface NoticeNavSectionProps {
   subCategoryParam: string;
   handleSelection: (selectedCategory: string) => void;
   mainCategoryName: string;
-  subCategoryDisplayName: string;
   className?: string;
   isHidden?: boolean;
 }
@@ -18,21 +16,18 @@ export function NoticeNavSection({
   className = '',
   isHidden = true,
 }: NoticeNavSectionProps) {
-  const handleNoticeSwitchClick = useNoticeSwitch();
-
-  const noticeCategories = ['중앙', '단과대']; // 사용자에게 보여줄 한글 카테고리
-  const selectedCategory = categoryParam; // 선택된 카테고리 (한글)
+  const noticeCategories = ['중앙', '단과대'];
+  const selectedCategory = categoryParam;
 
   return (
     <>
       <div className={isHidden ? 'relative xs:hidden sm:hidden' : 'relative'}>
         <div className="absolute left-0 top-1/2 z-0 h-[1px] w-full -translate-y-1/2 transform bg-[#E7E7E7]"></div>
         <BoardNavigator
-          categories={noticeCategories} // 사용자에게 한글로 카테고리 표시
-          selectedCategory={selectedCategory} // 선택된 카테고리 반영
+          categories={noticeCategories}
+          selectedCategory={selectedCategory}
           onCategorySelect={(selectedCategory) => {
-            handleNoticeSwitchClick(noticeCategories.indexOf(selectedCategory)); // 스위치 토글
-            handleSelection(selectedCategory); // 카테고리 변경
+            handleSelection(selectedCategory);
           }}
           className={cn(`relative z-10 mx-[200px] bg-white md:mx-[60px]`, className)}
         />
diff --git a/src/pages/notice/const/data.ts b/src/pages/notice/const/data.ts
index 20c837db..184580fa 100644
--- a/src/pages/notice/const/data.ts
+++ b/src/pages/notice/const/data.ts
@@ -1,96 +1,21 @@
 // Breadcrumb
 export const items = new Map<string, string | null>([
   ['공지사항', null],
-  ['공지사항', '/notice?category=central&sub-category=all'],
+  ['공지사항', '/notice'],
 ]);
 export const mainName: string[] = ['중앙', '단과대'];
 
-export const category: string[] = ['central', 'college'];
-
 export const subName: string[] = ['전체', '총학생회', '중앙운영위원회', '중앙선거관리위원회', '동아리연합회'];
 
-export const subCategory: string[] = [
-  'all',
-  'president',
-  'central_executive_committee',
-  'central_operating_committee',
-  'club',
+export const subName2: string[] = [
+  '전체',
+  '경영대학',
+  '경제통상대학',
+  '공과대학',
+  '법과대학',
+  '사회과학대학',
+  '인문대학',
+  '자연과학대학',
+  'IT대학',
+  '융합특성화자유전공학부',
 ];
-
-export const categoryMap: Record<string, string> = {
-  central: '중앙',
-  college: '단과대',
-};
-
-export const categoryToCode: Record<string, string> = {
-  central: '중앙기구',
-  college: '단과대학생회',
-};
-
-export const subCategoryMap: Record<string, string> = {
-  all: '전체',
-  president: '총학생회',
-  central_operating_committee: '중앙운영위원회',
-  central_executive_committee: '중앙선거관리위원회',
-  club: '동아리연합회',
-};
-
-export const subCategoryToCode: Record<string, string> = {
-  all: '',
-  president: '총학생회',
-  central_operating_committee: '중앙운영위원회',
-  central_executive_committee: '중앙선거관리위원회',
-  club: '동아리연합회',
-};
-
-export const reverseCategoryMap: Record<string, string> = {
-  중앙: 'central',
-  단과대: 'college',
-};
-
-export const reverseSubCategoryMap: Record<string, string> = {
-  전체: 'all',
-  총학생회: 'president',
-  중앙운영위원회: 'central_operating_committee',
-  중앙선거관리위원회: 'central_executive_committee',
-  동아리연합회: 'club',
-};
-
-export const collegeSubCategoryMap: Record<string, string> = {
-  all: '전체',
-  manage: '경영대학',
-  economic: '경제통상대학',
-  engineer: '공과대학',
-  royal: '법과대학',
-  social: '사회과학대학',
-  human: '인문대학',
-  natural: '자연과학대학',
-  it: 'IT대학',
-  free: '융합특성화자유전공학부',
-};
-
-export const collegeSubCategoryToCode: Record<string, string> = {
-  all: '',
-  manage: '경영대학',
-  economic: '경제통상대학',
-  engineer: '공과대학',
-  royal: '법과대학',
-  social: '사회과학대학',
-  human: '인문대학',
-  natural: '자연과학대학',
-  it: 'IT대학',
-  free: '융합특성화자유전공학부',
-};
-
-export const reverseCollegeSubCategoryMap: Record<string, string> = {
-  전체: 'all',
-  경영대학: 'manage',
-  경제통상대학: 'economic',
-  공과대학: 'engineer',
-  법과대학: 'royal',
-  사회과학대학: 'social',
-  인문대학: 'human',
-  자연과학대학: 'natural',
-  IT대학: 'it',
-  융합특성화자유전공학부: 'free',
-};
diff --git a/src/pages/notice/const/path.ts b/src/pages/notice/const/path.ts
index 04369cfd..803199b1 100644
--- a/src/pages/notice/const/path.ts
+++ b/src/pages/notice/const/path.ts
@@ -2,7 +2,7 @@
 export const items = new Map<string, string | null>([
   ['학교생활', null],
   ['공지사항', '/notice'],
-  ['중앙', '/notice?category=central&sub-category=all'],
+  ['중앙', '/notice'],
 ]);
 
 export const categoryMap: Record<string, string | null> = {
diff --git a/src/pages/notice/hooks/useNoticeBoard.ts b/src/pages/notice/hooks/useNoticeBoard.ts
index cea75844..ed8cc883 100644
--- a/src/pages/notice/hooks/useNoticeBoard.ts
+++ b/src/pages/notice/hooks/useNoticeBoard.ts
@@ -1,45 +1,27 @@
 import { useEffect } from 'react';
 import { useResponseBoard } from '@/hooks/useResponseBoard';
 import { useCurrentPage } from '@/hooks/useCurrentPage';
-import { useNoticeCategory } from './useNoticeCategory';
-import {
-  categoryToCode,
-  subCategoryMap,
-  subCategoryToCode,
-  collegeSubCategoryToCode,
-  collegeSubCategoryMap,
-} from '../const/data';
 import { useGetBoardPostSearch } from '@/hooks/useGetBoardPostSearch';
 import { NoticeResponse } from '../types';
 import { useRecoilValue } from 'recoil';
 import { SearchState } from '@/recoil/atoms/atom';
 
-export function useNoticeBoard(boardCode: string) {
+export function useNoticeBoard(boardCode: string, category: string, subCategory: string) {
   const { itemsPerPage } = useResponseBoard();
   const { currentPage, handlePageChange } = useCurrentPage();
-  const { urlCategory, urlSubCategory } = useNoticeCategory();
 
   const searchQuery = useRecoilValue(SearchState);
 
-  const subcategories =
-    urlCategory === 'college'
-      ? Object.values(collegeSubCategoryMap).filter(Boolean)
-      : Object.values(subCategoryMap).filter(Boolean);
-
-  const selectedCategory = categoryToCode[urlCategory];
-  const selectedSubCategory =
-    urlCategory === 'college' ? collegeSubCategoryToCode[urlSubCategory] : subCategoryToCode[urlSubCategory];
-
   useEffect(() => {
     handlePageChange(1);
-  }, [urlCategory, urlSubCategory, handlePageChange]);
+  }, [category, subCategory, handlePageChange]);
 
   const { data, isLoading, isError } = useGetBoardPostSearch<NoticeResponse>({
     boardCode,
     take: itemsPerPage,
     page: currentPage - 1,
-    groupCode: selectedCategory,
-    memberCode: selectedSubCategory,
+    groupCode: category === '중앙' ? '중앙기구' : '단과대학생회',
+    memberCode: subCategory === '전체' ? '' : subCategory,
     q: searchQuery,
   });
 
@@ -50,7 +32,6 @@ export function useNoticeBoard(boardCode: string) {
     totalPages,
     currentPage,
     handlePageChange,
-    subcategories,
     isLoading,
     isError,
   };
diff --git a/src/pages/notice/hooks/useNoticeCategory.ts b/src/pages/notice/hooks/useNoticeCategory.ts
index 3f7be57e..d09bff50 100644
--- a/src/pages/notice/hooks/useNoticeCategory.ts
+++ b/src/pages/notice/hooks/useNoticeCategory.ts
@@ -1,50 +1,31 @@
-import { useState, useEffect } from 'react';
-import { useNavigate, useSearchParams } from 'react-router-dom';
-import {
-  categoryMap,
-  reverseCategoryMap,
-  subCategoryMap,
-  reverseSubCategoryMap,
-  collegeSubCategoryMap,
-  reverseCollegeSubCategoryMap,
-} from '../const/data';
+import { useState } from 'react';
+import { subName, subName2 } from '../const/data';
 
 export function useNoticeCategory() {
-  const navigate = useNavigate();
-  const [searchParams, setSearchParams] = useSearchParams();
-
-  const urlCategory = searchParams.get('category') || 'central';
-  const urlSubCategory = searchParams.get('sub-category') || 'all';
-
-  const [category, setCategory] = useState<string>(urlCategory);
-  const [subCategory, setSubCategory] = useState<string>(urlSubCategory);
-
-  useEffect(() => {
-    setCategory(urlCategory);
-    setSubCategory(urlSubCategory);
-  }, [urlCategory, urlSubCategory]);
+  const [category, setCategory] = useState<string>('중앙');
+  const [subCategory, setSubCategory] = useState<string>('전체');
+  const [subCategorys, setSubCategorys] = useState<string[]>(subName);
 
   const handleCategoryChange = (newCategory: string) => {
-    const englishCategory = reverseCategoryMap[newCategory];
-    setSearchParams({ category: englishCategory, 'sub-category': subCategory });
+    setCategory(newCategory);
+    setSubCategory('전체');
+    handleSubCategorysChange(newCategory === '중앙' ? subName : subName2);
+  };
+
+  const handleSubCategoryChange = (newSubCategory: string) => {
+    setSubCategory(newSubCategory);
   };
 
-  const handleSubCategoryChange = (selectedSubcategory: string) => {
-    const englishSubCategory =
-      category === 'college'
-        ? reverseCollegeSubCategoryMap[selectedSubcategory]
-        : reverseSubCategoryMap[selectedSubcategory];
-    setSubCategory(englishSubCategory);
-    setSearchParams({ category, 'sub-category': englishSubCategory });
+  const handleSubCategorysChange = (newSubCategorys: string[]) => {
+    setSubCategorys(newSubCategorys);
   };
 
   return {
-    category: categoryMap[category],
-    subCategory: category === 'college' ? collegeSubCategoryMap[subCategory] : subCategoryMap[subCategory],
+    category,
+    subCategory,
+    subCategorys,
     handleCategoryChange,
     handleSubCategoryChange,
-    navigate,
-    urlCategory,
-    urlSubCategory,
+    handleSubCategorysChange,
   };
 }
diff --git a/src/pages/notice/hooks/useNoticeToday.ts b/src/pages/notice/hooks/useNoticeToday.ts
index b22199f2..94592a03 100644
--- a/src/pages/notice/hooks/useNoticeToday.ts
+++ b/src/pages/notice/hooks/useNoticeToday.ts
@@ -1,22 +1,14 @@
 import { useEffect, useState } from 'react';
 import { useGetBoardPosts } from '@/hooks/useGetBoardPosts';
 import { useNoticeCategory } from './useNoticeCategory';
-import { categoryToCode, collegeSubCategoryToCode, subCategoryToCode } from '../const/data';
 import { Post } from '@/types/apis/get';
 import { useRecoilState } from 'recoil';
 import { todayPostCountState } from '@/recoil/atoms/atom';
 
 export function useTodayPosts(boardCode: string) {
-  const { urlCategory, urlSubCategory } = useNoticeCategory();
-  const selectedCategory = categoryToCode[urlCategory];
-  let selectedSubCategory;
-  if (selectedCategory === '중앙기구') {
-    selectedSubCategory = subCategoryToCode[urlSubCategory];
-  } else {
-    selectedSubCategory = collegeSubCategoryToCode[urlSubCategory];
-  }
+  const { category, subCategory } = useNoticeCategory();
 
-  const [todayPostCount, setTodayPostCount] = useRecoilState(todayPostCountState(selectedCategory));
+  const [todayPostCount, setTodayPostCount] = useRecoilState(todayPostCountState(category));
   const [page, setPage] = useState<number>(0);
   const [stopFetching, setStopFetching] = useState<boolean>(false);
 
@@ -24,8 +16,8 @@ export function useTodayPosts(boardCode: string) {
     boardCode,
     take: 10,
     page,
-    groupCode: selectedCategory,
-    memberCode: selectedSubCategory,
+    groupCode: category,
+    memberCode: subCategory,
   });
 
   const posts: Post[] = data?.data?.postListResDto || [];
diff --git a/src/pages/notice/noticeDetail/container/noticeDetailEditSection.tsx b/src/pages/notice/noticeDetail/container/noticeDetailEditSection.tsx
index 3c4b80a0..83e4f1a6 100644
--- a/src/pages/notice/noticeDetail/container/noticeDetailEditSection.tsx
+++ b/src/pages/notice/noticeDetail/container/noticeDetailEditSection.tsx
@@ -21,7 +21,7 @@ export function NoticeDetailEditSection({ boardCode, postId, fileUrls, imageUrls
 
   const handleDelete = async () => {
     await delBoardPosts(boardCode, postId, fileurl);
-    navigate(`/notice?category=central&sub-category=all`);
+    navigate(`/notice`);
   };
 
   return (
diff --git a/src/pages/notice/page.tsx b/src/pages/notice/page.tsx
index ea52352d..15183c8d 100644
--- a/src/pages/notice/page.tsx
+++ b/src/pages/notice/page.tsx
@@ -1,5 +1,4 @@
 import { HeadLayout } from '@/template/HeadLayout';
-import { NoticeContent } from './component/NoticeContent';
 import { BoardSelector } from '@/components/Board/BoardSelector';
 import { useNoticeBoard } from './hooks/useNoticeBoard';
 import { useNoticeCategory } from './hooks/useNoticeCategory';
@@ -7,12 +6,19 @@ import { NoticeNavSection } from './component/NoticeNavSection';
 import { useTodayPosts } from './hooks/useNoticeToday';
 import { BodyLayout } from '@/template/BodyLayout';
 import { Skeleton } from '@/components/ui/skeleton';
+import { useNavigate } from 'react-router-dom';
+import { BoardContent } from '@/template/board/BoardContent';
 
 export function NoticePage() {
-  const { category, navigate, subCategory, handleCategoryChange, handleSubCategoryChange } = useNoticeCategory();
+  const { category, subCategory, subCategorys, handleCategoryChange, handleSubCategoryChange } = useNoticeCategory();
   const boardCode = '공지사항게시판';
+  const navigate = useNavigate();
 
-  const { data, totalPages, currentPage, handlePageChange, isLoading, subcategories } = useNoticeBoard(boardCode);
+  const { data, totalPages, currentPage, handlePageChange, isLoading } = useNoticeBoard(
+    boardCode,
+    category,
+    subCategory
+  );
   const { todayPostCount, isLoading: isPostsLoading } = useTodayPosts(boardCode);
 
   return (
@@ -38,19 +44,18 @@ export function NoticePage() {
         subCategoryParam={subCategory}
         handleSelection={handleCategoryChange}
         mainCategoryName="게시판"
-        subCategoryDisplayName="소개"
         isHidden={false}
         className="mx-[200px] xs:mx-[30px] sm:mx-[30px] md:mx-[30px] lg:mx-[30px]"
       />
       <BodyLayout
         selector={
           <BoardSelector
-            subcategories={subcategories}
+            subcategories={subCategorys}
             selectedSubcategory={subCategory || '전체'}
             onSubcategorySelect={handleSubCategoryChange}
           />
         }
-        children={<NoticeContent initPosts={data?.data.postListResDto} isLoading={isLoading} />}
+        children={<BoardContent boardName="공지사항게시판" data={data?.data.postListResDto} isLoading={isLoading} />}
         totalPages={totalPages}
         currentPage={currentPage}
         onPageChange={handlePageChange}
diff --git a/src/pages/notice/utils/categoryHandler.ts b/src/pages/notice/utils/categoryHandler.ts
deleted file mode 100644
index 67ee716f..00000000
--- a/src/pages/notice/utils/categoryHandler.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { NavigateFunction } from 'react-router-dom';
-import { categoryMap } from '../const/data';
-
-export function handleCategory(
-  categories: string[],
-  categoryValues: string[],
-  selectedCategory: string,
-  navigate: NavigateFunction
-) {
-  const categoryIndex = categories.indexOf(selectedCategory);
-  const value = categoryValues[categoryIndex];
-  navigate(`/notice?category=${value}`);
-}
-
-export function findCategoryKey(selectedCategory: string): string | undefined {
-  return Object.keys(categoryMap).find((key) => categoryMap[key] === selectedCategory);
-}
diff --git a/src/pages/notice/utils/switchUtils.ts b/src/pages/notice/utils/switchUtils.ts
deleted file mode 100644
index ace70a51..00000000
--- a/src/pages/notice/utils/switchUtils.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { useNavigate } from 'react-router-dom';
-
-export function useNoticeSwitch() {
-  const navigate = useNavigate();
-
-  const handleNoticeSwitchClick = (index: number) => {
-    if (index === 0) {
-      navigate('/notice');
-    } else {
-      navigate('/notice?category=all');
-    }
-  };
-
-  return handleNoticeSwitchClick;
-}
diff --git a/src/pages/router.tsx b/src/pages/router.tsx
index fdda33f7..3813b65b 100644
--- a/src/pages/router.tsx
+++ b/src/pages/router.tsx
@@ -54,7 +54,7 @@ export function MainRouter() {
         <Route path="/lost-article/edit" element={<LostArticleEditPage />} />
         <Route path="/lost-article/:id/patch" element={<LostPatchPage />} />
         {/*캠퍼스맵*/}
-        <Route path="/campus" element={<CampusPage />} />
+        <Route path="/campus-map" element={<CampusPage />} />
         {/*학생자치기구*/}
         <Route path="/petition-notice" element={<PetitionNoticePage />} />
         <Route path="/petition-notice/edit" element={<PetitionNoticeEditPage />} />
diff --git a/src/pages/notice/component/NoticeContent.tsx b/src/template/board/BoardContent.tsx
similarity index 64%
rename from src/pages/notice/component/NoticeContent.tsx
rename to src/template/board/BoardContent.tsx
index 267d3b24..5dbd5d91 100644
--- a/src/pages/notice/component/NoticeContent.tsx
+++ b/src/template/board/BoardContent.tsx
@@ -1,36 +1,30 @@
-import { useNavigate } from 'react-router-dom';
-import { PostCardBasic } from '@/components/PostCard/PostCardBasicMissing';
-import { formatYYYYMMDD } from '@/utils/formatYYYYMMDD';
 import { Size } from '@/components/PostCard/const/state';
-import { useEffect, useState } from 'react';
+import { PostCardBasic } from '@/components/PostCard/PostCardBasicMissing';
 import { useResponseBoard } from '@/hooks/useResponseBoard';
-import { handleCardClick } from '../utils/cardHandler';
-import NoticeContentLoading from './NoticeContentLoading';
-import { NoticeContentResponse } from '../types';
+import { useEffect, useState } from 'react';
+import { useNavigate } from 'react-router-dom';
+import BoardContentLoading from './BoardContentLoading';
+import { formatYYYYMMDD } from '@/utils/formatYYYYMMDD';
 
-interface NoticeContentProps {
-  initPosts?: NoticeContentResponse[];
+interface BoardContentProps {
+  boardName: string;
+  data?: any[];
   className?: string;
   isLoading: boolean;
 }
 
-interface RenderCardProps {
-  post: NoticeContentResponse;
-  size: Size;
-}
-
-export function NoticeContent({ initPosts, isLoading }: NoticeContentProps) {
+export function BoardContent({ boardName, data, isLoading }: BoardContentProps) {
   const navigate = useNavigate();
   const { size } = useResponseBoard();
   const screenWidth: number = window.innerWidth;
-  const [posts, setPosts] = useState(initPosts);
+  const [posts, setPosts] = useState(data);
 
   useEffect(() => {
-    setPosts(initPosts);
-  }, [initPosts]);
+    setPosts(data);
+  }, [data]);
 
   if (isLoading) {
-    return <NoticeContentLoading screenWidth={screenWidth} />;
+    return <BoardContentLoading screenWidth={screenWidth} />;
   } else {
     if (!posts || posts.length === 0) {
       return (
@@ -39,40 +33,40 @@ export function NoticeContent({ initPosts, isLoading }: NoticeContentProps) {
     }
     if (screenWidth >= 1920) {
       return (
-        <div className="flex flex-col justify-between">
-          <div className="flex flex-row justify-between pb-[30px]">
+        <div className="flex flex-col justify-start">
+          <div className="flex flex-row justify-start pb-[30px]">
             {posts.slice(0, 3).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
+              <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
             ))}
           </div>
-          <div className="flex flex-row justify-between pb-[30px]">
+          <div className="flex flex-row justify-start pb-[30px]">
             {posts.slice(3, 6).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
+              <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
             ))}
           </div>
-          <div className="flex flex-row justify-between">
+          <div className="flex flex-row justify-start">
             {posts.slice(6, 9).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
+              <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
             ))}
           </div>
         </div>
       );
     } else if (screenWidth >= 1440 && screenWidth < 1920) {
       return (
-        <div className="flex flex-col justify-between">
-          <div className="flex flex-row justify-between pb-[30px]">
+        <div className="flex flex-col justify-start">
+          <div className="flex flex-row justify-start pb-[30px]">
             {posts.slice(0, 2).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
+              <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
             ))}
           </div>
-          <div className="flex flex-row justify-between pb-[30px]">
+          <div className="flex flex-row justify-start pb-[30px]">
             {posts.slice(2, 4).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
+              <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
             ))}
           </div>
-          <div className="flex flex-row justify-between">
+          <div className="flex flex-row justify-start">
             {posts.slice(4, 6).map((post) => (
-              <RenderCard key={post.postId} post={post} size={size} />
+              <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
             ))}
           </div>
         </div>
@@ -81,15 +75,23 @@ export function NoticeContent({ initPosts, isLoading }: NoticeContentProps) {
       return (
         <div className="flex flex-col justify-between">
           {posts.map((post) => (
-            <RenderCard key={post.postId} post={post} size={size} />
+            <RenderCard key={post.postId} post={post} size={size} boardName={boardName} />
           ))}
         </div>
       );
     }
   }
 
-  function RenderCard({ post, size }: RenderCardProps) {
+  interface RenderCardProps {
+    post: any;
+    size: Size;
+    boardName: string;
+  }
+
+  function RenderCard({ post, size, boardName }: RenderCardProps) {
     const formattedDate = post.date ? formatYYYYMMDD(post.date) : '';
+    let thumbnail = post.thumbNail || undefined;
+
     let status: 'Emergency' | 'New' | 'Default';
     if (post.status === '긴급공지') {
       status = 'Emergency';
@@ -98,24 +100,24 @@ export function NoticeContent({ initPosts, isLoading }: NoticeContentProps) {
     } else {
       status = 'Default';
     }
-    let thumbnail = post.thumbNail || undefined;
-
     if (status === 'Emergency' && thumbnail === undefined) {
       thumbnail = `image/default/thumbnail/thumbnail_299px.png`;
     }
-
     return (
-      <div key={post.postId} className="xs-pb[20px] sm:pb-[20px] md:pb-[20px] lg:pb-[20px]">
+      <div
+        key={post.postId}
+        className="xs-pb[20px] pr-[1.5rem] xs:pr-0 sm:pb-[20px] sm:pr-0 md:pb-[20px] md:pr-0 lg:pb-[20px] lg:pr-0"
+      >
         <PostCardBasic
           size={size}
-          imgUrl={thumbnail}
+          imgUrl={thumbnail ? thumbnail : `image/default/thumbnail/default_thumbnail.png`}
           title={post.title}
           subtitle={post.content}
           date={formattedDate}
           badgeType={status}
           profileName={post.author}
           className="cursor-pointer"
-          onClick={() => handleCardClick(post.postId.toString(), post.postId, navigate)}
+          onClick={() => navigate(`/${boardName}/${post.postId}`, { state: { postId: post.postId } })}
         />
       </div>
     );
diff --git a/src/pages/notice/component/NoticeContentLoading.tsx b/src/template/board/BoardContentLoading.tsx
similarity index 58%
rename from src/pages/notice/component/NoticeContentLoading.tsx
rename to src/template/board/BoardContentLoading.tsx
index ff4974a1..af96749d 100644
--- a/src/pages/notice/component/NoticeContentLoading.tsx
+++ b/src/template/board/BoardContentLoading.tsx
@@ -1,20 +1,20 @@
 import { Skeleton } from '@/components/ui/skeleton';
 
-interface AuditContentLoadingProps {
+interface BoardContentLoadingProps {
   screenWidth: number;
 }
 
-export default function AuditContentLoading({ screenWidth }: AuditContentLoadingProps) {
+export default function BoardContentLoading({ screenWidth }: BoardContentLoadingProps) {
   const emptyFive = Array(5).fill(null);
   const emptyThree = Array(3).fill(null);
   const emptyTwo = Array(2).fill(null);
   if (screenWidth >= 1920) {
     return (
-      <div className="flex flex-col justify-between">
+      <div className="flex flex-col justify-start">
         {emptyThree.map((_, index) => (
-          <div key={index} className="flex flex-row justify-between pb-[30px]">
+          <div key={index} className="flex flex-row justify-start pb-[30px]">
             {emptyThree.map((_, i) => (
-              <Skeleton key={i} className="h-[209px] min-w-[400px] px-[16px] py-[16px]" />
+              <Skeleton key={i} className="mr-[1.5rem] h-[209px] min-w-[400px] px-[16px] py-[16px]" />
             ))}
           </div>
         ))}
@@ -22,11 +22,11 @@ export default function AuditContentLoading({ screenWidth }: AuditContentLoading
     );
   } else if (screenWidth >= 1440 && screenWidth < 1920) {
     return (
-      <div className="flex flex-col justify-between">
+      <div className="flex flex-col justify-start">
         {emptyThree.map((_, index) => (
-          <div key={index} className="flex flex-row justify-between pb-[30px]">
+          <div key={index} className="flex flex-row justify-start pb-[30px]">
             {emptyTwo.map((_, i) => (
-              <Skeleton key={i} className="h-[209px] min-w-[400px] px-[16px] py-[16px]" />
+              <Skeleton key={i} className="mr-[1.5rem] h-[209px] min-w-[400px] px-[16px] py-[16px]" />
             ))}
           </div>
         ))}
diff --git a/src/types/getBoardPosts.ts b/src/types/getBoardPosts.ts
index 3babd98f..61c1dde1 100644
--- a/src/types/getBoardPosts.ts
+++ b/src/types/getBoardPosts.ts
@@ -17,6 +17,18 @@ export interface GetNoticeBoardPostsResponse {
   isSuccess: true;
 }
 
+export interface BoardPost {
+  postId: number;
+  title: string;
+  content: string;
+  date: string;
+  category: string | null;
+  thumbNail: string | null;
+  status: statusType;
+  author: string;
+  isEmergency: boolean;
+}
+
 interface NoticePostListResDto {
   postId: number;
   title: string;