From 02184031c1d152bcbad573b4d539abfc3ffa60f1 Mon Sep 17 00:00:00 2001
From: mingo <mingo0273@gmail.com>
Date: Sat, 18 Jul 2026 01:12:29 +0900
Subject: [PATCH 1/5] =?UTF-8?q?Feat:=20=EC=8A=A4=ED=81=AC=EB=A1=A4?=
 =?UTF-8?q?=EB=B0=94=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80=20[JDDEV-109]?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jobdri/src/app/mockApply/job/loading/page.tsx |   6 +-
 jobdri/src/app/mockApply/job/review/page.tsx  | 179 ++++++++++++++++++
 .../components/common/lnb/LnbScrollbar.tsx    |  30 ++-
 3 files changed, 207 insertions(+), 8 deletions(-)
 create mode 100644 jobdri/src/app/mockApply/job/review/page.tsx

diff --git a/jobdri/src/app/mockApply/job/loading/page.tsx b/jobdri/src/app/mockApply/job/loading/page.tsx
index 7f0a2b1..b655f53 100644
--- a/jobdri/src/app/mockApply/job/loading/page.tsx
+++ b/jobdri/src/app/mockApply/job/loading/page.tsx
@@ -115,12 +115,12 @@ export default function JobPostingLoadingPage() {
       return;
     }
 
-    const errorTimer = window.setTimeout(() => {
-      router.replace("/mockApply/job/create?analysisError=1");
+    const completionTimer = window.setTimeout(() => {
+      router.replace("/mockApply/job/review");
     }, loadingDurationMs);
 
     return () => {
-      window.clearTimeout(errorTimer);
+      window.clearTimeout(completionTimer);
     };
   }, [loadingDurationMs, router, showStopConfirm]);
 
