diff --git a/src/assets/components/admin/yagada-rabbit.png b/src/assets/components/admin/yagada-rabbit.png
new file mode 100644
index 0000000..f6bb616
Binary files /dev/null and b/src/assets/components/admin/yagada-rabbit.png differ
diff --git a/src/commons/svgs/AdminButton.jsx b/src/commons/svgs/AdminButton.jsx
new file mode 100644
index 0000000..dcdfe6f
--- /dev/null
+++ b/src/commons/svgs/AdminButton.jsx
@@ -0,0 +1,7 @@
+export const AdminButton = () => {
+  return (
+    <svg viewBox="0 0 24 24" fill="currentColor">
+      <path d="M12 2 2 7v6c0 5 5 9 10 9s10-4 10-9V7l-10-5zM12 18a2.5 2.5 0 110-5 2.5 2.5 0 010 5zm4-8H8V9a4 4 0 018 0v1z" />
+    </svg>
+  );
+};
diff --git a/src/components/admin/AdminHeader.jsx b/src/components/admin/AdminHeader.jsx
new file mode 100644
index 0000000..024ee4f
--- /dev/null
+++ b/src/components/admin/AdminHeader.jsx
@@ -0,0 +1,28 @@
+import {
+  ADMIN_ANNOUNCE_URL,
+  ADMIN_MANAGE_CUSTOMER_URL,
+  ADMIN_MANAGE_REPORT_URL,
+  ADMIN_MANAGE_USER_URL,
+  ROOT_URL,
+} from "constants/url";
+import { Link } from "react-router-dom";
+import logo from "assets/commons/home-logo.png";
+import "styles/components/admin/AdminHeader.scss";
+import Profile from "components/home/Profile";
+
+export const AdminHeader = () => {
+  return (
+    <header className="admin-page-header">
+      <Link to={ROOT_URL}>
+        <img src={logo} alt="logo" className="home-logo-img" />
+      </Link>
+      <nav className="admin-page-nav-container">
+        <Link to={ADMIN_ANNOUNCE_URL}>공지 관리</Link>
+        <Link to={ADMIN_MANAGE_USER_URL}>유저 관리</Link>
+        <Link to={ADMIN_MANAGE_REPORT_URL}>신고 관리</Link>
+        <Link to={ADMIN_MANAGE_CUSTOMER_URL}>고객센터</Link>
+      </nav>
+      <Profile />
+    </header>
+  );
+};
diff --git a/src/components/admin/AnnounceManageBar.jsx b/src/components/admin/AnnounceManageBar.jsx
new file mode 100644
index 0000000..0d8f654
--- /dev/null
+++ b/src/components/admin/AnnounceManageBar.jsx
@@ -0,0 +1,31 @@
+import { ADMIN_ANNOUNCE_URL } from "constants/url";
+import { Link, useNavigate } from "react-router-dom";
+import { eraseNotification } from "services/admin/admin";
+import "styles/components/admin/AnnounceManageBar.scss";
+
+export const AnnounceManageBar = ({ notificationId }) => {
+  const navigate = useNavigate();
+
+  const handleDelete = async () => {
+    try {
+      await eraseNotification(notificationId);
+      navigate(ADMIN_ANNOUNCE_URL);
+    } catch (error) {
+      console.error("삭제 실패:", error);
+    }
+  };
+
+  return (
+    <div className="announce-manage-button-bar">
+      <Link
+        to={`${ADMIN_ANNOUNCE_URL}/${notificationId}/edit`}
+        className="button--edit"
+      >
+        수정
+      </Link>
+      <button className="button--delete" onClick={handleDelete}>
+        삭제
+      </button>
+    </div>
+  );
+};
diff --git a/src/components/home/EnterAdmin.jsx b/src/components/home/EnterAdmin.jsx
new file mode 100644
index 0000000..fd2d913
--- /dev/null
+++ b/src/components/home/EnterAdmin.jsx
@@ -0,0 +1,31 @@
+import { AdminButton } from "commons/svgs/AdminButton";
+import { ADMIN_URL } from "constants/url";
+import React from "react";
+import { useNavigate } from "react-router-dom";
+import "styles/components/home/EnterAdmin.scss";
+
+export const EnterAdmin = () => {
+  const navigate = useNavigate();
+
+  const handleClick = () => {
+    navigate(ADMIN_URL);
+  };
+
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      handleClick();
+    }
+  };
+
+  return (
+    <button
+      className="admin-button"
+      type="button"
+      onClick={handleClick}
+      onKeyDown={handleKeyDown}
+    >
+      <AdminButton />
+    </button>
+  );
+};
diff --git a/src/components/home/Home.jsx b/src/components/home/Home.jsx
index fbe04f5..bf74f3b 100644
--- a/src/components/home/Home.jsx
+++ b/src/components/home/Home.jsx
@@ -12,8 +12,8 @@ import { getUserInfoAPI } from "services/user/user";
 import "styles/components/home/Home.scss";
 import { getAuthToken } from "utils/token";
 import { getUserInfo } from "utils/user";
