diff --git a/src/components/app/top-nameCard.vue b/src/components/app/top-nameCard.vue
index 17f0ec3c..35ca64ad 100644
--- a/src/components/app/top-nameCard.vue
+++ b/src/components/app/top-nameCard.vue
@@ -49,7 +49,6 @@ const bgImage = computed<string>(() => {
   justify-content: flex-start;
   border: 1px solid var(--common-shadow-1);
   border-radius: 4px 50px 50px 4px;
-  margin-bottom: 8px;
   background-color: var(--box-bg-1);
   background-image: v-bind(bgImage); /* stylelint-disable-line value-keyword-case */
   background-position: right;
diff --git a/src/components/userAchi/tua-achi-list.vue b/src/components/userAchi/tua-achi-list.vue
index 36805f9f..fc817a37 100644
--- a/src/components/userAchi/tua-achi-list.vue
+++ b/src/components/userAchi/tua-achi-list.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="tua-al-container">
-    <div v-if="ncData !== undefined">
+    <div v-if="ncData !== undefined" class="tua-al-nc">
       <TopNameCard :data="ncData" @selected="showNc = true" :finish="isFinish" />
     </div>
     <v-virtual-scroll :items="renderAchi" :item-height="60" class="tua-al-list">
@@ -160,6 +160,10 @@ function switchAchiInfo(next: boolean): void {
   overflow-y: auto;
 }
 
+.tua-al-nc {
+  margin-bottom: 8px;
+}
+
 .tua-al-list {
   padding-right: 10px;
 }
diff --git a/src/pages/WIKI/NameCard.vue b/src/pages/WIKI/NameCard.vue
index 512e1d43..79a89105 100644
--- a/src/pages/WIKI/NameCard.vue
+++ b/src/pages/WIKI/NameCard.vue
@@ -45,7 +45,7 @@
   <div class="tw-nc-list">
     <v-virtual-scroll class="v-scroll" :items="sortNameCardsData" :item-height="80" item-key="id">
       <template #default="{ item }">
-        <TopNameCard :data="item" @selected="showNameCard(item)" />
+        <TopNameCard class="item" :data="item" @selected="showNameCard(item)" />
       </template>
     </v-virtual-scroll>
   </div>
@@ -193,6 +193,10 @@ function searchNameCard(): void {
 
   .v-scroll {
     padding-right: 8px;
+
+    .item {
+      margin-bottom: 8px;
+    }
   }
 }