diff --git a/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx b/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx
index 3e1ca1d..2efa077 100644
--- a/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx
+++ b/src/app/(user-page)/my-meeting/_features/CardRightSection.tsx
@@ -54,6 +54,17 @@ const CardRightSection = ({
     }
   };
 
+  // 맴버 명단 보기
+  const handleShowMemberList = () => {
+    queryClient.setQueryData(
+      ['mymeeting', 'memberList', meetingId],
+      memberList,
+    );
+    router.push(
+      `/my-meeting/my/user-list?meetingId=${meetingId}&type=${showPublicSelect ? 'created' : 'joined'}`,
+    );
+  };
+
   const { data: currentUser, isLoading } = useBannerQueries();
   if (isLoading || !currentUser) {
     return;
@@ -109,12 +120,11 @@ const CardRightSection = ({
         </div>
       </div>
 
+      {/* <div className="flex flex-1 gap-[16px]"> */}
       <Button
         variant="outline"
         className="flex h-[40px] flex-1 md:h-[46px] lg:hidden"
-        onClick={() =>
-          router.push(`/my-meeting/my/user-list?meetingId=${meetingId}`)
-        }
+        onClick={handleShowMemberList}
       >
         맴버 명단 보기
       </Button>
@@ -122,6 +132,7 @@ const CardRightSection = ({
         <PublicSelect isPublic={isPublic} meetingId={meetingId} />
       )}
     </div>
+    // </div>
   );
 };
 
diff --git a/src/app/(user-page)/my-meeting/_features/Created.tsx b/src/app/(user-page)/my-meeting/_features/Created.tsx
index 05dcb81..fb75f60 100644
--- a/src/app/(user-page)/my-meeting/_features/Created.tsx
+++ b/src/app/(user-page)/my-meeting/_features/Created.tsx
@@ -67,6 +67,7 @@ const Created = () => {
                     isPublic={meeting.isPublic}
                     className="hidden lg:flex"
                     meetingId={meeting.meetingId}
+                    showPublicSelect={true}
                   />
                 </HorizonCard>
               </div>
@@ -96,6 +97,7 @@ const Created = () => {
                   isPublic={meeting.isPublic}
                   className="flex lg:hidden"
                   meetingId={meeting.meetingId}
+                  showPublicSelect={true}
                 />
               </div>
 
@@ -124,6 +126,7 @@ const Created = () => {
                   isPublic={meeting.isPublic}
                   className="flex lg:hidden"
                   meetingId={meeting.meetingId}
+                  showPublicSelect={true}
                 />
               </div>
             </div>
diff --git a/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx b/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx
index b44b09e..30f8ddc 100644
--- a/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx
+++ b/src/app/(user-page)/my-meeting/_features/ModalUserList.tsx
@@ -64,7 +64,7 @@ const ModalUserList = ({
                   <Tag
                     variant={user.memberStatus}
                     className="w-[49px] justify-center"
-                  />             
+                  />
                 )}
                 <div>
                   <Button
diff --git a/src/app/(user-page)/my-meeting/layout.tsx b/src/app/(user-page)/my-meeting/layout.tsx
new file mode 100644
index 0000000..c676fad
--- /dev/null
+++ b/src/app/(user-page)/my-meeting/layout.tsx
@@ -0,0 +1,14 @@
+import MeetingTypeTab from './_features/MeetingTypeTab';
+
+export default function layout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return (
+    <div>
+      <MeetingTypeTab />
+      {children}
+    </div>
+  );
+}
diff --git a/src/app/(user-page)/my-meeting/my/@modal/(.)user-list/page.tsx b/src/app/(user-page)/my-meeting/my/@modal/(.)user-list/page.tsx
index 230e330..7c846d8 100644
--- a/src/app/(user-page)/my-meeting/my/@modal/(.)user-list/page.tsx
+++ b/src/app/(user-page)/my-meeting/my/@modal/(.)user-list/page.tsx
@@ -14,27 +14,25 @@ import ModalUserList from '../../../_features/ModalUserList';
 export default function UserListModal({
   searchParams,
 }: {
-  searchParams: { meetingId: string };
+  searchParams: { meetingId: string; type: string };
 }) {
   const router = useRouter();
   const meetingId = Number(searchParams.meetingId);
+  const type = searchParams.type;
+
   const queryClient = useQueryClient();
 
   // 캐싱된 데이터 먼저 가져오기
-  const cachedMeetings = queryClient.getQueryData<{
-    pages: Paginated<IMyMeetingManage>[];
-  }>(myMeetingKeys.manage());
-
-  // 캐시에서 특정 meetingId의 memberList 찾기
-  const memberList =
-    cachedMeetings?.pages
-      ?.flatMap((page) => page.content)
-      ?.find((meeting) => meeting.meetingId === meetingId)?.memberList || [];
+  const cachedMemberList = queryClient.getQueryData<Member[]>([
+    'mymeeting',
+    'memberList',
+    meetingId,
+  ]);
 
   // 유저 정보 파악
   const { data: currentUser, isLoading, error } = useBannerQueries();
 
-  if (!currentUser || isLoading) return;
+  if (!currentUser || isLoading || !cachedMemberList) return;
 
   const handlePrefetchProfile = async (member: Member) => {
     const queryKey = myMeetingKeys.memberProfile(meetingId, member.userId);
@@ -60,9 +58,10 @@ export default function UserListModal({
     >
       <ModalUserList
         meetingId={meetingId}
-        memberList={memberList}
+        memberList={cachedMemberList}
         currentUser={currentUser}
         handlePrefetchProfile={handlePrefetchProfile}
+        showPublicSelect={type === 'created' && true}
       />
     </ModalPortal>
   );
diff --git a/src/app/meeting/[category]/(modal)/need-login/page.tsx b/src/app/meeting/[category]/(modal)/need-login/page.tsx
new file mode 100644
index 0000000..718b931
--- /dev/null
+++ b/src/app/meeting/[category]/(modal)/need-login/page.tsx
@@ -0,0 +1,20 @@
+'use client';
+
+import { redirect } from 'next/navigation';
+
+export default function NeedLoginModal({
+  searchParams,
+  params,
+}: {
+  searchParams: { category: string; meetingId?: number };
+  params: { category: string };
+}) {
+  const category = params.category;
+  const meetingId = searchParams.meetingId || 0;
+
+  if (meetingId === 0) {
+    redirect(`/meeting/${category}`);
+  } else {
+    redirect(`/meeting/${category}/${meetingId}`);
+  }
+}
diff --git a/src/app/meeting/[category]/@modal/(.)need-login/page.tsx b/src/app/meeting/[category]/@modal/(.)need-login/page.tsx
new file mode 100644
index 0000000..cbf51d9
--- /dev/null
+++ b/src/app/meeting/[category]/@modal/(.)need-login/page.tsx
@@ -0,0 +1,22 @@
+'use client';
+
+import ModalPortal from '@/components/ui/modal/ModalPortal';
+import { useRouter } from 'next/navigation';
+
+export default function UserListModal() {
+  const router = useRouter();
+
+  return (
+    <ModalPortal
+      isOpen={true}
+      onConfirm={() => router.push('/login')}
+      confirmText="로그인"
+      cancelText="취소"
+      modalClassName="w-96"
+    >
+      <div className="text-cg8 typo-head3 flex w-full justify-center">
+        <p className="text-white">로그인이 필요한 서비스입니다.</p>
+      </div>
+    </ModalPortal>
+  );
+}
diff --git a/src/app/meeting/[category]/@modal/default.tsx b/src/app/meeting/[category]/@modal/default.tsx
new file mode 100644
index 0000000..22b9b6f
--- /dev/null
+++ b/src/app/meeting/[category]/@modal/default.tsx
@@ -0,0 +1,3 @@
+export default function DefaultModal() {
+  return null; // 기본적으로 모달 없음
+}
diff --git a/src/app/meeting/[category]/layout.tsx b/src/app/meeting/[category]/layout.tsx
new file mode 100644
index 0000000..1c59718
--- /dev/null
+++ b/src/app/meeting/[category]/layout.tsx
@@ -0,0 +1,14 @@
+export default function layout({
+  children,
+  modal,
+}: Readonly<{
+  children: React.ReactNode;
+  modal: React.ReactNode;
+}>) {
+  return (
+    <div>
+      {children}
+      {modal}
+    </div>
+  );
+}
diff --git a/src/components/common/Header.tsx b/src/components/common/Header.tsx
index 711d3b1..4e5d8d6 100644
--- a/src/components/common/Header.tsx
+++ b/src/components/common/Header.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import Logo from '@/assets/icon/logo.svg';
+import { useLogoutMutation } from '@/hooks/mutations/useUserMutation';
 import { QUERY_KEYS } from '@/hooks/queries/useMyPageQueries';
 import { removeAccessToken } from '@/lib/serverActions';
 import { translateCategoryNameToKor } from '@/util/searchFilter';
@@ -40,6 +41,8 @@ const BeforeLogin = () => {
 const AfterLogin = ({ userInfo }: { userInfo: IUserInfo }) => {
   const router = useRouter();
   const { showToast } = useToast();
+
+  const { mutate } = useLogoutMutation();
   const menu = [
     {
       value: 'mymeeting',
@@ -54,11 +57,7 @@ const AfterLogin = ({ userInfo }: { userInfo: IUserInfo }) => {
     {
       value: 'logout',
       label: '로그아웃',
-      onSelect: async () => {
-        await removeAccessToken();
-        // 로그아웃 관련 토스트바 노출
-        showToast('로그아웃 되었습니다.', 'success');
-      },
+      onSelect: () => mutate(),
     },
   ];
   return (
@@ -119,15 +118,14 @@ const MobileBeforeLogin = () => {
 
 const MobileAfterLogin = ({ userInfo }: { userInfo: IUserInfo }) => {
   const { showToast } = useToast();
+  const { mutate } = useLogoutMutation();
+
   return (
     <div className="flex flex-col py-[24px]">
       <div className="flex items-center justify-between">
         <button
           className="typo-head3 p-[16px] text-Cgray500 hover:text-Cgray700"
-          onClick={async () => {
-            await removeAccessToken();
-            showToast('로그아웃 되었습니다.', 'success');
-          }}
+          onClick={() => mutate()}
         >
           로그아웃
         </button>
diff --git a/src/components/ui/HorizonCard.tsx b/src/components/ui/HorizonCard.tsx
index f595da1..d741e39 100644
--- a/src/components/ui/HorizonCard.tsx
+++ b/src/components/ui/HorizonCard.tsx
@@ -1,5 +1,6 @@
 import useLikeHandler from '@/hooks/common/useLikeHandler';
 import { getIconComponent } from '@/util/getIconDetail';
+import { translateCategoryNameToEng } from '@/util/searchFilter';
 import { Heart, Map } from 'lucide-react';
 import Image from 'next/image';
 import { useParams, useRouter } from 'next/navigation';
@@ -54,7 +55,10 @@ const HorizonCard = ({
     meetingId,
     category,
     searchQuery,
-    onAuthRequired: () => setIsLoginModalOpen(true),
+    onAuthRequired: () =>
+      router.push(
+        `/meeting/${translateCategoryNameToEng(category)}/need-login`,
+      ),
   });
 
   const handleLikeButton = (e: React.MouseEvent<HTMLButtonElement>) => {
diff --git a/src/components/ui/VerticalCard.tsx b/src/components/ui/VerticalCard.tsx
index 382c37d..f87e827 100644
--- a/src/components/ui/VerticalCard.tsx
+++ b/src/components/ui/VerticalCard.tsx
@@ -1,5 +1,7 @@
 import useLikeHandler from '@/hooks/common/useLikeHandler';
 import { getIconComponent } from '@/util/getIconDetail';
+import { translateCategoryNameToEng } from '@/util/searchFilter';
+import { useQueryClient } from '@tanstack/react-query';
 import { Heart, Map } from 'lucide-react';
 import Image from 'next/image';
 import { useRouter } from 'next/navigation';
@@ -58,7 +60,10 @@ const VerticalCard = ({
     meetingId,
     category,
     searchQuery,
-    onAuthRequired: () => setIsLoginModalOpen(true),
+    onAuthRequired: () =>
+      router.push(
+        `/meeting/${translateCategoryNameToEng(category)}/need-login`,
+      ),
   });
 
   const handleLikeButton = (e: React.MouseEvent<HTMLButtonElement>) => {
diff --git a/src/components/ui/modal/ModalPortal.tsx b/src/components/ui/modal/ModalPortal.tsx
index 3c13f9c..b12eef0 100644
--- a/src/components/ui/modal/ModalPortal.tsx
+++ b/src/components/ui/modal/ModalPortal.tsx
@@ -5,7 +5,7 @@ import { createPortal } from 'react-dom';
 
 interface AlertModalProps {
   isOpen: boolean;
-  onClose: () => void;
+  onClose?: () => void;
   onConfirm?: () => void;
   confirmText?: string;
   cancelText?: string;
@@ -90,7 +90,21 @@ const ModalPortal: React.FC<AlertModalProps> = ({
     }
   }, []);
 
-  if (!isOpen) return null;
+  const handleClose = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
+    e.stopPropagation();
+    if (onClose) {
+      onClose();
+    } else {
+      router.back();
+    }
+  };
+
+  const handleConfirm = (
+    e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
+  ) => {
+    e.stopPropagation();
+    onConfirm?.();
+  };
 
   return createPortal(
     <div
@@ -106,7 +120,7 @@ const ModalPortal: React.FC<AlertModalProps> = ({
         aria-modal="true"
         tabIndex={-1}
         ref={dialogRef}
-        aria-labelledBy="modal-title"
+        aria-labelledby="modal-title"
         aria-describedby="modal-description"
       >
         <div className={`p-6 ${contentClassName}`}>{children}</div>
@@ -114,16 +128,16 @@ const ModalPortal: React.FC<AlertModalProps> = ({
         {!showOnly && (
           <div className={`flex justify-end gap-2 p-4 ${buttonClassName}`}>
             {closeOnly ? (
-              <Button onClick={onClose} type="button" className="w-full">
+              <Button onClick={handleClose} type="button" className="w-full">
                 {cancelText}
               </Button>
             ) : (
               <>
-                <Button onClick={onClose} variant={'outline'} type="button">
+                <Button onClick={handleClose} variant={'outline'} type="button">
                   {cancelText}
                 </Button>
                 <Button
-                  onClick={onConfirm}
+                  onClick={handleConfirm}
                   type="button"
                   disabled={disableConfirm}
                   className={
diff --git a/src/hooks/mutations/useUserMutation.ts b/src/hooks/mutations/useUserMutation.ts
index 31fcd31..35de3a3 100644
--- a/src/hooks/mutations/useUserMutation.ts
+++ b/src/hooks/mutations/useUserMutation.ts
@@ -1,11 +1,17 @@
 import { useToast } from '@/components/common/ToastContext';
-import { setAccessToken, setRefreshToken } from '@/lib/serverActions';
+import {
+  removeAccessToken,
+  removeRefreshToken,
+  setAccessToken,
+  setRefreshToken,
+} from '@/lib/serverActions';
 import {
   QueryClient,
   useMutation,
   useQueryClient,
 } from '@tanstack/react-query';
 import {
+  deleteLogout,
   getEmailCheck,
   getNameCheck,
   postLogin,
@@ -112,9 +118,24 @@ const useSignupMutation = ({
   });
 };
 
+// 로그아웃
+const useLogoutMutation = () => {
+  const { showToast } = useToast();
+  return useMutation({
+    mutationFn: () => deleteLogout(),
+    onSuccess: async () => {
+      await removeAccessToken();
+      await removeRefreshToken();
+      // 로그아웃 관련 토스트바 노출
+      showToast('로그아웃 되었습니다.', 'success');
+    },
+  });
+};
+
 export {
   useLoginMutation,
   useNameCheckMutation,
   useEmailCheckMutation,
   useSignupMutation,
+  useLogoutMutation,
 };
diff --git a/src/lib/serverActions.ts b/src/lib/serverActions.ts
index 9b947bc..6d6773d 100644
--- a/src/lib/serverActions.ts
+++ b/src/lib/serverActions.ts
@@ -19,17 +19,7 @@ export async function getRefreshToken() {
 
 export async function removeAccessToken() {
   const cookieStore = cookies();
-  // cookieStore.delete('access_token');
-
-  // ✅ Set-Cookie를 통해 access_token을 삭제 (Max-Age=0)
-  cookieStore.set('access_token', '', {
-    path: '/',
-    maxAge: 0, // 쿠키 만료
-    httpOnly: true, // 백엔드와 일관성 유지
-    secure: true,
-    domain: 'deving.shop',
-    sameSite: 'none',
-  });
+  cookieStore.delete('accessToken');
 }
 
 export async function removeRefreshToken() {
diff --git a/src/middleware.ts b/src/middleware.ts
index bd217e1..801e696 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -4,12 +4,12 @@ import type { NextRequest } from 'next/server';
 
 export async function middleware(request: NextRequest) {
   // 인증 토큰 확인
-  // const token = await getAccessToken();
+  const token = await getAccessToken();
 
   // 토큰이 없으면 로그인 페이지로 리다이렉트
-  // if (!token) {
-  //   return NextResponse.redirect(new URL('/login', request.url));
-  // }
+  if (!token) {
+    return NextResponse.redirect(new URL('/login', request.url));
+  }
 
   // 인증된 사용자는 요청을 계속 진행
   return NextResponse.next();
diff --git a/src/service/api/user.ts b/src/service/api/user.ts
index 1b243d5..b248ceb 100644
--- a/src/service/api/user.ts
+++ b/src/service/api/user.ts
@@ -33,4 +33,9 @@ const postSignup = async (data: ISignupFormData) => {
   return res;
 };
 
-export { postLogin, getNameCheck, getEmailCheck, postSignup };
+const deleteLogout = async () => {
+  const res = await axiosInstance.delete('/api/v1/auths/logout');
+  return res;
+};
+
+export { postLogin, getNameCheck, getEmailCheck, postSignup, deleteLogout };
diff --git a/src/util/searchFilter.ts b/src/util/searchFilter.ts
index b3d1a07..559f6c9 100644
--- a/src/util/searchFilter.ts
+++ b/src/util/searchFilter.ts
@@ -29,3 +29,18 @@ export const translateCategoryNameToKor = (category: string): CategoryTitle => {
       return '모각코';
   }
 };
+
+export const translateCategoryNameToEng = (category: string) => {
+  switch (category) {
+    case '모각코':
+      return 'mogakco';
+    case '취미':
+      return 'hobby';
+    case '스터디':
+      return 'study';
+    case '사이드 프로젝트':
+      return 'side-project';
+    default:
+      return 'mogakco';
+  }
+};