diff --git a/apps/frontend/src/components/CropMarket/AskingPrice.tsx b/apps/frontend/src/components/CropMarket/AskingPrice.tsx
index b0f39ce..a143d12 100644
--- a/apps/frontend/src/components/CropMarket/AskingPrice.tsx
+++ b/apps/frontend/src/components/CropMarket/AskingPrice.tsx
@@ -1,3 +1,5 @@
+import { useEffect, useRef } from 'react';
+
 interface AskingPriceProps {
   validCropName: string;
   marketData: {
@@ -8,52 +10,81 @@ interface AskingPriceProps {
 }
 
 const AskingPrice: React.FC<AskingPriceProps> = ({ validCropName, marketData }) => {
+  const containerRef = useRef<HTMLDivElement>(null);
+
+  useEffect(() => {
+    if (containerRef.current) {
+      containerRef.current.scrollTop =
+        containerRef.current.scrollHeight / 2 - containerRef.current.clientHeight / 2;
+    }
+  }, [marketData.sellOrders, marketData.buyOrders]);
+
   if (!validCropName) {
     return <div>작물 정보가 없습니다.</div>;
   }
 
+  const maxItems = 4;
+  const emptyOrder = { price: 0, quantity: 0 };
+
+  const sellOrdersToDisplay = [
+    ...new Array(Math.max(0, maxItems - marketData.sellOrders.length)).fill(emptyOrder),
+    ...marketData.sellOrders.sort((a, b) => b.price - a.price).slice(0, maxItems)
+  ];
+
+  const buyOrdersToDisplay = [
+    ...marketData.buyOrders.sort((a, b) => b.price - a.price).slice(0, maxItems),
+    ...new Array(Math.max(0, maxItems - marketData.buyOrders.length)).fill(emptyOrder)
+  ];
+
   return (
-    <div className="w-full h-full md:text-xs lg:text-xs xl:text-sm">
-      <div className="grid grid-cols-[1fr_1fr_1fr] gap-1 font-semibold bg-gray-800 px-1">
+    <div className="w-full h-full md:text-xs lg:text-xs xl:text-sm flex flex-col">
+      <div className="grid grid-cols-[1fr_1fr_1fr] gap-1 font-semibold px-1">
         <div className="text-center">구분</div>
         <div className="text-center">가격</div>
         <div className="text-center">수량</div>
       </div>
-      <div className="md:h-24 lg:h-26 xl:h-28 overflow-y-auto scrollbar-hidden">
-        {marketData.sellOrders
-          .sort((a, b) => b.price - a.price)
-          .map((order, idx) => (
-            <div
-              key={idx}
-              className={`relative grid grid-cols-[1fr_1fr_1fr] gap-1 py-1 px-1 items-center ${
-                order.price === marketData.nowPrice ? 'border border-black' : ''
-              }`}
-            >
-              {order.price === marketData.nowPrice && (
-                <div className="absolute top-1/2 transform -translate-y-1/2 scale-x-[-1] w-0 h-0 border-t-[6px] border-t-transparent border-b-[6px] border-b-transparent border-r-[6px] border-r-black"></div>
-              )}
-              <div className="text-center">팔아요</div>
-              <div className="text-center">￦ {order.price}</div>
-              <div className="font-bold text-center text-blue-600">{order.quantity}</div>
+      <div ref={containerRef} className="md:h-24 lg:h-26 xl:h-28 overflow-y-auto scrollbar-hidden">
+        {sellOrdersToDisplay.map((order, idx) => (
+          <div
+            key={idx}
+            className={`relative grid grid-cols-[1fr_1fr_1fr] gap-1 py-1 px-1 items-center ${
+              order.price === marketData.nowPrice && order.price !== 0 ? 'border border-black' : ''
+            }`}
+          >
+            {order.price === marketData.nowPrice && order.price !== 0 && (
+              <div className="absolute top-1/2 transform -translate-y-1/2 scale-x-[-1] w-0 h-0 border-t-[6px] border-t-transparent border-b-[6px] border-b-transparent border-r-[6px] border-r-black"></div>
+            )}
+            <div className="text-center">{order.price > 0 ? '팔아요' : '\u00A0'}</div>
+            <div className="text-center">
+              {order.price > 0 ? `￦ ${order.price.toLocaleString()}` : '\u00A0'}
+            </div>
+            <div className="font-bold text-center text-blue-600">
+              {order.quantity > 0 ? order.quantity.toLocaleString() : '\u00A0'}
+            </div>
+          </div>
+        ))}
+        {(marketData.sellOrders.length > 0 || marketData.buyOrders.length > 0) && (
+          <hr className="bg-black h-[1px] border-none" />
+        )}
+        {buyOrdersToDisplay.map((order, idx) => (
+          <div
+            key={idx}
+            className={`relative grid grid-cols-[1fr_1fr_1fr] gap-1 py-1 px-1 items-center ${
+              order.price === marketData.nowPrice && order.price !== 0 ? 'border border-black' : ''
+            }`}
+          >
+            {order.price === marketData.nowPrice && order.price !== 0 && (
+              <div className="absolute top-1/2 transform -translate-y-1/2 scale-x-[-1] w-0 h-0 border-t-[6px] border-t-transparent border-b-[6px] border-b-transparent border-r-[6px] border-r-black"></div>
+            )}
+            <div className="text-center">{order.price > 0 ? '살게요' : '\u00A0'}</div>
+            <div className="text-center">
+              {order.price > 0 ? `￦ ${order.price.toLocaleString()}` : '\u00A0'}
             </div>
-          ))}
-        {marketData.buyOrders
-          .sort((a, b) => b.price - a.price)
-          .map((order, idx) => (
-            <div
-              key={idx}
-              className={`relative grid grid-cols-[1fr_1fr_1fr] gap-1 py-1 px-1 items-center ${
-                order.price === marketData.nowPrice ? 'border border-black' : ''
-              }`}
-            >
-              {order.price === marketData.nowPrice && (
-                <div className="absolute top-1/2 transform -translate-y-1/2 scale-x-[-1] w-0 h-0 border-t-[6px] border-t-transparent border-b-[6px] border-b-transparent border-r-[6px] border-r-black"></div>
-              )}
-              <div className="text-center">살게요</div>
-              <div className="text-center">￦ {order.price}</div>
-              <div className="font-bold text-center text-red-500">{order.quantity}</div>
+            <div className="font-bold text-center text-red-500">
+              {order.quantity > 0 ? order.quantity.toLocaleString() : '\u00A0'}
             </div>
-          ))}
+          </div>
+        ))}
       </div>
     </div>
   );
diff --git a/apps/frontend/src/components/CropMarket/OwnCrop.tsx b/apps/frontend/src/components/CropMarket/OwnCrop.tsx
index 0e009b0..bdbcf29 100644
--- a/apps/frontend/src/components/CropMarket/OwnCrop.tsx
+++ b/apps/frontend/src/components/CropMarket/OwnCrop.tsx
@@ -31,8 +31,8 @@ const OwnCrop: React.FC<OwnCropProps> = ({ ownCrop, cropNameList, nowPrice }) =>
               return (
                 <tr key={cropId}>
                   <td>{cropDisplayName}</td>
-                  <td>{totalQuantity}</td>
-                  <td>￦ {price * totalQuantity}</td>
+                  <td>{totalQuantity.toLocaleString()}</td>
+                  <td>￦ {(price * totalQuantity).toLocaleString()}</td>
                 </tr>
               );
             })}
