diff --git a/src/app/canvas/page.jsx b/src/app/canvas/page.jsx
index 396a33c..d1e50a3 100644
--- a/src/app/canvas/page.jsx
+++ b/src/app/canvas/page.jsx
@@ -106,7 +106,7 @@ export default function CanvasPage() {
                     {/* <PropertiesSetting/> */}
 
                     {/* 지붕형상 설정 */}
-                    {/* <RoofShapeOption/> */}
+                    <RoofShapeOption/>
 
                     {/* 지붕형상 수동 설정 */}
                     {/* <ManualRoofShape/> */}
@@ -135,10 +135,10 @@ export default function CanvasPage() {
                     {/* <SlopeOption/> */}
 
                     {/* 배치면 그리기 */}
-                    {/* <ArrangementSetting/> */}
+                    <ArrangementSetting/>
 
                     {/* 면형상 배치 */}
-                    <PlaneShapeOption/>
+                    {/* <PlaneShapeOption/> */}
                     
                     {/* 오브젝트 배치*/}
                     {/* <ObjectOption/> */}
@@ -158,13 +158,13 @@ export default function CanvasPage() {
                     {/* <DrawingFlow/> */}
 
                     {/* 지붕모듈선택 */}
-                    {/* <RoofModuleOption/> */}
+                    <RoofModuleOption/>
 
                     {/* 육지붕모듈 선택 */}
-                    {/* <HexagonalRoofOption/> */}
+                    <HexagonalRoofOption/>
 
                     {/* 회로 및 가대설정 */}
-                    {/* <CircuitStandSetting/> */}
+                    <CircuitStandSetting/>
 
                     {/* 모듈 부가기능 */}
 
diff --git a/src/components/canvas/MenuDepth03.jsx b/src/components/canvas/MenuDepth03.jsx
index dc46345..5de8f92 100644
--- a/src/components/canvas/MenuDepth03.jsx
+++ b/src/components/canvas/MenuDepth03.jsx
@@ -7,8 +7,8 @@ export default function MenuDepth03(){
     return( 
         <div className="canvas-depth2-inner">
             <ul className="canvas-depth2-list">
-                <li className="canvas-depth2-item active"><button>基本設定</button></li>
-                <li className="canvas-depth2-item"><button>回路と架台の設定</button></li>
+                <li className="canvas-depth2-item active"><button>モジュール/架台設定</button></li>
+                <li className="canvas-depth2-item"><button>回路設定</button></li>
                 <li className="canvas-depth2-item"><button>図面方位の適用</button></li>
             </ul>
         </div>
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleCopy.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleCopy.jsx
index db589b2..baaf782 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleCopy.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleCopy.jsx
@@ -4,7 +4,7 @@ export default function AdditionalBundleCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">単コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalBundleCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleMove.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleMove.jsx
index 3319b2d..7e46c66 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleMove.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalBundleMove.jsx
@@ -4,7 +4,7 @@ export default function AdditionalBundleMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">単移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalBundleMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnCopy.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnCopy.jsx
index f46500d..9a181f9 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnCopy.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnCopy.jsx
@@ -4,7 +4,7 @@ export default function AdditionalColumnCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">列コピーの設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalColumnCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnMove.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnMove.jsx
index 9f3c6c0..3cefe27 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnMove.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalColumnMove.jsx
@@ -4,7 +4,7 @@ export default function AdditionalColumnMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">列移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AdditionalColumnMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalCopy.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalCopy.jsx
index 448511a..eb5de6b 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalCopy.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalCopy.jsx
@@ -4,7 +4,7 @@ export default function AdditionalCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -34,6 +34,7 @@ export default function AdditionalCopy(){
                         <button className="btn-frame modal act">キャンセル</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalMove.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalMove.jsx
index d925a17..e88b3f1 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AdditionalMove.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AdditionalMove.jsx
@@ -4,7 +4,7 @@ export default function AdditionalMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -34,6 +34,7 @@ export default function AdditionalMove(){
                         <button className="btn-frame modal act">キャンセル</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AllModuleCopy.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AllModuleCopy.jsx
index d841bac..70b50e7 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AllModuleCopy.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AllModuleCopy.jsx
@@ -4,7 +4,7 @@ export default function AllModuleCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">モジュール一括コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AllModuleCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AllModuleMove.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AllModuleMove.jsx
index dc4fc36..e07aeb0 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AllModuleMove.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AllModuleMove.jsx
@@ -4,7 +4,7 @@ export default function AllModuleMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">モジュール一括移動設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -33,6 +33,7 @@ export default function AllModuleMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/additionoption/AllModuleNumChange.jsx b/src/components/canvas/modal/additionalfunction/additionoption/AllModuleNumChange.jsx
index 8a282aa..cebe8c1 100644
--- a/src/components/canvas/modal/additionalfunction/additionoption/AllModuleNumChange.jsx
+++ b/src/components/canvas/modal/additionalfunction/additionoption/AllModuleNumChange.jsx
@@ -4,7 +4,7 @@ export default function AllModuleNumChange(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">モジュール一括回路番号の変更</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -26,6 +26,7 @@ export default function AllModuleNumChange(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleDelete.jsx b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleDelete.jsx
index 81a5efe..3e04c90 100644
--- a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleDelete.jsx
+++ b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleDelete.jsx
@@ -12,7 +12,7 @@ export default function AdditionalBundleDelete(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">ただし削除 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -71,6 +71,7 @@ export default function AdditionalBundleDelete(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleEdit.jsx b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleEdit.jsx
index 00b9042..9463b87 100644
--- a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleEdit.jsx
+++ b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalBundleEdit.jsx
@@ -12,7 +12,7 @@ export default function AdditionalBundleEdit(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">段挿入 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -61,6 +61,7 @@ export default function AdditionalBundleEdit(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnDelete.jsx b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnDelete.jsx
index 217b6f2..16a2956 100644
--- a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnDelete.jsx
+++ b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnDelete.jsx
@@ -12,7 +12,7 @@ export default function AdditionalColumnDelete(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">コピー設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -71,6 +71,7 @@ export default function AdditionalColumnDelete(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnEdit.jsx b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnEdit.jsx
index 1f3f426..6f0f2f6 100644
--- a/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnEdit.jsx
+++ b/src/components/canvas/modal/additionalfunction/moduleadditional/AdditionalColumnEdit.jsx
@@ -12,7 +12,7 @@ export default function AdditionalColumnEdit(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">列の挿入 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -61,6 +61,7 @@ export default function AdditionalColumnEdit(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/arrangementsetting/ArrangementSetting.jsx b/src/components/canvas/modal/arrangementsetting/ArrangementSetting.jsx
index 2250964..5034ebc 100644
--- a/src/components/canvas/modal/arrangementsetting/ArrangementSetting.jsx
+++ b/src/components/canvas/modal/arrangementsetting/ArrangementSetting.jsx
@@ -11,7 +11,7 @@ export default function ArrangementSetting(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">配置面の描画</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -49,7 +49,6 @@ export default function ArrangementSetting(){
                         </button>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <ArrangementTab01/>}
                         {buttonAct === 2 && <ArrangementTab02/>}
                         {buttonAct === 3 && <ArrangementTab03/>}
@@ -59,9 +58,10 @@ export default function ArrangementSetting(){
                     
                     <div className="grid-btn-wrap">
                         <button className="btn-frame modal mr5">一変戦に戻る</button>
-                        <button className="btn-frame modal act">外壁線確定</button>
+                        <button className="btn-frame modal act">配置面確定</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/auxiliarylineoprion/AuxiliarylineOption.jsx b/src/components/canvas/modal/auxiliarylineoprion/AuxiliarylineOption.jsx
index adeb17b..83b4a0b 100644
--- a/src/components/canvas/modal/auxiliarylineoprion/AuxiliarylineOption.jsx
+++ b/src/components/canvas/modal/auxiliarylineoprion/AuxiliarylineOption.jsx
@@ -20,7 +20,7 @@ export default function AuxiliarylineOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">補助線の作成</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -37,7 +37,6 @@ export default function AuxiliarylineOption(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <AuxiliaryTab01/>}
                         {buttonAct === 2 && <AuxiliaryTab02/>}
                         {buttonAct === 3 && <AuxiliaryTab03/>}
@@ -50,6 +49,7 @@ export default function AuxiliarylineOption(){
                         <button className="btn-frame modal act">外壁線確定</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/auxiliarysupport/AuxiliaryCopy.jsx b/src/components/canvas/modal/auxiliarysupport/AuxiliaryCopy.jsx
index 6937f52..f86f620 100644
--- a/src/components/canvas/modal/auxiliarysupport/AuxiliaryCopy.jsx
+++ b/src/components/canvas/modal/auxiliarysupport/AuxiliaryCopy.jsx
@@ -4,7 +4,7 @@ export default function AuxiliaryCopy(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">補助線のコピー </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -43,6 +43,7 @@ export default function AuxiliaryCopy(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/auxiliarysupport/AuxiliaryMove.jsx b/src/components/canvas/modal/auxiliarysupport/AuxiliaryMove.jsx
index 14bf67c..c792c23 100644
--- a/src/components/canvas/modal/auxiliarysupport/AuxiliaryMove.jsx
+++ b/src/components/canvas/modal/auxiliarysupport/AuxiliaryMove.jsx
@@ -4,7 +4,7 @@ export default function AuxiliaryMove(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">補助線の移動 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -43,6 +43,7 @@ export default function AuxiliaryMove(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/auxiliarysupport/AuxiliarySize.jsx b/src/components/canvas/modal/auxiliarysupport/AuxiliarySize.jsx
index ac42056..96b94c1 100644
--- a/src/components/canvas/modal/auxiliarysupport/AuxiliarySize.jsx
+++ b/src/components/canvas/modal/auxiliarysupport/AuxiliarySize.jsx
@@ -4,7 +4,7 @@ export default function AuxiliarySize(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">補助線サイズ変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -51,6 +51,7 @@ export default function AuxiliarySize(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/circuitstandsetting/CircuitStandSetting.jsx b/src/components/canvas/modal/circuitstandsetting/CircuitStandSetting.jsx
index 8c4feff..47b1a02 100644
--- a/src/components/canvas/modal/circuitstandsetting/CircuitStandSetting.jsx
+++ b/src/components/canvas/modal/circuitstandsetting/CircuitStandSetting.jsx
@@ -9,8 +9,8 @@ export default function CircuitStandSetting(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap l-2`}>
-                <div className="modal-head">
-                    <h1 className="title">回路と架台設定 </h1>
+                <div className="modal-head handle">
+                    <h1 className="title">回路設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
                 <div className="modal-body">
@@ -23,6 +23,7 @@ export default function CircuitStandSetting(){
                     {tabNum === 2 && <CircuitStandTab02 setTabNum={setTabNum}/>}
                     {tabNum === 3 && <CircuitStandTab03 setTabNum={setTabNum}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/colorselect/ColorSelect.jsx b/src/components/canvas/modal/colorselect/ColorSelect.jsx
index 316c4dd..8696f45 100644
--- a/src/components/canvas/modal/colorselect/ColorSelect.jsx
+++ b/src/components/canvas/modal/colorselect/ColorSelect.jsx
@@ -5,7 +5,7 @@ export default function ColorSelect (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">カラー設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -20,6 +20,7 @@ export default function ColorSelect (){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/displaychange/DisplayChange.jsx b/src/components/canvas/modal/displaychange/DisplayChange.jsx
index 59f6214..842114a 100644
--- a/src/components/canvas/modal/displaychange/DisplayChange.jsx
+++ b/src/components/canvas/modal/displaychange/DisplayChange.jsx
@@ -9,7 +9,7 @@ export default function DisplayChange(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">表示の変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -63,6 +63,7 @@ export default function DisplayChange(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/distancemeasurement/DistanceMeasurement01.jsx b/src/components/canvas/modal/distancemeasurement/DistanceMeasurement01.jsx
index c62ce77..4abc855 100644
--- a/src/components/canvas/modal/distancemeasurement/DistanceMeasurement01.jsx
+++ b/src/components/canvas/modal/distancemeasurement/DistanceMeasurement01.jsx
@@ -4,7 +4,7 @@ export default function DistanceMeasurement01(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">距離測定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -22,6 +22,7 @@ export default function DistanceMeasurement01(){
                         <button className="btn-frame modal act">確認</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/distancemeasurement/DistanceMeasurement02.jsx b/src/components/canvas/modal/distancemeasurement/DistanceMeasurement02.jsx
index 184b646..8ae2f34 100644
--- a/src/components/canvas/modal/distancemeasurement/DistanceMeasurement02.jsx
+++ b/src/components/canvas/modal/distancemeasurement/DistanceMeasurement02.jsx
@@ -4,7 +4,7 @@ export default function DistanceMeasurement02(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">距離測定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -57,6 +57,7 @@ export default function DistanceMeasurement02(){
                         <button className="btn-frame modal act">確認</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/distancemeasurement/DistanceMeasurement03.jsx b/src/components/canvas/modal/distancemeasurement/DistanceMeasurement03.jsx
index 389b847..8b873dc 100644
--- a/src/components/canvas/modal/distancemeasurement/DistanceMeasurement03.jsx
+++ b/src/components/canvas/modal/distancemeasurement/DistanceMeasurement03.jsx
@@ -4,7 +4,7 @@ export default function DistanceMeasurement03(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">距離測定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -22,6 +22,7 @@ export default function DistanceMeasurement03(){
                         <button className="btn-frame modal act">確認</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/drawingflow/DrawingFlow.jsx b/src/components/canvas/modal/drawingflow/DrawingFlow.jsx
index 4c2c6a0..187754e 100644
--- a/src/components/canvas/modal/drawingflow/DrawingFlow.jsx
+++ b/src/components/canvas/modal/drawingflow/DrawingFlow.jsx
@@ -11,7 +11,7 @@ export default function DrawingFlow(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ml`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">面フローの設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -90,6 +90,7 @@ export default function DrawingFlow(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/eachpropertychange/EachPropertyChange.jsx b/src/components/canvas/modal/eachpropertychange/EachPropertyChange.jsx
index 11f0a22..90e4ddc 100644
--- a/src/components/canvas/modal/eachpropertychange/EachPropertyChange.jsx
+++ b/src/components/canvas/modal/eachpropertychange/EachPropertyChange.jsx
@@ -4,7 +4,7 @@ export default function EachPropertyChange() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">各辺属性の変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -14,7 +14,6 @@ export default function EachPropertyChange() {
                         <span>選択した値 [龍丸]</span>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         <div className="outline-wrap">
                             <div className="radio-grid-wrap">
                                 <div className="d-check-radio pop">
@@ -88,6 +87,7 @@ export default function EachPropertyChange() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/eaves_keraba/EavesKerabaOption.jsx b/src/components/canvas/modal/eaves_keraba/EavesKerabaOption.jsx
index 197cd95..2d0290c 100644
--- a/src/components/canvas/modal/eaves_keraba/EavesKerabaOption.jsx
+++ b/src/components/canvas/modal/eaves_keraba/EavesKerabaOption.jsx
@@ -18,7 +18,7 @@ export default function EvaseKerabaOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">軒・ケラバ変更</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -35,14 +35,13 @@ export default function EvaseKerabaOption(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <EavesKerabaTab01/>}
                         {buttonAct === 2 && <EavesKerabaTab02/>}
                         {buttonAct === 3 && <EavesKerabaTab03/>}
                         {buttonAct === 4 && <EavesKerabaTab04/>}
                     </div>
-                    
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/font_lineoption/FontOption.jsx b/src/components/canvas/modal/font_lineoption/FontOption.jsx
index 90076b4..2c289c3 100644
--- a/src/components/canvas/modal/font_lineoption/FontOption.jsx
+++ b/src/components/canvas/modal/font_lineoption/FontOption.jsx
@@ -7,7 +7,7 @@ export default function FontOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lrr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">フォント </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -51,6 +51,7 @@ export default function FontOption(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/font_lineoption/LineOption.jsx b/src/components/canvas/modal/font_lineoption/LineOption.jsx
index f620e47..2e69681 100644
--- a/src/components/canvas/modal/font_lineoption/LineOption.jsx
+++ b/src/components/canvas/modal/font_lineoption/LineOption.jsx
@@ -8,7 +8,7 @@ export default function LineOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">寸法線 設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -44,6 +44,7 @@ export default function LineOption(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/font_lineoption/ShapeSizeOption.jsx b/src/components/canvas/modal/font_lineoption/ShapeSizeOption.jsx
index d00d5d3..21e08b8 100644
--- a/src/components/canvas/modal/font_lineoption/ShapeSizeOption.jsx
+++ b/src/components/canvas/modal/font_lineoption/ShapeSizeOption.jsx
@@ -4,7 +4,7 @@ export default function ShapeSizeOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xsm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">図面サイズの設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -29,6 +29,7 @@ export default function ShapeSizeOption(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/gridoption/GridCopy.jsx b/src/components/canvas/modal/gridoption/GridCopy.jsx
index c7374c3..46f1da2 100644
--- a/src/components/canvas/modal/gridoption/GridCopy.jsx
+++ b/src/components/canvas/modal/gridoption/GridCopy.jsx
@@ -19,7 +19,7 @@ export default function GridCopy() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm ${modalOption.gridcopy ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">グリッドのコピー </h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -48,6 +48,7 @@ export default function GridCopy() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/gridoption/GridMove.jsx b/src/components/canvas/modal/gridoption/GridMove.jsx
index e55abf1..b44112d 100644
--- a/src/components/canvas/modal/gridoption/GridMove.jsx
+++ b/src/components/canvas/modal/gridoption/GridMove.jsx
@@ -19,7 +19,7 @@ export default function GridMove() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xm ${modalOption.gridmove ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">グリッド移動 </h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -62,6 +62,7 @@ export default function GridMove() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/gridoption/GridOption.jsx b/src/components/canvas/modal/gridoption/GridOption.jsx
index afcad25..32b2791 100644
--- a/src/components/canvas/modal/gridoption/GridOption.jsx
+++ b/src/components/canvas/modal/gridoption/GridOption.jsx
@@ -24,7 +24,7 @@ export default function GridOption() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm ${modalOption.gridoption ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">ドット・ライングリッドの設定</h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -82,6 +82,7 @@ export default function GridOption() {
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofOption.jsx b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofOption.jsx
index 8be92bd..189cc0b 100644
--- a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofOption.jsx
+++ b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofOption.jsx
@@ -9,8 +9,8 @@ export default function HexagonalRoofOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lx-2`}>
-                <div className="modal-head">
-                    <h1 className="title">基本設定 </h1>
+                <div className="modal-head handle">
+                    <h1 className="title">モジュール/架台設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
                 <div className="modal-body">
@@ -25,6 +25,7 @@ export default function HexagonalRoofOption(){
                     {tabNum === 2 && <HexagonalRoofTab02 setTabNum={setTabNum}/>}
                     {tabNum === 3 && <HexagonalRoofTab03 setTabNum={setTabNum}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx
index 120d4ae..451c3e4 100644
--- a/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx
+++ b/src/components/canvas/modal/hexagonalroofoption/HexagonalRoofTab01.jsx
@@ -5,7 +5,6 @@ export default function HexagonalRoofTab01({setTabNum}){
     return(
         <>
             <div className="properties-setting-wrap">
-                <div className="setting-tit">方位設定</div>
                 <div className="outline-wrap">
                     <div className="guide">※シミュレーション計算用方位を指定します。南の方位を設定してください。</div>
                     <div className="roof-module-compas">
diff --git a/src/components/canvas/modal/imagesize/ImageSize.jsx b/src/components/canvas/modal/imagesize/ImageSize.jsx
index 4c1ca9a..7adbc3a 100644
--- a/src/components/canvas/modal/imagesize/ImageSize.jsx
+++ b/src/components/canvas/modal/imagesize/ImageSize.jsx
@@ -6,7 +6,7 @@ export default function ImageSize(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">画像のサイズ変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -16,6 +16,7 @@ export default function ImageSize(){
                         <label htmlFor="size">{sizeValue}%</label>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/imgload/ImgLoad.jsx b/src/components/canvas/modal/imgload/ImgLoad.jsx
index 7b016cc..be48731 100644
--- a/src/components/canvas/modal/imgload/ImgLoad.jsx
+++ b/src/components/canvas/modal/imgload/ImgLoad.jsx
@@ -4,7 +4,7 @@ export default function ImgLoad(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">画像を読み込む </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -55,6 +55,7 @@ export default function ImgLoad(){
                         <button className="btn-frame modal act">完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/manualroofshape/ManualRoofShape.jsx b/src/components/canvas/modal/manualroofshape/ManualRoofShape.jsx
index c1feef3..0deb4c7 100644
--- a/src/components/canvas/modal/manualroofshape/ManualRoofShape.jsx
+++ b/src/components/canvas/modal/manualroofshape/ManualRoofShape.jsx
@@ -15,7 +15,7 @@ export default function ManualRoofShape(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">屋根形状の設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -32,7 +32,6 @@ export default function ManualRoofShape(){
                         ))}
                     </div>
                     <div className="modal-bottom-border-bx">
-                        <div className="setting-tit">設定</div>
                         <div className="discrimination-box">
                             {buttonAct === 1 && <ManualTab01/>}
                             {buttonAct === 2 && <ManualTab02/>}
@@ -47,6 +46,7 @@ export default function ManualRoofShape(){
                         <button className="btn-frame modal act">設定完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/measuredvalueoption/MeasuredValueOption.jsx b/src/components/canvas/modal/measuredvalueoption/MeasuredValueOption.jsx
index 2e6ad39..400a097 100644
--- a/src/components/canvas/modal/measuredvalueoption/MeasuredValueOption.jsx
+++ b/src/components/canvas/modal/measuredvalueoption/MeasuredValueOption.jsx
@@ -4,7 +4,7 @@ export default function MeasuredValueOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">実測値設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -13,7 +13,6 @@ export default function MeasuredValueOption(){
                         <span>※隅棟・谷・棟の実際の寸法を入力してください。</span>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         <div className="outline-wrap">
                             <div className="eaves-keraba-table">
                                 <div className="eaves-keraba-item">
@@ -50,6 +49,7 @@ export default function MeasuredValueOption(){
                         <button className="btn-frame modal act">適用</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/movingupdown/MovingUpDown.jsx b/src/components/canvas/modal/movingupdown/MovingUpDown.jsx
index 91a5b0e..5fe2634 100644
--- a/src/components/canvas/modal/movingupdown/MovingUpDown.jsx
+++ b/src/components/canvas/modal/movingupdown/MovingUpDown.jsx
@@ -14,7 +14,7 @@ export default function MovingUpDonw(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">軒・ケラバ変更</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -31,7 +31,6 @@ export default function MovingUpDonw(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <MovingTab01/>}
                         {buttonAct === 2 && <MovingTab02/>}
                     </div>
@@ -39,6 +38,7 @@ export default function MovingUpDonw(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/objectoption/ObjectOption.jsx b/src/components/canvas/modal/objectoption/ObjectOption.jsx
index fffc8f7..abe549e 100644
--- a/src/components/canvas/modal/objectoption/ObjectOption.jsx
+++ b/src/components/canvas/modal/objectoption/ObjectOption.jsx
@@ -17,7 +17,7 @@ export default function ObjectOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lrr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">オブジェクトの配置 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -34,7 +34,6 @@ export default function ObjectOption(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <ObjectOptionTab01/>}
                         {buttonAct === 2 && <ObjectOptionTab02/>}
                         {buttonAct === 3 && <ObjectOptionTab03/>}
@@ -44,6 +43,7 @@ export default function ObjectOption(){
                         <button className="btn-frame modal act">作成</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx b/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx
index 352ba42..4aa22a8 100644
--- a/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx
+++ b/src/components/canvas/modal/outerlinesetting/OuterLineWall.jsx
@@ -25,7 +25,7 @@ export default function OuterLineWall (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r ${modalOption.outerwall ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">外壁線を描</h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -64,7 +64,6 @@ export default function OuterLineWall (){
                         </button>
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <Tab01/>}
                         {buttonAct === 2 && <Tab02/>}
                         {buttonAct === 3 && <Tab03/>}
@@ -77,6 +76,7 @@ export default function OuterLineWall (){
                         <button className="btn-frame modal act">外壁線確定</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/outerwalloffset/OuterWallOffset.jsx b/src/components/canvas/modal/outerwalloffset/OuterWallOffset.jsx
index a131471..923bda2 100644
--- a/src/components/canvas/modal/outerwalloffset/OuterWallOffset.jsx
+++ b/src/components/canvas/modal/outerwalloffset/OuterWallOffset.jsx
@@ -15,7 +15,7 @@ export default function OuterWallOffset(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap r`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">外壁の編集とオフセット</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -32,7 +32,6 @@ export default function OuterWallOffset(){
                         ))}
                     </div>
                     <div className="properties-setting-wrap outer">
-                        <div className="setting-tit">設定</div>
                         {buttonAct === 1 && <OffsetTab01/>}
                         {buttonAct === 2 && <OffsetTab02/>}
                     </div>
@@ -40,6 +39,7 @@ export default function OuterWallOffset(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx b/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx
index a2d9bf1..de6a485 100644
--- a/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx
+++ b/src/components/canvas/modal/placementsetting/PlacementSettingPop.jsx
@@ -13,7 +13,7 @@ export default function PlacementSettingPop(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ll`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">配置面初期設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -168,6 +168,7 @@ export default function PlacementSettingPop(){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
                 {/* <PlacementGuidePop/>
                 <RoofingMaterialGudiePop/> */}
             </div>
diff --git a/src/components/canvas/modal/planeshapeoption/PlaneShapeOption.jsx b/src/components/canvas/modal/planeshapeoption/PlaneShapeOption.jsx
index 2528b16..c139c95 100644
--- a/src/components/canvas/modal/planeshapeoption/PlaneShapeOption.jsx
+++ b/src/components/canvas/modal/planeshapeoption/PlaneShapeOption.jsx
@@ -28,7 +28,7 @@ export default function PlaneShapeOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr-2`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">屋根形状の設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -81,7 +81,7 @@ export default function PlaneShapeOption(){
                         </div>
                     </div>
                 </div>
-                <div className="modal-foot"></div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/propertiessetting/PropertiesSetting.jsx b/src/components/canvas/modal/propertiessetting/PropertiesSetting.jsx
index de3f72f..832efb4 100644
--- a/src/components/canvas/modal/propertiessetting/PropertiesSetting.jsx
+++ b/src/components/canvas/modal/propertiessetting/PropertiesSetting.jsx
@@ -4,7 +4,7 @@ export default function PropertiesSetting() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">外壁のプロパティの設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -24,6 +24,7 @@ export default function PropertiesSetting() {
                         <button className="btn-frame modal act">設定完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/roofallocation/RoofAllocation.jsx b/src/components/canvas/modal/roofallocation/RoofAllocation.jsx
index b071720..142e041 100644
--- a/src/components/canvas/modal/roofallocation/RoofAllocation.jsx
+++ b/src/components/canvas/modal/roofallocation/RoofAllocation.jsx
@@ -12,7 +12,7 @@ export default function RoofAllocation() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">屋根面の割り当て</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -260,6 +260,7 @@ export default function RoofAllocation() {
                         <button className="btn-frame modal act">選択した屋根材として割り当て</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/roofmoduleoption/RoofModuleOption.jsx b/src/components/canvas/modal/roofmoduleoption/RoofModuleOption.jsx
index a507fc5..933b1c3 100644
--- a/src/components/canvas/modal/roofmoduleoption/RoofModuleOption.jsx
+++ b/src/components/canvas/modal/roofmoduleoption/RoofModuleOption.jsx
@@ -9,8 +9,8 @@ export default function RoofModuleOption(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lx-2`}>
-                <div className="modal-head">
-                    <h1 className="title">基本設定 </h1>
+                <div className="modal-head handle">
+                    <h1 className="title">モジュール/架台設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
                 <div className="modal-body">
@@ -25,6 +25,7 @@ export default function RoofModuleOption(){
                     {tabNum === 2 && <RoofModuleOptionTab02 setTabNum={setTabNum}/>}
                     {tabNum === 3 && <RoofModuleOptionTab03 setTabNum={setTabNum}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx
index 57730cd..5c58e13 100644
--- a/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx
+++ b/src/components/canvas/modal/roofmoduleoption/RoofModuleOptionTab01.jsx
@@ -5,7 +5,6 @@ export default function RoofModuleOptionTab01({setTabNum}){
     return(
         <>
             <div className="properties-setting-wrap">
-                <div className="setting-tit">方位設定</div>
                 <div className="outline-wrap">
                     <div className="guide">※シミュレーション計算用方位を指定します。南の方位を設定してください。</div>
                     <div className="roof-module-compas">
diff --git a/src/components/canvas/modal/roofselect/RoofSelect.jsx b/src/components/canvas/modal/roofselect/RoofSelect.jsx
index 6845fb9..7e914cd 100644
--- a/src/components/canvas/modal/roofselect/RoofSelect.jsx
+++ b/src/components/canvas/modal/roofselect/RoofSelect.jsx
@@ -9,7 +9,7 @@ export default function RoofSelect(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -23,6 +23,7 @@ export default function RoofSelect(){
                         <button className="btn-frame modal act">ストレージ</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/roofshapeoption/RoofShapeOption.jsx b/src/components/canvas/modal/roofshapeoption/RoofShapeOption.jsx
index 28a3999..0a10da0 100644
--- a/src/components/canvas/modal/roofshapeoption/RoofShapeOption.jsx
+++ b/src/components/canvas/modal/roofshapeoption/RoofShapeOption.jsx
@@ -23,7 +23,7 @@ export default function RoofShapeOption() {
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap lr`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                 <h1 className="title">屋根形状の設定</h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -39,7 +39,6 @@ export default function RoofShapeOption() {
                         ))}
                     </div>
                     <div className="properties-setting-wrap">
-                        <div className="setting-tit">設定</div>
                         {shapeNum === 1 && <ShapeTab01/>}
                         {shapeNum === 2 && <ShapeTab02/>}
                         {shapeNum === 3 && <ShapeTab03/>}
@@ -50,6 +49,7 @@ export default function RoofShapeOption() {
                         <button className="btn-frame modal act">設定完了</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/roofshapeoption/ShapeTab01.jsx b/src/components/canvas/modal/roofshapeoption/ShapeTab01.jsx
index 50ef502..01d40d0 100644
--- a/src/components/canvas/modal/roofshapeoption/ShapeTab01.jsx
+++ b/src/components/canvas/modal/roofshapeoption/ShapeTab01.jsx
@@ -2,14 +2,14 @@ export default function ShapeTab01() {
     return(
         <div className="setting-box">
             <div className="outline-form mb10">
-                <span className="mr10" style={{width: '24px'}}>傾斜</span>
+                <span className="mr10" style={{width: '50px'}}>傾斜</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={100}/>
                 </div>
                 <span className="thin">寸法</span>
             </div>
             <div className="outline-form">
-                <span className="mr10" style={{width: '24px'}}>軒の</span>
+                <span className="mr10" style={{width: '50px'}}>軒の出幅</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={100}/>
                 </div>
diff --git a/src/components/canvas/modal/roofshapeoption/discriminationtab/DiscriminationTab01.jsx b/src/components/canvas/modal/roofshapeoption/discriminationtab/DiscriminationTab01.jsx
index 577ee16..dadcbf6 100644
--- a/src/components/canvas/modal/roofshapeoption/discriminationtab/DiscriminationTab01.jsx
+++ b/src/components/canvas/modal/roofshapeoption/discriminationtab/DiscriminationTab01.jsx
@@ -2,14 +2,14 @@ export default function DiscriminationTab01(){
     return(
         <>
             <div className="outline-form mb10">
-                <span className="mr10" style={{width: '24px'}}>傾斜</span>
+                <span className="mr10" style={{width: '50px'}}>傾斜</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={4}/>
                 </div>
                 <span className="thin">寸法</span>
             </div>
             <div className="outline-form">
-                <span className="mr10" style={{width: '24px'}}>軒の</span>
+                <span className="mr10" style={{width: '50px'}}>軒の出幅</span>
                 <div className="input-grid mr5" style={{width: '100px'}}>
                     <input type="text" className="input-origin block" defaultValue={500}/>
                 </div>
diff --git a/src/components/canvas/modal/settoing01/SettingModal01.jsx b/src/components/canvas/modal/settoing01/SettingModal01.jsx
index 44347d6..662c8ec 100644
--- a/src/components/canvas/modal/settoing01/SettingModal01.jsx
+++ b/src/components/canvas/modal/settoing01/SettingModal01.jsx
@@ -34,7 +34,7 @@ export default function SettingModal01 (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap sm ${modalOption.option ? 'mount' : ''} ${close ? 'unmount' : ''} `}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">Canvas設定</h1>
                     <button className="modal-close" onClick={HandleClickClose}>닫기</button>
                 </div>
@@ -64,6 +64,7 @@ export default function SettingModal01 (){
                     {buttonAct === 2 && <SecondOption {...propsClick}/>}
                     {buttonAct === 3 && <ThirdOption {...propsClick}/>}
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/sizechange/SizeChang.jsx b/src/components/canvas/modal/sizechange/SizeChang.jsx
index d3b27fa..0223413 100644
--- a/src/components/canvas/modal/sizechange/SizeChang.jsx
+++ b/src/components/canvas/modal/sizechange/SizeChang.jsx
@@ -6,7 +6,7 @@ export default function SizeChange(){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap ssm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">サイズ変更 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -50,6 +50,7 @@ export default function SizeChange(){
                         <button className="btn-frame modal act">作成</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/canvas/modal/slopeoption/SlopeOption.jsx b/src/components/canvas/modal/slopeoption/SlopeOption.jsx
index d972b86..3b5b1c1 100644
--- a/src/components/canvas/modal/slopeoption/SlopeOption.jsx
+++ b/src/components/canvas/modal/slopeoption/SlopeOption.jsx
@@ -4,7 +4,7 @@ export default function SlopeOption (){
     return(
         <WithDraggable isShow={true}>
             <div className={`modal-pop-wrap xxxm`}>
-                <div className="modal-head">
+                <div className="modal-head handle">
                     <h1 className="title">傾斜設定 </h1>
                     <button className="modal-close">닫기</button>
                 </div>
@@ -22,6 +22,7 @@ export default function SlopeOption (){
                         <button className="btn-frame modal act">保存</button>
                     </div>
                 </div>
+                <div className="modal-foot handle"></div>
             </div>
         </WithDraggable>
     )
diff --git a/src/components/common/draggable/withDraggable.jsx b/src/components/common/draggable/withDraggable.jsx
index 4da04ff..5955051 100644
--- a/src/components/common/draggable/withDraggable.jsx
+++ b/src/components/common/draggable/withDraggable.jsx
@@ -16,7 +16,7 @@ export default function WithDraggable({ isShow, handle = '', children }) {
         <Draggable
           position={{ x: position.x, y: position.y }}
           onDrag={(_, data) => handleOnDrag(data)}
-          handle={handle === '' ? '.modal-head' : handle}
+          handle={handle === '' ? '.handle' : handle}
         >
           {children}
         </Draggable>
diff --git a/src/components/publishpage/PublishPage.jsx b/src/components/publishpage/PublishPage.jsx
index 8344bf5..8ec9b25 100644
--- a/src/components/publishpage/PublishPage.jsx
+++ b/src/components/publishpage/PublishPage.jsx
@@ -143,7 +143,7 @@ export default function PublishPage() {
                 </td>
                 <td className="coding_stat_web"></td>
                 <td className='red al-c'>
-                  <ul className='mb10'>
+                  {/* <ul className='mb10'>
                     <li>2024-10-28</li>
                     <li>*canvas-setting pop 수정</li>
                     <li>*이미지 크기조절 pop 추가</li>
@@ -239,9 +239,19 @@ export default function PublishPage() {
                     <li>2025-01-10</li>
                     <li>*지붕모듈선택 팝업 메뉴 2번 수정</li>
                   </ul>
-                  <ul>
+                  <ul className='mb10'>
                     <li>2025-01-17</li>
                     <li>*면형상 배치 팝업에 handle가능 공통 modal-foot 추가</li>
+                  </ul> */}
+                  <ul className=''>
+                    <li>2025-01-20</li>
+                    <li>*지붕모듈 설정 팝업 title, 회로 및 가대설정 팝업title, 해당 메뉴 명칭 변경</li>
+                    <li>*배치면 그리기 팝업 버튼명 변경경</li>
+                    <li>*지붕형상 설정 각 input title 명칭 간격 조정</li>
+                    <li>
+                      *팝업당 '설정' 텍스트 제거 리스트<br/>
+                      &#40;지붕형상 수동 설정, 배치면 그리기, 외벽선 작성, 오브젝트 배치, 동선이동 형 올림 내림, 지붕형상 설정, 지붕모듈 설정, 보조선 작성, 처마∙케라바 변경, 외벽선 편집 및 오프셋, 각 변 속성 변경, 실측치 설정	&#41;
+                    </li>
                   </ul>
                 </td>
                 <td className="t-center">2024-10-28</td>