diff --git a/public/img/icon-search.svg b/public/img/icon-search.svg
index 35ba70c..54dc7d2 100644
--- a/public/img/icon-search.svg
+++ b/public/img/icon-search.svg
@@ -1,3 +1,3 @@
-<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M15.755 14.255H14.965L14.685 13.985C15.665 12.845 16.255 11.365 16.255 9.755C16.255 6.165 13.345 3.255 9.755 3.255C6.165 3.255 3.255 6.165 3.255 9.755C3.255 13.345 6.165 16.255 9.755 16.255C11.365 16.255 12.845 15.665 13.985 14.685L14.255 14.965V15.755L19.255 20.745L20.745 19.255L15.755 14.255ZM9.755 14.255C7.26501 14.255 5.255 12.245 5.255 9.755C5.255 7.265 7.26501 5.255 9.755 5.255C12.245 5.255 14.255 7.265 14.255 9.755C14.255 12.245 12.245 14.255 9.755 14.255Z" fill="#3F3F3F"/>
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M12.755 11.255H11.965L11.685 10.985C12.665 9.845 13.255 8.365 13.255 6.755C13.255 3.165 10.345 0.254997 6.755 0.254997C3.165 0.254997 0.255005 3.165 0.255005 6.755C0.255005 10.345 3.165 13.255 6.755 13.255C8.365 13.255 9.845 12.665 10.985 11.685L11.255 11.965V12.755L16.255 17.745L17.745 16.255L12.755 11.255ZM6.755 11.255C4.26501 11.255 2.255 9.245 2.255 6.755C2.255 4.265 4.26501 2.255 6.755 2.255C9.245 2.255 11.255 4.265 11.255 6.755C11.255 9.245 9.245 11.255 6.755 11.255Z" fill="#1E1E1E"/>
 </svg>
diff --git a/public/img/icon-user-black.svg b/public/img/icon-user-black.svg
new file mode 100644
index 0000000..e5ef743
--- /dev/null
+++ b/public/img/icon-user-black.svg
@@ -0,0 +1,3 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8 2C9.1 2 10 2.9 10 4C10 5.1 9.1 6 8 6C6.9 6 6 5.1 6 4C6 2.9 6.9 2 8 2ZM8 11C10.7 11 13.8 12.29 14 13V14H2V13.01C2.2 12.29 5.3 11 8 11ZM8 0C5.79 0 4 1.79 4 4C4 6.21 5.79 8 8 8C10.21 8 12 6.21 12 4C12 1.79 10.21 0 8 0ZM8 9C5.33 9 0 10.34 0 13V16H16V13C16 10.34 10.67 9 8 9Z" fill="#1E1E1E"/>
+</svg>
diff --git a/src/components/BookingSearchContainer/BookingSearchContainer.tsx b/src/components/BookingSearchContainer/BookingSearchContainer.tsx
index 40b36f5..3891a72 100644
--- a/src/components/BookingSearchContainer/BookingSearchContainer.tsx
+++ b/src/components/BookingSearchContainer/BookingSearchContainer.tsx
@@ -1,8 +1,11 @@
+/** @jsxImportSource @emotion/react */
+
 import styled from '@emotion/styled';
 import variables from '@styles/Variables';
 import useModal from '@hooks/useModal';
 import LocalDateSelectionModal from '@pages/Home/components/LocalDateSelectionModal';
 import { useNavigate } from 'react-router-dom';
+import { Hidden } from '@styles/Common';
 
 /** 메인 전체 지역 예약 날짜 선택 등  */
 // button => 모달 오픈용  searchStyle => 검색용
