diff --git a/src/components/common/ScrollX.vue b/src/components/common/ScrollX.vue
index 8050f71..ee6e41e 100644
--- a/src/components/common/ScrollX.vue
+++ b/src/components/common/ScrollX.vue
@@ -1,10 +1,10 @@
 <template>
   <div ref="wrapper" class="wrapper" @mousewheel.prevent="handleMouseWheel">
     <template v-if="showArrow && isOverflow">
-      <div class="left" @click="handleMouseWheel({ wheelDelta: 120 })">
+      <div class="left dark:bg-dark!" @click="handleMouseWheel({ wheelDelta: 120 })">
         <icon-ic:baseline-keyboard-arrow-left />
       </div>
-      <div class="right" @click="handleMouseWheel({ wheelDelta: -120 })">
+      <div class="right dark:bg-dark!" @click="handleMouseWheel({ wheelDelta: -120 })">
         <icon-ic:baseline-keyboard-arrow-right />
       </div>
     </template>