diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 33fa460..a3c2355 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -29,16 +29,16 @@ importers:
         version: 18.3.5(@types/react@18.3.18)
       '@vitejs/plugin-react-swc':
         specifier: ^3.5.0
-        version: 3.7.2(vite@6.0.9)
+        version: 3.7.2(vite@6.0.9(jiti@2.4.2)(lightningcss@1.29.1))
       eslint:
         specifier: ^9.17.0
-        version: 9.18.0
+        version: 9.18.0(jiti@2.4.2)
       eslint-plugin-react-hooks:
         specifier: ^5.0.0
-        version: 5.1.0(eslint@9.18.0)
+        version: 5.1.0(eslint@9.18.0(jiti@2.4.2))
       eslint-plugin-react-refresh:
         specifier: ^0.4.16
-        version: 0.4.18(eslint@9.18.0)
+        version: 0.4.18(eslint@9.18.0(jiti@2.4.2))
       globals:
         specifier: ^15.14.0
         version: 15.14.0
@@ -47,10 +47,10 @@ importers:
         version: 5.6.3
       typescript-eslint:
         specifier: ^8.18.2
-        version: 8.20.0(eslint@9.18.0)(typescript@5.6.3)
+        version: 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
       vite:
         specifier: ^6.0.5
-        version: 6.0.9
+        version: 6.0.9(jiti@2.4.2)(lightningcss@1.29.1)
 
 packages:
 
@@ -582,6 +582,11 @@ packages:
   deep-is@0.1.4:
     resolution: {integrity: sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==}
 
+  detect-libc@1.0.3:
+    resolution: {integrity: sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==}
+    engines: {node: '>=0.10'}
+    hasBin: true
+
   esbuild@0.24.2:
     resolution: {integrity: sha512-+9egpBW8I3CD5XPe0n6BfT5fxLzxrlDzqydF3aviG+9ni1lDC/OvMHcxqEFV0+LANZG5R1bFMWfUrjVsdwxJvA==}
     engines: {node: '>=18'}
@@ -734,6 +739,10 @@ packages:
   isexe@2.0.0:
     resolution: {integrity: sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==}
 
+  jiti@2.4.2:
+    resolution: {integrity: sha512-rg9zJN+G4n2nfJl5MW3BMygZX56zKPNVEYYqq7adpmMh4Jn2QNEwhvQlFy6jPVdcod7txZtKHWnyZiA3a0zP7A==}
+    hasBin: true
+
   js-tokens@4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
 
@@ -757,6 +766,70 @@ packages:
     resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
     engines: {node: '>= 0.8.0'}
 
