diff --git a/src/modules/03_recruiting/views/01_compete/PeriodAdd.vue b/src/modules/03_recruiting/views/01_compete/PeriodAdd.vue
index 8736fa91d..f004e196f 100644
--- a/src/modules/03_recruiting/views/01_compete/PeriodAdd.vue
+++ b/src/modules/03_recruiting/views/01_compete/PeriodAdd.vue
@@ -16,14 +16,14 @@
   <q-card flat bordered class="col-12">
     <q-form ref="myForm">
       <q-card-section class="q-pa-md">
-        <div class="col-xs-12 col-sm-8"></div>
-        <div class="col-12 row items-center q-col-gutter-x-sm">
+        <div class="col-12 row q-col-gutter-sm">
           <div class="col-xs-12 col-sm-8">
             <q-input
               outlined
               v-model="name"
               label="ชื่อรอบสอบแข่งขัน"
               dense
+              hide-bottom-space
               lazy-rules
               :rules="[(val) => !!val || `${'กรุณากรอกชื่อรอบสอบแข่งขัน'}`]"
             ></q-input>
@@ -35,8 +35,6 @@
               type="number"
               label="รอบการสอบ(ครั้ง)"
               dense
-              lazy-rules
-              :rules="[(val) => val > 0 || `${'กรุณากรอกรอบการสอบให้ถูกต้อง'}`]"
             ></q-input>
           </div>
           <div class="col-xs-12 col-sm-4 col-md-1" v-if="announcementExam">
@@ -58,7 +56,6 @@
                   dense
                   outlined
                   :model-value="yearly + 543"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`]"
                   :label="`${'ปีงบประมาณ'}`"
                 >
                   <template v-slot:prepend>
@@ -80,14 +77,10 @@
               type="number"
               label="ค่าธรรมเนียม"
               dense
-              lazy-rules
               input-class="text-right"
-              :rules="[
-                (val) => val >= 0 || `${'กรุณากรอกค่าธรรมเนียมให้ถูกต้อง'}`,
-              ]"
             ></q-input>
           </div>
-          <div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
+          <div class="col-xs-12 col-sm-4 col-md-3" v-if="announcementExam">
             <datepicker
               menu-class-name="modalfix"
               v-model="dateExam"
@@ -107,10 +100,9 @@
                 <q-input
                   outlined
                   dense
-                  class="full-width datepicker q-mb-md"
+                  class="full-width datepicker"
                   :model-value="dateExam != null ? date2Thai(dateExam) : null"
                   :label="`${'วันที่สอบ'}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกวันที่สอบ'}`]"
                 >
                   <template v-slot:prepend>
                     <q-icon
@@ -145,7 +137,8 @@
                 <q-input
                   outlined
                   dense
-                  class="full-width datepicker q-mb-md"
+                  hide-bottom-space
+                  class="full-width datepicker"
                   :model-value="
                     dateAnnouncement != null
                       ? dateThaiRange(dateAnnouncement)
@@ -187,12 +180,11 @@
                 <q-input
                   outlined
                   dense
-                  class="full-width datepicker q-mb-md"
+                  class="full-width datepicker"
                   :model-value="
                     dateRegister != null ? dateThaiRange(dateRegister) : null
                   "
                   :label="`${'วันที่สมัคร'}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกวันที่สมัคร'}`]"
                 >
                   <template v-slot:prepend>
                     <q-icon
@@ -227,12 +219,11 @@
                 <q-input
                   outlined
                   dense
-                  class="full-width datepicker q-mb-md"
+                  class="full-width datepicker"
                   :model-value="
                     datePayment != null ? dateThaiRange(datePayment) : null
                   "
                   :label="`${'วันที่ชำระเงิน'}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกวันที่ชำระเงิน'}`]"
                 >
                   <template v-slot:prepend>
                     <q-icon
@@ -267,12 +258,11 @@
                 <q-input
                   outlined
                   dense
-                  class="full-width datepicker q-mb-md"
+                  class="full-width datepicker"
                   :model-value="
                     dateAnnounce != null ? date2Thai(dateAnnounce) : null
                   "
                   :label="`${'วันประกาศผลสอบ'}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกวันประกาศผลสอบ'}`]"
                 >
                   <template v-slot:prepend>
                     <q-icon
@@ -637,7 +627,6 @@
               v-model="note"
               label="หมายเหตุ"
               dense
-              lazy-rules
               type="textarea"
             />
           </div>