ㄱㄱㄱ

src/app/menu/PasswordChangeDoneModal.tsx

@@ -0,0 +1,56 @@
+'use client';
+
+import Link from "next/link";
+import ModalCloseSvg from "../svgs/closexsvg";
+
+type Props = {
+  open: boolean;
+  onClose: () => void;
+};
+
+export default function PasswordChangeDoneModal({ open, onClose }: Props) {
+  if (!open) return null;
+
+  return (
+    <div
+      className="fixed inset-0 z-50 flex items-center justify-center bg-black/40 backdrop-blur-[2px]"
+      role="dialog"
+      aria-modal="true"
+    >
+      <div className="w-[480px] h-[437px] rounded-[12px] border border-[#dee1e6] bg-white shadow-[0_10px_30px_rgba(0,0,0,0.06)] flex flex-col justify-between">
+        <div className="flex h-[80px] items-center justify-end p-6">
+          <button
+            type="button"
+            aria-label="닫기"
+            onClick={onClose}
+            className="inline-flex size-6 items-center justify-center text-[#333c47] hover:opacity-80 cursor-pointer"
+          >
+            <ModalCloseSvg />
+          </button>
+        </div>
+
+        <div className="px-6 pb-0 ">
+          <div className="w-full mx-auto flex flex-col items-center gap-4">
+            <h2 className="text-[24px] font-extrabold leading-[1.45] text-[#333c47]">
+              비밀번호 변경이 완료됐습니다.
+            </h2>
+            <p className="text-[18px] leading-[1.5] text-[#6c7682] text-center">
+              새로운 비밀번호로 다시 로그인 해주세요.
+            </p>
+          </div>
+        </div>
+
+        <div className="flex items-center justify-center p-6">
+          <Link
+            href="/login"
+            className="h-12 w-[284px] rounded-[10px] bg-[#1f2b91] text-[16px] font-semibold leading-[1.5] text-white inline-flex items-center justify-center cursor-pointer"
+          >
+            로그인
+          </Link>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+