+  lightningcss-darwin-arm64@1.29.1:
+    resolution: {integrity: sha512-HtR5XJ5A0lvCqYAoSv2QdZZyoHNttBpa5EP9aNuzBQeKGfbyH5+UipLWvVzpP4Uml5ej4BYs5I9Lco9u1fECqw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
+  lightningcss-darwin-x64@1.29.1:
+    resolution: {integrity: sha512-k33G9IzKUpHy/J/3+9MCO4e+PzaFblsgBjSGlpAaFikeBFm8B/CkO3cKU9oI4g+fjS2KlkLM/Bza9K/aw8wsNA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
+  lightningcss-freebsd-x64@1.29.1:
+    resolution: {integrity: sha512-0SUW22fv/8kln2LnIdOCmSuXnxgxVC276W5KLTwoehiO0hxkacBxjHOL5EtHD8BAXg2BvuhsJPmVMasvby3LiQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
+  lightningcss-linux-arm-gnueabihf@1.29.1:
+    resolution: {integrity: sha512-sD32pFvlR0kDlqsOZmYqH/68SqUMPNj+0pucGxToXZi4XZgZmqeX/NkxNKCPsswAXU3UeYgDSpGhu05eAufjDg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+
+  lightningcss-linux-arm64-gnu@1.29.1:
+    resolution: {integrity: sha512-0+vClRIZ6mmJl/dxGuRsE197o1HDEeeRk6nzycSy2GofC2JsY4ifCRnvUWf/CUBQmlrvMzt6SMQNMSEu22csWQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  lightningcss-linux-arm64-musl@1.29.1:
+    resolution: {integrity: sha512-UKMFrG4rL/uHNgelBsDwJcBqVpzNJbzsKkbI3Ja5fg00sgQnHw/VrzUTEc4jhZ+AN2BvQYz/tkHu4vt1kLuJyw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
+  lightningcss-linux-x64-gnu@1.29.1:
+    resolution: {integrity: sha512-u1S+xdODy/eEtjADqirA774y3jLcm8RPtYztwReEXoZKdzgsHYPl0s5V52Tst+GKzqjebkULT86XMSxejzfISw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  lightningcss-linux-x64-musl@1.29.1:
+    resolution: {integrity: sha512-L0Tx0DtaNUTzXv0lbGCLB/c/qEADanHbu4QdcNOXLIe1i8i22rZRpbT3gpWYsCh9aSL9zFujY/WmEXIatWvXbw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
+  lightningcss-win32-arm64-msvc@1.29.1:
+    resolution: {integrity: sha512-QoOVnkIEFfbW4xPi+dpdft/zAKmgLgsRHfJalEPYuJDOWf7cLQzYg0DEh8/sn737FaeMJxHZRc1oBreiwZCjog==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
+  lightningcss-win32-x64-msvc@1.29.1:
+    resolution: {integrity: sha512-NygcbThNBe4JElP+olyTI/doBNGJvLs3bFCRPdvuCcxZCcCZ71B858IHpdm7L1btZex0FvCmM17FK98Y9MRy1Q==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+
+  lightningcss@1.29.1:
+    resolution: {integrity: sha512-FmGoeD4S05ewj+AkhTY+D+myDvXI6eL27FjHIjoyUkO/uw7WZD1fBVs0QxeYWa7E17CUHJaYX/RUGISCtcrG4Q==}
+    engines: {node: '>= 12.0.0'}
+
   locate-path@6.0.0:
     resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
     engines: {node: '>=10'}
@@ -1052,9 +1125,9 @@ snapshots:
   '@esbuild/win32-x64@0.24.2':
     optional: true
 
-  '@eslint-community/eslint-utils@4.4.1(eslint@9.18.0)':
+  '@eslint-community/eslint-utils@4.4.1(eslint@9.18.0(jiti@2.4.2))':
     dependencies:
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
       eslint-visitor-keys: 3.4.3
 
   '@eslint-community/regexpp@4.12.1': {}
@@ -1243,15 +1316,15 @@ snapshots:
       '@types/prop-types': 15.7.14
       csstype: 3.1.3
 
-  '@typescript-eslint/eslint-plugin@8.20.0(@typescript-eslint/parser@8.20.0(eslint@9.18.0)(typescript@5.6.3))(eslint@9.18.0)(typescript@5.6.3)':
+  '@typescript-eslint/eslint-plugin@8.20.0(@typescript-eslint/parser@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)':
     dependencies:
       '@eslint-community/regexpp': 4.12.1
-      '@typescript-eslint/parser': 8.20.0(eslint@9.18.0)(typescript@5.6.3)
+      '@typescript-eslint/parser': 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
       '@typescript-eslint/scope-manager': 8.20.0
-      '@typescript-eslint/type-utils': 8.20.0(eslint@9.18.0)(typescript@5.6.3)
-      '@typescript-eslint/utils': 8.20.0(eslint@9.18.0)(typescript@5.6.3)
+      '@typescript-eslint/type-utils': 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/utils': 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
       '@typescript-eslint/visitor-keys': 8.20.0
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
       graphemer: 1.4.0
       ignore: 5.3.2
       natural-compare: 1.4.0
@@ -1260,14 +1333,14 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/parser@8.20.0(eslint@9.18.0)(typescript@5.6.3)':
+  '@typescript-eslint/parser@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)':
     dependencies:
       '@typescript-eslint/scope-manager': 8.20.0
       '@typescript-eslint/types': 8.20.0
       '@typescript-eslint/typescript-estree': 8.20.0(typescript@5.6.3)
       '@typescript-eslint/visitor-keys': 8.20.0
       debug: 4.4.0
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
       typescript: 5.6.3
     transitivePeerDependencies:
       - supports-color
@@ -1277,12 +1350,12 @@ snapshots:
       '@typescript-eslint/types': 8.20.0
       '@typescript-eslint/visitor-keys': 8.20.0
 
-  '@typescript-eslint/type-utils@8.20.0(eslint@9.18.0)(typescript@5.6.3)':
+  '@typescript-eslint/type-utils@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)':
     dependencies:
       '@typescript-eslint/typescript-estree': 8.20.0(typescript@5.6.3)
-      '@typescript-eslint/utils': 8.20.0(eslint@9.18.0)(typescript@5.6.3)
+      '@typescript-eslint/utils': 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
       debug: 4.4.0
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
       ts-api-utils: 2.0.0(typescript@5.6.3)
       typescript: 5.6.3
     transitivePeerDependencies:
@@ -1304,13 +1377,13 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@typescript-eslint/utils@8.20.0(eslint@9.18.0)(typescript@5.6.3)':
+  '@typescript-eslint/utils@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)':
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.18.0)
+      '@eslint-community/eslint-utils': 4.4.1(eslint@9.18.0(jiti@2.4.2))
       '@typescript-eslint/scope-manager': 8.20.0
       '@typescript-eslint/types': 8.20.0
       '@typescript-eslint/typescript-estree': 8.20.0(typescript@5.6.3)
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
       typescript: 5.6.3
     transitivePeerDependencies:
       - supports-color
@@ -1320,10 +1393,10 @@ snapshots:
       '@typescript-eslint/types': 8.20.0
       eslint-visitor-keys: 4.2.0
 
-  '@vitejs/plugin-react-swc@3.7.2(vite@6.0.9)':
+  '@vitejs/plugin-react-swc@3.7.2(vite@6.0.9(jiti@2.4.2)(lightningcss@1.29.1))':
     dependencies:
       '@swc/core': 1.10.8
-      vite: 6.0.9
+      vite: 6.0.9(jiti@2.4.2)(lightningcss@1.29.1)
     transitivePeerDependencies:
       - '@swc/helpers'
 
@@ -1392,6 +1465,9 @@ snapshots:
 
   deep-is@0.1.4: {}
 
+  detect-libc@1.0.3:
+    optional: true
+
   esbuild@0.24.2:
     optionalDependencies:
       '@esbuild/aix-ppc64': 0.24.2
@@ -1422,13 +1498,13 @@ snapshots:
 
   escape-string-regexp@4.0.0: {}
 
-  eslint-plugin-react-hooks@5.1.0(eslint@9.18.0):
+  eslint-plugin-react-hooks@5.1.0(eslint@9.18.0(jiti@2.4.2)):
     dependencies:
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
 
-  eslint-plugin-react-refresh@0.4.18(eslint@9.18.0):
+  eslint-plugin-react-refresh@0.4.18(eslint@9.18.0(jiti@2.4.2)):
     dependencies:
-      eslint: 9.18.0
+      eslint: 9.18.0(jiti@2.4.2)
 
   eslint-scope@8.2.0:
     dependencies:
@@ -1439,9 +1515,9 @@ snapshots:
 
   eslint-visitor-keys@4.2.0: {}
 
-  eslint@9.18.0:
+  eslint@9.18.0(jiti@2.4.2):
     dependencies:
-      '@eslint-community/eslint-utils': 4.4.1(eslint@9.18.0)
+      '@eslint-community/eslint-utils': 4.4.1(eslint@9.18.0(jiti@2.4.2))
       '@eslint-community/regexpp': 4.12.1
       '@eslint/config-array': 0.19.1
       '@eslint/core': 0.10.0
@@ -1475,6 +1551,8 @@ snapshots:
       minimatch: 3.1.2
       natural-compare: 1.4.0
       optionator: 0.9.4
+    optionalDependencies:
+      jiti: 2.4.2
     transitivePeerDependencies:
       - supports-color
 
@@ -1572,6 +1650,9 @@ snapshots:
 
   isexe@2.0.0: {}
 
+  jiti@2.4.2:
+    optional: true
+
   js-tokens@4.0.0: {}
 
   js-yaml@4.1.0:
@@ -1593,6 +1674,52 @@ snapshots:
       prelude-ls: 1.2.1
       type-check: 0.4.0
 
+  lightningcss-darwin-arm64@1.29.1:
+    optional: true
+
+  lightningcss-darwin-x64@1.29.1:
+    optional: true
+
+  lightningcss-freebsd-x64@1.29.1:
+    optional: true
+
+  lightningcss-linux-arm-gnueabihf@1.29.1:
+    optional: true
+
+  lightningcss-linux-arm64-gnu@1.29.1:
+    optional: true
+
+  lightningcss-linux-arm64-musl@1.29.1:
+    optional: true
+
+  lightningcss-linux-x64-gnu@1.29.1:
+    optional: true
+
+  lightningcss-linux-x64-musl@1.29.1:
+    optional: true
+
+  lightningcss-win32-arm64-msvc@1.29.1:
+    optional: true
+
+  lightningcss-win32-x64-msvc@1.29.1:
+    optional: true
+
+  lightningcss@1.29.1:
+    dependencies:
+      detect-libc: 1.0.3
+    optionalDependencies:
+      lightningcss-darwin-arm64: 1.29.1
+      lightningcss-darwin-x64: 1.29.1
+      lightningcss-freebsd-x64: 1.29.1
+      lightningcss-linux-arm-gnueabihf: 1.29.1
+      lightningcss-linux-arm64-gnu: 1.29.1
+      lightningcss-linux-arm64-musl: 1.29.1
+      lightningcss-linux-x64-gnu: 1.29.1
+      lightningcss-linux-x64-musl: 1.29.1
+      lightningcss-win32-arm64-msvc: 1.29.1
+      lightningcss-win32-x64-msvc: 1.29.1
+    optional: true
+
   locate-path@6.0.0:
     dependencies:
       p-locate: 5.0.0
@@ -1740,12 +1867,12 @@ snapshots:
     dependencies:
       prelude-ls: 1.2.1
 
-  typescript-eslint@8.20.0(eslint@9.18.0)(typescript@5.6.3):
+  typescript-eslint@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3):
     dependencies:
-      '@typescript-eslint/eslint-plugin': 8.20.0(@typescript-eslint/parser@8.20.0(eslint@9.18.0)(typescript@5.6.3))(eslint@9.18.0)(typescript@5.6.3)
-      '@typescript-eslint/parser': 8.20.0(eslint@9.18.0)(typescript@5.6.3)
-      '@typescript-eslint/utils': 8.20.0(eslint@9.18.0)(typescript@5.6.3)
-      eslint: 9.18.0
+      '@typescript-eslint/eslint-plugin': 8.20.0(@typescript-eslint/parser@8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3))(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/parser': 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
+      '@typescript-eslint/utils': 8.20.0(eslint@9.18.0(jiti@2.4.2))(typescript@5.6.3)
+      eslint: 9.18.0(jiti@2.4.2)
       typescript: 5.6.3
     transitivePeerDependencies:
       - supports-color
@@ -1756,13 +1883,15 @@ snapshots:
     dependencies:
       punycode: 2.3.1
 
-  vite@6.0.9:
+  vite@6.0.9(jiti@2.4.2)(lightningcss@1.29.1):
     dependencies:
       esbuild: 0.24.2
       postcss: 8.5.1
       rollup: 4.31.0
     optionalDependencies:
       fsevents: 2.3.3
+      jiti: 2.4.2
+      lightningcss: 1.29.1
 
   which@2.0.2:
     dependencies:
diff --git a/src/App.tsx b/src/App.tsx
index 958688c..3b37bde 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -3,6 +3,8 @@ import './minor.css'
 import './content.css'
 import './App.css'
 import { format } from 'date-fns';
+import { GalleryContent } from './Gallery';
+import { GalleryTitleHeader } from './GalleryTitleHeader';
 
 
 function getTimeFromNow(date: Date) {
@@ -238,7 +240,24 @@ function GalleryTable() {
 
 function App() {
   return (
-    <GalleryTable />
+    <>
+      <div
+        style={{
+          width: "1160px",
+          margin: "20px auto 0",
+        }}
+      >
+        <GalleryTitleHeader />
+        <div
+          style={{
+            borderTop: "2px solid #29367c",
+            width: "1158px"
+          }}
+        />
+        <GalleryContent />
+      </div>
+      <GalleryTable />
+    </>
   )
 }
 
diff --git a/src/Gallery.tsx b/src/Gallery.tsx
new file mode 100644
index 0000000..86676f6
--- /dev/null
+++ b/src/Gallery.tsx
@@ -0,0 +1,533 @@
+import { Separator } from "./Separator"
+
+function GalleryContentHeader() {
+    return <header>
+        <div
+            style={{
+                marginTop: "16px",
+                marginBottom: "29px",
+                paddingBottom: "11px",
+                borderBottomWidth: "1px",
+                borderBottomStyle: "solid",
+                borderBottomColor: "rgb(238, 238, 238)"
+            }}
+        >
+
+            <h3
+                style={{
+                    paddingRight: "2px",
+                    paddingLeft: "2px",
+                    marginBottom: "7px",
+                    fontSize: "14px",
+                }}
+            >
+
+                <span> [일반] </span>
+                <span>
+                    아 e글 유파들이 고도 왜 안올리는지 알았다
+                </span>
+                <span> </span>
+            </h3>
+            <div
+                style={{
+                    position: "relative",
+                    fontSize: "13px",
+                    cursor: "pointer",
+                    paddingRight: "2px",
+                    paddingLeft: "2px",
+                }}
+            >
+                <div style={{ float: "left" }}>
+                    <span>
+                        <em> 썬갤러 </em>
+                    </span>
+                    <span
+                        style={{
+                            backgroundColor: "transparent",
+                            fontFamily: "tahoma, sans-serif",
+                            fontSize: "11px",
+                            color: "rgb(153, 153, 153)"
+                        }}
+                    >
+                        (110.15)
+                    </span>
+                    <span style={{ backgroundColor: "transparent", cursor: "default" }}>
+                        <Separator />
+                        2025.02.04 21:32:47
+                    </span>
+                </div>
+                <div
+                    style={{
+                        float: "right",
+                        paddingRight: "7px",
+                    }}
+                >
+
+                    <span style={{ cursor: "default" }}>
+                        조회 65
+                    </span>
+                    <span style={{ cursor: "default" }}>
+                        <Separator />
+                        추천 0
+                    </span>
+                    <span style={{ cursor: "default" }}>
+                        <Separator />
+                        <a
+                            style={{
+                                backgroundColor: "rgb(238, 238, 238)",
+                                color: "rgb(51, 51, 51)",
+                                display: "inline-block",
+                                height: "20px",
+                                lineHeight: "20px",
+                                padding: "0px 10px",
+                                border: "1px solid rgb(204, 204, 204)",
+                                borderRadius: "50px",
+                            }}
+                        >
+                            댓글 13
+                        </a>
+                    </span>
+                </div>
+                <div style={{ clear: "both" }}></div>
+            </div>
+        </div>
+    </header>
+}
+
+function GalleryRecommendation() {
+    return <div
+        style={{
+            backgroundColor: "rgb(255, 255, 255)",
+            width: "auto",
+            height: "auto",
+            marginRight: "auto",
+            marginBottom: "36px",
+            marginLeft: "auto",
+            paddingTop: "19px",
+            border: "1px solid rgb(196, 196, 196)",
+            borderRadius: "2px",
+            fontFamily:
+                '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, Dotum, 돋움, sans-serif',
+            clear: "both",
+            minWidth: "288px",
+            display: "table"
+        }}
+    >
+        <div
+            style={{
+                backgroundColor: "transparent",
+                textAlign: "center",
+                fontSize: "0px",
+            }}
+        >
+
+            <div
+                style={{
+                    backgroundColor: "transparent",
+                    overflow: "hidden",
+                    width: "139px",
+                    marginBottom: "2px",
+                    display: "inline-block"
+                }}
+            >
+
+                <div
+                    style={{
+                        backgroundColor: "transparent",
+                        float: "left",
+                        width: "67px",
+                        paddingTop: "10px",
+                        paddingLeft: "11px",
+                        textAlign: "center",
+                        fontWeight: "bold",
+                        color: "rgb(85, 85, 85)"
+                    }}
+                >
+                    <p
+                        style={{
+                            backgroundColor: "transparent",
+                            color: "rgb(211, 25, 0)",
+                            fontSize: "12px",
+                        }}
+                    >0</p>
+                    <p style={{ backgroundColor: "transparent", lineHeight: "12px" }}>
+                        <span>
+                            <img
+                                style={{
+                                    backgroundColor: "transparent",
+                                    verticalAlign: "middle"
+                                }}
+                            />
+                        </span>
+                        <span
+                            style={{
+                                backgroundColor: "transparent",
+                                color: "rgb(41, 54, 124)",
+                                fontSize: "11px",
+                                fontWeight: "normal"
+                            }}
+                        >
+
+                            0
+                        </span>
+                    </p>
+                </div>
+                <button
+                    style={{
+                        backgroundColor: "transparent",
+                        cursor: "pointer",
+                        verticalAlign: "middle",
+                        fontSize: "12px",
+                        fontFamily:
+                            '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, Dotum, 돋움, sans-serif',
+                        float: "right",
+                        width: "56px",
+                    }}
+                >
+                    <em
+                        style={{
+                            backgroundColor: "transparent",
+                            backgroundImage:
+                                'url("/sp_image.png")',
+                            backgroundRepeat: "no-repeat",
+                            backgroundPositionX: "0px",
+                            backgroundPositionY: "-315px",
+                            display: "inline-block",
+                            width: "56px",
+                            height: "56px",
+                        }}
+                    ></em>
+                </button>
+            </div>
+            <div
+                style={{
+                    backgroundColor: "transparent",
+                    overflowX: "hidden",
+                    overflowY: "hidden",
+                    width: "139px",
+                    marginBottom: "2px",
+                    display: "inline-block",
+                    marginLeft: "10px",
+                }}
+            >
+
+                <button
+                    style={{
+                        backgroundColor: "transparent",
+                        cursor: "pointer",
+                        verticalAlign: "middle",
+                        fontSize: "12px",
+                        fontFamily:
+                            '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, Dotum, 돋움, sans-serif',
+                        float: "left",
+                        width: "56px",
+                    }}
+                >
+                    <em
+                        style={{
+                            backgroundColor: "transparent",
+                            backgroundImage:
+                                'url("https://nstatic.dcinside.com/dc/w/images/sp/sp_img.png?1112")',
+                            backgroundRepeat: "no-repeat",
+                            backgroundPositionX: "0px",
+                            backgroundPositionY: "-377px",
+                            display: "inline-block",
+                            width: "56px",
+                            height: "56px",
+                        }}
+                    />
+                </button>
+                <div
+                    style={{
+                        backgroundColor: "transparent",
+                        float: "right",
+                        width: "64px",
+                        paddingTop: "17px",
+                        paddingRight: "12px",
+                        textAlign: "center",
+                        fontWeight: "bold",
+                        color: "rgb(85, 85, 85)",
+                        fontSize: "16px",
+                    }}
+                >
+                    <p style={{ backgroundColor: "transparent" }}> 0 </p>
+                </div>
+            </div>
+        </div>
+        <div
+            style={{
+                backgroundColor: "transparent",
+                clear: "both",
+                position: "relative",
+                height: "36px",
+                borderTopWidth: "1px",
+                borderTopStyle: "solid",
+                borderTopColor: "rgb(196, 196, 196)"
+            }}
+        >
+            <button
+                style={{
+                    backgroundColor: "rgb(249, 249, 249)",
+                    cursor: "pointer",
+                    verticalAlign: "middle",
+                    float: "left",
+                    width: "95px",
+                    height: "36px",
+                    marginLeft: "1px",
+                    borderRightWidth: "1px",
+                    borderRightStyle: "solid",
+                    borderRightColor: "rgb(196, 196, 196)",
+                    color: "rgb(85, 85, 85)",
+                    textShadow: "rgb(255, 255, 255) 0px 1px",
+                    position: "relative"
+                }}
+            >
+                <em
+                    style={{
+                        backgroundColor: "transparent",
+                        backgroundImage:
+                            'url("/sp_image.png")',
+                        backgroundRepeat: "no-repeat",
+                        width: "23px",
+                        height: "23px",
+                        backgroundPositionX: "-270px",
+                        backgroundPositionY: "-983px",
+                        marginRight: "3px",
+                        marginTop: "2px",
+                        verticalAlign: "-8px",
+                        display: "inline-block"
+                    }}
+                >
+
+                </em>
+                실베추
+            </button>
+            <button
+                style={{
+                    backgroundColor: "rgb(249, 249, 249)",
+                    cursor: "pointer",
+                    verticalAlign: "middle",
+                    width: "96px",
+                    float: "left",
+                    height: "36px",
+                    marginLeft: "1px",
+                    borderRightWidth: "1px",
+                    borderRightStyle: "solid",
+                    borderRightColor: "rgb(196, 196, 196)",
+                    color: "rgb(85, 85, 85)",
+                    textShadow: "rgb(255, 255, 255) 0px 1px",
+                    position: "relative"
+                }}
+            >
+                <em
+                    style={{
+                        backgroundColor: "transparent",
+                        backgroundImage:
+                            'url("/sp_image.png")',
+                        backgroundRepeat: "no-repeat",
+                        width: "17px",
+                        height: "20px",
+                        backgroundPositionX: "-74px",
+                        backgroundPositionY: "-262px",
+                        marginRight: "6px",
+                        verticalAlign: "-4px",
+                        display: "inline-block"
+                    }}
+                >
+
+                </em>
+                공유
+            </button>
+            <button
+                style={{
+                    backgroundColor: "rgb(249, 249, 249)",
+                    cursor: "pointer",
+                    verticalAlign: "middle",
+                    fontSize: "12px",
+                    float: "left",
+                    width: "95px",
+                    height: "36px",
+                    marginLeft: "1px",
+                    color: "rgb(85, 85, 85)",
+                    textShadow: "rgb(255, 255, 255) 0px 1px",
+                    position: "relative"
+                }}
+            >
+                <em
+                    style={{
+                        backgroundColor: "transparent",
+                        backgroundImage:
+                            'url("/sp_image.png")',
+                        backgroundRepeat: "no-repeat",
+                        width: "18px",
+                        height: "20px",
+                        backgroundPositionX: "-74px",
+                        backgroundPositionY: "-241px",
+                        marginRight: "6px",
+                        verticalAlign: "-4px",
+                        display: "inline-block"
+                    }}
+                >
+                </em>
+                신고
+            </button>
+            <div
+                style={{ clear: "both" }}
+            ></div>
+        </div>
+    </div>
+}
+
+function GalleryNFTPublishButton() {
+    return <div
+        style={{
+            backgroundColor: "transparent",
+            position: "absolute",
+            left: "0px",
+            top: "0px",
+            fontSize: "0px",
+        }}
+    >
+
+        <button
+            style={{
+                backgroundColor: "rgb(59, 72, 144)",
+                cursor: "pointer",
+                verticalAlign: "middle",
+                fontSize: "12px",
+                fontFamily:
+                    '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, Dotum, 돋움, sans-serif',
+                textShadow: "rgb(29, 39, 97) 0px -1px",
+                color: "rgb(255, 255, 255)",
+                overflow: "hidden",
+                width: "auto",
+                paddingRight: "12px",
+                paddingLeft: "11px",
+                height: "31px",
+                lineHeight: "29px",
+                marginLeft: "3px",
+                border: "1px solid rgb(41, 54, 124)",
+                borderRadius: "2px",
+                fontWeight: "bold"
+            }}
+        >
+            NFT 발행하기
+        </button>
+        <button
+            style={{
+                backgroundColor: "transparent",
+                cursor: "pointer",
+                verticalAlign: "middle",
+                fontSize: "12px",
+                fontFamily:
+                    '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, Dotum, 돋움, sans-serif',
+                backgroundImage:
+                    'url("https://nstatic.dcinside.com/dc/w/images/sp/sp_image.png")',
+                backgroundRepeat: "no-repeat",
+                display: "inline-block",
+                width: "17px",
+                height: "17px",
+                backgroundPositionX: "-1px",
+                backgroundPositionY: "-1px",
+                lineHeight: "0px",
+                marginLeft: "5px",
+            }}
+        >
+            <span
+                style={{
+                    backgroundColor: "transparent",
+                    position: "absolute",
+                    overflowX: "hidden",
+                    overflowY: "hidden",
+                    visibility: "hidden",
+                    marginTop: "-1px",
+                    marginRight: "-1px",
+                    marginBottom: "-1px",
+                    marginLeft: "-1px",
+                    width: "0px",
+                    top: "-9999px",
+                    fontSize: "0px",
+                }}
+            >
+                엔에프티 안내
+            </span>
+        </button>
+    </div>
+}
+
+export function GalleryContent() {
+    return <div
+        style={{
+            backgroundColor: "transparent",
+            fontFamily:
+                '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, 굴림, Gulim, sans-serif',
+            fontSize: "13px",
+            color: "rgb(51, 51, 51)"
+        }}
+    >
+        <GalleryContentHeader />
+        <div style={{ lineHeight: "22px" }}>
+            <div style={{ backgroundColor: "transparent", marginBottom: "50px" }}>
+                <div
+                    style={{
+                        overflow: "hidden",
+                        position: "relative"
+                    }}
+                >
+                    <div>
+                        <span style={{ backgroundColor: "transparent", marginLeft: "10px" }}>
+                            <img
+                                style={{
+                                    backgroundColor: "transparent",
+                                    maxWidth: "100%",
+                                    width: "550px",
+                                    height: "350px",
+                                }}
+                            />
+                        </span>
+                    </div>
+                    <pre />
+                    <div
+                        style={{
+                            backgroundColor: "transparent",
+                            overflow: "hidden",
+                            width: "900px",
+                        }}
+                    >
+                        <p>
+
+                            s텀 라주르같은걸로 트리밀고 탑젯 처음타니까 고도 올려야한단건
+                            모르는거임 이거말곤 ㄹㅇ 뭐가 없을듯
+                        </p>
+                        <p>
+                            그냥 진짜 몰라서 안올리는게 아닐까 싶음
+                        </p>
+                    </div>
+                </div>
+            </div>
+            <div style={{ backgroundColor: "transparent", position: "relative" }}>
+                <GalleryNFTPublishButton />
+                <GalleryRecommendation />
+            </div>
+            <div
+                style={{
+                    backgroundColor: "transparent",
+                    width: "100%",
+                    overflow: "hidden",
+                    textAlign: "center",
+                    marginTop: "10px",
+                }}
+            />
+            <div
+                style={{
+                    backgroundColor: "transparent",
+                    width: "728px",
+                    marginTop: "20px",
+                    marginRight: "auto",
+                    marginLeft: "auto"
+                }}
+            >
+            </div>
+        </div>
+    </div>
+}
\ No newline at end of file
diff --git a/src/GalleryTitleHeader.tsx b/src/GalleryTitleHeader.tsx
new file mode 100644
index 0000000..fa15c84
--- /dev/null
+++ b/src/GalleryTitleHeader.tsx
@@ -0,0 +1,183 @@
+import { Separator } from "./Separator";
+
+export function GalleryTitleHeader() {
+    return <header>
+        <div
+            style={{
+                backgroundColor: "transparent",
+                height: "37px",
+                marginBottom: "3px",
+                paddingTop: "4px",
+            }}
+        >
+            <div style={{ float: "left" }}>
+                <h2
+                    style={{
+                        backgroundColor: "transparent",
+                        marginTop: "-2px",
+                        marginRight: "6px",
+                        marginLeft: "2px",
+                        float: "left",
+                        fontSize: "24px",
+                        maxWidth: "420px",
+                        fontFamily: "'Nanum Gothic', sans-serif",
+                        letterSpacing: "-1px",
+                        margin: "2px 8px 0 3px",
+                        "textOverflow": "ellipsis",
+                        overflow: "hidden",
+                        whiteSpace: "nowrap",
+                        color: "#29367c",
+                    }}
+                >
+                    <a style={{ color: "rgb(41, 54, 124)" }}>
+                        워썬더 갤러리
+                        <div
+                            style={{
+                                backgroundColor: "transparent",
+                                backgroundImage:
+                                    'url("/sp_image.png")',
+                                backgroundRepeat: "no-repeat",
+                                display: "inline-block",
+                                verticalAlign: "top",
+                                marginLeft: "4px",
+                                width: "22px",
+                                height: "22px",
+                                backgroundPositionX: "-195px",
+                                backgroundPositionY: "-844px",
+                                marginTop: "3px",
+                            }}
+                        >
+                        </div>
+                    </a>
+                </h2>
+                <div style={{ clear: "both" }}></div>
+            </div>
+            <div style={{ backgroundColor: "transparent", float: "right", paddingTop: "12px" }}>
+                <div style={{
+                        backgroundColor: "transparent",
+                        position: "relative",
+                        display: "inline-block"
+                    }}>
+                    <button
+                        style={{
+                            backgroundColor: "transparent",
+                            cursor: "pointer",
+                            verticalAlign: "top",
+                            fontSize: "12px",
+                            color: "rgb(51, 51, 51)",
+                            position: "relative"
+                        }}
+                    >
+                        설정
+                    </button>
+                    <span style={{ backgroundColor: "transparent", marginRight: "2px" }}>
+                        <em
+                            style={{
+                                backgroundColor: "transparent",
+                                backgroundImage:
+                                    'url("/sp_image.png")',
+                                backgroundRepeat: "no-repeat",
+                                display: "inline-block",
+                                width: "6px",
+                                height: "6px",
+                                marginLeft: "4px",
+                                verticalAlign: "4px",
+                                lineHeight: "30px",
+                                backgroundPositionX: "-70px",
+                                backgroundPositionY: "-59px"
+                            }}
+                        >
+                        </em>
+                    </span>
+                </div>
+                <Separator />
+                <button
+                    style={{
+                        backgroundColor: "transparent",
+                        cursor: "pointer",
+                        verticalAlign: "top",
+                        fontSize: "12px",
+                        fontFamily:
+                            '-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "맑은 고딕", arial, Dotum, 돋움, sans-serif',
+                        color: "rgb(51, 51, 51)"
+                    }}
+                >
+                    연관 갤러리(2/8)
+                    <span
+                        style={{
+                            backgroundColor: "transparent",
+                            marginRight: "2px",
+                            marginLeft: "2px",
+                            display: "none"
+                        }}
+                    >
+                    </span>
+                    <em
+                        style={{
+                            backgroundColor: "transparent",
+                            backgroundImage:
+                                'url("/sp_image.png")',
+                            backgroundRepeat: "no-repeat",
+                            display: "inline-block",
+                            width: "9px",
+                            height: "5px",
+                            backgroundPositionX: "-115px",
+                            backgroundPositionY: "-43px",
+                            verticalAlign: "1px",
+                            marginLeft: "2px",
+                        }}
+                    >
+                    </em>
+                </button>
+                <Separator />
+                <button
+                    style={{
+                        backgroundColor: "transparent",
+                        cursor: "pointer",
+                        verticalAlign: "top",
+                        fontSize: "12px",
+                        color: "rgb(51, 51, 51)"
+                    }}
+                >
+                    갤주소 복사
+                </button>
+                <Separator />
+                <button
+                    style={{
+                        backgroundColor: "transparent",
+                        cursor: "pointer",
+                        verticalAlign: "top",
+                        fontSize: "12px",
+                        color: "rgb(51, 51, 51)"
+                    }}
+                >이용안내</button>
+                <Separator />
+                <button
+                    style={{
+                        backgroundColor: "transparent",
+                        cursor: "pointer",
+                        verticalAlign: "top",
+                        fontSize: "12px",
+                        color: "rgb(51, 51, 51)"
+                    }}
+                >
+                    <em
+                        style={{
+                            backgroundColor: "transparent",
+                            backgroundImage:
+                                'url("/sp_image.png")',
+                            backgroundRepeat: "no-repeat",
+                            display: "inline-block",
+                            width: "15px",
+                            height: "15px",
+                            backgroundPositionX: "-56px",
+                            backgroundPositionY: "-168px",
+                            marginTop: "1px",
+                        }}
+                    >
+                    </em>
+                </button>
+            </div>
+        </div>
+    </header >
+}
\ No newline at end of file
diff --git a/src/Separator.tsx b/src/Separator.tsx
new file mode 100644
index 0000000..5ecf52a
--- /dev/null
+++ b/src/Separator.tsx
@@ -0,0 +1,11 @@
+export function Separator() {
+    return <div style={{
+        content: "",
+        display: "inline-block",
+        width: "1px",
+        height: "12px",
+        background: "#ccc",
+        margin: "0 10px 0 6px",
+        verticalAlign: "-1px",
+    }} />;
+}
diff --git a/vite.config.ts b/vite.config.ts
index 2328e17..b2ef06a 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,7 +1,10 @@
 import { defineConfig } from 'vite'
 import react from '@vitejs/plugin-react-swc'
+// import tailwindcss from '@tailwindcss/vite'
 
 // https://vite.dev/config/
 export default defineConfig({
-  plugins: [react()],
+  plugins: [
+    react(),
+  ],
 })