diff --git a/src/components/floor-plan/modal/setting01/FirstOption.jsx b/src/components/floor-plan/modal/setting01/FirstOption.jsx
index 9c146485..5753a410 100644
--- a/src/components/floor-plan/modal/setting01/FirstOption.jsx
+++ b/src/components/floor-plan/modal/setting01/FirstOption.jsx
@@ -27,11 +27,9 @@ export default function FirstOption() {
       const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` })
       const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] }))
       const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] }))
+      const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] }))
       const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item }))
       const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] }))
-      const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({
-        ...item,
-      }))
 
       // 데이터 설정
       setSettingModalFirstOptions({
@@ -39,7 +37,7 @@ export default function FirstOption() {
         option2: optionData2,
         dimensionDisplay: optionData5,
       })
-      console.log('optionData5', optionData5)
+
       setSettingModalSecondOptions({
         option3: optionData3,
         option4: optionData4,
@@ -66,6 +64,10 @@ export default function FirstOption() {
           column: item.column,
           selected: item.selected,
         })),
+        firstOption3: dimensionDisplay.map((item) => ({
+          column: item.column,
+          selected: item.selected,
+        })),
         // secondOption1: secondOptions[0].option1.map((item) => ({
         //   name: item.id,
         //   name: item.name,
@@ -80,17 +82,19 @@ export default function FirstOption() {
       const patternData = {
         objectNo,
         //디스플레이 설정(다중)
-        assignDisplay: dataToSend.firstOption1[0].selected,
-        drawDisplay: dataToSend.firstOption1[1].selected,
+        allocDisplay: dataToSend.firstOption1[0].selected,
+        outlineDisplay: dataToSend.firstOption1[1].selected,
         gridDisplay: dataToSend.firstOption1[2].selected,
-        charDisplay: dataToSend.firstOption1[3].selected,
-        flowDisplay: dataToSend.firstOption1[4].selected,
-        hallwayDimenDisplay: dataToSend.firstOption1[5].selected,
-        actualDimenDisplay: dataToSend.firstOption1[6].selected,
-        noDimenDisplay: dataToSend.firstOption1[7].selected,
-        trestleDisplay: dataToSend.firstOption1[8].selected,
-        coordiDisplay: dataToSend.firstOption1[9].selected,
-        drawConverDisplay: dataToSend.firstOption1[10].selected,
+        lineDisplay: dataToSend.firstOption1[3].selected,
+        wordDisplay: dataToSend.firstOption1[4].selected,
+        circuitNumDisplay: dataToSend.firstOption1[5].selected,
+        flowDisplay: dataToSend.firstOption1[6].selected,
+        trestleDisplay: dataToSend.firstOption1[7].selected,
+        totalDisplay: dataToSend.firstOption1[8].selected,
+        //차수 표시(다건)
+        corridorDimension: dataToSend.firstOption3[0].selected,
+        realDimension: dataToSend.firstOption3[1].selected,
+        noneDimension: dataToSend.firstOption3[2].selected,
         //화면 표시(다중)
         onlyBorder: dataToSend.firstOption2[0].selected,
         lineHatch: dataToSend.firstOption2[1].selected,
@@ -112,13 +116,75 @@ export default function FirstOption() {
     }
   }
 
-  const onClickDimension = (item) => {
+  const onClickDimension = async (item) => {
     const options = settingModalFirstOptions?.dimensionDisplay.map((option) => {
       option.selected = option.id === item.id
       return option
     })
 
-    setSettingModalFirstOptions({ option1, option2, dimensionDisplay: options })
+    setSettingModalFirstOptions({ option1, option2, dimensionDisplay })
+
+    try {
+      // 서버에 전송할 데이터
+      const dataToSend = {
+        firstOption1: option1.map((item) => ({
+          column: item.column,
+          selected: item.selected,
+        })),
+        firstOption2: option2.map((item) => ({
+          column: item.column,
+          selected: item.selected,
+        })),
+        firstOption3: dimensionDisplay.map((item) => ({
+          column: item.column,
+          selected: item.selected,
+        })),
+        // secondOption1: secondOptions[0].option1.map((item) => ({
+        //   name: item.id,
+        //   name: item.name,
+        //   // 필요한 경우 데이터 항목 추가
+        // })),
+        secondOption2: option4.map((item) => ({
+          column: item.column,
+          selected: item.selected,
+        })),
+      }
+
+      const patternData = {
+        objectNo,
+        //디스플레이 설정(다중)
+        allocDisplay: dataToSend.firstOption1[0].selected,
+        outlineDisplay: dataToSend.firstOption1[1].selected,
+        gridDisplay: dataToSend.firstOption1[2].selected,
+        lineDisplay: dataToSend.firstOption1[3].selected,
+        wordDisplay: dataToSend.firstOption1[4].selected,
+        circuitNumDisplay: dataToSend.firstOption1[5].selected,
+        flowDisplay: dataToSend.firstOption1[6].selected,
+        trestleDisplay: dataToSend.firstOption1[7].selected,
+        totalDisplay: dataToSend.firstOption1[8].selected,
+        //차수 표시(다건)
+        corridorDimension: dataToSend.firstOption3[0].selected,
+        realDimension: dataToSend.firstOption3[1].selected,
+        noneDimension: dataToSend.firstOption3[2].selected,
+        //화면 표시(다중)
+        onlyBorder: dataToSend.firstOption2[0].selected,
+        lineHatch: dataToSend.firstOption2[1].selected,
+        allPainted: dataToSend.firstOption2[2].selected,
+        //흡착범위 설정(단건)
+        adsorpRangeSmall: dataToSend.secondOption2[0].selected,
+        adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected,
+        adsorpRangeMedium: dataToSend.secondOption2[2].selected,
+        adsorpRangeLarge: dataToSend.secondOption2[3].selected,
+      }
+
+      // HTTP POST 요청 보내기
+      await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => {
+        //toastUp({ message: res.returnMessage, type: 'success' })
+        toastUp({ message: getMessage(res.returnMessage), type: 'success' })
+      })
+    } catch (error) {
+      toastUp({ message: getMessage(res.returnMessage), type: 'error' })
+    }
   }
 
   return (
@@ -126,34 +192,37 @@ export default function FirstOption() {
       <div className="modal-check-btn-wrap">
         <h3 className="check-wrap-title light">{getMessage('modal.canvas.setting.first.option.info')}</h3>
         <div className="flex-check-box for2">
-          {settingModalFirstOptions?.option1.map((item) => (
-            <button key={item.id} className={`check-btn ${item.selected ? 'act' : ''}`} onClick={(e) => onClickOption(item)}>
-              <span className="check-area"></span>
-              <span className="title-area">{getMessage(item.name)}</span>
-            </button>
-          ))}
+          {settingModalFirstOptions &&
+            settingModalFirstOptions.option1.map((item) => (
+              <button key={item.id} className={`check-btn ${item.selected ? 'act' : ''}`} onClick={(e) => onClickOption(item)}>
+                <span className="check-area"></span>
+                <span className="title-area">{getMessage(item.name)}</span>
+              </button>
+            ))}
         </div>
       </div>
       <div className="modal-check-btn-wrap">
         <h3 className="check-wrap-title">{getMessage('modal.canvas.setting.first.option.dimension')}</h3>
         <div className="flex-check-box for-line">
-          {settingModalFirstOptions?.dimensionDisplay?.map((item) => (
-            <button key={item.id} className={`check-btn ${item.selected ? 'act' : ''}`} onClick={(e) => onClickDimension(item)}>
-              <span className="check-area"></span>
-              <span className="title-area">{getMessage(item.name)}</span>
-            </button>
-          ))}
+          {settingModalFirstOptions &&
+            settingModalFirstOptions.dimensionDisplay.map((item) => (
+              <button key={item.id} className={`check-btn ${item.selected ? 'act' : ''}`} onClick={(e) => onClickDimension(item)}>
+                <span className="check-area"></span>
+                <span className="title-area">{getMessage(item.name)}</span>
+              </button>
+            ))}
         </div>
       </div>
       <div className="modal-check-btn-wrap">
         <h3 className="check-wrap-title">{getMessage('modal.canvas.setting.first.option.display')}</h3>
         <div className="flex-check-box for-line">
-          {settingModalFirstOptions?.option2.map((item) => (
-            <button key={item.id} className={`check-btn ${item.selected ? 'act' : ''}`} onClick={(e) => onClickOption(item)}>
-              <span className="check-area"></span>
-              <span className="title-area">{getMessage(item.name)}</span>
-            </button>
-          ))}
+          {settingModalFirstOptions &&
+            settingModalFirstOptions.option2.map((item) => (
+              <button key={item.id} className={`check-btn ${item.selected ? 'act' : ''}`} onClick={(e) => onClickOption(item)}>
+                <span className="check-area"></span>
+                <span className="title-area">{getMessage(item.name)}</span>
+              </button>
+            ))}
         </div>
       </div>
     </>
diff --git a/src/components/floor-plan/modal/setting01/SecondOption.jsx b/src/components/floor-plan/modal/setting01/SecondOption.jsx
index e850f403..867398cc 100644
--- a/src/components/floor-plan/modal/setting01/SecondOption.jsx
+++ b/src/components/floor-plan/modal/setting01/SecondOption.jsx
@@ -13,7 +13,7 @@ export default function SecondOption() {
   const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState)
   const setAdsorptionRange = useSetRecoilState(adsorptionRangeState)
 
-  const { option1, option2 } = settingModalFirstOptions
+  const { option1, option2, dimensionDisplay } = settingModalFirstOptions
   const { option3, option4 } = settingModalSecondOptions
   const { getMessage } = useMessage()
   const { get, post } = useAxios()
@@ -30,12 +30,10 @@ export default function SecondOption() {
       const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` })
       const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] }))
       const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] }))
