feat: 네비게이션 버튼까지 추가

src/pages/main/components/footer/Footer.styled.ts

@@ -15,7 +15,6 @@ export const FooterTop = styled.section`
   width: auto;
 `;
 
-// 로고 확정되면 로고 들어갈 위치
 export const Logo = styled(IconFooterLogo)`
   width: 5.7rem;
   height: 2.4rem;

src/pages/main/components/mainNavigation/MainNavigation.styled.ts

@@ -1,4 +1,5 @@
 import styled from "styled-components";
+import { IconFooterLogo, IcHamburgar } from "@assets/svgs";
 
 export const MainNavigationWrapper = styled.section`
   position: absolute;
@@ -11,3 +12,25 @@ export const MainNavigationWrapper = styled.section`
 
   color: white;
 `;
+
+export const LogoBtn = styled.button`
+  width: 6rem;
+  height: 2rem;
+`;
+
+export const LogoIcon = styled(IconFooterLogo)`
+  width: 6rem;
+  height: 2rem;
+  margin-left: 2.4rem;
+`;
+
+export const HamburgarBtn = styled.button`
+  width: 3.2rem;
+  height: 3.2rem;
+  margin-right: 1.7rem;
+`;
+
+export const HamburgarIcon = styled(IcHamburgar)`
+  width: 3.2rem;
+  height: 3.2rem;
+`;

src/pages/main/components/mainNavigation/MainNavigation.tsx

@@ -1,8 +1,23 @@
-import React from "react";
 import * as S from "./MainNavigation.styled";
+import { useNavigate } from "react-router-dom";
 
 const MainNavigation = () => {
-  return <S.MainNavigationWrapper>테스트테스트테스트</S.MainNavigationWrapper>;
+  const navigate = useNavigate();
+
+  return (
+    <S.MainNavigationWrapper>
+      <S.LogoBtn
+        onClick={() => {
+          navigate("/main");
+        }}
+      >
+        <S.LogoIcon />
+      </S.LogoBtn>
+      <S.HamburgarBtn onClick={() => {}}>
+        <S.HamburgarIcon />
+      </S.HamburgarBtn>
+    </S.MainNavigationWrapper>
+  );
 };
 
 export default MainNavigation;