diff --git a/public/css/custom.css b/public/css/custom.css
index 6eb5920..e367c87 100644
--- a/public/css/custom.css
+++ b/public/css/custom.css
@@ -108,7 +108,6 @@ cursor: not-allowed !important;
 .vac-modal-content {
   background: #fff;
   padding: 20px;
-  border-radius: 8px;
   box-shadow: 0px -4px 5px rgba(0, 0, 0, 0.1),
               0px 4px 0px rgba(0, 0, 0, 0);
   max-width: 500px;
@@ -229,21 +228,7 @@ cursor: not-allowed !important;
 /* 오전/오후반차,저장버튼 */
 /* 버튼 기본 스타일 */
 .vac-btn {
-  width: 60px;
-  height: 60px;
-  border-radius: 50%;
-  font-size: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  transition: all 0.2s ease-in-out;
-  display: inline-block;
-  font-weight: 400;
-  line-height: 1.53;
-  color: #697a8d;
-  text-align: center;
-  vertical-align: middle;
-  cursor: pointer;
+  transition: all 0.2sease-in-out;
   border: 1px solid transparent;
 }
 /* 마우스를 올렸을 때 */
@@ -286,17 +271,9 @@ cursor: not-allowed !important;
 }
 /* 버튼 기본 (비활성화일 때 기본 녹색) */
 .vac-btn-success {
-  font-size: 24px;
-  width: 60px;
-  height: 60px;
-  border-radius: 50%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
   transition: all 0.2s ease-in-out;
   background-color: #871919 !important;
   color: white;
-  cursor: pointer;
   border: 1px solid transparent;
 }
 /* 버튼 활성화 */
@@ -309,7 +286,6 @@ cursor: not-allowed !important;
 }
 /* 버튼 비활성화 */
 .vac-btn-success.disabled {
-  border: 3px solid #e6e4e4; /* 붉은색 테두리 적용 */
   background-color: #bbb8b8 !important;
   color: white !important;
   cursor: not-allowed !important;
diff --git a/src/components/button/HalfDayButtons.vue b/src/components/button/HalfDayButtons.vue
index 08cc241..858731f 100644
--- a/src/components/button/HalfDayButtons.vue
+++ b/src/components/button/HalfDayButtons.vue
@@ -1,27 +1,30 @@
 <template>
-    <div class="menu gap-4 justify-content-center mt-5">
-        <!-- 오전 반차 버튼 -->
-        <button
-            class="vac-btn vac-btn-warning"
-            :class="{ active: halfDayType === 'AM' }"
-            @click="toggleHalfDay('AM')"
-        >
-        <i class="bi bi-sun"></i>
-        </button>
-        <!-- 오후 반차 버튼 -->
-        <button
-            class="vac-btn vac-btn-info"
-            :class="{ active: halfDayType === 'PM' }"
-            @click="toggleHalfDay('PM')"
-        >
-        <i class="bi bi-moon"></i>
-        </button>
-        <!-- 저장 버튼 -->
-        <div class="save-button-container">
-            <button class="vac-btn-success" @click="addVacationRequests"
-                    :class="{ active: !isDisabled, disabled: isDisabled }">
+    <div class="row gx-2 mb-4">
+        <div class="col-4">
+            <div class="ratio ratio-1x1">
+            <!-- 오전 반차 버튼 -->
+            <button class="vac-btn vac-btn-warning rounded-circle d-flex align-items-center justify-content-center" :class="{ active: halfDayType === 'AM' }"
+                @click="toggleHalfDay('AM')">
+                <i class="bi bi-sun"></i>
+            </button>
+            </div>
+        </div>
+        <div class="col-4">
+            <div class="ratio ratio-1x1">
+            <!-- 오후 반차 버튼 -->
+            <button class="vac-btn vac-btn-info rounded-circle d-flex align-items-center justify-content-center" :class="{ active: halfDayType === 'PM' }"
+                @click="toggleHalfDay('PM')">
+                <i class="bi bi-moon"></i>
+            </button>
+            </div>
+        </div>
+        <div class="col-4">
+            <div class="ratio ratio-1x1">
+            <button class="vac-btn-success rounded-circle d-flex align-items-center justify-content-center" @click="addVacationRequests"
+                :class="{ active: !isDisabled, disabled: isDisabled }">
                 ✔
             </button>
+            </div>
         </div>
     </div>
 </template>
diff --git a/src/components/vacation/ProfileList.vue b/src/components/vacation/ProfileList.vue
index b5d5007..fdf7153 100644
--- a/src/components/vacation/ProfileList.vue
+++ b/src/components/vacation/ProfileList.vue
@@ -1,28 +1,30 @@
 <template>
-    <div class="card-body d-flex justify-content-center m-n5">
-        <ul class="profile-list">
-            <li
-                v-for="(user, index) in sortedUserList"
-                :key="index"
-                class="profile-item"
-                :class="{ newRow: (index + 1) % 4 === 0 }"
-                @click="$emit('profileClick', user)"
-                data-bs-placement="top"
-                :aria-label="user.MEMBERSEQ"
-            >
-                <img
-                    class="rounded-circle profile-img"
-                    :src="getUserProfileImage(user.MEMBERPRF)"
-                    alt="user"
-                    :style="getDynamicStyle(user)"
-                    @error="setDefaultImage"
-                    @load="showImage"
-                />
+    <div class="">
+    <ul class="row gx-2 mb-2 list-inline">
+        <li
+            v-for="(user, index) in sortedUserList"
+            :key="index"
+            class="col-4 mb-3"
+            :class="{ newRow: (index + 1) % 4 === 0 }"
+            @click="$emit('profileClick', user)"
+            data-bs-placement="top"
+            :aria-label="user.MEMBERSEQ"
+        >
+                <div class="ratio ratio-1x1 mb-2">
+                    <img
+                        class="rounded-circle profile-img"
+                        :src="getUserProfileImage(user.MEMBERPRF)"
+                        alt="user"
+                        :style="getDynamicStyle(user)"
+                        @error="setDefaultImage"
+                        @load="showImage"
+                    />
+                </div>
                 <span class="mt-2 text-sm-center d-block fs-6 remaining-vacation">
                     {{ remainingVacationData[user.MEMBERSEQ] || 0 }}
                 </span>
-            </li>
-        </ul>
+        </li>
+    </ul>
     </div>
 </template>
 
@@ -110,9 +112,7 @@ if (windowWidth.value >= 1850) {
 });
 
 const getDynamicStyle = (user) => ({
-width: profileSize.value,
-height: profileSize.value,
-borderWidth: "4px",
+borderWidth: "2px",
 borderColor: user.usercolor || "#ccc",
 borderStyle: "solid",
 });
