diff --git a/src/modules/02_organizationalNew/components/mainTree.vue b/src/modules/02_organizationalNew/components/mainTree.vue
index 7d06ba4ec..8c422bbdb 100644
--- a/src/modules/02_organizationalNew/components/mainTree.vue
+++ b/src/modules/02_organizationalNew/components/mainTree.vue
@@ -290,10 +290,10 @@ onMounted(async () => {});
 </script>
 
 <template>
-  <div class="col-12 q-py-md q-px-lg">
-    <div class="q-gutter-md">
+  <div class="col-12 q-py-md q-px-sm">
+    <div class="q-gutter-sm">
       <div class="row q-col-gutter-sm">
-        <div class="col-2" v-if="store.typeOrganizational === 'draft'">
+        <div class="q-pl-md col-2" v-if="store.typeOrganizational === 'draft'">
           <q-btn
             dense
             flat
@@ -309,7 +309,13 @@ onMounted(async () => {});
         <div
           :class="store.typeOrganizational === 'draft' ? 'col-10' : 'col-12'"
         >
-          <q-input dense outlined v-model="filter" label="ค้นหา">
+          <q-input
+            dense
+            outlined
+            v-model="filter"
+            label="ค้นหา"
+            class="bg-white"
+          >
             <template v-slot:append>
               <q-icon
                 v-if="filter !== ''"
@@ -321,14 +327,7 @@ onMounted(async () => {});
           </q-input>
         </div>
       </div>
-      <div
-        class="bg-white"
-        style="
-          height: 60vh;
-          border: 1px solid rgb(210, 210, 210);
-          border-radius: 10px;
-        "
-      >
+      <div class="bg-white tree-container">
         <q-tree
           class="q-pa-md q-gutter-sm"
           dense
@@ -417,7 +416,7 @@ onMounted(async () => {});
                         v-if="
                           item.type === 'EDIT' ||
                           item.type === 'DEL' ||
-                          item.type === 'HISTORY' || 
+                          item.type === 'HISTORY' ||
                           item.type === 'SORT'
                         "
                       >
@@ -435,7 +434,7 @@ onMounted(async () => {});
                           item.type === 'ADD' ||
                           item.type === 'EDIT' ||
                           item.type === 'DEL' ||
-                          item.type === 'HISTORY' || 
+                          item.type === 'HISTORY' ||
                           item.type === 'SORT'
                         "
                         >{{ item.label }}ส่วนราชการ</q-item-section
@@ -514,4 +513,11 @@ onMounted(async () => {});
   />
 </template>
 
-<style scoped></style>
+<style scoped>
+.tree-container {
+  overflow: auto;
+  height: 60vh;
+  border: 1px solid rgb(210, 210, 210);
+  border-radius: 10px;
+}
+</style>