diff --git a/layers/components/layouts/EventNavigation.vue b/layers/components/layouts/EventNavigation.vue
index 0ec6eed..eeaf0fc 100644
--- a/layers/components/layouts/EventNavigation.vue
+++ b/layers/components/layouts/EventNavigation.vue
@@ -99,12 +99,14 @@ onMounted(async () => {
   @apply flex flex-col gap-4 w-[180px] h-full overflow-y-scroll rounded-[20px] p-4 pr-1 bg-[rgba(25,25,25,0.5)] shadow-[0_2px_4px_0_rgba(0,0,0,0.06)] backdrop-blur-[25px] transition-opacity duration-300 ease-in-out;
 }
 .item-thumbnail {
-  @apply overflow-hidden relative w-[148px] h-[75px] rounded-[10px]
-  before:content-[''] before:absolute before:top-0 before:left-0 before:w-full before:h-full before:rounded-[10px] before:border-[1px] before:border-white/[0.08]
-  after:content-[''] after:absolute after:top-0 after:left-0 after:w-full after:h-full after:bg-[lightgray]/50;
+  @apply overflow-hidden relative w-[148px] h-[75px] rounded-[10px] bg-[#333333]
+  after:content-[''] after:absolute after:top-0 after:left-0 after:w-full after:h-full after:rounded-[10px] after:border-[1px] after:border-[rgba(255,255,255,0.08)] after:transition-all after:duration-300 after:ease-in-out;
+}
+.item-thumbnail img {
+  @apply opacity-50 transition-opacity duration-300 ease-in-out;
 }
 .item-title {
-  @apply block mt-2 text-center text-[#ebebeb] text-[14px] font-normal leading-[20px] tracking-[-0.42px] opacity-50;
+  @apply block mt-2 text-center text-[#FFF] text-[14px] font-normal leading-[20px] tracking-[-0.42px] opacity-50 transition-opacity duration-300 ease-in-out;
 }
 .btn-control {
   @apply absolute top-3 right-[-40px] bg-black/20 shadow-[0_1.667px_3.333px_0_rgba(0,0,0,0.06)] backdrop-blur-[12.5px] rotate-180
@@ -121,12 +123,20 @@ onMounted(async () => {
   @apply pointer-events-none opacity-0;
 }
 
-.router-link-active .item-thumbnail,
 .item-link:hover .item-thumbnail {
-  @apply before:border-[var(--primary)] after:opacity-0;
+  @apply after:border-[rgba(255,255,255,1)];
+}
+.router-link-active .item-thumbnail {
+  @apply after:border-[var(--primary)] !important;
+}
+.router-link-active .item-thumbnail img,
+.item-link:hover .item-thumbnail img {
+  @apply opacity-100;
 }
-.router-link-active .item-title,
 .item-link:hover .item-title {
+  @apply opacity-100;
+}
+.router-link-active .item-title {
   @apply text-[var(--primary)] opacity-100;
 }
 </style>
diff --git a/layers/components/layouts/Main.vue b/layers/components/layouts/Main.vue
index 28421ec..484dfe9 100644
--- a/layers/components/layouts/Main.vue
+++ b/layers/components/layouts/Main.vue
@@ -60,8 +60,6 @@ const setupSeoMeta = (metaTag: PageDataMetaTag) => {
   })
 }
 
-provide('pinToMain', pinToMain)
-
 // 메타 태그 설정 감시
 watchEffect(() => {
   if (shouldShowMetaTag.value && props.pageData?.meta_tag_json) {