diff --git a/jobdri/src/app/mockApply/job/review/page.tsx b/jobdri/src/app/mockApply/job/review/page.tsx
new file mode 100644
index 0000000..d32036f
--- /dev/null
+++ b/jobdri/src/app/mockApply/job/review/page.tsx
@@ -0,0 +1,179 @@
+"use client";
+
+import type { ReactNode } from "react";
+import { useRouter } from "next/navigation";
+import Header from "@/components/common/header/Header";
+import SideHeaderContainer from "@/components/common/header/SideHeaderContainer";
+import {
+  LnbScrollbar,
+  lnbHiddenScrollbarClass,
+  useLnbScrollMetrics,
+} from "@/components/common/lnb/LnbScrollbar";
+import { CtaFooter } from "@/components/common/cta";
+import { JDInput } from "@/components/common/input";
+import Avatar from "@/components/mockApply/home/Avatar";
+
+const wizardSteps = [
+  { label: "공고 확인" },
+  { label: "자소서 입력" },
+  { label: "첨삭 결과" },
+];
+
+function SectionCard({
+  title,
+  children,
+}: {
+  title: string;
+  children: ReactNode;
+}) {
+  return (
+    <section className="flex min-w-[600px] max-w-[1000px] self-stretch flex-col items-start gap-6 rounded-card bg-bg-contents-default px-5 pt-6 pb-7">
+      <div className="flex items-center justify-center gap-2.5 px-1">
+        <h2 className="text-[18px] leading-[26px] font-semibold tracking-[-0.36px] text-text-neutral-title [font-feature-settings:'liga'_off,'clig'_off]">
+          {title}
+        </h2>
+      </div>
+
+      <div className="flex self-stretch flex-col items-start gap-1">
+        {children}
+      </div>
+    </section>
+  );
+}
+
+function JobProfileRow() {
+  return (
+    <div className="flex w-full items-start gap-8 px-2 py-5">
+      <div className="flex w-[200px] shrink-0 flex-col items-start justify-center gap-1">
+        <div className="flex items-center gap-1.5 self-stretch">
+          <span className="text-b16-semibold text-text-neutral-title [font-feature-settings:'liga'_off,'clig'_off]">
+            공고 프로필
+          </span>
+          <svg
+            aria-hidden="true"
+            className="h-[5px] w-[5px] shrink-0"
+            viewBox="0 0 5 5"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <circle
+              cx="2.5"
+              cy="2.5"
+              r="2"
+              fill="var(--color-fill-system-fail-strong)"
+              stroke="#FF4242"
+            />
+          </svg>
+        </div>
+
+        <span className="text-cap12-med text-text-neutral-disabled [font-feature-settings:'liga'_off,'clig'_off]">
+          이 공고의 프로필 색상을 선택해 주세요.
+        </span>
+      </div>
+
+      <div className="flex flex-1 items-start py-0.5">
+        <Avatar
+          name="토"
+          type="company"
+          size="large"
+          isEditable
+          className="!h-11 !w-11"
+        />
+      </div>
+    </div>
+  );
+}
+
+export default function JobPostingReviewPage() {
+  const router = useRouter();
+  const { scrollAreaRef, scrollbarMetrics, updateScrollbarMetrics } =
+    useLnbScrollMetrics(true, "job-posting-review", { trackPadding: 28 });
+
+  return (
+    <div className="h-dvh overflow-hidden bg-line-neutral-assistive">
+      <div className="flex h-dvh w-dvw flex-col bg-bg-white">
+        <Header
+          companyName="토스"
+          jobTitle="프로덕트 디자이너"
+          applicationLabel="첫 번째 지원"
+          currentStep={1}
+          steps={wizardSteps}
+          lastSavedAt="17:00"
+          className="shrink-0"
+        />
+
+        <div className="relative flex min-h-0 w-full flex-1 items-stretch overflow-visible px-2 pb-0">
+          <div
+            ref={scrollAreaRef}
+            onScroll={updateScrollbarMetrics}
+            className={`flex min-h-0 w-full flex-1 items-start justify-center overflow-y-auto overflow-x-hidden ${lnbHiddenScrollbarClass}`}
+          >
+            <div className="flex min-h-0 flex-1 items-start justify-center self-stretch rounded-card-l bg-fill-quaternary-assistive">
+              <main className="flex flex-1 items-start justify-between">
+                <SideHeaderContainer
+                  leading={1}
+                  title="공고 내용을 확인해주세요."
+                  subtitle="입력해 준 내용을 바탕으로 AI가 자동으로 추출한 정보예요. 고치고 싶은 부분이 있다면 수정 버튼을 눌러 원하는 내용을 입력해주세요."
+                  element={<></>}
+                  className="shrink-0 self-stretch"
+                />
+
+                <div className="flex [flex:1_0_0] flex-col items-start gap-3 pt-16 pr-[72px] pl-20">
+                  <SectionCard title="공고 정보 편집">
+                    <JobProfileRow />
+                    <JDInput
+                      label="공고명"
+                      description="이 공고의 이름이에요."
+                      type="company"
+                      className="!w-full"
+                    />
+                    <JDInput
+                      label="회사명"
+                      description="채용 공고를 올린 회사예요."
+                      type="company"
+                      className="!w-full"
+                    />
+                  </SectionCard>
+
+                  <SectionCard title="직무 정보">
+                    <JDInput type="role" className="!w-full" />
+                    <JDInput
+                      type="task"
+                      description="이 직무에서 담당할 업무예요."
+                      className="!w-full"
+                    />
+                  </SectionCard>
+
+                  <SectionCard title="채용 기준">
+                    <JDInput type="qualification" className="!w-full" />
+                    <JDInput type="prefer" className="!w-full" />
+                  </SectionCard>
+
+                  <div aria-hidden="true" className="h-[108px] shrink-0" />
+                </div>
+              </main>
+            </div>
+          </div>
+          <LnbScrollbar
+            metrics={scrollbarMetrics}
+            size="l"
+            className="!top-2.5 !right-1 !bottom-2.5 z-10"
+          />
+        </div>
+
+        <CtaFooter
+          type="wizard"
+          className="!w-full shrink-0"
+          backAction={{
+            label: "이전으로",
+            onClick: () => router.push("/mockApply/job/create"),
+          }}
+          nextAction={{
+            label: "다음으로",
+            disabled: true,
+          }}
+        />
+      </div>
+    </div>
+  );
+}
diff --git a/jobdri/src/components/common/lnb/LnbScrollbar.tsx b/jobdri/src/components/common/lnb/LnbScrollbar.tsx
index b7bbece..9e06c40 100644
--- a/jobdri/src/components/common/lnb/LnbScrollbar.tsx
+++ b/jobdri/src/components/common/lnb/LnbScrollbar.tsx
@@ -15,11 +15,17 @@ interface LnbScrollbarMetrics {
   thumbTop: number;
 }
 
