From f934e2b8db7bad2855e782dab933f9e8aaa23fac Mon Sep 17 00:00:00 2001
From: LEEJW1953 <jiwonlee1953@naver.com>
Date: Tue, 21 Nov 2023 15:32:12 +0900
Subject: [PATCH 1/3] =?UTF-8?q?:lipstick:=20=ED=97=A4=EB=8D=94=20=EC=83=81?=
 =?UTF-8?q?=EB=8B=A8=20=EA=B3=A0=EC=A0=95=20=EB=B0=8F=20z-index=20?=
 =?UTF-8?q?=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/frontend/src/components/commons/Header/index.css.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/app/frontend/src/components/commons/Header/index.css.ts b/app/frontend/src/components/commons/Header/index.css.ts
index 2a7fe4211..1bc47f589 100644
--- a/app/frontend/src/components/commons/Header/index.css.ts
+++ b/app/frontend/src/components/commons/Header/index.css.ts
@@ -3,10 +3,14 @@ import { style } from '@vanilla-extract/css';
 import { vars, fontStyle } from '@/styles';
 
 export const container = style({
+  position: 'sticky',
+  top: 0,
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',
+  background: vars.color.grayscaleWhite,
   borderBottom: `1px solid ${vars.color.grayscale100}`,
+  zIndex: '999',
 });
 
 export const header = style({

From 28e9042d9d4022453a5ebb9302c02af42ebe29b9 Mon Sep 17 00:00:00 2001
From: LEEJW1953 <jiwonlee1953@naver.com>
Date: Tue, 21 Nov 2023 15:46:33 +0900
Subject: [PATCH 2/3] =?UTF-8?q?:lipstick:=20=ED=97=A4=EB=8D=94=20position?=
 =?UTF-8?q?=20fixed=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/frontend/src/components/commons/Header/index.css.ts | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/app/frontend/src/components/commons/Header/index.css.ts b/app/frontend/src/components/commons/Header/index.css.ts
index 1bc47f589..766c23260 100644
--- a/app/frontend/src/components/commons/Header/index.css.ts
+++ b/app/frontend/src/components/commons/Header/index.css.ts
@@ -3,8 +3,10 @@ import { style } from '@vanilla-extract/css';
 import { vars, fontStyle } from '@/styles';
 
 export const container = style({
-  position: 'sticky',
+  position: 'fixed',
   top: 0,
+  left: 0,
+  right: 0,
   display: 'flex',
   justifyContent: 'center',
   alignItems: 'center',

From 25b9eab2dd790888640fb919407582c884d4ac9c Mon Sep 17 00:00:00 2001
From: LEEJW1953 <jiwonlee1953@naver.com>
Date: Tue, 21 Nov 2023 16:40:43 +0900
Subject: [PATCH 3/3] =?UTF-8?q?:lipstick:=20=ED=97=A4=EB=8D=94=EC=97=90=20?=
 =?UTF-8?q?=EA=B0=80=EB=A0=A4=EC=A7=80=EB=8A=94=20=EB=B6=80=EB=B6=84=20?=
 =?UTF-8?q?=EC=B2=98=EB=A6=AC=EB=A5=BC=20=EC=9C=84=ED=95=9C=20=EC=8A=A4?=
 =?UTF-8?q?=ED=83=80=EC=9D=BC=20=EC=B6=94=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/frontend/src/components/commons/Layout/index.css.ts | 5 +++++
 app/frontend/src/components/commons/Layout/index.tsx    | 5 ++++-
 2 files changed, 9 insertions(+), 1 deletion(-)
 create mode 100644 app/frontend/src/components/commons/Layout/index.css.ts

diff --git a/app/frontend/src/components/commons/Layout/index.css.ts b/app/frontend/src/components/commons/Layout/index.css.ts
new file mode 100644
index 000000000..12ad97ea9
--- /dev/null
+++ b/app/frontend/src/components/commons/Layout/index.css.ts
@@ -0,0 +1,5 @@
+import { style } from '@vanilla-extract/css';
+
+export const container = style({
+  paddingTop: '8.5rem',
+});
diff --git a/app/frontend/src/components/commons/Layout/index.tsx b/app/frontend/src/components/commons/Layout/index.tsx
index 5db8defb2..28a704a5e 100644
--- a/app/frontend/src/components/commons/Layout/index.tsx
+++ b/app/frontend/src/components/commons/Layout/index.tsx
@@ -1,12 +1,15 @@
 import { Outlet } from 'react-router-dom';
 
+import * as styles from './index.css';
 import { Header } from '../Header';
 
 export function Layout() {
   return (
     <>
       <Header />
-      <Outlet />
+      <div className={styles.container}>
+        <Outlet />
+      </div>
     </>
   );
 }