@@ -10,20 +13,39 @@ const BookingSearchContainer = () => {
   const modal = useModal();
   const navigate = useNavigate();
 
+  // user 정보 세션에서 가져오기
+  const user = false;
+
   return (
     <BookingSearchContainerStyle>
-      <Button type="button" onClick={() => modal.open()}>
-        <ButtonTitleStyle>전체지역</ButtonTitleStyle> <img src="/img/icon-select-arrow.svg" alt="전체 지역 탐색" />
-        <SearchStyle
-          onClick={(e) => {
-            e.stopPropagation();
-            navigate('/search');
-          }}
-        >
-          <img src="/img/icon-search.svg" alt="상세 정보 검색" />
-        </SearchStyle>
-      </Button>
-      <ButtonTitleDes>예약 날짜와 시간을 선택해주세요.</ButtonTitleDes>
+      <div>
+        <Button type="button" onClick={() => modal.open()}>
+          <ButtonTitleStyle>전체지역</ButtonTitleStyle> <img src="/img/icon-select-arrow.svg" alt="전체 지역 탐색" />
+        </Button>
+        <ButtonTitleDes>예약 날짜와 시간을 선택해주세요.</ButtonTitleDes>
+      </div>
+
+      <ButtonStyle
+        className="search"
+        onClick={(e) => {
+          e.stopPropagation();
+          navigate('/search');
+        }}
+      >
+        <span css={Hidden}>검색</span>
+        <img src="/img/icon-search.svg" alt="상세 정보 검색" />
+      </ButtonStyle>
+
+      <ButtonStyle
+        className="user"
+        onClick={(e) => {
+          e.stopPropagation();
+          navigate(`/user/${user ? 'mypage' : 'login'}`);
+        }}
+      >
+        <span css={Hidden}>{user ? '마이페이지' : '로그인'}</span>
+        <img src="/img/icon-user-black.svg" alt={user ? '마이페이지' : '로그인'} />
+      </ButtonStyle>
       <LocalDateSelectionModal modalId={1} />
     </BookingSearchContainerStyle>
   );
@@ -31,7 +53,7 @@ const BookingSearchContainer = () => {
 
 const BookingSearchContainerStyle = styled.div`
   display: flex;
-  flex-direction: column;
+  align-items: center;
   margin-bottom: 1.8rem;
 `;
 
@@ -43,17 +65,34 @@ const Button = styled.button`
   gap: 0.4rem;
 `;
 
-const SearchStyle = styled.div`
-  margin-left: auto;
+const ButtonStyle = styled.button`
   display: flex;
   justify-content: center;
   align-items: center;
+  padding: 0.8rem;
+  width: 2.4rem;
+  height: 2.4rem;
+
+  &.search {
+    margin-left: auto;
+
+    & > img {
+      width: 1.7rem;
+    }
+  }
+
+  &.user {
+    & > img {
+      width: 1.6rem;
+    }
+  }
 `;
 
 const ButtonTitleStyle = styled.h1`
   font-size: 1.8rem;
   font-weight: 600;
 `;
+
 const ButtonTitleDes = styled.p`
   color: ${variables.colors.gray600};
 `;
diff --git a/src/pages/User/Login.tsx b/src/pages/User/Login.tsx
new file mode 100644
index 0000000..7a8dcef
--- /dev/null
+++ b/src/pages/User/Login.tsx
@@ -0,0 +1,12 @@
+import { Link } from 'react-router-dom';
+
+const Login = () => {
+  return (
+    <>
+      로그인 페이지
+      <Link to="/user/signup">회원가입</Link>
+    </>
+  );
+};
+
+export default Login;
diff --git a/src/pages/User/MyPage.tsx b/src/pages/User/MyPage.tsx
new file mode 100644
index 0000000..73b75c5
--- /dev/null
+++ b/src/pages/User/MyPage.tsx
@@ -0,0 +1,5 @@
+const MyPage = () => {
+  return <>마이페이지</>;
+};
+
+export default MyPage;
diff --git a/src/pages/User/SignUp.tsx b/src/pages/User/SignUp.tsx
new file mode 100644
index 0000000..059eff8
--- /dev/null
+++ b/src/pages/User/SignUp.tsx
@@ -0,0 +1,5 @@
+const SignUp = () => {
+  return <>회원가입 페이지</>;
+};
+
+export default SignUp;
diff --git a/src/routes.tsx b/src/routes.tsx
index 8659fa3..077201a 100644
--- a/src/routes.tsx
+++ b/src/routes.tsx
@@ -1,3 +1,6 @@
+import Login from '@pages/User/Login';
+import MyPage from '@pages/User/MyPage';
+import SignUp from '@pages/User/Signup';
 import { lazy } from 'react';
 import { createBrowserRouter } from 'react-router-dom';
 
@@ -16,6 +19,23 @@ const router = createBrowserRouter([
     path: '/',
     element: <Home />,
   },
+  {
+    path: 'user',
+    children: [
+      {
+        path: 'login',
+        element: <Login />,
+      },
+      {
+        path: 'signup',
+        element: <SignUp />,
+      },
+      {
+        path: 'mypage',
+        element: <MyPage />,
+      },
+    ],
+  },
   {
     path: 'search',
     element: <Search />,