diff --git a/pages/module/discovery/DiscoveryCardComponent.vue b/pages/module/discovery/DiscoveryCardComponent.vue
index 6f0ad06..30edc9d 100644
--- a/pages/module/discovery/DiscoveryCardComponent.vue
+++ b/pages/module/discovery/DiscoveryCardComponent.vue
@@ -34,9 +34,5 @@ onMounted(() => {
diff --git a/pages/module/discovery/DiscoveryCradContentList.vue b/pages/module/discovery/DiscoveryCradContentList.vue
index cc7d641..f96cff4 100644
--- a/pages/module/discovery/DiscoveryCradContentList.vue
+++ b/pages/module/discovery/DiscoveryCradContentList.vue
@@ -7,8 +7,14 @@
:key="index"
>
-
- {{ item.topic }}
+
+
+
+ {{ item.topic }}
@@ -16,9 +22,12 @@
diff --git a/pages/module/discovery/styles/DiscoveryCardComponent.scss b/pages/module/discovery/styles/DiscoveryCardComponent.scss
new file mode 100644
index 0000000..9da07fd
--- /dev/null
+++ b/pages/module/discovery/styles/DiscoveryCardComponent.scss
@@ -0,0 +1,5 @@
+.container {
+ width: 100%;
+ flex: 1;
+ margin-bottom: 12px;
+}
diff --git a/pages/module/discovery/styles/DiscoveryCradContentList.scss b/pages/module/discovery/styles/DiscoveryCradContentList.scss
new file mode 100644
index 0000000..16723f6
--- /dev/null
+++ b/pages/module/discovery/styles/DiscoveryCradContentList.scss
@@ -0,0 +1,33 @@
+.container {
+ .container-scroll {
+ display: flex;
+ flex-direction: row;
+ overflow-x: auto;
+ margin-top: 4px;
+
+ .mk-card-item {
+ display: flex;
+ flex-direction: column;
+ align-items: start;
+ width: 188px;
+ height: 154px;
+ background-color: #ffffff;
+ border-radius: 10px;
+ margin-right: 8px;
+ position: relative;
+
+ .card-img {
+ width: 188px;
+ height: 112px;
+ }
+
+ .card-text {
+ padding: 12px;
+ text-align: center;
+ font-weight: 500;
+ font-size: 12px;
+ color: #333333;
+ }
+ }
+ }
+}