diff --git a/apps/nowait-user/src/assets/icon/Add.svg b/apps/nowait-user/src/assets/icon/Add.svg
new file mode 100644
index 00000000..652ef0d5
--- /dev/null
+++ b/apps/nowait-user/src/assets/icon/Add.svg
@@ -0,0 +1,8 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<mask id="mask0_778_4133" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="20" height="20">
+<rect width="20" height="20" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_778_4133)">
+<path d="M9.66667 11.5556H4.94444C4.67685 11.5556 4.45255 11.465 4.27153 11.284C4.09051 11.103 4 10.8787 4 10.6111C4 10.3435 4.09051 10.1192 4.27153 9.93819C4.45255 9.75718 4.67685 9.66667 4.94444 9.66667H9.66667V4.94444C9.66667 4.67685 9.75718 4.45255 9.93819 4.27153C10.1192 4.09051 10.3435 4 10.6111 4C10.8787 4 11.103 4.09051 11.284 4.27153C11.465 4.45255 11.5556 4.67685 11.5556 4.94444V9.66667H16.2778C16.5454 9.66667 16.7697 9.75718 16.9507 9.93819C17.1317 10.1192 17.2222 10.3435 17.2222 10.6111C17.2222 10.8787 17.1317 11.103 16.9507 11.284C16.7697 11.465 16.5454 11.5556 16.2778 11.5556H11.5556V16.2778C11.5556 16.5454 11.465 16.7697 11.284 16.9507C11.103 17.1317 10.8787 17.2222 10.6111 17.2222C10.3435 17.2222 10.1192 17.1317 9.93819 16.9507C9.75718 16.7697 9.66667 16.5454 9.66667 16.2778V11.5556Z" fill="currentColor"/>
+</g>
+</svg>
diff --git a/apps/nowait-user/src/components/common/QuantitySelector.tsx b/apps/nowait-user/src/components/common/QuantitySelector.tsx
index b56e428e..ba504803 100644
--- a/apps/nowait-user/src/components/common/QuantitySelector.tsx
+++ b/apps/nowait-user/src/components/common/QuantitySelector.tsx
@@ -11,31 +11,34 @@ interface storeProps {
   mode: "store";
   id: string;
   quantity: number;
-  increaseQuantity: (id: string) => void;
-  decreaseQuantity: (id: string) => void;
+  price: number;
+  increaseQuantity: (id: string, price: number) => void;
+  decreaseQuantity: (id: string, price: number) => void;
 }
 type PropsType = stateProps | storeProps;
 
 const QuantitySelector = (props: PropsType) => {
   const increaseQuantityButton = () => {
     if (props.mode === "store") {
-      props.increaseQuantity(props.id);
+      props.increaseQuantity(props.id, props.price);
     } else if (props.mode === "state") {
-      props.setQuantity((prev) => prev + 1);
+      props.setQuantity(props.quantity + 1);
     }
   };
   const decreaseQuantityButton = () => {
     if (props.mode === "store") {
-      props.decreaseQuantity(props.id);
+      props.decreaseQuantity(props.id, props.price);
     } else if (props.mode === "state") {
-      props.setQuantity((prev) => prev - 1);
+      props.setQuantity(props.quantity - 1);
     }
   };
 
   return (
     <div className="flex items-center justify-end gap-0.5">
       <button
-        className={`bg-[#F2F6F9] rounded-[7px] w-[28px] h-[28px] flex items-center justify-center ${props.quantity === 1 ? "bg-[#e6e8eb]" :"bg-[#F2F6F9]"}`}
+        className={`bg-[#F2F6F9] rounded-[7px] w-[28px] h-[28px] flex items-center justify-center ${
+          props.quantity === 1 ? "bg-[#e6e8eb]" : "bg-[#F2F6F9]"
+        }`}
         disabled={props.quantity === 1}
         onClick={decreaseQuantityButton}
       >
diff --git a/apps/nowait-user/src/components/common/SuccessMessagePage.tsx b/apps/nowait-user/src/components/common/SuccessMessagePage.tsx
index b23f0866..3e6a6fe2 100644
--- a/apps/nowait-user/src/components/common/SuccessMessagePage.tsx
+++ b/apps/nowait-user/src/components/common/SuccessMessagePage.tsx
@@ -1,4 +1,3 @@
-import React from "react";
 import PageFooterButton from "../order/PageFooterButton";
 import { Button } from "@repo/ui";
 
@@ -20,8 +19,8 @@ const SuccessMessagePage = ({
   buttonText,
 }: PropsType) => {
   return (
-    <div className="flex min-h-full">
-      <div className="flex-1 flex flex-col justify-center items-center text-center">
+    <div>
+      <div className="min-h-screen flex flex-col justify-center items-center text-center">
         <img
           className="mb-2.5 w-[210px] h-[210px] bg-amber-300"
           src={imageSrc}
diff --git a/apps/nowait-user/src/components/order/EmptyCart.tsx b/apps/nowait-user/src/components/order/EmptyCart.tsx
new file mode 100644
index 00000000..b6934836
--- /dev/null
+++ b/apps/nowait-user/src/components/order/EmptyCart.tsx
@@ -0,0 +1,26 @@
+import { useNavigate } from "react-router-dom";
+import Add from "../../assets/icon/Add.svg?react";
+
+const EmptyCart = () => {
+  const navigate = useNavigate();
+  return (
+    <div className="min-h-screen flex flex-col justify-center items-center">
+      <h1 className="text-16-regular text-black-70 mb-5 text-center">
+        아직 담긴 메뉴가 없어요.
+        <br />
+        마음에 드는 메뉴를 담아주세요!
+      </h1>
+      <button
+        type="button"
+        aria-label="메뉴 추가"
+        className="flex justify-center items-center gap-1 py-2 px-4 rounded-[12px] border border-[#ececec] text-black-70"
+        onClick={() => navigate("/:storeId")}
+      >
+        <span className="text-[14px] font-bold">추가하기</span>
+        <Add className="w-4 h-4" fill="currentColor" />
+      </button>
+    </div>
+  );
+};
+
+export default EmptyCart;
diff --git a/apps/nowait-user/src/components/order/MenuItem.tsx b/apps/nowait-user/src/components/order/MenuItem.tsx
index 7c16d39d..9eddd8db 100644
--- a/apps/nowait-user/src/components/order/MenuItem.tsx
+++ b/apps/nowait-user/src/components/order/MenuItem.tsx
@@ -1,4 +1,3 @@
-import React, { useState } from "react";
 import QuantitySelector from "../common/QuantitySelector";
 import close from "../../assets/icon/close.svg";
 import { useCartStore } from "../../stores/cartStore";
@@ -30,6 +29,7 @@ const MenuItem = ({ id, name, price, quantity }: PropsType) => {
           mode="store"
           id={id}
           quantity={quantity}
+          price={price / quantity}
           increaseQuantity={increaseQuantity}
           decreaseQuantity={decreaseQuantity}
         />
diff --git a/apps/nowait-user/src/components/order/PageFooterButton.tsx b/apps/nowait-user/src/components/order/PageFooterButton.tsx
index 635ed496..6e4e90a2 100644
--- a/apps/nowait-user/src/components/order/PageFooterButton.tsx
+++ b/apps/nowait-user/src/components/order/PageFooterButton.tsx
@@ -8,10 +8,8 @@ const PageFooterButton = ({
   className?: string;
 }) => {
   return (
-    <footer className=" bg-white sticky bottom-0">
-      <div className={`flex justify-center py-8 px-5 ${className}`}>
-        {children}
-      </div>
+    <footer className="bg-white sticky bottom-0 w-full">
+      <div className="flex justify-center py-8 px-5">{children}</div>
     </footer>
   );
 };
diff --git a/apps/nowait-user/src/pages/order/AddMenuPage.tsx b/apps/nowait-user/src/pages/order/AddMenuPage.tsx
index 7a5e980c..3f0f96cb 100644
--- a/apps/nowait-user/src/pages/order/AddMenuPage.tsx
+++ b/apps/nowait-user/src/pages/order/AddMenuPage.tsx
@@ -11,7 +11,7 @@ const AddMenuPage = () => {
   const navigate = useNavigate();
   const { id, image, name, description, price } = location.state;
   const [quantity, setQuantity] = useState(1);
-  const { cart, addToCart } = useCartStore();
+  const { addToCart } = useCartStore();
 
   const addToCartButton = () => {
     const item: CartItem = {
@@ -24,8 +24,8 @@ const AddMenuPage = () => {
     navigate(-1);
   };
   return (
-    <div>
-      <div className="px-5">
+    <div className="flex flex-col h-screen">
+      <div className="flex-1 overflow-y-auto px-5">
         <h1 className="-mx-5 h-[375px] bg-amber-400">
           <img className="w-full" src={image} alt="음식 메뉴 이미지" />
         </h1>
@@ -33,8 +33,10 @@ const AddMenuPage = () => {
           <h1 className="text-[24px] font-semibold">{name}</h1>
           <h2>{description}</h2>
         </div>
-        <div className="flex justify-between items-center -mx-5 sticky left-0 bottom-[124px] bg-white px-5">
-          <h1 className="text-[26px] font-semibold">
+      </div>
+      <div className="w-full -mx-5 sticky left-0 bottom-[124px] bg-white">
+        <div className="flex justify-between items-center px-5">
+          <h1 className="text-[24px] font-semibold">
             {(price * quantity).toLocaleString()}원
           </h1>
           <QuantitySelector
diff --git a/apps/nowait-user/src/pages/order/OrderListPage.tsx b/apps/nowait-user/src/pages/order/OrderListPage.tsx
index f919970c..38626fe2 100644
--- a/apps/nowait-user/src/pages/order/OrderListPage.tsx
+++ b/apps/nowait-user/src/pages/order/OrderListPage.tsx
@@ -1,19 +1,50 @@
 import MenuItem from "../../components/order/MenuItem";
 import PageFooterButton from "../../components/order/PageFooterButton";
 import { Button } from "@repo/ui";
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
 import TotalButton from "../../components/order/TotalButton";
 import { useCartStore } from "../../stores/cartStore";
+import EmptyCart from "../../components/order/EmptyCart";
+import { sumTotalPrice } from "../../utils/sumUtils";
+import axios from "axios";
+import { getTableId } from "../../utils/cartStorage";
 
 const OrderListPage = () => {
   const navigate = useNavigate();
-  const orderHandleButton = () => {};
+  const { storeId } = useParams();
+  console.log(storeId);
+  const tableId = getTableId();
+  console.log(tableId, "테이블아이디");
   const { cart } = useCartStore();
 
+  const SERVER_URI = import.meta.env.VITE_SERVER_URI;
+
+  const orderHandleButton = async () => {
+    try {
+      const payload = {
+        tableId: Number(tableId),
+        items: cart.map((item) => ({
+          menuId: Number(item.id),
+          quantity: item.quantity,
+        })),
+      };
+      const url = `${SERVER_URI}/orders/create/${Number(storeId)}/${Number(tableId)}`;
+      console.log("요청 주소:", url);
+      await axios.post(url, payload);
+      navigate(`/${storeId}/remittance/request`, {
+        state: sumTotalPrice(cart),
+      });
+    } catch (e) {
+      console.log(e);
+    }
+  };
+
+  if (cart.length === 0) return <EmptyCart />;
+
   return (
-    <div>
-      <div className="pt-8 pb-24 px-5">
-        <h1 className="text-headline-24-bold mb-5">총 주문 3건</h1>
+    <div className="flex flex-col min-h-[100dvh]">
+      <div className="flex-1 overflow-y-auto pt-7 px-5">
+        <h1 className="text-headline-24-bold mb-5">총 주문 {cart.length}건</h1>
         <ul>
           {cart.map((item) => {
             return (
diff --git a/apps/nowait-user/src/pages/order/OrderSuccessPage.tsx b/apps/nowait-user/src/pages/order/OrderSuccessPage.tsx
index d981b315..9f2ded85 100644
--- a/apps/nowait-user/src/pages/order/OrderSuccessPage.tsx
+++ b/apps/nowait-user/src/pages/order/OrderSuccessPage.tsx
@@ -1,4 +1,3 @@
-import React from "react";
 import { useNavigate } from "react-router-dom";
 import SuccessMessagePage from "../../components/common/SuccessMessagePage";
 
diff --git a/apps/nowait-user/src/pages/order/PayerNameInput.tsx b/apps/nowait-user/src/pages/order/PayerNameInput.tsx
new file mode 100644
index 00000000..ff0060ba
--- /dev/null
+++ b/apps/nowait-user/src/pages/order/PayerNameInput.tsx
@@ -0,0 +1,51 @@
+import { useState } from "react";
+import { Button } from "@repo/ui";
+import PageFooterButton from "../../components/order/PageFooterButton";
+import { useNavigate, useParams } from "react-router-dom";
+
+const PayerNameInput = () => {
+  const [payer, setPayer] = useState("");
+  const navigate = useNavigate();
+  const { storeId } = useParams();
+
+  const handlePayerSubmit = () => {
+    navigate(`/${storeId}/order/success`);
+  };
+
+  return (
+    <div className="flex flex-col h-[100dvh]">
+      <div className="flex-1 flex flex-col justify-center items-center text-center px-5 overflow-hidden">
+        <div className="mb-7.5">
+          <h1 className="text-headline-24-bold mb-2.5">
+            정확한 결제 확인을 위해
+            <br />
+            입금자명을 입력해주세요
+          </h1>
+          <h2 className="text-16-regular text-black-70">
+            한 번만 입력하면 이후 주문에도 적용 돼요.
+          </h2>
+        </div>
+        <input
+          className="w-full text-title-20-semibold border-2 border-[#ececec] rounded-[12px] placeholder-[#aaa] text-center p-5 outline-none text-black-90"
+          placeholder="입금자명"
+          value={payer}
+          onChange={(e) => setPayer(e.target.value)}
+        />
+      </div>
+      <PageFooterButton>
+        <Button
+          onClick={handlePayerSubmit}
+          backgroundColor={
+            payer.trim() === "" ? "var(--black-25)" : "var(--navy-100)"
+          }
+          textColor={payer.trim() === "" ? "var(--black-55)" : "white"}
+          disabled={payer.trim() === ""}
+        >
+          다음
+        </Button>
+      </PageFooterButton>
+    </div>
+  );
+};
+
+export default PayerNameInput;
diff --git a/apps/nowait-user/src/pages/order/RedirectToStorePage.tsx b/apps/nowait-user/src/pages/order/RedirectToStorePage.tsx
index f2939673..815c21c7 100644
--- a/apps/nowait-user/src/pages/order/RedirectToStorePage.tsx
+++ b/apps/nowait-user/src/pages/order/RedirectToStorePage.tsx
@@ -9,7 +9,7 @@ const RedirectToStorePage = () => {
     if (storeId && tableId) {
       //테이블 아이디 로컬스토리지 저장(다른 방법 생각)
       localStorage.setItem("tableId", tableId);
-      navigate(`/${storeId}?table=${tableId}`, { replace: true });
+      navigate(`/${storeId}`, { replace: true });
     }
   }, [storeId, tableId, navigate]);
 
diff --git a/apps/nowait-user/src/pages/order/RemittanceRequestPage.tsx b/apps/nowait-user/src/pages/order/RemittanceRequestPage.tsx
index 8ca15fa4..3cbec658 100644
--- a/apps/nowait-user/src/pages/order/RemittanceRequestPage.tsx
+++ b/apps/nowait-user/src/pages/order/RemittanceRequestPage.tsx
@@ -1,19 +1,22 @@
-import React, { useState } from "react";
+import { useState } from "react";
 import PageFooterButton from "../../components/order/PageFooterButton";
 import { Button } from "@repo/ui";
 import copy from "../../assets/icon/copy.svg";
 import useThrottle from "../../hooks/useThrottle";
 import Toast from "../../components/order/Toast";
 import useModal from "../../hooks/useModal";
-import { useNavigate } from "react-router-dom";
+import { useLocation, useNavigate, useParams } from "react-router-dom";
 import ConfirmModal from "../../components/order/ConfirmModal";
 
 const RemittanceRequestPage = () => {
   const [showToast, setShowToast] = useState(false);
-  const account = "기업은행 611-000202-01-010";
-  const clipBoardDelay = 3000;
+
   const navigate = useNavigate();
+  const { storeId } = useParams();
   const modal = useModal();
+  const price = useLocation().state;
+  const account = "기업은행 611-000202-01-010";
+  const clipBoardDelay = 3000;
 
   const handleCopyClipBoard = useThrottle(() => {
     navigator.clipboard.writeText(account);
@@ -22,8 +25,8 @@ const RemittanceRequestPage = () => {
   }, clipBoardDelay);
 
   return (
-    <div className="flex min-h-full">
-      <div className="px-5 flex-1 flex flex-col justify-center items-center">
+    <div>
+      <div className="min-h-screen px-5 flex flex-col justify-center items-center">
         <div className="mb-6 text-center">
           <h1 className="text-headline-24-bold mb-2.5">
             주문을 위해 이체해 주세요
@@ -44,14 +47,17 @@ const RemittanceRequestPage = () => {
             </p>
             <img src={copy} alt="복사 아이콘" />
           </button>
-          <p className="text-headline-24-bold">23,800원</p>
+          <p className="text-headline-24-bold">{price}원</p>
         </div>
       </div>
       <div className="fixed left-1/2 bottom-[124px] -translate-x-1/2 z-50">
         {showToast && <Toast message="계좌번호가 복사되었습니다" />}
       </div>
       {modal.isOpen && (
-        <ConfirmModal open={() => navigate("/")} close={modal.close} />
+        <ConfirmModal
+          open={() => navigate(`/${storeId}/payer`)}
+          close={modal.close}
+        />
       )}
       <PageFooterButton>
         <Button onClick={() => modal.open()}>다음</Button>
diff --git a/apps/nowait-user/src/pages/order/StorePage.tsx b/apps/nowait-user/src/pages/order/StorePage.tsx
index cfdc25bc..8112debf 100644
--- a/apps/nowait-user/src/pages/order/StorePage.tsx
+++ b/apps/nowait-user/src/pages/order/StorePage.tsx
@@ -1,17 +1,20 @@
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useParams } from "react-router-dom";
+import type { MenuType } from "../../types/order/menu";
 import PageFooterButton from "../../components/order/PageFooterButton";
 import { Button } from "@repo/ui";
 import TotalButton from "../../components/order/TotalButton";
 import { useCartStore } from "../../stores/cartStore";
 import MenuList from "../../components/MenuList";
 
+
 const StorePage = () => {
   const navigate = useNavigate();
+  const { storeId } = useParams();
   const { cart } = useCartStore();
 
   return (
-    <div>
-      <div className="mt-8 pb-[124px]">
+    <div className="flex flex-col h-screen">
+      <div className="flex-1 overflow-y-auto mt-7.5 px-5">
         <div className="flex justify-between items-start mb-12">
           <div>
             <h1 className="text-headline-24-bold">스페이시스</h1>
@@ -28,7 +31,7 @@ const StorePage = () => {
       </div>
       {cart && cart.length > 0 && (
         <PageFooterButton>
-          <Button textColor="white" onClick={() => navigate("/:storeId/order")}>
+          <Button textColor="white" onClick={() => navigate(`/${storeId}/order`)}>
             <TotalButton />
           </Button>
         </PageFooterButton>
diff --git a/apps/nowait-user/src/routes/Router.tsx b/apps/nowait-user/src/routes/Router.tsx
index c0b755c7..7a01fed5 100644
--- a/apps/nowait-user/src/routes/Router.tsx
+++ b/apps/nowait-user/src/routes/Router.tsx
@@ -13,6 +13,7 @@ import StoreReservePage from "../pages/reserve/StoreReservePage";
 import LoginPage from "../pages/login/LoginPage";
 import KakaoRedirectHandler from "../pages/login/KakaoRedirectHandler";
 import AuthGuard from "../components/AuthGuard";
+import PayerNameInput from "../pages/order/PayerNameInput";
 
 // AuthGuard로 래핑하는 헬퍼 함수
 const withAuth = (Component: React.ComponentType) => (
@@ -47,6 +48,11 @@ const Router = () => {
         path="/:storeId/remittance/request"
         element={<RemittanceRequestPage />}
       />
+      <Route
+        path="/:storeId/payer"
+        element={<PayerNameInput />}
+      />
+      <Route path="/:storeId/order/success" element={<OrderSuccessPage />} />
 
       {/* 보호된 라우트 - 인증 필요 */}
       <Route
diff --git a/apps/nowait-user/src/stores/cartStore.ts b/apps/nowait-user/src/stores/cartStore.ts
index 2a854092..700d9fd5 100644
--- a/apps/nowait-user/src/stores/cartStore.ts
+++ b/apps/nowait-user/src/stores/cartStore.ts
@@ -4,8 +4,8 @@ import { persist } from "zustand/middleware";
 
 interface CartState {
   cart: CartItem[];
-  increaseQuantity: (id: string) => void;
-  decreaseQuantity: (id: string) => void;
+  increaseQuantity: (id: string, price: number) => void;
+  decreaseQuantity: (id: string, price: number) => void;
   addToCart: (item: CartItem) => void;
   removeFromCart: (id: string) => void;
   clearCart: () => void;
@@ -15,19 +15,27 @@ export const useCartStore = create<CartState>()(
   persist(
     (set) => ({
       cart: [],
-      increaseQuantity: (id) =>
+      increaseQuantity: (id, price) =>
         set(({ cart }) => ({
           cart: cart.map((item) => {
             return item.id === id
-              ? { ...item, quantity: item.quantity + 1 }
+              ? {
+                  ...item,
+                  quantity: item.quantity + 1,
+                  price: item.price + price,
+                }
               : item;
           }),
         })),
-      decreaseQuantity: (id) =>
+      decreaseQuantity: (id, price) =>
         set(({ cart }) => ({
           cart: cart.map((item) => {
             return item.id === id
-              ? { ...item, quantity: item.quantity - 1 }
+              ? {
+                  ...item,
+                  quantity: item.quantity - 1,
+                  price: item.price - price,
+                }
               : item;
           }),
         })),
diff --git a/apps/nowait-user/src/utils/cartStorage.ts b/apps/nowait-user/src/utils/cartStorage.ts
index 32ab7af6..51c58929 100644
--- a/apps/nowait-user/src/utils/cartStorage.ts
+++ b/apps/nowait-user/src/utils/cartStorage.ts
@@ -2,6 +2,11 @@ import type { CartItem } from "../types/order/cart";
 
 const CART_KEY = "cart";
 
+export const getTableId = (): string => {
+  const tableId = localStorage.getItem("tableId");
+  return tableId || "";
+};
+
 export const getcart = (): CartItem[] => {
   const cartString = localStorage.getItem(CART_KEY);
   try {
diff --git a/apps/nowait-user/src/utils/sumUtils.ts b/apps/nowait-user/src/utils/sumUtils.ts
index 77597412..3294ffde 100644
--- a/apps/nowait-user/src/utils/sumUtils.ts
+++ b/apps/nowait-user/src/utils/sumUtils.ts
@@ -9,7 +9,7 @@ export const sumQuantity = <T, K extends keyof T>(
 
 export const sumTotalPrice = (items: CartItem[]) => {
   const totalPrice = items.reduce(
-    (acc, cur) => acc + cur.quantity * cur.price,
+    (acc, cur) => acc + cur.price,
     0
   );
   return totalPrice.toLocaleString();