From d12af54d63f06ff7c09e4e9d10d13c7df51ff6b0 Mon Sep 17 00:00:00 2001
From: "songhj10207@naver.com" <songhj10207@naver.com>
Date: Thu, 5 Dec 2024 18:12:48 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20=EB=B0=B0=EB=84=88=20=EC=9E=84?=
 =?UTF-8?q?=EC=8B=9C=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/common/header/Header.jsx |  1 -
 src/pages/MainPage.jsx                  | 33 ++++++++++++++++---------
 2 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/src/components/common/header/Header.jsx b/src/components/common/header/Header.jsx
index 3c57a98..844bc63 100644
--- a/src/components/common/header/Header.jsx
+++ b/src/components/common/header/Header.jsx
@@ -92,7 +92,6 @@ const HeaderLayout = styled.header`
         padding-right: 10px;
     }
     border-bottom: 1px solid ${LightGrey};
-    margin-bottom: 10px;
 `;
 
 const ButtonContainer = styled.div`
diff --git a/src/pages/MainPage.jsx b/src/pages/MainPage.jsx
index b53cf85..9dfcd6d 100644
--- a/src/pages/MainPage.jsx
+++ b/src/pages/MainPage.jsx
@@ -65,12 +65,14 @@ const MainPage = () => {
     return (
         <>
             <MainPageLayout>
-                <img
-                    src="https://wnstn6945.notion.site/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F499f229c-bff2-4c82-ae94-81c36fa59a9c%2Fc5ffdb70-a5f8-45cb-95f5-84905578edc1%2FMainImage.svg?table=block&id=1528cdfc-6811-8057-976f-c3838870753e&spaceId=499f229c-bff2-4c82-ae94-81c36fa59a9c&userId=&cache=v2"
-                    width="100%"
-                    height="100%"
-                    alt="banner"
-                />
+                <BannerBox>
+                    <img
+                        src="https://wnstn6945.notion.site/image/https%3A%2F%2Fprod-files-secure.s3.us-west-2.amazonaws.com%2F499f229c-bff2-4c82-ae94-81c36fa59a9c%2Ffc4bf7f0-53f2-4e38-843f-008cb56d4cf3%2F%25E1%2584%2586%25E1%2585%25A6%25E1%2584%258B%25E1%2585%25B5%25E1%2586%25AB%25E1%2584%2587%25E1%2585%25A2%25E1%2584%2582%25E1%2585%25A5_(3).svg?table=block&id=9c8fac30-087f-4a3e-b56a-0f35e767980a&spaceId=499f229c-bff2-4c82-ae94-81c36fa59a9c&userId=&cache=v2"
+                        alt="banner"
+                        width="100%"
+                        height="100%"
+                    />
+                </BannerBox>
                 <SearchBarContainer>
                     <SearchBar
                         searchInput={searchInput}
@@ -96,12 +98,6 @@ const MainPageLayout = styled.div`
     align-items: center;
     gap: 30px;
 
-    & > img {
-        width: 80%;
-        filter: brightness(0.8);
-        border-radius: 20px;
-    }
-
     @media screen and (max-width: 500px) {
         gap: 10px;
         & > img {
@@ -122,3 +118,16 @@ const SearchBarContainer = styled.div`
         display: none;
     }
 `;
+
+const BannerBox = styled.div`
+    width: 80%;
+    height: 100%;
+    margin-top: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+
+    @media screen and (max-width: 768px) {
+        display: none;
+    }
+`;