diff --git a/src/app/api/auth/check-email/route.js b/src/app/api/auth/check-email/route.js
index 37bf825a..20db2ead 100644
--- a/src/app/api/auth/check-email/route.js
+++ b/src/app/api/auth/check-email/route.js
@@ -1,5 +1,5 @@
 // app/api/auth/check-email/route.js
-import { auth } from "@/lib/firebaseAdmin";
+import { db } from "@/lib/firebaseAdmin";
 import { NextResponse } from "next/server";
 
 export async function POST(req) {
@@ -14,13 +14,14 @@ export async function POST(req) {
     }
 
     try {
-      const userRecord = await auth.getUserByEmail(email);
+      const usersSnapshot = await db
+        .collection("users")
+        .where("email", "==", email)
+        .limit(1)
+        .get();
 
-      return NextResponse.json({ exists: userRecord.emailVerified });
+      return NextResponse.json({ exists: !usersSnapshot.empty });
     } catch (error) {
-      if (error.code === "auth/user-not-found") {
-        return NextResponse.json({ exists: false });
-      }
       console.error("Error in check-email:", error);
       return NextResponse.json(
         { error: "이메일 확인 중 오류가 발생했습니다." },
diff --git a/src/app/api/auth/reset-password/route.js b/src/app/api/auth/reset-password/route.js
new file mode 100644
index 00000000..e3ef13a3
--- /dev/null
+++ b/src/app/api/auth/reset-password/route.js
@@ -0,0 +1,114 @@
+import { db } from "@/lib/firebaseAdmin";
+import { getAuth } from "firebase-admin/auth";
+import { Timestamp } from "firebase-admin/firestore";
+
+function validatePassword(password) {
+  const minLength = 6;
+  const maxLength = 4096;
+  const hasUpperCase = /[A-Z]/.test(password);
+  const hasLowerCase = /[a-z]/.test(password);
+  const hasNumber = /[0-9]/.test(password);
+  const hasSpecialChar = /[!@#$%^&*(),.?":{}|<>]/.test(password);
+  const isValidLength =
+    password.length >= minLength && password.length <= maxLength;
+
+  return (
+    hasUpperCase && hasLowerCase && hasNumber && hasSpecialChar && isValidLength
+  );
+}
+
+export async function PUT(req) {
+  try {
+    const { email, code, newPassword } = await req.json();
+
+    // 비밀번호 유효성 검사
+    if (!validatePassword(newPassword)) {
+      return Response.json(
+        {
+          error: "비밀번호는 최소 8자 이상이며, 문자와 숫자를 포함해야 합니다.",
+        },
+        { status: 400 }
+      );
+    }
+
+    // 가장 최근의 인증 코드 조회
+    const codesSnapshot = await db
+      .collection("verification_codes")
+      .where("email", "==", email)
+      .where("verified", "==", false)
+      .orderBy("createdAt", "desc")
+      .limit(1)
+      .get();
+
+    if (codesSnapshot.empty) {
+      return Response.json(
+        { error: "유효하지 않은 인증 코드입니다." },
+        { status: 400 }
+      );
+    }
+
+    const verificationDoc = codesSnapshot.docs[0];
+    const verificationData = verificationDoc.data();
+
+    // 만료 확인
+    if (verificationData.expiresAt.toMillis() < Date.now()) {
+      return Response.json(
+        { error: "만료된 인증 코드입니다." },
+        { status: 400 }
+      );
+    }
+
+    // 시도 횟수 확인
+    if (verificationData.attempts >= 5) {
+      return Response.json(
+        { error: "최대 시도 횟수를 초과했습니다." },
+        { status: 400 }
+      );
+    }
+
+    // 코드 확인
+    if (verificationData.code !== code) {
+      await verificationDoc.ref.update({
+        attempts: FieldValue.increment(1),
+      });
+      return Response.json(
+        { error: "잘못된 인증 코드입니다." },
+        { status: 400 }
+      );
+    }
+
+    // Firebase Auth에서 사용자 찾기
+    const auth = getAuth();
+    const userRecord = await auth.getUserByEmail(email);
+
+    // 비밀번호 변경
+    await auth.updateUser(userRecord.uid, {
+      password: newPassword,
+    });
+
+    // 인증 코드를 verified로 표시
+    await verificationDoc.ref.update({
+      verified: true,
+      verifiedAt: Timestamp.now(),
+    });
+
+    return Response.json({
+      success: true,
+      message: "비밀번호가 성공적으로 변경되었습니다.",
+    });
+  } catch (error) {
+    console.error("비밀번호 재설정 오류:", error);
+
+    if (error.code === "auth/invalid-password") {
+      return Response.json(
+        { error: "유효하지 않은 비밀번호 형식입니다." },
+        { status: 400 }
+      );
+    }
+
+    return Response.json(
+      { error: "비밀번호 재설정 중 오류가 발생했습니다." },
+      { status: 500 }
+    );
+  }
+}
diff --git a/src/app/join/page.module.css b/src/app/join/page.module.css
index a3c03979..4dfd9076 100644
--- a/src/app/join/page.module.css
+++ b/src/app/join/page.module.css
@@ -24,7 +24,7 @@ body:has(.login-title) {
 
 .main h1 img {
   width: 85vw;
-  max-width: 48rem;
+  max-width: 36rem;
   margin-right: 10rem;
   filter: var(--filter-EEF0DE);
 }
diff --git a/src/components/login/FindPassword.jsx b/src/components/login/FindPassword.jsx
new file mode 100644
index 00000000..fed8c43b
--- /dev/null
+++ b/src/components/login/FindPassword.jsx
@@ -0,0 +1,239 @@
+import { useState, useEffect } from "react";
+import { Button, Input, LoginForm } from "../Controls";
+import { validatePassword } from "@/utils/validation";
+import Link from "next/link";
+import Loading from "../Loading";
+
+export default function FindPassword({ styles, setShowFindPassword }) {
+  const [email, setEmail] = useState("");
+  const [code, setCode] = useState("");
+  const [password, setPassword] = useState("");
+  const [passwordConfirm, setPasswordConfirm] = useState("");
+  const [isPasswordValid, setIsPasswordValid] = useState(false);
+  const [isPasswordMatch, setIsPasswordMatch] = useState(false);
+  const [error, setError] = useState("");
+  const [emailError, setEmailError] = useState("");
+  const [isEmailClicked, setIsEmailClicked] = useState(false);
+  const [isEmailSent, setIsEmailSent] = useState(false);
+
+  useEffect(() => {
+    if (password === "") {
+      setIsPasswordValid(false);
+    } else {
+      setIsPasswordValid(validatePassword(password));
+    }
+  }, [password]);
+
+  useEffect(() => {
+    if (password === passwordConfirm) {
+      setIsPasswordMatch(true);
+    } else {
+      setIsPasswordMatch(false);
+    }
+  }, [password, passwordConfirm]);
+
+  const handleVerifyEmail = async (e) => {
+    e.preventDefault();
+    setIsEmailClicked(true);
+
+    try {
+      const checkEmail = await fetch("/api/auth/check-email", {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ email: email }),
+      });
+
+      const result = await checkEmail.json();
+
+      if (!result.exists || result.error) {
+        setError("이메일 확인에 실패했습니다. 다시 시도해주세요.");
+        setEmailError("이메일을 확인해주세요.");
+        return;
+      } else {
+        const sendEmail = await fetch("/api/auth/send-email-verification", {
+          method: "POST",
+          headers: {
+            "Content-Type": "application/json",
+          },
+          body: JSON.stringify({ email: email }),
+        });
+
+        if (!sendEmail.ok) {
+          setError("인증 코드 발송에 실패했습니다. 다시 시도해주세요.");
+          setEmailError("인증 코드 발송에 실패했습니다.");
+          return;
+        } else {
+          setIsEmailSent(true);
+          setError("");
+        }
+        setEmailError("");
+      }
+    } catch (err) {
+      setError("인증 코드 발송에 실패했습니다. 다시 시도해주세요.");
+      setEmailError("인증 코드 발송에 실패했습니다.");
+    } finally {
+      setIsEmailClicked(false);
+    }
+  };
+
+  const handleFindPassword = async (e) => {
+    e.preventDefault();
+
+    try {
+      const response = await fetch("/api/auth/reset-password", {
+        method: "PUT",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({ email, code, newPassword: password }),
+      });
+
+      if (!response.ok) {
+        const errorData = await response.json();
+        throw new Error(errorData.error);
+      }
+
+      alert("비밀번호가 변경되었습니다. 다시 로그인해주세요.");
+      setShowFindPassword(false);
+    } catch (error) {
+      setError(error.message);
+    }
+  };
+
+  return (
+    <>
+      <h2 className={styles["login-title"]}>비밀번호 찾기</h2>
+      <p>가입하신 이메일을 입력해주세요.</p>
+      <LoginForm onSubmit={handleFindPassword} className={styles["find-form"]}>
+        <label className={styles["id-label"]}>
+          이메일
+          <div className={styles["input-wrap"]}>
+            <Input
+              type="email"
+              id="email"
+              value={email}
+              onChange={(e) => setEmail(e.target.value)}
+              onKeyDown={(e) => {
+                if (e.key === "Enter") handleVerifyEmail(e);
+              }}
+              required
+            />
+            <Button
+              onClick={handleVerifyEmail}
+              disabled={isEmailClicked}
+              highlight={true}
+            >
+              {isEmailClicked ? (
+                <Loading type="miniCircle" />
+              ) : isEmailSent ? (
+                "발송됨"
+              ) : (
+                "코드 발송"
+              )}
+            </Button>
+          </div>
+          <span className={styles["invalid-text"]}>
+            {emailError ? emailError : ""}
+          </span>
+        </label>
+        <label className={styles["id-label"]}>
+          인증번호
+          <Input
+            type="text"
+            id="code"
+            value={code}
+            onChange={(e) => setCode(e.target.value)}
+            required
+          />
+        </label>
+        <label className={styles["id-label"]}>
+          새 비밀번호
+          {/* <div className={styles["password-wrap"]}> */}
+          <Input
+            type="password"
+            id="password"
+            value={password}
+            onChange={(e) => setPassword(e.target.value)}
+            required
+          />
+          {/* <img
+              src={
+                isPasswordValid ? "/images/valid.svg" : "/images/invalid.svg"
+              }
+              width={40}
+              height={40}
+              alt={
+                isPasswordValid ? "유효한 비밀번호" : "유효하지 않은 비밀번호"
+              }
+            /> */}
+          {/* </div> */}
+          <span className={styles["invalid-text"]}>
+            {isPasswordValid
+              ? ""
+              : "비밀번호는 6자 이상, 영문 대,소문자, 숫자, 특수문자를 포함해주세요"}
+          </span>
+        </label>
+        <label className={styles["id-label"]}>
+          비밀번호 재확인
+          {/* <div className={styles["password-wrap"]}> */}
+          <Input
+            type="password"
+            id="password"
+            value={passwordConfirm}
+            onChange={(e) => setPasswordConfirm(e.target.value)}
+            required
+          />
+          {/* <img
+              src={
+                passwordConfirm !== "" && isPasswordMatch
+                  ? "/images/valid.svg"
+                  : "/images/invalid.svg"
+              }
+              width={40}
+              height={40}
+              alt={
+                passwordConfirm !== "" && isPasswordMatch
+                  ? "일치하는 비밀번호"
+                  : "일치하지 않은 비밀번호"
+              }
+            /> */}
+          {/* </div> */}
+          <span className={styles["invalid-text"]}>
+            {passwordConfirm !== "" && isPasswordMatch
+              ? ""
+              : "비밀번호가 일치하지 않습니다."}
+          </span>
+        </label>
+
+        {/* <p role="alert" className={styles["error-message"]}>
+          {error}
+        </p> */}
+        <ul className={styles["bottom-btns"]}>
+          <li>
+            <Button
+              className={styles["login-button"]}
+              onClick={(e) => {
+                e.preventDefault();
+                setShowFindPassword(false);
+              }}
+            >
+              돌아가기
+            </Button>
+          </li>
+          <li>
+            <Button
+              type="submit"
+              highlight={true}
+              className={styles["login-button"]}
+              disabled={email !== "" ? false : true}
+            >
+              비밀번호 변경
+            </Button>
+          </li>
+        </ul>
+      </LoginForm>
+    </>
+  );
+}
diff --git a/src/components/login/SocialLogin.jsx b/src/components/login/SocialLogin.jsx
index 4d64270f..3805b78e 100644
--- a/src/components/login/SocialLogin.jsx
+++ b/src/components/login/SocialLogin.jsx
@@ -14,12 +14,14 @@ import { checkUserExists } from "@/utils/auth/checkUser";
 import { Button, Input, LoginForm } from "../Controls";
 import styles from "./SocialLogin.module.css";
 import Loading from "../Loading";
+import FindPassword from "./FindPassword";
 
 export default function SocialLogin() {
   const router = useRouter();
   const [error, setError] = useState("");
   const [showEmailForm, setShowEmailForm] = useState(false);
-  const [showSignupForm, setShowSignupForm] = useState(false);
+  const [showFindPassword, setShowFindPassword] = useState(false);
+
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [emailValid, setEmailValid] = useState(false);
@@ -32,7 +34,7 @@ export default function SocialLogin() {
       if (!reduxUser) return;
 
       const exists = await checkUserExists(dispatch);
-      if (exists === false && !showSignupForm) {
+      if (exists === false) {
         router.push("/signup");
       } else if (!reduxUser.emailVerified) {
         setError("이메일 인증이 필요합니다. 이메일을 확인하세요.");
@@ -113,11 +115,11 @@ export default function SocialLogin() {
 
       // 결과에 따라 리다이렉트
       // 이메일 회원가입 중인 경우는 리다이렉션하지 않음
-      if (exists === false && !showSignupForm) {
+      if (exists === false) {
         router.push("/signup");
-      } else if (!reduxUser.emailVerified && !showSignupForm) {
+      } else if (!reduxUser.emailVerified) {
         setError("이메일 인증이 필요합니다. 이메일을 확인하세요.");
-      } else if (exists && reduxUser.emailVerified && !showSignupForm) {
+      } else if (exists && reduxUser.emailVerified) {
         router.push("/");
       }
     } catch (error) {
@@ -133,7 +135,7 @@ export default function SocialLogin() {
 
   return (
     <section className={styles["login-container"]}>
-      {showEmailForm && !showSignupForm ? (
+      {showEmailForm && !showFindPassword ? (
         <>
           <h2 className={styles["login-title"]}>이메일로 로그인하기</h2>
           <p>다시 꿈꾸러 오셔서 기뻐요!</p>
@@ -195,12 +197,29 @@ export default function SocialLogin() {
                 />
               </button>
             </div>
-            <div className={styles["join-button"]}>
-              <span>회원이 아니신가요?</span>
-              <Link href="/join">가입하기</Link>
-            </div>
+            <ul className={styles["account-btns"]}>
+              <li className={styles["join-button"]}>
+                <span>회원이 아니신가요?</span>
+                <Link href="/join">가입하기</Link>
+              </li>
+              <li className={styles["find-button"]}>
+                <button
+                  onClick={(e) => {
+                    e.preventDefault();
+                    setShowFindPassword(true);
+                  }}
+                >
+                  비밀번호를 잊으셨나요?
+                </button>
+              </li>
+            </ul>
           </LoginForm>
         </>
+      ) : showFindPassword ? (
+        <FindPassword
+          styles={styles}
+          setShowFindPassword={setShowFindPassword}
+        />
       ) : (
         <>
           <h2 className="sr-only">로그인</h2>
diff --git a/src/components/login/SocialLogin.module.css b/src/components/login/SocialLogin.module.css
index 3dcebb8a..a8df89a4 100644
--- a/src/components/login/SocialLogin.module.css
+++ b/src/components/login/SocialLogin.module.css
@@ -18,18 +18,20 @@ main:has(.login-title) {
   gap: 0;
 }
 main:has(.login-title) img {
-  max-width: 48rem;
-}
-.login-form {
-  gap: 0;
+  max-width: 36rem;
 }
+
 .login-container {
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  gap: 1.6rem;
 }
+
+.login-container .login-form {
+  row-gap: 0;
+}
+
 .id-label {
   margin-bottom: 4rem;
 }
@@ -44,7 +46,7 @@ main:has(.login-title) img {
   margin: 0.5rem 0 7.5rem 0;
 }
 .login-title {
-  font-size: var(--big-text-font-size);
+  font-size: var(--h2-font-size);
   font-weight: bold;
 }
 .login-button {
@@ -59,6 +61,16 @@ main:has(.login-title) img {
   gap: 0.8rem;
   margin-bottom: 0.8rem;
 }
+
+.account-btns {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  row-gap: 1.6rem;
+  text-align: center;
+}
+
 .join-button button,
 .join-button button:hover,
 .join-button button:active,
@@ -70,6 +82,18 @@ main:has(.login-title) img {
   color: var(--deep-pink-color);
   margin: 0 0 3.7rem 0.4rem;
 }
+.find-button button,
+.find-button button:hover,
+.find-button button:active,
+.find-button a,
+.find-button a:hover,
+.find-button a:active {
+  margin: 0 0 3.7rem 0.4rem;
+  padding: 0;
+  background: none;
+  color: var(--deep-pink-color);
+  font-size: var(--body-font-size);
+}
 
 /* '/' 첫페이지 구글,이메일 로그인 버튼 */
 .google-login-btn,
@@ -123,6 +147,61 @@ main:has(.login-title) img {
   cursor: not-allowed;
 }
 
+/* 비밀번호 찾기 창 */
+.login-container .find-form label {
+  margin-bottom: 0;
+  display: grid;
+  grid-template-rows: auto 1fr 2.4rem;
+}
+
+.input-wrap {
+  width: 100%;
+  display: grid;
+  grid-template-columns: 1fr auto;
+  align-items: center;
+  column-gap: 0.6rem;
+  border-radius: 1rem;
+  background-color: var(--input-color);
+}
+
+.input-wrap input {
+  background: none;
+}
+
+.password-wrap {
+  width: 100%;
+  display: grid;
+  grid-template-columns: 1fr auto;
+  align-items: center;
+  column-gap: 0.6rem;
+  border-radius: 1rem;
+}
+
+.input-wrap button {
+  width: fit-content;
+  height: fit-content;
+  margin-right: 0.6rem;
+}
+
+.invalid-text {
+  font-weight: 400;
+  font-size: var(--body-font-size);
+  color: var(--invalid-text-color);
+}
+
+.bottom-btns {
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 1.6rem;
+  padding: 0 1.5rem;
+}
+
+.bottom-btns button {
+  margin-bottom: 0;
+}
+
 @media (max-width: 720px) {
   main:has(.login-title) {
     height: fit-content;
@@ -174,7 +253,8 @@ main:has(.login-title) img {
   }
   .error-message,
   .google-login,
-  .join-button {
+  .join-button,
+  .find-button {
     font-size: var(--small-text-font-size);
   }
 }
diff --git a/src/utils/validation.js b/src/utils/validation.js
index bf161926..b3bf87de 100644
--- a/src/utils/validation.js
+++ b/src/utils/validation.js
@@ -78,3 +78,18 @@ export function validateSecondForm(e) {
 
   return true;
 }
+
+export function validatePassword(password) {
+  const minLength = 6;
+  const maxLength = 4096;
+  const hasUpperCase = /[A-Z]/.test(password);
+  const hasLowerCase = /[a-z]/.test(password);
+  const hasNumber = /[0-9]/.test(password);
+  const hasSpecialChar = /[!@#$%^&*(),.?":{}|<>]/.test(password);
+  const isValidLength =
+    password.length >= minLength && password.length <= maxLength;
+
+  return (
+    hasUpperCase && hasLowerCase && hasNumber && hasSpecialChar && isValidLength
+  );
+}