diff --git a/src/views/vacation/VacationManagement.vue b/src/views/vacation/VacationManagement.vue
index 3374500..9b39db8 100644
--- a/src/views/vacation/VacationManagement.vue
+++ b/src/views/vacation/VacationManagement.vue
@@ -3,36 +3,37 @@
         <div class="card app-calendar-wrapper">
             <div class="row g-0">
                 <!-- Sidebar: 사이드바 영역 -->
-                <div class="col-3 app-calendar-sidebar border-end" id="app-calendar-sidebar">
-                    <div class="sidebar-content">
-                        <div class="sidebar-actions text-center my-3">
-                        <HalfDayButtons
+                <div class="col-3 border-end text-center" id="app-calendar-sidebar">
+                    <div>
+
+                        <div class="card-body">
+                            <HalfDayButtons
                             ref="halfDayButtonsRef"
                             @toggleHalfDay="toggleHalfDay"
                             @addVacationRequests="saveVacationChanges"
                             :isDisabled="!hasChanges"
                             :selectedDate="selectedDate"
-                        />
-                        </div>
-                        <ProfileList
+                            />
+                            <ProfileList
                             @profileClick="handleProfileClick"
                             :remainingVacationData="remainingVacationData"
-                        />
+                            />
+                        </div>
                         <VacationModal
-                            v-if="isModalOpen"
-                            :isOpen="isModalOpen"
-                            :myVacations="filteredMyVacations"
-                            :receivedVacations="filteredReceivedVacations"
-                            :userColors="userColors"
-                            @close="isModalOpen = false"
+                        v-if="isModalOpen"
+                        :isOpen="isModalOpen"
+                        :myVacations="filteredMyVacations"
+                        :receivedVacations="filteredReceivedVacations"
+                        :userColors="userColors"
+                        @close="isModalOpen = false"
                         />
                         <VacationGrantModal
-                            v-if="isGrantModalOpen"
-                            :isOpen="isGrantModalOpen"
-                            :targetUser="selectedUser"
-                            :remainingQuota="remainingVacationData[selectedUser?.MEMBERSEQ] || 0"
-                            @close="isGrantModalOpen = false"
-                            @updateVacation="fetchRemainingVacation"
+                        v-if="isGrantModalOpen"
+                        :isOpen="isGrantModalOpen"
+                        :targetUser="selectedUser"
+                        :remainingQuota="remainingVacationData[selectedUser?.MEMBERSEQ] || 0"
+                        @close="isGrantModalOpen = false"
+                        @updateVacation="fetchRemainingVacation"
                         />
                     </div>
                 </div>