style: Logo 삽입

@@ -7,7 +7,21 @@ import Input from '../components/common/Input';
 
 const Main = styled.div`
   display: flex;
-  height: 100vh;
+  align-items: center;
+  justify-content: center;
+  padding-left: 7%;
+`;
+
+const Container = styled.div`
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+`;
+
+const LogoWrap = styled.div`
+  display: flex;
+  margin-top: 11%;
+  height: 30vh;
   align-items: center;
   justify-content: center;
 `;
@@ -23,31 +37,39 @@ const LoginButtonBlock = styled.div`
   right: 20px;
 `;
 
+const SLink = styled(Link)`
+  text-decoration: none !important;
+`;
+
 const HomePage = () => {
   return (
-    <Main>
-      <div>logo</div>
-      <SearchBlock>
-        <DropDownButton
-          fontsize="20px"
-          height="50px"
-          options={[
-            { id: 1, name: '전체' },
-            { id: 2, name: '개인' },
-            { id: 3, name: '부서' },
-          ]}
-          float="left"
-        />
-        <Input color="blue" paddingsize="10px" width="700px" display />
-      </SearchBlock>
-
-      {/* Todo : 로그인 했을 경우 로그인 버튼 숨기기 */}
-      <LoginButtonBlock>
-        <Link to="/login">
-          <Button>로그인</Button>
-        </Link>
-      </LoginButtonBlock>
-    </Main>
+    <Container>
+      <LogoWrap>
+        <img src="eDrive_logo.png" alt="" />
+      </LogoWrap>
+      <Main>
+        <SearchBlock>
+          <DropDownButton
+            fontsize="20px"
+            height="50px"
+            options={[
+              { id: 1, name: '전체' },
+              { id: 2, name: '개인' },
+              { id: 3, name: '부서' },
+            ]}
+            float="left"
+          />
+          <Input color="blue" paddingsize="10px" width="700px" display />
+        </SearchBlock>
+
+        {/* Todo : 로그인 했을 경우 로그인 버튼 숨기기 */}
+        <LoginButtonBlock>
+          <SLink to="/login">
+            <Button>로그인</Button>
+          </SLink>
+        </LoginButtonBlock>
+      </Main>
+    </Container>
   );
 };