+      const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] }))
       const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item }))
       const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] }))
-      const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({
-        ...item,
-      }))
-      // 데이터 설정
+
       setSettingModalFirstOptions({
         option1: optionData1,
         option2: optionData2,
@@ -52,16 +50,9 @@ export default function SecondOption() {
 
   const onClickOption = async (option) => {
     // option4에서 한 개만 선택 가능하도록 처리
-    const updatedOption4 = option4.map((item) =>
-      item.id === option.id
-        ? { ...item, selected: true }
-        : {
-            ...item,
-            selected: false,
-          },
-    )
+    const updatedOption4 = option4.map((item) => (item.id === option.id ? { ...item, selected: true } : { ...item, selected: false }))
 
-    setSettingModalFirstOptions({ option1, option2 })
+    setSettingModalFirstOptions({ option1, option2, dimensionDisplay })
     setSettingModalSecondOptions({ option3, option4: updatedOption4 })
 
     try {
@@ -75,6 +66,10 @@ export default function SecondOption() {
           column: item.column,
           selected: item.selected,
         })),
+        firstOption3: dimensionDisplay.map((item) => ({
+          column: item.column,
+          selected: item.selected,
+        })),
         // secondOption1: secondOptions[0].option3.map((item) => ({
         //   name: item.id,
         //   name: item.name,
@@ -88,17 +83,19 @@ export default function SecondOption() {
       const patternData = {
         objectNo,
         //디스플레이 설정(다중)
-        assignDisplay: dataToSend.firstOption1[0].selected,
-        drawDisplay: dataToSend.firstOption1[1].selected,
+        allocDisplay: dataToSend.firstOption1[0].selected,
+        outlineDisplay: dataToSend.firstOption1[1].selected,
         gridDisplay: dataToSend.firstOption1[2].selected,
-        charDisplay: dataToSend.firstOption1[3].selected,
-        flowDisplay: dataToSend.firstOption1[4].selected,
-        hallwayDimenDisplay: dataToSend.firstOption1[5].selected,
-        actualDimenDisplay: dataToSend.firstOption1[6].selected,
-        noDimenDisplay: dataToSend.firstOption1[7].selected,
-        trestleDisplay: dataToSend.firstOption1[8].selected,
-        coordiDisplay: dataToSend.firstOption1[9].selected,
-        drawConverDisplay: dataToSend.firstOption1[10].selected,
+        lineDisplay: dataToSend.firstOption1[3].selected,
+        wordDisplay: dataToSend.firstOption1[4].selected,
+        circuitNumDisplay: dataToSend.firstOption1[5].selected,
+        flowDisplay: dataToSend.firstOption1[6].selected,
+        trestleDisplay: dataToSend.firstOption1[7].selected,
+        totalDisplay: dataToSend.firstOption1[8].selected,
+        //차수 표시(다건)
+        corridorDimension: dataToSend.firstOption3[0].selected,
+        realDimension: dataToSend.firstOption3[1].selected,
+        noneDimension: dataToSend.firstOption3[2].selected,
         //화면 표시(다중)
         onlyBorder: dataToSend.firstOption2[0].selected,
         lineHatch: dataToSend.firstOption2[1].selected,
diff --git a/src/store/settingAtom.js b/src/store/settingAtom.js
index 5541cc14..ff73c75c 100644
--- a/src/store/settingAtom.js
+++ b/src/store/settingAtom.js
@@ -4,29 +4,18 @@ export const settingModalFirstOptionsState = atom({
   key: 'settingModalFirstOptions',
   default: {
     option1: [
-      { id: 1, column: 'assignDisplay', name: 'modal.canvas.setting.first.option.alloc', selected: false },
-      { id: 2, column: 'drawDisplay', name: 'modal.canvas.setting.first.option.outline', selected: false },
-      { id: 3, column: 'charDisplay', name: 'modal.canvas.setting.first.option.roof.line', selected: false },
-      { id: 4, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.grid', selected: false },
-      { id: 5, column: 'hallwayDimenDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false },
-      { id: 6, column: 'actualDimenDisplay', name: 'modal.canvas.setting.first.option.word', selected: false },
-      { id: 7, column: 'noDimenDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false },
-      { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false },
-      { id: 9, column: 'coordiDisplay', name: 'modal.canvas.setting.first.option.total', selected: false },
-      {
-        id: 10,
-        column: 'drawConverDisplay',
-        name: 'modal.canvas.setting.first.option.corridor.dimension',
-        selected: false,
-      },
+      { id: 1, column: 'allocDisplay', name: 'modal.canvas.setting.first.option.alloc', selected: false },
+      { id: 2, column: 'outlineDisplay', name: 'modal.canvas.setting.first.option.outline', selected: false },
+      { id: 3, column: 'gridDisplay', name: 'modal.canvas.setting.first.option.grid', selected: false },
+      { id: 4, column: 'lineDisplay', name: 'modal.canvas.setting.first.option.roof.line', selected: false },
+      { id: 5, column: 'wordDisplay', name: 'modal.canvas.setting.first.option.word', selected: false },
+      { id: 6, column: 'circuitNumDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false },
+      { id: 7, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false },
+      { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false },
+      { id: 9, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: false },
     ],
     dimensionDisplay: [
-      {
-        id: 1,
-        column: 'corridorDimension',
-        name: 'modal.canvas.setting.first.option.corridor.dimension',
-        selected: false,
-      },
+      { id: 1, column: 'corridorDimension', name: 'modal.canvas.setting.first.option.corridor.dimension', selected: false },
       { id: 2, column: 'realDimension', name: 'modal.canvas.setting.first.option.real.dimension', selected: false },
       { id: 3, column: 'noneDimension', name: 'modal.canvas.setting.first.option.none.dimension', selected: false },
     ],