fix. 코드 리팩토링

layers/components/blocks/VisualContent.vue

@@ -11,27 +11,20 @@ const props = withDefaults(defineProps<Props>(), {
   objectFit: 'contain',
 })
 
-const breakpoints = useResponsiveBreakpointsReliable()
+const { getCurrentSrc } = useResponsiveSrc()
 
+const imageSrc = computed(() => {
+  return getCurrentSrc(props.resourcesData?.res_path)
+})
 const displayText = computed(() => {
   return props.resourcesData?.display?.text || 'image'
 })
-const imageSrc = computed(() => {
-  return getResponsiveSrc(props.resourcesData?.res_path)
-})
 const colorName = computed(() => {
   return props.resourcesData?.display?.color_name
 })
 const colorCode = computed(() => {
   return props.resourcesData?.display?.color_code
 })
-const currentImageSrc = computed(() => {
-  if (!imageSrc.value) return ''
-
-  return breakpoints.value.isMobile
-    ? imageSrc.value.mobileSrc || ''
-    : imageSrc.value.pcSrc || ''
-})
 
 // HTML 콘텐츠 정리 (줄바꿈 처리)
 const sanitizedContent = computed(() => {
@@ -42,8 +35,8 @@ const sanitizedContent = computed(() => {
 <template>
   <!-- 이미지 -->
   <img
-    v-if="isTypeImage(resourcesData?.resource_type) && currentImageSrc"
-    :src="currentImageSrc"
+    v-if="isTypeImage(resourcesData?.resource_type) && imageSrc"
+    :src="imageSrc"
     :alt="alt || displayText"
     :class="`w-full h-full object-${objectFit}`"
     loading="lazy"

layers/components/blocks/slide/Thumbnail.vue

@@ -32,8 +32,6 @@ defineExpose({
   thumbsInst: computed(() => thumbsInst),
 })
 
-const breakpoints = useResponsiveBreakpointsReliable()
-
 const mainRef = ref<InstanceType<typeof Splide> | null>(null)
 const thumbsRef = ref<InstanceType<typeof Splide> | null>(null)
 
@@ -72,17 +70,10 @@ const getThumbnailSrc = (item: PageDataTemplateComponentSet) => {
     return mediaComponent ? getMediaImgSrc(mediaComponent) : ''
   }
 
-  const pagenaviThumbnailComponent = getComponentGroup(
-    item,
-    'pagenaviThumbnail'
-  )
-  const pagenaviThumbnailSrc = getResponsiveSrc(
-    pagenaviThumbnailComponent?.res_path
-  )
+  const thumbnailComponent = getComponentGroup(item, 'pagenaviThumbnail')
+  const thumbnailPath = getDeviceSrc(thumbnailComponent?.res_path)
 
-  return breakpoints.value.isMobile
-    ? pagenaviThumbnailSrc?.mobileSrc
-    : pagenaviThumbnailSrc?.pcSrc || ''
+  return thumbnailPath?.pcSrc
 }
 
 const handleMove = (