diff --git a/src/components/auth/Login.jsx b/src/components/auth/Login.jsx
index af50a515..98f7a5b6 100644
--- a/src/components/auth/Login.jsx
+++ b/src/components/auth/Login.jsx
@@ -87,6 +87,7 @@ export default function Login() {
     }
     await promisePost({ url: '/api/login/v1.0/login', data: param })
       .then((res) => {
+        console.log('🚀 ~ .then ~ res:', res)
         if (res) {
           if (res.data.result.resultCode === 'S') {
             setSession(res.data.data)
diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
index a6773d4c..a39cd4d4 100644
--- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
+++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
@@ -283,7 +283,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                             {/* <select className="select-light dark" name="roofGap" ref={roofRef.rafter}>
                               {raftCodes.map((raft, index) => {
                                 return (
-                                  <option key={index} value={raft.clCode}>
+                                  <option key={index} value={raft.clCode} selected={currentRoofMaterial.raft === raft.clCode}>
                                     {raft.clCodeNm}
                                   </option>
                                 )
diff --git a/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx b/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
index 1d0eeec9..260e39b1 100644
--- a/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
+++ b/src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
@@ -25,17 +25,17 @@ export default function RoofAllocationSetting(props) {
     roofList,
     handleDefaultRoofMaterial,
     handleChangeRoofMaterial,
+    handleChangeRaft,
+    handleChangeLayout,
   } = useRoofAllocationSetting(id)
-  const { fetchBasicSettings } = useCanvasSetting()
   const { findCommonCode } = useCommonCode()
   const [raftCodes, setRaftCodes] = useState([])
   const globalLocale = useRecoilValue(globalLocaleStore)
   useEffect(() => {
-    fetchBasicSettings()
     const raftCodeList = findCommonCode('203800')
-    console.log('🚀 ~ useEffect ~ raftCodeList:', raftCodeList)
-    setRaftCodes(raftCodeList)
+    setRaftCodes(raftCodeList.map((raft) => ({ ...raft, value: raft.clCode, name: raft.clCodeNm })))
   }, [])
+
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lr mount`}>
@@ -149,11 +149,21 @@ export default function RoofAllocationSetting(props) {
                     )}
                     <div className="block-box">
                       <div className="icon-btn-wrap">
-                        <button className={roof.layout === ROOF_MATERIAL_LAYOUT.PARALLEL ? 'act' : ''}>
+                        <button
+                          className={roof.layout === ROOF_MATERIAL_LAYOUT.PARALLEL ? 'act' : ''}
+                          onClick={() => {
+                            handleChangeLayout(ROOF_MATERIAL_LAYOUT.PARALLEL, index)
+                          }}
+                        >
                           {getMessage('modal.roof.alloc.select.parallel')}
                           <i className="allocation01"></i>
                         </button>
-                        <button className={roof.layout === ROOF_MATERIAL_LAYOUT.STAIRS ? 'act' : ''}>
+                        <button
+                          className={roof.layout === ROOF_MATERIAL_LAYOUT.STAIRS ? 'act' : ''}
+                          onClick={() => {
+                            handleChangeLayout(ROOF_MATERIAL_LAYOUT.STAIRS, index)
+                          }}
+                        >
                           {getMessage('modal.roof.alloc.select.stairs')} <i className="allocation02"></i>
                         </button>
                       </div>
diff --git a/src/components/header/Header.jsx b/src/components/header/Header.jsx
index b8cfafd2..2e2e98cd 100644
--- a/src/components/header/Header.jsx
+++ b/src/components/header/Header.jsx
@@ -85,9 +85,9 @@ export default function Header(props) {
       })
   }
 
-  useEffect(() => {
-    getAutoLoginParam()
-  }, [userSession])
+  // useEffect(() => {
+  //   getAutoLoginParam()
+  // }, [userSession])
 
   const menus = [
     { id: 0, name: 'header.menus.home', url: '/', children: [] },
diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js
index 26b78b51..59cb4eef 100644
--- a/src/hooks/option/useCanvasSetting.js
+++ b/src/hooks/option/useCanvasSetting.js
@@ -125,6 +125,9 @@ export function useCanvasSetting() {
 
   //지붕재 초기세팅
   const addRoofMaterials = async () => {
+    if (roofMaterials.length !== 0) {
+      return
+    }
     const { data } = await getRoofMaterialList()
     const roofLists = data.map((item, idx) => ({
       ...item,
diff --git a/src/hooks/roofcover/useRoofAllocationSetting.js b/src/hooks/roofcover/useRoofAllocationSetting.js
index ff20c0cb..d2215131 100644
--- a/src/hooks/roofcover/useRoofAllocationSetting.js
+++ b/src/hooks/roofcover/useRoofAllocationSetting.js
@@ -1,6 +1,6 @@
 import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
 import { canvasState, currentMenuState, currentObjectState } from '@/store/canvasAtom'
-import { useEffect, useState } from 'react'
+import { useEffect, useRef, useState } from 'react'
 import { useSwal } from '@/hooks/useSwal'
 import { usePolygon } from '@/hooks/usePolygon'
 import { basicSettingState, roofDisplaySelector, roofMaterialsSelector, selectedRoofMaterialSelector } from '@/store/settingAtom'
@@ -30,15 +30,12 @@ export function useRoofAllocationSetting(id) {
   const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
   const [basicSetting, setBasicSetting] = useRecoilState(basicSettingState)
   const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) // 팝업 내 기준 지붕재
-  const [roofList, setRoofList] = useState([])
+  const [roofList, setRoofList] = useState(basicSetting.roofs) // 배치면 초기설정에서 선택한 지붕재 배열
   const [editingLines, setEditingLines] = useState([])
+  const isFirstRef = useRef(0)
 
   const { setSurfaceShapePattern } = useRoofFn()
 
-  useEffect(() => {
-    setRoofList(basicSetting.roofs)
-  }, [basicSetting])
-
   useEffect(() => {
     const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // roofPolygon.innerLines
 
@@ -211,6 +208,11 @@ export function useRoofAllocationSetting(id) {
 
   // 지붕재 변경
   const handleChangeRoofMaterial = (value, index) => {
+    if (isFirstRef.current === 0) {
+      isFirstRef.current++
+      return
+    }
+
     const selectedRoofMaterial = roofMaterials.find((roof) => roof.roofMatlCd === value.id)
     const newRoofList = roofList.map((roof, idx) => {
       if (idx === index) {
@@ -231,6 +233,31 @@ export function useRoofAllocationSetting(id) {
     setRoofList(newRoofList)
   }
 
+  // 서까래 변경
+  const handleChangeRaft = (e, index) => {
+    const raftValue = e.value
+
+    const newRoofList = roofList.map((roof, idx) => {
+      if (idx === index) {
+        return { ...roof, raft: raftValue }
+      }
+      return roof
+    })
+
+    setRoofList(newRoofList)
+  }
+
+  const handleChangeLayout = (layoutValue, index) => {
+    const newRoofList = roofList.map((roof, idx) => {
+      if (idx === index) {
+        return { ...roof, layout: layoutValue }
+      }
+      return roof
+    })
+
+    setRoofList(newRoofList)
+  }
+
   return {
     handleSave,
     onAddRoofMaterial,
@@ -246,5 +273,7 @@ export function useRoofAllocationSetting(id) {
     roofList,
     handleDefaultRoofMaterial,
     handleChangeRoofMaterial,
+    handleChangeRaft,
+    handleChangeLayout,
   }
 }