+import { EnterAdmin } from "components/home/EnterAdmin.jsx";
 import { RankingPreview } from "components/home/RankingPreview.jsx";
-
 const Home = () => {
   const navigate = useNavigate();
   const { isSignIn } = useOutletContext();
@@ -84,6 +84,7 @@ const Home = () => {
           <IntroduceCharacterPreview />
         </div>
       </div>
+      <EnterAdmin />
     </div>
   );
 };
diff --git a/src/constants/api.js b/src/constants/api.js
index 56be9cc..62884b7 100644
--- a/src/constants/api.js
+++ b/src/constants/api.js
@@ -70,12 +70,18 @@ export const SOCKET_CHAT_PRIVATE = process.env.REACT_APP_WS_CHAT_PRIVATE_API;
 // 공지사항 API
 export const ANNOUNCE_LIST_API = process.env.REACT_APP_ANNOUNCE_LIST_API;
 
+// 관리자 API
+export const ADMIN_ANNOUNCE_MANAGE_API =
+  process.env.REACT_APP_ADMIN_ANNOUNCE_MANAGE_API;
+export const ADMIN_QNA_MANAGE_API = process.env.ADMIN_QNA_MANAGE_API;
+export const ADMIN_REPORT_API = process.env.REACT_APP_ADMIN_REPORT_API;
 // 서비스센터 API
 export const SERVICE_LIST_API = process.env.REACT_APP_SERVICE_LIST_API;
 export const SERVICE_MY_LIST_API = process.env.REACT_APP_SERVICE_MY_LIST_API;
 export const SERVICE_QNA_API = process.env.REACT_APP_SERVICE_QNA;
 
+
 export const RANKING_API = process.env.REACT_APP_RANKING_API;
 export const RANkING_MY_API = process.env.REACT_APP_MY_RANKING_API;
 
-export const AI_SERVER_IP = process.env.REACT_APP_AI_SERVER_IP;
\ No newline at end of file
+export const AI_SERVER_IP = process.env.REACT_APP_AI_SERVER_IP;
diff --git a/src/constants/url.js b/src/constants/url.js
index 447fa5e..8b46777 100644
--- a/src/constants/url.js
+++ b/src/constants/url.js
@@ -5,6 +5,13 @@ export const SIGN_UP_URL = "/signup"; // 회원가입
 export const ACCOUNT_URL = "/find/account"; // 비밀번호 찾기
 export const WITHDRAW_URL = "/withdraw"; // 비밀번호 찾기
 
