diff --git a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
index cf238166..92bc7f3c 100644
--- a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
+++ b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
@@ -54,7 +54,7 @@ export default function CircuitTrestleSetting({ id }) {
   const [seletedOption, setSeletedOption] = useState(null)
   const { setModuleStatisticsData } = useCircuitTrestle()
   const { handleCanvasToPng } = useImgLoader()
-  const { saveCanvas } = usePlan()
+
   const passivityCircuitAllocationRef = useRef()
   const { setIsGlobalLoading } = useContext(QcastContext)
 
@@ -361,11 +361,8 @@ export default function CircuitTrestleSetting({ id }) {
 
     if (result) {
       handleCanvasToPng(2)
-      // 캔버스 저장
-      await saveCanvas(false)
       // 견적서 저장
       await saveEstimate(result)
-      setAllModuleSurfaceIsComplete(true)
     } else {
       setIsGlobalLoading(false)
     }
diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
index d836147c..127e7742 100644
--- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
+++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
@@ -9,7 +9,7 @@ import WithDraggable from '@/components/common/draggable/WithDraggable'
 
 import { useCanvasSetting } from '@/hooks/option/useCanvasSetting'
 import { useRecoilState, useRecoilValue } from 'recoil'
-import { addedRoofsState, roofMaterialsAtom } from '@/store/settingAtom'
+import { addedRoofsState, roofDisplaySelector, roofMaterialsAtom } from '@/store/settingAtom'
 import { useCommonCode } from '@/hooks/common/useCommonCode'
 import QSelectBox from '@/components/common/select/QSelectBox'
 import { globalLocaleStore } from '@/store/localeAtom'
@@ -18,6 +18,7 @@ import { onlyNumberInputChange } from '@/util/input-utils'
 import { getChonByDegree, getDegreeByChon } from '@/util/canvas-util'
 import { usePolygon } from '@/hooks/usePolygon'
 import { canvasState } from '@/store/canvasAtom'
+import { useRoofFn } from '@/hooks/common/useRoofFn'
 
 /**
  * 지붕 레이아웃
@@ -41,7 +42,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
   const [currentRoof, setCurrentRoof] = useState(null) /** 현재 선택된 지붕재 정보 */
   const { closePopup } = usePopup() /** usePopup에서 closePopup 함수 가져오기 */
   const { drawDirectionArrow } = usePolygon()
+  const { setSurfaceShapePattern } = useRoofFn()
   const canvas = useRecoilValue(canvasState)
+  const roofDisplay = useRecoilValue(roofDisplaySelector)
 
   const roofRef = {
     roofCd: useRef(null),
@@ -243,6 +246,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
     const roofs = canvas.getObjects().filter((obj) => obj.roofMaterial?.index === 0)
 
     roofs.forEach((roof) => {
+      /** 모양 패턴 설정 */
+      setSurfaceShapePattern(roof, roofDisplay.column, false, { ...roofInfo })
       roof.roofMaterial = { ...roofInfo }
       drawDirectionArrow(roof)
     })
diff --git a/src/hooks/useEstimate.js b/src/hooks/useEstimate.js
index a535de49..ac1f5c07 100644
--- a/src/hooks/useEstimate.js
+++ b/src/hooks/useEstimate.js
@@ -9,6 +9,8 @@ import { GlobalDataContext } from '@/app/GlobalDataProvider'
 import { QcastContext } from '@/app/QcastProvider'
 import { currentCanvasPlanState } from '@/store/canvasAtom'
 import { loginUserStore } from '@/store/commonAtom'
+import { useTrestle } from '@/hooks/module/useTrestle'
+import { usePlan } from '@/hooks/usePlan'
 
 export function useEstimate() {
   const { managementStateLoaded } = useContext(GlobalDataContext)
@@ -20,13 +22,15 @@ export function useEstimate() {
   const { promisePost } = useAxios()
   const { swalFire } = useSwal()
 
+  const { setAllModuleSurfaceIsComplete } = useTrestle()
+  const { saveCanvas } = usePlan()
+
   /**
    * 도면 견적서 저장
    *
    * @param {Object} estimateParam - 견적서 저장 데이터
    */
   const saveEstimate = async (estimateParam) => {
-
     const userId = loginUserState.userId
     const saleStoreId = managementStateLoaded.saleStoreId
     const objectNo = currentCanvasPlan.objectNo
@@ -56,6 +60,11 @@ export function useEstimate() {
 
     await promisePost({ url: '/api/estimate/save-estimate', data: saveEstimateData })
       .then(async () => {
+        setAllModuleSurfaceIsComplete(true)
+
+        // 캔버스 저장
+        await saveCanvas(false)
+
         /* 견적서 저장이 완료되면 견적서 페이지로 이동 */
         moveEstimate(planNo, objectNo)
       })