diff --git a/packages/common/components/src/ui/date-picker/index.tsx b/packages/common/components/src/ui/date-picker/index.tsx
index 67265df0e..ee5d37872 100644
--- a/packages/common/components/src/ui/date-picker/index.tsx
+++ b/packages/common/components/src/ui/date-picker/index.tsx
@@ -2,7 +2,7 @@ import "./date-picker.css";
 
 import { format } from "date-fns";
 import { CalendarIcon } from "lucide-react";
-import type { DayPicker } from "react-day-picker";
+import type { DayPickerSingleProps } from "react-day-picker";
 
 import { cn } from "../../lib/utils";
 import { Button } from "../button";
@@ -12,15 +12,12 @@ import { Popover, PopoverContent, PopoverTrigger } from "../popover";
 type DatePickerProps = {
   placeholder?: string;
   disabled?: boolean;
-  selected?: Date;
-  zIndex?: number; // z-index prop 추가
-} & React.ComponentProps<typeof DayPicker>;
+} & DayPickerSingleProps;
 
 export function DatePicker({
   className,
   placeholder = "날짜 선택",
   disabled,
-  zIndex, // zIndex prop 받기
   ...props
 }: DatePickerProps) {
   return (
@@ -39,13 +36,8 @@ export function DatePicker({
           )}
         </Button>
       </PopoverTrigger>
-      <PopoverContent
-        className={cn(
-          "w-auto p-0",
-          zIndex ? `z-[${zIndex}]` : "" // zIndex가 있으면 적용, 없으면 기본값
-        )}
-      >
-        <Calendar classNames={{ cell: "rounded-md" }} {...props} />
+      <PopoverContent className="w-auto p-0">
+        <Calendar initialFocus classNames={{ cell: "rounded-md" }} {...props} />
       </PopoverContent>
     </Popover>
   );