+export const ADMIN_URL = "/admin";
+export const ADMIN_ANNOUNCE_URL = "/admin/announce"; //공지사항 관리
+export const ADMIN_CREATE_ANNOUNCE_URL = "/admin/announce/create"; //공지 생성
+export const ADMIN_MANAGE_USER_URL = "/admin/user-manage"; // 유저 관리
+export const ADMIN_MANAGE_REPORT_URL = "/admin/report-manage"; //신고 관리
+export const ADMIN_MANAGE_CUSTOMER_URL = "/admin/customer-manage"; //고객센터 1ㄷ1 문의 관리
+
 export const LOBBY_URL = "/lobby"; // 로비
 export const MY_PAGE_URL = "/lobby/myinfo"; // 마이페이지
 export const MY_RECORD_URL = "/lobby/myinfo/record"; // 마이페이지 내 전적
diff --git a/src/pages/admin/AdminHome.jsx b/src/pages/admin/AdminHome.jsx
new file mode 100644
index 0000000..fc4e6e3
--- /dev/null
+++ b/src/pages/admin/AdminHome.jsx
@@ -0,0 +1,9 @@
+import "styles/pages/admin/AdminHome.scss";
+import yagadaRabbit from "assets/components/admin/yagada-rabbit.png";
+export const AdminHome = () => {
+  return (
+    <div className="admin-home-container">
+      <img src={yagadaRabbit} />
+    </div>
+  );
+};
diff --git a/src/pages/admin/AdminPage.jsx b/src/pages/admin/AdminPage.jsx
new file mode 100644
index 0000000..5bc7c15
--- /dev/null
+++ b/src/pages/admin/AdminPage.jsx
@@ -0,0 +1,41 @@
+import { AdminHeader } from "components/admin/AdminHeader";
+import ScrollToTop from "components/common/ScrollToTop";
+import { useEffect } from "react";
+import { Outlet } from "react-router-dom";
+import { tokenReissueAPI } from "services/auth/auth";
+import "styles/pages/admin/AdminPage.scss";
+import { getAuthToken } from "utils/token";
+
+const AdminPage = () => {
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, []);
+
+  return (
+    <div className="admin-page-container">
+      <ScrollToTop />
+      <AdminHeader />
+      <Outlet />
+    </div>
+  );
+};
+
+export default AdminPage;
+
+export const loader = async () => {
+  const { accessToken, setAccessToken } = getAuthToken();
+
+  if (!accessToken) {
+    // 토큰 재발급
+    try {
+      const res = await tokenReissueAPI();
+      const newAccessToken = res.accessToken;
+      const expireTime = res.expiredAt;
+      setAccessToken(newAccessToken, expireTime);
+    } catch (e) {
+      console.error(e);
+      return { isSignIn: false };
+    }
+  }
+  return { isSignIn: true };
+};
diff --git a/src/pages/admin/AnnounceEditPage.jsx b/src/pages/admin/AnnounceEditPage.jsx
new file mode 100644
index 0000000..d562cfd
--- /dev/null
+++ b/src/pages/admin/AnnounceEditPage.jsx
@@ -0,0 +1,86 @@
+import CloseButton from "commons/ui/button/CloseButton";
+import { useNavigate, useParams } from "react-router-dom";
+import "styles/pages/admin/AnnounceEditPage.scss";
+import { useEffect, useState } from "react";
+import { getAnnounceDetailAPI } from "services/home/announce";
+import useUserInformationStore from "store/userInformation";
+import { updateAnnounceAPI } from "services/admin/admin";
+import { ADMIN_ANNOUNCE_URL } from "constants/url";
+
+const AnnounceEditPage = () => {
+  const navigate = useNavigate();
+  const { id } = useParams();
+  const [title, setTitle] = useState("");
+  const [content, setContent] = useState("");
+  const [loading, setLoading] = useState(true);
+
+  const profile = useUserInformationStore((state) => state.profile);
+  const isAdminMode =
+    profile?.role === "ADMIN" && window.location.pathname.includes("admin");
+
+  const closeEditPage = () => navigate(-1);
+
+  useEffect(() => {
+    const fetchDetail = async () => {
+      try {
+        const res = await getAnnounceDetailAPI(id);
+        setTitle(res.title);
+        setContent(res.content);
+      } catch (err) {
+        alert("공지사항 정보를 불러오지 못했습니다.");
+      } finally {
+        setLoading(false);
+      }
+    };
+    fetchDetail();
+  }, [id]);
+
+  const handleSubmit = async () => {
+    try {
+      const notificationInfo = { id, title, content };
+      await updateAnnounceAPI(notificationInfo);
+      navigate(`${ADMIN_ANNOUNCE_URL}/${id}`);
+    } catch (err) {
+      console.log(err);
+      alert("공지 수정에 실패했습니다.");
+    }
+  };
+
+  if (!isAdminMode) return <div>권한이 없습니다.</div>;
+  if (loading) return <div className="announce-edit-loading">로딩 중...</div>;
+
+  return (
+    <div className="announce-edit-page-container">
+      <article className="announce-edit-container">
+        <header className="announce-edit-header">
+          <CloseButton onClick={closeEditPage} />
+        </header>
+
+        <div className="announce-edit-content">
+          <div className="content-title">
+            <input
+              type="text"
+              className="edit-title-input"
+              value={title}
+              onChange={(e) => setTitle(e.target.value)}
+              placeholder="공지 제목을 입력하세요"
+            />
+          </div>
+
+          <textarea
+            className="edit-content-input"
+            value={content}
+            onChange={(e) => setContent(e.target.value)}
+            placeholder="공지 내용을 입력하세요"
+          />
+
+          <button className="save-button" onClick={handleSubmit}>
+            수정 완료
+          </button>
+        </div>
+      </article>
+    </div>
+  );
+};
+
+export default AnnounceEditPage;
diff --git a/src/pages/admin/CreateAnnouncePage.jsx b/src/pages/admin/CreateAnnouncePage.jsx
new file mode 100644
index 0000000..fd200e6
--- /dev/null
+++ b/src/pages/admin/CreateAnnouncePage.jsx
@@ -0,0 +1,46 @@
+import React, { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { postAnnounceAPI } from "services/admin/admin";
+import "styles/pages/admin/CreateAnnouncePage.scss";
+
+export const CreateAnnouncePage = () => {
+  const [title, setTitle] = useState("");
+  const [content, setContent] = useState("");
+  const navigate = useNavigate();
+  const handleSubmit = async () => {
+    if (!title || !content) {
+      return;
+    }
+    const notification = { title, content };
+    try {
+      await postAnnounceAPI(notification);
+      navigate(-1);
+    } catch (error) {
+      console.error(error);
+      alert("등록 중 오류가 발생했습니다.");
+    }
+  };
+
+  return (
+    <div className="announce-create-container">
+      <input
+        className="announce-create-title"
+        type="text"
+        placeholder="공지사항 제목 입력"
+        value={title}
+        onChange={(e) => setTitle(e.target.value)}
+      />
+
+      <textarea
+        className="announce-create-content"
+        placeholder="내용을 입력하세요"
+        value={content}
+        onChange={(e) => setContent(e.target.value)}
+      />
+
+      <button className="announce-submit" onClick={handleSubmit}>
+        등록
+      </button>
+    </div>
+  );
+};
diff --git a/src/pages/home/AnnounceDetailPage.jsx b/src/pages/home/AnnounceDetailPage.jsx
index b26bd5c..66715f7 100644
--- a/src/pages/home/AnnounceDetailPage.jsx
+++ b/src/pages/home/AnnounceDetailPage.jsx
@@ -5,6 +5,8 @@ import "styles/pages/home/AnnounceDetailPage.scss";
 import { formatDate } from "utils/time";
 import { useEffect, useState } from "react";
 import { getAnnounceDetailAPI } from "services/home/announce";
+import useUserInformationStore from "store/userInformation";
+import { AnnounceManageBar } from "components/admin/AnnounceManageBar";
 
 /** 공통 상태 컴포넌트 */
 const AnnounceStatus = ({ type, message }) => (
@@ -20,6 +22,10 @@ const AnnounceDetailPage = () => {
   const [notice, setNotice] = useState(null);
   const [status, setStatus] = useState({ loading: true, error: null });
 
+  const profile = useUserInformationStore((state) => state.profile);
+  const isAdminMode =
+    profile?.role === "ADMIN" && window.location.href.includes("admin");
+
   const closeDetailPage = () => navigate(-1);
 
   useEffect(() => {
@@ -67,6 +73,7 @@ const AnnounceDetailPage = () => {
             {notice.title}
           </div>
           <div className="content-description">{notice.content}</div>
+          {isAdminMode && <AnnounceManageBar notificationId={id} />}
         </div>
       </article>
     </div>
diff --git a/src/pages/home/AnnouncePage.jsx b/src/pages/home/AnnouncePage.jsx
index 580d78c..6567dfd 100644
--- a/src/pages/home/AnnouncePage.jsx
+++ b/src/pages/home/AnnouncePage.jsx
@@ -7,6 +7,9 @@ import Pagination from "commons/ui/Pagination";
 import { getAnnounceListAPI } from "services/home/announce";
 import { EmptyContent } from "commons/emptyContent/EmptyContent";
 import AnnounceSortButtons from "commons/ui/button/AnnounceSortButton";
+import useUserInformationStore from "store/userInformation";
+import { getAnnounceDetailLink } from "utils/user";
+import { ADMIN_CREATE_ANNOUNCE_URL } from "constants/url";
 
 const getTabClassName = (tabName, currentTab) => {
   const classes = ["tab"];
@@ -29,6 +32,10 @@ const AnnouncePage = () => {
   const sortOrder = searchParams.get("sort") || "DATE_DESC";
   const tabType = searchParams.get("type") || "";
 
+  const profile = useUserInformationStore((state) => state.profile);
+  const isAdminMode =
+    profile?.role === "ADMIN" && window.location.href.includes("admin");
+
   /** 공지사항 API 호출 */
   const fetchNotices = async (page = 1, sort = "DATE_DESC", type = "") => {
     try {
@@ -134,7 +141,10 @@ const AnnouncePage = () => {
               key={`notice-${notice.notificationId}`}
               className="announce-item"
             >
-              <Link className="title" to={`/announce/${notice.notificationId}`}>
+              <Link
+                className="title"
+                to={getAnnounceDetailLink(isAdminMode, notice.notificationId)}
+              >
                 {notice.title}
               </Link>
               <div className="meta">
@@ -143,6 +153,14 @@ const AnnouncePage = () => {
             </div>
           ))
         )}
+        {isAdminMode && (
+          <Link
+            to={ADMIN_CREATE_ANNOUNCE_URL}
+            className="announce-create-button"
+          >
+            ✏️
+          </Link>
+        )}
       </div>
 
       <div className="announce-pagination">
diff --git a/src/routes/admin.js b/src/routes/admin.js
new file mode 100644
index 0000000..4dc0f40
--- /dev/null
+++ b/src/routes/admin.js
@@ -0,0 +1,50 @@
+import { AdminHome } from "pages/admin/AdminHome";
+import AdminPage, { loader as adminLoader } from "pages/admin/AdminPage";
+import AnnounceEditPage from "pages/admin/AnnounceEditPage";
+import { CreateAnnouncePage } from "pages/admin/CreateAnnouncePage";
+import AnnounceDetailPage from "pages/home/AnnounceDetailPage";
+import AnnouncePage from "pages/home/AnnouncePage";
+
+const admin = [
+  {
+    path: "/admin",
+    element: <AdminPage />,
+    loader: adminLoader,
+    children: [
+      {
+        index: true,
+        element: <AdminHome />,
+      },
+      {
+        path: "announce",
+        element: <AnnouncePage />,
+      },
+      {
+        path: "announce/:id",
+        element: <AnnounceDetailPage />,
+      },
+      {
+        path: "announce/:id/edit",
+        element: <AnnounceEditPage />,
+      },
+      {
+        path: "announce/create",
+        element: <CreateAnnouncePage />,
+      },
+      {
+        path: "user-manage",
+        element: <>유저 관리</>,
+      },
+      {
+        path: "report-manage",
+        element: <>신고 관리</>,
+      },
+      {
+        path: "customer-center",
+        element: <>1ㄷ1 문의 관리</>,
+      },
+    ],
+  },
+];
+
+export default admin;
diff --git a/src/routes/root.js b/src/routes/root.js
index ad81782..5b86c34 100644
--- a/src/routes/root.js
+++ b/src/routes/root.js
@@ -3,13 +3,14 @@ import { createBrowserRouter } from "react-router-dom";
 import auth from "routes/auth";
 import home from "routes/home";
 import lobby from "routes/lobby";
+import admin from "routes/admin";
 
 const router = createBrowserRouter([
   {
     path: "/",
     element: <RootLayout />,
     loader: rootLoader,
-    children: [...auth, ...home, ...lobby],
+    children: [...auth, ...home, ...lobby, ...admin],
   },
 ]);
 
diff --git a/src/services/admin/admin.js b/src/services/admin/admin.js
new file mode 100644
index 0000000..d3cc18b
--- /dev/null
+++ b/src/services/admin/admin.js
@@ -0,0 +1,32 @@
+import { ADMIN_ANNOUNCE_MANAGE_API } from "constants/api";
+import { apiInterface } from "services/axiosForm";
+
+export const eraseNotification = async (notificationId) => {
+  return await apiInterface(
+    "delete",
+    `${ADMIN_ANNOUNCE_MANAGE_API}/${notificationId}`,
+    { notificationId },
+    {},
+    true
+  );
+};
+
+export const updateAnnounceAPI = async (notification) => {
+  return await apiInterface(
+    "put",
+    `${ADMIN_ANNOUNCE_MANAGE_API}/${notification.id}`,
+    { title: notification.title, content: notification.content },
+    {},
+    true
+  );
+};
+
+export const postAnnounceAPI = async (notification) => {
+  return await apiInterface(
+    "post",
+    `${ADMIN_ANNOUNCE_MANAGE_API}`,
+    { title: notification.title, content: notification.content },
+    {},
+    true
+  );
+};
diff --git a/src/styles/components/admin/AdminHeader.scss b/src/styles/components/admin/AdminHeader.scss
new file mode 100644
index 0000000..f1b4ac0
--- /dev/null
+++ b/src/styles/components/admin/AdminHeader.scss
@@ -0,0 +1,30 @@
+.admin-page-header {
+  position: fixed;
+  z-index: 100;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 54px;
+  width: 100%;
+  height: 20%;
+  background: white;
+  img {
+    width: 366px;
+    height: 58px;
+  }
+
+  a {
+    text-decoration: none;
+    color: black;
+    font-size: 14px;
+    font-family: "SUIT-Regular";
+  }
+
+  .admin-page-nav-container {
+    display: flex;
+    justify-content: center;
+    white-space: nowrap;
+    width: 600px;
+    gap: 80px;
+  }
+}
diff --git a/src/styles/components/admin/AnnounceManageBar.scss b/src/styles/components/admin/AnnounceManageBar.scss
new file mode 100644
index 0000000..6c78b64
--- /dev/null
+++ b/src/styles/components/admin/AnnounceManageBar.scss
@@ -0,0 +1,42 @@
+.announce-manage-button-bar {
+    display: flex;
+    align-items: center;
+    gap: 138px;
+    a {
+        text-decoration: none;
+    }
+    .button--edit {
+        padding: 8px 16px;
+        height: 40px;
+        width: 194px;
+        border: none;
+        border-radius: 4px;
+        color: #fff;
+        cursor: pointer;
+        font-size: 14px;
+        font-weight: 600;
+        line-height: 1;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        background: #F28110; 
+    }
+
+    .button--delete {
+        width: 194px;
+        padding: 8px 16px;
+        height: 40px;
+        border: none;
+        border-radius: 4px;
+        color: #fff;
+        cursor: pointer;
+        font-size: 14px;
+        font-weight: 600;
+        line-height: 1;
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        background: #808080;
+    }
+
+}
\ No newline at end of file
diff --git a/src/styles/components/home/EnterAdmin.scss b/src/styles/components/home/EnterAdmin.scss
new file mode 100644
index 0000000..522c802
--- /dev/null
+++ b/src/styles/components/home/EnterAdmin.scss
@@ -0,0 +1,24 @@
+.admin-button {
+  position: fixed;
+  right: 24px;
+  bottom: 24px;
+  z-index: 1000;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  border: none;
+  background: #1976d2;
+  color: #fff;
+  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+
+  svg {
+    width: 24px;
+    height: 24px;
+    display: block;
+  }
+}
diff --git a/src/styles/pages/admin/AdminHome.scss b/src/styles/pages/admin/AdminHome.scss
new file mode 100644
index 0000000..c421b19
--- /dev/null
+++ b/src/styles/pages/admin/AdminHome.scss
@@ -0,0 +1,16 @@
+.admin-home-container {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 300px;
+  font-size: 200px;
+  height: auto;
+  background-color: white;
+  img{
+    width: 400px;
+    height: auto;
+  }
+}
diff --git a/src/styles/pages/admin/AdminPage.scss b/src/styles/pages/admin/AdminPage.scss
new file mode 100644
index 0000000..a654765
--- /dev/null
+++ b/src/styles/pages/admin/AdminPage.scss
@@ -0,0 +1,9 @@
+.admin-page-container {
+  position: relative;
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  height: auto;
+  background-color: white;
+}
diff --git a/src/styles/pages/admin/AnnounceEditPage.scss b/src/styles/pages/admin/AnnounceEditPage.scss
new file mode 100644
index 0000000..5e70254
--- /dev/null
+++ b/src/styles/pages/admin/AnnounceEditPage.scss
@@ -0,0 +1,93 @@
+.announce-edit-page-container {
+  position: relative;
+  width: 1278px;
+  min-height: 100vh;
+  padding-top: 186px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  font-family: SUIT-Regular;
+
+  .announce-edit-container {
+    width: 1278px;
+    height: calc(100vh - 244px);
+
+    position: absolute;
+    top: 244px;
+
+    background: #ffffff;
+    border-width: 1.5px 1.5px 0 1.5px;
+    border-style: solid;
+    border-color: #000;
+    border-radius: 24px 24px 0 0    ;
+    box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.25);
+
+    animation: slideUpFade 0.4s ease-out forwards;
+
+
+    .announce-edit-header {
+      position: relative;
+
+      .close-btn {
+        position: absolute;
+        right: 35px;
+        top: 29px;
+      }
+    }
+
+    .announce-edit-content {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      padding-top: 120px;
+      gap: 35px;
+    
+
+      .content-title {
+        display: flex;
+        align-items: center;
+        gap: 30px;
+        width: 960px;
+
+        .edit-title-input {
+        background-color: #F2F3F6;
+         width: 960px;
+          height: 44px;
+          font-size: 20px;
+          border: 1px solid #ccc;
+          padding: 0 12px;
+          text-align: center;
+        }
+      }
+
+      .edit-content-input {
+        background-color: #F2F3F6;
+        width: 960px;
+        border: 1px solid #ccc;
+        padding: 36px 120px;
+        font-size: 18px;
+        line-height: 1.4;
+        text-align: center;
+        overflow: auto;  
+      }
+
+      .save-button {
+        margin-top: 16px;
+        width: 960px;
+        height: 40px;
+        border: none;
+        border-radius: 6px;
+        font-size: 16px;
+        font-weight: 700;
+        background: #FFDA37;
+        color: black;
+        cursor: pointer;
+        transition: 0.2s;
+
+        &:hover {
+          opacity: 0.9;
+        }
+      }
+    }
+  }
+}
diff --git a/src/styles/pages/admin/CreateAnnouncePage.scss b/src/styles/pages/admin/CreateAnnouncePage.scss
new file mode 100644
index 0000000..965c7be
--- /dev/null
+++ b/src/styles/pages/admin/CreateAnnouncePage.scss
@@ -0,0 +1,53 @@
+.announce-create-container {
+position: relative;
+  width: 1278px;
+  min-height: 100vh;
+  padding-top: 186px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  font-family: SUIT-Regular;
+}
+
+.announce-create-title {
+  width: 1170px;
+  height: 50px;
+  border-radius: 20px;
+  border: 2px solid black;
+  padding: 0 20px;
+  font-size: 18px;
+  outline: none;
+  margin-bottom: 15px;
+
+  &::placeholder {
+    text-align: center;
+    color: #aaa;
+  }
+}
+
+.announce-create-content {
+  width: 1170px;
+  height: 350px;
+  border: 2px solid #ccc;
+  border-radius: 20px;
+  padding: 20px;
+  font-size: 16px;
+  outline: none;
+  resize: none;
+}
+
+.announce-submit {
+  margin-top: 19px;
+  width: 336px;
+  height: 40px;
+  background-color: #d48b43;
+  color: white;
+  border: none;
+  border-radius: 6px;
+  font-size: 17px;
+  cursor: pointer;
+
+  &:hover {
+    background-color: #bf7a38;
+  }
+}
diff --git a/src/styles/pages/home/AnnouncePage.scss b/src/styles/pages/home/AnnouncePage.scss
index fa0c4c9..17f5640 100644
--- a/src/styles/pages/home/AnnouncePage.scss
+++ b/src/styles/pages/home/AnnouncePage.scss
@@ -102,6 +102,38 @@
     .empty {
       margin-top: 108px;
     }
+    .announce-create-button {
+      text-decoration: none;
+      position: fixed;
+      right: 24px;
+      bottom: 24px;
+      width: 56px;
+      height: 56px;
+      border-radius: 50%;
+      background: rgb(17, 125, 202);
+      border: 2px solid #000;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-family: YoonChild;
+      font-size: 18px;
+      color: #fff;
+      cursor: pointer;
+      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
+      z-index: 999;
+      user-select: none;
+      transition: transform 120ms ease, box-shadow 120ms ease;
+
+      &:hover {
+        transform: translateY(-3px);
+      }
+
+      &:active {
+        transform: translateY(0);
+        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
+      }
+
+    }
   }
 
   /* 페이지네이션 */
diff --git a/src/utils/user.js b/src/utils/user.js
index 0ecb913..97dff89 100644
--- a/src/utils/user.js
+++ b/src/utils/user.js
@@ -1,3 +1,5 @@
+import { ADMIN_ANNOUNCE_URL, ANNOUNCE_URL } from "constants/url";
+
 // src/utils/getUserInfo.js
 const { default: useUserInformationStore } = require("store/userInformation");
 
@@ -34,4 +36,7 @@ const getUserName = () => {
   return nickname;
 };
 
-export { getUserInfo, getUserUuid, getUserName };
+const getAnnounceDetailLink = (isAdmin, id) => {
+  return isAdmin ? `${ADMIN_ANNOUNCE_URL}/${id}` : `${ANNOUNCE_URL}/${id}`;
+};
+export { getUserInfo, getUserUuid, getUserName, getAnnounceDetailLink };