diff --git a/src/components/Roof2.jsx b/src/components/Roof2.jsx
index e384901e..e2b40634 100644
--- a/src/components/Roof2.jsx
+++ b/src/components/Roof2.jsx
@@ -108,28 +108,24 @@ export default function Roof2() {
     }
   }
 
-  /**
-   * canvas 사이즈 변경 함수
-   */
-  const canvasSizeMode = () => {
-    if (canvas) {
-      canvas.setWidth(horizontalSize)
-      canvas.setHeight(verticalSize)
-      canvas.renderAll()
-
-      setCanvasSize(() => ({
-        vertical: verticalSize,
-        horizontal: horizontalSize,
-      }))
-    }
-  }
+  useEffect(() => {
+    setCanvasSize({ ...canvasSize, vertical: verticalSize, horizontal: horizontalSize })
+  }, [verticalSize, horizontalSize])
 
   /**
    * 값 변경시
    */
+  // useEffect(() => {
+  //   canvasSizeMode()
+  // }, [verticalSize, horizontalSize])
   useEffect(() => {
-    canvasSizeMode()
-  }, [verticalSize, horizontalSize])
+    const { vertical, horizontal } = canvasSize
+    if (vertical !== verticalSize || horizontal !== horizontalSize) {
+      canvas.setWidth(horizontalSize)
+      canvas.setHeight(verticalSize)
+      canvas.renderAll()
+    }
+  }, [canvasSize, canvas])
 
   const makeQPolygon = () => {
     const type1 = [