diff --git a/src/components/reservation/meetingRoom/DatePickerModal.tsx b/src/components/reservation/meetingRoom/DatePickerModal.tsx
index b077a7e..41c603a 100644
--- a/src/components/reservation/meetingRoom/DatePickerModal.tsx
+++ b/src/components/reservation/meetingRoom/DatePickerModal.tsx
@@ -20,6 +20,7 @@ interface DatePickerModalProps {
   ) => void;
   initialStartTime: Date;
   initialEndTime: Date;
+  activeTab: string; 
 }
 
 const DatePickerModal: React.FC<DatePickerModalProps> = ({
@@ -27,7 +28,8 @@ const DatePickerModal: React.FC<DatePickerModalProps> = ({
   setShowModal,
   onConfirm,
   initialStartTime,
-  initialEndTime
+  initialEndTime,
+  activeTab
 }) => {
   const [startDate, setStartDate] = useState<Date>(initialStartTime);
   const [startTime, setStartTime] = useState<string>(
@@ -43,7 +45,13 @@ const DatePickerModal: React.FC<DatePickerModalProps> = ({
   const [projectorExists, setProjectorExists] = useState<boolean>(false);
   const [canVideoConference, setCanVideoConference] = useState<boolean>(false);
   const [isPrivate, setIsPrivate] = useState<boolean>(false);
-  const [activeTab, setActiveTab] = useState<string>('schedule');
+  const [activeTabState, setActiveTabState] = useState<string>(activeTab);
+
+  console.log(activeTab);
+
+  useEffect(() => {
+    setActiveTabState(activeTab);
+  }, [activeTab]);
 
   useEffect(() => {
     if (startDate.toDateString() === new Date().toDateString()) {
@@ -97,7 +105,7 @@ const DatePickerModal: React.FC<DatePickerModalProps> = ({
       isPrivate
     });
     setShowModal(false);
-    setActiveTab('schedule');
+    setActiveTabState('schedule');
   };
 
   const handleTypeChange = (type: 'MINI' | 'STANDARD' | 'MEDIUM' | 'STATE') => {
@@ -152,34 +160,34 @@ const DatePickerModal: React.FC<DatePickerModalProps> = ({
         <div className="flex">
           <button
             className={`py-2 px-4 ${
-              activeTab === 'schedule'
+              activeTabState === 'schedule'
                 ? "text-black/opacity-20 text-lg font-bold font-['Pretendard']"
                 : "text-neutral-600 text-lg font-normal font-['Pretendard']"
             }`}
-            onClick={() => setActiveTab('schedule')}>
+            onClick={() => setActiveTabState('schedule')}>
             일정
           </button>
           <button
             className={`py-2 px-4 rounded ${
-              activeTab === 'people'
+              activeTabState === 'people'
                 ? "text-black/opacity-20 text-lg font-bold font-['Pretendard']"
                 : "text-neutral-600 text-lg font-normal font-['Pretendard']"
             }`}
-            onClick={() => setActiveTab('people')}>
+            onClick={() => setActiveTabState('people')}>
             인원
           </button>
           <button
             className={`py-2 px-4 rounded ${
-              activeTab === 'equipment'
+              activeTabState === 'equipment'
                 ? "text-black/opacity-20 text-lg font-bold font-['Pretendard']"
                 : "text-neutral-600 text-lg font-normal font-['Pretendard']"
             }`}
-            onClick={() => setActiveTab('equipment')}>
+            onClick={() => setActiveTabState('equipment')}>
             비품
           </button>
         </div>
 
-        {activeTab === 'schedule' && (
+        {activeTabState === 'schedule'   && (
           <>
             <div className="">
               <div className="w-full">
@@ -248,7 +256,7 @@ const DatePickerModal: React.FC<DatePickerModalProps> = ({
           </>
         )}
 
-        {activeTab === 'people' && (
+        {activeTabState === 'people' && (
           <div className="mt-4 w-[100%]">
             <div className="flex flex-col">
               {(['MINI', 'STANDARD', 'MEDIUM', 'STATE'] as const).map((type) => (
@@ -281,7 +289,7 @@ const DatePickerModal: React.FC<DatePickerModalProps> = ({
           </div>
         )}
 
-        {activeTab === 'equipment' && (
+        {activeTabState === 'equipment' && (
           <div className="">
             <div className="mt-4 flex flex-col">
               <label className="flex items-center my-[12px]">
diff --git a/src/components/reservation/meetingRoom/MeetingRoomIndex.tsx b/src/components/reservation/meetingRoom/MeetingRoomIndex.tsx
index 44b31ad..9f26fd8 100644
--- a/src/components/reservation/meetingRoom/MeetingRoomIndex.tsx
+++ b/src/components/reservation/meetingRoom/MeetingRoomIndex.tsx
@@ -83,6 +83,7 @@ const MeetingRoomIndex: React.FC = () => {
   const updatedTimeReserved = useBranchStore2((state) => state.updatedTimeReserved);
 
   const [toastType, setToastType] = useState<string | null>(null);
+  const [activeTabState, setActiveTabState] = useState<string>('');
 
   const currentBranch =
   updatedTimeSelected && updatedTimeReserved && updatedTimeSelected > updatedTimeReserved
@@ -250,17 +251,40 @@ const MeetingRoomIndex: React.FC = () => {
     });
     setMeetingRooms(sortedRooms);
   };
+
+  const handleModalOpen = (tab: string) => {
+    setActiveTabState(tab);
+    setShowModal(true);
+  };
   
+  const getCapacityText = (capacity: number) => {
+    if (capacity === 1 || capacity === 5 || capacity === 9 || capacity === 13) {
+      return `${capacity}명`;
+    }
+    if (capacity > 1 && capacity < 5) {
+      return `1~${capacity}명`;
+    }
+    if (capacity > 5 && capacity < 9) {
+      return `5~${capacity}명`;
+    }
+    if (capacity > 9 && capacity < 13) {
+      return `9~${capacity}명`;
+    }
+    if (capacity === 14 || capacity === 15) {
+      return `13~${capacity}명`;
+    }
+    return `${capacity}명`;
+  };
   
   return (
     <div className="p-4 h-screen">
       <div className='relative'>
         <Image src={'/resetwithbg.svg'} width={45} height={45} alt="reset" className="absolute right-0" onClick={handleReset} />
       </div>
-      <div className="flex mb-4 overflow-x-auto whitespace-nowrap">
+      <div className="flex mb-4 w-full overflow-x-auto whitespace-nowrap mr-[50px]">
         <div
           className="flex-none w-[190px] h-[33px] px-3 py-2 bg-violet-100 rounded inline-flex cursor-pointer"
-          onClick={() => setShowModal(true)}
+          onClick={() => handleModalOpen('schedule')}
         >
           <Image src={'/calendar.svg'} width={14} height={14} alt="calendar" className="mr-[6px]" />
           <div className="text-neutral-700 text-sm font-semibold font-['Pretendard']">{currentTime}</div>
@@ -268,7 +292,7 @@ const MeetingRoomIndex: React.FC = () => {
         </div>
         <div
           className={`flex-none h-[33px] px-3 py-2 rounded inline-flex cursor-pointer ml-2 ${selectedMeetingRoomTypes === '인원 수' ? 'w-[110px] bg-white border border-neutral-300' : 'w-[170px] bg-violet-100'}`}
-          onClick={() => setShowModal(true)}
+          onClick={() => handleModalOpen('people')}
         >
           <Image src={'/people.svg'} width={14} height={14} alt="people" className="mr-[6px]" />
           <div className="text-neutral-700 text-sm font-semibold font-['Pretendard']">{selectedMeetingRoomTypes}</div>
@@ -276,7 +300,7 @@ const MeetingRoomIndex: React.FC = () => {
         </div>
         <div
           className={`flex-none h-[33px] px-3 py-2 rounded inline-flex cursor-pointer ml-2 mr-[50px] ${selectedEquipment === '비품' ? 'w-[100px] bg-white border border-neutral-300' : 'w-[150px] bg-violet-100'}`}
-          onClick={() => setShowModal(true)}
+          onClick={() => handleModalOpen('equipment')}
         >
           <Image src={'/check.svg'} width={14} height={14} alt="check" className="mr-[6px]" />
           <div className="text-neutral-700 text-sm font-semibold font-['Pretendard']">{selectedEquipment}</div>
@@ -366,7 +390,7 @@ const MeetingRoomIndex: React.FC = () => {
           조건에 맞는 미팅룸이 없습니다.
         </div>
       ) : (
-        <div className={`grid grid-cols-2 gap-x-[11px] gap-y-[24px] ${showToast ? 'pointer-events-none opacity-50' : ''}`}>
+        <div className={`grid grid-cols-2 gap-x-[11px] gap-y-[24px] ${toastType === 'OVERLAPPING_MEETING_ROOM_EXISTS' ? 'pointer-events-none opacity-50' : ''}`}>
           {meetingRooms.map((room) => (
             <div key={room.meetingRoomId}  className={`overflow-hidden bg-white text-center ${toastType === 'OVERLAPPING_MEETING_ROOM_EXISTS' ? 'pointer-events-none' : 'cursor-pointer'}`}  onClick={() => handleRoomClick(room.meetingRoomId)}>
               <div className="rounded">
@@ -388,7 +412,7 @@ const MeetingRoomIndex: React.FC = () => {
                     {room.meetingRoomFloor < 0 ? `B${Math.abs(room.meetingRoomFloor)}` : `${room.meetingRoomFloor}`}층
                   </div>
                   <Image src={'/capacity.svg'} width={14} height={14} alt="capacity" className="mr-[6px]" />
-                  <div className="text-stone-500 text-xs font-normal font-['Pretendard']">1~{room.meetingRoomCapacity}명</div>
+                  <div className="text-stone-500 text-xs font-normal font-['Pretendard']">{getCapacityText(room.meetingRoomCapacity)}</div>
                 </div>
               </div>
             </div>
@@ -403,6 +427,7 @@ const MeetingRoomIndex: React.FC = () => {
           onConfirm={handleConfirm}
           initialStartTime={startTime}
           initialEndTime={endTime}
+          activeTab={activeTabState}
         />
       )}
       {showToast && (