From fdceef61cbb9505c076b576d1307740db609ceec Mon Sep 17 00:00:00 2001
From: Wibaek Park <devmuromi@gmail.com>
Date: Wed, 8 Jul 2026 00:33:26 +0900
Subject: [PATCH] =?UTF-8?q?fix(signup):=20=EA=B0=80=EC=9E=85=20=EC=A4=80?=
 =?UTF-8?q?=EB=B9=84=20=EB=8B=A8=EA=B3=84=20=EC=A0=95=EB=A0=AC=20=EC=A1=B0?=
 =?UTF-8?q?=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web/src/app/sign-up/page.tsx                 |  2 +-
 .../login/signup/SignupPrepareScreen.tsx          | 15 +++++++++------
 2 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/apps/web/src/app/sign-up/page.tsx b/apps/web/src/app/sign-up/page.tsx
index aa7295f0..84bbc140 100644
--- a/apps/web/src/app/sign-up/page.tsx
+++ b/apps/web/src/app/sign-up/page.tsx
@@ -15,7 +15,7 @@ const SignUpPage = () => {
   return (
     <>
       <TopDetailNavigation title="회원가입" />
-      <div className="w-full px-5">
+      <div className="w-full">
         <Suspense fallback={<CloudSpinnerPage />}>
           <SignupSurvey baseNickname="" baseEmail="" baseProfileImageUrl="" />
         </Suspense>
diff --git a/apps/web/src/components/login/signup/SignupPrepareScreen.tsx b/apps/web/src/components/login/signup/SignupPrepareScreen.tsx
index 95779283..0aded58f 100644
--- a/apps/web/src/components/login/signup/SignupPrepareScreen.tsx
+++ b/apps/web/src/components/login/signup/SignupPrepareScreen.tsx
@@ -94,15 +94,18 @@ const PrepareChoiceButton = ({
 }: PrepareChoiceButtonProps) => {
   return (
     <button
-      className={clsx("flex items-center gap-9 rounded-lg py-5 shadow-magic-signup-step", {
-        "border border-primary bg-primary-100": preparation === status,
-        "border border-white bg-white": preparation !== status,
-      })}
+      className={clsx(
+        "flex items-center gap-7 rounded-lg border px-6 py-5 text-left shadow-magic-signup-step focus:outline-none focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary",
+        {
+          "border-primary bg-primary-100": preparation === status,
+          "border-white bg-white": preparation !== status,
+        },
+      )}
       onClick={() => setPreparation(status)}
       type="button"
     >
-      <div className="pl-[2.75rem]">{icon}</div>
-      <div className="flex flex-col items-start">
+      <div className="flex w-16 shrink-0 justify-center">{icon}</div>
+      <div className="flex min-w-0 flex-col items-start">
         <span className="text-k-500 typo-regular-4">{description}</span>
         <span className="text-k-800 typo-sb-4">{name}</span>
       </div>