diff --git a/src/modules/05_leave/componenst/Form.vue b/src/modules/05_leave/componenst/Form.vue
index d4a05ab..86ffba1 100644
--- a/src/modules/05_leave/componenst/Form.vue
+++ b/src/modules/05_leave/componenst/Form.vue
@@ -38,7 +38,7 @@ const formData = reactive<FormData>({
   <q-card bordered class="q-pa-md bg-grey-1">
     <div class="col-12 row q-pa-sm q-col-gutter-sm">
       <datepicker
-        class="col-4"
+        class="col-12 col-sm-4"
         menu-class-name="modalfix"
         v-model="formData.dateStart"
         :locale="'th'"
@@ -79,7 +79,7 @@ const formData = reactive<FormData>({
         </template>
       </datepicker>
       <q-input
-        class="col-4"
+        class="col-12 col-sm-4"
         dense
         outlined
         readonly
@@ -87,7 +87,7 @@ const formData = reactive<FormData>({
         label="เรื่อง"
       />
       <q-input
-        class="col-4"
+        class="col-12 col-sm-4"
         dense
         outlined
         readonly
@@ -95,7 +95,7 @@ const formData = reactive<FormData>({
         label="เรียน"
       />
       <q-input
-        class="col-3"
+        class="col-12 col-sm-3"
         dense
         outlined
         readonly
@@ -103,7 +103,7 @@ const formData = reactive<FormData>({
         label="ชื่อผู้ยื่นขอ"
       />
       <q-input
-        class="col-3"
+        class="col-12 col-sm-3"
         dense
         outlined
         readonly
@@ -111,7 +111,7 @@ const formData = reactive<FormData>({
         label="ตำแหน่งผู้ยื่นขอ"
       />
       <q-input
-        class="col-3"
+        class="col-12 col-sm-3"
         dense
         outlined
         readonly
@@ -119,7 +119,7 @@ const formData = reactive<FormData>({
         label="ระดับผู้ยื่นขอ"
       />
       <q-input
-        class="col-3"
+        class="col-12 col-sm-3"
         dense
         outlined
         readonly
@@ -127,7 +127,7 @@ const formData = reactive<FormData>({
         label="สังกัดผู้ยื่นขอ"
       />
       <q-input
-        class="col-4"
+        class="col-12 col-sm-4"
         dense
         outlined
         readonly
@@ -135,7 +135,7 @@ const formData = reactive<FormData>({
         label="จำนวนสิทธิ์การลาที่ได้รับในแต่ละประเภท"
       />
       <q-input
-        class="col-4"
+        class="col-12 col-sm-4"
         dense
         outlined
         readonly
@@ -143,7 +143,7 @@ const formData = reactive<FormData>({
         label="จำนวนสิทธิ์การลาที่ใช้ไปในแต่ละประเภท"
       />
       <q-input
-        class="col-4"
+        class="col-12 col-sm-4"
         dense
         outlined
         readonly