fix. GR_VISUAL_02 기획서 수정 적용

layers/components/blocks/slide/CenterHighlight.vue

@@ -5,6 +5,7 @@ import type { SlideItemSize } from '#layers/types/components/slide'
 
 interface Props {
   slideItemSize: SlideItemSize
+  type?: 'loop' | 'slide'
   autoplay?: boolean | string
   arrows?: boolean
   pagination?: boolean
@@ -12,6 +13,7 @@ interface Props {
 }
 
 const props = withDefaults(defineProps<Props>(), {
+  type: 'loop',
   autoplay: false,
   arrows: true,
   pagination: true,
@@ -19,7 +21,7 @@ const props = withDefaults(defineProps<Props>(), {
 
 const options = computed((): ResponsiveOptions => {
   return {
-    type: 'loop',
+    type: props.type,
     focus: 'center',
     autoWidth: true,
     autoHeight: true,

layers/components/widgets/BannerList.vue

@@ -15,12 +15,17 @@ const props = withDefaults(defineProps<BannerListProps>(), {
   arrows: true,
   pagination: true,
 })
+
+const isMultipleItems = computed(() => {
+  return props.slideItemList.length > 1
+})
 </script>
 
 <template>
   <BlocksSlideCenterHighlight
     :slide-item-size="props.slideItemSize"
-    :arrows="true"
+    :type="isMultipleItems ? 'loop' : 'slide'"
+    :arrows="isMultipleItems ? true : false"
     :pagination="false"
     class="mt-[36px] md:mt-[60px]"
   >
@@ -46,11 +51,17 @@ const props = withDefaults(defineProps<BannerListProps>(), {
   width: var(--banner-width-mo-active);
   height: var(--banner-height-mo-active);
 }
+.center-highlight:deep(.splide__slide.is-active .card-link) {
+  pointer-events: auto;
+}
 .news-center-highlight {
   width: var(--banner-width-mo);
   height: var(--banner-height-mo);
   transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
 }
+.center-highlight:deep(.splide__slide .card-link) {
+  pointer-events: none;
+}
 
 /* PC 스타일 */
 @media (min-width: 1024px) {

layers/templates/GrVisual02/index.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { SplideSlide } from '@splidejs/vue-splide'
 import { getComponentGroup, getComponentGroupAry } from '#layers/utils/dataUtil'
 
 interface Props {
@@ -100,6 +99,7 @@ const bannerSize = {
         class="mt-[48px] md:mt-[72px]"
       />
       <WidgetsBannerList
+        v-if="bannerListData.length > 0"
         :slide-item-list="bannerListData"
         :slide-item-size="bannerSize"
         :arrows="true"