diff --git a/components/Project/Create/Components/DatePicker.vue b/components/Project/Create/Components/DatePicker.vue
index b392b2a..6df176f 100644
--- a/components/Project/Create/Components/DatePicker.vue
+++ b/components/Project/Create/Components/DatePicker.vue
@@ -76,30 +76,25 @@ const days = computed(() => {
         lg="w-1/2"
         relative
       >
-        <SelectBox
+        <ProjectCreateComponentsSelect
           v-model="day"
-          w-full
+          class="lg:w-full!"
           :options="days.map(day => ({ label: day.toString(), value: day }))"
           placeholder="Day"
-          :border-opacity="30"
-          :is-margin-top="false"
         />
-        <SelectBox
+        <ProjectCreateComponentsSelect
           v-model="month"
-          w-full
-          mx--2px
+          class="lg:w-full!"
+          ml--2px
           :options="months.map(month => ({ label: month.label, value: month.value }))"
           placeholder="Month"
-          :border-opacity="30"
-          :is-margin-top="false"
         />
-        <SelectBox
+        <ProjectCreateComponentsSelect
           v-model="year"
-          w-full
+          class="lg:w-full!"
+          ml--2px
           :options="years.map(year => ({ label: year.toString(), value: year }))"
           placeholder="Year"
-          :border-opacity="30"
-          :is-margin-top="false"
         />
       </div>
       <span
diff --git a/components/Project/Create/Components/Input.vue b/components/Project/Create/Components/Input.vue
index 47a5f24..9666d95 100644
--- a/components/Project/Create/Components/Input.vue
+++ b/components/Project/Create/Components/Input.vue
@@ -45,13 +45,13 @@ const model = defineModel<string>()
       lg="flex flex-row gap-24px items-center"
       relative
     >
-      <div v-bind="$attrs">
+      <div v-bind="$attrs" shrink-0>
         <textarea
           v-if="textarea"
           v-model="model"
           :rows="textareaRows"
           :placeholder="placeholder"
-          class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:ring-0 focus:outline-none"
+          class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:outline-none focus:ring-0 focus:border-white"
           :class="error ? 'border-app-danger/50' : 'border-white/30'"
         />
         <input
@@ -59,7 +59,7 @@ const model = defineModel<string>()
           v-model="model"
           :placeholder="placeholder"
           type="text"
-          class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:ring-0 focus:outline-none"
+          class="relative w-full p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6 focus:outline-none focus:ring-0 focus:border-white"
           :class="error ? 'border-app-danger/50' : 'border-white/30'"
         >
       </div>
diff --git a/components/Project/Create/Components/Select.vue b/components/Project/Create/Components/Select.vue
index 1e77278..c970856 100644
--- a/components/Project/Create/Components/Select.vue
+++ b/components/Project/Create/Components/Select.vue
@@ -7,7 +7,7 @@ const emits = defineEmits(['update:modelValue'])
 interface SelectProps {
   options: InputOption[]
   label?: string
-  modelValue: string
+  modelValue: any
   placeholder?: string
   required?: boolean
   hint?: string
@@ -24,7 +24,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
     lg="flex flex-row gap-24px"
     relative
   >
-    <div lg="w-1/2">
+    <div v-bind="$attrs" lg="w-1/2">
       <HeadlessListbox
         v-model="selectedValue"
         as="div"
@@ -48,7 +48,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
         >
           <HeadlessListboxButton
             as="div"
-            class="relative w-full cursor-pointer p-8px text-left border-2px text-app-white bg-black border-white/30 sm:text-sm sm:leading-6"
+            class="relative w-full cursor-pointer p-8px text-left border-2px text-app-white bg-black border-white/30 sm:text-sm sm:leading-6 aria-expanded:border-white aria-expanded:z-10"
           >
             <span
               class="block truncate mr-8px"
@@ -71,7 +71,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
             leave-to-class="opacity-0"
           >
             <HeadlessListboxOptions
-              class="absolute z-100 max-h-60 w-full divide-y-2px border-2px border-t-0 overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm border-white/30"
+              class="absolute z-100 max-h-60 w-full divide-y-2px border-2px border-t-0 overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm border-white"
             >
               <HeadlessListboxOption
                 v-for="option in props.options"