From 9538363f546db30a86b540b824a5cd35a20043f8 Mon Sep 17 00:00:00 2001
From: 365kim <365listener@gmail.com>
Date: Thu, 10 Jun 2021 17:50:04 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20Stepper=20UI=20=EB=84=88=EB=B9=84?=
 =?UTF-8?q?=20'%'=20=EB=8B=A8=EC=9C=84=20=EC=A0=9C=EA=B1=B0=20=EB=B0=8F=20?=
 =?UTF-8?q?=EC=83=81=EC=88=98=ED=99=94?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/molecules/QuantityStepper/style.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/components/molecules/QuantityStepper/style.js b/src/components/molecules/QuantityStepper/style.js
index 5173cd350e..48245a12e3 100644
--- a/src/components/molecules/QuantityStepper/style.js
+++ b/src/components/molecules/QuantityStepper/style.js
@@ -8,8 +8,10 @@ export const Container = styled.div`
   height: 3.75rem;
 `;
 
+const STEPPER_WIDTH = '3rem';
+
 export const Input = styled.input`
-  width: 64%;
+  width: calc(100% - ${STEPPER_WIDTH});
   border-color: ${COLOR.HEX.GRAY_200};
   border-width: 0.125rem 0 0.125rem 0.125rem;
   border-style: solid;
@@ -26,7 +28,7 @@ export const Input = styled.input`
 `;
 
 export const Controller = styled.div`
-  width: 36%;
+  width: ${STEPPER_WIDTH};
 `;
 
 export const StepperButton = styled(Button)`