From aaec7fa071a31c8a92a48902ccd718fd552b781c Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Sun, 5 Apr 2026 14:07:46 +0900
Subject: [PATCH] =?UTF-8?q?style(mobile):=20=EC=98=88=EB=8A=A5=20=EC=8D=B8?=
 =?UTF-8?q?=EB=84=A4=EC=9D=BC=20=EB=B8=94=EB=9F=AC=20=EB=B0=B0=EA=B2=BD=20?=
 =?UTF-8?q?+=20=EB=86=92=EC=9D=B4=20=EC=B6=95=EC=86=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 높이 h-52로 고정
- 배경에 동일 이미지를 scale-110 blur-2xl로 깔아서 빈 공간 채움
- 메인 이미지는 object-contain으로 원본 비율 유지

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../pages/mobile/schedule/ScheduleDetail.jsx  | 23 +++++++++++++------
 1 file changed, 16 insertions(+), 7 deletions(-)

diff --git a/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx b/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx
index d1e343b..ac20f85 100644
--- a/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx
+++ b/frontend/src/pages/mobile/schedule/ScheduleDetail.jsx
@@ -489,16 +489,25 @@ function MobileVarietySection({ schedule }) {
   return (
     <div className="space-y-3">
       {/* 썸네일 카드 */}
-      <div className="bg-white rounded-xl overflow-hidden shadow-sm flex items-center justify-center">
+      <div className="rounded-xl overflow-hidden shadow-sm h-52 relative">
         {hasThumbnail ? (
-          <img
-            src={schedule.thumbnailUrl}
-            alt={schedule.title}
-            className="max-h-[300px] object-contain"
-          />
+          <>
+            {/* 블러 배경 */}
+            <img
+              src={schedule.thumbnailUrl}
+              alt=""
+              className="absolute inset-0 w-full h-full object-cover scale-110 blur-2xl opacity-60"
+            />
+            {/* 메인 이미지 */}
+            <img
+              src={schedule.thumbnailUrl}
+              alt={schedule.title}
+              className="relative w-full h-full object-contain"
+            />
+          </>
         ) : (
           <div
-            className="w-full h-36 flex items-center justify-center"
+            className="w-full h-full flex items-center justify-center"
             style={{ backgroundColor: `${categoryColor}10` }}
           >
             <Tv size={36} style={{ color: categoryColor }} strokeWidth={1.5} />