diff --git a/frontend/src/components/Layout/PageLayout.jsx b/frontend/src/components/Layout/PageLayout.jsx
new file mode 100644
index 0000000..2a5cee5
--- /dev/null
+++ b/frontend/src/components/Layout/PageLayout.jsx
@@ -0,0 +1,15 @@
+import { Footer } from '../Footer';
+import { Header } from '../Header';
+import styles from './PageLayout.module.css';
+
+export default function PageLayout({ children }) {
+  return (
+    <>
+      <Header />
+      <div className={styles.body}>
+        <div className={styles.contents}>{children}</div>
+        <Footer />
+      </div>
+    </>
+  );
+}
diff --git a/frontend/src/components/Layout/PageLayout.module.css b/frontend/src/components/Layout/PageLayout.module.css
new file mode 100644
index 0000000..3788503
--- /dev/null
+++ b/frontend/src/components/Layout/PageLayout.module.css
@@ -0,0 +1,10 @@
+.body {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  min-height: 100vh;
+}
+
+.contents {
+  margin-top: 100px;
+}
diff --git a/frontend/src/components/Layout/index.js b/frontend/src/components/Layout/index.js
new file mode 100644
index 0000000..2efcb29
--- /dev/null
+++ b/frontend/src/components/Layout/index.js
@@ -0,0 +1 @@
+export { default as PageLayout } from './PageLayout';