diff --git a/src/pages/categories/[...slug].astro b/src/pages/categories/[...slug].astro
new file mode 100644
index 0000000..6913536
--- /dev/null
+++ b/src/pages/categories/[...slug].astro
@@ -0,0 +1,36 @@
+---
+// ------------------------------------
+// 目次用のファイル
+// ------------------------------------
+import { getCollection, getEntry } from "astro:content";
+
+import Layout from "../../layouts/Layout.astro";
+
+const { slug } = Astro.params;
+
+const metaData = await getEntry("metaData", `${slug}/meta`);
+
+if (!metaData) {
+  return new Response(null, { status: 404 });
+}
+
+const docs = await getCollection("docs", ({ id }) => id.startsWith(`${slug}/`));
+---
+
+<Layout class="container m-auto px-6 md:w-[80%]" title={metaData.data.categoryName}>
+  <h1>{metaData.data.categoryName} ドキュメント一覧</h1>
+  <ul>
+    {
+      docs.map((doc) => {
+        return (
+          <li>
+            <a href={`/docs/${doc.id}`}>
+              {doc.data.title}
+              {doc.data.description && <p>{doc.data.description}</p>}
+            </a>
+          </li>
+        );
+      })
+    }
+  </ul>
+</Layout>
diff --git a/src/pages/docs/[...slug].astro b/src/pages/docs/[...slug].astro
index c333a81..ed69694 100644
--- a/src/pages/docs/[...slug].astro
+++ b/src/pages/docs/[...slug].astro
@@ -2,30 +2,25 @@
 // ------------------------------------
 // ドキュメント本体を表示する用のファイル
 // ------------------------------------
-import { getCollection, render } from "astro:content";
+import { getEntry, render } from "astro:content";
 
 import Layout from "../../layouts/Layout.astro";
 
-export async function getStaticPaths() {
-  const docs = await getCollection("docs");
+const { slug } = Astro.params;
 
-  return docs.map((doc) => {
-    return {
-      params: { slug: doc.id },
-      props: { doc },
-    };
-  });
-}
+const article = slug && (await getEntry("docs", slug));
 
-const { doc } = Astro.props;
-const { Content } = await render(doc);
+if (!article) {
+  return new Response(null, { status: 404 });
+}
 
-export const prerender = true;
+const { Content } = await render(article);
 ---
 
-<Layout class="container m-auto px-6 md:w-[80%]" title={doc.data.title}>
-  <h1>{doc.data.title}</h1>
-  {doc.data.description && <p>{doc.data.description}</p>}
+<Layout class="container m-auto px-6 md:w-[80%]" title={article.data.title}>
+  <h1>{article.data.title}</h1>
+  {article.data.description && <p>{article.data.description}</p>}
+  <!-- eslint-disable-next-line -->
   <article headingoffset="1" class="prose max-w-none">
     <Content />
   </article>
diff --git a/src/pages/docs/[slug].astro b/src/pages/docs/[slug].astro
deleted file mode 100644
index 3ff77f1..0000000
--- a/src/pages/docs/[slug].astro
+++ /dev/null
@@ -1,45 +0,0 @@
----
-// ------------------------------------
-// 目次用のファイル
-// ------------------------------------
-import { getCollection } from "astro:content";
-
-import Layout from "../../layouts/Layout.astro";
-
-export async function getStaticPaths() {
-  const metaDatas = await getCollection("metaData");
-  const docs = await getCollection("docs");
-
-  // 重複の無いカテゴリ名を抽出
-  return metaDatas.map((metaData) => {
-    const dirPath = metaData.id.split("/").slice(0, -1).join("/");
-    const extractedDocs = docs.filter((doc) => doc.id.startsWith(`${dirPath}/`));
-    return {
-      params: { slug: dirPath },
-      props: { category: metaData.data.categoryName, docs: extractedDocs },
-    };
-  });
-}
-
-const { category, docs } = Astro.props;
-
-export const prerender = true;
----
-
-<Layout class="container m-auto px-6 md:w-[80%]" title={category}>
-  <h1>{category} ドキュメント一覧</h1>
-  <ul>
-    {
-      docs.map((doc) => {
-        return (
-          <li>
-            <a href={`/docs/${doc.id}`}>
-              {doc.data.title}
-              {doc.data.description && <p>{doc.data.description}</p>}
-            </a>
-          </li>
-        );
-      })
-    }
-  </ul>
-</Layout>
diff --git a/src/pages/docs/index.astro b/src/pages/docs/index.astro
index 5cfbc3e..ab91f20 100644
--- a/src/pages/docs/index.astro
+++ b/src/pages/docs/index.astro
@@ -27,7 +27,7 @@ metaDatas.map((metaData) => {
       entries.map((entry) => {
         return (
           <li>
-            <a href={`/docs/${entry.path}`}>{entry.categoryName}</a>
+            <a href={`/categories/${entry.path}`}>{entry.categoryName}</a>
           </li>
         );
       })