feat: 반응형 사이즈 적용

Author: BaeZzi813

package-lock.json

@@ -14,6 +14,14 @@ const FormContainer = Styled.form`
   margin: 3rem auto;
   width: 120.6rem;
   gap: 2.4rem;
+
+  @media (max-width: 1199px) {
+  width: 69.6rem;
+  }
+
+  @media (max-width: 767px) {
+  width: 34.6rem;
+  }
   `;
 
 function AddItemPage() {

vite-project/src/pages/AddItemPage/AddItemPage.jsx

@@ -34,22 +34,38 @@ const ProductAddImgFile = styled.label`
   input {
     display: none;
   }
+
+    @media (max-width: 767px) {
+  width: 16.8rem;
+  height: 16.8rem;
+  }
 `;
 
 const ProductAddImgFileDiv = styled.div`
   display: flex;
   gap: 2.4rem;
+
+  @media (max-width: 767px) {
+  gap: 1rem;
+  }
 `;
 
 const PreviewWrapper = styled.div`
   position: relative;
+
+
 `;
 
 const PreviewImg = styled.img`
   width: 28.2rem;
   height: 28.2rem;
   border-radius: 1.2rem;
   border: 0.1rem solid var(--gray-50);
+
+    @media (max-width: 767px) {
+  width: 16.8rem;
+  height: 16.8rem;
+  }
 `;
 
 const ClearBtn = styled.button`