+type LnbScrollbarSize = "s" | "l";
+
 export function useLnbScrollMetrics<T extends HTMLElement = HTMLDivElement>(
   isEnabled: boolean,
   recalculationKey: unknown,
+  options?: {
+    trackPadding?: number;
+  },
 ) {
   const scrollAreaRef = useRef<T>(null);
+  const trackPadding = options?.trackPadding ?? lnbScrollbarPadding;
   const [scrollbarMetrics, setScrollbarMetrics] =
     useState<LnbScrollbarMetrics>({
       isScrollable: false,
@@ -45,7 +51,7 @@ export function useLnbScrollMetrics<T extends HTMLElement = HTMLDivElement>(
       return;
     }
 
-    const trackHeight = Math.max(clientHeight - lnbScrollbarPadding, 0);
+    const trackHeight = Math.max(clientHeight - trackPadding, 0);
     const thumbHeight = Math.min(
       Math.max(
         (clientHeight / scrollHeight) * trackHeight,
@@ -63,7 +69,7 @@ export function useLnbScrollMetrics<T extends HTMLElement = HTMLDivElement>(
       thumbHeight,
       thumbTop,
     });
-  }, []);
+  }, [trackPadding]);
 
   useEffect(() => {
     if (!isEnabled) {
@@ -110,26 +116,40 @@ export function useLnbScrollMetrics<T extends HTMLElement = HTMLDivElement>(
 
 export function LnbScrollbar({
   metrics,
+  size = "s",
   className,
 }: {
   metrics: LnbScrollbarMetrics;
+  size?: LnbScrollbarSize;
   className?: string;
 }) {
   if (!metrics.isScrollable) {
     return null;
   }
 
+  const isLarge = size === "l";
+
   return (
     <span
       aria-hidden="true"
       className={clsx(
-        "pointer-events-none absolute inset-y-0 right-[-4px] flex w-3 flex-col items-end rounded-badge-round p-1",
+        "pointer-events-none absolute flex flex-col items-center rounded-badge-round p-1",
+        isLarge ? "w-4" : "w-3",
+        !className && "inset-y-0 right-[-4px] items-end",
         className,
       )}
     >
-      <span className="relative flex w-1 flex-1 flex-col items-center gap-2.5">
+      <span
+        className={clsx(
+          "relative flex flex-1 flex-col items-center gap-2.5",
+          isLarge ? "w-2" : "w-1",
+        )}
+      >
         <span
-          className="absolute right-0 flex w-1 flex-col items-start rounded-badge-round bg-icon-neutral-weak"
+          className={clsx(
+            "absolute right-0 flex flex-col items-start rounded-badge-round bg-icon-neutral-weak",
+            isLarge ? "w-2" : "w-1",
+          )}
           style={{
             height: metrics.thumbHeight,
             transform: `translateY(${metrics.thumbTop}px)`,

From 9c3a43b63a155d3226582da94bba6de693705171 Mon Sep 17 00:00:00 2001
From: mingo <mingo0273@gmail.com>
Date: Sat, 18 Jul 2026 01:14:02 +0900
Subject: [PATCH 2/5] =?UTF-8?q?Feat:=20=EA=B3=B5=EA=B3=A0=20=ED=99=95?=
 =?UTF-8?q?=EC=9D=B8=20=EB=B0=8F=20=ED=8E=B8=EC=A7=91=20=EA=B8=B0=EB=B3=B8?=
 =?UTF-8?q?=20=ED=8E=98=EC=9D=B4=EC=A7=80=20[JDDEV-109]?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jobdri/src/app/mockApply/job/review/page.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/jobdri/src/app/mockApply/job/review/page.tsx b/jobdri/src/app/mockApply/job/review/page.tsx
index d32036f..cc6956a 100644
--- a/jobdri/src/app/mockApply/job/review/page.tsx
+++ b/jobdri/src/app/mockApply/job/review/page.tsx
@@ -157,7 +157,7 @@ export default function JobPostingReviewPage() {
           <LnbScrollbar
             metrics={scrollbarMetrics}
             size="l"
-            className="!top-2.5 !right-1 !bottom-2.5 z-10"
+            className="!top-[10px] !right-1 !bottom-[10px] z-10"
           />
         </div>
 

From ed6f7951c348cc5c4eed2653c0e39c26e4628b1e Mon Sep 17 00:00:00 2001
From: mingo <mingo0273@gmail.com>
Date: Sat, 18 Jul 2026 01:47:38 +0900
Subject: [PATCH 3/5] =?UTF-8?q?Feat:=20=EA=B3=B5=EA=B3=A0=20=EC=88=98?=
 =?UTF-8?q?=EC=A0=95=20=EB=A1=9C=EC=A7=81=20=EA=B5=AC=ED=98=84=20[JDDEV-10?=
 =?UTF-8?q?9]?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jobdri/src/app/mockApply/job/review/page.tsx  | 39 +++++++++++++------
 .../src/components/common/input/JDInput.tsx   | 10 ++++-
 2 files changed, 37 insertions(+), 12 deletions(-)

diff --git a/jobdri/src/app/mockApply/job/review/page.tsx b/jobdri/src/app/mockApply/job/review/page.tsx
index cc6956a..81f0d67 100644
--- a/jobdri/src/app/mockApply/job/review/page.tsx
+++ b/jobdri/src/app/mockApply/job/review/page.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import type { ReactNode } from "react";
+import { useMemo, useState, type ReactNode } from "react";
 import { useRouter } from "next/navigation";
 import Header from "@/components/common/header/Header";
 import SideHeaderContainer from "@/components/common/header/SideHeaderContainer";
@@ -27,7 +27,7 @@ function SectionCard({
   children: ReactNode;
 }) {
   return (
-    <section className="flex min-w-[600px] max-w-[1000px] self-stretch flex-col items-start gap-6 rounded-card bg-bg-contents-default px-5 pt-6 pb-7">
+    <section className="flex w-full min-w-[612px] max-w-[1000px] flex-col items-start gap-6 rounded-card bg-bg-contents-default px-5 pt-6 pb-7">
       <div className="flex items-center justify-center gap-2.5 px-1">
         <h2 className="text-[18px] leading-[26px] font-semibold tracking-[-0.36px] text-text-neutral-title [font-feature-settings:'liga'_off,'clig'_off]">
           {title}
@@ -41,7 +41,7 @@ function SectionCard({
   );
 }
 
-function JobProfileRow() {
+function JobProfileRow({ avatarName }: { avatarName: string }) {
   return (
     <div className="flex w-full items-start gap-8 px-2 py-5">
       <div className="flex w-[200px] shrink-0 flex-col items-start justify-center gap-1">
@@ -73,7 +73,7 @@ function JobProfileRow() {
 
       <div className="flex flex-1 items-start py-0.5">
         <Avatar
-          name="토"
+          name={avatarName}
           type="company"
           size="large"
           isEditable
@@ -86,12 +86,18 @@ function JobProfileRow() {
 
 export default function JobPostingReviewPage() {
   const router = useRouter();
+  const [companyName, setCompanyName] = useState("");
   const { scrollAreaRef, scrollbarMetrics, updateScrollbarMetrics } =
     useLnbScrollMetrics(true, "job-posting-review", { trackPadding: 28 });
+  const companyAvatarName = useMemo(() => {
+    const trimmedCompanyName = companyName.trim();
+
+    return trimmedCompanyName.length > 0 ? trimmedCompanyName[0] : "T";
+  }, [companyName]);
 
   return (
-    <div className="h-dvh overflow-hidden bg-line-neutral-assistive">
-      <div className="flex h-dvh w-dvw flex-col bg-bg-white">
+    <div className="h-dvh w-dvw overflow-hidden bg-line-neutral-assistive">
+      <div className="flex h-dvh w-dvw min-w-[1100px] flex-col bg-bg-white">
         <Header
           companyName="토스"
           jobTitle="프로덕트 디자이너"
@@ -99,7 +105,7 @@ export default function JobPostingReviewPage() {
           currentStep={1}
           steps={wizardSteps}
           lastSavedAt="17:00"
-          className="shrink-0"
+          className="min-w-[1100px] max-w-none shrink-0 self-stretch"
         />
 
         <div className="relative flex min-h-0 w-full flex-1 items-stretch overflow-visible px-2 pb-0">
@@ -118,9 +124,9 @@ export default function JobPostingReviewPage() {
                   className="shrink-0 self-stretch"
                 />
 
-                <div className="flex [flex:1_0_0] flex-col items-start gap-3 pt-16 pr-[72px] pl-20">
+                <div className="flex [flex:1_0_0] flex-col items-center gap-3 pt-16 pr-[72px] pl-20">
                   <SectionCard title="공고 정보 편집">
-                    <JobProfileRow />
+                    <JobProfileRow avatarName={companyAvatarName} />
                     <JDInput
                       label="공고명"
                       description="이 공고의 이름이에요."
@@ -131,6 +137,8 @@ export default function JobPostingReviewPage() {
                       label="회사명"
                       description="채용 공고를 올린 회사예요."
                       type="company"
+                      value={companyName}
+                      onChange={setCompanyName}
                       className="!w-full"
                     />
                   </SectionCard>
@@ -140,13 +148,22 @@ export default function JobPostingReviewPage() {
                     <JDInput
                       type="task"
                       description="이 직무에서 담당할 업무예요."
+                      required={false}
                       className="!w-full"
                     />
                   </SectionCard>
 
                   <SectionCard title="채용 기준">
-                    <JDInput type="qualification" className="!w-full" />
-                    <JDInput type="prefer" className="!w-full" />
+                    <JDInput
+                      type="qualification"
+                      required={false}
+                      className="!w-full"
+                    />
+                    <JDInput
+                      type="prefer"
+                      required={false}
+                      className="!w-full"
+                    />
                   </SectionCard>
 
                   <div aria-hidden="true" className="h-[108px] shrink-0" />
diff --git a/jobdri/src/components/common/input/JDInput.tsx b/jobdri/src/components/common/input/JDInput.tsx
index 5673f0e..1a28c32 100644
--- a/jobdri/src/components/common/input/JDInput.tsx
+++ b/jobdri/src/components/common/input/JDInput.tsx
@@ -114,6 +114,14 @@ export function JDInput({
     onChange?.(nextValue);
   };
 
+  const handleAdd = () => {
+    if (state === undefined) {
+      setInternalState("default");
+    }
+
+    onAdd?.();
+  };
+
   return (
     <div
       data-fill={fill}
@@ -168,7 +176,7 @@ export function JDInput({
               maxLength={maxLength}
               message=""
               selected
-              onAdd={onAdd}
+              onAdd={handleAdd}
               className="!w-full min-w-0 flex-1 gap-1"
             />
           </div>

From d7bacb5aee689998a687bccd3e9fdd54f95a270b Mon Sep 17 00:00:00 2001
From: mingo <mingo0273@gmail.com>
Date: Sat, 18 Jul 2026 02:22:38 +0900
Subject: [PATCH 4/5] =?UTF-8?q?Feat:=20=EA=B3=B5=EA=B3=A0=20=ED=99=95?=
 =?UTF-8?q?=EC=9D=B8=20=EB=B0=8F=20=ED=8E=B8=EC=A7=91=20=EC=98=88=EC=99=B8?=
 =?UTF-8?q?=EC=BC=80=EC=9D=B4=EC=8A=A4=20=EA=B5=AC=ED=98=84=20[JDDEV-109]?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jobdri/src/app/mockApply/job/create/page.tsx  |  1 +
 jobdri/src/app/mockApply/job/review/page.tsx  | 48 ++++++++++++-
 .../src/components/common/input/JDInput.tsx   | 69 +++++++++++++++----
 jobdri/src/components/common/toast/Toast.tsx  |  5 +-
 4 files changed, 109 insertions(+), 14 deletions(-)

diff --git a/jobdri/src/app/mockApply/job/create/page.tsx b/jobdri/src/app/mockApply/job/create/page.tsx
index 8685cc3..56003a1 100644
--- a/jobdri/src/app/mockApply/job/create/page.tsx
+++ b/jobdri/src/app/mockApply/job/create/page.tsx
@@ -225,6 +225,7 @@ export default function JobPostingCreatePage() {
         <Toast
           message={jobPostingToastMessage}
           variant="warning"
+          showStatusIcon={jobPostingToastMessage !== "공고 분석을 중단했습니다."}
           onClose={() => setJobPostingToastMessage(null)}
           className="!right-7 !bottom-7 !max-w-none !rounded-card"
         />
diff --git a/jobdri/src/app/mockApply/job/review/page.tsx b/jobdri/src/app/mockApply/job/review/page.tsx
index 81f0d67..03a45c2 100644
--- a/jobdri/src/app/mockApply/job/review/page.tsx
+++ b/jobdri/src/app/mockApply/job/review/page.tsx
@@ -11,6 +11,7 @@ import {
 } from "@/components/common/lnb/LnbScrollbar";
 import { CtaFooter } from "@/components/common/cta";
 import { JDInput } from "@/components/common/input";
+import { ModalNotice } from "@/components/common/modal";
 import Avatar from "@/components/mockApply/home/Avatar";
 
 const wizardSteps = [
@@ -87,6 +88,8 @@ function JobProfileRow({ avatarName }: { avatarName: string }) {
 export default function JobPostingReviewPage() {
   const router = useRouter();
   const [companyName, setCompanyName] = useState("");
+  const [showBackConfirm, setShowBackConfirm] = useState(false);
+  const [showHomeConfirm, setShowHomeConfirm] = useState(false);
   const { scrollAreaRef, scrollbarMetrics, updateScrollbarMetrics } =
     useLnbScrollMetrics(true, "job-posting-review", { trackPadding: 28 });
   const companyAvatarName = useMemo(() => {
@@ -105,6 +108,10 @@ export default function JobPostingReviewPage() {
           currentStep={1}
           steps={wizardSteps}
           lastSavedAt="17:00"
+          homeAction={{
+            label: "홈으로",
+            onClick: () => setShowHomeConfirm(true),
+          }}
           className="min-w-[1100px] max-w-none shrink-0 self-stretch"
         />
 
@@ -183,7 +190,7 @@ export default function JobPostingReviewPage() {
           className="!w-full shrink-0"
           backAction={{
             label: "이전으로",
-            onClick: () => router.push("/mockApply/job/create"),
+            onClick: () => setShowBackConfirm(true),
           }}
           nextAction={{
             label: "다음으로",
@@ -191,6 +198,45 @@ export default function JobPostingReviewPage() {
           }}
         />
       </div>
+
+      {showBackConfirm && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-bg-lightbox-default">
+          <ModalNotice
+            type="confirmationModal"
+            title="공고 입력으로 돌아갈까요?"
+            description="공고 확인에서 수정한 내용은 저장되지 않아요."
+            onClose={() => setShowBackConfirm(false)}
+            secondaryAction={{
+              label: "돌아가기",
+              onClick: () =>
+                router.push("/mockApply/job/create?analysisCanceled=1"),
+            }}
+            primaryAction={{
+              label: "계속 작성",
+              onClick: () => setShowBackConfirm(false),
+            }}
+          />
+        </div>
+      )}
+
+      {showHomeConfirm && (
+        <div className="fixed inset-0 z-50 flex items-center justify-center bg-bg-lightbox-default">
+          <ModalNotice
+            type="confirmationModal"
+            title="페이지를 나가시겠어요?"
+            description="자동 저장 이후 작성된 내용은 저장되지 않아요."
+            onClose={() => setShowHomeConfirm(false)}
+            secondaryAction={{
+              label: "홈으로",
+              onClick: () => router.push("/"),
+            }}
+            primaryAction={{
+              label: "취소",
+              onClick: () => setShowHomeConfirm(false),
+            }}
+          />
+        </div>
+      )}
     </div>
   );
 }
diff --git a/jobdri/src/components/common/input/JDInput.tsx b/jobdri/src/components/common/input/JDInput.tsx
index 1a28c32..5293a68 100644
--- a/jobdri/src/components/common/input/JDInput.tsx
+++ b/jobdri/src/components/common/input/JDInput.tsx
@@ -49,6 +49,58 @@ const jdInputTypeConfig: Record<
   },
 };
 
+function getJDInputListItems(value: string) {
+  return value
+    .split(/\r?\n/)
+    .map((item) => item.trim().replace(/^[-•ㆍ·]\s*/, ""))
+    .filter(Boolean);
+}
+
+function JDInputDisplayValue({
+  hasValue,
+  placeholder,
+  value,
+}: {
+  hasValue: boolean;
+  placeholder: string;
+  value: string;
+}) {
+  const listItems = hasValue ? getJDInputListItems(value) : [];
+
+  if (hasValue && listItems.length > 1) {
+    return (
+      <div className="flex flex-1 flex-col items-start gap-2.5 self-stretch py-2">
+        {listItems.map((item, index) => (
+          <div
+            key={`${item}-${index}`}
+            className="flex w-full items-start gap-2.5"
+          >
+            <span className="flex h-[21px] w-[5px] shrink-0 flex-col items-start justify-center">
+              <span className="h-[5px] w-[5px] shrink-0 rounded-badge-round bg-fill-primary-default" />
+            </span>
+            <span className="flex-1 text-sub14-med text-text-neutral-description [font-feature-settings:'liga'_off,'clig'_off]">
+              {item}
+            </span>
+          </div>
+        ))}
+      </div>
+    );
+  }
+
+  return (
+    <div className="flex flex-1 flex-col items-start self-stretch py-2">
+      <span
+        className={clsx(
+          "self-stretch whitespace-pre-line text-sub14-med [font-feature-settings:'liga'_off,'clig'_off]",
+          hasValue ? "text-text-neutral-description" : "text-text-neutral-caption",
+        )}
+      >
+        {hasValue ? value : placeholder}
+      </span>
+    </div>
+  );
+}
+
 export interface JDInputProps {
   className?: string;
   defaultValue?: string;
@@ -183,18 +235,11 @@ export function JDInput({
         </div>
       ) : (
         <div className="flex flex-1 items-start gap-5 self-stretch">
-          <div className="flex flex-1 flex-col items-start self-stretch py-2">
-            <span
-              className={clsx(
-                "self-stretch whitespace-pre-line text-sub14-med [font-feature-settings:'liga'_off,'clig'_off]",
-                hasValue
-                  ? "text-text-neutral-description"
-                  : "text-text-neutral-caption",
-              )}
-            >
-              {hasValue ? resolvedValue : placeholder}
-            </span>
-          </div>
+          <JDInputDisplayValue
+            hasValue={hasValue}
+            placeholder={placeholder}
+            value={resolvedValue}
+          />
 
           <div className="flex w-[72px] shrink-0 items-start justify-end self-stretch py-2">
             {rightContent ?? (
diff --git a/jobdri/src/components/common/toast/Toast.tsx b/jobdri/src/components/common/toast/Toast.tsx
index 725c0b4..74b18e4 100644
--- a/jobdri/src/components/common/toast/Toast.tsx
+++ b/jobdri/src/components/common/toast/Toast.tsx
@@ -10,6 +10,7 @@ interface ToastProps {
   onClose?: () => void;
   className?: string;
   position?: "top" | "bottom";
+  showStatusIcon?: boolean;
 }
 
 export default function Toast({
@@ -18,9 +19,11 @@ export default function Toast({
   onClose,
   className,
   position = "bottom",
+  showStatusIcon = true,
 }: ToastProps) {
   const isDark = variant === "dark";
-  const hasStatusIcon = variant === "check" || variant === "warning";
+  const hasStatusIcon =
+    showStatusIcon && (variant === "check" || variant === "warning");
   const isTop = position === "top";
 
   return (

From 4bd6664e6d5df96e9a57b15986d4bb556783ebdb Mon Sep 17 00:00:00 2001
From: mingo <mingo0273@gmail.com>
Date: Sat, 18 Jul 2026 03:02:27 +0900
Subject: [PATCH 5/5] =?UTF-8?q?Feat:=20=ED=8E=98=EC=9D=B4=EC=A7=80=20?=
 =?UTF-8?q?=EB=9D=BC=EC=9A=B0=ED=8C=85=20=EB=B0=8F=20=EC=98=88=EC=99=B8?=
 =?UTF-8?q?=EC=BC=80=EC=9D=B4=EC=8A=A4=20=EC=A0=95=EB=A6=AC=20[JDDEV-109]?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jobdri/src/app/mockApply/job/create/page.tsx | 10 +---------
 jobdri/src/app/mockApply/job/review/page.tsx |  8 ++++++--
 2 files changed, 7 insertions(+), 11 deletions(-)

diff --git a/jobdri/src/app/mockApply/job/create/page.tsx b/jobdri/src/app/mockApply/job/create/page.tsx
index 56003a1..8069717 100644
--- a/jobdri/src/app/mockApply/job/create/page.tsx
+++ b/jobdri/src/app/mockApply/job/create/page.tsx
@@ -91,8 +91,6 @@ export default function JobPostingCreatePage() {
   const [jobPostingToastMessage, setJobPostingToastMessage] = useState<
     string | null
   >(null);
-  const hasDraftContent =
-    jobPostingInputValue.trim().length > 0 || attachedFiles.length > 0;
 
   useEffect(() => {
     const searchParams = new URLSearchParams(window.location.search);
@@ -132,12 +130,7 @@ export default function JobPostingCreatePage() {
 
   const handleHomeClick = (event: MouseEvent<HTMLButtonElement>) => {
     event.preventDefault();
-
-    if (!hasDraftContent) {
-      clearJobPostingDraft();
-      router.push("/");
-      return;
-    }
+    event.stopPropagation();
 
     setShowExitConfirm(true);
   };
@@ -225,7 +218,6 @@ export default function JobPostingCreatePage() {
         <Toast
           message={jobPostingToastMessage}
           variant="warning"
-          showStatusIcon={jobPostingToastMessage !== "공고 분석을 중단했습니다."}
           onClose={() => setJobPostingToastMessage(null)}
           className="!right-7 !bottom-7 !max-w-none !rounded-card"
         />
diff --git a/jobdri/src/app/mockApply/job/review/page.tsx b/jobdri/src/app/mockApply/job/review/page.tsx
index 03a45c2..f77bcb6 100644
--- a/jobdri/src/app/mockApply/job/review/page.tsx
+++ b/jobdri/src/app/mockApply/job/review/page.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { useMemo, useState, type ReactNode } from "react";
+import { useMemo, useState, type MouseEvent, type ReactNode } from "react";
 import { useRouter } from "next/navigation";
 import Header from "@/components/common/header/Header";
 import SideHeaderContainer from "@/components/common/header/SideHeaderContainer";
@@ -97,6 +97,10 @@ export default function JobPostingReviewPage() {
 
     return trimmedCompanyName.length > 0 ? trimmedCompanyName[0] : "T";
   }, [companyName]);
+  const handleHomeClick = (event: MouseEvent<HTMLButtonElement>) => {
+    event.preventDefault();
+    setShowHomeConfirm(true);
+  };
 
   return (
     <div className="h-dvh w-dvw overflow-hidden bg-line-neutral-assistive">
@@ -110,7 +114,7 @@ export default function JobPostingReviewPage() {
           lastSavedAt="17:00"
           homeAction={{
             label: "홈으로",
-            onClick: () => setShowHomeConfirm(true),
+            onClick: handleHomeClick,
           }}
           className="min-w-[1100px] max-w-none shrink-0 self-stretch"
         />