diff --git a/src/components/EgovContainer.jsx b/src/components/EgovContainer.jsx
index d43b1d8..79574a4 100644
--- a/src/components/EgovContainer.jsx
+++ b/src/components/EgovContainer.jsx
@@ -1,7 +1,7 @@
 import { Link } from "react-router-dom";
 
 import EgovLeftNav from "@/components/EgovLeftNav";
-
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 function EgovContainer() {
   return (
     <div className="container">
@@ -29,11 +29,7 @@ function EgovContainer() {
 
           {/* <!-- 본문 --> */}
           <div className="contents WEEK_SCHEDULE" id="contents">
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">금주의 행사</h2>
+            <EgovMenuHeader title="알림마당" subTitle="금주의 행사" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/components/EgovMenuHeader.jsx b/src/components/EgovMenuHeader.jsx
new file mode 100644
index 0000000..840bbcf
--- /dev/null
+++ b/src/components/EgovMenuHeader.jsx
@@ -0,0 +1,13 @@
+const EgovMenuHeader = ({ title, subTitle, showExampleLabel = false }) => {
+  return (
+    <>
+      <div className="top_tit">
+        <h1 className="tit_1">{title}</h1>
+      </div>
+      {subTitle && <h2 className="tit_2">{subTitle}</h2>}
+      {showExampleLabel && <h2 className="tit_7">본 화면은 디자인 예시임</h2>}
+    </>
+  );
+};
+
+export default EgovMenuHeader;
diff --git a/src/pages/admin/board/EgovAdminBoardEdit.jsx b/src/pages/admin/board/EgovAdminBoardEdit.jsx
index 7b3f459..41b862f 100644
--- a/src/pages/admin/board/EgovAdminBoardEdit.jsx
+++ b/src/pages/admin/board/EgovAdminBoardEdit.jsx
@@ -8,6 +8,7 @@ import { useDebouncedInput } from "@/hooks/useDebounce";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovRadioButtonGroup from "@/components/EgovRadioButtonGroup";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminBoardEdit(props) {
   console.group("EgovAdminBoardEdit");
@@ -239,6 +240,15 @@ function EgovAdminBoardEdit(props) {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  const getSubTitle = () => {
+    if (modeInfo.mode === CODE.MODE_CREATE) {
+      return "게시판 생성";
+    } else if (modeInfo.mode === CODE.MODE_MODIFY) {
+      return "게시판 수정";
+    }
+    return "";
+  };
+
   console.log("------------------------------EgovAdminBoardEdit [End]");
   console.groupEnd("EgovAdminBoardEdit");
 
@@ -269,17 +279,7 @@ function EgovAdminBoardEdit(props) {
           <div className="contents BOARD_CREATE_REG" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            {modeInfo.mode === CODE.MODE_CREATE && (
-              <h2 className="tit_2">게시판 생성</h2>
-            )}
-
-            {modeInfo.mode === CODE.MODE_MODIFY && (
-              <h2 className="tit_2">게시판 수정</h2>
-            )}
+            <EgovMenuHeader title="사이트관리" subTitle={getSubTitle()} />
 
             <div className="board_view2">
               <dl>
@@ -317,7 +317,9 @@ function EgovAdminBoardEdit(props) {
                     rows="10"
                     placeholder=""
                     defaultValue={boardDetail.bbsIntrcn}
-                    onChange={(e) => handleInputChange("bbsIntrcn", e.target.value)}
+                    onChange={(e) =>
+                      handleInputChange("bbsIntrcn", e.target.value)
+                    }
                     ref={(el) => (checkRef.current[1] = el)}
                   ></textarea>
                 </dd>
diff --git a/src/pages/admin/board/EgovAdminBoardList.jsx b/src/pages/admin/board/EgovAdminBoardList.jsx
index 88c400f..84b7c11 100644
--- a/src/pages/admin/board/EgovAdminBoardList.jsx
+++ b/src/pages/admin/board/EgovAdminBoardList.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovPaging from "@/components/EgovPaging";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 import { itemIdxByPage } from "@/utils/calc";
 
@@ -137,11 +138,7 @@ function EgovAdminBoardList(props) {
           <div className="contents BOARD_CREATE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">게시판생성 관리</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="게시판생성 관리" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/admin/gallery/EgovAdminGalleryDetail.jsx b/src/pages/admin/gallery/EgovAdminGalleryDetail.jsx
index 5725643..e61cce0 100644
--- a/src/pages/admin/gallery/EgovAdminGalleryDetail.jsx
+++ b/src/pages/admin/gallery/EgovAdminGalleryDetail.jsx
@@ -11,6 +11,7 @@ import { GALLERY_BBS_ID } from "@/config";
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovAttachFile from "@/components/EgovAttachFile";
 import EgovImageGallery from "@/components/EgovImageGallery";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminGalleryDetail(props) {
   console.group("EgovAdminGalleryDetail");
@@ -56,7 +57,7 @@ function EgovAdminGalleryDetail(props) {
       headers: {
         "Content-type": "application/json",
       },
-      body: JSON.stringify({ atchFileId: atchFileId })
+      body: JSON.stringify({ atchFileId: atchFileId }),
     };
 
     EgovNet.requestFetch(deleteBoardURL, requestOptions, (resp) => {
@@ -114,11 +115,7 @@ function EgovAdminGalleryDetail(props) {
           <div className="contents NOTICE_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="사이트관리" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view">
diff --git a/src/pages/admin/gallery/EgovAdminGalleryEdit.jsx b/src/pages/admin/gallery/EgovAdminGalleryEdit.jsx
index b0b6e9c..cb429ba 100644
--- a/src/pages/admin/gallery/EgovAdminGalleryEdit.jsx
+++ b/src/pages/admin/gallery/EgovAdminGalleryEdit.jsx
@@ -11,6 +11,7 @@ import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovAttachFile from "@/components/EgovAttachFile";
 import bbsFormVaildator from "@/utils/bbsFormVaildator";
 import { useDebouncedInput } from "@/hooks/useDebounce";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminGalleryEdit(props) {
   console.group("EgovAdminGalleryEdit");
@@ -176,13 +177,12 @@ function EgovAdminGalleryEdit(props) {
           <div className="contents SITE_GALLARY_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">
-              {masterBoard && masterBoard.bbsNm} {modeInfo.modeTitle}
-            </h2>
+            <EgovMenuHeader
+              title="사이트관리"
+              subTitle={`${masterBoard?.bbsNm ?? ""} ${
+                modeInfo?.modeTitle ?? ""
+              }`.trim()}
+            />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/admin/gallery/EgovAdminGalleryList.jsx b/src/pages/admin/gallery/EgovAdminGalleryList.jsx
index d323c2f..9c7cfef 100644
--- a/src/pages/admin/gallery/EgovAdminGalleryList.jsx
+++ b/src/pages/admin/gallery/EgovAdminGalleryList.jsx
@@ -8,6 +8,7 @@ import { GALLERY_BBS_ID } from "@/config";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovPaging from "@/components/EgovPaging";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 import { itemIdxByPage } from "@/utils/calc";
 
@@ -22,7 +23,8 @@ function EgovAdminGalleryList(props) {
   const bbsId = GALLERY_BBS_ID;
 
   // 공통 네비게이션 훅 사용
-  const { searchCondition, handlePageMove, handleSearch } = useListNavigation(bbsId);
+  const { searchCondition, handlePageMove, handleSearch } =
+    useListNavigation(bbsId);
   const [masterBoard, setMasterBoard] = useState({});
   const [paginationInfo, setPaginationInfo] = useState({});
 
@@ -139,11 +141,7 @@ function EgovAdminGalleryList(props) {
           <div className="contents SITE_GALLARY_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="사이트관리" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/admin/manager/EgovAdminPasswordUpdate.jsx b/src/pages/admin/manager/EgovAdminPasswordUpdate.jsx
index 7b1e236..ac351b4 100644
--- a/src/pages/admin/manager/EgovAdminPasswordUpdate.jsx
+++ b/src/pages/admin/manager/EgovAdminPasswordUpdate.jsx
@@ -4,6 +4,7 @@ import * as EgovNet from "@/api/egovFetch";
 import URL from "@/constants/url";
 import CODE from "@/constants/code";
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminPasswordUpdate(props) {
   console.group("EgovAdminPasswordUpdate");
@@ -73,9 +74,7 @@ function EgovAdminPasswordUpdate(props) {
     }
   };
 
-  useEffect(() => {
-     
-  }, []);
+  useEffect(() => {}, []);
 
   console.log("------------------------------EgovAdminPasswordUpdate [End]");
   console.groupEnd("EgovAdminPasswordUpdate");
@@ -107,10 +106,10 @@ function EgovAdminPasswordUpdate(props) {
           <div className="contents BOARD_CREATE_REG" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-            <h2 className="tit_2">사이트관리자 암호변경</h2>
+            <EgovMenuHeader
+              title="사이트관리"
+              subTitle="사이트관리자 암호변경"
+            />
             <div className="board_view2">
               <dl>
                 <dt>
diff --git a/src/pages/admin/members/EgovAdminMemberEdit.jsx b/src/pages/admin/members/EgovAdminMemberEdit.jsx
index 28aa4ad..662bab8 100644
--- a/src/pages/admin/members/EgovAdminMemberEdit.jsx
+++ b/src/pages/admin/members/EgovAdminMemberEdit.jsx
@@ -7,6 +7,7 @@ import CODE from "@/constants/code";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovRadioButtonGroup from "@/components/EgovRadioButtonGroup";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminMemberEdit(props) {
   console.group("EgovAdminMemberEdit");
@@ -268,6 +269,15 @@ function EgovAdminMemberEdit(props) {
   console.log("------------------------------EgovAdminMemberEdit [End]");
   console.groupEnd("EgovAdminMemberEdit");
 
+  const getSubTitle = () => {
+    if (modeInfo.mode === CODE.MODE_CREATE) {
+      return "회원 생성";
+    } else if (modeInfo.mode === CODE.MODE_MODIFY) {
+      return "회원 수정";
+    }
+    return "";
+  };
+
   return (
     <div className="container">
       <div className="c_wrap">
@@ -295,17 +305,7 @@ function EgovAdminMemberEdit(props) {
           <div className="contents BOARD_CREATE_REG" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            {modeInfo.mode === CODE.MODE_CREATE && (
-              <h2 className="tit_2">회원 생성</h2>
-            )}
-
-            {modeInfo.mode === CODE.MODE_MODIFY && (
-              <h2 className="tit_2">회원 수정</h2>
-            )}
+            <EgovMenuHeader title="사이트관리" subTitle={getSubTitle()} />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/admin/members/EgovAdminMemberList.jsx b/src/pages/admin/members/EgovAdminMemberList.jsx
index 2ca7381..00c0528 100644
--- a/src/pages/admin/members/EgovAdminMemberList.jsx
+++ b/src/pages/admin/members/EgovAdminMemberList.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovPaging from "@/components/EgovPaging";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 import { itemIdxByPage } from "@/utils/calc";
 
@@ -147,11 +148,7 @@ function EgovAdminMemberList(props) {
           <div className="contents BOARD_CREATE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">회원 관리</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="회원 관리" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/admin/notice/EgovAdminNoticeDetail.jsx b/src/pages/admin/notice/EgovAdminNoticeDetail.jsx
index a1cbc6d..7e1a513 100644
--- a/src/pages/admin/notice/EgovAdminNoticeDetail.jsx
+++ b/src/pages/admin/notice/EgovAdminNoticeDetail.jsx
@@ -10,6 +10,7 @@ import { NOTICE_BBS_ID } from "@/config";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovAttachFile from "@/components/EgovAttachFile";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminNoticeDetail(props) {
   console.group("EgovAdminNoticeDetail");
@@ -55,7 +56,7 @@ function EgovAdminNoticeDetail(props) {
       headers: {
         "Content-type": "application/json",
       },
-      body: JSON.stringify({ atchFileId: atchFileId })
+      body: JSON.stringify({ atchFileId: atchFileId }),
     };
 
     EgovNet.requestFetch(deleteBoardURL, requestOptions, (resp) => {
@@ -112,11 +113,7 @@ function EgovAdminNoticeDetail(props) {
           <div className="contents NOTICE_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="사이트관리" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view">
diff --git a/src/pages/admin/notice/EgovAdminNoticeEdit.jsx b/src/pages/admin/notice/EgovAdminNoticeEdit.jsx
index e7bb526..a0ca1e3 100644
--- a/src/pages/admin/notice/EgovAdminNoticeEdit.jsx
+++ b/src/pages/admin/notice/EgovAdminNoticeEdit.jsx
@@ -12,6 +12,7 @@ import EgovAttachFile from "@/components/EgovAttachFile";
 import bbsFormVaildator from "@/utils/bbsFormVaildator";
 
 import { useDebouncedInput } from "@/hooks/useDebounce";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminNoticeEdit(props) {
   console.group("EgovAdminNoticeEdit");
@@ -76,7 +77,7 @@ function EgovAdminNoticeEdit(props) {
       };
 
       EgovNet.requestFetch(retrieveDetailURL, requestOptions, function (resp) {
-        setMasterBoard(resp.result );
+        setMasterBoard(resp.result);
       });
 
       setBoardDetail({ bbsId: bbsId, nttSj: "", nttCn: "" });
@@ -177,13 +178,12 @@ function EgovAdminNoticeEdit(props) {
           <div className="contents NOTICE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">
-              {masterBoard && masterBoard.bbsNm} {modeInfo.modeTitle}
-            </h2>
+            <EgovMenuHeader
+              title="사이트관리"
+              subTitle={`${masterBoard?.bbsNm ?? ""} ${
+                modeInfo?.modeTitle ?? ""
+              }`.trim()}
+            />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/admin/notice/EgovAdminNoticeList.jsx b/src/pages/admin/notice/EgovAdminNoticeList.jsx
index 41e59ec..ac69af6 100644
--- a/src/pages/admin/notice/EgovAdminNoticeList.jsx
+++ b/src/pages/admin/notice/EgovAdminNoticeList.jsx
@@ -8,6 +8,7 @@ import { NOTICE_BBS_ID } from "@/config";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovPaging from "@/components/EgovPaging";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 import { itemIdxByPage } from "@/utils/calc";
 
@@ -22,7 +23,8 @@ function EgovAdminNoticeList(props) {
   const bbsId = NOTICE_BBS_ID;
 
   // 공통 네비게이션 훅 사용
-  const { searchCondition, handlePageMove, handleSearch } = useListNavigation(bbsId);
+  const { searchCondition, handlePageMove, handleSearch } =
+    useListNavigation(bbsId);
   const [masterBoard, setMasterBoard] = useState({});
   const [paginationInfo, setPaginationInfo] = useState({});
 
@@ -139,11 +141,7 @@ function EgovAdminNoticeList(props) {
           <div className="contents NOTICE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="사이트관리" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/admin/schedule/EgovAdminScheduleDetail.jsx b/src/pages/admin/schedule/EgovAdminScheduleDetail.jsx
index 778176b..9834b79 100644
--- a/src/pages/admin/schedule/EgovAdminScheduleDetail.jsx
+++ b/src/pages/admin/schedule/EgovAdminScheduleDetail.jsx
@@ -7,6 +7,7 @@ import CODE from "@/constants/code";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovAttachFile from "@/components/EgovAttachFile";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminScheduleDetail(props) {
   console.group("EgovAdminScheduleDetail");
@@ -153,11 +154,7 @@ function EgovAdminScheduleDetail(props) {
           <div className="contents SITE_GALLARY_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">일정관리 상세보기</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="일정관리 상세보기" />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view2">
diff --git a/src/pages/admin/schedule/EgovAdminScheduleEdit.jsx b/src/pages/admin/schedule/EgovAdminScheduleEdit.jsx
index 7930baa..947c838 100644
--- a/src/pages/admin/schedule/EgovAdminScheduleEdit.jsx
+++ b/src/pages/admin/schedule/EgovAdminScheduleEdit.jsx
@@ -10,7 +10,7 @@ import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovAttachFile from "@/components/EgovAttachFile";
 import EgovRadioButtonGroup from "@/components/EgovRadioButtonGroup";
 import { useDebouncedInput } from "@/hooks/useDebounce";
-
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 import "react-datepicker/dist/react-datepicker.css";
 
 function EgovAdminScheduleEdit(props) {
@@ -230,11 +230,7 @@ function EgovAdminScheduleEdit(props) {
           <div className="contents SITE_SCHDULE_REG" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">일정관리 상세보기</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="일정관리 상세보기" />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view2">
@@ -346,7 +342,9 @@ function EgovAdminScheduleEdit(props) {
                     rows="10"
                     placeholder="일정내용"
                     defaultValue={scheduleDetail.schdulCn}
-                    onChange={(e) => handleInputChange("schdulCn", e.target.value)}
+                    onChange={(e) =>
+                      handleInputChange("schdulCn", e.target.value)
+                    }
                   ></textarea>
                 </dd>
               </dl>
diff --git a/src/pages/admin/schedule/EgovAdminScheduleList.jsx b/src/pages/admin/schedule/EgovAdminScheduleList.jsx
index f65bac1..6f9f6f0 100644
--- a/src/pages/admin/schedule/EgovAdminScheduleList.jsx
+++ b/src/pages/admin/schedule/EgovAdminScheduleList.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 import CODE from "@/constants/code";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminScheduleList(props) {
   console.group("EgovAdminScheduleList");
@@ -321,11 +322,7 @@ function EgovAdminScheduleList(props) {
           <div className="contents NOTICE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">일정관리</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="일정관리" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/admin/usage/EgovAdminUsageEdit.jsx b/src/pages/admin/usage/EgovAdminUsageEdit.jsx
index 5fb41d4..63cb6c4 100644
--- a/src/pages/admin/usage/EgovAdminUsageEdit.jsx
+++ b/src/pages/admin/usage/EgovAdminUsageEdit.jsx
@@ -7,6 +7,7 @@ import CODE from "@/constants/code";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovRadioButtonGroup from "@/components/EgovRadioButtonGroup";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovAdminUsageEdit(props) {
   console.group("EgovAdminUsageEdit");
@@ -200,11 +201,7 @@ function EgovAdminUsageEdit(props) {
           <div className="contents BOARD_USE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">게시판사용 관리</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="게시판사용 관리" />
 
             <div className="board_view2">
               {/* 등록일때 일때 */}
diff --git a/src/pages/admin/usage/EgovAdminUsageList.jsx b/src/pages/admin/usage/EgovAdminUsageList.jsx
index 7481e97..29bc04a 100644
--- a/src/pages/admin/usage/EgovAdminUsageList.jsx
+++ b/src/pages/admin/usage/EgovAdminUsageList.jsx
@@ -6,7 +6,7 @@ import URL from "@/constants/url";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavAdmin";
 import EgovPaging from "@/components/EgovPaging";
-
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 import { itemIdxByPage } from "@/utils/calc";
 
 function EgovAdminUsageList(props) {
@@ -138,11 +138,7 @@ function EgovAdminUsageList(props) {
           <div className="contents NOTICE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">사이트관리</h1>
-            </div>
-
-            <h2 className="tit_2">게시판사용 관리</h2>
+            <EgovMenuHeader title="사이트관리" subTitle="게시판사용 관리" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/inform/daily/EgovDailyDetail.jsx b/src/pages/inform/daily/EgovDailyDetail.jsx
index c48c313..171640b 100644
--- a/src/pages/inform/daily/EgovDailyDetail.jsx
+++ b/src/pages/inform/daily/EgovDailyDetail.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
 import EgovAttachFile from "@/components/EgovAttachFile";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovDailyDetail(props) {
   console.group("EgovDailyDetail");
@@ -123,11 +124,7 @@ function EgovDailyDetail(props) {
           <div className="contents SITE_GALLARY_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">일정관리 상세보기</h2>
+            <EgovMenuHeader title="알림마당" subTitle="일정관리 상세보기" />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view2">
diff --git a/src/pages/inform/daily/EgovDailyList.jsx b/src/pages/inform/daily/EgovDailyList.jsx
index b6c42fc..df4d3f0 100644
--- a/src/pages/inform/daily/EgovDailyList.jsx
+++ b/src/pages/inform/daily/EgovDailyList.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 import CODE from "@/constants/code";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovDailyList(props) {
   console.group("EgovDailyDetail");
@@ -180,11 +181,7 @@ function EgovDailyList(props) {
           <div className="contents TODAY_SCHEDULE" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">오늘의 행사</h2>
+            <EgovMenuHeader title="알림마당" subTitle="오늘의 행사" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/inform/gallery/EgovGalleryDetail.jsx b/src/pages/inform/gallery/EgovGalleryDetail.jsx
index a9c3a25..37a2c33 100644
--- a/src/pages/inform/gallery/EgovGalleryDetail.jsx
+++ b/src/pages/inform/gallery/EgovGalleryDetail.jsx
@@ -11,6 +11,7 @@ import { GALLERY_BBS_ID } from "@/config";
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
 import EgovAttachFile from "@/components/EgovAttachFile";
 import EgovImageGallery from "@/components/EgovImageGallery";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 import { getSessionItem } from "@/utils/storage";
 
 function EgovGalleryDetail(props) {
@@ -119,11 +120,7 @@ function EgovGalleryDetail(props) {
           <div className="contents NOTICE_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="알림마당" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view">
diff --git a/src/pages/inform/gallery/EgovGalleryEdit.jsx b/src/pages/inform/gallery/EgovGalleryEdit.jsx
index d64c6ab..bac2fa1 100644
--- a/src/pages/inform/gallery/EgovGalleryEdit.jsx
+++ b/src/pages/inform/gallery/EgovGalleryEdit.jsx
@@ -12,6 +12,7 @@ import EgovAttachFile from "@/components/EgovAttachFile";
 import bbsFormVaildator from "@/utils/bbsFormVaildator";
 import { getSessionItem } from "@/utils/storage";
 import { useDebouncedInput } from "@/hooks/useDebounce";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovGalleryEdit(props) {
   console.group("EgovGalleryEdit");
@@ -180,13 +181,12 @@ function EgovGalleryEdit(props) {
           <div className="contents SITE_GALLARY_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">
-              {masterBoard && masterBoard.bbsNm} {modeInfo.modeTitle}
-            </h2>
+            <EgovMenuHeader
+              title="알림마당"
+              subTitle={`${masterBoard?.bbsNm ?? ""} ${
+                modeInfo?.modeTitle ?? ""
+              }`.trim()}
+            />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/inform/gallery/EgovGalleryList.jsx b/src/pages/inform/gallery/EgovGalleryList.jsx
index 2573060..83d9e78 100644
--- a/src/pages/inform/gallery/EgovGalleryList.jsx
+++ b/src/pages/inform/gallery/EgovGalleryList.jsx
@@ -8,7 +8,7 @@ import { GALLERY_BBS_ID } from "@/config";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
 import EgovPaging from "@/components/EgovPaging";
-
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 import { itemIdxByPage } from "@/utils/calc";
 
 function EgovGalleryList(props) {
@@ -22,7 +22,8 @@ function EgovGalleryList(props) {
   const bbsId = GALLERY_BBS_ID;
 
   // 공통 네비게이션 훅 사용
-  const { searchCondition, handlePageMove, handleSearch } = useListNavigation(bbsId);
+  const { searchCondition, handlePageMove, handleSearch } =
+    useListNavigation(bbsId);
   const [masterBoard, setMasterBoard] = useState({});
   const [user, setUser] = useState({});
   const [paginationInfo, setPaginationInfo] = useState({});
@@ -141,11 +142,7 @@ function EgovGalleryList(props) {
           <div className="contents SITE_GALLARY_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="알림마당" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/inform/notice/EgovNoticeDetail.jsx b/src/pages/inform/notice/EgovNoticeDetail.jsx
index fe5694d..55615d5 100644
--- a/src/pages/inform/notice/EgovNoticeDetail.jsx
+++ b/src/pages/inform/notice/EgovNoticeDetail.jsx
@@ -11,6 +11,7 @@ import { NOTICE_BBS_ID } from "@/config";
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
 import EgovAttachFile from "@/components/EgovAttachFile";
 import { getSessionItem } from "@/utils/storage";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovNoticeDetail(props) {
   console.group("EgovNoticeDetail");
@@ -61,7 +62,7 @@ function EgovNoticeDetail(props) {
       headers: {
         "Content-type": "application/json",
       },
-      body: JSON.stringify({ atchFileId: atchFileId })
+      body: JSON.stringify({ atchFileId: atchFileId }),
     };
 
     EgovNet.requestFetch(deleteBoardURL, requestOptions, (resp) => {
@@ -118,11 +119,7 @@ function EgovNoticeDetail(props) {
           <div className="contents NOTICE_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="알림마당" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 게시판 상세보기 --> */}
             <div className="board_view">
diff --git a/src/pages/inform/notice/EgovNoticeEdit.jsx b/src/pages/inform/notice/EgovNoticeEdit.jsx
index dd8db47..6f3b3bb 100644
--- a/src/pages/inform/notice/EgovNoticeEdit.jsx
+++ b/src/pages/inform/notice/EgovNoticeEdit.jsx
@@ -12,6 +12,7 @@ import EgovAttachFile from "@/components/EgovAttachFile";
 import bbsFormVaildator from "@/utils/bbsFormVaildator";
 import { getSessionItem } from "@/utils/storage";
 import { useDebouncedInput } from "@/hooks/useDebounce";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovNoticeEdit(props) {
   console.group("EgovNoticeEdit");
@@ -180,13 +181,12 @@ function EgovNoticeEdit(props) {
           <div className="contents NOTICE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">
-              {masterBoard && masterBoard.bbsNm} {modeInfo.modeTitle}
-            </h2>
+            <EgovMenuHeader
+              title="알림마당"
+              subTitle={`${masterBoard?.bbsNm ?? ""} ${
+                modeInfo?.modeTitle ?? ""
+              }`.trim()}
+            />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/inform/notice/EgovNoticeList.jsx b/src/pages/inform/notice/EgovNoticeList.jsx
index 3a17132..fc05503 100644
--- a/src/pages/inform/notice/EgovNoticeList.jsx
+++ b/src/pages/inform/notice/EgovNoticeList.jsx
@@ -8,7 +8,7 @@ import { NOTICE_BBS_ID } from "@/config";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
 import EgovPaging from "@/components/EgovPaging";
-
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 import { itemIdxByPage } from "@/utils/calc";
 import { getSessionItem } from "@/utils/storage";
 
@@ -27,7 +27,8 @@ function EgovNoticeList(props) {
   const bbsId = NOTICE_BBS_ID;
 
   // 공통 네비게이션 훅 사용
-  const { searchCondition, handlePageMove, handleSearch } = useListNavigation(bbsId);
+  const { searchCondition, handlePageMove, handleSearch } =
+    useListNavigation(bbsId);
   const [masterBoard, setMasterBoard] = useState({});
   const [user, setUser] = useState({});
   const [paginationInfo, setPaginationInfo] = useState({});
@@ -141,11 +142,7 @@ function EgovNoticeList(props) {
           <div className="contents NOTICE_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">{masterBoard && masterBoard.bbsNm}</h2>
+            <EgovMenuHeader title="알림마당" subTitle={masterBoard?.bbsNm} />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/inform/weekly/EgovWeeklyList.jsx b/src/pages/inform/weekly/EgovWeeklyList.jsx
index 41c0233..0cee336 100644
--- a/src/pages/inform/weekly/EgovWeeklyList.jsx
+++ b/src/pages/inform/weekly/EgovWeeklyList.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 import CODE from "@/constants/code";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavInform";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovWeeklyList(props) {
   console.group("EgovWeeklyList");
@@ -287,11 +288,7 @@ function EgovWeeklyList(props) {
           <div className="contents WEEK_SCHEDULE" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">알림마당</h1>
-            </div>
-
-            <h2 className="tit_2">금주의 행사</h2>
+            <EgovMenuHeader title="알림마당" subTitle="금주의 행사" />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/mypage/EgovMypageEdit.jsx b/src/pages/mypage/EgovMypageEdit.jsx
index 706b1f2..e22b340 100644
--- a/src/pages/mypage/EgovMypageEdit.jsx
+++ b/src/pages/mypage/EgovMypageEdit.jsx
@@ -6,6 +6,7 @@ import URL from "@/constants/url";
 import CODE from "@/constants/code";
 
 import { getSessionItem, setSessionItem } from "@/utils/storage";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovMypageEdit(props) {
   console.group("EgovMypageEdit");
@@ -284,6 +285,15 @@ function EgovMypageEdit(props) {
   console.log("------------------------------EgovMypageEdit [End]");
   console.groupEnd("EgovMypageEdit");
 
+  const getSubTitle = () => {
+    if (modeInfo.mode === CODE.MODE_CREATE) {
+      return "회원 생성";
+    } else if (modeInfo.mode === CODE.MODE_MODIFY) {
+      return "회원 수정";
+    }
+    return "";
+  };
+
   return (
     <div className="container">
       <div className="c_wrap">
@@ -308,17 +318,7 @@ function EgovMypageEdit(props) {
           <div className="contents BOARD_CREATE_REG" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">마이페이지</h1>
-            </div>
-
-            {modeInfo.mode === CODE.MODE_CREATE && (
-              <h2 className="tit_2">회원 생성</h2>
-            )}
-
-            {modeInfo.mode === CODE.MODE_MODIFY && (
-              <h2 className="tit_2">회원 수정</h2>
-            )}
+            <EgovMenuHeader title="마이페이지" subTitle={getSubTitle()} />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/support/download/EgovDownloadCreate.jsx b/src/pages/support/download/EgovDownloadCreate.jsx
index d4d2e5a..f317492 100644
--- a/src/pages/support/download/EgovDownloadCreate.jsx
+++ b/src/pages/support/download/EgovDownloadCreate.jsx
@@ -4,6 +4,7 @@ import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavSupport
 import URL from "@/constants/url";
 
 import samplePdsListImg from "/assets/images/sample_pds_list.png";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovDownloadCreate() {
   return (
@@ -33,12 +34,11 @@ function EgovDownloadCreate() {
           <div className="contents PDS_REG" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">고객지원</h1>
-            </div>
-
-            <h2 className="tit_2">자료실</h2>
-            <h2 className="tit_7">본 화면은 디자인 예시임</h2>
+            <EgovMenuHeader
+              title="고객지원"
+              subTitle="자료실"
+              showExampleLabel
+            />
 
             {/* <!-- 상세 --> */}
             <div className="board_view3">
diff --git a/src/pages/support/download/EgovDownloadDetail.jsx b/src/pages/support/download/EgovDownloadDetail.jsx
index e2b55f2..f1b47d9 100644
--- a/src/pages/support/download/EgovDownloadDetail.jsx
+++ b/src/pages/support/download/EgovDownloadDetail.jsx
@@ -4,6 +4,7 @@ import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavSupport
 import URL from "@/constants/url";
 
 import samplePdsList from "/assets/images/sample_pds_list.png";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovDownloadDetail() {
   return (
@@ -33,12 +34,11 @@ function EgovDownloadDetail() {
           <div className="contents PDS_VIEW" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">고객지원</h1>
-            </div>
-
-            <h2 className="tit_2">자료실</h2>
-            <h2 className="tit_7">본 화면은 디자인 예시임</h2>
+            <EgovMenuHeader
+              title="고객지원"
+              subTitle="자료실"
+              showExampleLabel
+            />
 
             {/* <!-- 상세 --> */}
             <div className="board_view3">
diff --git a/src/pages/support/download/EgovDownloadList.jsx b/src/pages/support/download/EgovDownloadList.jsx
index 6d2730e..88338a5 100644
--- a/src/pages/support/download/EgovDownloadList.jsx
+++ b/src/pages/support/download/EgovDownloadList.jsx
@@ -4,6 +4,7 @@ import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavSupport
 import URL from "@/constants/url";
 
 import samplePdsListImg from "/assets/images/sample_pds_list.png";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovDownloadList() {
   return (
@@ -33,12 +34,11 @@ function EgovDownloadList() {
           <div className="contents PDS_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">고객지원</h1>
-            </div>
-
-            <h2 className="tit_2">자료실</h2>
-            <h2 className="tit_7">본 화면은 디자인 예시임</h2>
+            <EgovMenuHeader
+              title="고객지원"
+              subTitle="자료실"
+              showExampleLabel
+            />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">
diff --git a/src/pages/support/qna/EgovQnaDetail.jsx b/src/pages/support/qna/EgovQnaDetail.jsx
index f6f97c0..824f8f8 100644
--- a/src/pages/support/qna/EgovQnaDetail.jsx
+++ b/src/pages/support/qna/EgovQnaDetail.jsx
@@ -1,6 +1,7 @@
 import { Link } from "react-router-dom";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavSupport";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovQnaDetail() {
   return (
@@ -30,12 +31,11 @@ function EgovQnaDetail() {
           <div className="contents QNA_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">고객지원</h1>
-            </div>
-
-            <h2 className="tit_2">Q&amp;A 상세조회</h2>
-            <h2 className="tit_7">본 화면은 디자인 예시임</h2>
+            <EgovMenuHeader
+              title="고객지원"
+              subTitle="Q&amp;A 상세조회"
+              showExampleLabel
+            />
 
             <div className="board_view2">
               <dl>
diff --git a/src/pages/support/qna/EgovQnaList.jsx b/src/pages/support/qna/EgovQnaList.jsx
index 30e6167..345633b 100644
--- a/src/pages/support/qna/EgovQnaList.jsx
+++ b/src/pages/support/qna/EgovQnaList.jsx
@@ -2,6 +2,7 @@ import { Link } from "react-router-dom";
 
 import { default as EgovLeftNav } from "@/components/leftmenu/EgovLeftNavSupport";
 import URL from "@/constants/url";
+import EgovMenuHeader from "@/components/EgovMenuHeader";
 
 function EgovQnaList() {
   return (
@@ -31,12 +32,11 @@ function EgovQnaList() {
           <div className="contents QNA_LIST" id="contents">
             {/* <!-- 본문 --> */}
 
-            <div className="top_tit">
-              <h1 className="tit_1">고객지원</h1>
-            </div>
-
-            <h2 className="tit_2">묻고답하기(Q&amp;A)</h2>
-            <h2 className="tit_7">본 화면은 디자인 예시임</h2>
+            <EgovMenuHeader
+              title="고객지원"
+              subTitle="묻고답하기(Q&amp;A)"
+              showExampleLabel
+            />
 
             {/* <!-- 검색조건 --> */}
             <div className="condition">