diff --git a/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx b/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
index b9875736..7506ee65 100644
--- a/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
+++ b/frontend/lib/registry/components/split-panel-layout/SplitPanelLayoutComponent.tsx
@@ -57,7 +57,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
     ? {
         // 반응형 모드: position relative, 그리드 컨테이너가 제공하는 크기 사용
         position: "relative",
-        // width 제거 - 그리드 컬럼이 결정
+        width: "100%", // 🆕 부모 컨테이너 너비에 맞춤
         height: `${component.style?.height || 600}px`,
         border: "1px solid #e5e7eb",
       }
@@ -66,7 +66,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
         position: "absolute",
         left: `${component.style?.positionX || 0}px`,
         top: `${component.style?.positionY || 0}px`,
-        width: `${component.style?.width || 1000}px`,
+        width: "100%", // 🆕 부모 컨테이너 너비에 맞춤 (그리드 기반)
         height: `${component.style?.height || 600}px`,
         zIndex: component.style?.positionZ || 1,
         cursor: isDesignMode ? "pointer" : "default",
@@ -272,7 +272,7 @@ export const SplitPanelLayoutComponent: React.FC<SplitPanelLayoutComponentProps>
           onClick?.(e);
         }
       }}
-      className={`flex overflow-hidden rounded-lg bg-white shadow-sm ${isPreview ? "w-full" : ""}`}
+      className="flex w-full overflow-hidden rounded-lg bg-white shadow-sm"
     >
       {/* 좌측 패널 */}
       <div