diff --git a/components/common/LoadingSpinner.tsx b/components/common/LoadingSpinner.tsx
new file mode 100644
index 0000000..5a50fc2
--- /dev/null
+++ b/components/common/LoadingSpinner.tsx
@@ -0,0 +1,19 @@
+import React from 'react';
+
+const LoadingSpinner = () => {
+  return (
+    <div className="flex min-h-screen items-center justify-center">
+      <div className="flex flex-col items-center gap-4">
+        {/* 스피너 */}
+        <div className="relative h-16 w-16">
+          <div className="absolute h-16 w-16 animate-spin rounded-full border-4 border-gray-200"></div>
+          <div className="absolute h-16 w-16 animate-spin rounded-full border-4 border-transparent border-t-orange-500"></div>
+        </div>
+        {/* 로딩 텍스트 */}
+        <p className="text-lg font-medium text-gray-600">로딩중...</p>
+      </div>
+    </div>
+  );
+};
+
+export default LoadingSpinner;
diff --git a/pages/owner/shops/[shopId]/notice.tsx b/pages/owner/shops/[shopId]/notice.tsx
index ebc20b5..4a0c951 100644
--- a/pages/owner/shops/[shopId]/notice.tsx
+++ b/pages/owner/shops/[shopId]/notice.tsx
@@ -11,12 +11,14 @@ import Button from '@/components/common/Button';
 import Input from '@/components/common/Input';
 import AlertModal from '@/components/common/modal/AlertModal';
 import BadgeClose from '@/components/icons/BadgeClose';
+import LoadingSpinner from '@/components/common/LoadingSpinner';
 
 const PostNotice = () => {
   const [hourlyPay, setHourlyPay] = useState('');
   const [startsAt, setStartsAt] = useState('');
   const [workhour, setWorkhour] = useState('');
   const [description, setDescription] = useState('');
+  const [loading, setLoading] = useState(true);
   const [originalPay, setOriginalPay] = useState<number>(0);
   const textareaRef = useRef<HTMLTextAreaElement>(null);
   const router = useRouter();
@@ -25,23 +27,22 @@ const PostNotice = () => {
   const [errorModalOpen, setErrorModalOpen] = useState(false);
   const [errorMessage, setErrorMessage] = useState('');
 
-  // 로그인 체크 및 shopId 확인
+  // 로그인 체크 및 가게 정보 불러오기
   useEffect(() => {
-    const checkAuth = () => {
+    const initializePage = async () => {
+      // 1. 로그인 체크
       const userId = localStorage.getItem('userId');
       if (!userId) {
         router.push('/login');
         return;
       }
-    };
-    checkAuth();
-  }, [router]);
 
-  // 가게 정보 불러오기 (originalHourlyPay 가져오기)
-  useEffect(() => {
-    const fetchShopData = async () => {
-      if (!shopId || typeof shopId !== 'string') return;
+      // 2. shopId 확인
+      if (!shopId || typeof shopId !== 'string') {
+        return;
+      }
 
+      // 3. 가게 정보 불러오기
       try {
         const shopRes = await shops.getShop(shopId);
         if (shopRes?.item?.originalHourlyPay) {
@@ -49,17 +50,26 @@ const PostNotice = () => {
         }
       } catch (error) {
         console.error('가게 정보 불러오기 실패:', error);
+        setErrorMessage('가게 정보를 불러오는데 실패했습니다.');
+        setErrorModalOpen(true);
+      } finally {
+        setLoading(false);
       }
     };
 
-    fetchShopData();
-  }, [shopId]);
+    initializePage();
+  }, [router, shopId]);
+
+  // 로딩 중일 때
+  if (loading) {
+    return <LoadingSpinner />;
+  }
 
-  // shopId가 없으면 로딩 상태 표시
+  // shopId가 없을 때
   if (!shopId) {
     return (
       <div className="flex min-h-screen items-center justify-center">
-        로딩중...
+        <p className="text-lg text-gray-600">잘못된 접근입니다.</p>
       </div>
     );
   }
diff --git a/pages/owner/shops/[shopId]/notices/[noticeId].tsx b/pages/owner/shops/[shopId]/notices/[noticeId].tsx
index a576cf3..8dba627 100644
--- a/pages/owner/shops/[shopId]/notices/[noticeId].tsx
+++ b/pages/owner/shops/[shopId]/notices/[noticeId].tsx
@@ -10,6 +10,7 @@ import PostBanner from '@/components/owner/PostBanner';
 import { transformApplicationData } from '@/lib/utils/transformTableData';
 import { calculatePercentage } from '@/utils/transformNotice';
 import AlertModal from '@/components/common/modal/AlertModal';
+import LoadingSpinner from '@/components/common/LoadingSpinner';
 
 const NoticeDetail = () => {
   const router = useRouter();
@@ -19,7 +20,7 @@ const NoticeDetail = () => {
   >(null);
   const [shop, setShop] = useState<(ShopRequest & { id: string }) | null>(null);
   const [applicationList, setApplicationList] = useState<ApplicationItem[]>([]);
-  const [_loading, setLoading] = useState(true);
+  const [loading, setLoading] = useState(true);
   const [_actionLoading, setActionLoading] = useState<string | null>(null);
 
   // 에러 모달 상태
@@ -50,6 +51,7 @@ const NoticeDetail = () => {
     const fetchNotice = async () => {
       try {
         setLoading(true);
+        if (loading) return <LoadingSpinner />;
 
         // 1. 공고 상세 조회
         const noticeRes = await notices.getShopNotice(
@@ -58,6 +60,7 @@ const NoticeDetail = () => {
         );
 
         const noticeData = noticeRes.item;
+
         setNotice({
           id: noticeData.id,
           hourlyPay: noticeData.hourlyPay,
@@ -166,7 +169,8 @@ const NoticeDetail = () => {
       setActionLoading(null);
     }
   };
-
+  // 로딩 중일 때
+  if (loading) return <LoadingSpinner />;
   if (!notice) return <div className="p-6">공고를 찾을 수 없습니다.</div>;
 
   return (
diff --git a/pages/owner/shops/index.tsx b/pages/owner/shops/index.tsx
index a248b70..97afc2e 100644
--- a/pages/owner/shops/index.tsx
+++ b/pages/owner/shops/index.tsx
@@ -3,6 +3,7 @@ import { useEffect, useState } from 'react';
 import { useRouter } from 'next/router';
 
 import Button from '@/components/common/Button';
+import LoadingSpinner from '@/components/common/LoadingSpinner';
 
 const MyShop = () => {
   const [loading, setLoading] = useState(true);
@@ -23,7 +24,7 @@ const MyShop = () => {
     checkAuth();
   }, [router]);
 
-  if (loading) return <div>로딩중...</div>;
+  if (loading) return <LoadingSpinner />;
   if (error) return <div className="text-red-500">{error}</div>;
 
   return (