diff --git a/apps/frontend/src/components/CropMarket/Pending.tsx b/apps/frontend/src/components/CropMarket/Pending.tsx
index 4e054c0..2eb46be 100644
--- a/apps/frontend/src/components/CropMarket/Pending.tsx
+++ b/apps/frontend/src/components/CropMarket/Pending.tsx
@@ -43,7 +43,9 @@ const Pending: React.FC<PendingProps> = ({ cropNameList }) => {
     fetchPending();
   }, []);
 
-  const handleCancel = async (order: MergedPendingData) => {
+  const handleCancel = async (e: React.MouseEvent<HTMLButtonElement>, order: MergedPendingData) => {
+    e.currentTarget.blur();
+
     try {
       const data = {
         cropId: order.cropId,
@@ -89,7 +91,7 @@ const Pending: React.FC<PendingProps> = ({ cropNameList }) => {
         <div>{error}</div>
       ) : (
         <>
-          <div className="grid grid-cols-[1.2fr_2fr_1fr_1fr_auto] gap-1 font-semibold bg-gray-800 py-1 px-1">
+          <div className="grid grid-cols-[1.2fr_2fr_1fr_1fr_auto] gap-1 font-semibold py-1 px-1">
             <div className="text-center">작물명</div>
             <div className="text-center">주문시간</div>
             <div className="text-center">수량</div>
@@ -105,12 +107,14 @@ const Pending: React.FC<PendingProps> = ({ cropNameList }) => {
               >
                 <div className="text-center">{cropList[pending.cropName]}</div>
                 <div className="text-center">{formatDate(pending.time)}</div>
-                <div className="text-center">{pending.quantity}</div>
+                <div className="text-center">{pending.unfilledQuantity.toLocaleString()}</div>
                 <div className="text-center">{pending.price.toLocaleString()}</div>
                 <div className="text-center">
                   <button
-                    className="px-1 bg-green-500 text-white rounded text-[9px]"
-                    onClick={() => handleCancel(pending)}
+                    className={`px-1 rounded text-[9px] ${
+                      pending.orderType === 'buy' ? 'bg-red-500' : 'bg-blue-500'
+                    } text-white`}
+                    onClick={e => handleCancel(e, pending)}
                   >
                     취소
                   </button>
diff --git a/apps/frontend/src/components/CropMarket/Trade.tsx b/apps/frontend/src/components/CropMarket/Trade.tsx
index bf44cd1..992209a 100644
--- a/apps/frontend/src/components/CropMarket/Trade.tsx
+++ b/apps/frontend/src/components/CropMarket/Trade.tsx
@@ -1,6 +1,6 @@
-import { CropData } from '@/types/Crop';
+import { CropData, OwnCropData } from '@/types/Crop';
 import { useUser } from '../public/UserContext';
-import { useContext, useState } from 'react';
+import { useContext, useEffect, useState } from 'react';
 import { AlertContext } from '@/components/public/AlertContext';
 import {
   postLimitBuyOrder,
@@ -15,119 +15,142 @@ interface TradeProps {
   currentCrop: number;
   cropNameList: CropData[];
   setOrderType: (order: string) => void;
+  ownCrop: OwnCropData[];
 }
 
-const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList, setOrderType }) => {
+const Trade: React.FC<TradeProps> = ({
+  trade,
+  order,
+  currentCrop,
+  cropNameList,
+  setOrderType,
+  ownCrop
+}) => {
   const { alert } = useContext(AlertContext);
   const [price, setPrice] = useState<number>(0);
   const [totalAmount, setTotalAmount] = useState<number>(0);
   const [quantity, setQuantity] = useState<number>(0);
-  const { availableCash } = useUser();
+  const [isButtonDisabled, setIsButtonDisabled] = useState<boolean>(true);
+  const { availableCash, fetch } = useUser();
 
-  const onlyNumber = (e: React.KeyboardEvent<HTMLInputElement>) => {
-    const inputElement = e.target as HTMLInputElement;
-    inputElement.value = inputElement.value.replace(/[^0-9]/g, '');
-  };
-
-  const handleOrderType = (type: string) => {
-    setOrderType(type);
+  useEffect(() => {
     setQuantity(0);
     setPrice(0);
     setTotalAmount(0);
+  }, [trade, order]);
+
+  useEffect(() => {
+    if (order === '시장가') {
+      if (trade === '매수') {
+        setIsButtonDisabled(totalAmount === 0);
+      } else {
+        setIsButtonDisabled(quantity === 0);
+      }
+    } else {
+      setIsButtonDisabled(price === 0 || quantity === 0);
+    }
+  }, [price, quantity, totalAmount, order, trade]);
+
+  const handleOrderType = (type: string) => {
+    setOrderType(type);
   };
 
   const handleIncrease = () => {
-    setPrice(prevPrice => prevPrice + 1000);
+    setPrice(prevPrice => prevPrice + 100);
   };
 
   const handleDecrease = () => {
-    setPrice(prevPrice => (prevPrice - 1000 >= 0 ? prevPrice - 1000 : 0));
+    setPrice(prevPrice => (prevPrice - 100 >= 0 ? prevPrice - 100 : 0));
   };
 
   const handlePriceChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setPrice(Number(e.target.value));
+    setPrice(Number(e.target.value.replace(/[^0-9]/g, '')));
   };
 
   const handleQuantityChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setQuantity(Number(e.target.value));
+    setQuantity(Number(e.target.value.replace(/[^0-9]/g, '')));
   };
 
   const handleMaxQuantity = () => {
-    if (order === '지정가') {
+    if (trade === '매수') {
       if (price > 0) {
         setQuantity(Math.floor(availableCash / price));
       }
     } else {
-      // 현재 보유 작물 수
-      // TODO - 웹 소켓 연결 후 추가하기
+      const maxOwnCrop = ownCrop.find(o => o.cropId === currentCrop);
+      setQuantity(maxOwnCrop?.availableQuantity || 0);
     }
   };
 
   const handleTotalAmountChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    setTotalAmount(Number(e.target.value));
+    setTotalAmount(Number(e.target.value.replace(/[^0-9]/g, '')));
   };
 
   const handleMaxTotalAmount = () => {
-    setTotalAmount(Number(availableCash));
+    setTotalAmount(availableCash);
   };
 
-  const handleOrder = async () => {
-    const crop = cropNameList.find(crop => crop.cropId === currentCrop);
+  const handleOrder = async (e: React.MouseEvent<HTMLButtonElement>) => {
+    e.currentTarget.blur();
 
+    const crop = cropNameList.find(crop => crop.cropId === currentCrop);
     if (!crop) {
       console.error('Crop not found');
       return;
     }
 
-    const cropId: number = crop?.cropId;
-    const tradingType: string = trade === '매수' ? 'buy' : 'sell';
-    const orderType: string = order === '지정가' ? 'limit' : 'market';
+    const cropId: number = crop.cropId;
+    const tradingType = trade === '매수' ? 'buy' : 'sell';
+    const orderType = order === '지정가' ? 'limit' : 'market';
 
-    let orderData;
-    let fetchMethod;
+    const isMarketOrder = orderType === 'market';
+    const isBuyOrder = tradingType === 'buy';
 
-    if (orderType === 'market') {
-      if (tradingType === 'buy') {
-        orderData = {
-          cropId,
-          orderType: tradingType,
-          tradingType: 'market',
-          totalAmount
-        };
-        fetchMethod = postMarketBuyOrder;
-      } else {
-        orderData = {
-          cropId,
-          orderType: tradingType,
-          tradingType: 'market',
-          quantity
-        };
-        fetchMethod = postMarketSellOrder;
+    if (isMarketOrder) {
+      if (isBuyOrder && totalAmount === 0) {
+        await alert('주문 총액을 입력해주세요.');
+        return;
+      }
+      if (!isBuyOrder && quantity === 0) {
+        await alert('주문 수량을 입력해주세요.');
+        return;
+      }
+    } else {
+      if (quantity === 0 || price === 0) {
+        await alert('가격과 주문 수량을 모두 입력해주세요.');
+        return;
       }
-    } else if (orderType === 'limit') {
-      orderData = {
-        cropId,
-        orderType: tradingType,
-        tradingType: 'limit',
-        quantity,
-        price
-      };
-      fetchMethod = tradingType === 'buy' ? postLimitBuyOrder : postLimitSellOrder;
     }
 
-    if (!orderData || !fetchMethod) {
-      console.error('Order data or fetch method is undefined');
-      return;
-    }
+    const orderData = {
+      cropId,
+      orderType: tradingType,
+      tradingType: orderType,
+      ...(isMarketOrder ? (isBuyOrder ? { totalAmount } : { quantity }) : { quantity, price })
+    };
+
+    const fetchMethod = isMarketOrder
+      ? isBuyOrder
+        ? postMarketBuyOrder
+        : postMarketSellOrder
+      : isBuyOrder
+        ? postLimitBuyOrder
+        : postLimitSellOrder;
 
     try {
       const response = await fetchMethod(orderData);
       await alert(response.message);
+      fetch();
     } catch (error) {
       console.error(error);
     }
   };
 
+  const displayValue =
+    trade === '매수'
+      ? availableCash.toLocaleString()
+      : ownCrop.find(o => o.cropId === currentCrop)?.availableQuantity;
+
   return (
     <>
       <div className="flex items-center justify-between mt-4">
@@ -137,9 +160,7 @@ const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList,
             <button
               key={type}
               onClick={() => handleOrderType(type)}
-              className={`px-2 py-1 rounded-md text-xs ${
-                order === type ? 'bg-light-pink' : 'bg-gray-100'
-              }`}
+              className={`px-2 py-1 rounded-md text-xs ${order === type && 'bg-light-pink'}`}
             >
               {type}
             </button>
@@ -155,23 +176,14 @@ const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList,
               <input
                 type="text"
                 value={price}
-                onKeyUp={e => {
-                  onlyNumber(e);
-                }}
                 onChange={handlePriceChange}
                 className="w-24 text-center border rounded-md text-sm px-2 py-1"
               />
 
-              <button
-                className="px-2 py-1 text-center bg-gray-200 rounded-md text-xs"
-                onClick={handleDecrease}
-              >
+              <button className="px-2 py-1 text-center rounded-md text-xs" onClick={handleDecrease}>
                 -
               </button>
-              <button
-                className="px-2 py-1 text-center bg-gray-200 rounded-md text-xs"
-                onClick={handleIncrease}
-              >
+              <button className="px-2 py-1 text-center rounded-md text-xs" onClick={handleIncrease}>
                 +
               </button>
             </div>
@@ -182,15 +194,12 @@ const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList,
               <input
                 type="text"
                 value={quantity}
-                onKeyUp={e => {
-                  onlyNumber(e);
-                }}
                 onChange={handleQuantityChange}
                 placeholder="0"
-                className="w-24 px-1 py-1 border border-gray rounded text-xs text-center"
+                className="w-24 px-1 py-1 border rounded text-xs text-center"
               />
               <button
-                className="px-2 py-1 bg-gray-200 rounded-md font-semibold text-xs"
+                className="px-2 py-1 rounded-md font-semibold text-xs"
                 onClick={handleMaxQuantity}
               >
                 최대
@@ -199,13 +208,12 @@ const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList,
           </div>
           <div className="flex items-center justify-between mt-4">
             <span className="font-semibold text-sm">주문 가능</span>
-            <span className="font-semibold text-sm">{availableCash.toLocaleString()} 원</span>
+            <span className="font-semibold text-sm">{displayValue}</span>
           </div>
           <button
-            className={`w-full py-2 mt-10 text-white rounded-md font-semibold text-sm ${
-              trade === '매수' ? 'bg-red-500' : 'bg-blue-500'
-            }`}
+            className={`w-full py-2 mt-10 rounded-md font-semibold text-sm ${isButtonDisabled ? 'opacity-85 cursor-not-allowed' : ''} ${trade === '매수' ? 'bg-red-500 text-white' : 'bg-blue-500 text-white'}`}
             onClick={handleOrder}
+            disabled={isButtonDisabled}
           >
             {trade}
           </button>
@@ -222,15 +230,12 @@ const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList,
               <input
                 type="text"
                 value={trade === '매수' ? totalAmount : quantity}
-                onKeyUp={e => {
-                  onlyNumber(e);
-                }}
                 onChange={trade === '매수' ? handleTotalAmountChange : handleQuantityChange}
                 placeholder="0"
-                className="w-24 px-1 py-1 border border-gray rounded text-xs text-center"
+                className="w-24 px-1 py-1 border rounded text-xs text-center"
               />
               <button
-                className="px-2 py-1 bg-gray-200 rounded-md font-semibold text-xs"
+                className="px-2 py-1 rounded-md font-semibold text-xs"
                 onClick={trade === '매수' ? handleMaxTotalAmount : handleMaxQuantity}
               >
                 최대
@@ -239,13 +244,12 @@ const Trade: React.FC<TradeProps> = ({ trade, order, currentCrop, cropNameList,
           </div>
           <div className="flex items-center justify-between mt-8">
             <span className="font-semibold text-sm">주문 가능</span>
-            <span className="font-semibold text-sm">{availableCash.toLocaleString()} 원</span>
+            <span className="font-semibold text-sm">{displayValue}</span>
           </div>
           <button
-            className={`w-full py-2 mt-12 text-white rounded-md font-semibold text-sm ${
-              trade === '매수' ? 'bg-red-500' : 'bg-blue-600'
-            }`}
+            className={`w-full py-2 mt-10 rounded-md font-semibold text-sm ${isButtonDisabled ? 'opacity-85 cursor-not-allowed' : ''} ${trade === '매수' ? 'bg-red-500 text-white' : 'bg-blue-500 text-white'}`}
             onClick={handleOrder}
+            disabled={isButtonDisabled}
           >
             {trade}
           </button>
diff --git a/apps/frontend/src/components/CropMarket/TradeSection.tsx b/apps/frontend/src/components/CropMarket/TradeSection.tsx
index c0aef28..daf1b0a 100644
--- a/apps/frontend/src/components/CropMarket/TradeSection.tsx
+++ b/apps/frontend/src/components/CropMarket/TradeSection.tsx
@@ -1,14 +1,15 @@
 import { useState } from 'react';
 import Trade from '@/components/CropMarket/Trade';
 import Pending from '@/components/CropMarket/Pending';
-import { CropData } from '@/types/Crop';
+import { CropData, OwnCropData } from '@/types/Crop';
 
 interface TradeProps {
   currentCrop: number;
   cropNameList: CropData[];
+  ownCrop: OwnCropData[];
 }
 
-const TradeSection: React.FC<TradeProps> = ({ currentCrop, cropNameList }) => {
+const TradeSection: React.FC<TradeProps> = ({ currentCrop, cropNameList, ownCrop }) => {
   const [tradeType, setTradeType] = useState<string>('매수');
   const [orderType, setOrderType] = useState<string>('지정가');
 
@@ -25,7 +26,7 @@ const TradeSection: React.FC<TradeProps> = ({ currentCrop, cropNameList }) => {
             <button
               key={type}
               onClick={() => changeTrade(type)}
-              className={`flex-1 p-2 rounded-lg border border-gray font-bold text-sm ${
+              className={`flex-1 p-2 rounded-lg border font-bold text-sm ${
                 tradeType === type
                   ? type === '매수'
                     ? 'text-white bg-red-500'
@@ -46,6 +47,7 @@ const TradeSection: React.FC<TradeProps> = ({ currentCrop, cropNameList }) => {
             setOrderType={setOrderType}
             currentCrop={currentCrop}
             cropNameList={cropNameList}
+            ownCrop={ownCrop}
           />
         ) : (
           <Pending cropNameList={cropNameList} />
diff --git a/apps/frontend/src/components/Intro/SignUpModal.tsx b/apps/frontend/src/components/Intro/SignUpModal.tsx
index ac85f31..de29cf2 100644
--- a/apps/frontend/src/components/Intro/SignUpModal.tsx
+++ b/apps/frontend/src/components/Intro/SignUpModal.tsx
@@ -80,7 +80,7 @@ const SignUpModal: React.FC<SignUpModalProps> = ({ step, setModalStep }) => {
   useEffect(() => {
     const handleKeyDown = (event: KeyboardEvent) => {
       if (event.key === 'Enter') {
-        if(step === 1) handleSign1();
+        if (step === 1) handleSign1();
         else handleSign2();
       }
     };
diff --git a/apps/frontend/src/pages/CropMarket.tsx b/apps/frontend/src/pages/CropMarket.tsx
index dca564f..b5d3642 100644
--- a/apps/frontend/src/pages/CropMarket.tsx
+++ b/apps/frontend/src/pages/CropMarket.tsx
@@ -107,7 +107,7 @@ const CropMarket: React.FC = () => {
 
   return (
     <main className="flex flex-row justify-center items-center min-h-screen select-none pt-16 gap-4">
-      <div className="flex flex-col items-start z-[10] gap-4 w-full lg:w-[60%] max-w-[1300px]">
+      <div className="flex flex-col items-start z-[10] gap-4 w-[60%] max-w-[1300px]">
         <div className="w-full flex flex-col justify-start gap-2">
           <CropSelector
             currentCrop={curCrop}
@@ -116,10 +116,10 @@ const CropMarket: React.FC = () => {
             handleIntervalChange={handleIntervalChange}
             cropNameList={cropNameList}
           />
-          <hr className="w-full bg-black h-[1px]" />
+          <hr className="w-full border-none bg-black h-[1px]" />
         </div>
         <section className="w-full items-center bg-light-gray border-4 border-light-pink rounded-2xl p-4">
-          <div className="h-56 flex justify-center items-center w-full sm:h-64 md:h-36 lg:h-64 xl:h-64 2xl:h-72">
+          <div className="flex justify-center items-center w-full sm:h-36 md:h-36 lg:h-64 xl:h-64 2xl:h-72">
             <Chart timeData={timeData} />
           </div>
         </section>
@@ -139,7 +139,7 @@ const CropMarket: React.FC = () => {
         </section>
       </div>
       <div className="flex flex-col items-center z-[10]">
-        <TradeSection cropNameList={cropNameList} currentCrop={curCrop} />
+        <TradeSection cropNameList={cropNameList} currentCrop={curCrop} ownCrop={ownCrop} />
         <img src="/icon.png" className="w-56 h-56" />
       </div>
     </main>
diff --git a/apps/frontend/src/pages/Intro.tsx b/apps/frontend/src/pages/Intro.tsx
index 518db75..da118c6 100644
--- a/apps/frontend/src/pages/Intro.tsx
+++ b/apps/frontend/src/pages/Intro.tsx
@@ -52,12 +52,10 @@ const Intro: React.FC = () => {
       ></button>
 
       {modalStep !== ModalStep.None && (
-        <div
-          className="fixed inset-0 flex items-center justify-center"
-          onClick={closeModal}
-        >
-          <div className="bg-bg-color opacity-95 p-8 rounded-lg shadow-lg flex flex-col items-center min-w-[500px]"
-            onClick={(e) => e.stopPropagation()}
+        <div className="fixed inset-0 flex items-center justify-center" onClick={closeModal}>
+          <div
+            className="bg-bg-color opacity-95 p-8 rounded-lg shadow-lg flex flex-col items-center min-w-[500px]"
+            onClick={e => e.stopPropagation()}
           >
             <div className="flex items-center w-full">
               <BackIcon
diff --git a/apps/frontend/src/services/AuthApi.tsx b/apps/frontend/src/services/AuthApi.tsx
index d70a950..7c65b2a 100644
--- a/apps/frontend/src/services/AuthApi.tsx
+++ b/apps/frontend/src/services/AuthApi.tsx
@@ -59,21 +59,21 @@ export const logout = async () => {
 
 export const getIntroduce = async () => {
   try {
-      const response = await api.get('auth/introduce');
+    const response = await api.get('auth/introduce');
 
-      if (response.data.code === 200) {
-          const { introduce } = response.data.data;
+    if (response.data.code === 200) {
+      const { introduce } = response.data.data;
 
-          return {
-              success: true,
-              message: response.data.message,
-              introduce
-          };
-      }
+      return {
+        success: true,
+        message: response.data.message,
+        introduce
+      };
+    }
 
-      return { success: false, message: '알 수 없는 오류가 발생했습니다.' };
+    return { success: false, message: '알 수 없는 오류가 발생했습니다.' };
   } catch (error) {
-      return handleError(error, '데이터 로딩 중 오류가 발생했습니다.');
+    return handleError(error, '데이터 로딩 중 오류가 발생했습니다.');
   }
 };
 
diff --git a/apps/frontend/src/services/OrderApi.tsx b/apps/frontend/src/services/OrderApi.tsx
index 54f758f..83a7a89 100644
--- a/apps/frontend/src/services/OrderApi.tsx
+++ b/apps/frontend/src/services/OrderApi.tsx
@@ -72,7 +72,7 @@ export const postMarketBuyOrder = async (data: Order) => {
 
     if (response.data.code === 201) {
       return { success: true, message: response.data.message };
-    } else if(response.data.code === 400) {
+    } else if (response.data.code === 400) {
       return { success: true, message: response.data.message };
     }
 
@@ -88,7 +88,7 @@ export const postMarketSellOrder = async (data: Order) => {
 
     if (response.data.code === 201) {
       return { success: true, message: response.data.message };
-    } else if(response.data.code === 400) {
+    } else if (response.data.code === 400) {
       return { success: true, message: response.data.message };
     }