디자인업데이트

components/CommonUI.tsx

@@ -72,7 +72,7 @@ interface InputGroupProps {
 }
 
 export const InputGroup: React.FC<InputGroupProps> = ({ label, value, onChange, placeholder, type = "text", icon }) => (
-  <div className="space-y-3">
+  <div className="space-y-2">
     <label className="text-[11px] font-black text-slate-400 uppercase tracking-widest block pl-1 flex items-center gap-2">
       {icon} {label}
     </label>
@@ -80,12 +80,36 @@ export const InputGroup: React.FC<InputGroupProps> = ({ label, value, onChange,
       type={type}
       value={value}
       onChange={(e) => onChange(e.target.value)}
-      className="w-full p-4 bg-slate-50 border border-slate-200 rounded-[1.2rem] focus:border-blue-500 focus:bg-white outline-none transition-all font-bold text-slate-800 placeholder:text-slate-300 shadow-sm"
+      className="w-full p-3 bg-slate-50 border border-slate-200 rounded-xl focus:border-blue-500 focus:bg-white outline-none transition-all font-bold text-slate-800 placeholder:text-slate-300 text-[13px] shadow-sm"
       placeholder={placeholder}
     />
   </div>
 );
 
+// --- SelectGroup: 일관된 디자인의 셀렉트 박스 ---
+interface SelectGroupProps {
+  label: string;
+  value: string;
+  onChange: (v: string) => void;
+  options: { value: string, label: string }[];
+  icon?: React.ReactNode;
+}
+
+export const SelectGroup: React.FC<SelectGroupProps> = ({ label, value, onChange, options, icon }) => (
+  <div className="space-y-2">
+    <label className="text-[11px] font-black text-slate-400 uppercase tracking-widest block pl-1 flex items-center gap-2">
+      {icon} {label}
+    </label>
+    <select 
+      value={value}
+      onChange={(e) => onChange(e.target.value)}
+      className="w-full p-3 bg-slate-50 border border-slate-200 rounded-xl focus:border-blue-500 focus:bg-white outline-none transition-all font-bold text-slate-800 text-[13px] shadow-sm appearance-none"
+    >
+      {options.map(opt => <option key={opt.value} value={opt.value}>{opt.label}</option>)}
+    </select>
+  </div>
+);
+
 // --- ToggleButton: 활성화/비활성 스위치 ---
 interface ToggleButtonProps {
   active: boolean;