diff --git a/src/404.tsx b/src/404.tsx
deleted file mode 100644
index 209c2a9..0000000
--- a/src/404.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { useNavigate } from "react-router-dom";
-import Button from "./components/button";
-import styled from "styled-components";
-
-export const NotFound = () => {
-    const router = useNavigate();
-    return (
-        <Container>
-            <h1>404 Not Found</h1>
-            <Button width="100" onClick={() => router('/main')}>메인으로 가기</Button>
-        </Container>
-    );
-}
-
-const Container = styled.div`
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    justify-content: center;
-    height: 100vh;
-    gap: 16px;
-`
\ No newline at end of file
diff --git a/src/pages/notFound/index.tsx b/src/pages/notFound/index.tsx
new file mode 100644
index 0000000..9c90cb5
--- /dev/null
+++ b/src/pages/notFound/index.tsx
@@ -0,0 +1,26 @@
+import { useNavigate } from "react-router-dom";
+import Button from "@/components/button";
+import styled from "styled-components";
+
+const NotFound = () => {
+  const router = useNavigate();
+  return (
+    <Container>
+      <h1>404 Not Found</h1>
+      <Button width="100" onClick={() => router("/main")}>
+        메인으로 가기
+      </Button>
+    </Container>
+  );
+};
+
+export default NotFound;
+
+const Container = styled.div`
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 100vh;
+  gap: 16px;
+`;
diff --git a/src/router/router.tsx b/src/router/router.tsx
index f257615..659e433 100644
--- a/src/router/router.tsx
+++ b/src/router/router.tsx
@@ -1,4 +1,4 @@
-import { NotFound } from "@/404";
+import NotFound from "@/pages/notFound";
 import Attendance from "@/pages/attendance";
 import Bug from "@/pages/bug";
 import Login from "@/pages/login";