feat.[SWV-806] 템플릿 모션 적용

layers/components/blocks/Button/Home.vue

@@ -31,4 +31,7 @@ const analytics = {
   @apply fixed top-3 right-3 mt-[calc(var(--scroll-position,48px)+48px)] bg-black/20 shadow-[0_1.667px_3.333px_0_rgba(0,0,0,0.06)] backdrop-blur-[12.5px] z-[100]
   sm:top-5 md:top-6 md:right-8 md:mt-[calc(var(--scroll-position,64px)+64px)];
 }
+.btn-home:hover :deep(.icon) {
+  @apply scale-[1.08];
+}
 </style>

layers/components/blocks/Button/ScrollTop.vue

@@ -36,4 +36,7 @@ const handleScrollToTop = () => {
 .btn-top {
   @apply bg-[image:var(--button-top)] bg-center bg-cover bg-no-repeat;
 }
+.btn-top:hover :deep(.icon) {
+  @apply -translate-y-[3px];
+}
 </style>

layers/components/blocks/Button/SlideArrows.vue

@@ -45,3 +45,13 @@ const handleArrowClick = (direction: 'prev' | 'next') => {
     </AtomsButtonCircle>
   </div>
 </template>
+
+<style scoped>
+.splide__arrow--prev:hover :deep(.icon) {
+  @apply -translate-x-[3px];
+}
+
+.splide__arrow--next:hover :deep(.icon) {
+  @apply translate-x-[3px];
+}
+</style>