diff --git a/lps-admin/src/components/Layout.tsx b/lps-admin/src/components/Layout.tsx
index dd6d192..5f9e76d 100644
--- a/lps-admin/src/components/Layout.tsx
+++ b/lps-admin/src/components/Layout.tsx
@@ -17,24 +17,31 @@ export default function Layout() {
   const health = useQuery({ queryKey: ["healthz"], queryFn: healthz, refetchInterval: 10_000 });
   const up = health.data === true;
   return (
-    <div className="mx-auto flex min-h-screen max-w-[1280px]">
-      <aside className="w-[196px] shrink-0 border-r border-line-200 px-3 py-5">
-        <div className="mb-6 flex items-center gap-2.5 px-2">
-          <span className="grid h-8 w-8 place-items-center rounded-lg bg-gradient-to-br from-primary-600 to-[#8b7bff] text-[14px] font-extrabold text-white">L</span>
-          <div>
-            <div className="text-[14px] font-bold leading-tight">LPS 관리자</div>
-            <div className="text-[10.5px] font-medium text-ink-400">인터넷 최저가 검색</div>
+    <div className="mx-auto flex min-h-screen max-w-[1280px] flex-col md:flex-row">
+      {/* 모바일(<md): 상단 바 + 가로 스크롤 네비(터치 44px). md 이상: 좌측 고정 사이드바. */}
+      <aside className="w-full shrink-0 border-b border-line-200 px-3 py-3 md:w-[196px] md:border-b-0 md:border-r md:py-5">
+        <div className="flex items-center justify-between md:block">
+          <div className="flex items-center gap-2.5 px-2 md:mb-6">
+            <span className="grid h-8 w-8 place-items-center rounded-lg bg-gradient-to-br from-primary-600 to-primary-400 text-[14px] font-extrabold text-white">L</span>
+            <div>
+              <div className="text-[14px] font-bold leading-tight">LPS 관리자</div>
+              <div className="text-[10.5px] font-medium text-ink-400">인터넷 최저가 검색</div>
+            </div>
+          </div>
+          <div className="flex items-center gap-2 px-2 text-[11.5px] font-semibold text-ink-500 md:hidden">
+            <span className={`h-2 w-2 rounded-full ${up ? "bg-ok-600" : "bg-dead-600"}`} aria-hidden />
+            {up ? "연결됨" : "연결 안 됨"}
           </div>
         </div>
-        <nav aria-label="주 메뉴">
-          <ul className="space-y-0.5">
+        <nav aria-label="주 메뉴" className="mt-2 md:mt-0">
+          <ul className="flex gap-1 overflow-x-auto md:flex-col md:gap-0 md:space-y-0.5">
             {MENU.map((m) => (
-              <li key={m.to}>
+              <li key={m.to} className="shrink-0">
                 <NavLink
                   to={m.to}
                   end={m.end}
                   className={({ isActive }) =>
-                    `block rounded-lg px-3 py-2 text-[13px] font-semibold transition-colors ${
+                    `flex min-h-[44px] items-center rounded-lg px-3 text-[13px] font-semibold transition-colors md:min-h-0 md:py-2 ${
                       isActive ? "bg-primary-50 text-primary-700" : "text-ink-700 hover:bg-surface-2"
                     }`
                   }
@@ -45,7 +52,7 @@ export default function Layout() {
             ))}
           </ul>
         </nav>
-        <div className="mt-8 flex items-center gap-2 px-3 text-[11.5px] font-semibold text-ink-500">
+        <div className="mt-8 hidden items-center gap-2 px-3 text-[11.5px] font-semibold text-ink-500 md:flex">
           <span
             className={`h-2 w-2 rounded-full ${up ? "bg-ok-600" : "bg-dead-600"}`}
             aria-hidden
@@ -53,7 +60,7 @@ export default function Layout() {
           {up ? "API 연결됨" : "API 연결 안 됨"}
         </div>
       </aside>
-      <main className="min-w-0 flex-1 px-6 py-5">
+      <main className="min-w-0 flex-1 px-4 py-4 md:px-6 md:py-5">
         <Outlet />
       </main>
     </div>
diff --git a/lps-admin/src/index.css b/lps-admin/src/index.css
index 90d70e7..e48535d 100644
--- a/lps-admin/src/index.css
+++ b/lps-admin/src/index.css
@@ -17,6 +17,7 @@
 
   --color-primary-700: #4338ca;
   --color-primary-600: #4f46e5;
+  --color-primary-400: #8b7bff;
   --color-primary-100: #e5e4fb;
   --color-primary-50: #eef0ff;