diff --git a/.gitea/workflows/deploy.yml b/.gitea/workflows/deploy.yml
index 065918c88..6d405c2f8 100644
--- a/.gitea/workflows/deploy.yml
+++ b/.gitea/workflows/deploy.yml
@@ -24,7 +24,9 @@ jobs:
         run: |
           ssh -i ~/.ssh/deploy_key -p 28 onasys@192.168.0.4 << 'EOF'
             cd ~/frontend
-            git pull origin main
+            git restore .
+            git clean -fd
+            git pull origin deploy
             pnpm install
             pnpm turbo build
             pm2 reload all
diff --git a/apps/_template/features/README.md b/apps/_template/features/README.md
index 2be9a3e17..329175c45 100644
--- a/apps/_template/features/README.md
+++ b/apps/_template/features/README.md
@@ -13,6 +13,7 @@
 > ⚠️ **중요**: 모든 것을 feature로 만들 필요는 없습니다.
 
 Feature로 만드는 것이 좋은 지표:
+
 - **여러 페이지에서 재사용됨**: 예를 들어, 여러 에디터가 있고 모두 댓글 기능이 있다면, 댓글은 재사용 가능한 feature입니다
 - **중요한 비즈니스 기능**: 신규 프로젝트 참여자가 Features 폴더를 보고 앱의 주요 기능을 빠르게 파악할 수 있어야 합니다
 
@@ -56,7 +57,7 @@ export function LoginForm() {
     password: ''
   });
 
-  const handleSubmit = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.SubmitEvent) => {
     e.preventDefault();
     await loginUser(credentials);
   };
@@ -104,11 +105,13 @@ export type { LoginCredentials } from './model/types';
 ## 레이어 의존성 규칙
 
 ✅ **허용되는 의존성**:
+
 - `shared` 레이어의 모듈
 - `entities` 레이어의 모듈
 - 같은 feature 슬라이스 내의 다른 세그먼트
 
 ❌ **금지된 의존성**:
+
 - 다른 `features` 슬라이스 (feature 간 직접 의존 금지)
 - `widgets` 레이어
 - `pages` 레이어
diff --git a/apps/cm/src/pages/auth/login/ui/SignupModal.tsx b/apps/cm/src/pages/auth/login/ui/SignupModal.tsx
index d61949ccc..11d7d3544 100644
--- a/apps/cm/src/pages/auth/login/ui/SignupModal.tsx
+++ b/apps/cm/src/pages/auth/login/ui/SignupModal.tsx
@@ -14,7 +14,9 @@ interface SignupModalProps {
 }
 
 function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
-  const [currentStep, setCurrentStep] = useState<'agreement' | 'signup'>('agreement');
+  const [currentStep, setCurrentStep] = useState<"agreement" | "signup">(
+    "agreement",
+  );
   const [agreed, setAgreed] = useState(false);
   const [formData, setFormData] = useState({
     userId: "",
@@ -47,7 +49,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
   // 모달이 닫힐 때 초기화
   useEffect(() => {
     if (!open) {
-      setCurrentStep('agreement');
+      setCurrentStep("agreement");
       setAgreed(false);
       setFormData({
         userId: "",
@@ -81,17 +83,19 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
   const handleNextStep = () => {
     if (agreed) {
-      setCurrentStep('signup');
+      setCurrentStep("signup");
     }
   };
 
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {
+  const handleInputChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>,
+  ) => {
     const { name, value } = e.target;
-    setFormData(prev => ({ ...prev, [name]: value }));
-    
+    setFormData((prev) => ({ ...prev, [name]: value }));
+
     // 에러 초기화
     if (errors[name]) {
-      setErrors(prev => ({ ...prev, [name]: "" }));
+      setErrors((prev) => ({ ...prev, [name]: "" }));
     }
   };
 
@@ -102,20 +106,27 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
     if (!formData.userId) newErrors.userId = "아이디를 입력해주세요.";
     if (!formData.userName) newErrors.userName = "이름을 입력해주세요.";
     if (!formData.password) newErrors.password = "비밀번호를 입력해주세요.";
-    if (!formData.confirmPassword) newErrors.confirmPassword = "비밀번호 확인을 입력해주세요.";
+    if (!formData.confirmPassword)
+      newErrors.confirmPassword = "비밀번호 확인을 입력해주세요.";
     if (!formData.pswdHnt) newErrors.pswdHnt = "비밀번호 힌트를 입력해주세요.";
     if (!formData.laeSeCd) newErrors.laeSeCd = "법인구분을 선택해주세요.";
     if (!formData.ogdpSeCd) newErrors.ogdpSeCd = "기관구분을 선택해주세요.";
 
     // 비밀번호 확인
-    if (formData.password && formData.confirmPassword && formData.password !== formData.confirmPassword) {
+    if (
+      formData.password &&
+      formData.confirmPassword &&
+      formData.password !== formData.confirmPassword
+    ) {
       newErrors.confirmPassword = "비밀번호가 일치하지 않습니다.";
     }
 
     // 비밀번호 정규식 검증
-    const passwordRegex = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]).{8,20}$/;
+    const passwordRegex =
+      /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]).{8,20}$/;
     if (formData.password && !passwordRegex.test(formData.password)) {
-      newErrors.password = "비밀번호는 8~20자, 영문/숫자/특수기호를 모두 포함해야 합니다.";
+      newErrors.password =
+        "비밀번호는 8~20자, 영문/숫자/특수기호를 모두 포함해야 합니다.";
     }
 
     // 이메일 형식 검증
@@ -124,8 +135,10 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
     }
 
     // 중복 체크 검증
-    if (idAvailable === false) newErrors.userId = "이미 사용 중인 아이디입니다.";
-    if (emailAvailable === false) newErrors.email = "이미 사용 중인 이메일입니다.";
+    if (idAvailable === false)
+      newErrors.userId = "이미 사용 중인 아이디입니다.";
+    if (emailAvailable === false)
+      newErrors.email = "이미 사용 중인 이메일입니다.";
 
     setErrors(newErrors);
     const isValid = Object.keys(newErrors).length === 0;
@@ -135,7 +148,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
   const checkUserIdDuplicate = async () => {
     if (!formData.userId) {
-      setErrors(prev => ({ ...prev, userId: "아이디를 입력해주세요." }));
+      setErrors((prev) => ({ ...prev, userId: "아이디를 입력해주세요." }));
       return;
     }
 
@@ -147,19 +160,25 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
       });
       const response = await signupClient.post<boolean>(
         `${ENDPOINT.USER_SERVICE.USERS}/existsUserId`,
-        { userId: formData.userId }
+        { userId: formData.userId },
       );
 
       const exists = response.data;
       setIdAvailable(!exists);
       if (exists) {
-        setErrors(prev => ({ ...prev, userId: "이미 사용 중인 아이디입니다." }));
+        setErrors((prev) => ({
+          ...prev,
+          userId: "이미 사용 중인 아이디입니다.",
+        }));
       } else {
-        setErrors(prev => ({ ...prev, userId: "" }));
+        setErrors((prev) => ({ ...prev, userId: "" }));
       }
     } catch (error) {
       console.error("아이디 중복 체크 오류:", error);
-      setErrors(prev => ({ ...prev, userId: "아이디 중복 체크 중 오류가 발생했습니다." }));
+      setErrors((prev) => ({
+        ...prev,
+        userId: "아이디 중복 체크 중 오류가 발생했습니다.",
+      }));
     } finally {
       setIsCheckingId(false);
     }
@@ -167,7 +186,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
   const checkEmailDuplicate = async () => {
     if (!formData.email) {
-      setErrors(prev => ({ ...prev, email: "이메일을 입력해주세요." }));
+      setErrors((prev) => ({ ...prev, email: "이메일을 입력해주세요." }));
       return;
     }
 
@@ -179,28 +198,34 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
       });
       const response = await signupClient.post<boolean>(
         `${ENDPOINT.USER_SERVICE.USERS}/exists`,
-        { email: formData.email }
+        { email: formData.email },
       );
 
       const exists = response.data;
       setEmailAvailable(!exists);
       if (exists) {
-        setErrors(prev => ({ ...prev, email: "이미 사용 중인 이메일입니다." }));
+        setErrors((prev) => ({
+          ...prev,
+          email: "이미 사용 중인 이메일입니다.",
+        }));
       } else {
-        setErrors(prev => ({ ...prev, email: "" }));
+        setErrors((prev) => ({ ...prev, email: "" }));
       }
     } catch (error) {
       console.error("이메일 중복 체크 오류:", error);
-      setErrors(prev => ({ ...prev, email: "이메일 중복 체크 중 오류가 발생했습니다." }));
+      setErrors((prev) => ({
+        ...prev,
+        email: "이메일 중복 체크 중 오류가 발생했습니다.",
+      }));
     } finally {
       setIsCheckingEmail(false);
     }
   };
 
-  const handleSubmit = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.SubmitEvent) => {
     e.preventDefault();
     console.log("회원가입 버튼 클릭됨");
-    
+
     if (!validateForm()) {
       console.log("폼 검증 실패");
       return;
@@ -230,19 +255,19 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
       // SignupClient를 통해 익명사용자 회원가입 API 호출
       const signupClient = SignupClient.getInstance({
-        baseURL: BASE_URL
+        baseURL: BASE_URL,
       });
       const response = await signupClient.post(
         `${ENDPOINT.USER_SERVICE.USERS}/anonymouse/users/join`,
-        signupData
+        signupData,
       );
 
       console.log("회원가입 성공:", response.data);
-      
+
       // 성공 시 모달 닫기 및 콜백 호출
       onSuccess();
       onClose();
-      
+
       // 폼 초기화
       setFormData({
         userId: "",
@@ -267,13 +292,12 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
       setErrors({});
       setIdAvailable(null);
       setEmailAvailable(null);
-
     } catch (error: unknown) {
       console.error("회원가입 오류:", error);
       if (error instanceof Error) {
-        setErrors(prev => ({ ...prev, submit: error.message }));
+        setErrors((prev) => ({ ...prev, submit: error.message }));
       } else {
-        setErrors(prev => ({ ...prev, submit: "회원가입에 실패했습니다." }));
+        setErrors((prev) => ({ ...prev, submit: "회원가입에 실패했습니다." }));
       }
     } finally {
       setIsLoading(false);
@@ -286,36 +310,52 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
     <div className="modal-overlay" onClick={onClose}>
       <div className="modal-content" onClick={(e) => e.stopPropagation()}>
         <div className="modal-header">
-          <h2>{currentStep === 'agreement' ? '개인정보제공동의' : '회원가입'}</h2>
-          <button className="close-button" onClick={onClose}>×</button>
+          <h2>
+            {currentStep === "agreement" ? "개인정보제공동의" : "회원가입"}
+          </h2>
+          <button className="close-button" onClick={onClose}>
+            ×
+          </button>
         </div>
-        
-        {currentStep === 'agreement' ? (
+
+        {currentStep === "agreement" ? (
           <div className="agreement-content">
             <div className="agreement-text">
               <h3>개인정보 수집 및 이용 동의</h3>
               <p>회원가입을 위해 다음과 같이 개인정보를 수집 및 이용합니다.</p>
-              
+
               <h4>1. 수집하는 개인정보 항목</h4>
               <ul>
-                <li>필수항목: 아이디, 이름, 비밀번호, 비밀번호 힌트, 법인구분, 기관구분</li>
-                <li>선택항목: 이메일, 휴대폰번호, 전화번호, 주소, 기관코드, 상세기관코드, 사업자등록번호</li>
+                <li>
+                  필수항목: 아이디, 이름, 비밀번호, 비밀번호 힌트, 법인구분,
+                  기관구분
+                </li>
+                <li>
+                  선택항목: 이메일, 휴대폰번호, 전화번호, 주소, 기관코드,
+                  상세기관코드, 사업자등록번호
+                </li>
               </ul>
-              
+
               <h4>2. 개인정보의 수집 및 이용목적</h4>
               <ul>
                 <li>회원가입 및 관리</li>
                 <li>서비스 제공 및 운영</li>
                 <li>고객상담 및 문의응답</li>
               </ul>
-              
+
               <h4>3. 개인정보의 보유 및 이용기간</h4>
-              <p>회원탈퇴 시까지 (단, 관련 법령에 따라 보존이 필요한 경우 해당 기간까지)</p>
-              
+              <p>
+                회원탈퇴 시까지 (단, 관련 법령에 따라 보존이 필요한 경우 해당
+                기간까지)
+              </p>
+
               <h4>4. 동의 거부권 및 거부 시 불이익</h4>
-              <p>개인정보 수집 및 이용에 대한 동의를 거부할 수 있으며, 동의 거부 시 회원가입이 제한됩니다.</p>
+              <p>
+                개인정보 수집 및 이용에 대한 동의를 거부할 수 있으며, 동의 거부
+                시 회원가입이 제한됩니다.
+              </p>
             </div>
-            
+
             <div className="agreement-checkbox">
               <label>
                 <input
@@ -326,13 +366,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                 <span>개인정보 수집 및 이용에 동의합니다.</span>
               </label>
             </div>
-            
+
             <div className="agreement-actions">
-              <button
-                type="button"
-                onClick={onClose}
-                className="cancel-button"
-              >
+              <button type="button" onClick={onClose} className="cancel-button">
                 취소
               </button>
               <button
@@ -349,7 +385,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
           <form onSubmit={handleSubmit} className="signup-form">
             <div className="form-section">
               <h3>기본 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="userId">아이디 *</label>
@@ -373,8 +409,14 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                       {isCheckingId ? "확인중..." : "중복확인"}
                     </button>
                   </div>
-                  {idAvailable === true && <span className="success-message">사용 가능한 아이디입니다.</span>}
-                  {errors.userId && <span className="error-message">{errors.userId}</span>}
+                  {idAvailable === true && (
+                    <span className="success-message">
+                      사용 가능한 아이디입니다.
+                    </span>
+                  )}
+                  {errors.userId && (
+                    <span className="error-message">{errors.userId}</span>
+                  )}
                 </div>
               </div>
 
@@ -390,7 +432,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     placeholder="이름을 입력하세요"
                     disabled={isLoading}
                   />
-                  {errors.userName && <span className="error-message">{errors.userName}</span>}
+                  {errors.userName && (
+                    <span className="error-message">{errors.userName}</span>
+                  )}
                 </div>
               </div>
 
@@ -416,8 +460,14 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                       {isCheckingEmail ? "확인중..." : "중복확인"}
                     </button>
                   </div>
-                  {emailAvailable === true && <span className="success-message">사용 가능한 이메일입니다.</span>}
-                  {errors.email && <span className="error-message">{errors.email}</span>}
+                  {emailAvailable === true && (
+                    <span className="success-message">
+                      사용 가능한 이메일입니다.
+                    </span>
+                  )}
+                  {errors.email && (
+                    <span className="error-message">{errors.email}</span>
+                  )}
                 </div>
               </div>
 
@@ -434,7 +484,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={20}
                     disabled={isLoading}
                   />
-                  {errors.password && <span className="error-message">{errors.password}</span>}
+                  {errors.password && (
+                    <span className="error-message">{errors.password}</span>
+                  )}
                 </div>
               </div>
 
@@ -451,7 +503,11 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={20}
                     disabled={isLoading}
                   />
-                  {errors.confirmPassword && <span className="error-message">{errors.confirmPassword}</span>}
+                  {errors.confirmPassword && (
+                    <span className="error-message">
+                      {errors.confirmPassword}
+                    </span>
+                  )}
                 </div>
               </div>
 
@@ -468,7 +524,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={10}
                     disabled={isLoading}
                   />
-                  {errors.pswdHnt && <span className="error-message">{errors.pswdHnt}</span>}
+                  {errors.pswdHnt && (
+                    <span className="error-message">{errors.pswdHnt}</span>
+                  )}
                 </div>
               </div>
 
@@ -485,14 +543,16 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={100}
                     disabled={isLoading}
                   />
-                  {errors.pswdAns && <span className="error-message">{errors.pswdAns}</span>}
+                  {errors.pswdAns && (
+                    <span className="error-message">{errors.pswdAns}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             <div className="form-section">
               <h3>연락처 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="mphn">휴대폰 번호</label>
@@ -506,7 +566,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={11}
                     disabled={isLoading}
                   />
-                  {errors.mphn && <span className="error-message">{errors.mphn}</span>}
+                  {errors.mphn && (
+                    <span className="error-message">{errors.mphn}</span>
+                  )}
                 </div>
               </div>
 
@@ -523,14 +585,16 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={11}
                     disabled={isLoading}
                   />
-                  {errors.telno && <span className="error-message">{errors.telno}</span>}
+                  {errors.telno && (
+                    <span className="error-message">{errors.telno}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             <div className="form-section">
               <h3>주소 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="zip">우편번호</label>
@@ -544,7 +608,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={5}
                     disabled={isLoading}
                   />
-                  {errors.zip && <span className="error-message">{errors.zip}</span>}
+                  {errors.zip && (
+                    <span className="error-message">{errors.zip}</span>
+                  )}
                 </div>
               </div>
 
@@ -561,7 +627,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={200}
                     disabled={isLoading}
                   />
-                  {errors.addr && <span className="error-message">{errors.addr}</span>}
+                  {errors.addr && (
+                    <span className="error-message">{errors.addr}</span>
+                  )}
                 </div>
               </div>
 
@@ -578,14 +646,16 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={200}
                     disabled={isLoading}
                   />
-                  {errors.daddr && <span className="error-message">{errors.daddr}</span>}
+                  {errors.daddr && (
+                    <span className="error-message">{errors.daddr}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             <div className="form-section">
               <h3>기관 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="laeSeCd">법인구분 *</label>
@@ -601,7 +671,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     <option value="02">민간기업</option>
                     <option value="03">개인</option>
                   </select>
-                  {errors.laeSeCd && <span className="error-message">{errors.laeSeCd}</span>}
+                  {errors.laeSeCd && (
+                    <span className="error-message">{errors.laeSeCd}</span>
+                  )}
                 </div>
               </div>
 
@@ -621,7 +693,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     <option value="03">공공기관</option>
                     <option value="04">민간기업</option>
                   </select>
-                  {errors.ogdpSeCd && <span className="error-message">{errors.ogdpSeCd}</span>}
+                  {errors.ogdpSeCd && (
+                    <span className="error-message">{errors.ogdpSeCd}</span>
+                  )}
                 </div>
               </div>
 
@@ -638,7 +712,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={10}
                     disabled={isLoading}
                   />
-                  {errors.instSeCd && <span className="error-message">{errors.instSeCd}</span>}
+                  {errors.instSeCd && (
+                    <span className="error-message">{errors.instSeCd}</span>
+                  )}
                 </div>
               </div>
 
@@ -655,21 +731,25 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={10}
                     disabled={isLoading}
                   />
-                  {errors.dtlInstCd && <span className="error-message">{errors.dtlInstCd}</span>}
+                  {errors.dtlInstCd && (
+                    <span className="error-message">{errors.dtlInstCd}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             {errors.submit && (
               <div className="form-row">
-                <div className="error-message submit-error">{errors.submit}</div>
+                <div className="error-message submit-error">
+                  {errors.submit}
+                </div>
               </div>
             )}
 
             <div className="form-actions">
               <button
                 type="button"
-                onClick={() => setCurrentStep('agreement')}
+                onClick={() => setCurrentStep("agreement")}
                 className="back-button"
                 disabled={isLoading}
               >
diff --git a/apps/cm/src/pages/auth/login/ui/UserSignupModal.tsx b/apps/cm/src/pages/auth/login/ui/UserSignupModal.tsx
index 4fb5fdf5d..8faf518f1 100644
--- a/apps/cm/src/pages/auth/login/ui/UserSignupModal.tsx
+++ b/apps/cm/src/pages/auth/login/ui/UserSignupModal.tsx
@@ -305,7 +305,7 @@ function UserSignupModal({ open, onClose, onSuccess }: UserSignupModalProps) {
     }
   };
 
-  const handleSubmit = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.SubmitEvent) => {
     e.preventDefault();
     console.log("회원가입 버튼 클릭됨 - handleSubmit");
     console.log("현재 폼 데이터:", formData);
diff --git a/apps/cm/src/pages/auth/login/ui/login-page.tsx b/apps/cm/src/pages/auth/login/ui/login-page.tsx
index 297d28a8f..4a168fcfd 100644
--- a/apps/cm/src/pages/auth/login/ui/login-page.tsx
+++ b/apps/cm/src/pages/auth/login/ui/login-page.tsx
@@ -26,7 +26,7 @@ function LoginPage() {
     console.log("Modal states - OTP:", showOtpModal, "2FA:", showTwoFAModal);
   }, [showOtpModal, showTwoFAModal]);
 
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setIsLoading(true);
     setError("");
@@ -43,44 +43,54 @@ function LoginPage() {
       if (isOtpEnabled) {
         // 2FA 로그인 - Proxy를 통해 처리 (2FA 전용 엔드포인트 사용)
         console.log("Starting 2FA login...");
-        
-        const response = await fetch(`/api/proxy${ENDPOINT.USER_SERVICE.LOGIN_2FA}`, {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({
-            userId,
-            password,
-            provider: 'password'
-          }),
-        });
+
+        const response = await fetch(
+          `/api/proxy${ENDPOINT.USER_SERVICE.LOGIN_2FA}`,
+          {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify({
+              userId,
+              password,
+              provider: "password",
+            }),
+          },
+        );
 
         if (!response.ok) {
           const errorData = await response.json();
-          let errorMsg = errorData.message || '로그인 실패';
+          let errorMsg = errorData.message || "로그인 실패";
           if (Array.isArray(errorData.errors) && errorData.errors.length > 0) {
-            errorMsg = errorData.errors.map((e: { message: string }) => e.message).join(', ');
+            errorMsg = errorData.errors
+              .map((e: { message: string }) => e.message)
+              .join(", ");
           }
           throw new Error(errorMsg);
         }
 
         const data = await response.json();
         console.log("2FA login response:", data);
-        console.log("Response headers:", Object.fromEntries(response.headers.entries()));
-        
+        console.log(
+          "Response headers:",
+          Object.fromEntries(response.headers.entries()),
+        );
+
         // 2FA 로그인 응답에는 tempToken과 registered2FA만 포함됨
         if (!data.tempToken) {
           throw new Error("Missing tempToken in 2FA login response");
         }
 
         // 임시 토큰을 localStorage에 저장 (OTP 인증용)
-        localStorage.setItem('tempToken', data.tempToken);
+        localStorage.setItem("tempToken", data.tempToken);
         console.log("tempToken saved:", data.tempToken);
 
         if (data.registered2FA) {
           console.log("User has 2FA registered, showing OTP modal");
           setShowOtpModal(true);
         } else {
-          console.log("User doesn't have 2FA registered, showing 2FA setup modal");
+          console.log(
+            "User doesn't have 2FA registered, showing 2FA setup modal",
+          );
           setShowTwoFAModal(true);
         }
       } else {
@@ -91,7 +101,7 @@ function LoginPage() {
       }
     } catch (error: unknown) {
       console.error("Login error:", error);
-      
+
       // 에러 처리
       if (error instanceof Error) {
         setError(error.message);
@@ -218,25 +228,36 @@ function LoginPage() {
                 <label htmlFor="checkTwoFA">OTP 인증</label>
               </div>
             </div>
-            <button 
-              type="submit" 
-              className="login_btn fx"
-              disabled={isLoading}
-            >
+            <button type="submit" className="login_btn fx" disabled={isLoading}>
               <span>{isLoading ? "로그인 중..." : "LOGIN"}</span>
             </button>
             {error && (
-              <div className="error-message" style={{ color: "red", textAlign: "center", marginTop: "10px" }}>
+              <div
+                className="error-message"
+                style={{ color: "red", textAlign: "center", marginTop: "10px" }}
+              >
                 {error}
               </div>
             )}
             {successMessage && (
-              <div className="success-message" style={{ color: "green", textAlign: "center", marginTop: "10px" }}>
+              <div
+                className="success-message"
+                style={{
+                  color: "green",
+                  textAlign: "center",
+                  marginTop: "10px",
+                }}
+              >
                 {successMessage}
               </div>
             )}
-            <div className="signup-link" style={{ textAlign: "center", marginTop: "15px" }}>
-              <span style={{ color: "#666", fontSize: "14px" }}>계정이 없으신가요? </span>
+            <div
+              className="signup-link"
+              style={{ textAlign: "center", marginTop: "15px" }}
+            >
+              <span style={{ color: "#666", fontSize: "14px" }}>
+                계정이 없으신가요?{" "}
+              </span>
               <button
                 type="button"
                 onClick={() => setShowSignupModal(true)}
@@ -246,7 +267,7 @@ function LoginPage() {
                   color: "#3b82f6",
                   textDecoration: "underline",
                   cursor: "pointer",
-                  fontSize: "14px"
+                  fontSize: "14px",
                 }}
               >
                 회원가입
@@ -282,8 +303,8 @@ function LoginPage() {
                   종합환경연구단지)
                 </span>
                 <span>
-                  전화 : (시스템) 032-590-4321, 3752, 4314 / (통 계) 032-590-3723,
-                  3722
+                  전화 : (시스템) 032-590-4321, 3752, 4314 / (통 계)
+                  032-590-3723, 3722
                 </span>
                 <span>팩스 :032-590-3729</span>
               </p>
diff --git a/apps/cm/src/pages/users/ui/users-page.tsx b/apps/cm/src/pages/users/ui/users-page.tsx
index 5362b8b42..5670eb9d3 100644
--- a/apps/cm/src/pages/users/ui/users-page.tsx
+++ b/apps/cm/src/pages/users/ui/users-page.tsx
@@ -102,7 +102,7 @@ function UsersPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/common/features/src/pages/(post)/faq/ui/faq-page.tsx b/apps/common/features/src/pages/(post)/faq/ui/faq-page.tsx
index 6255bb27a..6fb5dc96c 100644
--- a/apps/common/features/src/pages/(post)/faq/ui/faq-page.tsx
+++ b/apps/common/features/src/pages/(post)/faq/ui/faq-page.tsx
@@ -83,7 +83,7 @@ function FaqPage({ bbsId }: { bbsId: string }) {
     }
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     refetch();
   };
diff --git a/apps/common/features/src/pages/auth/login/ui/login-page.tsx b/apps/common/features/src/pages/auth/login/ui/login-page.tsx
index 4700a691b..95945c8ed 100644
--- a/apps/common/features/src/pages/auth/login/ui/login-page.tsx
+++ b/apps/common/features/src/pages/auth/login/ui/login-page.tsx
@@ -6,7 +6,7 @@ import { LoginApi } from "@/entities/auth";
 import "./login.css";
 
 function LoginPage() {
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
 
     const formData = new FormData(e.target as HTMLFormElement);
diff --git a/apps/common/features/src/pages/search/ui/search-page.tsx b/apps/common/features/src/pages/search/ui/search-page.tsx
index dd1aec0b2..8324803d7 100644
--- a/apps/common/features/src/pages/search/ui/search-page.tsx
+++ b/apps/common/features/src/pages/search/ui/search-page.tsx
@@ -33,7 +33,7 @@ function SearchPage() {
     queryFn: () => SearchApi.searchPost({ keyword: keyword, siteId }),
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     const formData = new FormData(e.target as HTMLFormElement);
     setKeyword(formData.get("keyword") as string);
@@ -84,7 +84,8 @@ function SearchPage() {
               <TabsList className="mx-auto">
                 <TabsTrigger value="all">
                   전체 (
-                  { (data?.contsList?.length ?? 0) + (data?.boardList?.totalElements ?? 0)}
+                  {(data?.contsList?.length ?? 0) +
+                    (data?.boardList?.totalElements ?? 0)}
                   건)
                 </TabsTrigger>
                 <TabsTrigger value="contents">
diff --git a/apps/common/features/src/widgets/post/ui/post-page.tsx b/apps/common/features/src/widgets/post/ui/post-page.tsx
index 7aaa390fc..922a0e910 100644
--- a/apps/common/features/src/widgets/post/ui/post-page.tsx
+++ b/apps/common/features/src/widgets/post/ui/post-page.tsx
@@ -134,7 +134,7 @@ function PostPage({ bbsId }: { bbsId: string }) {
     }
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/app/(with-base-layout)/layout.tsx b/apps/cs/app/(with-base-layout)/layout.tsx
index 3c1a527d7..acc583e2e 100644
--- a/apps/cs/app/(with-base-layout)/layout.tsx
+++ b/apps/cs/app/(with-base-layout)/layout.tsx
@@ -6,6 +6,7 @@ import { BaseLayout } from "@common/components";
 import type { MenuItem } from "@/entities/menu";
 import { useMenuStore } from "@/shared/lib";
 import { PageLayout } from "@/shared/ui/page-layout";
+import { tokenManager } from "@/entities/auth";
 
 export default function WithBaseLayout({
   children,
@@ -26,6 +27,7 @@ export default function WithBaseLayout({
   return (
     <BaseLayout
       queryClient={queryClient}
+      tokenManager={tokenManager}
       currentPath={pathname ?? ""}
       handleMenuClick={handleMenuClick}
     >
diff --git a/apps/cs/app/(with-base-layout)/ntftalk-history/page.tsx b/apps/cs/app/(with-base-layout)/ntftalk-history/page.tsx
new file mode 100644
index 000000000..3e2afeb35
--- /dev/null
+++ b/apps/cs/app/(with-base-layout)/ntftalk-history/page.tsx
@@ -0,0 +1,3 @@
+import { NtftalkHistoryPage } from "@/pages/ntftalk-history";
+
+export default NtftalkHistoryPage;
diff --git a/apps/cs/app/(with-base-layout)/ntftalk-temp/page.tsx b/apps/cs/app/(with-base-layout)/ntftalk-temp/page.tsx
new file mode 100644
index 000000000..04ff3524a
--- /dev/null
+++ b/apps/cs/app/(with-base-layout)/ntftalk-temp/page.tsx
@@ -0,0 +1,3 @@
+import { NtftalkTempPage } from "@/pages/ntftalk-temp";
+
+export default NtftalkTempPage;
diff --git a/apps/cs/app/api/proxy/[...url]/route.ts b/apps/cs/app/api/proxy/[...url]/route.ts
index abd3ae007..0929ca57c 100644
--- a/apps/cs/app/api/proxy/[...url]/route.ts
+++ b/apps/cs/app/api/proxy/[...url]/route.ts
@@ -2,6 +2,7 @@ import {
   ACCESS_TOKEN,
   AUTH_USER_ID,
   CLAIM_NAME,
+  COOKIE_DOMAIN,
   REFRESH_TOKEN,
   SERVER_API_URL,
   SITE_ID,
@@ -60,18 +61,11 @@ async function handler(
         [AUTH_USER_ID]: userId,
       });
 
-      const forwardedHost = request.headers.get("x-forwarded-host");
-      const host = request.headers.get("host");
-      const actualHost = forwardedHost || host || new URL(request.url).hostname.toString();
-      
-      // 운영 환경에서 domain 설정
-      const domain = actualHost.includes("hasuon.or.kr") ? ".hasuon.or.kr" : actualHost;
-
       if (refreshToken) {
-        cookieStore.set(REFRESH_TOKEN, refreshToken, {
+        response.cookies.set(REFRESH_TOKEN, refreshToken, {
           httpOnly: true,
           sameSite: "strict",
-          domain: domain,
+          domain: getCookieDomain(),
           path: "/",
         });
       }
@@ -91,7 +85,6 @@ async function handler(
   }
 }
 
-
 export async function POST(
   request: Request,
   props: { params: Promise<{ url: string[] }> },
@@ -107,3 +100,14 @@ export async function PUT(
   const params = await props.params;
   return handler(request, params, "PUT");
 }
+
+function getCookieDomain(): string | undefined {
+  if (typeof window === "undefined") return undefined;
+
+  if (COOKIE_DOMAIN) return COOKIE_DOMAIN;
+
+  const { hostname } = window.location;
+  if (hostname === "localhost" || hostname === "127.0.0.1") return undefined;
+
+  return hostname;
+}
diff --git a/apps/cs/docs/spec/ntftalk/history/SPEC.md b/apps/cs/docs/spec/ntftalk/history/SPEC.md
new file mode 100644
index 000000000..51740470a
--- /dev/null
+++ b/apps/cs/docs/spec/ntftalk/history/SPEC.md
@@ -0,0 +1,164 @@
+# 화면설계서: 알림톡발송이력관리
+
+## 1. 기본 정보
+
+| 항목       | 내용                                         |
+| ---------- | -------------------------------------------- |
+| 버전       | 1.0                                          |
+| 프로세스명 | UI설계                                       |
+| 화면명     | 알림톡발송이력관리                           |
+| 화면 유형  | [x] 조회 [ ] 입력 [ ] 삭제 [ ] 수정 [ ] 출력 |
+| 메뉴 경로  | home > 시스템관리 > 알림톡발송이력관리       |
+
+---
+
+## 2. 화면 목적
+
+알림톡 발송 이력을 **기간·내용·수신자·결과·시스템** 조건으로 검색하고, **발송 시스템·알림 내용·수신자·수신 시각·성공 여부**를 목록으로 확인한다.
+
+---
+
+## 3. 화면 구성
+
+### 3-1. 전체 레이아웃
+
+```
+┌────────────────────────────────────────────────────────────────────┐
+│  페이지 제목: 알림톡발송이력관리           브레드크럼 (우측 상단)  │
+├────────────────────────────────────────────────────────────────────┤
+│  [영역 A] 검색 필터                                                │
+│   · 조회기간, 알림내용, 사용자, 결과, 시스템                       │
+│   · [조회], [초기화]                                               │
+├────────────────────────────────────────────────────────────────────┤
+│  [영역 B] 알림톡 발송 이력 그리드                                  │
+│   · 순번, 시스템, 알림내용, 수신자, 수신일, 결과                   │
+│   · 페이지네이션                                                   │
+└────────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+## 4. 영역 A: 검색 필터
+
+### 4-1. 필드 정의
+
+| 표시명   | 입력 유형            | 필수 | 기본값        | API 파라미터 매핑                   | 비고                                        |
+| -------- | -------------------- | ---- | ------------- | ----------------------------------- | ------------------------------------------- |
+| 조회기간 | InputDateRangePicker | N    | 1개월 전~오늘 | `dateFrom`, `dateTo` (`yyyy-MM-dd`) | `src/shared/ui/input-date-range-picker.tsx` |
+| 알림내용 | 텍스트               | N    | 공백          | `content`                           |                                             |
+| 사용자   | 텍스트               | N    | 공백          | `recipientNum`                      |                                             |
+| 결과     | 드롭다운             | N    | 전체          | `successYn`                         | `SUCCESS` \| `FAIL` \| `ALL`                |
+| 시스템   | SiteSelect           | N    | 전체          | `system`                            | `src/entities/site/ui/site-select.tsx`      |
+
+### 4-2. 버튼
+
+| 버튼명 | 동작                                                             |
+| ------ | ---------------------------------------------------------------- |
+| 조회   | 현재 필터로 영역 B 목록을 재조회한다. 페이지는 1페이지로 초기화. |
+| 초기화 | 검색 필드를 기본값으로 되돌린다.                                 |
+
+---
+
+## 5. 영역 B: 알림톡 발송 이력 그리드
+
+### 5-1. 그리드 컬럼
+
+| 표시명   | Field          | 비고                                                                      |
+| -------- | -------------- | ------------------------------------------------------------------------- |
+| 순번     | —              | 클라이언트 표시용 인덱스(서버 필드 없음). 페이지네이션 시 오프셋 반영     |
+| 시스템   | `siteSystem`   | 응답 시 `templateCode` 앞 4자 기반 파생(행정지원·하수도통계·포털·기타)    |
+| 알림내용 | `content`      | 긴 텍스트 말줄임 처리. 툴팁 적용하여 전체 텍스트 확인 가능.               |
+| 수신자   | `recipientNum` | 실데이터·마스킹 규칙 **TBD**                                              |
+| 수신일   | `dateRslt`     | `YYYY-MM-DD HH:mm:ss` 형식 표시.                                          |
+| 결과     | `successYn`    | UI 표시: `SUCCESS` → 성공, `FAIL` → 실패(백엔드는 `reportCode` 기반 파생) |
+
+- 행 클릭 UX 없음.
+
+---
+
+## 6. API/DTO 명세
+
+### 6-1. 공통
+
+- 목록 응답: Spring `Page` 직렬화 형태 — 프론트 타입 `PageableList<NtftalkMmtLogHistory>` (`content`, `totalElements`, `totalPages`, `number`, `size` 등).
+- 목록 요청 쿼리: `Pageable` 표준 파라미터 `page`, `size`, `sort` (`PageableParams`).
+
+### 6-2. 알림톡 발송 이력 API
+
+Base: `/ntftalk-service/api/v1/ata/mmt-log-history`
+
+| 기능              | Method | URL                           | Request DTO                                                                                  | Response DTO                                                         | API(클라이언트 함수명)        |
+| ----------------- | ------ | ----------------------------- | -------------------------------------------------------------------------------------------- | -------------------------------------------------------------------- | ----------------------------- |
+| 목록 조회(페이징) | GET    | `/ata/mmt-log-history`        | Query: `AtaMmtLogHistorySearchDto` 필드 + `Pageable`(`page`,`size`,`sort`)                   | `Page<AtaMmtLogHistoryResponseDto>` → `NtftalkMmtLogHistoryPageList` | `getNtftalkMmtLogHistoryPage` |
+| 상세 조회         | GET    | `/ata/mmt-log-history/{mtPr}` | Path: `mtPr`                                                                                 | `AtaMmtLogHistoryResponseDto` → `NtftalkMmtLogHistory`               | `getNtftalkMmtLogHistory`     |
+| 등록              | POST   | `/ata/mmt-log-history`        | Body: `AtaMmtLogHistorySaveRequestDto` → `NtftalkMmtLogHistorySavePayload`                   | `AtaMmtLogHistoryResponseDto`                                        | `saveNtftalkMmtLogHistory`    |
+| 수정              | PUT    | `/ata/mmt-log-history/{mtPr}` | Path: `mtPr`, Body: `AtaMmtLogHistoryUpdateRequestDto` → `NtftalkMmtLogHistoryUpdatePayload` | `AtaMmtLogHistoryResponseDto`                                        | `updateNtftalkMmtLogHistory`  |
+| 삭제              | DELETE | `/ata/mmt-log-history/{mtPr}` | Path: `mtPr`                                                                                 | 없음(204)                                                            | `deleteNtftalkMmtLogHistory`  |
+
+#### 검색 Query ↔ TypeScript (`NtftalkMmtLogHistorySearchParams`)
+
+| Query (Java 필드) | TS 필드         | 설명                                 |
+| ----------------- | --------------- | ------------------------------------ |
+| `subject`         | `subject?`      | 메시지 제목                          |
+| `content`         | `content?`      | 전송 메시지 내용                     |
+| `recipientNum`    | `recipientNum?` | 수신자 전화번호                      |
+| `msgStatus`       | `msgStatus?`    | `1` 전송대기, `2` 결과대기, `3` 완료 |
+| `reportCode`      | `reportCode?`   | 전송 결과 코드(`1000`: 성공)         |
+| `dateFrom`        | `dateFrom?`     | `yyyy-MM-dd`                         |
+| `dateTo`          | `dateTo?`       | `yyyy-MM-dd`                         |
+| `system`          | `system?`       | `ADSS` \| `CWMS` \| `PORT` \| `ALL`  |
+| `successYn`       | `successYn?`    | `SUCCESS` \| `FAIL` \| `ALL`         |
+
+#### 응답 행 ↔ TypeScript (`NtftalkMmtLogHistory`)
+
+백엔드 `AtaMmtLogHistoryResponseDto`와 동일 필드명: `mtPr`, `mtRefkey`, `priority`, `dateClientReq`, `subject`, `content`, `callback`, `msgStatus`, `recipientNum`, `dateMtSent`, `dateRslt`, `dateMtReport`, `reportCode`, `countryCode`, `msgType`, `regDate`, `senderKey`, `templateCode`, `siteSystem`, `successYn`.
+
+---
+
+## 7. UI 구현 가이드
+
+### 7-1. 기술 스택·원칙
+
+- **UI**: `@common/components` 공통 컴포넌트
+- **테이블**: `@tanstack/react-table` + `useDataTable`(`src/shared/lib/use-data-table.tsx`)
+- **데이터**: `@tanstack/react-query` — 목록은 `getNtftalkMmtLogHistoryPage`, 무한 스크롤 vs 페이지 UI는 **TBD**
+- **레이아웃**: App Router `app/(with-base-layout)/ntftalk-history/page.tsx`에서 페이지 UI 마운트
+
+### 7-2. 모듈·파일 배치
+
+| 구분            | 경로                                                                                                                |
+| --------------- | ------------------------------------------------------------------------------------------------------------------- |
+| 라우트 엔트리   | `apps/cs/app/(with-base-layout)/ntftalk-history/page.tsx`                                                           |
+| 페이지 셸       | `apps/cs/src/pages/ntftalk-history/ui/ntftalk-history-page.tsx`                                                     |
+| 컬럼 정의       | `apps/cs/src/pages/ntftalk-history/model/*-table-columns.tsx`                                                       |
+| API·타입        | `apps/cs/src/entities/ntftalk/model/ntftalk-mmt-log-history-interface.ts`, `api/ntftalk-mmt-log-history-service.ts` |
+| 엔드포인트 상수 | `apps/cs/src/shared/config/api.ts` — `ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY`                                     |
+
+### 7-3. 영역별 UI 매핑
+
+| 영역 | 화면 요소    | 컴포넌트·훅                                      | 구현 비고                    |
+| ---- | ------------ | ------------------------------------------------ | ---------------------------- |
+| A    | 검색 폼      | `Input`, `Label`, `Select`, `Button`             |                              |
+| B    | 이력 그리드  | `useDataTable` + `ColumnDef`, `manualPagination` |                              |
+| 공통 | 로딩·빈 목록 | `LoadingWithAnimation`, 빈 데이터 안내           | 기타 목록 페이지와 동일 수준 |
+
+### 7-4. 데이터 흐름
+
+```
+BEGIN
+
+  // 최초 진입
+  CALL 알림톡발송이력목록조회(기본 검색 조건, page=0, size=10)
+  DISPLAY 알림톡 발송 이력 그리드 (영역 B)
+
+  ON [조회] 버튼 CLICK DO
+      CALL 알림톡발송이력목록조회(조회기간→dateFrom/dateTo, content, recipientNum, successYn, system, page=0)
+      DISPLAY 알림톡 발송 이력 그리드 (영역 B)
+  END ON
+
+  ON [초기화] 버튼 CLICK DO
+      RESET 검색 조건 → 기본값
+  END ON
+
+END
+```
diff --git a/apps/cs/docs/spec/ntftalk/temp/SPEC.md b/apps/cs/docs/spec/ntftalk/temp/SPEC.md
new file mode 100644
index 000000000..0b84ace4a
--- /dev/null
+++ b/apps/cs/docs/spec/ntftalk/temp/SPEC.md
@@ -0,0 +1,262 @@
+# 화면설계서: 알림톡템플릿관리
+
+## 1. 기본 정보
+
+| 항목       | 내용                                         |
+| ---------- | -------------------------------------------- |
+| 버전       | 1.0                                          |
+| 프로세스명 | UI설계                                       |
+| 화면명     | 알림톡템플릿관리                             |
+| 화면 유형  | [x] 조회 [x] 입력 [x] 삭제 [ ] 수정 [ ] 출력 |
+| 메뉴 경로  | home > 시스템관리 > 알림톡템플릿관리         |
+
+---
+
+## 2. 화면 목적
+
+카카오 알림톡(또는 동일 채널) **템플릿 목록을 조회·관리**하고, 선택한 템플릿에 연결된 **치환 변수 목록**을 확인·관리한다.
+
+---
+
+## 3. 화면 구성
+
+### 3-1. 전체 레이아웃
+
+```
+┌──────────────────────────────────────────────────────────────────────────────┐
+│  페이지 제목: 알림톡템플릿관리                       브레드크럼 (우측 상단)  │
+├──────────────────────────────────────────────────────────────────────────────┤
+│  [영역 A] 검색 필터                                                          │
+│   · 1행: 템플릿코드, 템플릿명, 템플릿내용 (텍스트)                           │
+│   · 2행: 채널, 검수상태, 메시지유형 (드롭다운, 기본값: 전체) | 조회, 초기화  │
+├──────────────────────────────────────────────────────────────────────────────┤
+│  [영역 B] 알림톡 템플릿 관리                                                 │
+│   · 섹션 제목 + 툴바(템플릿갱신, 템플릿등록, 선택 검수요청, 선택삭제, 저장)  │
+│   · 템플릿 그리드 (체크박스 다중 선택)                                       │
+├──────────────────────────────────────────────────────────────────────────────┤
+│  [영역 C] 변수관리                                                           │
+│   · 섹션 제목 + 툴바(변수추가, 선택삭제, 저장)                               │
+│   · 변수 그리드                                                              │
+└──────────────────────────────────────────────────────────────────────────────┘
+```
+
+---
+
+## 4. 영역 A: 검색 필터
+
+### 4-1. 필드 정의
+
+| 표시명     | 입력 유형 | 필수 | 기본값 | API 파라미터 매핑  | 비고                                    |
+| ---------- | --------- | ---- | ------ | ------------------ | --------------------------------------- |
+| 템플릿코드 | 텍스트    | N    | 공백   | `templateCode`     |                                         |
+| 템플릿명   | 텍스트    | N    | 공백   | `templateName`     |                                         |
+| 템플릿내용 | 텍스트    | N    | 공백   | -                  | 현재 `NtftalkTempSearchParams`에 미정의 |
+| 채널       | 드롭다운  | N    | 전체   | `senderKey`        |                                         |
+| 검수상태   | 드롭다운  | N    | 전체   | `inspectionStatus` |                                         |
+| 메시지유형 | 드롭다운  | N    | 전체   | -                  | 현재 `NtftalkTempSearchParams`에 미정의 |
+
+### 4-2. 버튼
+
+| 버튼명 | 동작                                                                    |
+| ------ | ----------------------------------------------------------------------- |
+| 조회   | 현재 필터 조건으로 영역 B 목록을 재조회한다. 페이지는 1페이지로 초기화. |
+| 초기화 | 검색 필드를 기본값(공백·전체)으로 되돌린다.                             |
+
+---
+
+## 5. 영역 B: 알림톡 템플릿 관리
+
+### 5-1. 툴바 버튼
+
+| 버튼명        | 동작(요구사항)                                          |
+| ------------- | ------------------------------------------------------- |
+| 템플릿갱신    | API를 재조회하여 템플릿 목록을 갱신한다.                |
+| 템플릿등록    | 신규 템플릿 등록 다이얼로그를 오픈한다.                 |
+| 선택 검수요청 | 체크된 행에 대해 검수 요청 API를 호출한다.              |
+| 선택삭제      | 체크된 행을 삭제한다. 데이터베이스에는 삭제되지 않는다. |
+| 저장          | 그리드에서 변경된 내용을 일괄 저장한다.                 |
+
+※ 실제 API·권한은 백엔드 정책에 따른다.
+
+### 5-2. 그리드 컬럼
+
+| 표시명     | Field                   | 비고                                      |
+| ---------- | ----------------------- | ----------------------------------------- |
+| (선택)     | —                       | 체크박스, 다중 선택                       |
+| @채널      | `senderKey`             |                                           |
+| 템플릿코드 | `templateCode`          |                                           |
+| 템플릿명   | `templateName`          |                                           |
+| 메시지유형 | `templateMessageType`   |                                           |
+| 템플릿내용 | `templateContent`       | 긴 텍스트, 말줄임 처리                    |
+| 강조유형   | `templateEmphasizeType` |                                           |
+| 버튼정보   | `buttons`               |                                           |
+| 검수상태   | `inspectionStatus`      |                                           |
+| 상태       | `status`                |                                           |
+| 등록일자   | `createdAt`             | ISO datetime 문자열 (YYYY-MM-DD HH:mm:ss) |
+
+### 5-3. 행 상호작용
+
+- 행 **클릭** 시: 해당 템플릿의 상세 다이얼로그를 오픈한다.
+- 다중 체크는 **삭제·검수요청** 등 일괄 작업용으로 사용한다.
+
+---
+
+## 6. 영역 C: 변수관리
+
+알림톡 템플릿에 사용되는 공통 변수 목록을 관리한다.
+
+### 6-1. 툴바 버튼
+
+| 버튼명   | 동작                          |
+| -------- | ----------------------------- |
+| 변수추가 | 변수 행 추가(인라인).         |
+| 선택삭제 | 선택된 변수 행 삭제.          |
+| 저장     | 추가·수정·삭제 반영 API 호출. |
+
+### 6-2. 그리드 컬럼
+
+| 표시명   | Field     | 비고                                      |
+| -------- | --------- | ----------------------------------------- |
+| 순번     | —         | 화면 표시용 row index(서버 필드 없음)     |
+| 변수코드 | `varCd`   |                                           |
+| 변수명   | `varNm`   |                                           |
+| 설명     | `varDesc` |                                           |
+| 등록일자 | `regDt`   | ISO datetime 문자열 (YYYY-MM-DD HH:mm:ss) |
+| 등록자   | `regr`    |                                           |
+
+---
+
+## 7. API/DTO 명세
+
+### 7-1. 공통
+
+- Base Endpoint Prefix: `/ntftalk-service/api/v1`
+
+### 7-2. 템플릿 API
+
+Base: `ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP`(`/ntftalk-service/api/v1/ntftalk-temp`)
+
+| 기능             | Method | URL                            | Request DTO                                            | Response DTO          | API                  |
+| ---------------- | ------ | ------------------------------ | ------------------------------------------------------ | --------------------- | -------------------- |
+| 템플릿 목록 조회 | GET    | `/ntftalk-temp`                | `NtftalkTempSearchParams`                              | `NtftalkTempPageList` | `getNtftalkTempPage` |
+| 템플릿 상세 조회 | GET    | `/ntftalk-temp/{templateCode}` | Path: `templateCode`                                   | `NtftalkTemp`         | `getNtftalkTemp`     |
+| 템플릿 등록      | POST   | `/ntftalk-temp`                | `NtftalkTempSavePayload`                               | `NtftalkTemp`         | `saveNtftalkTemp`    |
+| 템플릿 수정      | PUT    | `/ntftalk-temp/{templateCode}` | Path: `templateCode`, Body: `NtftalkTempUpdatePayload` | `NtftalkTemp`         | `updateNtftalkTemp`  |
+| 템플릿 삭제      | DELETE | `/ntftalk-temp/{templateCode}` | Path: `templateCode`                                   | 없음                  | `deleteNtftalkTemp`  |
+
+### 7-3. 변수 API
+
+Base: `ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR`(`/ntftalk-service/api/v1/ntftalk-var`)
+
+| 기능           | Method | URL                    | Request DTO                                    | Response DTO         | API                 |
+| -------------- | ------ | ---------------------- | ---------------------------------------------- | -------------------- | ------------------- |
+| 변수 목록 조회 | GET    | `/ntftalk-var`         | `NtftalkVarSearchParams`                       | `NtftalkVarPageList` | `getNtftalkVarPage` |
+| 변수 상세 조회 | GET    | `/ntftalk-var/{varCd}` | Path: `varCd`                                  | `NtftalkVar`         | `getNtftalkVar`     |
+| 변수 등록      | POST   | `/ntftalk-var`         | `NtftalkVarSavePayload`                        | `NtftalkVar`         | `saveNtftalkVar`    |
+| 변수 수정      | PUT    | `/ntftalk-var/{varCd}` | Path: `varCd`, Body: `NtftalkVarUpdatePayload` | `NtftalkVar`         | `updateNtftalkVar`  |
+| 변수 삭제      | DELETE | `/ntftalk-var/{varCd}` | Path: `varCd`                                  | 없음                 | `deleteNtftalkVar`  |
+
+---
+
+## 8. UI 구현 가이드
+
+### 8-1. 기술 스택·원칙
+
+- **UI**: `@common/components` 공통 컴포넌트 사용
+- **테이블**: `@tanstack/react-table` + `useDataTable`(`src/shared/lib/use-data-table.tsx`)
+- **데이터**: `@tanstack/react-query`(등록/수정 폼에 검증이 필요하면 `react-hook-form` + `zod` 사용)
+- **레이아웃**: App Router `app/(with-base-layout)/.../page.tsx`에서 페이지 UI 컴포넌트만 마운트
+
+### 8-2. 모듈·파일 배치
+
+| 구분          | 경로                                                                    |
+| ------------- | ----------------------------------------------------------------------- |
+| 라우트 엔트리 | `apps/cs/app/(with-base-layout)/ntftalk-temp/page.tsx`                  |
+| 페이지 셸     | `apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-page.tsx`               |
+| 컬럼 정의     | `apps/cs/src/pages/ntftalk-temp/model/*-table-columns.tsx`              |
+| API·타입      | `apps/cs/src/entities/ntftalk/model/*-interface.ts`, `api/*-service.ts` |
+| 다이얼로그    | `apps/cs/src/pages/ntftalk-temp/ui/*-dialog.tsx`                        |
+
+### 8-3. 영역별 UI 매핑
+
+| 영역 | 화면 요소     | 권장 컴포넌트·훅                                             | 구현 비고                                                                                     |
+| ---- | ------------- | ------------------------------------------------------------ | --------------------------------------------------------------------------------------------- |
+| A    | 검색 폼       | `Input`, `Label`, `Select`, `Button`                         |                                                                                               |
+| B    | 템플릿 그리드 | `useDataTable` + `ColumnDef`, `RowSelectionState`(컬럼 선택) | `manualPagination`, `onRowClick` → **8-4** 상세 다이얼로그                                    |
+| B    | 툴바          | `Button` 그룹                                                | 검수요청·삭제 등 확인은 `useConfirm` + `src/shared/ui/confirm-dialog.tsx` 등 기존 패턴 재사용 |
+| C    | 변수 그리드   | `useDataTable` + `ColumnDef`, `Input` + `zod`                | **변수추가는 인라인**(6-1절). 선택 행 삭제·저장은 변수 API(7-3절)와 매핑. 검증은 `zod` 사용   |
+| 공통 | 로딩·빈 목록  | `LoadingWithAnimation`, 빈 데이터 안내 문구                  | 기타 목록 페이지와 동일 수준 처리                                                             |
+
+### 8-4. 다이얼로그·라우팅
+
+| UX                                | 구현 단위                 | 컨테이너·비고                                                                |
+| --------------------------------- | ------------------------- | ---------------------------------------------------------------------------- |
+| 템플릿등록 (5-1)                  | `NtftalkTempRegistDialog` | `Dialog` + 폼. `saveNtftalkTemp`(7-2)                                        |
+| 행 클릭 상세 (5-3)                | `NtftalkTempDetailDialog` | **별도 라우트가 아닌 다이얼로그**로 구현. `getNtftalkTemp`(7-2)로 상세 로드  |
+| 선택 검수요청·선택삭제·저장 (5-1) | mutation + confirm        | 각각 대응 API(7-2) 및 백엔드 정책에 따름. 미확정 엔드포인트는 **TBD**로 표기 |
+
+### 8-5. 데이터 흐름
+
+```
+BEGIN
+
+  // 최초 진입
+  CALL 템플릿목록조회(기본 검색 조건)
+  DISPLAY 알림톡템플릿그리드 (영역 B)
+
+  CALL 변수목록조회(검색 조건)
+  DISPLAY 변수그리드 (영역 C)
+
+  // 영역 A: 조회·초기화
+  ON [조회] 버튼 CLICK DO
+      CALL 템플릿목록조회(템플릿코드, 템플릿명, 템플릿내용, 채널, 검수상태, 메시지유형)  // → 영역 B 갱신, 페이지 1로 초기화
+  END ON
+
+  ON [초기화] 버튼 CLICK DO
+      RESET 검색 조건 → 기본값(공백·전체)
+  END ON
+
+  // 영역 B: 알림톡 템플릿 (7-2절 참고)
+  ON [템플릿갱신] CLICK DO
+      CALL 템플릿목록조회(현재 검색 조건)  // → 영역 B 갱신
+  END ON
+
+  ON [템플릿등록] CLICK DO
+      OPEN 템플릿등록 다이얼로그
+  END ON
+
+  ON 영역 B 행 CLICK DO
+      CALL 템플릿상세조회(선택된 templateCode)
+      DISPLAY 템플릿상세 다이얼로그
+  END ON
+
+  ON [선택 검수요청] CLICK DO
+      CONFIRM 사용자
+      CALL 검수요청 API(체크된 행)
+  END ON
+
+  ON [선택삭제] CLICK DO
+      CONFIRM 사용자
+      CALL 템플릿삭제 API(체크된 행)
+  END ON
+
+  ON [저장] CLICK DO
+      CALL 템플릿 일괄저장 API(그리드 변경분)
+  END ON
+
+  // 영역 C: 변수 (7-3절 참고)
+  ON [변수추가] CLICK DO
+      ADD 변수 행 (인라인 편집)
+  END ON
+
+  ON [선택삭제] CLICK DO (영역 C)
+      CONFIRM 사용자
+      CALL 변수삭제 API(선택 행)
+  END ON
+
+  ON [저장] CLICK DO (영역 C)
+      CALL 변수 등록·수정 API(변경분)
+  END ON
+
+END
+```
diff --git a/apps/cs/eslint.config.mjs b/apps/cs/eslint.config.mjs
index 9109635e9..c2643e6aa 100644
--- a/apps/cs/eslint.config.mjs
+++ b/apps/cs/eslint.config.mjs
@@ -1,6 +1,7 @@
 import { dirname } from "path";
 import { fileURLToPath } from "url";
 import { FlatCompat } from "@eslint/eslintrc";
+import baseEsLintConfig from "../../eslint.config.mjs";
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
@@ -11,9 +12,11 @@ const compat = new FlatCompat({
 
 const eslintConfig = [
   ...compat.extends("next/core-web-vitals", "next/typescript"),
+  ...baseEsLintConfig,
   {
     rules: {
       "react-hooks/exhaustive-deps": "off",
+      "@typescript-eslint/no-unused-vars": "warn",
     },
   },
 ];
diff --git a/apps/cs/middleware.ts b/apps/cs/middleware.ts
index 3a79c1deb..4cc85b307 100644
--- a/apps/cs/middleware.ts
+++ b/apps/cs/middleware.ts
@@ -37,7 +37,7 @@ export function middleware(req: NextRequest) {
 
     logMessages.push(`  Rewritten URL: ${newUrl}`);
     logMessages.push("\n--------------------------------\n");
-    console.log(logMessages.join("\n"));
+    // console.log(logMessages.join("\n"));
 
     const response = NextResponse.rewrite(new URL(newUrl));
     return addSecurityHeaders(response);
@@ -54,7 +54,7 @@ export function middleware(req: NextRequest) {
 
     logMessages.push(`  Rewritten URL: ${newUrl}`);
     logMessages.push("\n--------------------------------\n");
-    console.log(logMessages.join("\n"));
+    // console.log(logMessages.join("\n"));
 
     const response = NextResponse.rewrite(new URL(newUrl), {
       headers: requestHeaders,
@@ -79,7 +79,7 @@ export function middleware(req: NextRequest) {
 
     logMessages.push(`  Link API Rewritten URL: ${newUrl}`);
     logMessages.push("\n--------------------------------\n");
-    console.log(logMessages.join("\n"));
+    // console.log(logMessages.join("\n"));
 
     const response = NextResponse.rewrite(new URL(newUrl), {
       headers: requestHeaders,
@@ -93,7 +93,7 @@ export function middleware(req: NextRequest) {
   }
 
   logMessages.push("\n--------------------------------\n");
-  console.log(logMessages.join("\n"));
+  // console.log(logMessages.join("\n"));
   
   const response = NextResponse.next();
   return addSecurityHeaders(response);
diff --git a/apps/cs/package.json b/apps/cs/package.json
index 27f43fcc1..5bf3b53e7 100644
--- a/apps/cs/package.json
+++ b/apps/cs/package.json
@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@common/assets": "workspace:*",
+    "@common/auth": "workspace:*",
     "@common/components": "workspace:*",
     "@common/config": "workspace:*",
     "@fontsource-variable/noto-sans-kr": "^5.2.5",
@@ -53,6 +54,7 @@
     "@types/webpack": "^5.28.5",
     "eslint": "^9.0.0",
     "eslint-config-next": "15.3.8",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "postcss": "^8.4.49",
     "prettier": "^3.4.2",
     "prettier-plugin-tailwindcss": "^0.6.11",
@@ -60,4 +62,4 @@
     "tailwindcss": "^3.4.14",
     "typescript": "^5.7.2"
   }
-}
\ No newline at end of file
+}
diff --git a/apps/cs/src/app/providers/app-provider.tsx b/apps/cs/src/app/providers/app-provider.tsx
index efd1f308e..31d14ac79 100644
--- a/apps/cs/src/app/providers/app-provider.tsx
+++ b/apps/cs/src/app/providers/app-provider.tsx
@@ -14,8 +14,9 @@ import { ConfirmDialog } from "@/shared/ui/confirm-dialog";
 import { SelectPromptDialog } from "@/shared/ui/select-prompt-dialog";
 import { PromptProvider, StoreProvider } from "@/shared/providers";
 
+const queryClient = new QueryClient();
+
 const AppProvider = ({ children }: Readonly<{ children: React.ReactNode }>) => {
-  const queryClient = new QueryClient();
   return (
     <QueryClientProvider client={queryClient}>
       <StoreProvider>
diff --git a/apps/cs/src/entities/auth/api/auth-service.ts b/apps/cs/src/entities/auth/api/auth-service.ts
new file mode 100644
index 000000000..e48569677
--- /dev/null
+++ b/apps/cs/src/entities/auth/api/auth-service.ts
@@ -0,0 +1,105 @@
+import { getRemainingMs } from "@common/auth";
+import {
+  ENDPOINT,
+  CLAIM_NAME,
+  ACCESS_TOKEN,
+  AUTH_USER_ID,
+} from "@/shared/config";
+import type { ILogin } from "../model/auth-interface";
+import {
+  setToken,
+  clearAuthToken,
+  setupRefreshTimer,
+} from "../lib/token-manager";
+
+function resolveLoginError(message: string | undefined): string {
+  switch (message) {
+    case "Invalid Credentials":
+      return "아이디와 비밀번호가 일치하지 않습니다.";
+    case "User not found":
+      return "존재하지 않는 아이디입니다.";
+    case "User is not active":
+      return "활성화되지 않은 계정입니다.";
+    case "User is not verified":
+      return "이메일 인증이 필요합니다.";
+    default:
+      return message ?? "로그인에 실패했습니다.";
+  }
+}
+
+export async function login(payload: ILogin): Promise<void> {
+  const response = await fetch(`/api/proxy${ENDPOINT.USER_SERVICE.LOGIN}`, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(payload),
+  });
+
+  const data = await response.json();
+
+  if (!response.ok) {
+    throw new Error(resolveLoginError(data?.message));
+  }
+
+  const accessToken = data[ACCESS_TOKEN] as string | undefined;
+  const tokenId = data[AUTH_USER_ID] as string | undefined;
+
+  if (!accessToken || !tokenId) {
+    throw new Error("인증 토큰을 받지 못했습니다.");
+  }
+
+  setToken(CLAIM_NAME, accessToken);
+  setToken(AUTH_USER_ID, tokenId);
+
+  const remainingMs = getRemainingMs(accessToken);
+  if (remainingMs > 0) {
+    setupRefreshTimer(silentRefresh, remainingMs);
+  }
+}
+
+export async function silentRefresh(): Promise<void> {
+  console.log(`[silentRefresh] Called at ${new Date().toISOString()}`);
+  try {
+    const response = await fetch(
+      `/api/proxy${ENDPOINT.USER_SERVICE.SILENT_REFRESH}`,
+      { method: "PUT" },
+    );
+
+    const data = await response.json();
+
+    if (!response.ok) {
+      throw new Error(data?.message ?? "토큰 갱신에 실패했습니다.");
+    }
+
+    const accessToken = data[ACCESS_TOKEN] as string | undefined;
+    const tokenId = data[AUTH_USER_ID] as string | undefined;
+
+    if (!accessToken || !tokenId) {
+      throw new Error("갱신된 인증 토큰을 받지 못했습니다.");
+    }
+
+    setToken(CLAIM_NAME, accessToken);
+    setToken(AUTH_USER_ID, tokenId);
+
+    const remainingMs = getRemainingMs(accessToken);
+    if (remainingMs > 0) {
+      setupRefreshTimer(silentRefresh, remainingMs);
+    }
+  } catch (error) {
+    console.error(
+      `[silentRefresh] Failed at ${new Date().toISOString()}`,
+      error,
+    );
+    clearAuthToken();
+    if (typeof window !== "undefined") {
+      window.dispatchEvent(new CustomEvent("auth:logout"));
+    }
+    // re-throw하지 않음: setupRefreshTimer 콜백의 catch와 이중 처리 방지
+  }
+}
+
+export async function logout(): Promise<void> {
+  clearAuthToken();
+  if (typeof window !== "undefined") {
+    window.dispatchEvent(new CustomEvent("auth:logout"));
+  }
+}
diff --git a/apps/cs/src/entities/auth/api/login-service.ts b/apps/cs/src/entities/auth/api/login-service.ts
deleted file mode 100644
index 671c8bb4c..000000000
--- a/apps/cs/src/entities/auth/api/login-service.ts
+++ /dev/null
@@ -1,96 +0,0 @@
-import { AxiosError } from "axios";
-import {
-  ENDPOINT,
-  JWT_EXPIRATION_TIME,
-  ACCESS_TOKEN,
-  AUTH_USER_ID,
-  CLAIM_NAME,
-} from "@/shared/config";
-import type { LoginService, ILogin } from "../model/login-interface";
-import { tokenManager } from "../lib/token-manager";
-
-export class LoginApiService implements LoginService {
-  private static instance: LoginApiService;
-
-  private constructor() {}
-
-  public static getInstance(): LoginApiService {
-    if (!LoginApiService.instance) {
-      LoginApiService.instance = new LoginApiService();
-    }
-    return LoginApiService.instance;
-  }
-
-  public async login(payload: ILogin): Promise<void> {
-    try {
-      const response = await fetch(`/api/proxy${ENDPOINT.USER_SERVICE.LOGIN}`, {
-        method: "POST",
-        body: JSON.stringify({
-          userId: payload.userId,
-          password: payload.password,
-        }),
-      });
-
-      const data = await response.json();
-      console.log('data ', data)
-      const accessToken = data[ACCESS_TOKEN];
-      const tokenId = data[AUTH_USER_ID];
-
-      if (!accessToken || !tokenId) {
-        if (data.message == 'Invalid Credentials' ) {
-          throw new Error('아이디와 비밀번호가 일치하지 않습니다.');
-        } else if (data.message == 'User not found') {
-          throw new Error('존재하지 않는 아이디입니다.');
-        } else if (data.message == 'User is not active') {
-          throw new Error('활성화되지 않은 계정입니다.');
-        } else if (data.message == 'User is not verified') {
-          throw new Error('이메일 인증이 필요합니다.');
-        } else {
-          throw new Error(data.message);
-        } 
-      }
-
-      tokenManager.setToken(CLAIM_NAME, accessToken);
-      tokenManager.setToken(AUTH_USER_ID, tokenId);
-      tokenManager.setupRefreshTimer(
-        () => this.silentRefresh(),
-        JWT_EXPIRATION_TIME,
-      );
-    } catch (error) {
-      if (error instanceof AxiosError) {
-        throw new Error(`Login 실패 ${error.response?.data?.message}`);
-      }
-      throw new Error(`Login 실패 ${error}`);
-    }
-  }
-
-  public async silentRefresh(): Promise<void> {
-    try {
-      const response = await fetch(
-        `/api/proxy${ENDPOINT.USER_SERVICE.SILENT_REFRESH}`,
-        { method: "PUT" },
-      );
-
-      const data = await response.json();
-      const accessToken = data[ACCESS_TOKEN];
-      const tokenId = data[AUTH_USER_ID];
-
-      if (!accessToken || !tokenId) {
-        throw new Error("Missing required authentication tokens");
-      }
-
-      tokenManager.setToken(CLAIM_NAME, accessToken);
-      tokenManager.setToken(AUTH_USER_ID, tokenId);
-    } catch (error) {
-      tokenManager.clearAuthToken();
-      if (error instanceof AxiosError) {
-        throw new Error(
-          `Silent refresh failed: ${error.response?.data?.message}`,
-        );
-      }
-      throw new Error(`Silent refresh failed: ${error}`);
-    }
-  }
-}
-
-export const LoginApi = LoginApiService.getInstance();
diff --git a/apps/cs/src/entities/auth/index.ts b/apps/cs/src/entities/auth/index.ts
index 97e142225..76b22ca39 100644
--- a/apps/cs/src/entities/auth/index.ts
+++ b/apps/cs/src/entities/auth/index.ts
@@ -1,2 +1,3 @@
-export { LoginApi } from "./api/login-service";
+export { login, silentRefresh, logout } from "./api/auth-service";
 export { AuthWrapper } from "./lib/auth-wrapper";
+export { tokenManager } from "./lib/token-manager";
\ No newline at end of file
diff --git a/apps/cs/src/entities/auth/lib/auth-wrapper.tsx b/apps/cs/src/entities/auth/lib/auth-wrapper.tsx
index 57ae75c34..3c4dea9c7 100644
--- a/apps/cs/src/entities/auth/lib/auth-wrapper.tsx
+++ b/apps/cs/src/entities/auth/lib/auth-wrapper.tsx
@@ -1,47 +1,80 @@
 "use client";
 
 import { useEffect } from "react";
+import { useRouter } from "next/navigation";
+import { isAxiosError } from "axios";
+import { getRemainingMs } from "@common/auth";
+import { isAtLoginRedirectUrl } from "@common/network";
 import { client } from "@/shared/api";
 import type { IUserInfo } from "@/shared/store";
-import { getCookie, useUserStore } from "@/shared/lib";
-import { isAtLoginRedirectUrl } from "@common/network";
+import { useUserStore } from "@/shared/lib";
 import {
   ENDPOINT,
   AUTH_USER_ID,
   AUTH_LOGIN_REDIRECT_URL,
+  CLAIM_NAME,
 } from "@/shared/config";
+import { getToken, setupRefreshTimer } from "./token-manager";
+import { silentRefresh } from "../api/auth-service";
 
 const AuthWrapper = ({ children }: { children: React.ReactNode }) => {
-  const { userInfo, setUserInfo } = useUserStore((state) => state);
-
-  async function authCheck() {
-    if (isAtLoginRedirectUrl(AUTH_LOGIN_REDIRECT_URL)) {
-      return;
-    }
-
-    const userId = getCookie(AUTH_USER_ID);
-    if (!userId) {
-      throw new Error("Missing required authentication tokens");
-    }
-
-    const response = await client.get<IUserInfo>(
-      `${ENDPOINT.USER_SERVICE.USERS}/info/me`,
-    );
-    if (!userInfo) setUserInfo(response.data);
-  }
+  const router = useRouter();
+  const userInfo = useUserStore((state) => state.userInfo);
+  const setUserInfo = useUserStore((state) => state.setUserInfo);
 
   useEffect(() => {
-    (async () => {
-      try {
-        await authCheck();
-      } catch (error) {
-        console.error(error);
-        setUserInfo(null);
-        if (!isAtLoginRedirectUrl(AUTH_LOGIN_REDIRECT_URL)) {
-          window.location.assign(AUTH_LOGIN_REDIRECT_URL);
-        }
+    // 페이지 새로고침 시 silentRefresh 타이머 복구
+    const token = getToken(CLAIM_NAME);
+    if (token) {
+      const remainingMs = getRemainingMs(token);
+      if (remainingMs > 0) {
+        console.log(
+          `[AuthWrapper] Refresh timer set: ${remainingMs}ms (${remainingMs / 1000}s)`,
+        );
+        setupRefreshTimer(silentRefresh, remainingMs);
       }
-    })();
+    }
+
+    if (isAtLoginRedirectUrl(AUTH_LOGIN_REDIRECT_URL)) return;
+
+    async function authCheck() {
+      const userId = getToken(AUTH_USER_ID);
+      if (!userId) {
+        router.replace(AUTH_LOGIN_REDIRECT_URL);
+        return;
+      }
+
+      if (userInfo) return;
+
+      const response = await client.get<IUserInfo>(
+        `${ENDPOINT.USER_SERVICE.USERS}/info/me`,
+      );
+      setUserInfo(response.data);
+    }
+
+    authCheck().catch((error) => {
+      // 401은 @common/network error-interceptor에서 이미 리다이렉트 처리됨
+      if (isAxiosError(error) && error.response?.status === 401) return;
+
+      console.error(error);
+      setUserInfo(null);
+      if (!isAtLoginRedirectUrl(AUTH_LOGIN_REDIRECT_URL)) {
+        router.replace(AUTH_LOGIN_REDIRECT_URL);
+      }
+    });
+  }, []);
+
+  // silentRefresh 실패 시 auth:logout 이벤트를 수신해 로그인으로 이동
+  useEffect(() => {
+    function handleAuthLogout() {
+      setUserInfo(null);
+      if (!isAtLoginRedirectUrl(AUTH_LOGIN_REDIRECT_URL)) {
+        router.replace(AUTH_LOGIN_REDIRECT_URL);
+      }
+    }
+
+    window.addEventListener("auth:logout", handleAuthLogout);
+    return () => window.removeEventListener("auth:logout", handleAuthLogout);
   }, []);
 
   return <>{children}</>;
diff --git a/apps/cs/src/entities/auth/lib/token-manager.ts b/apps/cs/src/entities/auth/lib/token-manager.ts
index dd9aea352..44aa888aa 100644
--- a/apps/cs/src/entities/auth/lib/token-manager.ts
+++ b/apps/cs/src/entities/auth/lib/token-manager.ts
@@ -1,82 +1,15 @@
-import { AUTH_USER_ID, CLAIM_NAME } from "@/shared/config";
-import { getCookie, setCookie, removeCookie } from "@/shared/lib";
+import { createTokenManager } from "@common/auth";
+import { authConfig } from "@/shared/config/auth";
 
-export class TokenManager {
-  private static instance: TokenManager;
-  private refreshTimer: NodeJS.Timeout | null = null;
+export const tokenManager = createTokenManager(authConfig);
 
-  private constructor() {}
-
-  public static getInstance(): TokenManager {
-    if (!TokenManager.instance) {
-      TokenManager.instance = new TokenManager();
-    }
-    return TokenManager.instance;
-  }
-
-  public getToken(key: string): string | undefined {
-    return getCookie(key);
-  }
-
-  public setToken(key: string, value: string): void {
-    const domain = this.getCookieDomain();
-    
-    setCookie(key, value, {
-      secure: window.location.protocol === "https:",
-      sameSite: "lax",
-      domain: domain,
-      path: "/", // 모든 경로에서 접근 가능
-    });
-  }
-
-  
-  private getCookieDomain(): string | undefined {
-    const hostname = window.location.hostname;
-    
-    // 개발 환경에서는 localhost 도메인 사용
-    if (hostname === "localhost" || hostname === "127.0.0.1") {
-      return undefined; // localhost에서는 도메인 설정하지 않음
-    }
-    
-    // 운영 환경에서는 서브도메인을 포함한 최상위 도메인 사용
-    if (hostname.includes("hasuon.or.kr")) {
-      return ".hasuon.or.kr";
-    }
-    
-    // 기타 환경에서는 현재 호스트명 사용
-    return hostname;
-  }
-
-  public removeToken(key: string): void {
-    const domain = this.getCookieDomain();
-    removeCookie(key, { domain, path: "/" });
-  }
-
-  public setupRefreshTimer(
-    callback: () => Promise<void>,
-    expirationTime: number,
-  ): void {
-    if (this.refreshTimer) {
-      clearTimeout(this.refreshTimer);
-    }
-
-    this.refreshTimer = setTimeout(() => {
-      callback().catch((error) => {
-        console.error("Silent refresh failed:", error);
-        this.clearAuthToken();
-      });
-    }, expirationTime - 60000);
-  }
-
-  public clearAuthToken(): void {
-    if (this.refreshTimer) {
-      clearTimeout(this.refreshTimer);
-      this.refreshTimer = null;
-    }
-
-    this.removeToken(CLAIM_NAME);
-    this.removeToken(AUTH_USER_ID);
-  }
-}
-
-export const tokenManager = TokenManager.getInstance();
+export const {
+  getToken,
+  setToken,
+  removeToken,
+  setupRefreshTimer,
+  clearAuthToken,
+  getAccessToken,
+  getRefreshToken,
+  getUserId,
+} = tokenManager;
diff --git a/apps/cs/src/entities/auth/model/auth-interface.ts b/apps/cs/src/entities/auth/model/auth-interface.ts
new file mode 100644
index 000000000..012f81457
--- /dev/null
+++ b/apps/cs/src/entities/auth/model/auth-interface.ts
@@ -0,0 +1,4 @@
+export interface ILogin {
+  userId: string;
+  password: string;
+}
diff --git a/apps/cs/src/entities/auth/model/login-interface.ts b/apps/cs/src/entities/auth/model/login-interface.ts
deleted file mode 100644
index 5aaf53044..000000000
--- a/apps/cs/src/entities/auth/model/login-interface.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export interface ILogin {
-  userId: string;
-  password: string;
-}
-
-export interface LoginService {
-  login(payload: ILogin): Promise<void>;
-  silentRefresh(): Promise<void>;
-}
diff --git a/apps/cs/src/entities/code/model/lwpocode-interface.ts b/apps/cs/src/entities/code/model/lwpocode-interface.ts
index 2538c1c30..d44a89ef2 100644
--- a/apps/cs/src/entities/code/model/lwpocode-interface.ts
+++ b/apps/cs/src/entities/code/model/lwpocode-interface.ts
@@ -44,7 +44,6 @@ export const LwpoCodeFormSchema = z.object({
   prntLwpoCd: z.string().max(10).nullish(),
   useYn: z.string(),
   sortSeq: z.number(),
-  delYn: z.string(),
 });
 
 export type LwpoCodeFormData = z.infer<typeof LwpoCodeFormSchema>;
diff --git a/apps/cs/src/entities/code/model/upcode-interface.ts b/apps/cs/src/entities/code/model/upcode-interface.ts
index 73bf4f3ae..c63eccc0a 100644
--- a/apps/cs/src/entities/code/model/upcode-interface.ts
+++ b/apps/cs/src/entities/code/model/upcode-interface.ts
@@ -32,8 +32,11 @@ export interface UpCodeDetail extends UpCodeFormData {
 }
 
 export const upCodeFormSchema = z.object({
-  upCd: z.string().max(10).nonempty(),
-  upCdNm: z.string().max(100).nonempty(),
+  upCd: z
+    .string()
+    .max(30, "최대 30자까지 입력할 수 있습니다.")
+    .nonempty("최소 1자 이상 입력해주세요."),
+  upCdNm: z.string().max(100).nonempty("최소 1자 이상 입력해주세요."),
   upCdExpln: z.string().max(1000).nullish(),
   cdSe: z.string().max(10).nonempty(),
   siteId: z.string().max(2).nullish(),
diff --git a/apps/cs/src/entities/ntftalk/api/ntftalk-biztalk-service.ts b/apps/cs/src/entities/ntftalk/api/ntftalk-biztalk-service.ts
new file mode 100644
index 000000000..85f585360
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/api/ntftalk-biztalk-service.ts
@@ -0,0 +1,64 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import {
+  type NtftalkBiztalkCheckInspectionResponse,
+  type NtftalkBiztalkInspectionRequestItem,
+  type NtftalkBiztalkInspectionResponse,
+  type NtftalkBiztalkSender,
+  type NtftalkBiztalkService,
+  type NtftalkBiztalkSyncTemplatesParams,
+  type NtftalkBiztalkSyncTemplatesResponse,
+} from "../model/ntftalk-biztalk-interface";
+
+export const NtftalkBiztalkApi: NtftalkBiztalkService = {
+  async getSender(): Promise<NtftalkBiztalkSender> {
+    const response = await client.get<NtftalkBiztalkSender>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK}/sender`,
+    );
+    return response.data;
+  },
+
+  async syncTemplates(
+    params?: NtftalkBiztalkSyncTemplatesParams,
+  ): Promise<NtftalkBiztalkSyncTemplatesResponse> {
+    const response = await client.post<NtftalkBiztalkSyncTemplatesResponse>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK}/sync-templates`,
+      undefined,
+      {
+        params: {
+          senderKeyType: params?.senderKeyType,
+        },
+      },
+    );
+    return response.data;
+  },
+
+  async requestInspection(
+    requestList: NtftalkBiztalkInspectionRequestItem[],
+  ): Promise<NtftalkBiztalkInspectionResponse> {
+    const response = await client.post<NtftalkBiztalkInspectionResponse>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK}/request-inspection`,
+      requestList,
+    );
+    return response.data;
+  },
+
+  async cancelInspection(
+    requestList: NtftalkBiztalkInspectionRequestItem[],
+  ): Promise<NtftalkBiztalkInspectionResponse> {
+    const response = await client.post<NtftalkBiztalkInspectionResponse>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK}/cancel-inspection`,
+      requestList,
+    );
+    return response.data;
+  },
+
+  async checkInspection(
+    templateCode: string,
+  ): Promise<NtftalkBiztalkCheckInspectionResponse> {
+    const response = await client.get<NtftalkBiztalkCheckInspectionResponse>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK}/check-inspection/${encodeURIComponent(templateCode)}`,
+    );
+    return response.data;
+  },
+};
diff --git a/apps/cs/src/entities/ntftalk/api/ntftalk-mmt-log-history-service.ts b/apps/cs/src/entities/ntftalk/api/ntftalk-mmt-log-history-service.ts
new file mode 100644
index 000000000..ebfd90bdf
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/api/ntftalk-mmt-log-history-service.ts
@@ -0,0 +1,58 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import {
+  type NtftalkMmtLogHistory,
+  type NtftalkMmtLogHistoryPageList,
+  type NtftalkMmtLogHistorySavePayload,
+  type NtftalkMmtLogHistorySearchParams,
+  type NtftalkMmtLogHistoryService,
+  type NtftalkMmtLogHistoryUpdatePayload,
+} from "../model/ntftalk-mmt-log-history-interface";
+
+class NtftalkMmtLogHistoryApiService implements NtftalkMmtLogHistoryService {
+  async getNtftalkMmtLogHistoryPage(
+    params: NtftalkMmtLogHistorySearchParams,
+  ): Promise<NtftalkMmtLogHistoryPageList> {
+    const response = await client.get<NtftalkMmtLogHistoryPageList>(
+      `${ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY}`,
+      { params },
+    );
+    return response.data;
+  }
+
+  async getNtftalkMmtLogHistory(mtPr: number): Promise<NtftalkMmtLogHistory> {
+    const response = await client.get<NtftalkMmtLogHistory>(
+      `${ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY}/${mtPr}`,
+    );
+    return response.data;
+  }
+
+  async saveNtftalkMmtLogHistory(
+    payload: NtftalkMmtLogHistorySavePayload,
+  ): Promise<NtftalkMmtLogHistory> {
+    const response = await client.post<NtftalkMmtLogHistory>(
+      `${ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY}`,
+      payload,
+    );
+    return response.data;
+  }
+
+  async updateNtftalkMmtLogHistory(
+    mtPr: number,
+    payload: NtftalkMmtLogHistoryUpdatePayload,
+  ): Promise<NtftalkMmtLogHistory> {
+    const response = await client.put<NtftalkMmtLogHistory>(
+      `${ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY}/${mtPr}`,
+      payload,
+    );
+    return response.data;
+  }
+
+  async deleteNtftalkMmtLogHistory(mtPr: number): Promise<void> {
+    await client.delete(
+      `${ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY}/${mtPr}`,
+    );
+  }
+}
+
+export const NtftalkMmtLogHistoryApi = new NtftalkMmtLogHistoryApiService();
diff --git a/apps/cs/src/entities/ntftalk/api/ntftalk-temp-service.ts b/apps/cs/src/entities/ntftalk/api/ntftalk-temp-service.ts
new file mode 100644
index 000000000..190e9964a
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/api/ntftalk-temp-service.ts
@@ -0,0 +1,56 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import {
+  type NtftalkTemp,
+  type NtftalkTempPageList,
+  type NtftalkTempSavePayload,
+  type NtftalkTempSearchParams,
+  type NtftalkTempService,
+  type NtftalkTempUpdatePayload,
+} from "../model/ntftalk-temp-interface";
+
+class NtftalkTempApiService implements NtftalkTempService {
+  async getNtftalkTempPage(
+    params: NtftalkTempSearchParams,
+  ): Promise<NtftalkTempPageList> {
+    const response = await client.get<NtftalkTempPageList>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP}`,
+      { params },
+    );
+    return response.data;
+  }
+
+  async getNtftalkTemp(templateCode: string): Promise<NtftalkTemp> {
+    const response = await client.get<NtftalkTemp>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP}/${encodeURIComponent(templateCode)}`,
+    );
+    return response.data;
+  }
+
+  async saveNtftalkTemp(payload: NtftalkTempSavePayload): Promise<NtftalkTemp> {
+    const response = await client.post<NtftalkTemp>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP}`,
+      payload,
+    );
+    return response.data;
+  }
+
+  async updateNtftalkTemp(
+    templateCode: string,
+    payload: NtftalkTempUpdatePayload,
+  ): Promise<NtftalkTemp> {
+    const response = await client.put<NtftalkTemp>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP}/${encodeURIComponent(templateCode)}`,
+      payload,
+    );
+    return response.data;
+  }
+
+  async deleteNtftalkTemp(templateCode: string): Promise<void> {
+    await client.delete(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP}/${encodeURIComponent(templateCode)}`,
+    );
+  }
+}
+
+export const NtftalkTempApi = new NtftalkTempApiService();
diff --git a/apps/cs/src/entities/ntftalk/api/ntftalk-var-service.ts b/apps/cs/src/entities/ntftalk/api/ntftalk-var-service.ts
new file mode 100644
index 000000000..972ca0208
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/api/ntftalk-var-service.ts
@@ -0,0 +1,56 @@
+import { client } from "@/shared/api";
+import { ENDPOINT } from "@/shared/config";
+import {
+  type NtftalkVar,
+  type NtftalkVarPageList,
+  type NtftalkVarSavePayload,
+  type NtftalkVarSearchParams,
+  type NtftalkVarService,
+  type NtftalkVarUpdatePayload,
+} from "../model/ntftalk-var-interface";
+
+class NtftalkVarApiService implements NtftalkVarService {
+  async getNtftalkVarPage(
+    params: NtftalkVarSearchParams,
+  ): Promise<NtftalkVarPageList> {
+    const response = await client.get<NtftalkVarPageList>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR}`,
+      { params },
+    );
+    return response.data;
+  }
+
+  async getNtftalkVar(varCd: string): Promise<NtftalkVar> {
+    const response = await client.get<NtftalkVar>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR}/${encodeURIComponent(varCd)}`,
+    );
+    return response.data;
+  }
+
+  async saveNtftalkVar(payload: NtftalkVarSavePayload): Promise<NtftalkVar> {
+    const response = await client.post<NtftalkVar>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR}`,
+      payload,
+    );
+    return response.data;
+  }
+
+  async updateNtftalkVar(
+    varCd: string,
+    payload: NtftalkVarUpdatePayload,
+  ): Promise<NtftalkVar> {
+    const response = await client.put<NtftalkVar>(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR}/${encodeURIComponent(varCd)}`,
+      payload,
+    );
+    return response.data;
+  }
+
+  async deleteNtftalkVar(varCd: string): Promise<void> {
+    await client.delete(
+      `${ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR}/${encodeURIComponent(varCd)}`,
+    );
+  }
+}
+
+export const NtftalkVarApi = new NtftalkVarApiService();
diff --git a/apps/cs/src/entities/ntftalk/index.ts b/apps/cs/src/entities/ntftalk/index.ts
new file mode 100644
index 000000000..0210af8a4
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/index.ts
@@ -0,0 +1,37 @@
+export { NtftalkVarApi } from "./api/ntftalk-var-service";
+export { NtftalkTempApi } from "./api/ntftalk-temp-service";
+export { NtftalkBiztalkApi } from "./api/ntftalk-biztalk-service";
+export { NtftalkMmtLogHistoryApi } from "./api/ntftalk-mmt-log-history-service";
+export type {
+  NtftalkVar,
+  NtftalkVarPageList,
+  NtftalkVarSavePayload,
+  NtftalkVarSearchParams,
+  NtftalkVarUpdatePayload,
+} from "./model/ntftalk-var-interface";
+export type {
+  NtftalkBiztalkCheckInspectionResponse,
+  NtftalkBiztalkInspectionRequestItem,
+  NtftalkBiztalkInspectionResponse,
+  NtftalkBiztalkSender,
+  NtftalkBiztalkSyncTemplatesParams,
+  NtftalkBiztalkSyncTemplatesResponse,
+} from "./model/ntftalk-biztalk-interface";
+export type {
+  NtftalkBtnTemp,
+  NtftalkBtnTempSavePayload,
+  NtftalkQuickTemp,
+  NtftalkQuickTempSavePayload,
+  NtftalkTemp,
+  NtftalkTempPageList,
+  NtftalkTempSavePayload,
+  NtftalkTempSearchParams,
+  NtftalkTempUpdatePayload,
+} from "./model/ntftalk-temp-interface";
+export type {
+  NtftalkMmtLogHistory,
+  NtftalkMmtLogHistoryPageList,
+  NtftalkMmtLogHistorySavePayload,
+  NtftalkMmtLogHistorySearchParams,
+  NtftalkMmtLogHistoryUpdatePayload,
+} from "./model/ntftalk-mmt-log-history-interface";
diff --git a/apps/cs/src/entities/ntftalk/model/ntftalk-biztalk-interface.ts b/apps/cs/src/entities/ntftalk/model/ntftalk-biztalk-interface.ts
new file mode 100644
index 000000000..824eb00d5
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/model/ntftalk-biztalk-interface.ts
@@ -0,0 +1,48 @@
+export interface NtftalkBiztalkSender {
+  senderKey: string;
+  name: string;
+  uuid: string;
+  status: string;
+}
+
+export interface NtftalkBiztalkSyncTemplatesParams {
+  senderKeyType?: string;
+}
+
+export interface NtftalkBiztalkSyncTemplatesResponse {
+  syncCount: number;
+  message: string;
+}
+
+export interface NtftalkBiztalkInspectionRequestItem {
+  senderKey: string;
+  templateCode: string;
+  senderKeyType: string;
+}
+
+export interface NtftalkBiztalkInspectionResponse {
+  processedCount: number;
+  message: string;
+}
+
+export interface NtftalkBiztalkCheckInspectionResponse {
+  templateCode: string;
+  approved: boolean;
+  message: string;
+}
+
+export interface NtftalkBiztalkService {
+  getSender(): Promise<NtftalkBiztalkSender>;
+  syncTemplates(
+    params?: NtftalkBiztalkSyncTemplatesParams,
+  ): Promise<NtftalkBiztalkSyncTemplatesResponse>;
+  requestInspection(
+    requestList: NtftalkBiztalkInspectionRequestItem[],
+  ): Promise<NtftalkBiztalkInspectionResponse>;
+  cancelInspection(
+    requestList: NtftalkBiztalkInspectionRequestItem[],
+  ): Promise<NtftalkBiztalkInspectionResponse>;
+  checkInspection(
+    templateCode: string,
+  ): Promise<NtftalkBiztalkCheckInspectionResponse>;
+}
diff --git a/apps/cs/src/entities/ntftalk/model/ntftalk-mmt-log-history-interface.ts b/apps/cs/src/entities/ntftalk/model/ntftalk-mmt-log-history-interface.ts
new file mode 100644
index 000000000..9f272d1ac
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/model/ntftalk-mmt-log-history-interface.ts
@@ -0,0 +1,84 @@
+import type { PageableList, PageableParams } from "@/shared/model";
+
+export interface NtftalkMmtLogHistorySearchParams extends PageableParams {
+  subject?: string;
+  content?: string;
+  recipientNum?: string;
+  /** 1:전송대기, 2:결과대기, 3:완료 */
+  msgStatus?: string;
+  /** 1000:성공 */
+  reportCode?: string;
+  /** yyyy-MM-dd */
+  dateFrom?: string;
+  /** yyyy-MM-dd */
+  dateTo?: string;
+  /** ADSS | CWMS | PORT | ALL */
+  system?: string;
+  /** SUCCESS | FAIL | ALL */
+  successYn?: string;
+}
+
+export interface NtftalkMmtLogHistory {
+  mtPr: number;
+  mtRefkey?: string | null;
+  priority?: string | null;
+  dateClientReq?: string | null;
+  subject?: string | null;
+  content?: string | null;
+  callback?: string | null;
+  msgStatus?: string | null;
+  recipientNum?: string | null;
+  dateMtSent?: string | null;
+  dateRslt?: string | null;
+  dateMtReport?: string | null;
+  reportCode?: string | null;
+  countryCode?: string | null;
+  msgType?: number | null;
+  regDate?: string | null;
+  senderKey?: string | null;
+  templateCode?: string | null;
+  siteSystem?: string | null;
+  successYn?: string | null;
+}
+
+export interface NtftalkMmtLogHistorySavePayload {
+  mtPr: number;
+  mtRefkey?: string;
+  priority?: string;
+  dateClientReq?: string;
+  subject: string;
+  content: string;
+  callback: string;
+  msgStatus?: string;
+  recipientNum: string;
+  reportCode?: string;
+  countryCode?: string;
+  msgType?: number;
+  senderKey: string;
+  templateCode?: string;
+  responseMethod?: string;
+}
+
+export interface NtftalkMmtLogHistoryUpdatePayload {
+  content: string;
+  recipientNum: string;
+  msgStatus?: string;
+  reportCode?: string;
+}
+
+export type NtftalkMmtLogHistoryPageList = PageableList<NtftalkMmtLogHistory>;
+
+export interface NtftalkMmtLogHistoryService {
+  getNtftalkMmtLogHistoryPage(
+    params: NtftalkMmtLogHistorySearchParams,
+  ): Promise<NtftalkMmtLogHistoryPageList>;
+  getNtftalkMmtLogHistory(mtPr: number): Promise<NtftalkMmtLogHistory>;
+  saveNtftalkMmtLogHistory(
+    payload: NtftalkMmtLogHistorySavePayload,
+  ): Promise<NtftalkMmtLogHistory>;
+  updateNtftalkMmtLogHistory(
+    mtPr: number,
+    payload: NtftalkMmtLogHistoryUpdatePayload,
+  ): Promise<NtftalkMmtLogHistory>;
+  deleteNtftalkMmtLogHistory(mtPr: number): Promise<void>;
+}
diff --git a/apps/cs/src/entities/ntftalk/model/ntftalk-temp-interface.ts b/apps/cs/src/entities/ntftalk/model/ntftalk-temp-interface.ts
new file mode 100644
index 000000000..7e7ab317d
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/model/ntftalk-temp-interface.ts
@@ -0,0 +1,110 @@
+import type { PageableList, PageableParams } from "@/shared/model";
+
+export interface NtftalkTempSearchParams extends PageableParams {
+  templateCode?: string;
+  templateName?: string;
+  /** 백엔드 스펙 확정 시 전달 */
+  templateContent?: string;
+  inspectionStatus?: string;
+  senderKey?: string;
+  status?: string;
+  /** 백엔드 스펙 확정 시 전달 */
+  templateMessageType?: string;
+}
+
+export interface NtftalkBtnTemp {
+  templateCode: string;
+  name: string;
+  ordering: number;
+  linkType: string;
+  linkMo: string;
+  linkPc: string;
+  linkAnd: string;
+  linkIos: string;
+}
+
+export interface NtftalkQuickTemp {
+  templateCode: string;
+  name: string;
+  linkType: string;
+  linkMo: string;
+  linkPc: string;
+  linkAnd: string;
+  linkIos: string;
+}
+
+export interface NtftalkTemp {
+  templateCode: string;
+  senderKey: string;
+  senderKeyType: string;
+  templateName: string;
+  templateContent: string;
+  templateMessageType: string;
+  templateEmphasizeType: string;
+  templateImageUrl: string;
+  inspectionStatus: string;
+  status: string;
+  createdAt: string;
+  modifiedAt: string;
+  buttons?: NtftalkBtnTemp[];
+  quickReplies?: NtftalkQuickTemp[];
+}
+
+export interface NtftalkBtnTempSavePayload {
+  templateCode?: string;
+  name: string;
+  ordering: number;
+  linkType: string;
+  linkMo?: string;
+  linkPc?: string;
+  linkAnd?: string;
+  linkIos?: string;
+}
+
+export interface NtftalkQuickTempSavePayload {
+  templateCode?: string;
+  name: string;
+  linkType: string;
+  linkMo?: string;
+  linkPc?: string;
+  linkAnd?: string;
+  linkIos?: string;
+}
+
+export interface NtftalkTempSavePayload {
+  templateCode: string;
+  senderKey: string;
+  senderKeyType: string;
+  templateName: string;
+  templateContent: string;
+  templateMessageType: string;
+  templateEmphasizeType: string;
+  templateImageUrl?: string;
+  inspectionStatus?: string;
+  buttons?: NtftalkBtnTempSavePayload[];
+  quickReplies?: NtftalkQuickTempSavePayload[];
+}
+
+export interface NtftalkTempUpdatePayload {
+  templateName: string;
+  templateContent: string;
+  inspectionStatus?: string;
+  status?: string;
+  buttons?: NtftalkBtnTempSavePayload[];
+  quickReplies?: NtftalkQuickTempSavePayload[];
+}
+
+export type NtftalkTempPageList = PageableList<NtftalkTemp>;
+
+export interface NtftalkTempService {
+  getNtftalkTempPage(
+    params: NtftalkTempSearchParams,
+  ): Promise<NtftalkTempPageList>;
+  getNtftalkTemp(templateCode: string): Promise<NtftalkTemp>;
+  saveNtftalkTemp(payload: NtftalkTempSavePayload): Promise<NtftalkTemp>;
+  updateNtftalkTemp(
+    templateCode: string,
+    payload: NtftalkTempUpdatePayload,
+  ): Promise<NtftalkTemp>;
+  deleteNtftalkTemp(templateCode: string): Promise<void>;
+}
diff --git a/apps/cs/src/entities/ntftalk/model/ntftalk-var-interface.ts b/apps/cs/src/entities/ntftalk/model/ntftalk-var-interface.ts
new file mode 100644
index 000000000..7a52a7a89
--- /dev/null
+++ b/apps/cs/src/entities/ntftalk/model/ntftalk-var-interface.ts
@@ -0,0 +1,42 @@
+import type { PageableList, PageableParams } from "@/shared/model";
+
+export interface NtftalkVarSearchParams extends PageableParams {
+  varCd?: string;
+  varNm?: string;
+  regr?: string;
+}
+
+export interface NtftalkVar {
+  varCd: string;
+  sender: string;
+  varNm: string;
+  varDesc: string;
+  regDt: string;
+  regr: string;
+}
+
+export interface NtftalkVarSavePayload {
+  varCd: string;
+  sender?: string;
+  varNm: string;
+  varDesc?: string;
+  regr?: string;
+}
+
+export interface NtftalkVarUpdatePayload {
+  varNm: string;
+  varDesc?: string;
+}
+
+export type NtftalkVarPageList = PageableList<NtftalkVar>;
+
+export interface NtftalkVarService {
+  getNtftalkVarPage(params: NtftalkVarSearchParams): Promise<NtftalkVarPageList>;
+  getNtftalkVar(varCd: string): Promise<NtftalkVar>;
+  saveNtftalkVar(payload: NtftalkVarSavePayload): Promise<NtftalkVar>;
+  updateNtftalkVar(
+    varCd: string,
+    payload: NtftalkVarUpdatePayload,
+  ): Promise<NtftalkVar>;
+  deleteNtftalkVar(varCd: string): Promise<void>;
+}
diff --git a/apps/cs/src/pages/(post)/faq/ui/faq-page.tsx b/apps/cs/src/pages/(post)/faq/ui/faq-page.tsx
index f23a70663..1953ea763 100644
--- a/apps/cs/src/pages/(post)/faq/ui/faq-page.tsx
+++ b/apps/cs/src/pages/(post)/faq/ui/faq-page.tsx
@@ -101,7 +101,7 @@ function FaqPage({ bbsId }: { bbsId: string }) {
     alert("삭제되었습니다.");
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     refetch();
   };
diff --git a/apps/cs/src/pages/admin/ui/add-admin-dialog.tsx b/apps/cs/src/pages/admin/ui/add-admin-dialog.tsx
index c49d75530..5cebb8dfb 100644
--- a/apps/cs/src/pages/admin/ui/add-admin-dialog.tsx
+++ b/apps/cs/src/pages/admin/ui/add-admin-dialog.tsx
@@ -174,7 +174,7 @@ function AddAdminDialog() {
     }
   };
 
-  const handleSearch = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSearch = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     e.stopPropagation();
     setPagination({ pageIndex: 0, pageSize: 10 });
diff --git a/apps/cs/src/pages/admin/ui/admin-page.tsx b/apps/cs/src/pages/admin/ui/admin-page.tsx
index c2d3aa5af..6a621b865 100644
--- a/apps/cs/src/pages/admin/ui/admin-page.tsx
+++ b/apps/cs/src/pages/admin/ui/admin-page.tsx
@@ -125,7 +125,7 @@ function AdminPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/apilog/ui/apilog-page.tsx b/apps/cs/src/pages/apilog/ui/apilog-page.tsx
index ab98a1931..b2c273005 100644
--- a/apps/cs/src/pages/apilog/ui/apilog-page.tsx
+++ b/apps/cs/src/pages/apilog/ui/apilog-page.tsx
@@ -75,7 +75,7 @@ function ApiLogPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/auth/login/ui/login-page.tsx b/apps/cs/src/pages/auth/login/ui/login-page.tsx
index fd1e2f809..e5062390e 100644
--- a/apps/cs/src/pages/auth/login/ui/login-page.tsx
+++ b/apps/cs/src/pages/auth/login/ui/login-page.tsx
@@ -3,13 +3,13 @@
 import { useState } from "react";
 import Image from "next/image";
 import { images } from "@common/assets";
-import { LoginApi } from "@/entities/auth";
+import { login } from "@/entities/auth";
 import "./login.css";
 
 function LoginPage() {
   const [errorMessage, setErrorMessage] = useState<string>("");
 
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setErrorMessage(""); // 에러 메시지 초기화
 
@@ -18,7 +18,7 @@ function LoginPage() {
     const password = formData.get("password") as string;
 
     try {
-      await LoginApi.login({ userId, password });
+      await login({ userId, password });
       window.location.href = "/dashboard";
     } catch (error) {
       const message =
diff --git a/apps/cs/src/pages/banner/ui/banner-page.tsx b/apps/cs/src/pages/banner/ui/banner-page.tsx
index 81435f010..e09f5ab58 100644
--- a/apps/cs/src/pages/banner/ui/banner-page.tsx
+++ b/apps/cs/src/pages/banner/ui/banner-page.tsx
@@ -48,7 +48,7 @@ function BannerPage() {
       }),
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/bbs/ui/bbs-page.tsx b/apps/cs/src/pages/bbs/ui/bbs-page.tsx
index 509f83cb7..abb1ec9db 100644
--- a/apps/cs/src/pages/bbs/ui/bbs-page.tsx
+++ b/apps/cs/src/pages/bbs/ui/bbs-page.tsx
@@ -51,7 +51,7 @@ function BbsPage() {
       }),
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/board-statistics/ui/board-statistics-page.tsx b/apps/cs/src/pages/board-statistics/ui/board-statistics-page.tsx
index 716c390ab..495f5d9f6 100644
--- a/apps/cs/src/pages/board-statistics/ui/board-statistics-page.tsx
+++ b/apps/cs/src/pages/board-statistics/ui/board-statistics-page.tsx
@@ -107,7 +107,7 @@ function BoardStatisticsPage() {
     setPresetDateRange("");
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     const params: BoardStatisticsParams = {
       siteId,
diff --git a/apps/cs/src/pages/code/ui/lwpocode-dialog.tsx b/apps/cs/src/pages/code/ui/lwpocode-dialog.tsx
index 3179303dd..69dd31aa2 100644
--- a/apps/cs/src/pages/code/ui/lwpocode-dialog.tsx
+++ b/apps/cs/src/pages/code/ui/lwpocode-dialog.tsx
@@ -103,7 +103,6 @@ const LwpoCodeManagementDialog = memo(
         prntLwpoCd: detailData?.prntLwpoCd ?? "",
         useYn: detailData?.useYn ?? "Y",
         sortSeq: detailData?.sortSeq ?? 0,
-        delYn: "N",
       },
     });
 
diff --git a/apps/cs/src/pages/code/ui/lwpocode-section.tsx b/apps/cs/src/pages/code/ui/lwpocode-section.tsx
index 61726a6b8..fb8fcd91c 100644
--- a/apps/cs/src/pages/code/ui/lwpocode-section.tsx
+++ b/apps/cs/src/pages/code/ui/lwpocode-section.tsx
@@ -65,7 +65,7 @@ function LwpoCodeSection({ upCd }: LwpoCodeSectionProps) {
     dataTableOptions: { viewPagination: true },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/code/ui/upcode-dialog.tsx b/apps/cs/src/pages/code/ui/upcode-dialog.tsx
index 6774bd17e..d54030cca 100644
--- a/apps/cs/src/pages/code/ui/upcode-dialog.tsx
+++ b/apps/cs/src/pages/code/ui/upcode-dialog.tsx
@@ -31,7 +31,13 @@ import {
 import { SiteSelect } from "@/entities/site";
 import { ENDPOINT } from "@/shared/config";
 import { useAlertStore, useMutationWrapper } from "@/shared/lib";
-import { Form, FormField, FormItem, FormControl } from "@/shared/ui/form";
+import {
+  Form,
+  FormField,
+  FormItem,
+  FormControl,
+  FormMessage,
+} from "@/shared/ui/form";
 
 type UpCodeManagementDialogProps = {
   upCd?: string;
@@ -139,6 +145,7 @@ const UpCodeManagementDialog = memo(
                                 disabled={!isRegistration}
                               />
                             </FormControl>
+                            <FormMessage />
                           </FormItem>
                         )}
                       />
@@ -160,6 +167,7 @@ const UpCodeManagementDialog = memo(
                                 placeholder="상위코드명을 입력해주세요"
                               />
                             </FormControl>
+                            <FormMessage />
                           </FormItem>
                         )}
                       />
diff --git a/apps/cs/src/pages/code/ui/upcode-section.tsx b/apps/cs/src/pages/code/ui/upcode-section.tsx
index ef89d2d3a..cd67725cf 100644
--- a/apps/cs/src/pages/code/ui/upcode-section.tsx
+++ b/apps/cs/src/pages/code/ui/upcode-section.tsx
@@ -40,7 +40,7 @@ function UpCodeSection({ handleSelectedUpCd }: UpCodeSectionProps) {
     handleSelectedUpCd(row.upCd);
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/contents/ui/contents-page.tsx b/apps/cs/src/pages/contents/ui/contents-page.tsx
index 51ba5c7c0..105aecdba 100644
--- a/apps/cs/src/pages/contents/ui/contents-page.tsx
+++ b/apps/cs/src/pages/contents/ui/contents-page.tsx
@@ -38,7 +38,7 @@ function ContentsPage() {
     placeholderData: keepPreviousData,
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/file/ui/file-page.tsx b/apps/cs/src/pages/file/ui/file-page.tsx
index 8b5eba617..f4ff3f97a 100644
--- a/apps/cs/src/pages/file/ui/file-page.tsx
+++ b/apps/cs/src/pages/file/ui/file-page.tsx
@@ -65,7 +65,7 @@ function FilePage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/groups/ui/add-user-dialog.tsx b/apps/cs/src/pages/groups/ui/add-user-dialog.tsx
index 4f8a205ff..f2a1b68a2 100644
--- a/apps/cs/src/pages/groups/ui/add-user-dialog.tsx
+++ b/apps/cs/src/pages/groups/ui/add-user-dialog.tsx
@@ -149,7 +149,7 @@ function AddUserDialog({ groupId }: AdditionalUserDialogProps) {
     }
   };
 
-  const handleSearch = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSearch = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     e.stopPropagation();
     setPagination({
diff --git a/apps/cs/src/pages/groups/ui/group-users-section.tsx b/apps/cs/src/pages/groups/ui/group-users-section.tsx
index 4b7170e3a..db8b5dec3 100644
--- a/apps/cs/src/pages/groups/ui/group-users-section.tsx
+++ b/apps/cs/src/pages/groups/ui/group-users-section.tsx
@@ -12,7 +12,7 @@ import {
   type RowSelectionState,
 } from "@tanstack/react-table";
 import { useConfirm } from "@frontend-opensource/use-react-hooks";
-import { Button,Input, Label  } from "@common/components";
+import { Button, Input, Label } from "@common/components";
 import { GroupUsersApi } from "@/entities/group-user";
 import { ENDPOINT } from "@/shared/config";
 import { useAlertStore, useDataTable } from "@/shared/lib";
@@ -33,8 +33,8 @@ function GroupUsersSection({ groupId }: GroupUsersSectionProps) {
     pageSize: 10,
   });
 
-    const [userNm, setUserNm] = useState("");
-    
+  const [userNm, setUserNm] = useState("");
+
   const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
 
   const query = useQuery({
@@ -50,7 +50,7 @@ function GroupUsersSection({ groupId }: GroupUsersSectionProps) {
     placeholderData: keepPreviousData,
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
@@ -116,27 +116,27 @@ function GroupUsersSection({ groupId }: GroupUsersSectionProps) {
   return (
     <div className="flex-1">
       <div className="card card-border">
-      <form onSubmit={handleSubmit} className="flex items-center gap-2 p-2">
-        <Label htmlFor="" className="mr-2 text-label">
-          이름
-        </Label>
-        <Input
-          className="h-[3.2rem] w-[20rem] rounded-sm !text-[1.3rem]"
-          value={userNm}
-          onChange={(e) => setUserNm(e.target.value)}
-        />
-        <Button className="h-[3.2rem]" type="submit">
-          조회
-        </Button>
-        <Button
-          type="button"
-          color="white"
-          className="h-[3.2rem]"
-          onClick={handleReset}
-        >
-          초기화
-        </Button>
-      </form>
+        <form onSubmit={handleSubmit} className="flex items-center gap-2 p-2">
+          <Label htmlFor="" className="mr-2 text-label">
+            이름
+          </Label>
+          <Input
+            className="h-[3.2rem] w-[20rem] rounded-sm !text-[1.3rem]"
+            value={userNm}
+            onChange={(e) => setUserNm(e.target.value)}
+          />
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+          <Button
+            type="button"
+            color="white"
+            className="h-[3.2rem]"
+            onClick={handleReset}
+          >
+            초기화
+          </Button>
+        </form>
       </div>
       <div className="card card-border">
         <div className="card-header">
diff --git a/apps/cs/src/pages/groups/ui/groups-section.tsx b/apps/cs/src/pages/groups/ui/groups-section.tsx
index 9c7f5b6ca..019a4a17f 100644
--- a/apps/cs/src/pages/groups/ui/groups-section.tsx
+++ b/apps/cs/src/pages/groups/ui/groups-section.tsx
@@ -8,13 +8,13 @@ import {
 } from "@tanstack/react-query";
 import { getCoreRowModel, type PaginationState } from "@tanstack/react-table";
 import { Button, Input, Label } from "@common/components";
-import { GroupApi , type GroupSearchParams} from "@/entities/group";
+import { GroupApi, type GroupSearchParams } from "@/entities/group";
 import { ENDPOINT } from "@/shared/config";
 import { useDataTable } from "@/shared/lib";
 import { createColumns } from "../model/groups-table-columns";
 import { GroupsDialog } from "./groups-dialog";
 import { useConfirm } from "@frontend-opensource/use-react-hooks";
-import { useAlertStore, useMutationWrapper } from "@/shared/lib"; 
+import { useAlertStore, useMutationWrapper } from "@/shared/lib";
 
 type GroupsSectionProps = {
   handleSelectedGroup: (groupId: string) => void;
@@ -29,14 +29,12 @@ function GroupsSection({ handleSelectedGroup }: GroupsSectionProps) {
   const [groupNm, setGroupNm] = useState("");
   const [searchParams, setSearchParams] = useState<GroupSearchParams>({
     groupNm: "",
-    delYn  :"N",
-    sort   : "groupId,desc",
+    delYn: "N",
+    sort: "groupId,desc",
   });
 
-
-
   const query = useQuery({
-    queryKey: [ENDPOINT.CMS_SERVICE.GROUPS,searchParams,  pagination],
+    queryKey: [ENDPOINT.CMS_SERVICE.GROUPS, searchParams, pagination],
     queryFn: () =>
       GroupApi.findPageGroup({
         ...searchParams,
@@ -64,7 +62,7 @@ function GroupsSection({ handleSelectedGroup }: GroupsSectionProps) {
     }
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
@@ -81,7 +79,7 @@ function GroupsSection({ handleSelectedGroup }: GroupsSectionProps) {
     setSearchParams({
       ...searchParams,
       groupNm: "",
-      delYn:"N"
+      delYn: "N",
     });
   };
   const handleRowClick = (row: { groupId: string }) => {
@@ -109,41 +107,41 @@ function GroupsSection({ handleSelectedGroup }: GroupsSectionProps) {
   return (
     <div className="flex-1">
       <div className="card card-border">
-      <form onSubmit={handleSubmit} className="flex items-center gap-2 p-2">
-        <Label htmlFor="" className="mr-2 text-label">
-          그룹명
-        </Label>
-        <Input
-          className="h-[3.2rem] w-[20rem] rounded-sm !text-[1.3rem]"
-          value={groupNm}
-          onChange={(e) => setGroupNm(e.target.value)}
-        />
-        <Button className="h-[3.2rem]" type="submit">
-          조회
-        </Button>
-        <Button
-          type="button"
-          color="white"
-          className="h-[3.2rem]"
-          onClick={handleReset}
-        >
-          초기화
-        </Button>
-      <Label htmlFor="delYn" className="ml-4 mr-2 text-label">
-        삭제여부
-      </Label>
-      <input
-        id="delYn"
-        type="checkbox"
-        checked={searchParams.delYn === "Y"}
-        onChange={(e) =>
-          setSearchParams({
-            ...searchParams,
-            delYn: e.target.checked ? "Y" : "N",
-          })
-        }
-      /> 
-      </form>
+        <form onSubmit={handleSubmit} className="flex items-center gap-2 p-2">
+          <Label htmlFor="" className="mr-2 text-label">
+            그룹명
+          </Label>
+          <Input
+            className="h-[3.2rem] w-[20rem] rounded-sm !text-[1.3rem]"
+            value={groupNm}
+            onChange={(e) => setGroupNm(e.target.value)}
+          />
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+          <Button
+            type="button"
+            color="white"
+            className="h-[3.2rem]"
+            onClick={handleReset}
+          >
+            초기화
+          </Button>
+          <Label htmlFor="delYn" className="ml-4 mr-2 text-label">
+            삭제여부
+          </Label>
+          <input
+            id="delYn"
+            type="checkbox"
+            checked={searchParams.delYn === "Y"}
+            onChange={(e) =>
+              setSearchParams({
+                ...searchParams,
+                delYn: e.target.checked ? "Y" : "N",
+              })
+            }
+          />
+        </form>
       </div>
       <div className="card card-border">
         <div className="card-header">
diff --git a/apps/cs/src/pages/groups/ui/menu-authority-dialog.tsx b/apps/cs/src/pages/groups/ui/menu-authority-dialog.tsx
index cde3cf641..02ca5739f 100644
--- a/apps/cs/src/pages/groups/ui/menu-authority-dialog.tsx
+++ b/apps/cs/src/pages/groups/ui/menu-authority-dialog.tsx
@@ -95,7 +95,7 @@ function MenuAuthorityDialog({ groupId }: MenuAuthorityDialogProps) {
     }
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     const formData = new FormData(e.target as HTMLFormElement);
     const keyword = formData.get("keyword") as string;
diff --git a/apps/cs/src/pages/image/ui/image-page.tsx b/apps/cs/src/pages/image/ui/image-page.tsx
index 6208f180b..212726c5d 100644
--- a/apps/cs/src/pages/image/ui/image-page.tsx
+++ b/apps/cs/src/pages/image/ui/image-page.tsx
@@ -46,7 +46,7 @@ function ImagePage() {
       }),
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/link/ui/link-page.tsx b/apps/cs/src/pages/link/ui/link-page.tsx
index c1b1052fe..a59b9e751 100644
--- a/apps/cs/src/pages/link/ui/link-page.tsx
+++ b/apps/cs/src/pages/link/ui/link-page.tsx
@@ -4,7 +4,17 @@ import "@common/assets/styles/grid.css";
 
 import { useState } from "react";
 import { useRouter } from "next/navigation";
-import { Button, Input, Label, LoadingWithAnimation, Select, SelectTrigger, SelectContent, SelectItem, SelectValue } from "@common/components";
+import {
+  Button,
+  Input,
+  Label,
+  LoadingWithAnimation,
+  Select,
+  SelectTrigger,
+  SelectContent,
+  SelectItem,
+  SelectValue,
+} from "@common/components";
 import { getCoreRowModel } from "@tanstack/react-table";
 import { LinkApi, type Link, type LinkSearchParam } from "@/entities/link";
 import { useQuery } from "@tanstack/react-query";
@@ -14,147 +24,161 @@ import { useDataTable } from "@/shared/lib";
 import LinkExpiredAlert from "./LinkExpiredAlert";
 
 function LinkPage() {
-    const router = useRouter();
-    const queryClient = useQueryClient();
+  const router = useRouter();
+  const queryClient = useQueryClient();
 
-    const [linkSn, setLinkSn] = useState<string>('');
-    const [linkNm, setLinkNm] = useState<string>('');
-    const [linkClfsCd, setLinkClfsCd] = useState<string>('');
+  const [linkSn, setLinkSn] = useState<string>("");
+  const [linkNm, setLinkNm] = useState<string>("");
+  const [linkClfsCd, setLinkClfsCd] = useState<string>("");
 
-    const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
-        linkSn: '',
-        linkNm: '',
-        linkClfsCd: '',
+  const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
+    linkSn: "",
+    linkNm: "",
+    linkClfsCd: "",
+  });
+
+  const query = useQuery({
+    queryKey: [
+      `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`,
+      linkSearchParam,
+    ],
+    queryFn: () => LinkApi.getLinkList(linkSearchParam),
+  });
+
+  const handleResetSearchParam = () => {
+    setLinkSn("");
+    setLinkNm("");
+    setLinkClfsCd("ALL");
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn: "",
+      linkNm: "",
+      linkClfsCd: "ALL",
     });
+  };
 
-    const query = useQuery({
-        queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`, linkSearchParam],
-        queryFn: () => LinkApi.getLinkList(linkSearchParam),
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn,
+      linkNm,
+      linkClfsCd,
     });
+  };
 
-    const handleResetSearchParam = () => {
-        setLinkSn('');
-        setLinkNm('');
-        setLinkClfsCd('ALL');
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn: '',
-            linkNm: '',
-            linkClfsCd: 'ALL',
-        });
-    };
-
-    const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault();
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn,
-            linkNm,
-            linkClfsCd,
-        });
-    };
-
-    const handleRowClick = (link: Link) => {
-        queryClient.removeQueries({
-            queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`],
-        });
-        queryClient.removeQueries({
-            queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkInfo`],
-        });
-        router.push(`link/register/${link.link_sn}`);
-    };
-
-    const handleClickRegist = () => {
-        router.push('link/register');
-    };
-
-    const { tableComponent } = useDataTable({
-        query,
-        tableOptions: {
-            columns,
-            manualPagination: true,
-            enableMultiRowSelection: true,
-            getCoreRowModel: getCoreRowModel(),
-        },
-        dataTableOptions: {
-            onRowClick: handleRowClick,
-            viewPagination: true,
-        },
+  const handleRowClick = (link: Link) => {
+    queryClient.removeQueries({
+      queryKey: [
+        `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`,
+      ],
     });
+    queryClient.removeQueries({
+      queryKey: [
+        `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkInfo`,
+      ],
+    });
+    router.push(`link/register/${link.link_sn}`);
+  };
 
-    return (
-        <div className="card card-border !mt-6">
-            <div className="card card-border">
-                <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
-                    <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
-                        일련번호
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-4"
-                        id="liSnSearchInput"
-                        value={linkSn}
-                        onChange={(e) => setLinkSn(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
-                        연계 명
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-2"
-                        id="liNmSearchInput"
-                        value={linkNm}
-                        onChange={(e) => setLinkNm(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Label htmlFor="linkClfsCd" className="mr-2 text-label">
-                        연계 분류
-                    </Label>
-                    <Select onValueChange={(e) => setLinkClfsCd(e)} value={linkClfsCd}>
-                        <SelectTrigger id="linkClfsCd" className="w-[20rem] mr-4">
-                            <SelectValue placeholder="전체"></SelectValue>
-                        </SelectTrigger>
-                        <SelectContent>
-                            <SelectItem value="ALL">전체</SelectItem>
-                            <SelectItem value="link0001">TIBERO 데이터베이스</SelectItem>
-                            <SelectItem value="link0002">ORACLE 데이터베이스</SelectItem>
-                            <SelectItem value="link0003">공공데이터 포털 API</SelectItem>
-                            <SelectItem value="link0004">한강홍수통제소 API</SelectItem>
-                            <SelectItem value="link0005">기상청 API</SelectItem>
-                            <SelectItem value="link0006">국가지하수정보센터 API</SelectItem>
-                            <SelectItem value="link0007">행정정보공동이용센터 연계</SelectItem>
-                        </SelectContent>
-                    </Select>
-                    <Button color="green" className="h-[3.2rem]" type="button" onClick={handleResetSearchParam}>
-                        초기화
-                    </Button>
-                    <Button className="h-[3.2rem]" type="submit">
-                        조회
-                    </Button>
-                </form>
-            </div>
-            <div className="card card-border flex flex-col h-[calc(100vh-28rem)]">
-                <div className="card-header">
-                    <h3 className="text-2xl font-medium text-label">연계 목록</h3>
-                        
-                    <div className="flex items-center">
-                        <LinkExpiredAlert linkList={query} />
-                        <Button onClick={handleClickRegist}>등록</Button>
-                    </div>
-                </div>
-                <div className="card !m-[1.2rem] overflow-auto h-full !p-0">
-                    {!query.isLoading ?
-                        <div>{tableComponent}</div>
-                        :
-                        <div className="[data-theme='black']:bg-transparent rounded-lg p-10 flex justify-center items-center h-full">
-                            <div className="relative size-[5rem]">
-                                <LoadingWithAnimation color="primary" />
-                            </div>
-                        </div>
-                    }
-                </div>
-            </div>
+  const handleClickRegist = () => {
+    router.push("link/register");
+  };
+
+  const { tableComponent } = useDataTable({
+    query,
+    tableOptions: {
+      columns,
+      manualPagination: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+    },
+    dataTableOptions: {
+      onRowClick: handleRowClick,
+      viewPagination: true,
+    },
+  });
+
+  return (
+    <div className="card card-border !mt-6">
+      <div className="card card-border">
+        <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
+          <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
+            일련번호
+          </Label>
+          <Input
+            className="mr-4 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liSnSearchInput"
+            value={linkSn}
+            onChange={(e) => setLinkSn(e.target.value)}
+            autoComplete="off"
+          />
+          <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
+            연계 명
+          </Label>
+          <Input
+            className="mr-2 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liNmSearchInput"
+            value={linkNm}
+            onChange={(e) => setLinkNm(e.target.value)}
+            autoComplete="off"
+          />
+          <Label htmlFor="linkClfsCd" className="mr-2 text-label">
+            연계 분류
+          </Label>
+          <Select onValueChange={(e) => setLinkClfsCd(e)} value={linkClfsCd}>
+            <SelectTrigger id="linkClfsCd" className="mr-4 w-[20rem]">
+              <SelectValue placeholder="전체"></SelectValue>
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="ALL">전체</SelectItem>
+              <SelectItem value="link0001">TIBERO 데이터베이스</SelectItem>
+              <SelectItem value="link0002">ORACLE 데이터베이스</SelectItem>
+              <SelectItem value="link0003">공공데이터 포털 API</SelectItem>
+              <SelectItem value="link0004">한강홍수통제소 API</SelectItem>
+              <SelectItem value="link0005">기상청 API</SelectItem>
+              <SelectItem value="link0006">국가지하수정보센터 API</SelectItem>
+              <SelectItem value="link0007">
+                행정정보공동이용센터 연계
+              </SelectItem>
+            </SelectContent>
+          </Select>
+          <Button
+            color="green"
+            className="h-[3.2rem]"
+            type="button"
+            onClick={handleResetSearchParam}
+          >
+            초기화
+          </Button>
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+        </form>
+      </div>
+      <div className="card card-border flex h-[calc(100vh-28rem)] flex-col">
+        <div className="card-header">
+          <h3 className="text-2xl font-medium text-label">연계 목록</h3>
+
+          <div className="flex items-center">
+            <LinkExpiredAlert linkList={query} />
+            <Button onClick={handleClickRegist}>등록</Button>
+          </div>
         </div>
-    );
+        <div className="card !m-[1.2rem] h-full overflow-auto !p-0">
+          {!query.isLoading ? (
+            <div>{tableComponent}</div>
+          ) : (
+            <div className="[data-theme='black']:bg-transparent flex h-full items-center justify-center rounded-lg p-10">
+              <div className="relative size-[5rem]">
+                <LoadingWithAnimation color="primary" />
+              </div>
+            </div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
 }
 
-export { LinkPage };
\ No newline at end of file
+export { LinkPage };
diff --git a/apps/cs/src/pages/linkLog/ui/link-log-page.tsx b/apps/cs/src/pages/linkLog/ui/link-log-page.tsx
index dd39a4726..5a0637b72 100644
--- a/apps/cs/src/pages/linkLog/ui/link-log-page.tsx
+++ b/apps/cs/src/pages/linkLog/ui/link-log-page.tsx
@@ -3,10 +3,25 @@
 import "@common/assets/styles/grid.css";
 
 import { useState } from "react";
-import { Button, Input, Label, DatePicker, Select, SelectTrigger, SelectContent, SelectItem, SelectValue, LoadingWithAnimation } from "@common/components";
+import {
+  Button,
+  Input,
+  Label,
+  DatePicker,
+  Select,
+  SelectTrigger,
+  SelectContent,
+  SelectItem,
+  SelectValue,
+  LoadingWithAnimation,
+} from "@common/components";
 import { useQuery } from "@tanstack/react-query";
 
-import { getCoreRowModel, type PaginationState, type RowSelectionState, } from "@tanstack/react-table";
+import {
+  getCoreRowModel,
+  type PaginationState,
+  type RowSelectionState,
+} from "@tanstack/react-table";
 import { LinkApi, type LinkSearchParam } from "@/entities/link";
 import { columns } from "../model/table-columns";
 import dayjs from "dayjs";
@@ -14,176 +29,200 @@ import { useAlertStore } from "@/shared/lib/use-alert-store";
 import { useDataTable } from "@/shared/lib";
 
 function LinkLogPage() {
-    const { setMessage: alert } = useAlertStore((state) => state);
+  const { setMessage: alert } = useAlertStore((state) => state);
 
-    const [linkSn, setLinkSn] = useState<string>('');
-    const [linkNm, setLinkNm] = useState<string>('');
-    const [isSucc, setIsSucc] = useState<string>('ALL');
-    const [startDate, setStartDate] = useState<string>(dayjs().subtract(7, "day").format('YYYY-MM-DD'));
-    const [endDate, setEndDate] = useState<string>(dayjs().format('YYYY-MM-DD'));
+  const [linkSn, setLinkSn] = useState<string>("");
+  const [linkNm, setLinkNm] = useState<string>("");
+  const [isSucc, setIsSucc] = useState<string>("ALL");
+  const [startDate, setStartDate] = useState<string>(
+    dayjs().subtract(7, "day").format("YYYY-MM-DD"),
+  );
+  const [endDate, setEndDate] = useState<string>(dayjs().format("YYYY-MM-DD"));
 
-    const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
-        linkSn: '',
-        linkNm: '',
-        isSucc: '',
-        startDate: '',
-        endDate: '',
+  const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
+    linkSn: "",
+    linkNm: "",
+    isSucc: "",
+    startDate: "",
+    endDate: "",
+  });
+
+  const [pagination, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 100,
+  });
+
+  const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+
+  const query = useQuery({
+    queryKey: [
+      `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`,
+      linkSearchParam,
+      pagination,
+    ],
+    queryFn: () =>
+      LinkApi.getLinkLogList({
+        ...linkSearchParam,
+        page: pagination.pageIndex,
+        size: pagination.pageSize,
+        isSucc,
+        startDate,
+        endDate,
+      }),
+  });
+
+  const { tableComponent } = useDataTable({
+    query,
+    tableOptions: {
+      columns,
+      state: {
+        pagination,
+        rowSelection,
+      },
+      manualPagination: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setPagination,
+      onRowSelectionChange: setRowSelection,
+    },
+    dataTableOptions: {
+      viewPagination: true,
+    },
+  });
+
+  const handleResetSearchParam = () => {
+    setIsSucc("ALL");
+    setLinkNm("");
+    setLinkSn("");
+    setStartDate(dayjs().subtract(7, "day").format("YYYY-MM-DD"));
+    setEndDate(dayjs().format("YYYY-MM-DD"));
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn: "",
+      linkNm: "",
+      isSucc: "ALL",
+      startDate: dayjs().subtract(7, "day").format("YYYY-MM-DD"),
+      endDate: dayjs().format("YYYY-MM-DD"),
     });
+  };
 
-    const [pagination, setPagination] = useState<PaginationState>({
-        pageIndex: 0,
-        pageSize: 100,
-    });
+  const handleSubmit = async (e?: React.SubmitEvent<HTMLFormElement>) => {
+    e?.preventDefault();
 
-    const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
-
-    const query = useQuery({
-        queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`, linkSearchParam, pagination],
-        queryFn: () =>
-            LinkApi.getLinkLogList({
-                ...linkSearchParam,
-                page: pagination.pageIndex,
-                size: pagination.pageSize,
-                isSucc,
-                startDate,
-                endDate,
-            }),
-    });
-
-    const { tableComponent } = useDataTable({
-        query,
-        tableOptions: {
-            columns,
-            state: {
-                pagination,
-                rowSelection,
-            },
-            manualPagination: true,
-            enableMultiRowSelection: true,
-            getCoreRowModel: getCoreRowModel(),
-            onPaginationChange: setPagination,
-            onRowSelectionChange: setRowSelection,
-        },
-        dataTableOptions: {
-            viewPagination: true,
-        },
-    });
-
-    const handleResetSearchParam = () => {
-        setIsSucc('ALL');
-        setLinkNm('');
-        setLinkSn('');
-        setStartDate(dayjs().subtract(7, "day").format('YYYY-MM-DD'));
-        setEndDate(dayjs().format('YYYY-MM-DD'));
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn: '',
-            linkNm: '',
-            isSucc: 'ALL',
-            startDate: dayjs().subtract(7, "day").format('YYYY-MM-DD'),
-            endDate: dayjs().format('YYYY-MM-DD'),
+    if (startDate && endDate) {
+      if (startDate > endDate) {
+        alert("종료일이 시작일보다 이전일 수 없습니다.");
+        return;
+      } else {
+        setPagination({
+          ...pagination,
+          pageIndex: 0,
         });
-    };
+        setLinkSearchParam({
+          ...linkSearchParam,
+          linkSn,
+          linkNm,
+          isSucc,
+          startDate,
+          endDate,
+        });
+      }
+    } else {
+      alert("조회 날짜를 선택해주세요.");
+      return;
+    }
+  };
 
-    const handleSubmit = async (e?: React.FormEvent<HTMLFormElement>) => {
-        e?.preventDefault();
-
-        if (startDate && endDate) {
-
-            if (startDate > endDate) {
-                alert('종료일이 시작일보다 이전일 수 없습니다.');
-                return;
-            } else {
-                setPagination({
-                    ...pagination,
-                    pageIndex: 0,
-                });
-                setLinkSearchParam({
-                    ...linkSearchParam,
-                    linkSn,
-                    linkNm,
-                    isSucc,
-                    startDate,
-                    endDate,
-                });
-            }
-        } else {
-            alert('조회 날짜를 선택해주세요.');
-            return;
-        }
-    };
-
-    return (
-        <div className="card card-border !mt-6">
-            <div className="card card-border">
-                <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
-                    <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
-                        일련번호
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-4"
-                        id="liSnSearchInput"
-                        value={linkSn}
-                        onChange={(e) => setLinkSn(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
-                        연계 명
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-4"
-                        id="liNmSearchInput"
-                        value={linkNm}
-                        onChange={(e) => setLinkNm(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Label htmlFor="liResultCode" className="mr-2 text-label">
-                        실행결과
-                    </Label>
-                    <Select onValueChange={(e) => setIsSucc(e)} value={isSucc}>
-                        <SelectTrigger id="liResultCode" className="w-[10rem] mr-4">
-                            <SelectValue placeholder="전체"></SelectValue>
-                        </SelectTrigger>
-                        <SelectContent>
-                            <SelectItem value="ALL">전체</SelectItem>
-                            <SelectItem value="SUCC">성공</SelectItem>
-                            <SelectItem value="FAIL">실패</SelectItem>
-                        </SelectContent>
-                    </Select>
-                    <Label htmlFor="sDateSearchInput" className="mx-2 text-label">
-                        시작일
-                    </Label>
-                    <DatePicker id="sDateSearchInput" mode={"single"} selected={dayjs(startDate).toDate()} onSelect={(e) => setStartDate(dayjs(e).format('YYYY-MM-DD'))} />
-                    <Label htmlFor="eDateSearchInput" className="mx-2 text-label">
-                        종료일
-                    </Label>
-                    <DatePicker id="eDateSearchInput" mode={"single"} className="mr-2" selected={dayjs(endDate).toDate()} onSelect={(e) => setEndDate(dayjs(e).format('YYYY-MM-DD'))} />
-                    <Button color="green" className="h-[3.2rem]" type="button" onClick={handleResetSearchParam}>
-                        초기화
-                    </Button>
-                    <Button className="h-[3.2rem]" type="submit">
-                        조회
-                    </Button>
-                </form>
-            </div>
-            <div className="card card-border flex flex-col h-[calc(100vh-28rem)]">
-                <div className="card-header">
-                    <h3 className="text-2xl font-medium text-label">로그 목록 (검색 조건에 따른 건수 : {query.data?.totalElements.toLocaleString('ko-KR') ?? 0} )</h3>
-                </div>
-                <div className="card !m-[1.2rem] overflow-auto h-full !p-0">
-                    {query.isLoading ?
-                        <div className="[data-theme='black']:bg-transparent rounded-lg p-10 h-full flex justify-center items-center">
-                            <div className="relative size-[5rem]">
-                                <LoadingWithAnimation color="primary" />
-                            </div>
-                        </div>
-                        :
-                        <div>{tableComponent}</div>
-                    }
-                </div>
-            </div>
+  return (
+    <div className="card card-border !mt-6">
+      <div className="card card-border">
+        <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
+          <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
+            일련번호
+          </Label>
+          <Input
+            className="mr-4 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liSnSearchInput"
+            value={linkSn}
+            onChange={(e) => setLinkSn(e.target.value)}
+            autoComplete="off"
+          />
+          <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
+            연계 명
+          </Label>
+          <Input
+            className="mr-4 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liNmSearchInput"
+            value={linkNm}
+            onChange={(e) => setLinkNm(e.target.value)}
+            autoComplete="off"
+          />
+          <Label htmlFor="liResultCode" className="mr-2 text-label">
+            실행결과
+          </Label>
+          <Select onValueChange={(e) => setIsSucc(e)} value={isSucc}>
+            <SelectTrigger id="liResultCode" className="mr-4 w-[10rem]">
+              <SelectValue placeholder="전체"></SelectValue>
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="ALL">전체</SelectItem>
+              <SelectItem value="SUCC">성공</SelectItem>
+              <SelectItem value="FAIL">실패</SelectItem>
+            </SelectContent>
+          </Select>
+          <Label htmlFor="sDateSearchInput" className="mx-2 text-label">
+            시작일
+          </Label>
+          <DatePicker
+            id="sDateSearchInput"
+            mode={"single"}
+            selected={dayjs(startDate).toDate()}
+            onSelect={(e) => setStartDate(dayjs(e).format("YYYY-MM-DD"))}
+          />
+          <Label htmlFor="eDateSearchInput" className="mx-2 text-label">
+            종료일
+          </Label>
+          <DatePicker
+            id="eDateSearchInput"
+            mode={"single"}
+            className="mr-2"
+            selected={dayjs(endDate).toDate()}
+            onSelect={(e) => setEndDate(dayjs(e).format("YYYY-MM-DD"))}
+          />
+          <Button
+            color="green"
+            className="h-[3.2rem]"
+            type="button"
+            onClick={handleResetSearchParam}
+          >
+            초기화
+          </Button>
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+        </form>
+      </div>
+      <div className="card card-border flex h-[calc(100vh-28rem)] flex-col">
+        <div className="card-header">
+          <h3 className="text-2xl font-medium text-label">
+            로그 목록 (검색 조건에 따른 건수 :{" "}
+            {query.data?.totalElements.toLocaleString("ko-KR") ?? 0} )
+          </h3>
         </div>
-    )
-};
+        <div className="card !m-[1.2rem] h-full overflow-auto !p-0">
+          {query.isLoading ? (
+            <div className="[data-theme='black']:bg-transparent flex h-full items-center justify-center rounded-lg p-10">
+              <div className="relative size-[5rem]">
+                <LoadingWithAnimation color="primary" />
+              </div>
+            </div>
+          ) : (
+            <div>{tableComponent}</div>
+          )}
+        </div>
+      </div>
+    </div>
+  );
+}
 
-export { LinkLogPage };
\ No newline at end of file
+export { LinkLogPage };
diff --git a/apps/cs/src/pages/linkParams/ui/link-params-page.tsx b/apps/cs/src/pages/linkParams/ui/link-params-page.tsx
index 319df80b2..001eb9953 100644
--- a/apps/cs/src/pages/linkParams/ui/link-params-page.tsx
+++ b/apps/cs/src/pages/linkParams/ui/link-params-page.tsx
@@ -1,20 +1,31 @@
-'use client';
+"use client";
 
 import { useState, useMemo } from "react";
 import {
-    Button,
-    DataTable,
-    Input,
-    Label,
-    Table,
-    TableBody,
-    TableCell,
-    TableHead,
-    TableRow,
-    LoadingWithAnimation,
+  Button,
+  DataTable,
+  Input,
+  Label,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  LoadingWithAnimation,
 } from "@common/components";
-import { getCoreRowModel, useReactTable, type PaginationState, type RowSelectionState, } from "@tanstack/react-table";
-import { LinkApi, type Link, type LinkSearchParam, type LinkVrblFormData, linkVrblFormSchema } from "@/entities/link";
+import {
+  getCoreRowModel,
+  useReactTable,
+  type PaginationState,
+  type RowSelectionState,
+} from "@tanstack/react-table";
+import {
+  LinkApi,
+  type Link,
+  type LinkSearchParam,
+  type LinkVrblFormData,
+  linkVrblFormSchema,
+} from "@/entities/link";
 import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
 import { columns } from "../model/table-columns";
 import { vrblColumns } from "../model/vrbl-table-columns";
@@ -31,376 +42,388 @@ import { ConfirmDialog } from "@/shared/ui/confirm-dialog";
 import { useDataTable } from "@/shared/lib";
 
 function LinkParamsPage() {
-    const queryClient = useQueryClient();
+  const queryClient = useQueryClient();
 
-    const [linkSn, setLinkSn] = useState<string>('');
-    const [linkNm, setLinkNm] = useState<string>('');
+  const [linkSn, setLinkSn] = useState<string>("");
+  const [linkNm, setLinkNm] = useState<string>("");
 
-    const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
-        linkSn: '',
-        linkNm: ''
+  const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
+    linkSn: "",
+    linkNm: "",
+  });
+
+  const [selectedLink, setSelectedLink] = useState<{
+    linkSn: string;
+    linkNm: string;
+  }>({
+    linkSn: "",
+    linkNm: "",
+  });
+
+  const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+
+  const [pagination, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 100,
+  });
+
+  const { confirm } = useConfirm();
+
+  const [selectedVrblIds, setSelectedVrblIds] = useState<string[]>([]);
+  const [isDBdata, setIsDBData] = useState<boolean>(false);
+  const [dialogOpen, setDialogOpen] = useState<boolean>(false);
+  const [onConfirm, setOnConfirm] = useState<boolean>(false);
+
+  const userUniqId = getCookie(AUTH_USER_ID) ?? "";
+  const { setMessage: alert } = useAlertStore((state) => state);
+
+  const dbIdList = ["link0001", "link0002", "link0007"];
+
+  // Link 목록 쿼리
+  const query = useQuery({
+    queryKey: ["api/link/getLinkList", linkSearchParam],
+    queryFn: () =>
+      LinkApi.getLinkList({
+        ...linkSearchParam,
+        page: pagination.pageIndex,
+        size: pagination.pageSize,
+      }),
+  });
+
+  // LinkVrbl 목록 쿼리 - 별도 관리
+  const linkVrblQuery = useQuery({
+    queryKey: ["linkVrblList", selectedLink.linkSn],
+    queryFn: () => LinkApi.getLinkVrblList(selectedLink.linkSn),
+    enabled: !!selectedLink.linkSn && !dbIdList.includes(selectedLink.linkSn),
+    staleTime: 0, // 항상 최신 데이터를 가져오도록 설정
+  });
+
+  const handleResetSearchParam = () => {
+    setSelectedLink({
+      linkSn: "",
+      linkNm: "",
     });
 
-    const [selectedLink, setSelectedLink] = useState<{
-        linkSn: string;
-        linkNm: string;
-    }>({
-        linkSn: '',
-        linkNm: ''
+    setLinkSn("");
+    setLinkNm("");
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn: "",
+      linkNm: "",
+    });
+  };
+
+  const handleConfirm = async (callback: () => Promise<void>) => {
+    setOnConfirm(true);
+    await callback();
+    setOnConfirm(false);
+  };
+
+  const { mutateAsync: insertLinkVrbl } = useMutation({
+    mutationFn: async (data: LinkVrblFormData) =>
+      await LinkApi.insertLinkVrbl({
+        ...data,
+        link_sn: selectedLink.linkSn,
+        mdfr_id: userUniqId,
+      }),
+    onSuccess: async () => {
+      // 쿼리 무효화를 통한 최신 데이터 가져오기
+      await queryClient.invalidateQueries({
+        queryKey: ["linkVrblList", selectedLink.linkSn],
+      });
+      setDialogOpen(false);
+      alert("저장되었습니다.");
+    },
+  });
+
+  const { mutateAsync: updateLinkVrbl } = useMutation({
+    mutationFn: async (data: LinkVrblFormData) =>
+      await LinkApi.updateLinkVrblInfo({
+        ...data,
+        link_sn: selectedLink.linkSn,
+        mdfr_id: userUniqId,
+      }),
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: ["linkVrblList", selectedLink.linkSn],
+      });
+      setDialogOpen(false);
+      alert("저장되었습니다.");
+    },
+  });
+
+  const { mutateAsync: deleteLinkVrbl } = useMutation({
+    mutationFn: async (data: string[]) => await LinkApi.deleteLinkVrbl(data),
+    onSuccess: async () => {
+      await queryClient.refetchQueries({
+        queryKey: ["linkVrblList", selectedLink.linkSn],
+      });
+
+      setSelectedVrblIds([]);
+      alert("삭제되었습니다.");
+    },
+  });
+
+  // linkVrblQuery의 데이터를 사용
+  const tableData = useMemo(() => {
+    return linkVrblQuery.data?.content ?? [];
+  }, [linkVrblQuery.data]);
+
+  const vrblCols = useMemo(
+    () =>
+      vrblColumns({
+        selectedVrblIds,
+        setSelectedVrblIds,
+      }),
+    [selectedVrblIds],
+  );
+
+  const vrblTable = useReactTable({
+    data: tableData,
+    columns: vrblCols,
+    getCoreRowModel: getCoreRowModel(),
+  });
+
+  const form = useForm<LinkVrblFormData>({
+    resolver: zodResolver(linkVrblFormSchema),
+    defaultValues: {},
+  });
+
+  const handleRowClick = async (link: Link) => {
+    setSelectedLink({
+      linkSn: link.link_sn,
+      linkNm: link.link_nm,
     });
 
-    const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+    setSelectedVrblIds([]);
 
-    const [pagination, setPagination] = useState<PaginationState>({
-        pageIndex: 0,
-        pageSize: 100,
+    if (dbIdList.includes(link.link_clsf_cd)) {
+      setIsDBData(true);
+    } else {
+      setIsDBData(false);
+    }
+  };
+
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
+    e.preventDefault();
+
+    setSelectedLink({
+      linkSn: "",
+      linkNm: "",
     });
 
-    const { confirm } = useConfirm();
-
-    const [selectedVrblIds, setSelectedVrblIds] = useState<string[]>([]);
-    const [isDBdata, setIsDBData] = useState<boolean>(false);
-    const [dialogOpen, setDialogOpen] = useState<boolean>(false);
-    const [onConfirm, setOnConfirm] = useState<boolean>(false);
-
-    const userUniqId = getCookie(AUTH_USER_ID) ?? "";
-    const { setMessage: alert } = useAlertStore((state) => state);
-
-    const dbIdList = ['link0001', 'link0002', 'link0007'];
-
-    // Link 목록 쿼리
-    const query = useQuery({
-        queryKey: ['api/link/getLinkList', linkSearchParam],
-        queryFn: () => LinkApi.getLinkList({
-            ...linkSearchParam,
-            page: pagination.pageIndex,
-            size: pagination.pageSize,
-        }),
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn,
+      linkNm,
     });
+  };
 
-    // LinkVrbl 목록 쿼리 - 별도 관리
-    const linkVrblQuery = useQuery({
-        queryKey: ['linkVrblList', selectedLink.linkSn],
-        queryFn: () => LinkApi.getLinkVrblList(selectedLink.linkSn),
-        enabled: !!selectedLink.linkSn && !dbIdList.includes(selectedLink.linkSn),
-        staleTime: 0, // 항상 최신 데이터를 가져오도록 설정
-    });
+  const fetchUserInfo = async () => {
+    const userData = await getUserInfo();
+    return userData.userName;
+  };
 
-    const handleResetSearchParam = () => {
-        setSelectedLink({
-            linkSn: '',
-            linkNm: ''
-        });
-
-        setLinkSn('');
-        setLinkNm('');
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn: '',
-            linkNm: ''
-        });
-    };
-
-    const handleConfirm = async (callback: () => Promise<void>) => {
-        setOnConfirm(true);
-        await callback();
-        setOnConfirm(false);
-    };
-
-    const { mutateAsync: insertLinkVrbl } = useMutation({
-        mutationFn: async (data: LinkVrblFormData) =>
-            await LinkApi.insertLinkVrbl({
-                ...data,
-                link_sn: selectedLink.linkSn,
-                mdfr_id: userUniqId,
-            }),
-        onSuccess: async () => {
-            // 쿼리 무효화를 통한 최신 데이터 가져오기
-            await queryClient.invalidateQueries({
-                queryKey: ['linkVrblList', selectedLink.linkSn]
-            });
-            setDialogOpen(false);
-            alert('저장되었습니다.');
+  const handleDeleteParam = async () => {
+    if (selectedVrblIds.length === 0) {
+      alert("삭제할 파라미터를 선택해 주세요.");
+    } else {
+      await handleConfirm(async () => {
+        if (await confirm("선택한 파라미터 정보를 삭제하시겠습니까?")) {
+          deleteLinkVrbl(selectedVrblIds);
         }
-    });
+      });
+    }
+  };
 
-    const { mutateAsync: updateLinkVrbl } = useMutation({
-        mutationFn: async (data: LinkVrblFormData) => await LinkApi.updateLinkVrblInfo({
-            ...data,
-            link_sn: selectedLink.linkSn,
-            mdfr_id: userUniqId,
-        }),
-        onSuccess: async () => {
-            await queryClient.invalidateQueries({
-                queryKey: ['linkVrblList', selectedLink.linkSn]
-            });
-            setDialogOpen(false);
-            alert('저장되었습니다.');
-        }
-    });
+  const handleVrblRowClick = async (data: LinkVrbl) => {
+    const linkVrblInfo = await LinkApi.getLinkVrblInfo(data.link_vrbl_sn);
 
-    const { mutateAsync: deleteLinkVrbl } = useMutation({
-        mutationFn: async (data: string[]) => await LinkApi.deleteLinkVrbl(data),
-        onSuccess: async () => {
-            await queryClient.refetchQueries({
-                queryKey: ['linkVrblList', selectedLink.linkSn]
-            });
-            
-            setSelectedVrblIds([]);
-            alert('삭제되었습니다.');
-        }
-    });
+    if (linkVrblInfo) {
+      let newData = { ...linkVrblInfo };
 
-    // linkVrblQuery의 데이터를 사용
-    const tableData = useMemo(() => {
-        return linkVrblQuery.data?.content ?? [];
-    }, [linkVrblQuery.data]);
+      if (linkVrblInfo.mdfr_id) {
+        const userName = await fetchUserInfo();
+        newData = {
+          ...linkVrblInfo,
+          mdfr_id: userName,
+        };
+      }
 
-    const vrblCols = useMemo(
-        () =>
-            vrblColumns({
-                selectedVrblIds,
-                setSelectedVrblIds,
-            }),
-        [selectedVrblIds]
-    );
+      form.reset(newData);
+    }
+    setDialogOpen(true);
+  };
 
-    const vrblTable = useReactTable({
-        data: tableData,
-        columns: vrblCols,
-        getCoreRowModel: getCoreRowModel(),
-    });
+  const { tableComponent } = useDataTable({
+    query,
+    tableOptions: {
+      columns,
+      state: {
+        pagination,
+        rowSelection,
+      },
+      manualPagination: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setPagination,
+      onRowSelectionChange: setRowSelection,
+    },
+    dataTableOptions: {
+      onRowClick: handleRowClick,
+      viewPagination: true,
+    },
+  });
 
-    const form = useForm<LinkVrblFormData>({
-        resolver: zodResolver(linkVrblFormSchema),
-        defaultValues: {},
-    });
+  // LinkVrbl 데이터 표시 로직
+  const renderLinkVrblContent = () => {
+    if (isDBdata) {
+      return (
+        <div className="mt-14 flex flex-1 items-center justify-center text-3xl text-gray-500">
+          변수를 지원하지 않는 연계 데이터입니다.
+        </div>
+      );
+    }
 
-    const handleRowClick = async (link: Link) => {
-        setSelectedLink({
-            linkSn: link.link_sn,
-            linkNm: link.link_nm,
-        });
+    if (!selectedLink.linkSn) {
+      return (
+        <div className="mt-14 flex flex-1 items-center justify-center text-3xl text-gray-500">
+          연계 데이터를 선택해주세요.
+        </div>
+      );
+    }
 
-        setSelectedVrblIds([]);
-
-        if (dbIdList.includes(link.link_clsf_cd)) {
-            setIsDBData(true);
-        } else {
-            setIsDBData(false);
-        }
-    };
-
-    const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault();
-
-        setSelectedLink({
-            linkSn: '',
-            linkNm: ''
-        });
-
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn,
-            linkNm
-        });
-    };
-
-    const fetchUserInfo = async () => {
-        const userData = await getUserInfo();
-        return userData.userName;
-    };
-
-    const handleDeleteParam = async () => {
-        if (selectedVrblIds.length === 0) {
-            alert('삭제할 파라미터를 선택해 주세요.');
-        } else {
-            await handleConfirm(async () => {
-                if (await confirm('선택한 파라미터 정보를 삭제하시겠습니까?')) {
-                    deleteLinkVrbl(selectedVrblIds);
-                }
-            });
-        }
-    };
-
-    const handleVrblRowClick = async (data: LinkVrbl) => {
-        const linkVrblInfo = await LinkApi.getLinkVrblInfo(data.link_vrbl_sn);
-
-        if (linkVrblInfo) {
-            let newData = { ...linkVrblInfo };
-
-            if (linkVrblInfo.mdfr_id) {
-                const userName = await fetchUserInfo();
-                newData = {
-                    ...linkVrblInfo,
-                    mdfr_id: userName,
-                };
-            }
-
-            form.reset(newData);
-        }
-        setDialogOpen(true);
-    };
-
-    const { tableComponent } = useDataTable({
-        query,
-        tableOptions: {
-            columns,
-            state: {
-                pagination,
-                rowSelection,
-            },
-            manualPagination: true,
-            enableMultiRowSelection: true,
-            getCoreRowModel: getCoreRowModel(),
-            onPaginationChange: setPagination,
-            onRowSelectionChange: setRowSelection,
-        },
-        dataTableOptions: {
-            onRowClick: handleRowClick,
-            viewPagination: true,
-        },
-    });
-
-    // LinkVrbl 데이터 표시 로직
-    const renderLinkVrblContent = () => {
-        if (isDBdata) {
-            return (
-                <div className="flex items-center justify-center mt-14 text-gray-500 text-3xl flex-1">
-                    변수를 지원하지 않는 연계 데이터입니다.
-                </div>
-            );
-        }
-
-        if (!selectedLink.linkSn) {
-            return (
-                <div className="flex items-center justify-center mt-14 text-gray-500 text-3xl flex-1">
-                    연계 데이터를 선택해주세요.
-                </div>
-            );
-        }
-
-        if (linkVrblQuery.isLoading) {
-            return (
-                <div className="[data-theme='black']:bg-transparent rounded-lg p-10 flex justify-center items-center h-full">
-                    <div className="relative size-[5rem]">
-                        <LoadingWithAnimation color="primary" />
-                    </div>
-                </div>
-            );
-        }
-
-        return (
-            <>
-                <div className="mb-2 mt-14 flex justify-end items-center flex-none">
-                    {tableData.length > 0 && (
-                        <Button color="red" className="h-[3.2rem] mr-2" type="button" onClick={handleDeleteParam}>
-                            행 삭제
-                        </Button>
-                    )}
-                    <LinkParamsDialog
-                        selectedLink={selectedLink}
-                        form={form}
-                        insertLinkVrbl={insertLinkVrbl}
-                        dialogOpen={dialogOpen}
-                        onOpenChange={setDialogOpen}
-                        updateLinkVrbl={updateLinkVrbl}
-                    />
-                </div>
-                {tableData.length > 0 ? (
-                    <div className="overflow-auto flex-1 min-h-[300px]">
-                        <DataTable table={vrblTable} onRowClick={handleVrblRowClick} />
-                    </div>
-                ) : (
-                    <div className="flex items-center justify-center h-20 text-gray-500 text-3xl">
-                        등록된 연계 변수가 없습니다.
-                    </div>
-                )}
-            </>
-        );
-    };
+    if (linkVrblQuery.isLoading) {
+      return (
+        <div className="[data-theme='black']:bg-transparent flex h-full items-center justify-center rounded-lg p-10">
+          <div className="relative size-[5rem]">
+            <LoadingWithAnimation color="primary" />
+          </div>
+        </div>
+      );
+    }
 
     return (
-        <div className="card card-border !mt-6">
-            <div className="card card-border">
-                <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
-                    <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
-                        일련번호
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-4"
-                        id="liSnSearchInput"
-                        value={linkSn}
-                        onChange={(e) => setLinkSn(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
-                        연계 명
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-2"
-                        id="liNmSearchInput"
-                        value={linkNm}
-                        onChange={(e) => setLinkNm(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Button color="green" className="h-[3.2rem]" type="button" onClick={handleResetSearchParam}>
-                        초기화
-                    </Button>
-                    <Button className="h-[3.2rem]" type="submit">
-                        조회
-                    </Button>
-                </form>
-            </div>
-            <div className="card !mb-0 flex h-[calc(100vh-28rem)] gap-5 !p-0">
-                <div className="card card-border w-1/2 !mx-0 flex flex-col">
-                    <div className="card-header">
-                        <h3 className="text-2xl font-medium text-label">연계 목록</h3>
-                    </div>
-                    <div className="card !m-[1.2rem] overflow-auto !p-0 h-full">
-                        {!query.isLoading ? (
-                            <div>{tableComponent}</div>
-                        ) : (
-                            <div className="[data-theme='black']:bg-transparent rounded-lg p-10 flex justify-center items-center h-full">
-                                <div className="relative size-[5rem]">
-                                    <LoadingWithAnimation color="primary" />
-                                </div>
-                            </div>
-                        )}
-                    </div>
-                </div>
-                <div className="card card-border w-1/2 !mx-0 flex flex-col">
-                    <div className="card-header">
-                        <h3 className="text-2xl font-medium text-label">연계 변수 정보</h3>
-                    </div>
-                    <div className="card !m-[1.2rem] !p-0 overflow-auto h-full flex flex-col">
-                        <Table variant="secondary" className="flex-none">
-                            <colgroup>
-                                <col width="20%" />
-                                <col width="80%" />
-                            </colgroup>
-                            <TableBody>
-                                <TableRow>
-                                    <TableHead>연계 일련번호</TableHead>
-                                    <TableCell>
-                                        {selectedLink.linkSn ? selectedLink.linkSn : '-'}
-                                    </TableCell>
-                                </TableRow>
-                                <TableRow>
-                                    <TableHead>연계 명</TableHead>
-                                    <TableCell>
-                                        {selectedLink.linkNm ? selectedLink.linkNm : '-'}
-                                    </TableCell>
-                                </TableRow>
-                            </TableBody>
-                        </Table>
-                        {renderLinkVrblContent()}
-                    </div>
-                </div>
-            </div>
-            <ConfirmDialog isOpen={onConfirm} />
+      <>
+        <div className="mb-2 mt-14 flex flex-none items-center justify-end">
+          {tableData.length > 0 && (
+            <Button
+              color="red"
+              className="mr-2 h-[3.2rem]"
+              type="button"
+              onClick={handleDeleteParam}
+            >
+              행 삭제
+            </Button>
+          )}
+          <LinkParamsDialog
+            selectedLink={selectedLink}
+            form={form}
+            insertLinkVrbl={insertLinkVrbl}
+            dialogOpen={dialogOpen}
+            onOpenChange={setDialogOpen}
+            updateLinkVrbl={updateLinkVrbl}
+          />
         </div>
+        {tableData.length > 0 ? (
+          <div className="min-h-[300px] flex-1 overflow-auto">
+            <DataTable table={vrblTable} onRowClick={handleVrblRowClick} />
+          </div>
+        ) : (
+          <div className="flex h-20 items-center justify-center text-3xl text-gray-500">
+            등록된 연계 변수가 없습니다.
+          </div>
+        )}
+      </>
     );
+  };
+
+  return (
+    <div className="card card-border !mt-6">
+      <div className="card card-border">
+        <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
+          <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
+            일련번호
+          </Label>
+          <Input
+            className="mr-4 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liSnSearchInput"
+            value={linkSn}
+            onChange={(e) => setLinkSn(e.target.value)}
+            autoComplete="off"
+          />
+          <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
+            연계 명
+          </Label>
+          <Input
+            className="mr-2 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liNmSearchInput"
+            value={linkNm}
+            onChange={(e) => setLinkNm(e.target.value)}
+            autoComplete="off"
+          />
+          <Button
+            color="green"
+            className="h-[3.2rem]"
+            type="button"
+            onClick={handleResetSearchParam}
+          >
+            초기화
+          </Button>
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+        </form>
+      </div>
+      <div className="card !mb-0 flex h-[calc(100vh-28rem)] gap-5 !p-0">
+        <div className="card card-border !mx-0 flex w-1/2 flex-col">
+          <div className="card-header">
+            <h3 className="text-2xl font-medium text-label">연계 목록</h3>
+          </div>
+          <div className="card !m-[1.2rem] h-full overflow-auto !p-0">
+            {!query.isLoading ? (
+              <div>{tableComponent}</div>
+            ) : (
+              <div className="[data-theme='black']:bg-transparent flex h-full items-center justify-center rounded-lg p-10">
+                <div className="relative size-[5rem]">
+                  <LoadingWithAnimation color="primary" />
+                </div>
+              </div>
+            )}
+          </div>
+        </div>
+        <div className="card card-border !mx-0 flex w-1/2 flex-col">
+          <div className="card-header">
+            <h3 className="text-2xl font-medium text-label">연계 변수 정보</h3>
+          </div>
+          <div className="card !m-[1.2rem] flex h-full flex-col overflow-auto !p-0">
+            <Table variant="secondary" className="flex-none">
+              <colgroup>
+                <col width="20%" />
+                <col width="80%" />
+              </colgroup>
+              <TableBody>
+                <TableRow>
+                  <TableHead>연계 일련번호</TableHead>
+                  <TableCell>
+                    {selectedLink.linkSn ? selectedLink.linkSn : "-"}
+                  </TableCell>
+                </TableRow>
+                <TableRow>
+                  <TableHead>연계 명</TableHead>
+                  <TableCell>
+                    {selectedLink.linkNm ? selectedLink.linkNm : "-"}
+                  </TableCell>
+                </TableRow>
+              </TableBody>
+            </Table>
+            {renderLinkVrblContent()}
+          </div>
+        </div>
+      </div>
+      <ConfirmDialog isOpen={onConfirm} />
+    </div>
+  );
 }
 
-export { LinkParamsPage };
\ No newline at end of file
+export { LinkParamsPage };
diff --git a/apps/cs/src/pages/linkStats/ui/link-stats-page.tsx b/apps/cs/src/pages/linkStats/ui/link-stats-page.tsx
index f6168ba76..19163d24c 100644
--- a/apps/cs/src/pages/linkStats/ui/link-stats-page.tsx
+++ b/apps/cs/src/pages/linkStats/ui/link-stats-page.tsx
@@ -3,376 +3,429 @@
 import { useState, useEffect, useRef } from "react";
 import dayjs from "dayjs";
 import { LinkApi, type LinkStats, type LinkSearchParam } from "@/entities/link";
-import { Button, Label, DatePicker, LoadingWithAnimation } from "@common/components";
 import {
-    Chart as ChartJS,
-    CategoryScale,
-    LinearScale,
-    PointElement,
-    LineElement,
-    Tooltip,
-    Legend,
-    type ChartOptions,
-    type Chart,
+  Button,
+  Label,
+  DatePicker,
+  LoadingWithAnimation,
+} from "@common/components";
+import {
+  Chart as ChartJS,
+  CategoryScale,
+  LinearScale,
+  PointElement,
+  LineElement,
+  Tooltip,
+  Legend,
+  type ChartOptions,
+  type Chart,
 } from "chart.js";
 import { Line } from "react-chartjs-2";
-import { getCoreRowModel, type PaginationState, type RowSelectionState, } from "@tanstack/react-table";
+import {
+  getCoreRowModel,
+  type PaginationState,
+  type RowSelectionState,
+} from "@tanstack/react-table";
 import { columns } from "@/pages/linkLog/model/table-columns";
 import { useDataTable } from "@/shared/lib";
 import { useQuery } from "@tanstack/react-query";
 
 interface LinkStatsListObject {
-    linkSuccStats: LinkStats[] | null;
-    linkFailStats: LinkStats[] | null;
+  linkSuccStats: LinkStats[] | null;
+  linkFailStats: LinkStats[] | null;
 }
 
 function LinkStatsPage() {
+  const succChartRef = useRef<Chart<"line"> | null>(null);
+  const failChartRef = useRef<Chart<"line"> | null>(null);
 
-    const succChartRef = useRef<Chart<"line"> | null>(null);
-    const failChartRef = useRef<Chart<"line"> | null>(null);
+  const [startDate, setStartDate] = useState<string>(
+    dayjs().subtract(7, "day").format("YYYY-MM-DD"),
+  );
+  const [endDate, setEndDate] = useState<string>(dayjs().format("YYYY-MM-DD"));
 
-    const [startDate, setStartDate] = useState<string>(dayjs().subtract(7, "day").format('YYYY-MM-DD'));
-    const [endDate, setEndDate] = useState<string>(dayjs().format('YYYY-MM-DD'));
+  const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
 
-    const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+  const [pagination, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 100,
+  });
 
-    const [pagination, setPagination] = useState<PaginationState>({
-        pageIndex: 0,
-        pageSize: 100,
+  const [linkStatsList, setLinkStatsList] =
+    useState<LinkStatsListObject | null>(null);
+  const [logQueryParam, setLogQueryParam] = useState<{
+    isSucc: "SUCC" | "FAIL";
+    linkSn?: string;
+    linkNm?: string;
+  } | null>(null);
+
+  const query = useQuery({
+    queryKey: [
+      `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`,
+      logQueryParam,
+      pagination,
+    ],
+    queryFn: () =>
+      LinkApi.getLinkLogList({
+        ...logQueryParam,
+        page: pagination.pageIndex,
+        size: pagination.pageSize,
+        startDate,
+        endDate,
+      }),
+    enabled: !!logQueryParam,
+  });
+
+  const { tableComponent } = useDataTable({
+    query,
+    tableOptions: {
+      columns,
+      state: {
+        pagination,
+        rowSelection,
+      },
+      manualPagination: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setPagination,
+      onRowSelectionChange: setRowSelection,
+    },
+    dataTableOptions: {
+      viewPagination: true,
+    },
+  });
+
+  const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
+    linkSn: "",
+    linkNm: "",
+    startDate: "",
+    endDate: "",
+  });
+
+  ChartJS.register(
+    LineElement,
+    CategoryScale,
+    LinearScale,
+    PointElement,
+    Tooltip,
+    Legend,
+  );
+
+  const succData = {
+    labels: linkStatsList?.linkSuccStats?.map((e) => e.link_nm),
+    datasets: [
+      {
+        label: "연계 성공",
+        data: linkStatsList?.linkSuccStats?.map((e) => e.count),
+        fill: false,
+        borderColor: "rgb(53, 162, 235)",
+        backgroundColor: "rgb(53, 162, 235)",
+        tension: 0.1,
+        pointRadius: 6,
+        pointHoverRadius: 8,
+      },
+    ],
+  };
+
+  const succOptions: ChartOptions<"line"> = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: {
+      legend: {
+        position: "top",
+      },
+    },
+    scales: {
+      y: {
+        min: 0,
+      },
+    },
+  };
+
+  const failData = {
+    labels: linkStatsList?.linkFailStats?.map((e) => e.link_nm),
+    datasets: [
+      {
+        label: "연계 실패",
+        data: linkStatsList?.linkFailStats?.map((e) => e.count),
+        fill: false,
+        borderColor: "rgb(255, 99, 132)",
+        backgroundColor: "rgb(255, 99, 132)",
+        tension: 0.1,
+        pointRadius: 6,
+        pointHoverRadius: 8,
+      },
+    ],
+  };
+
+  const failOptions: ChartOptions<"line"> = {
+    responsive: true,
+    maintainAspectRatio: false,
+    plugins: {
+      legend: {
+        position: "top",
+      },
+    },
+    scales: {
+      y: {
+        min: 0,
+      },
+    },
+  };
+
+  const handleResetSearchParam = async () => {
+    setLinkSearchParam({
+      linkSn: "",
+      linkNm: "",
+      startDate: dayjs().subtract(7, "day").format("YYYY-MM-DD"),
+      endDate: dayjs().format("YYYY-MM-DD"),
     });
 
-    const [linkStatsList, setLinkStatsList] = useState<LinkStatsListObject | null>(null);
-    const [logQueryParam, setLogQueryParam] = useState<{
-        isSucc: 'SUCC' | 'FAIL';
-        linkSn?: string;
-        linkNm?: string;
-    } | null>(null);
-
-    const query = useQuery({
-        queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkList`, logQueryParam, pagination],
-        queryFn: () =>
-            LinkApi.getLinkLogList({
-                ...logQueryParam,
-                page: pagination.pageIndex,
-                size: pagination.pageSize,
-                startDate,
-                endDate,
-            }),
-        enabled: !!logQueryParam,
+    setLogQueryParam({
+      isSucc: "SUCC",
+      linkNm: "",
+      linkSn: "",
     });
 
+    setStartDate(dayjs().subtract(7, "day").format("YYYY-MM-DD"));
+    setEndDate(dayjs().format("YYYY-MM-DD"));
 
-    const { tableComponent } = useDataTable({
-        query,
-        tableOptions: {
-            columns,
-            state: {
-                pagination,
-                rowSelection,
-            },
-            manualPagination: true,
-            enableMultiRowSelection: true,
-            getCoreRowModel: getCoreRowModel(),
-            onPaginationChange: setPagination,
-            onRowSelectionChange: setRowSelection,
-        },
-        dataTableOptions: {
-            viewPagination: true,
-        },
+    const data = await LinkApi.getLinkStatsList({
+      ...linkSearchParam,
+      linkSn: "",
+      linkNm: "",
+      startDate: dayjs().subtract(7, "day").format("YYYY-MM-DD"),
+      endDate: dayjs().format("YYYY-MM-DD"),
     });
+    setLinkStatsList(data);
+  };
 
-    const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
-        linkSn: '',
-        linkNm: '',
-        startDate: '',
-        endDate: '',
-    });
+  const handleSubmit = async (e?: React.SubmitEvent<HTMLFormElement>) => {
+    e?.preventDefault();
 
-    ChartJS.register(
-        LineElement,
-        CategoryScale,
-        LinearScale,
-        PointElement,
-        Tooltip,
-        Legend
+    if (startDate && endDate) {
+      if (startDate > endDate) {
+        alert("종료일이 시작일보다 이전일 수 없습니다.");
+        return;
+      } else {
+        const data = await LinkApi.getLinkStatsList({
+          ...linkSearchParam,
+          startDate,
+          endDate,
+        });
+        setLinkStatsList(data);
+        setLogQueryParam({
+          isSucc: "SUCC",
+          linkNm: "",
+          linkSn: "",
+        });
+        setLinkSearchParam({
+          ...linkSearchParam,
+          startDate,
+          endDate,
+        });
+      }
+    } else {
+      alert("조회 날짜를 선택해주세요.");
+      return;
+    }
+  };
+
+  const handleSuccChartClick = async (
+    event: React.MouseEvent<HTMLCanvasElement>,
+  ) => {
+    if (!succChartRef.current) return;
+
+    const chart = succChartRef.current;
+
+    const points = chart.getElementsAtEventForMode(
+      event.nativeEvent,
+      "nearest",
+      { intersect: true },
+      false,
     );
 
-    const succData = {
-        labels: linkStatsList?.linkSuccStats?.map((e) => e.link_nm),
-        datasets: [
-            {
-                label: '연계 성공',
-                data: linkStatsList?.linkSuccStats?.map((e) => e.count),
-                fill: false,
-                borderColor: 'rgb(53, 162, 235)',
-                backgroundColor: 'rgb(53, 162, 235)',
-                tension: 0.1,
-                pointRadius: 6,
-                pointHoverRadius: 8,
-            },
-        ],
+    if (points[0] && linkStatsList?.linkSuccStats) {
+      const index = points[0].index;
+      setPagination({
+        ...pagination,
+        pageIndex: 0,
+        pageSize: 100,
+      });
+      setLogQueryParam({
+        isSucc: "SUCC",
+        linkNm: linkStatsList.linkSuccStats[index]?.link_nm,
+        linkSn: linkStatsList.linkSuccStats[index]?.link_sn,
+      });
+    }
+  };
+
+  const handleFailChartClick = async (
+    event: React.MouseEvent<HTMLCanvasElement>,
+  ) => {
+    if (!failChartRef.current) return;
+
+    const chart = failChartRef.current;
+
+    const points = chart.getElementsAtEventForMode(
+      event.nativeEvent,
+      "nearest",
+      { intersect: true },
+      false,
+    );
+
+    if (points[0] && linkStatsList?.linkFailStats) {
+      const index = points[0].index;
+      setPagination({
+        ...pagination,
+        pageIndex: 0,
+        pageSize: 100,
+      });
+      setLogQueryParam({
+        isSucc: "FAIL",
+        linkNm: linkStatsList.linkFailStats[index]?.link_nm,
+        linkSn: linkStatsList.linkFailStats[index]?.link_sn,
+      });
+    }
+  };
+
+  const handleSubmitToday = async () => {
+    const data = await LinkApi.getLinkStatsList({
+      ...linkSearchParam,
+      startDate: dayjs().format("YYYY-MM-DD"),
+      endDate: dayjs().format("YYYY-MM-DD"),
+    });
+    setEndDate(dayjs().format("YYYY-MM-DD"));
+    setStartDate(dayjs().format("YYYY-MM-DD"));
+    setLinkStatsList(data);
+    setLinkSearchParam({
+      ...linkSearchParam,
+      startDate: dayjs().format("YYYY-MM-DD"),
+      endDate: dayjs().format("YYYY-MM-DD"),
+    });
+    setLogQueryParam({
+      isSucc: "SUCC",
+      linkNm: "",
+      linkSn: "",
+    });
+  };
+
+  useEffect(() => {
+    const fetchData = async () => {
+      const data = await LinkApi.getLinkStatsList({
+        ...linkSearchParam,
+        startDate,
+        endDate,
+      });
+      setLinkStatsList(data);
     };
 
-    const succOptions: ChartOptions<'line'> = {
-        responsive: true,
-        maintainAspectRatio: false,
-        plugins: {
-            legend: {
-                position: 'top',
-            },
-        },
-        scales: {
-            y: {
-                min: 0,
-            },
-        },
-    };
+    setLinkSearchParam({
+      ...linkSearchParam,
+      startDate,
+      endDate,
+    });
 
-    const failData = {
-        labels: linkStatsList?.linkFailStats?.map((e) => e.link_nm),
-        datasets: [
-            {
-                label: '연계 실패',
-                data: linkStatsList?.linkFailStats?.map((e) => e.count),
-                fill: false,
-                borderColor: 'rgb(255, 99, 132)',
-                backgroundColor: 'rgb(255, 99, 132)',
-                tension: 0.1,
-                pointRadius: 6,
-                pointHoverRadius: 8,
-            },
-        ],
-    };
+    fetchData();
+  }, []);
 
-    const failOptions: ChartOptions<'line'> = {
-        responsive: true,
-        maintainAspectRatio: false,
-        plugins: {
-            legend: {
-                position: 'top',
-            },
-        },
-        scales: {
-            y: {
-                min: 0,
-            },
-        },
-    };
-
-    const handleResetSearchParam = async () => {
-        setLinkSearchParam({
-            linkSn: '',
-            linkNm: '',
-            startDate: dayjs().subtract(7, "day").format('YYYY-MM-DD'),
-            endDate: dayjs().format('YYYY-MM-DD'),
-        });
-
-        setLogQueryParam({
-            isSucc: 'SUCC',
-            linkNm: '',
-            linkSn: '',
-        });
-
-        setStartDate(dayjs().subtract(7, "day").format('YYYY-MM-DD'));
-        setEndDate(dayjs().format('YYYY-MM-DD'));
-
-        const data = await LinkApi.getLinkStatsList({
-            ...linkSearchParam,
-            linkSn: '',
-            linkNm: '',
-            startDate: dayjs().subtract(7, "day").format('YYYY-MM-DD'),
-            endDate: dayjs().format('YYYY-MM-DD'),
-        });
-        setLinkStatsList(data);
-    };
-
-    const handleSubmit = async (e?: React.FormEvent<HTMLFormElement>) => {
-        e?.preventDefault();
-
-        if (startDate && endDate) {
-
-            if (startDate > endDate) {
-                alert('종료일이 시작일보다 이전일 수 없습니다.');
-                return;
-            } else {
-                const data = await LinkApi.getLinkStatsList({
-                    ...linkSearchParam,
-                    startDate,
-                    endDate
-                });
-                setLinkStatsList(data);
-                setLogQueryParam({
-                    isSucc: 'SUCC',
-                    linkNm: '',
-                    linkSn: '',
-                });
-                setLinkSearchParam({
-                    ...linkSearchParam,
-                    startDate,
-                    endDate
-                });
-            }
-        } else {
-            alert('조회 날짜를 선택해주세요.');
-            return;
-        }
-    };
-
-    const handleSuccChartClick = async (event: React.MouseEvent<HTMLCanvasElement>) => {
-        if (!succChartRef.current) return;
-
-        const chart = succChartRef.current;
-
-        const points = chart.getElementsAtEventForMode(
-            event.nativeEvent,
-            "nearest",
-            { intersect: true },
-            false
-        );
-
-        if (points[0] && linkStatsList?.linkSuccStats) {
-            const index = points[0].index;
-            setPagination({
-                ...pagination,
-                pageIndex: 0,
-                pageSize: 100,
-            });
-            setLogQueryParam({
-                isSucc: 'SUCC',
-                linkNm: linkStatsList.linkSuccStats[index]?.link_nm,
-                linkSn: linkStatsList.linkSuccStats[index]?.link_sn,
-            });
-        }
-    };
-
-    const handleFailChartClick = async (event: React.MouseEvent<HTMLCanvasElement>) => {
-        if (!failChartRef.current) return;
-
-        const chart = failChartRef.current;
-
-        const points = chart.getElementsAtEventForMode(
-            event.nativeEvent,
-            "nearest",
-            { intersect: true },
-            false
-        );
-
-        if (points[0] && linkStatsList?.linkFailStats) {
-            const index = points[0].index;
-            setPagination({
-                ...pagination,
-                pageIndex: 0,
-                pageSize: 100,
-            });
-            setLogQueryParam({
-                isSucc: 'FAIL',
-                linkNm: linkStatsList.linkFailStats[index]?.link_nm,
-                linkSn: linkStatsList.linkFailStats[index]?.link_sn,
-            });
-        }
-    };
-
-    const handleSubmitToday = async () => {
-        const data = await LinkApi.getLinkStatsList({
-            ...linkSearchParam,
-            startDate: dayjs().format('YYYY-MM-DD'),
-            endDate: dayjs().format('YYYY-MM-DD'),
-        });
-        setEndDate(dayjs().format('YYYY-MM-DD'));
-        setStartDate(dayjs().format('YYYY-MM-DD'));
-        setLinkStatsList(data);
-        setLinkSearchParam({
-            ...linkSearchParam,
-            startDate: dayjs().format('YYYY-MM-DD'),
-            endDate: dayjs().format('YYYY-MM-DD'),
-        });
-        setLogQueryParam({
-            isSucc: 'SUCC',
-            linkNm: '',
-            linkSn: '',
-        });
-    };
-
-    useEffect(() => {
-        const fetchData = async () => {
-            const data = await LinkApi.getLinkStatsList({
-                ...linkSearchParam,
-                startDate,
-                endDate
-            });
-            setLinkStatsList(data);
-        };
-
-        setLinkSearchParam({
-            ...linkSearchParam,
-            startDate,
-            endDate
-        });
-
-        fetchData();
-    }, []);
-
-    return (
-        <div className="card !mb-0 !min-h-[calc(100vh-16.8rem)]">
-            <div className="card card-border">
-                <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
-                    <Label htmlFor="sDateSearchInput" className="mx-2 text-label">
-                        시작일
-                    </Label>
-                    <DatePicker id="sDateSearchInput" mode={"single"} selected={dayjs(startDate).toDate()} onSelect={(e) => setStartDate(dayjs(e).format('YYYY-MM-DD'))} />
-                    <Label htmlFor="eDateSearchInput" className="mx-2 text-label">
-                        종료일
-                    </Label>
-                    <DatePicker id="eDateSearchInput" mode={"single"} className="mr-2" selected={dayjs(endDate).toDate()} onSelect={(e) => setEndDate(dayjs(e).format('YYYY-MM-DD'))} />
-                    <Button color="green" className="h-[3.2rem]" type="button" onClick={handleResetSearchParam}>
-                        초기화
-                    </Button>
-                    <Button className="h-[3.2rem]" type="submit">
-                        조회
-                    </Button>
-                    <Button className="h-[3.2rem]" type="button" onClick={handleSubmitToday}>
-                        오늘 날짜로 조회
-                    </Button>
-                </form>
-            </div>
-            <div className="card card-border">
-                <div className="card !m-[1.2rem] !p-0 flex flex-col gap-y-8">
-                    <div className="card-header">
-                        <h3 className="text-2xl font-medium text-label">조회 일자 : {`${linkSearchParam.startDate} ~ ${linkSearchParam.endDate}`}</h3>
-                    </div>
-                    <div className="h-[32rem] w-full">
-                        <Line ref={succChartRef} data={succData} options={succOptions} onClick={handleSuccChartClick} />
-                    </div>
-                    <div className="h-[32rem]">
-                        <Line ref={failChartRef} data={failData} options={failOptions} onClick={handleFailChartClick} />
-                    </div>
-                </div>
-                <div className="card !m-[1.2rem] !p-0">
-                    <div className="card-header">
-                        <h3 className="text-2xl font-medium text-label">
-                            {logQueryParam?.linkNm ? `${logQueryParam.linkNm} 연계 ${logQueryParam.isSucc === 'FAIL' ? '실패' : '성공'} 로그 목록 (${linkSearchParam.startDate} ~ ${linkSearchParam.endDate}) - ${query.data?.totalElements.toLocaleString('ko-KR') ?? 0}건` : '로그 목록'}
-                        </h3>
-                    </div>
-                    <div className="card !m-[1.2rem] h-[40rem] overflow-auto !p-0">
-                        {logQueryParam?.linkNm ?
-                            query.isLoading ?
-                                <div className="[data-theme='black']:bg-transparent rounded-lg p-10 h-full flex justify-center items-center">
-                                    <div className="relative size-[5rem]">
-                                        <LoadingWithAnimation color="primary" />
-                                    </div>
-                                </div>
-                                :
-                                <div>{tableComponent}</div>
-                            :
-                            <div className="flex items-center justify-center h-full text-gray-500 text-3xl">
-                                차트 데이터를 선택해주세요.
-                            </div>
-                        }
-                    </div>
-                </div>
-            </div>
+  return (
+    <div className="card !mb-0 !min-h-[calc(100vh-16.8rem)]">
+      <div className="card card-border">
+        <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
+          <Label htmlFor="sDateSearchInput" className="mx-2 text-label">
+            시작일
+          </Label>
+          <DatePicker
+            id="sDateSearchInput"
+            mode={"single"}
+            selected={dayjs(startDate).toDate()}
+            onSelect={(e) => setStartDate(dayjs(e).format("YYYY-MM-DD"))}
+          />
+          <Label htmlFor="eDateSearchInput" className="mx-2 text-label">
+            종료일
+          </Label>
+          <DatePicker
+            id="eDateSearchInput"
+            mode={"single"}
+            className="mr-2"
+            selected={dayjs(endDate).toDate()}
+            onSelect={(e) => setEndDate(dayjs(e).format("YYYY-MM-DD"))}
+          />
+          <Button
+            color="green"
+            className="h-[3.2rem]"
+            type="button"
+            onClick={handleResetSearchParam}
+          >
+            초기화
+          </Button>
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+          <Button
+            className="h-[3.2rem]"
+            type="button"
+            onClick={handleSubmitToday}
+          >
+            오늘 날짜로 조회
+          </Button>
+        </form>
+      </div>
+      <div className="card card-border">
+        <div className="card !m-[1.2rem] flex flex-col gap-y-8 !p-0">
+          <div className="card-header">
+            <h3 className="text-2xl font-medium text-label">
+              조회 일자 :{" "}
+              {`${linkSearchParam.startDate} ~ ${linkSearchParam.endDate}`}
+            </h3>
+          </div>
+          <div className="h-[32rem] w-full">
+            <Line
+              ref={succChartRef}
+              data={succData}
+              options={succOptions}
+              onClick={handleSuccChartClick}
+            />
+          </div>
+          <div className="h-[32rem]">
+            <Line
+              ref={failChartRef}
+              data={failData}
+              options={failOptions}
+              onClick={handleFailChartClick}
+            />
+          </div>
         </div>
-    )
-};
+        <div className="card !m-[1.2rem] !p-0">
+          <div className="card-header">
+            <h3 className="text-2xl font-medium text-label">
+              {logQueryParam?.linkNm
+                ? `${logQueryParam.linkNm} 연계 ${logQueryParam.isSucc === "FAIL" ? "실패" : "성공"} 로그 목록 (${linkSearchParam.startDate} ~ ${linkSearchParam.endDate}) - ${query.data?.totalElements.toLocaleString("ko-KR") ?? 0}건`
+                : "로그 목록"}
+            </h3>
+          </div>
+          <div className="card !m-[1.2rem] h-[40rem] overflow-auto !p-0">
+            {logQueryParam?.linkNm ? (
+              query.isLoading ? (
+                <div className="[data-theme='black']:bg-transparent flex h-full items-center justify-center rounded-lg p-10">
+                  <div className="relative size-[5rem]">
+                    <LoadingWithAnimation color="primary" />
+                  </div>
+                </div>
+              ) : (
+                <div>{tableComponent}</div>
+              )
+            ) : (
+              <div className="flex h-full items-center justify-center text-3xl text-gray-500">
+                차트 데이터를 선택해주세요.
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
 
-export { LinkStatsPage };
\ No newline at end of file
+export { LinkStatsPage };
diff --git a/apps/cs/src/pages/linkTable/ui/link-table-page.tsx b/apps/cs/src/pages/linkTable/ui/link-table-page.tsx
index 0394e7bf6..3ccee78e8 100644
--- a/apps/cs/src/pages/linkTable/ui/link-table-page.tsx
+++ b/apps/cs/src/pages/linkTable/ui/link-table-page.tsx
@@ -1,20 +1,35 @@
-'use client';
+"use client";
 
 import { useState, useMemo } from "react";
 import {
-    Button,
-    DataTable,
-    Input,
-    Label,
-    Table,
-    TableBody,
-    TableCell,
-    TableHead,
-    TableRow,
-    LoadingWithAnimation,
+  Button,
+  DataTable,
+  Input,
+  Label,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  LoadingWithAnimation,
 } from "@common/components";
-import { getCoreRowModel, type PaginationState, type RowSelectionState, useReactTable } from "@tanstack/react-table";
-import { LinkApi, type Link, type LinkSearchParam, type LinkTable, type LinkTableColumns, type LinkTableColData, type LinkTableFormData, LinkTableColumnsSchema, LinkTableSchema } from "@/entities/link";
+import {
+  getCoreRowModel,
+  type PaginationState,
+  type RowSelectionState,
+  useReactTable,
+} from "@tanstack/react-table";
+import {
+  LinkApi,
+  type Link,
+  type LinkSearchParam,
+  type LinkTable,
+  type LinkTableColumns,
+  type LinkTableColData,
+  type LinkTableFormData,
+  LinkTableColumnsSchema,
+  LinkTableSchema,
+} from "@/entities/link";
 import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
 import { columns } from "../../linkParams/model/table-columns";
 import { tableColumns } from "../model/table-columns";
@@ -31,680 +46,778 @@ import { FormItem, FormControl, FormField, Form } from "@/shared/ui/form";
 import { useDataTable } from "@/shared/lib";
 
 function LinkTablePage() {
-    const queryClient = useQueryClient();
+  const queryClient = useQueryClient();
 
-    const userUniqId = getCookie(AUTH_USER_ID) ?? "";
+  const userUniqId = getCookie(AUTH_USER_ID) ?? "";
 
-    const [linkSn, setLinkSn] = useState<string>('');
-    const [linkNm, setLinkNm] = useState<string>('');
+  const [linkSn, setLinkSn] = useState<string>("");
+  const [linkNm, setLinkNm] = useState<string>("");
 
-    const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
-        linkSn: '',
-        linkNm: ''
-    });
+  const [linkSearchParam, setLinkSearchParam] = useState<LinkSearchParam>({
+    linkSn: "",
+    linkNm: "",
+  });
 
-    const [selectedTableInfo, setSelectedTableInfo] = useState<LinkTable | null>(null);
-    const [tableColList, setTableColList] = useState<LinkTableColumns[]>([]);
-    const [dialogOpen, setDialogOpen] = useState<boolean>(false);
-    const [selectedColIds, setSelectedColIds] = useState<string[]>([]);
+  const [selectedTableInfo, setSelectedTableInfo] = useState<LinkTable | null>(
+    null,
+  );
+  const [tableColList, setTableColList] = useState<LinkTableColumns[]>([]);
+  const [dialogOpen, setDialogOpen] = useState<boolean>(false);
+  const [selectedColIds, setSelectedColIds] = useState<string[]>([]);
 
-    const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+  const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
 
-    const [pagination, setPagination] = useState<PaginationState>({
-        pageIndex: 0,
-        pageSize: 100,
-    });
+  const [pagination, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 100,
+  });
 
-    const { setMessage: alert } = useAlertStore((state) => state);
+  const { setMessage: alert } = useAlertStore((state) => state);
 
-    const { confirm } = useConfirm();
-    const [onConfirm, setOnConfirm] = useState<boolean>(false);
+  const { confirm } = useConfirm();
+  const [onConfirm, setOnConfirm] = useState<boolean>(false);
 
-    const handleConfirm = async (callback: () => Promise<void>) => {
-        setOnConfirm(true);
-        await callback();
-        setOnConfirm(false);
-    };
+  const handleConfirm = async (callback: () => Promise<void>) => {
+    setOnConfirm(true);
+    await callback();
+    setOnConfirm(false);
+  };
 
-    const query = useQuery({
-        queryKey: ['/api/link/getLinkList', linkSearchParam],
-        queryFn: () => LinkApi.getLinkList({
-            ...linkSearchParam,
-            page: pagination.pageIndex,
-            size: pagination.pageSize,
-        }),
-    });
+  const query = useQuery({
+    queryKey: ["/api/link/getLinkList", linkSearchParam],
+    queryFn: () =>
+      LinkApi.getLinkList({
+        ...linkSearchParam,
+        page: pagination.pageIndex,
+        size: pagination.pageSize,
+      }),
+  });
 
-    const { mutateAsync: insertLinkTableCol } = useMutation({
-        mutationFn: async (data: LinkTableColData) => await LinkApi.insertLinkTableCol({
-            ...data,
-            mdfr_id: userUniqId,
-        }),
-        onSuccess: async () => {
-            if (selectedTableInfo) {
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`]
-                });
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`]
-                });
-
-                const tableData = await LinkApi.getLinkTableInfo(selectedTableInfo.link_sn);
-                const tableColList = await LinkApi.getLinkTableColList(selectedTableInfo.link_sn);
-
-                setSelectedTableInfo(tableData);
-                setTableColList(tableColList.content);
-                setSelectedColIds([]);
-                setDialogOpen(false);
-                alert('저장되었습니다.');
-            }
-        }
-    });
-
-    const { mutateAsync: updateLinkTableCol } = useMutation({
-        mutationFn: async (data: LinkTableColData) => await LinkApi.updateLinkTableCol({
-            ...data,
-            mdfr_id: userUniqId,
-        }),
-        onSuccess: async () => {
-            if (selectedTableInfo) {
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`]
-                });
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`]
-                });
-
-                const tableData = await LinkApi.getLinkTableInfo(selectedTableInfo.link_sn);
-                const tableColList = await LinkApi.getLinkTableColList(selectedTableInfo.link_sn);
-
-                setSelectedTableInfo(tableData);
-                setTableColList(tableColList.content);
-                setSelectedColIds([]);
-                setDialogOpen(false);
-                alert('수정되었습니다.');
-            }
-        }
-    });
-
-    const { mutateAsync: deleteLinkTableCol } = useMutation({
-        mutationFn: async (data: string[]) => await LinkApi.deleteLinkTableCol(data),
-        onSuccess: async () => {
-            if (selectedTableInfo) {
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`]
-                });
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`]
-                });
-
-                const tableData = await LinkApi.getLinkTableInfo(selectedTableInfo.link_sn);
-                const tableColList = await LinkApi.getLinkTableColList(selectedTableInfo.link_sn);
-
-                setSelectedTableInfo(tableData);
-                setTableColList(tableColList.content);
-                setSelectedColIds([]);
-                setDialogOpen(false);
-                alert('삭제되었습니다.');
-            }
-        }
-    });
-
-    const { mutateAsync: insertLinkTableInfo } = useMutation({
-        mutationFn: async (data: LinkTableFormData) => await LinkApi.insertLinkTableInfo(data),
-        onSuccess: async () => {
-            if (selectedTableInfo) {
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`]
-                });
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`]
-                });
-
-                const tableData = await LinkApi.getLinkTableInfo(selectedTableInfo.link_sn);
-                const tableColList = await LinkApi.getLinkTableColList(selectedTableInfo.link_sn);
-
-                tableForm.reset({
-                    link_sn: tableData.link_sn,
-                    link_nm: tableData.link_nm,
-                    tbl_sn: tableData.tbl_sn ?? "",
-                    sou_tbl_nm: tableData.sou_tbl_nm ?? "",
-                    sou_tbl_korn_nm: tableData.sou_tbl_korn_nm ?? "",
-                    sou_tbl_expln: tableData.sou_tbl_expln ?? "",
-                    trsf_tbl_expln: tableData.trsf_tbl_expln ?? "",
-                    trsf_tbl_nm: tableData.trsf_tbl_nm ?? "",
-                    trsf_tbl_korn_nm: tableData.trsf_tbl_korn_nm ?? "",
-                });
-                setSelectedTableInfo(tableData);
-                setTableColList(tableColList.content);
-                setSelectedColIds([]);
-                alert('저장되었습니다.');
-            }
-        }
-    });
-
-    const { mutateAsync: updateLinkTableInfo } = useMutation({
-        mutationFn: async (data: LinkTableFormData) => await LinkApi.updateLinkTableInfo(data),
-        onSuccess: async () => {
-            if (selectedTableInfo) {
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`]
-                });
-                await queryClient.invalidateQueries({
-                    queryKey: [`${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`]
-                });
-                
-                const tableData = await LinkApi.getLinkTableInfo(selectedTableInfo.link_sn);
-                const tableColList = await LinkApi.getLinkTableColList(selectedTableInfo.link_sn);
-
-                setSelectedTableInfo(tableData);
-                setTableColList(tableColList.content);
-                setSelectedColIds([]);
-                alert('수정되었습니다.');
-            }
-        }
-    });
-
-    const tableCol = useMemo(
-        () =>
-            tableColumns({ selectedColIds, setSelectedColIds }),
-        [selectedColIds]
-    );
-
-    const colTable = useReactTable({
-        data: tableColList,
-        columns: tableCol,
-        getCoreRowModel: getCoreRowModel(),
-    });
-
-    const form = useForm<LinkTableColData>({
-        resolver: zodResolver(LinkTableColumnsSchema),
-        defaultValues: {
-            pk_yn: "N"
-        }
-    });
-
-    const tableForm = useForm<LinkTableFormData>({
-        resolver: zodResolver(LinkTableSchema),
-        defaultValues: {},
-    });
-
-    const handleResetSearchParam = async () => {
-        setSelectedTableInfo(null);
-        setTableColList([]);
-        setLinkSn('');
-        setLinkNm('');
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn: '',
-            linkNm: '',
+  const { mutateAsync: insertLinkTableCol } = useMutation({
+    mutationFn: async (data: LinkTableColData) =>
+      await LinkApi.insertLinkTableCol({
+        ...data,
+        mdfr_id: userUniqId,
+      }),
+    onSuccess: async () => {
+      if (selectedTableInfo) {
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`,
+          ],
         });
-    };
-
-    const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
-        e.preventDefault();
-        setSelectedTableInfo(null);
-        setTableColList([]);
-
-        setLinkSearchParam({
-            ...linkSearchParam,
-            linkSn,
-            linkNm
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`,
+          ],
         });
-    };
 
-    const handleRowClick = async (data: Link) => {
-        const tableData = await LinkApi.getLinkTableInfo(data.link_sn);
-        const tableColList = await LinkApi.getLinkTableColList(data.link_sn);
+        const tableData = await LinkApi.getLinkTableInfo(
+          selectedTableInfo.link_sn,
+        );
+        const tableColList = await LinkApi.getLinkTableColList(
+          selectedTableInfo.link_sn,
+        );
 
         setSelectedTableInfo(tableData);
         setTableColList(tableColList.content);
         setSelectedColIds([]);
+        setDialogOpen(false);
+        alert("저장되었습니다.");
+      }
+    },
+  });
+
+  const { mutateAsync: updateLinkTableCol } = useMutation({
+    mutationFn: async (data: LinkTableColData) =>
+      await LinkApi.updateLinkTableCol({
+        ...data,
+        mdfr_id: userUniqId,
+      }),
+    onSuccess: async () => {
+      if (selectedTableInfo) {
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`,
+          ],
+        });
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`,
+          ],
+        });
+
+        const tableData = await LinkApi.getLinkTableInfo(
+          selectedTableInfo.link_sn,
+        );
+        const tableColList = await LinkApi.getLinkTableColList(
+          selectedTableInfo.link_sn,
+        );
+
+        setSelectedTableInfo(tableData);
+        setTableColList(tableColList.content);
+        setSelectedColIds([]);
+        setDialogOpen(false);
+        alert("수정되었습니다.");
+      }
+    },
+  });
+
+  const { mutateAsync: deleteLinkTableCol } = useMutation({
+    mutationFn: async (data: string[]) =>
+      await LinkApi.deleteLinkTableCol(data),
+    onSuccess: async () => {
+      if (selectedTableInfo) {
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`,
+          ],
+        });
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`,
+          ],
+        });
+
+        const tableData = await LinkApi.getLinkTableInfo(
+          selectedTableInfo.link_sn,
+        );
+        const tableColList = await LinkApi.getLinkTableColList(
+          selectedTableInfo.link_sn,
+        );
+
+        setSelectedTableInfo(tableData);
+        setTableColList(tableColList.content);
+        setSelectedColIds([]);
+        setDialogOpen(false);
+        alert("삭제되었습니다.");
+      }
+    },
+  });
+
+  const { mutateAsync: insertLinkTableInfo } = useMutation({
+    mutationFn: async (data: LinkTableFormData) =>
+      await LinkApi.insertLinkTableInfo(data),
+    onSuccess: async () => {
+      if (selectedTableInfo) {
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`,
+          ],
+        });
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`,
+          ],
+        });
+
+        const tableData = await LinkApi.getLinkTableInfo(
+          selectedTableInfo.link_sn,
+        );
+        const tableColList = await LinkApi.getLinkTableColList(
+          selectedTableInfo.link_sn,
+        );
 
         tableForm.reset({
-            link_sn: tableData.link_sn,
-            link_nm: tableData.link_nm,
-            tbl_sn: tableData.tbl_sn ?? "",
-            sou_tbl_nm: tableData.sou_tbl_nm ?? "",
-            sou_tbl_korn_nm: tableData.sou_tbl_korn_nm ?? "",
-            sou_tbl_expln: tableData.sou_tbl_expln ?? "",
-            trsf_tbl_expln: tableData.trsf_tbl_expln ?? "",
-            trsf_tbl_nm: tableData.trsf_tbl_nm ?? "",
-            trsf_tbl_korn_nm: tableData.trsf_tbl_korn_nm ?? "",
+          link_sn: tableData.link_sn,
+          link_nm: tableData.link_nm,
+          tbl_sn: tableData.tbl_sn ?? "",
+          sou_tbl_nm: tableData.sou_tbl_nm ?? "",
+          sou_tbl_korn_nm: tableData.sou_tbl_korn_nm ?? "",
+          sou_tbl_expln: tableData.sou_tbl_expln ?? "",
+          trsf_tbl_expln: tableData.trsf_tbl_expln ?? "",
+          trsf_tbl_nm: tableData.trsf_tbl_nm ?? "",
+          trsf_tbl_korn_nm: tableData.trsf_tbl_korn_nm ?? "",
         });
-    };
+        setSelectedTableInfo(tableData);
+        setTableColList(tableColList.content);
+        setSelectedColIds([]);
+        alert("저장되었습니다.");
+      }
+    },
+  });
 
-    const handleColumnRowClick = async (data: LinkTableColumns) => {
-        const colInfo = await LinkApi.getLinkTableColInfo({ colSn: data.col_sn, tblSn: data.tbl_sn });
+  const { mutateAsync: updateLinkTableInfo } = useMutation({
+    mutationFn: async (data: LinkTableFormData) =>
+      await LinkApi.updateLinkTableInfo(data),
+    onSuccess: async () => {
+      if (selectedTableInfo) {
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableInfo`,
+          ],
+        });
+        await queryClient.invalidateQueries({
+          queryKey: [
+            `${process.env.NEXT_PUBLIC_LINK_BACKEND_API_HOST}/getLinkTableColList`,
+          ],
+        });
 
-        if (colInfo) {
-            let newData = { ...colInfo };
+        const tableData = await LinkApi.getLinkTableInfo(
+          selectedTableInfo.link_sn,
+        );
+        const tableColList = await LinkApi.getLinkTableColList(
+          selectedTableInfo.link_sn,
+        );
 
-            if (colInfo.mdfr_id) {
-                const userName = await fetchUserInfo();
-                newData = {
-                    ...colInfo,
-                    mdfr_id: userName,
-                };
-            }
+        setSelectedTableInfo(tableData);
+        setTableColList(tableColList.content);
+        setSelectedColIds([]);
+        alert("수정되었습니다.");
+      }
+    },
+  });
 
-            form.reset(newData);
+  const tableCol = useMemo(
+    () => tableColumns({ selectedColIds, setSelectedColIds }),
+    [selectedColIds],
+  );
 
-        }
-        setDialogOpen(true)
-    };
+  const colTable = useReactTable({
+    data: tableColList,
+    columns: tableCol,
+    getCoreRowModel: getCoreRowModel(),
+  });
 
-    const fetchUserInfo = async () => {
-        const userData = await getUserInfo();
-        return userData.userName;
-    };
+  const form = useForm<LinkTableColData>({
+    resolver: zodResolver(LinkTableColumnsSchema),
+    defaultValues: {
+      pk_yn: "N",
+    },
+  });
 
-    const handleDeleteParam = async () => {
-        if (selectedColIds.length === 0) {
-            alert('삭제할 컬럼을 선택해 주세요.');
-        } else {
-            await handleConfirm(async () => {
-                if (await confirm('선택한 컬럼 정보를 삭제하시겠습니까?')) {
-                    deleteLinkTableCol(selectedColIds);
-                }
-            });
-        }
-    };
+  const tableForm = useForm<LinkTableFormData>({
+    resolver: zodResolver(LinkTableSchema),
+    defaultValues: {},
+  });
 
-    const handleTableSubmit = async (data: LinkTableFormData) => {
-        const regTblInfo = await LinkApi.countLinkTblNm(data.trsf_tbl_nm);
-        const confirmMsg = (regTblInfo.count > 0 && data.trsf_tbl_nm !== selectedTableInfo?.trsf_tbl_nm) ? `이미 사용중인 테이블 명입니다. 해당 테이블 명으로 ${!data.tbl_sn ? '저장' : '수정'}하시겠습니까?` : `${!data.tbl_sn ? '저장' : '수정'}하시겠습니까?`;
-        if (!data.tbl_sn) {
-            await handleConfirm(async () => {
-                if (await confirm(confirmMsg)) {
-                    insertLinkTableInfo({
-                        ...data,
-                        mdfr_id: userUniqId,
-                        tbl_sn: (regTblInfo.count > 0) ? regTblInfo.tbl_sn : "",
-                    });
-                }
-            });
-        } else {
-            await handleConfirm(async () => {
-                if (await confirm(confirmMsg)) {
-                    updateLinkTableInfo({
-                        ...data,
-                        tbl_sn: (regTblInfo.count > 0) ? regTblInfo.tbl_sn : "",
-                        mdfr_id: userUniqId,
-                    });
-                }
-            });
-        }
+  const handleResetSearchParam = async () => {
+    setSelectedTableInfo(null);
+    setTableColList([]);
+    setLinkSn("");
+    setLinkNm("");
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn: "",
+      linkNm: "",
+    });
+  };
 
-    };
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
+    e.preventDefault();
+    setSelectedTableInfo(null);
+    setTableColList([]);
 
-    const { tableComponent } = useDataTable({
-        query,
-        tableOptions: {
-            columns,
-            state: {
-                pagination,
-                rowSelection,
-            },
-            manualPagination: true,
-            enableMultiRowSelection: true,
-            getCoreRowModel: getCoreRowModel(),
-            onPaginationChange: setPagination,
-            onRowSelectionChange: setRowSelection,
-        },
-        dataTableOptions: {
-            onRowClick: handleRowClick,
-            viewPagination: true,
-        },
+    setLinkSearchParam({
+      ...linkSearchParam,
+      linkSn,
+      linkNm,
+    });
+  };
+
+  const handleRowClick = async (data: Link) => {
+    const tableData = await LinkApi.getLinkTableInfo(data.link_sn);
+    const tableColList = await LinkApi.getLinkTableColList(data.link_sn);
+
+    setSelectedTableInfo(tableData);
+    setTableColList(tableColList.content);
+    setSelectedColIds([]);
+
+    tableForm.reset({
+      link_sn: tableData.link_sn,
+      link_nm: tableData.link_nm,
+      tbl_sn: tableData.tbl_sn ?? "",
+      sou_tbl_nm: tableData.sou_tbl_nm ?? "",
+      sou_tbl_korn_nm: tableData.sou_tbl_korn_nm ?? "",
+      sou_tbl_expln: tableData.sou_tbl_expln ?? "",
+      trsf_tbl_expln: tableData.trsf_tbl_expln ?? "",
+      trsf_tbl_nm: tableData.trsf_tbl_nm ?? "",
+      trsf_tbl_korn_nm: tableData.trsf_tbl_korn_nm ?? "",
+    });
+  };
+
+  const handleColumnRowClick = async (data: LinkTableColumns) => {
+    const colInfo = await LinkApi.getLinkTableColInfo({
+      colSn: data.col_sn,
+      tblSn: data.tbl_sn,
     });
 
-    return (
-        <div className="card card-border !mt-6">
-            <div className="card card-border">
-                <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
-                    <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
-                        일련번호
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-4"
-                        id="liSnSearchInput"
-                        value={linkSn}
-                        onChange={(e) => setLinkSn(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
-                        연계 명
-                    </Label>
-                    <Input
-                        className="h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem] mr-2"
-                        id="liNmSearchInput"
-                        value={linkNm}
-                        onChange={(e) => setLinkNm(e.target.value)}
-                        autoComplete="off"
-                    />
-                    <Button color="green" className="h-[3.2rem]" type="button" onClick={handleResetSearchParam}>
-                        초기화
-                    </Button>
-                    <Button className="h-[3.2rem]" type="submit">
-                        조회
-                    </Button>
-                </form>
-            </div>
-            <div className="card !mb-0 flex h-[calc(100vh-28rem)] gap-5 !p-0">
-                <div className="card card-border w-1/2 !mx-0 flex flex-col">
-                    <div className="card-header">
-                        <h3 className="text-2xl font-medium text-label">연계 목록</h3>
-                    </div>
-                    <div className="card !m-[1.2rem] overflow-auto !p-0 h-full">
-                        {!query.isLoading ?
-                            <div>{tableComponent}</div>
-                            :
-                            <div className="[data-theme='black']:bg-transparent rounded-lg p-10 flex justify-center items-center h-full">
-                                <div className="relative size-[5rem]">
-                                    <LoadingWithAnimation color="primary" />
-                                </div>
-                            </div>
-                        }
-                    </div>
-                </div>
-                <div className="card card-border w-1/2 !mx-0 flex flex-col">
-                    <div className="card-header">
-                        <h3 className="text-2xl font-medium text-label">연계 테이블 정보</h3>
-                    </div>
-                    <div className="card !m-[1.2rem] !p-0 h-full overflow-auto flex flex-col">
-                        <Form {...tableForm}>
-                            <form onSubmit={tableForm.handleSubmit(handleTableSubmit)}>
-                                {selectedTableInfo &&
-                                    <div className="flex justify-end mb-2">
-                                        <Button className="h-[3.2rem]" type="submit" color={selectedTableInfo.tbl_sn ? "green" : "primary"}>
-                                            {selectedTableInfo.tbl_sn ? "수정" : "저장"}
-                                        </Button>
-                                    </div>
-                                }
-                                <Table variant="secondary" className="flex-none">
-                                    <colgroup>
-                                        <col width="20%" />
-                                        <col width="80%" />
-                                    </colgroup>
-                                    <TableBody>
-                                        <TableRow>
-                                            <TableHead>연계 일련번호</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="link_sn"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        disabled
-                                                                    />
-                                                                </FormControl>
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>연계 명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="link_nm"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        disabled
-                                                                    />
-                                                                </FormControl>
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>원천 테이블 명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="sou_tbl_nm"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        placeholder={!field.value ? "-" : ""}
-                                                                        autoComplete="off"
-                                                                    />
-                                                                </FormControl>
-                                                                {tableForm.formState.errors.sou_tbl_nm && (
-                                                                    <p className="text-red-500 text-base pt-2">
-                                                                        {tableForm.formState.errors.sou_tbl_nm.message}
-                                                                    </p>
-                                                                )}
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>원천 테이블 한글명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="sou_tbl_korn_nm"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        placeholder={!field.value ? "-" : ""}
-                                                                        autoComplete="off"
-                                                                    />
-                                                                </FormControl>
-                                                                {tableForm.formState.errors.sou_tbl_korn_nm && (
-                                                                    <p className="text-red-500 text-base pt-2">
-                                                                        {tableForm.formState.errors.sou_tbl_korn_nm.message}
-                                                                    </p>
-                                                                )}
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>원천 테이블 설명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="sou_tbl_expln"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        placeholder={!field.value ? "-" : ""}
-                                                                        autoComplete="off"
-                                                                    />
-                                                                </FormControl>
-                                                                {tableForm.formState.errors.sou_tbl_expln && (
-                                                                    <p className="text-red-500 text-base pt-2">
-                                                                        {tableForm.formState.errors.sou_tbl_expln.message}
-                                                                    </p>
-                                                                )}
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>* 변환 테이블 명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="trsf_tbl_nm"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        placeholder={!field.value ? "-" : ""}
-                                                                        autoComplete="off"
-                                                                    />
-                                                                </FormControl>
-                                                                {tableForm.formState.errors.trsf_tbl_nm && (
-                                                                    <p className="text-red-500 text-base pt-2">
-                                                                        {tableForm.formState.errors.trsf_tbl_nm.message}
-                                                                    </p>
-                                                                )}
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>* 변환 테이블 한글명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="trsf_tbl_korn_nm"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        placeholder={!field.value ? "-" : ""}
-                                                                        autoComplete="off"
-                                                                    />
-                                                                </FormControl>
-                                                                {tableForm.formState.errors.trsf_tbl_korn_nm && (
-                                                                    <p className="text-red-500 text-base pt-2">
-                                                                        {tableForm.formState.errors.trsf_tbl_korn_nm.message}
-                                                                    </p>
-                                                                )}
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                        <TableRow>
-                                            <TableHead>변환 테이블 설명</TableHead>
-                                            <TableCell className="!p-2">
-                                                {selectedTableInfo ?
-                                                    <FormField
-                                                        control={tableForm.control}
-                                                        name="trsf_tbl_expln"
-                                                        render={({ field }) => (
-                                                            <FormItem>
-                                                                <FormControl>
-                                                                    <Input
-                                                                        {...field}
-                                                                        value={field.value ?? ""}
-                                                                        className="!text-[1.3rem] w-[400px]"
-                                                                        placeholder={!field.value ? "-" : ""}
-                                                                        autoComplete="off"
-                                                                    />
-                                                                </FormControl>
-                                                                {tableForm.formState.errors.trsf_tbl_expln && (
-                                                                    <p className="text-red-500 text-base pt-2">
-                                                                        {tableForm.formState.errors.trsf_tbl_expln.message}
-                                                                    </p>
-                                                                )}
-                                                            </FormItem>
-                                                        )}
-                                                    />
-                                                    :
-                                                    <span className="px-2 py-[1.2rem]">-</span>
-                                                }
-                                            </TableCell>
-                                        </TableRow>
-                                    </TableBody>
-                                </Table>
-                            </form>
-                        </Form>
-                        {selectedTableInfo ?
-                            <>
-                                <div className="mb-2 mt-14 flex justify-end items-center flex-none">
-                                    {tableColList.length > 0 &&
-                                        <Button color="red" className="h-[3.2rem] mr-2" type="button" onClick={handleDeleteParam}>
-                                            행 삭제
-                                        </Button>
-                                    }
-                                    {selectedTableInfo.tbl_sn &&
-                                        <LinkTableDialog dialogOpen={dialogOpen} onOpenChange={setDialogOpen} form={form} tableInfo={selectedTableInfo} insertLinkTableCol={insertLinkTableCol} updateLinkTableCol={updateLinkTableCol} />
-                                    }
-                                </div>
-                                {selectedTableInfo.tbl_sn ?
-                                    (tableColList.length > 0 ?
-                                        <div className="flex-1 overflow-auto min-h-[300px]">
-                                            <DataTable table={colTable} onRowClick={handleColumnRowClick} />
-                                        </div>
-                                        :
-                                        <div className="flex items-center justify-center h-20 text-gray-500 text-3xl">
-                                            등록된 테이블 컬럼이 없습니다.
-                                        </div>)
-                                    :
-                                    <div className="flex items-center justify-center h-20 text-gray-500 text-3xl">
-                                        테이블 정보를 등록해주세요.
-                                    </div>
-                                }
-                            </>
-                            :
-                            <div className="flex items-center justify-center text-gray-500 text-3xl mt-14 flex-1">
-                                연계 데이터를 선택해주세요.
-                            </div>
-                        }
-                    </div>
-                </div>
-            </div>
-            <ConfirmDialog isOpen={onConfirm} />
-        </div >
-    )
-};
+    if (colInfo) {
+      let newData = { ...colInfo };
 
-export { LinkTablePage };
\ No newline at end of file
+      if (colInfo.mdfr_id) {
+        const userName = await fetchUserInfo();
+        newData = {
+          ...colInfo,
+          mdfr_id: userName,
+        };
+      }
+
+      form.reset(newData);
+    }
+    setDialogOpen(true);
+  };
+
+  const fetchUserInfo = async () => {
+    const userData = await getUserInfo();
+    return userData.userName;
+  };
+
+  const handleDeleteParam = async () => {
+    if (selectedColIds.length === 0) {
+      alert("삭제할 컬럼을 선택해 주세요.");
+    } else {
+      await handleConfirm(async () => {
+        if (await confirm("선택한 컬럼 정보를 삭제하시겠습니까?")) {
+          deleteLinkTableCol(selectedColIds);
+        }
+      });
+    }
+  };
+
+  const handleTableSubmit = async (data: LinkTableFormData) => {
+    const regTblInfo = await LinkApi.countLinkTblNm(data.trsf_tbl_nm);
+    const confirmMsg =
+      regTblInfo.count > 0 &&
+      data.trsf_tbl_nm !== selectedTableInfo?.trsf_tbl_nm
+        ? `이미 사용중인 테이블 명입니다. 해당 테이블 명으로 ${!data.tbl_sn ? "저장" : "수정"}하시겠습니까?`
+        : `${!data.tbl_sn ? "저장" : "수정"}하시겠습니까?`;
+    if (!data.tbl_sn) {
+      await handleConfirm(async () => {
+        if (await confirm(confirmMsg)) {
+          insertLinkTableInfo({
+            ...data,
+            mdfr_id: userUniqId,
+            tbl_sn: regTblInfo.count > 0 ? regTblInfo.tbl_sn : "",
+          });
+        }
+      });
+    } else {
+      await handleConfirm(async () => {
+        if (await confirm(confirmMsg)) {
+          updateLinkTableInfo({
+            ...data,
+            tbl_sn: regTblInfo.count > 0 ? regTblInfo.tbl_sn : "",
+            mdfr_id: userUniqId,
+          });
+        }
+      });
+    }
+  };
+
+  const { tableComponent } = useDataTable({
+    query,
+    tableOptions: {
+      columns,
+      state: {
+        pagination,
+        rowSelection,
+      },
+      manualPagination: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setPagination,
+      onRowSelectionChange: setRowSelection,
+    },
+    dataTableOptions: {
+      onRowClick: handleRowClick,
+      viewPagination: true,
+    },
+  });
+
+  return (
+    <div className="card card-border !mt-6">
+      <div className="card card-border">
+        <form className="flex items-center gap-2 p-2" onSubmit={handleSubmit}>
+          <Label htmlFor="liSnSearchInput" className="mr-2 text-label">
+            일련번호
+          </Label>
+          <Input
+            className="mr-4 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liSnSearchInput"
+            value={linkSn}
+            onChange={(e) => setLinkSn(e.target.value)}
+            autoComplete="off"
+          />
+          <Label htmlFor="liNmSearchInput" className="mr-2 text-label">
+            연계 명
+          </Label>
+          <Input
+            className="mr-2 h-[3.2rem] w-[24rem] rounded-sm !text-[1.3rem]"
+            id="liNmSearchInput"
+            value={linkNm}
+            onChange={(e) => setLinkNm(e.target.value)}
+            autoComplete="off"
+          />
+          <Button
+            color="green"
+            className="h-[3.2rem]"
+            type="button"
+            onClick={handleResetSearchParam}
+          >
+            초기화
+          </Button>
+          <Button className="h-[3.2rem]" type="submit">
+            조회
+          </Button>
+        </form>
+      </div>
+      <div className="card !mb-0 flex h-[calc(100vh-28rem)] gap-5 !p-0">
+        <div className="card card-border !mx-0 flex w-1/2 flex-col">
+          <div className="card-header">
+            <h3 className="text-2xl font-medium text-label">연계 목록</h3>
+          </div>
+          <div className="card !m-[1.2rem] h-full overflow-auto !p-0">
+            {!query.isLoading ? (
+              <div>{tableComponent}</div>
+            ) : (
+              <div className="[data-theme='black']:bg-transparent flex h-full items-center justify-center rounded-lg p-10">
+                <div className="relative size-[5rem]">
+                  <LoadingWithAnimation color="primary" />
+                </div>
+              </div>
+            )}
+          </div>
+        </div>
+        <div className="card card-border !mx-0 flex w-1/2 flex-col">
+          <div className="card-header">
+            <h3 className="text-2xl font-medium text-label">
+              연계 테이블 정보
+            </h3>
+          </div>
+          <div className="card !m-[1.2rem] flex h-full flex-col overflow-auto !p-0">
+            <Form {...tableForm}>
+              <form onSubmit={tableForm.handleSubmit(handleTableSubmit)}>
+                {selectedTableInfo && (
+                  <div className="mb-2 flex justify-end">
+                    <Button
+                      className="h-[3.2rem]"
+                      type="submit"
+                      color={selectedTableInfo.tbl_sn ? "green" : "primary"}
+                    >
+                      {selectedTableInfo.tbl_sn ? "수정" : "저장"}
+                    </Button>
+                  </div>
+                )}
+                <Table variant="secondary" className="flex-none">
+                  <colgroup>
+                    <col width="20%" />
+                    <col width="80%" />
+                  </colgroup>
+                  <TableBody>
+                    <TableRow>
+                      <TableHead>연계 일련번호</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="link_sn"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    disabled
+                                  />
+                                </FormControl>
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>연계 명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="link_nm"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    disabled
+                                  />
+                                </FormControl>
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>원천 테이블 명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="sou_tbl_nm"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    placeholder={!field.value ? "-" : ""}
+                                    autoComplete="off"
+                                  />
+                                </FormControl>
+                                {tableForm.formState.errors.sou_tbl_nm && (
+                                  <p className="pt-2 text-base text-red-500">
+                                    {
+                                      tableForm.formState.errors.sou_tbl_nm
+                                        .message
+                                    }
+                                  </p>
+                                )}
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>원천 테이블 한글명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="sou_tbl_korn_nm"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    placeholder={!field.value ? "-" : ""}
+                                    autoComplete="off"
+                                  />
+                                </FormControl>
+                                {tableForm.formState.errors.sou_tbl_korn_nm && (
+                                  <p className="pt-2 text-base text-red-500">
+                                    {
+                                      tableForm.formState.errors.sou_tbl_korn_nm
+                                        .message
+                                    }
+                                  </p>
+                                )}
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>원천 테이블 설명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="sou_tbl_expln"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    placeholder={!field.value ? "-" : ""}
+                                    autoComplete="off"
+                                  />
+                                </FormControl>
+                                {tableForm.formState.errors.sou_tbl_expln && (
+                                  <p className="pt-2 text-base text-red-500">
+                                    {
+                                      tableForm.formState.errors.sou_tbl_expln
+                                        .message
+                                    }
+                                  </p>
+                                )}
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>* 변환 테이블 명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="trsf_tbl_nm"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    placeholder={!field.value ? "-" : ""}
+                                    autoComplete="off"
+                                  />
+                                </FormControl>
+                                {tableForm.formState.errors.trsf_tbl_nm && (
+                                  <p className="pt-2 text-base text-red-500">
+                                    {
+                                      tableForm.formState.errors.trsf_tbl_nm
+                                        .message
+                                    }
+                                  </p>
+                                )}
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>* 변환 테이블 한글명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="trsf_tbl_korn_nm"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    placeholder={!field.value ? "-" : ""}
+                                    autoComplete="off"
+                                  />
+                                </FormControl>
+                                {tableForm.formState.errors
+                                  .trsf_tbl_korn_nm && (
+                                  <p className="pt-2 text-base text-red-500">
+                                    {
+                                      tableForm.formState.errors
+                                        .trsf_tbl_korn_nm.message
+                                    }
+                                  </p>
+                                )}
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                    <TableRow>
+                      <TableHead>변환 테이블 설명</TableHead>
+                      <TableCell className="!p-2">
+                        {selectedTableInfo ? (
+                          <FormField
+                            control={tableForm.control}
+                            name="trsf_tbl_expln"
+                            render={({ field }) => (
+                              <FormItem>
+                                <FormControl>
+                                  <Input
+                                    {...field}
+                                    value={field.value ?? ""}
+                                    className="w-[400px] !text-[1.3rem]"
+                                    placeholder={!field.value ? "-" : ""}
+                                    autoComplete="off"
+                                  />
+                                </FormControl>
+                                {tableForm.formState.errors.trsf_tbl_expln && (
+                                  <p className="pt-2 text-base text-red-500">
+                                    {
+                                      tableForm.formState.errors.trsf_tbl_expln
+                                        .message
+                                    }
+                                  </p>
+                                )}
+                              </FormItem>
+                            )}
+                          />
+                        ) : (
+                          <span className="px-2 py-[1.2rem]">-</span>
+                        )}
+                      </TableCell>
+                    </TableRow>
+                  </TableBody>
+                </Table>
+              </form>
+            </Form>
+            {selectedTableInfo ? (
+              <>
+                <div className="mb-2 mt-14 flex flex-none items-center justify-end">
+                  {tableColList.length > 0 && (
+                    <Button
+                      color="red"
+                      className="mr-2 h-[3.2rem]"
+                      type="button"
+                      onClick={handleDeleteParam}
+                    >
+                      행 삭제
+                    </Button>
+                  )}
+                  {selectedTableInfo.tbl_sn && (
+                    <LinkTableDialog
+                      dialogOpen={dialogOpen}
+                      onOpenChange={setDialogOpen}
+                      form={form}
+                      tableInfo={selectedTableInfo}
+                      insertLinkTableCol={insertLinkTableCol}
+                      updateLinkTableCol={updateLinkTableCol}
+                    />
+                  )}
+                </div>
+                {selectedTableInfo.tbl_sn ? (
+                  tableColList.length > 0 ? (
+                    <div className="min-h-[300px] flex-1 overflow-auto">
+                      <DataTable
+                        table={colTable}
+                        onRowClick={handleColumnRowClick}
+                      />
+                    </div>
+                  ) : (
+                    <div className="flex h-20 items-center justify-center text-3xl text-gray-500">
+                      등록된 테이블 컬럼이 없습니다.
+                    </div>
+                  )
+                ) : (
+                  <div className="flex h-20 items-center justify-center text-3xl text-gray-500">
+                    테이블 정보를 등록해주세요.
+                  </div>
+                )}
+              </>
+            ) : (
+              <div className="mt-14 flex flex-1 items-center justify-center text-3xl text-gray-500">
+                연계 데이터를 선택해주세요.
+              </div>
+            )}
+          </div>
+        </div>
+      </div>
+      <ConfirmDialog isOpen={onConfirm} />
+    </div>
+  );
+}
+
+export { LinkTablePage };
diff --git a/apps/cs/src/pages/loginlog/ui/loginlog-page.tsx b/apps/cs/src/pages/loginlog/ui/loginlog-page.tsx
index d94d79c9a..baca00d74 100644
--- a/apps/cs/src/pages/loginlog/ui/loginlog-page.tsx
+++ b/apps/cs/src/pages/loginlog/ui/loginlog-page.tsx
@@ -77,7 +77,7 @@ function LoginlogPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setIsManualLoading(true);
     setPagination({
diff --git a/apps/cs/src/pages/menu/ui/menu-history-dialog.tsx b/apps/cs/src/pages/menu/ui/menu-history-dialog.tsx
index a24b77308..78c34d440 100644
--- a/apps/cs/src/pages/menu/ui/menu-history-dialog.tsx
+++ b/apps/cs/src/pages/menu/ui/menu-history-dialog.tsx
@@ -91,7 +91,7 @@ function MenuHistoryDialog({ menuCd }: MenuHistoryDialogProps) {
     },
   });
 
-  const handleSearch = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSearch = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     e.stopPropagation();
     query.refetch();
diff --git a/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx b/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx
index eb942fe11..6956d6465 100644
--- a/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx
+++ b/apps/cs/src/pages/menu/ui/organization-search-dialog.tsx
@@ -59,7 +59,7 @@ function OrganizationSearchDialog({
     handleUserSelect(node.data as TreeUser);
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     e.stopPropagation();
     setTree(filterUserOrganizationTreeDataByKeyword(treeData ?? [], keyword));
diff --git a/apps/cs/src/pages/module/ui/module-page.tsx b/apps/cs/src/pages/module/ui/module-page.tsx
index 8593ba4b5..1749bdfbd 100644
--- a/apps/cs/src/pages/module/ui/module-page.tsx
+++ b/apps/cs/src/pages/module/ui/module-page.tsx
@@ -62,7 +62,7 @@ function ModulePage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/ntftalk-history/index.ts b/apps/cs/src/pages/ntftalk-history/index.ts
new file mode 100644
index 000000000..e9871422b
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-history/index.ts
@@ -0,0 +1 @@
+export { NtftalkHistoryPage } from "./ui/ntftalk-history-page";
diff --git a/apps/cs/src/pages/ntftalk-history/model/ntftalk-history-table-columns.tsx b/apps/cs/src/pages/ntftalk-history/model/ntftalk-history-table-columns.tsx
new file mode 100644
index 000000000..637285075
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-history/model/ntftalk-history-table-columns.tsx
@@ -0,0 +1,64 @@
+import type { ColumnDef } from "@tanstack/react-table";
+import type { NtftalkMmtLogHistory } from "@/entities/ntftalk";
+
+function formatDateTime(value: string | null | undefined): string {
+  if (!value) return "—";
+  const normalized = value.includes("T")
+    ? value.replace("T", " ").slice(0, 19)
+    : value.slice(0, 19);
+  return normalized;
+}
+
+function formatResult(successYn: string | null | undefined): string {
+  if (!successYn) return "—";
+  if (successYn === "SUCCESS") return "성공";
+  if (successYn === "FAIL") return "실패";
+  return successYn;
+}
+
+export function createNtftalkHistoryColumns(): ColumnDef<NtftalkMmtLogHistory>[] {
+  return [
+    {
+      id: "rowNo",
+      header: "순번",
+      enableSorting: false,
+      cell: ({ row, table }) => {
+        const { pageIndex, pageSize } = table.getState().pagination;
+        return pageIndex * pageSize + row.index + 1;
+      },
+    },
+    {
+      accessorKey: "siteSystem",
+      header: "시스템",
+      cell: ({ getValue }) => (getValue() as string) || "—",
+    },
+    {
+      accessorKey: "content",
+      header: "알림내용",
+      cell: ({ getValue }) => {
+        const v = getValue() as string;
+        if (!v) return "—";
+        return (
+          <span className="line-clamp-2 max-w-[28rem] text-left" title={v}>
+            {v}
+          </span>
+        );
+      },
+    },
+    {
+      accessorKey: "recipientNum",
+      header: "수신자",
+      cell: ({ getValue }) => (getValue() as string) || "—",
+    },
+    {
+      accessorKey: "dateRslt",
+      header: "수신일",
+      cell: ({ getValue }) => formatDateTime(getValue() as string | null),
+    },
+    {
+      accessorKey: "successYn",
+      header: "결과",
+      cell: ({ getValue }) => formatResult(getValue() as string | null),
+    },
+  ];
+}
diff --git a/apps/cs/src/pages/ntftalk-history/ui/ntftalk-history-page.tsx b/apps/cs/src/pages/ntftalk-history/ui/ntftalk-history-page.tsx
new file mode 100644
index 000000000..80434a15f
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-history/ui/ntftalk-history-page.tsx
@@ -0,0 +1,258 @@
+"use client";
+
+import { useMemo, useState } from "react";
+
+import { keepPreviousData, useQuery } from "@tanstack/react-query";
+import { getCoreRowModel, type PaginationState } from "@tanstack/react-table";
+import dayjs from "dayjs";
+
+import { ENDPOINT } from "@/shared/config";
+import { useAlertStore, useDataTable } from "@/shared/lib";
+import { InputDateRangePicker } from "@/shared/ui/input-date-range-picker";
+import {
+  NtftalkMmtLogHistoryApi,
+  type NtftalkMmtLogHistorySearchParams,
+} from "@/entities/ntftalk";
+import { SiteSelect } from "@/entities/site";
+import {
+  Button,
+  Input,
+  Label,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@common/components";
+
+import { createNtftalkHistoryColumns } from "../model/ntftalk-history-table-columns";
+
+type DateRange = {
+  from?: Date | null;
+  to?: Date | null;
+};
+
+type PresetPeriod = "" | "3M" | "6M" | "1Y" | "CUSTOM";
+
+function computeDateRangeFromPreset(
+  preset: Extract<PresetPeriod, "3M" | "6M" | "1Y">,
+): DateRange {
+  const to = dayjs().endOf("day").toDate();
+  const base = dayjs();
+  let fromDay: dayjs.Dayjs;
+  switch (preset) {
+    case "3M":
+      fromDay = base.subtract(3, "month");
+      break;
+    case "6M":
+      fromDay = base.subtract(6, "month");
+      break;
+    case "1Y":
+      fromDay = base.subtract(1, "year");
+      break;
+  }
+  return { from: fromDay.startOf("day").toDate(), to };
+}
+
+function isDateRangeOverOneYear(range: DateRange): boolean {
+  if (!range.from) return false;
+  const oneYearAgo = dayjs().subtract(1, "year").startOf("day");
+  return dayjs(range.from).isBefore(oneYearAgo);
+}
+
+function NtftalkHistoryPage() {
+  const alert = useAlertStore((state) => state.setMessage);
+  const [contentInput, setContentInput] = useState("");
+  const [recipientInput, setRecipientInput] = useState("");
+  const [presetPeriod, setPresetPeriod] = useState<PresetPeriod>("");
+  const [dateRange, setDateRange] = useState<DateRange>({
+    from: null,
+    to: null,
+  });
+  const [resultFilter, setResultFilter] = useState("ALL");
+  const [systemFilter, setSystemFilter] = useState("ALL");
+
+  const [searchParams, setSearchParams] =
+    useState<NtftalkMmtLogHistorySearchParams>({ sort: "dateMtReport,desc" });
+  const [pagination, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 10,
+  });
+
+  const listQuery = useQuery({
+    queryKey: [
+      ENDPOINT.NTFTALK_SERVICE.MMT_LOG_HISTORY,
+      searchParams,
+      pagination,
+    ],
+    queryFn: () =>
+      NtftalkMmtLogHistoryApi.getNtftalkMmtLogHistoryPage({
+        ...searchParams,
+        page: pagination.pageIndex,
+        size: pagination.pageSize,
+      }),
+    placeholderData: keepPreviousData,
+  });
+
+  const columns = useMemo(() => createNtftalkHistoryColumns(), []);
+
+  const { tableComponent } = useDataTable({
+    query: listQuery,
+    tableOptions: {
+      columns,
+      state: { pagination },
+      manualPagination: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setPagination,
+    },
+    dataTableOptions: {
+      viewPagination: true,
+    },
+  });
+
+  const buildSearchParamsFromInputs = (): NtftalkMmtLogHistorySearchParams => ({
+    sort: searchParams.sort ?? "dateMtReport,desc",
+    content: contentInput.trim() || undefined,
+    recipientNum: recipientInput.trim() || undefined,
+    successYn: resultFilter,
+    system: systemFilter,
+    dateFrom: dateRange.from
+      ? dayjs(dateRange.from).format("YYYY-MM-DD")
+      : undefined,
+    dateTo: dateRange.to ? dayjs(dateRange.to).format("YYYY-MM-DD") : undefined,
+  });
+
+  const handleSearch = (e: React.SubmitEvent) => {
+    e.preventDefault();
+    if (isDateRangeOverOneYear(dateRange)) {
+      alert("조회 기간은 오늘 기준 최대 1년까지만 선택할 수 있습니다.");
+      return;
+    }
+    setPagination((p) => ({ ...p, pageIndex: 0 }));
+    setSearchParams(buildSearchParamsFromInputs());
+  };
+
+  const handlePresetPeriodChange = (value: PresetPeriod) => {
+    setPresetPeriod(value);
+    if (value === "3M" || value === "6M" || value === "1Y") {
+      setDateRange(computeDateRangeFromPreset(value));
+    }
+  };
+
+  const handleDateRangeChange = (next: DateRange) => {
+    setDateRange(next);
+    setPresetPeriod("CUSTOM");
+  };
+
+  const handleReset = () => {
+    setContentInput("");
+    setRecipientInput("");
+    setPresetPeriod("");
+    setDateRange({ from: null, to: null });
+    setResultFilter("ALL");
+    setSystemFilter("ALL");
+    setPagination((p) => ({ ...p, pageIndex: 0 }));
+    setSearchParams({ sort: "dateMtReport,desc" });
+  };
+
+  return (
+    <div className="card card-border !mt-6 flex flex-col gap-4">
+      <div className="card card-border">
+        <form
+          onSubmit={handleSearch}
+          className="flex flex-col gap-4 p-2 md:flex-row md:items-end md:justify-between"
+        >
+          <div className="flex flex-col gap-4">
+            <div className="flex flex-wrap items-end gap-4">
+              <div className="flex flex-wrap items-center gap-2">
+                <Label className="whitespace-nowrap text-label">조회기간</Label>
+                <Select
+                  value={presetPeriod}
+                  onValueChange={handlePresetPeriodChange}
+                >
+                  <SelectTrigger className="w-[16rem]">
+                    <SelectValue placeholder="기간 선택" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="3M">3개월</SelectItem>
+                    <SelectItem value="6M">6개월</SelectItem>
+                    <SelectItem value="1Y">1년</SelectItem>
+                    <SelectItem value="CUSTOM">직접입력</SelectItem>
+                  </SelectContent>
+                </Select>
+                <InputDateRangePicker
+                  dateRange={dateRange}
+                  setDateRange={handleDateRangeChange}
+                  disabled={presetPeriod !== "CUSTOM"}
+                />
+              </div>
+            </div>
+            <div className="flex flex-wrap gap-6">
+              <div className="flex items-center gap-2">
+                <Label className="whitespace-nowrap text-label">알림내용</Label>
+                <Input
+                  className="w-[16rem]"
+                  value={contentInput}
+                  onChange={(e) => setContentInput(e.target.value)}
+                />
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="whitespace-nowrap text-label">사용자</Label>
+                <Input
+                  className="w-[16rem]"
+                  value={recipientInput}
+                  onChange={(e) => setRecipientInput(e.target.value)}
+                  placeholder="수신자 번호"
+                />
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="whitespace-nowrap text-label">결과</Label>
+                <Select value={resultFilter} onValueChange={setResultFilter}>
+                  <SelectTrigger className="w-[16rem]">
+                    <SelectValue placeholder="전체" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="ALL">전체</SelectItem>
+                    <SelectItem value="SUCCESS">성공</SelectItem>
+                    <SelectItem value="FAIL">실패</SelectItem>
+                  </SelectContent>
+                </Select>
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="whitespace-nowrap text-label">시스템</Label>
+                <SiteSelect
+                  className="w-[16rem]"
+                  value={systemFilter}
+                  onValueChange={(value) => setSystemFilter(value)}
+                  enabledAllSite
+                />
+              </div>
+            </div>
+          </div>
+          <div className="flex shrink-0 gap-2">
+            <Button className="h-[3.2rem]" type="submit">
+              조회
+            </Button>
+            <Button
+              type="button"
+              color="white"
+              className="h-[3.2rem]"
+              onClick={handleReset}
+            >
+              초기화
+            </Button>
+          </div>
+        </form>
+      </div>
+
+      <div className="card card-border">
+        <div className="card-header">
+          <h3 className="text-2xl font-medium text-label">알림톡 발송 이력</h3>
+        </div>
+        <div className="card !m-[1.2rem] !p-0">{tableComponent}</div>
+      </div>
+    </div>
+  );
+}
+
+export { NtftalkHistoryPage };
diff --git a/apps/cs/src/pages/ntftalk-temp/index.ts b/apps/cs/src/pages/ntftalk-temp/index.ts
new file mode 100644
index 000000000..a15c01db3
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/index.ts
@@ -0,0 +1 @@
+export { NtftalkTempPage } from "./ui/ntftalk-temp-page";
diff --git a/apps/cs/src/pages/ntftalk-temp/model/ntftalk-temp-save-schema.ts b/apps/cs/src/pages/ntftalk-temp/model/ntftalk-temp-save-schema.ts
new file mode 100644
index 000000000..911c4a277
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/model/ntftalk-temp-save-schema.ts
@@ -0,0 +1,14 @@
+import { z } from "zod";
+
+export const ntftalkTempSaveFormSchema = z.object({
+  templateCode: z.string().min(1, "템플릿코드를 입력하세요."),
+  senderKey: z.string().min(1, "채널(senderKey)을 입력하세요."),
+  senderKeyType: z.string().min(1, "발신키 유형을 입력하세요."),
+  templateName: z.string().min(1, "템플릿명을 입력하세요."),
+  templateContent: z.string().min(1, "템플릿내용을 입력하세요."),
+  templateMessageType: z.string().min(1, "메시지유형을 입력하세요."),
+  templateEmphasizeType: z.string().min(1, "강조유형을 입력하세요."),
+  templateImageUrl: z.string().optional(),
+});
+
+export type NtftalkTempSaveFormData = z.infer<typeof ntftalkTempSaveFormSchema>;
diff --git a/apps/cs/src/pages/ntftalk-temp/model/ntftalk-var-grid.ts b/apps/cs/src/pages/ntftalk-temp/model/ntftalk-var-grid.ts
new file mode 100644
index 000000000..aa4892b1f
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/model/ntftalk-var-grid.ts
@@ -0,0 +1,19 @@
+import type { NtftalkVar } from "@/entities/ntftalk";
+
+export interface NtftalkVarGridRow extends NtftalkVar {
+  clientId?: string;
+  isDraft?: boolean;
+}
+
+export function createEmptyVarDraft(clientId: string): NtftalkVarGridRow {
+  return {
+    clientId,
+    isDraft: true,
+    varCd: "",
+    varNm: "",
+    varDesc: "",
+    sender: "",
+    regDt: "",
+    regr: "",
+  };
+}
diff --git a/apps/cs/src/pages/ntftalk-temp/model/template-table-columns.tsx b/apps/cs/src/pages/ntftalk-temp/model/template-table-columns.tsx
new file mode 100644
index 000000000..29df948ad
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/model/template-table-columns.tsx
@@ -0,0 +1,99 @@
+import type { ColumnDef, Row, Table } from "@tanstack/react-table";
+import { Checkbox } from "@common/components";
+import type { NtftalkTemp } from "@/entities/ntftalk";
+
+function formatButtons(row: NtftalkTemp): string {
+  if (!row.buttons?.length) return "—";
+  return row.buttons.map((b) => b.name).join(", ");
+}
+
+export function createTemplateColumns(): ColumnDef<NtftalkTemp>[] {
+  return [
+    {
+      id: "select",
+      header: ({ table }: { table: Table<NtftalkTemp> }) => (
+        <div
+          className="flex justify-center"
+          onClick={(e) => e.stopPropagation()}
+          onKeyDown={(e) => e.stopPropagation()}
+          role="presentation"
+        >
+          <Checkbox
+            checked={
+              table.getIsAllPageRowsSelected() ||
+              (table.getIsSomePageRowsSelected() && "indeterminate")
+            }
+            onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+            aria-label="전체 선택"
+          />
+        </div>
+      ),
+      cell: ({ row }: { row: Row<NtftalkTemp> }) => (
+        <div
+          className="flex justify-center"
+          onClick={(e) => e.stopPropagation()}
+          onKeyDown={(e) => e.stopPropagation()}
+          role="presentation"
+        >
+          <Checkbox
+            checked={row.getIsSelected()}
+            onCheckedChange={(value) => row.toggleSelected(!!value)}
+            aria-label="행 선택"
+          />
+        </div>
+      ),
+      enableSorting: false,
+      enableHiding: false,
+    },
+    {
+      accessorKey: "senderKey",
+      header: "@채널",
+    },
+    {
+      accessorKey: "templateCode",
+      header: "템플릿코드",
+    },
+    {
+      accessorKey: "templateName",
+      header: "템플릿명",
+    },
+    {
+      accessorKey: "templateMessageType",
+      header: "메시지유형",
+    },
+    {
+      accessorKey: "templateContent",
+      header: "템플릿내용",
+      cell: ({ getValue }) => {
+        const v = getValue() as string;
+        if (!v) return "—";
+        return (
+          <span className="line-clamp-2 max-w-[28rem] text-left" title={v}>
+            {v}
+          </span>
+        );
+      },
+    },
+    {
+      accessorKey: "templateEmphasizeType",
+      header: "강조유형",
+    },
+    {
+      id: "buttons",
+      header: "버튼정보",
+      cell: ({ row }) => formatButtons(row.original),
+    },
+    {
+      accessorKey: "inspectionStatus",
+      header: "검수상태",
+    },
+    {
+      accessorKey: "status",
+      header: "상태",
+    },
+    {
+      accessorKey: "createdAt",
+      header: "등록일자",
+    },
+  ];
+}
diff --git a/apps/cs/src/pages/ntftalk-temp/model/var-table-columns.tsx b/apps/cs/src/pages/ntftalk-temp/model/var-table-columns.tsx
new file mode 100644
index 000000000..3b0d39ced
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/model/var-table-columns.tsx
@@ -0,0 +1,130 @@
+import type { ColumnDef, Row, Table } from "@tanstack/react-table";
+import { Checkbox, Input } from "@common/components";
+import type { NtftalkVarGridRow } from "./ntftalk-var-grid";
+
+export interface VarColumnHandlers {
+  onDraftFieldChange: (
+    clientId: string,
+    field: "varCd" | "varNm" | "varDesc" | "sender",
+    value: string,
+  ) => void;
+}
+
+export function createVarColumns(
+  handlers: VarColumnHandlers,
+): ColumnDef<NtftalkVarGridRow>[] {
+  return [
+    {
+      id: "select",
+      header: ({ table }: { table: Table<NtftalkVarGridRow> }) => (
+        <div
+          className="flex justify-center"
+          onClick={(e) => e.stopPropagation()}
+          onKeyDown={(e) => e.stopPropagation()}
+          role="presentation"
+        >
+          <Checkbox
+            checked={
+              table.getIsAllPageRowsSelected() ||
+              (table.getIsSomePageRowsSelected() && "indeterminate")
+            }
+            onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+            aria-label="전체 선택"
+          />
+        </div>
+      ),
+      cell: ({ row }: { row: Row<NtftalkVarGridRow> }) => (
+        <div
+          className="flex justify-center"
+          onClick={(e) => e.stopPropagation()}
+          onKeyDown={(e) => e.stopPropagation()}
+          role="presentation"
+        >
+          <Checkbox
+            checked={row.getIsSelected()}
+            onCheckedChange={(value) => row.toggleSelected(!!value)}
+            aria-label="행 선택"
+          />
+        </div>
+      ),
+      enableSorting: false,
+    },
+    {
+      id: "seq",
+      header: "순번",
+      cell: ({ row, table }) => {
+        const pageIndex = table.getState().pagination.pageIndex;
+        const pageSize = table.getState().pagination.pageSize;
+        return pageIndex * pageSize + row.index + 1;
+      },
+    },
+    {
+      accessorKey: "varCd",
+      header: "변수코드",
+      cell: ({ row }) => {
+        const r = row.original;
+        if (r.isDraft && r.clientId) {
+          return (
+            <Input
+              className="h-[3rem] min-w-[10rem]"
+              value={r.varCd}
+              onChange={(e) =>
+                handlers.onDraftFieldChange(r.clientId!, "varCd", e.target.value)
+              }
+              onClick={(e) => e.stopPropagation()}
+            />
+          );
+        }
+        return r.varCd;
+      },
+    },
+    {
+      accessorKey: "varNm",
+      header: "변수명",
+      cell: ({ row }) => {
+        const r = row.original;
+        if (r.isDraft && r.clientId) {
+          return (
+            <Input
+              className="h-[3rem] min-w-[10rem]"
+              value={r.varNm}
+              onChange={(e) =>
+                handlers.onDraftFieldChange(r.clientId!, "varNm", e.target.value)
+              }
+              onClick={(e) => e.stopPropagation()}
+            />
+          );
+        }
+        return r.varNm;
+      },
+    },
+    {
+      accessorKey: "varDesc",
+      header: "설명",
+      cell: ({ row }) => {
+        const r = row.original;
+        if (r.isDraft && r.clientId) {
+          return (
+            <Input
+              className="h-[3rem] min-w-[16rem]"
+              value={r.varDesc ?? ""}
+              onChange={(e) =>
+                handlers.onDraftFieldChange(r.clientId!, "varDesc", e.target.value)
+              }
+              onClick={(e) => e.stopPropagation()}
+            />
+          );
+        }
+        return r.varDesc ?? "—";
+      },
+    },
+    {
+      accessorKey: "regDt",
+      header: "등록일자",
+    },
+    {
+      accessorKey: "regr",
+      header: "등록자",
+    },
+  ];
+}
diff --git a/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-detail-dialog.tsx b/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-detail-dialog.tsx
new file mode 100644
index 000000000..aa08f92ca
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-detail-dialog.tsx
@@ -0,0 +1,110 @@
+"use client";
+
+import { useQuery } from "@tanstack/react-query";
+
+import { ENDPOINT } from "@/shared/config";
+import { NoData } from "@/shared/ui/no-data";
+import { NtftalkTempApi } from "@/entities/ntftalk";
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  LoadingWithAnimation,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+} from "@common/components";
+
+interface NtftalkTempDetailDialogProps {
+  templateCode: string | null;
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}
+
+function NtftalkTempDetailDialog({
+  templateCode,
+  open,
+  onOpenChange,
+}: NtftalkTempDetailDialogProps) {
+  const query = useQuery({
+    queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP, "detail", templateCode],
+    queryFn: () => NtftalkTempApi.getNtftalkTemp(templateCode!),
+    enabled: open && !!templateCode,
+  });
+
+  const d = query.data;
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent
+        className="max-h-[85vh] max-w-[96rem] overflow-y-auto"
+        aria-describedby={undefined}
+      >
+        <DialogHeader>
+          <DialogTitle>알림톡 템플릿 상세</DialogTitle>
+        </DialogHeader>
+        {query.isLoading && (
+          <div className="relative size-[5rem]">
+            <LoadingWithAnimation color="primary" />
+          </div>
+        )}
+        {query.isError && <NoData />}
+        {d && (
+          <Table variant="secondary">
+            <TableBody>
+              <TableRow>
+                <TableHead>메시지 유형</TableHead>
+                <TableCell>{d.templateMessageType}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>@채널</TableHead>
+                <TableCell>{d.senderKey}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>템플릿코드</TableHead>
+                <TableCell>{d.templateCode}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>템플릿명</TableHead>
+                <TableCell>{d.templateName}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>강조유형</TableHead>
+                <TableCell>{d.templateEmphasizeType}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>템플릿내용</TableHead>
+                <TableCell>{d.templateContent}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>검수상태</TableHead>
+                <TableCell>{d.inspectionStatus}</TableCell>
+              </TableRow>
+              {/* <TableRow>
+                <TableHead>보안템플릿 여부</TableHead>
+                <TableCell>{d.templateEmphasizeType}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>비즈톡센터 사용여부</TableHead>
+                <TableCell>{d.status}</TableCell>
+              </TableRow> */}
+              <TableRow>
+                <TableHead>등록일</TableHead>
+                <TableCell>{d.createdAt}</TableCell>
+              </TableRow>
+              <TableRow>
+                <TableHead>템플릿 상태</TableHead>
+                <TableCell>{d.status}</TableCell>
+              </TableRow>
+            </TableBody>
+          </Table>
+        )}
+      </DialogContent>
+    </Dialog>
+  );
+}
+
+export { NtftalkTempDetailDialog };
diff --git a/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-page.tsx b/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-page.tsx
new file mode 100644
index 000000000..787f33f93
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-page.tsx
@@ -0,0 +1,678 @@
+"use client";
+
+import { useCallback, useMemo, useState } from "react";
+import { useFieldArray, useForm, useWatch } from "react-hook-form";
+
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import {
+  keepPreviousData,
+  useQuery,
+  useQueryClient,
+} from "@tanstack/react-query";
+import {
+  getCoreRowModel,
+  type PaginationState,
+  type RowSelectionState,
+  useReactTable,
+} from "@tanstack/react-table";
+import { z } from "zod";
+
+import { AUTH_USER_ID, ENDPOINT } from "@/shared/config";
+import {
+  getCookie,
+  useAlertStore,
+  useDataTable,
+  useMutationWrapper,
+} from "@/shared/lib";
+import { NoData } from "@/shared/ui/no-data";
+import {
+  NtftalkBiztalkApi,
+  type NtftalkBiztalkInspectionRequestItem,
+  type NtftalkTemp,
+  NtftalkTempApi,
+  type NtftalkTempSearchParams,
+  NtftalkVarApi,
+  type NtftalkVarSearchParams,
+} from "@/entities/ntftalk";
+import {
+  Button,
+  DataTable,
+  Input,
+  Label,
+  LoadingWithAnimation,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from "@common/components";
+
+import {
+  createEmptyVarDraft,
+  type NtftalkVarGridRow,
+} from "../model/ntftalk-var-grid";
+import { createTemplateColumns } from "../model/template-table-columns";
+import { createVarColumns } from "../model/var-table-columns";
+
+import { NtftalkTempDetailDialog } from "./ntftalk-temp-detail-dialog";
+import { NtftalkTempRegistDialog } from "./ntftalk-temp-regist-dialog";
+
+const ALL = "__ALL__";
+
+const varDraftSaveSchema = z.object({
+  varCd: z.string().min(1),
+  varNm: z.string().min(1),
+  varDesc: z.string().optional(),
+  sender: z.string().optional(),
+});
+
+interface VarDraftFormValues {
+  draftVars: NtftalkVarGridRow[];
+}
+
+function NtftalkTempPage() {
+  const queryClient = useQueryClient();
+  const alert = useAlertStore((s) => s.setMessage);
+  const { confirm } = useConfirm();
+
+  const [templateCodeInput, setTemplateCodeInput] = useState("");
+  const [templateNameInput, setTemplateNameInput] = useState("");
+  const [templateContentInput, setTemplateContentInput] = useState("");
+  const [senderKeyFilter, setSenderKeyFilter] = useState(ALL);
+  const [inspectionFilter, setInspectionFilter] = useState(ALL);
+  const [messageTypeFilter, setMessageTypeFilter] = useState(ALL);
+
+  const [searchParams, setSearchParams] = useState<NtftalkTempSearchParams>({
+    sort: "createdAt,desc",
+  });
+  const [pagination, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 10,
+  });
+  const [rowSelection, setRowSelection] = useState<RowSelectionState>({});
+
+  const [varPagination, setVarPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 10,
+  });
+  const [varSearchParams] = useState<NtftalkVarSearchParams>({
+    sort: "regDt,desc",
+  });
+  const [varRowSelection, setVarRowSelection] = useState<RowSelectionState>({});
+  const varDraftForm = useForm<VarDraftFormValues>({
+    defaultValues: { draftVars: [] },
+  });
+  const { control, setValue } = varDraftForm;
+  const { append, remove, replace } = useFieldArray({
+    control,
+    name: "draftVars",
+  });
+  const draftVars = useWatch({ control, name: "draftVars" }) ?? [];
+
+  const [detailCode, setDetailCode] = useState<string | null>(null);
+  const [detailOpen, setDetailOpen] = useState(false);
+  const [registOpen, setRegistOpen] = useState(false);
+
+  const tempQuery = useQuery({
+    queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP, searchParams, pagination],
+    queryFn: () =>
+      NtftalkTempApi.getNtftalkTempPage({
+        ...searchParams,
+        page: pagination.pageIndex,
+        size: pagination.pageSize,
+      }),
+    placeholderData: keepPreviousData,
+  });
+
+  const varQuery = useQuery({
+    queryKey: [
+      ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR,
+      varSearchParams,
+      varPagination,
+    ],
+    queryFn: () =>
+      NtftalkVarApi.getNtftalkVarPage({
+        ...varSearchParams,
+        page: varPagination.pageIndex,
+        size: varPagination.pageSize,
+      }),
+    placeholderData: keepPreviousData,
+  });
+
+  const senderQuery = useQuery({
+    queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK, "sender"],
+    queryFn: () => NtftalkBiztalkApi.getSender(),
+  });
+
+  const senderKeyOptions = useMemo(() => {
+    if (senderQuery.data) return [senderQuery.data];
+    return [];
+  }, [senderQuery.data]);
+
+  const inspectionOptions = useMemo(() => {
+    const set = new Set<string>();
+    (tempQuery.data?.content ?? []).forEach((r) => {
+      if (r.inspectionStatus) set.add(r.inspectionStatus);
+    });
+    return Array.from(set).sort();
+  }, [tempQuery.data]);
+
+  const messageTypeOptions = useMemo(() => {
+    const set = new Set<string>();
+    (tempQuery.data?.content ?? []).forEach((r) => {
+      if (r.templateMessageType) set.add(r.templateMessageType);
+    });
+    return Array.from(set).sort();
+  }, [tempQuery.data]);
+
+  const templateColumns = useMemo(() => createTemplateColumns(), []);
+
+  const {
+    tableComponent: templateTableComponent,
+    tableInstance: templateTable,
+  } = useDataTable({
+    query: tempQuery,
+    tableOptions: {
+      columns: templateColumns,
+      state: { pagination, rowSelection },
+      manualPagination: true,
+      enableRowSelection: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setPagination,
+      onRowSelectionChange: setRowSelection,
+    },
+    dataTableOptions: {
+      viewPagination: true,
+      onRowClick: (row: NtftalkTemp) => {
+        setDetailCode(row.templateCode);
+        setDetailOpen(true);
+      },
+    },
+  });
+
+  const draftIndexByClientId = useMemo(() => {
+    const indexByClientId = new Map<string, number>();
+    draftVars.forEach((row, index) => {
+      if (row.clientId) indexByClientId.set(row.clientId, index);
+    });
+    return indexByClientId;
+  }, [draftVars]);
+
+  const onDraftFieldChange = useCallback(
+    (
+      clientId: string,
+      field: "varCd" | "varNm" | "varDesc" | "sender",
+      value: string,
+    ) => {
+      const draftIndex = draftIndexByClientId.get(clientId);
+      if (draftIndex === undefined) return;
+      setValue(`draftVars.${draftIndex}.${field}`, value, {
+        shouldDirty: true,
+      });
+    },
+    [draftIndexByClientId, setValue],
+  );
+
+  const varColumns = useMemo(
+    () => createVarColumns({ onDraftFieldChange }),
+    [onDraftFieldChange],
+  );
+
+  const varTableRows = useMemo((): NtftalkVarGridRow[] => {
+    const server = varQuery.data?.content ?? [];
+    if (varPagination.pageIndex === 0) return [...server, ...draftVars];
+    return server;
+  }, [varQuery.data, draftVars, varPagination.pageIndex]);
+
+  const varTable = useReactTable({
+    data: varTableRows,
+    columns: varColumns,
+    state: { pagination: varPagination, rowSelection: varRowSelection },
+    manualPagination: true,
+    rowCount: varQuery.data?.totalElements ?? 0,
+    pageCount: varQuery.data?.totalPages ?? 0,
+    enableRowSelection: true,
+    enableMultiRowSelection: true,
+    getCoreRowModel: getCoreRowModel(),
+    onPaginationChange: setVarPagination,
+    onRowSelectionChange: setVarRowSelection,
+    getRowId: (row) =>
+      row.isDraft && row.clientId
+        ? `draft:${row.clientId}`
+        : `srv:${row.varCd}`,
+  });
+
+  const buildSearchParamsFromInputs = (): NtftalkTempSearchParams => ({
+    sort: searchParams.sort ?? "createdAt,desc",
+    templateCode: templateCodeInput.trim() || undefined,
+    templateName: templateNameInput.trim() || undefined,
+    templateContent: templateContentInput.trim() || undefined,
+    senderKey: senderKeyFilter === ALL ? undefined : senderKeyFilter,
+    inspectionStatus: inspectionFilter === ALL ? undefined : inspectionFilter,
+    templateMessageType:
+      messageTypeFilter === ALL ? undefined : messageTypeFilter,
+  });
+
+  const handleSearch = (e: React.SubmitEvent) => {
+    e.preventDefault();
+    setPagination((p) => ({ ...p, pageIndex: 0 }));
+    setSearchParams(buildSearchParamsFromInputs());
+  };
+
+  const handleReset = () => {
+    setTemplateCodeInput("");
+    setTemplateNameInput("");
+    setTemplateContentInput("");
+    setSenderKeyFilter(ALL);
+    setInspectionFilter(ALL);
+    setMessageTypeFilter(ALL);
+    setPagination((p) => ({ ...p, pageIndex: 0 }));
+    setSearchParams({ sort: "createdAt,desc" });
+  };
+
+  const syncTemplatesMutation = useMutationWrapper({
+    mutationFn: () => NtftalkBiztalkApi.syncTemplates({ senderKeyType: "S" }),
+    onSuccess: async (data) => {
+      await Promise.all([
+        queryClient.invalidateQueries({
+          queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP],
+        }),
+        queryClient.invalidateQueries({
+          queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK, "sender"],
+        }),
+      ]);
+      alert(data.message);
+    },
+  });
+
+  const handleRefreshTemplates = () => {
+    syncTemplatesMutation.mutate();
+  };
+
+  const deleteTemplatesMutation = useMutationWrapper({
+    mutationFn: async (codes: string[]) => {
+      for (const code of codes) {
+        await NtftalkTempApi.deleteNtftalkTemp(code);
+      }
+    },
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP],
+      });
+      setRowSelection({});
+      alert("삭제되었습니다.");
+    },
+  });
+
+  const handleDeleteSelectedTemplates = async () => {
+    const rows = templateTable.getSelectedRowModel().rows;
+    if (rows.length === 0) {
+      alert("삭제할 템플릿을 선택해 주세요.");
+      return;
+    }
+    if (
+      !(await confirm(
+        `선택한 ${rows.length}건의 템플릿을 삭제(비표시) 처리하시겠습니까?`,
+      ))
+    )
+      return;
+    deleteTemplatesMutation.mutate(rows.map((r) => r.original.templateCode));
+  };
+
+  const inspectionRequestMutation = useMutationWrapper({
+    mutationFn: (requestList: NtftalkBiztalkInspectionRequestItem[]) =>
+      NtftalkBiztalkApi.requestInspection(requestList),
+    onSuccess: async (data) => {
+      await queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP],
+      });
+      setRowSelection({});
+      alert(data.message);
+    },
+  });
+
+  const handleInspectionRequest = async () => {
+    const rows = templateTable.getSelectedRowModel().rows;
+    if (rows.length === 0) {
+      alert("검수요청할 템플릿을 선택해 주세요.");
+      return;
+    }
+
+    const requestList: NtftalkBiztalkInspectionRequestItem[] = [];
+    for (const row of rows) {
+      const { senderKey, templateCode, senderKeyType } = row.original;
+      if (!senderKey || !templateCode) {
+        alert("선택 항목에 발신키 또는 템플릿코드가 없습니다.");
+        return;
+      }
+      requestList.push({
+        senderKey,
+        templateCode,
+        senderKeyType: senderKeyType || "S",
+      });
+    }
+
+    if (
+      !(await confirm(`선택한 ${requestList.length}건을 검수요청하시겠습니까?`))
+    )
+      return;
+    inspectionRequestMutation.mutate(requestList);
+  };
+
+  const handleSaveTemplateGrid = () => {
+    alert("템플릿 그리드 셀 편집·일괄 저장은 별도 구현 시 연동합니다.");
+  };
+
+  const handleAddVarRow = () => {
+    append(createEmptyVarDraft(crypto.randomUUID()));
+    setVarPagination((p) => ({ ...p, pageIndex: 0 }));
+  };
+
+  const deleteVarsMutation = useMutationWrapper({
+    mutationFn: async (codes: string[]) => {
+      for (const code of codes) {
+        await NtftalkVarApi.deleteNtftalkVar(code);
+      }
+    },
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR],
+      });
+      setVarRowSelection({});
+      alert("삭제되었습니다.");
+    },
+  });
+
+  const handleDeleteSelectedVars = async () => {
+    const selected = varTable.getSelectedRowModel().rows;
+    if (selected.length === 0) {
+      alert("삭제할 변수를 선택해 주세요.");
+      return;
+    }
+    if (!(await confirm(`선택한 ${selected.length}건을 삭제하시겠습니까?`)))
+      return;
+
+    const serverCodes: string[] = [];
+    const draftIndexes: number[] = [];
+    selected.forEach((r) => {
+      const o = r.original;
+      if (o.isDraft && o.clientId) {
+        const draftIndex = draftIndexByClientId.get(o.clientId);
+        if (draftIndex !== undefined) draftIndexes.push(draftIndex);
+      } else if (o.varCd) serverCodes.push(o.varCd);
+    });
+
+    if (draftIndexes.length)
+      remove([...new Set(draftIndexes)].sort((a, b) => b - a));
+
+    if (serverCodes.length) deleteVarsMutation.mutate(serverCodes);
+  };
+
+  const saveVarsMutation = useMutationWrapper({
+    mutationFn: async (drafts: NtftalkVarGridRow[]) => {
+      const regr = getCookie(AUTH_USER_ID) ?? undefined;
+      for (const d of drafts) {
+        const parsed = varDraftSaveSchema.safeParse({
+          varCd: d.varCd,
+          varNm: d.varNm,
+          varDesc: d.varDesc || undefined,
+          sender: d.sender || undefined,
+        });
+        if (!parsed.success)
+          throw new Error(
+            parsed.error.issues[0]?.message ?? "유효하지 않은 입력입니다.",
+          );
+        await NtftalkVarApi.saveNtftalkVar({
+          varCd: parsed.data.varCd,
+          varNm: parsed.data.varNm,
+          varDesc: parsed.data.varDesc,
+          sender: parsed.data.sender,
+          regr,
+        });
+      }
+    },
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR],
+      });
+      replace([]);
+      setVarRowSelection({});
+      alert("저장되었습니다.");
+    },
+  });
+
+  const handleSaveVars = () => {
+    if (draftVars.length === 0) {
+      alert("저장할 신규 변수 행이 없습니다. 변수추가로 행을 추가하세요.");
+      return;
+    }
+    saveVarsMutation.mutate(draftVars);
+  };
+
+  const varTableComponent = (() => {
+    if (varQuery.isLoading)
+      return (
+        <div className="relative size-[5rem]">
+          <LoadingWithAnimation color="primary" />
+        </div>
+      );
+    if (varQuery.isError) return <NoData />;
+    return <DataTable table={varTable} viewPagination />;
+  })();
+
+  return (
+    <div className="card card-border !mt-6 flex flex-col gap-4">
+      <div className="card card-border">
+        <form
+          onSubmit={handleSearch}
+          className="flex items-end justify-between p-2"
+        >
+          <div className="flex flex-col gap-4">
+            <div className="flex w-full gap-6">
+              <div className="flex items-center gap-2">
+                <Label className="w-[6rem] whitespace-nowrap text-label">
+                  템플릿코드
+                </Label>
+                <Input
+                  className="w-[20rem]"
+                  value={templateCodeInput}
+                  onChange={(e) => setTemplateCodeInput(e.target.value)}
+                />
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="w-[6rem] whitespace-nowrap text-label">
+                  템플릿명
+                </Label>
+                <Input
+                  className="w-[20rem]"
+                  value={templateNameInput}
+                  onChange={(e) => setTemplateNameInput(e.target.value)}
+                />
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="w-[6rem] whitespace-nowrap text-label">
+                  템플릿내용
+                </Label>
+                <Input
+                  className="w-[20rem]"
+                  value={templateContentInput}
+                  onChange={(e) => setTemplateContentInput(e.target.value)}
+                />
+              </div>
+            </div>
+            <div className="flex w-full gap-6">
+              <div className="flex items-center gap-2">
+                <Label className="w-[6rem] whitespace-nowrap text-label">
+                  채널
+                </Label>
+                <Select
+                  value={senderKeyFilter}
+                  onValueChange={setSenderKeyFilter}
+                >
+                  <SelectTrigger className="w-[20rem]">
+                    <SelectValue placeholder="전체" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value={ALL}>전체</SelectItem>
+                    {senderKeyOptions?.map((k) => (
+                      <SelectItem key={k.senderKey} value={k.senderKey}>
+                        {k.name}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="w-[6rem] whitespace-nowrap text-label">
+                  검수상태
+                </Label>
+                <Select
+                  value={inspectionFilter}
+                  onValueChange={setInspectionFilter}
+                >
+                  <SelectTrigger className="w-[20rem]">
+                    <SelectValue placeholder="전체" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value={ALL}>전체</SelectItem>
+                    {inspectionOptions.map((k) => (
+                      <SelectItem key={k} value={k}>
+                        {k}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              </div>
+              <div className="flex items-center gap-2">
+                <Label className="w-[6rem] whitespace-nowrap text-label">
+                  메시지유형
+                </Label>
+                <Select
+                  value={messageTypeFilter}
+                  onValueChange={setMessageTypeFilter}
+                >
+                  <SelectTrigger className="w-[20rem]">
+                    <SelectValue placeholder="전체" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value={ALL}>전체</SelectItem>
+                    {messageTypeOptions.map((k) => (
+                      <SelectItem key={k} value={k}>
+                        {k}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+              </div>
+            </div>
+          </div>
+          <div className="flex gap-2">
+            <Button className="h-[3.2rem]" type="submit">
+              조회
+            </Button>
+            <Button
+              type="button"
+              color="white"
+              className="h-[3.2rem]"
+              onClick={handleReset}
+            >
+              초기화
+            </Button>
+          </div>
+        </form>
+      </div>
+
+      <div className="card card-border">
+        <div className="card-header flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
+          <h3 className="text-2xl font-medium text-label">
+            알림톡 템플릿 관리
+          </h3>
+          <div className="flex flex-wrap gap-2">
+            <Button
+              type="button"
+              color="white"
+              onClick={handleRefreshTemplates}
+              disabled={syncTemplatesMutation.isPending}
+            >
+              템플릿갱신
+            </Button>
+            <Button
+              type="button"
+              color="green"
+              onClick={() => setRegistOpen(true)}
+            >
+              템플릿등록
+            </Button>
+            <Button
+              type="button"
+              color="gray"
+              onClick={handleInspectionRequest}
+              disabled={inspectionRequestMutation.isPending}
+            >
+              선택 검수요청
+            </Button>
+            <Button
+              type="button"
+              color="red"
+              onClick={handleDeleteSelectedTemplates}
+              disabled={deleteTemplatesMutation.isPending}
+            >
+              선택삭제
+            </Button>
+            <Button type="button" onClick={handleSaveTemplateGrid}>
+              저장
+            </Button>
+          </div>
+        </div>
+        <div className="card !m-[1.2rem] !p-0">{templateTableComponent}</div>
+      </div>
+
+      <div className="card card-border">
+        <div className="card-header flex flex-col gap-3 md:flex-row md:items-center md:justify-between">
+          <h3 className="text-2xl font-medium text-label">변수 관리</h3>
+          <div className="flex flex-wrap gap-2">
+            <Button
+              type="button"
+              color="green"
+              className="h-[3.2rem]"
+              onClick={handleAddVarRow}
+            >
+              변수추가
+            </Button>
+            <Button
+              type="button"
+              color="red"
+              className="h-[3.2rem]"
+              onClick={handleDeleteSelectedVars}
+              disabled={deleteVarsMutation.isPending}
+            >
+              선택삭제
+            </Button>
+            <Button
+              type="button"
+              className="h-[3.2rem]"
+              onClick={handleSaveVars}
+              disabled={saveVarsMutation.isPending}
+            >
+              저장
+            </Button>
+          </div>
+        </div>
+        <div className="card !m-[1.2rem] !p-0">{varTableComponent}</div>
+      </div>
+
+      <NtftalkTempDetailDialog
+        templateCode={detailCode}
+        open={detailOpen}
+        onOpenChange={(o) => {
+          setDetailOpen(o);
+          if (!o) setDetailCode(null);
+        }}
+      />
+      <NtftalkTempRegistDialog open={registOpen} onOpenChange={setRegistOpen} />
+    </div>
+  );
+}
+
+export { NtftalkTempPage };
diff --git a/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-regist-dialog.tsx b/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-regist-dialog.tsx
new file mode 100644
index 000000000..8a537e7a2
--- /dev/null
+++ b/apps/cs/src/pages/ntftalk-temp/ui/ntftalk-temp-regist-dialog.tsx
@@ -0,0 +1,442 @@
+"use client";
+
+import { useEffect, useMemo, useState } from "react";
+import { useForm } from "react-hook-form";
+
+import { zodResolver } from "@hookform/resolvers/zod";
+import {
+  keepPreviousData,
+  useQuery,
+  useQueryClient,
+} from "@tanstack/react-query";
+import {
+  getCoreRowModel,
+  type PaginationState,
+  type RowSelectionState,
+} from "@tanstack/react-table";
+
+import { ENDPOINT } from "@/shared/config";
+import { useAlertStore, useDataTable, useMutationWrapper } from "@/shared/lib";
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormMessage,
+} from "@/shared/ui/form";
+import { NoData } from "@/shared/ui/no-data";
+import {
+  NtftalkBiztalkApi,
+  NtftalkTempApi,
+  NtftalkVarApi,
+  type NtftalkVarSearchParams,
+} from "@/entities/ntftalk";
+import {
+  Button,
+  Dialog,
+  DialogContent,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  Input,
+  Label,
+  LoadingWithAnimation,
+  RadioGroup,
+  RadioGroupItem,
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  Textarea,
+} from "@common/components";
+
+import {
+  type NtftalkTempSaveFormData,
+  ntftalkTempSaveFormSchema,
+} from "../model/ntftalk-temp-save-schema";
+import { createVarColumns } from "../model/var-table-columns";
+
+interface NtftalkTempRegistDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+}
+
+const TEMPLATE_MESSAGE_TYPE_BASIC = "BA";
+const SECURITY_TEMPLATE_EMPHASIZE_TYPE = {
+  enabled: "SECURITY",
+  disabled: "NONE",
+} as const;
+
+function NtftalkTempRegistDialog({
+  open,
+  onOpenChange,
+}: NtftalkTempRegistDialogProps) {
+  const [isVarDialogOpen, setIsVarDialogOpen] = useState(false);
+  const [varPagination, setVarPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize: 10,
+  });
+  const [varRowSelection, setVarRowSelection] = useState<RowSelectionState>({});
+  const [varSearchParams] = useState<NtftalkVarSearchParams>({
+    sort: "regDt,desc",
+  });
+
+  const queryClient = useQueryClient();
+  const alert = useAlertStore((s) => s.setMessage);
+  const senderQuery = useQuery({
+    queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_BIZTALK, "sender"],
+    queryFn: () => NtftalkBiztalkApi.getSender(),
+  });
+  const varQuery = useQuery({
+    queryKey: [
+      ENDPOINT.NTFTALK_SERVICE.NTFTALK_VAR,
+      varSearchParams,
+      varPagination,
+    ],
+    queryFn: () =>
+      NtftalkVarApi.getNtftalkVarPage({
+        ...varSearchParams,
+        page: varPagination.pageIndex,
+        size: varPagination.pageSize,
+      }),
+    placeholderData: keepPreviousData,
+    enabled: isVarDialogOpen,
+  });
+
+  const varColumns = useMemo(
+    () =>
+      createVarColumns({
+        onDraftFieldChange: () => {},
+      }),
+    [],
+  );
+  const { tableComponent, tableInstance } = useDataTable({
+    query: varQuery,
+    tableOptions: {
+      columns: varColumns,
+      state: { pagination: varPagination, rowSelection: varRowSelection },
+      manualPagination: true,
+      enableRowSelection: true,
+      enableMultiRowSelection: true,
+      getCoreRowModel: getCoreRowModel(),
+      onPaginationChange: setVarPagination,
+      onRowSelectionChange: setVarRowSelection,
+      getRowId: (row) => `srv:${row.varCd}`,
+    },
+    dataTableOptions: {
+      viewPagination: true,
+    },
+  });
+
+  const form = useForm<NtftalkTempSaveFormData>({
+    resolver: zodResolver(ntftalkTempSaveFormSchema),
+    defaultValues: {
+      templateCode: "",
+      senderKey: "",
+      senderKeyType: "S",
+      templateName: "",
+      templateContent: "",
+      templateMessageType: TEMPLATE_MESSAGE_TYPE_BASIC,
+      templateEmphasizeType: SECURITY_TEMPLATE_EMPHASIZE_TYPE.enabled,
+      templateImageUrl: "",
+    },
+  });
+
+  useEffect(() => {
+    if (!open) return;
+    form.reset();
+  }, [open]);
+
+  const { mutateAsync: saveTemp, isPending } = useMutationWrapper({
+    mutationFn: (data: NtftalkTempSaveFormData) =>
+      NtftalkTempApi.saveNtftalkTemp({
+        ...data,
+        templateImageUrl: data.templateImageUrl || undefined,
+      }),
+    onSuccess: async () => {
+      await queryClient.invalidateQueries({
+        queryKey: [ENDPOINT.NTFTALK_SERVICE.NTFTALK_TEMP],
+      });
+      alert("등록되었습니다.");
+      form.reset();
+      onOpenChange(false);
+    },
+  });
+
+  const onSubmit = form.handleSubmit((data) =>
+    saveTemp({
+      ...data,
+      senderKeyType: "S",
+      templateMessageType: TEMPLATE_MESSAGE_TYPE_BASIC,
+    }),
+  );
+
+  useEffect(() => {
+    if (!senderQuery.data) return;
+    if (form.getValues("senderKey")) return;
+    form.setValue("senderKey", senderQuery.data.senderKey);
+  }, [senderQuery.data, form]);
+
+  function handleInsertVariable() {
+    setIsVarDialogOpen(true);
+  }
+
+  function handleApplySelectedVariables() {
+    const rows = tableInstance.getSelectedRowModel().rows;
+    if (rows.length === 0) {
+      alert("추가할 변수를 선택해 주세요.");
+      return;
+    }
+
+    const varCodes = rows.map((row) => row.original.varCd?.trim() ?? "");
+    if (varCodes.some((varCd) => !varCd)) {
+      alert("선택 항목 중 변수코드가 없는 항목이 있습니다.");
+      return;
+    }
+
+    const currentValue = form.getValues("templateContent");
+    const tokens = varCodes.map((varCd) => `${varCd}`);
+    const appendValue = tokens.join("\n");
+    const nextValue = currentValue
+      ? `${currentValue}\n${appendValue}`
+      : appendValue;
+
+    form.setValue("templateContent", nextValue, {
+      shouldValidate: true,
+      shouldDirty: true,
+    });
+    setVarRowSelection({});
+    setIsVarDialogOpen(false);
+  }
+
+  const varTableComponent = (() => {
+    if (varQuery.isLoading)
+      return (
+        <div className="relative size-[5rem]">
+          <LoadingWithAnimation color="primary" />
+        </div>
+      );
+    if (varQuery.isError) return <NoData />;
+    return tableComponent;
+  })();
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent
+        className="max-h-[85vh] max-w-[64rem] overflow-y-auto"
+        aria-describedby={undefined}
+      >
+        <DialogHeader>
+          <DialogTitle>알림 템플릿 등록</DialogTitle>
+        </DialogHeader>
+        <Form {...form}>
+          <form id="ntftalk-temp-regist-form" onSubmit={onSubmit}>
+            <Table variant="secondary" className="w-full border">
+              <colgroup>
+                <col width="22%" />
+                <col width="78%" />
+              </colgroup>
+              <TableBody>
+                <TableRow>
+                  <TableHead className="px-3 py-2 text-left text-label">
+                    메시지 유형
+                  </TableHead>
+                  <TableCell>기본형</TableCell>
+                </TableRow>
+                <TableRow>
+                  <TableHead className="px-3 py-2 text-left text-label">
+                    채널
+                  </TableHead>
+                  <TableCell>
+                    <FormField
+                      control={form.control}
+                      name="senderKey"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormControl>
+                            <Select
+                              value={field.value}
+                              onValueChange={field.onChange}
+                            >
+                              <SelectTrigger>
+                                <SelectValue placeholder="채널을 선택하세요." />
+                              </SelectTrigger>
+                              <SelectContent>
+                                {senderQuery.data && (
+                                  <SelectItem
+                                    value={senderQuery.data.senderKey}
+                                  >
+                                    {senderQuery.data.uuid}
+                                    {senderQuery.data
+                                      ? `(${senderQuery.data.name})`
+                                      : ""}
+                                  </SelectItem>
+                                )}
+                              </SelectContent>
+                            </Select>
+                          </FormControl>
+                          <FormMessage className="text-[1.2rem]" />
+                        </FormItem>
+                      )}
+                    />
+                  </TableCell>
+                </TableRow>
+                <TableRow>
+                  <TableHead className="px-3 py-2 text-left text-label">
+                    템플릿코드
+                  </TableHead>
+                  <TableCell>
+                    <FormField
+                      control={form.control}
+                      name="templateCode"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormControl>
+                            <Input {...field} />
+                          </FormControl>
+                          <FormMessage className="text-[1.2rem]" />
+                        </FormItem>
+                      )}
+                    />
+                  </TableCell>
+                </TableRow>
+                <TableRow>
+                  <TableHead className="px-3 py-2 text-left text-label">
+                    템플릿명
+                  </TableHead>
+                  <TableCell>
+                    <FormField
+                      control={form.control}
+                      name="templateName"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormControl>
+                            <Input {...field} />
+                          </FormControl>
+                          <FormMessage className="text-[1.2rem]" />
+                        </FormItem>
+                      )}
+                    />
+                  </TableCell>
+                </TableRow>
+                <TableRow>
+                  <TableHead className="px-3 py-2 text-left text-label">
+                    보안템플릿여부
+                  </TableHead>
+                  <TableCell>
+                    <FormField
+                      control={form.control}
+                      name="templateEmphasizeType"
+                      render={({ field }) => (
+                        <FormItem>
+                          <FormControl>
+                            <RadioGroup
+                              value={field.value}
+                              onValueChange={field.onChange}
+                              className="flex items-center gap-8"
+                            >
+                              <div className="flex items-center gap-2">
+                                <RadioGroupItem
+                                  value={
+                                    SECURITY_TEMPLATE_EMPHASIZE_TYPE.enabled
+                                  }
+                                  id="security-enabled"
+                                />
+                                <Label htmlFor="security-enabled">설정</Label>
+                              </div>
+                              <div className="flex items-center gap-2">
+                                <RadioGroupItem
+                                  value={
+                                    SECURITY_TEMPLATE_EMPHASIZE_TYPE.disabled
+                                  }
+                                  id="security-disabled"
+                                />
+                                <Label htmlFor="security-disabled">
+                                  미설정
+                                </Label>
+                              </div>
+                            </RadioGroup>
+                          </FormControl>
+                          <FormMessage className="text-[1.2rem]" />
+                        </FormItem>
+                      )}
+                    />
+                  </TableCell>
+                </TableRow>
+                <TableRow>
+                  <TableHead className="px-3 py-2 text-left align-top text-label">
+                    템플릿내용
+                  </TableHead>
+                  <TableCell>
+                    <FormField
+                      control={form.control}
+                      name="templateContent"
+                      render={({ field }) => (
+                        <FormItem>
+                          <div className="flex justify-end">
+                            <Button
+                              type="button"
+                              color="white"
+                              size="sm"
+                              onClick={handleInsertVariable}
+                            >
+                              + 변수추가
+                            </Button>
+                          </div>
+                          <FormControl>
+                            <Textarea
+                              className="min-h-[20rem] resize-none !text-[1.3rem]"
+                              {...field}
+                            />
+                          </FormControl>
+                          <FormMessage className="text-[1.2rem]" />
+                        </FormItem>
+                      )}
+                    />
+                  </TableCell>
+                </TableRow>
+              </TableBody>
+            </Table>
+          </form>
+        </Form>
+        <DialogFooter>
+          <Button
+            type="submit"
+            form="ntftalk-temp-regist-form"
+            disabled={isPending}
+          >
+            저장
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+      <Dialog open={isVarDialogOpen} onOpenChange={setIsVarDialogOpen}>
+        <DialogContent className="max-h-[80vh] max-w-[96rem] overflow-y-auto">
+          <DialogHeader>
+            <DialogTitle>변수 목록</DialogTitle>
+          </DialogHeader>
+          {varTableComponent}
+          <DialogFooter>
+            <Button
+              type="button"
+              color="white"
+              onClick={() => setIsVarDialogOpen(false)}
+            >
+              취소
+            </Button>
+            <Button type="button" onClick={handleApplySelectedVariables}>
+              추가
+            </Button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+    </Dialog>
+  );
+}
+
+export { NtftalkTempRegistDialog };
diff --git a/apps/cs/src/pages/popup/ui/popup-page.tsx b/apps/cs/src/pages/popup/ui/popup-page.tsx
index e55e5652b..3ce6d131a 100644
--- a/apps/cs/src/pages/popup/ui/popup-page.tsx
+++ b/apps/cs/src/pages/popup/ui/popup-page.tsx
@@ -48,7 +48,7 @@ function PopupPage() {
     placeholderData: keepPreviousData,
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx b/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx
index ffce1c92d..f5f26bb98 100644
--- a/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx
+++ b/apps/cs/src/pages/privacylog/ui/privacylog-page.tsx
@@ -77,7 +77,7 @@ function PrivacyLogPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/recent/ui/recent-page.tsx b/apps/cs/src/pages/recent/ui/recent-page.tsx
index a2b0eeb00..803317669 100644
--- a/apps/cs/src/pages/recent/ui/recent-page.tsx
+++ b/apps/cs/src/pages/recent/ui/recent-page.tsx
@@ -127,7 +127,7 @@ function RecentPage() {
 
   const isSelectedRow = table.getFilteredSelectedRowModel().rows.length > 0;
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setIsDeletePostData(delYn === "Y");
     setPagination({
diff --git a/apps/cs/src/pages/role/ui/mapping-role-dialog.tsx b/apps/cs/src/pages/role/ui/mapping-role-dialog.tsx
index e327fb88e..165f5c942 100644
--- a/apps/cs/src/pages/role/ui/mapping-role-dialog.tsx
+++ b/apps/cs/src/pages/role/ui/mapping-role-dialog.tsx
@@ -83,7 +83,7 @@ function MappingRoleDialog({
     );
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     const formData = new FormData(e.target as HTMLFormElement);
     const keyword = formData.get("keyword") as string;
diff --git a/apps/cs/src/pages/role/ui/role-page.tsx b/apps/cs/src/pages/role/ui/role-page.tsx
index 97c3d615b..47d3d9a9e 100644
--- a/apps/cs/src/pages/role/ui/role-page.tsx
+++ b/apps/cs/src/pages/role/ui/role-page.tsx
@@ -64,7 +64,7 @@ function RolePage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/site/ui/site-page.tsx b/apps/cs/src/pages/site/ui/site-page.tsx
index 046c80142..fbdd9d36c 100644
--- a/apps/cs/src/pages/site/ui/site-page.tsx
+++ b/apps/cs/src/pages/site/ui/site-page.tsx
@@ -35,7 +35,7 @@ function SitePage() {
     placeholderData: keepPreviousData,
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setSearchParams({
       ...searchParams,
diff --git a/apps/cs/src/pages/survey/ui/survey-page.tsx b/apps/cs/src/pages/survey/ui/survey-page.tsx
index bce024f4f..27f080343 100644
--- a/apps/cs/src/pages/survey/ui/survey-page.tsx
+++ b/apps/cs/src/pages/survey/ui/survey-page.tsx
@@ -71,7 +71,7 @@ function SurveyPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/template/ui/template-page.tsx b/apps/cs/src/pages/template/ui/template-page.tsx
index de3dca8ff..d4ceb3bca 100644
--- a/apps/cs/src/pages/template/ui/template-page.tsx
+++ b/apps/cs/src/pages/template/ui/template-page.tsx
@@ -37,7 +37,7 @@ function TemplatePage() {
     placeholderData: keepPreviousData,
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setSearchParams({
       ...searchParams,
diff --git a/apps/cs/src/pages/terms/ui/terms-page.tsx b/apps/cs/src/pages/terms/ui/terms-page.tsx
index 08a6e2080..ea00276df 100644
--- a/apps/cs/src/pages/terms/ui/terms-page.tsx
+++ b/apps/cs/src/pages/terms/ui/terms-page.tsx
@@ -38,7 +38,7 @@ function TermsPage() {
     placeholderData: keepPreviousData,
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/pages/user-statistics/ui/user-statistics-page.tsx b/apps/cs/src/pages/user-statistics/ui/user-statistics-page.tsx
index b4c821551..d562d0103 100644
--- a/apps/cs/src/pages/user-statistics/ui/user-statistics-page.tsx
+++ b/apps/cs/src/pages/user-statistics/ui/user-statistics-page.tsx
@@ -148,7 +148,7 @@ function UserStatisticsPage() {
     setPresetDateRange("");
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     const params: ConnectionStatisticsParams = {
       keywordType,
diff --git a/apps/cs/src/pages/users/ui/users-page.tsx b/apps/cs/src/pages/users/ui/users-page.tsx
index 5362b8b42..5670eb9d3 100644
--- a/apps/cs/src/pages/users/ui/users-page.tsx
+++ b/apps/cs/src/pages/users/ui/users-page.tsx
@@ -102,7 +102,7 @@ function UsersPage() {
     },
   });
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     setPagination({
       ...pagination,
diff --git a/apps/cs/src/shared/config/api.ts b/apps/cs/src/shared/config/api.ts
index db8eda72c..e577c5bb1 100644
--- a/apps/cs/src/shared/config/api.ts
+++ b/apps/cs/src/shared/config/api.ts
@@ -66,6 +66,12 @@ export const ENDPOINT = {
     POST_EVALUATION: "/board-service/api/v1/pstEvl",
     STATISTICS: "/board-service/api/v1/stat/bbs",
   },
+  NTFTALK_SERVICE: {
+    NTFTALK_VAR: "/ntftalk-service/api/v1/ntftalk-var",
+    NTFTALK_TEMP: "/ntftalk-service/api/v1/ntftalk-temp",
+    NTFTALK_BIZTALK: "/ntftalk-service/api/v1/ntftalk-biztalk",
+    MMT_LOG_HISTORY: "/ntftalk-service/api/v1/ata/mmt-log-history",
+  },
 };
 
 export const JWT_EXPIRATION_TIME = 1800000;
diff --git a/apps/cs/src/shared/config/auth.ts b/apps/cs/src/shared/config/auth.ts
new file mode 100644
index 000000000..d903525af
--- /dev/null
+++ b/apps/cs/src/shared/config/auth.ts
@@ -0,0 +1,16 @@
+import type { AuthConfig } from "@common/auth";
+import {
+  ACCESS_TOKEN,
+  AUTH_USER_ID,
+  CLAIM_NAME,
+  COOKIE_DOMAIN,
+  REFRESH_TOKEN,
+} from "./env";
+
+export const authConfig: AuthConfig = {
+  authUserId: AUTH_USER_ID || "token-id",
+  claimName: CLAIM_NAME || "Authorization",
+  cookieDomain: COOKIE_DOMAIN,
+  accessToken: ACCESS_TOKEN || "access-token",
+  refreshToken: REFRESH_TOKEN || "refresh-token",
+};
diff --git a/apps/cs/src/shared/config/env.ts b/apps/cs/src/shared/config/env.ts
index 95d1a4477..5e1392b4d 100644
--- a/apps/cs/src/shared/config/env.ts
+++ b/apps/cs/src/shared/config/env.ts
@@ -11,3 +11,4 @@ export const ACCESS_TOKEN =
 export const REFRESH_TOKEN =
   process.env.NEXT_PUBLIC_REFRESH_TOKEN || "refresh-token";
 export const AUTH_USER_ID = process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id";
+export const COOKIE_DOMAIN = process.env.NEXT_PUBLIC_COOKIE_DOMAIN;
diff --git a/apps/cs/src/shared/ui/input-date-range-picker.tsx b/apps/cs/src/shared/ui/input-date-range-picker.tsx
index 1ee2bc5e1..ec7c5b5b4 100644
--- a/apps/cs/src/shared/ui/input-date-range-picker.tsx
+++ b/apps/cs/src/shared/ui/input-date-range-picker.tsx
@@ -1,20 +1,24 @@
-import { InputDatePicker } from "@common/components";
 import { useEffect } from "react";
+
+import { InputDatePicker } from "@common/components";
+
 import { useAlertStore } from "../lib";
 
 type DateRange = {
-  from?: Date;
-  to?: Date;
+  from?: Date | null;
+  to?: Date | null;
 };
 
 type InputDateRangePickerProps = {
   dateRange: DateRange;
   setDateRange: (dateRange: DateRange) => void;
+  disabled?: boolean;
 };
 
 function InputDateRangePicker({
   dateRange,
   setDateRange,
+  disabled,
 }: InputDateRangePickerProps) {
   const alert = useAlertStore((state) => state.setMessage);
 
@@ -32,6 +36,7 @@ function InputDateRangePicker({
         onChange={(date) => {
           setDateRange({ ...dateRange, from: date });
         }}
+        disabled={disabled}
       />
       ~
       <InputDatePicker
@@ -39,6 +44,7 @@ function InputDateRangePicker({
         onChange={(date) => {
           setDateRange({ ...dateRange, to: date });
         }}
+        disabled={disabled}
       />
     </>
   );
diff --git a/apps/cs/src/widgets/post/ui/post-page.tsx b/apps/cs/src/widgets/post/ui/post-page.tsx
index 850513a94..4b6e374c0 100644
--- a/apps/cs/src/widgets/post/ui/post-page.tsx
+++ b/apps/cs/src/widgets/post/ui/post-page.tsx
@@ -135,7 +135,7 @@ function PostPage({ bbsId }: { bbsId: string }) {
     refetch();
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     refetch();
   };
diff --git a/apps/dc/src/pages/auth/login/ui/login-page.tsx b/apps/dc/src/pages/auth/login/ui/login-page.tsx
index 92f5935ed..0164e4327 100644
--- a/apps/dc/src/pages/auth/login/ui/login-page.tsx
+++ b/apps/dc/src/pages/auth/login/ui/login-page.tsx
@@ -6,7 +6,7 @@ import { LoginApi } from "@/entities/auth";
 import "./login.css";
 
 function LoginPage() {
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
 
     const formData = new FormData(e.target as HTMLFormElement);
diff --git a/apps/dc/src/pages/category/ui/category-page.tsx b/apps/dc/src/pages/category/ui/category-page.tsx
index 29f8ef71b..dfb262698 100644
--- a/apps/dc/src/pages/category/ui/category-page.tsx
+++ b/apps/dc/src/pages/category/ui/category-page.tsx
@@ -39,8 +39,10 @@ type TreeNode = {
 function CategoryPage() {
   const router = useRouter();
   const [treeData, setTreeData] = useState<NodeModel<TreeNode>[]>([]);
-  const [selectedParentNode, setSelectedParentNode] = useState<NodeModel<TreeNode> | null>(null);
-  const [selectedSubNode, setSelectedSubNode] = useState<NodeModel<TreeNode> | null>(null);
+  const [selectedParentNode, setSelectedParentNode] =
+    useState<NodeModel<TreeNode> | null>(null);
+  const [selectedSubNode, setSelectedSubNode] =
+    useState<NodeModel<TreeNode> | null>(null);
   const [categoryQuery, setSearchText] = useState<CategoryParams>({
     clsfSystmNm: "",
   });
@@ -48,7 +50,9 @@ function CategoryPage() {
   const [loading, setLoading] = useState(false);
   const { setMessage: showAlert } = useAlertStore((state) => state);
   const { confirm } = useConfirm();
-  const [dialog, setDialog] = useState<null | { type: "add" | "edit" | "delete" }>(null);
+  const [dialog, setDialog] = useState<null | {
+    type: "add" | "edit" | "delete";
+  }>(null);
   const userUnqId = useUserStore((state) => state.userInfo?.userUnqId || "");
   const userInfo = useUserStore((state) => state.userInfo);
   const [expandedIds, setExpandedIds] = useState<(string | number)[]>([]);
@@ -57,7 +61,8 @@ function CategoryPage() {
   const categoryNameInputRef = useRef<HTMLInputElement>(null);
   const [showCategoryNameError, setShowCategoryNameError] = useState(false);
   const [isAddingMode, setIsAddingMode] = useState(false);
-  const [addingParentNode, setAddingParentNode] = useState<NodeModel<TreeNode> | null>(null);
+  const [addingParentNode, setAddingParentNode] =
+    useState<NodeModel<TreeNode> | null>(null);
 
   const { data: categoryList, refetch } = useQuery({
     queryKey: [ENDPOINT.DC_SERVICE.CATEGORY],
@@ -70,20 +75,18 @@ function CategoryPage() {
     refetch();
   }, [refetch]);
 
-
-
   const handleDrop = (newTreeData: NodeModel<TreeNode>[]) => {
     setTreeData(newTreeData);
   };
 
   useEffect(() => {
-    const treeElement = document.querySelector('.tree-container');
+    const treeElement = document.querySelector(".tree-container");
     if (treeElement) {
-      expandedIds.forEach(id => {
+      expandedIds.forEach((id) => {
         const nodeElement = treeElement.querySelector(`[data-id="${id}"]`);
         if (nodeElement) {
-          const toggleButton = nodeElement.querySelector('.toggle-button');
-          if (toggleButton && !nodeElement.classList.contains('expanded')) {
+          const toggleButton = nodeElement.querySelector(".toggle-button");
+          if (toggleButton && !nodeElement.classList.contains("expanded")) {
             (toggleButton as HTMLElement).click();
           }
         }
@@ -91,7 +94,7 @@ function CategoryPage() {
     }
   }, [expandedIds]);
 
-  const handleSearch = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSearch = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     if (!searchTerm.trim()) {
       showAlert("검색어를 입력해주세요");
@@ -99,7 +102,9 @@ function CategoryPage() {
     }
 
     const searchResults = treeData.filter((node) =>
-      (node.text ?? "").toLowerCase().includes((searchTerm ?? "").toLowerCase())
+      (node.text ?? "")
+        .toLowerCase()
+        .includes((searchTerm ?? "").toLowerCase()),
     );
 
     if (searchResults.length === 0) {
@@ -138,7 +143,7 @@ function CategoryPage() {
       setNewCategoryName("");
     } else {
       setSelectedSubNode(node);
-      const parentNode = treeData.find(n => n.id === node.parent) || null;
+      const parentNode = treeData.find((n) => n.id === node.parent) || null;
       setSelectedParentNode(parentNode);
       setNewCategoryName(node.text || "");
 
@@ -147,7 +152,7 @@ function CategoryPage() {
       const newExpandedIds = new Set(expandedIds);
       while (parentId && parentId !== 0 && parentId !== "0") {
         newExpandedIds.add(parentId);
-        const parentNode = treeData.find(n => n.id === parentId);
+        const parentNode = treeData.find((n) => n.id === parentId);
         if (parentNode) {
           parentId = parentNode.parent;
         } else {
@@ -230,7 +235,7 @@ function CategoryPage() {
         showAlert("수정할 분류 구조를 선택해주세요.");
         return;
       }
-     
+
       setLoading(true);
       try {
         await CategoryApi.updateCategory({
@@ -283,7 +288,7 @@ function CategoryPage() {
         showAlert("상위 분류를 선택해주세요.");
         return;
       }
-      
+
       setLoading(true);
       try {
         await CategoryApi.createCategory({
@@ -362,7 +367,7 @@ function CategoryPage() {
       // 백엔드에서 트리 구조로 반환하므로 flat 구조로 변환
       const flattenTree = (nodes: any[], parentId = "0"): any[] => {
         const result: any[] = [];
-        
+
         nodes.forEach((node) => {
           // 현재 노드를 flat 구조로 추가
           result.push({
@@ -371,65 +376,67 @@ function CategoryPage() {
             droppable: node.droppAble,
             text: node.clsfSystmNm,
           });
-          
+
           // 자식 노드들이 있으면 재귀적으로 처리
           if (node.children && node.children.length > 0) {
             result.push(...flattenTree(node.children, node.clsfSystmSn));
           }
         });
-        
+
         return result;
       };
-      
+
       const mappedData = flattenTree(categoryList);
-      
+
       // 트리 데이터를 영문순서, 한글순서로 정렬 (각 레벨별로)
       const sortTreeData = (nodes: typeof mappedData): typeof mappedData => {
         // 부모별로 그룹화
         const groupedByParent = new Map<string, typeof mappedData>();
-        
-        nodes.forEach(node => {
+
+        nodes.forEach((node) => {
           const parent = node.parent;
           if (!groupedByParent.has(parent)) {
             groupedByParent.set(parent, []);
           }
           groupedByParent.get(parent)!.push(node);
         });
-        
+
         // 각 그룹 내에서 정렬 (최상위 부모부터)
-        const sortedGroups = Array.from(groupedByParent.entries()).sort(([parentA], [parentB]) => {
-          // 최상위 부모("0")를 먼저 정렬
-          if (parentA === "0" && parentB !== "0") return -1;
-          if (parentA !== "0" && parentB === "0") return 1;
-          return 0;
-        });
-        
+        const sortedGroups = Array.from(groupedByParent.entries()).sort(
+          ([parentA], [parentB]) => {
+            // 최상위 부모("0")를 먼저 정렬
+            if (parentA === "0" && parentB !== "0") return -1;
+            if (parentA !== "0" && parentB === "0") return 1;
+            return 0;
+          },
+        );
+
         sortedGroups.forEach(([parent, children]) => {
           children.sort((a, b) => {
             const textA = a.text || "";
             const textB = b.text || "";
-            
+
             // 영문이 먼저 오도록 정렬
             const isEnglishA = /^[a-zA-Z]/.test(textA);
             const isEnglishB = /^[a-zA-Z]/.test(textB);
-            
+
             if (isEnglishA && !isEnglishB) return -1;
             if (!isEnglishA && isEnglishB) return 1;
-            
+
             // 같은 언어 내에서는 알파벳/가나다순 정렬
-            return textA.localeCompare(textB, ['ko', 'en']);
+            return textA.localeCompare(textB, ["ko", "en"]);
           });
         });
-        
+
         // 정렬된 결과를 다시 합치기 (순서 보장)
         const sortedData: typeof mappedData = [];
         sortedGroups.forEach(([parent, children]) => {
           sortedData.push(...children);
         });
-        
+
         return sortedData;
       };
-      
+
       // 각 레벨별로 정렬
       const sortedData = sortTreeData(mappedData);
       setTreeData(sortedData);
@@ -443,8 +450,12 @@ function CategoryPage() {
 
     const filterTree = (nodes: NodeModel<TreeNode>[]) => {
       return nodes.reduce((acc: NodeModel<TreeNode>[], node) => {
-        const nodeMatches = (node.text ?? "").toLowerCase().includes((searchTerm ?? "").toLowerCase());
-        const filteredChildren = node.droppable ? filterTree(treeData.filter(n => n.parent === node.id)) : [];
+        const nodeMatches = (node.text ?? "")
+          .toLowerCase()
+          .includes((searchTerm ?? "").toLowerCase());
+        const filteredChildren = node.droppable
+          ? filterTree(treeData.filter((n) => n.parent === node.id))
+          : [];
 
         if (nodeMatches || filteredChildren.length > 0) {
           acc.push(node);
@@ -466,14 +477,16 @@ function CategoryPage() {
     setAddingParentNode(null);
   };
 
-  useEffect(() => {
-  }, [userInfo, userUnqId]);
+  useEffect(() => {}, [userInfo, userUnqId]);
 
   return (
     <PageLayout pageTitle="자료관 분류 관리">
-      <div className="card !mb-0 flex flex-col !min-h-[calc(100vh-16.8rem)]">
+      <div className="card !mb-0 flex !min-h-[calc(100vh-16.8rem)] flex-col">
         <div className="card card-border">
-          <form onSubmit={handleSearch} className="flex items-center gap-2 p-2 mb-2">
+          <form
+            onSubmit={handleSearch}
+            className="mb-2 flex items-center gap-2 p-2"
+          >
             <label htmlFor="category-search" className="mr-2 text-label">
               분류명
             </label>
@@ -484,50 +497,55 @@ function CategoryPage() {
               value={searchTerm}
               onChange={(e) => setSearchTerm(e.target.value)}
             />
-            <Button className="h-[3.6rem] rounded-sm text-[1.3rem]" type="submit">
+            <Button
+              className="h-[3.6rem] rounded-sm text-[1.3rem]"
+              type="submit"
+            >
               검색
             </Button>
-            <Button 
-              type="button" 
-              className="h-[3.6rem] !bg-gray-600 hover:!bg-gray-600 flex items-center gap-2" 
+            <Button
+              type="button"
+              className="flex h-[3.6rem] items-center gap-2 !bg-gray-600 hover:!bg-gray-600"
               onClick={handleReset}
             >
-              <RotateCcw className="w-4 h-4" />
+              <RotateCcw className="h-4 w-4" />
               초기화
             </Button>
           </form>
         </div>
-        <div className="flex flex-1 gap-2 min-h-0">
-          <div className="card card-border w-[60%] flex flex-col">
+        <div className="flex min-h-0 flex-1 gap-2">
+          <div className="card card-border flex w-[60%] flex-col">
             <div className="card-header">
-              <h3 className="text-2xl font-medium text-label">자료관 분류 트리</h3>
+              <h3 className="text-2xl font-medium text-label">
+                자료관 분류 트리
+              </h3>
             </div>
-            <div 
-              className="p-4 flex-1 min-h-0 max-h-[60vh] overflow-y-auto tree-container"
+            <div
+              className="tree-container max-h-[60vh] min-h-0 flex-1 overflow-y-auto p-4"
               onDragOver={(e) => {
                 // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                if (e.dataTransfer.types.includes('Files')) {
+                if (e.dataTransfer.types.includes("Files")) {
                   e.preventDefault();
                   e.stopPropagation();
                 }
               }}
               onDrop={(e) => {
                 // 파일 드롭은 방지하되, 트리 내부 드롭은 허용
-                if (e.dataTransfer.types.includes('Files')) {
+                if (e.dataTransfer.types.includes("Files")) {
                   e.preventDefault();
                   e.stopPropagation();
                 }
               }}
               onDragEnter={(e) => {
                 // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                if (e.dataTransfer.types.includes('Files')) {
+                if (e.dataTransfer.types.includes("Files")) {
                   e.preventDefault();
                   e.stopPropagation();
                 }
               }}
               onDragLeave={(e) => {
                 // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                if (e.dataTransfer.types.includes('Files')) {
+                if (e.dataTransfer.types.includes("Files")) {
                   e.preventDefault();
                   e.stopPropagation();
                 }
@@ -543,41 +561,50 @@ function CategoryPage() {
                   insertDroppableFirst={false}
                   canDrop={() => false}
                   render={(node, { depth, isOpen, onToggle }) => {
-                    const isExpanded = expandedIds.map(String).includes(String(node.id));
-                    const isSearchResult = searchTerm && (node.text ?? "").toLowerCase().includes(searchTerm.toLowerCase());
-                    
+                    const isExpanded = expandedIds
+                      .map(String)
+                      .includes(String(node.id));
+                    const isSearchResult =
+                      searchTerm &&
+                      (node.text ?? "")
+                        .toLowerCase()
+                        .includes(searchTerm.toLowerCase());
+
                     return (
                       <div
-                        ref={el => {
+                        ref={(el) => {
                           if (isSearchResult) {
-                            searchResultRefs.current = [...searchResultRefs.current, el];
+                            searchResultRefs.current = [
+                              ...searchResultRefs.current,
+                              el,
+                            ];
                           }
                         }}
                         data-id={node.id}
                         onDragOver={(e) => {
                           // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                          if (e.dataTransfer.types.includes('Files')) {
+                          if (e.dataTransfer.types.includes("Files")) {
                             e.preventDefault();
                             e.stopPropagation();
                           }
                         }}
                         onDrop={(e) => {
                           // 파일 드롭은 방지하되, 트리 내부 드롭은 허용
-                          if (e.dataTransfer.types.includes('Files')) {
+                          if (e.dataTransfer.types.includes("Files")) {
                             e.preventDefault();
                             e.stopPropagation();
                           }
                         }}
                         onDragEnter={(e) => {
                           // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                          if (e.dataTransfer.types.includes('Files')) {
+                          if (e.dataTransfer.types.includes("Files")) {
                             e.preventDefault();
                             e.stopPropagation();
                           }
                         }}
                         onDragLeave={(e) => {
                           // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                          if (e.dataTransfer.types.includes('Files')) {
+                          if (e.dataTransfer.types.includes("Files")) {
                             e.preventDefault();
                             e.stopPropagation();
                           }
@@ -586,35 +613,46 @@ function CategoryPage() {
                           handleSelect(node);
                           if (node.droppable) {
                             onToggle();
-                            setExpandedIds(prev => {
+                            setExpandedIds((prev) => {
                               const idStr = String(node.id);
                               const prevStr = prev.map(String);
-                              const isCurrentlyExpanded = prevStr.includes(idStr);
+                              const isCurrentlyExpanded =
+                                prevStr.includes(idStr);
                               if (isCurrentlyExpanded) {
                                 // 닫는 동작: 하위 노드에 선택된 노드가 있으면 선택 해제
                                 // 하위 노드 id 목록 구하기
-                                const getDescendantIds = (parentId: string | number): (string | number)[] => {
-                                  const children = treeData.filter(n => n.parent === parentId);
-                                  let all = children.map(n => n.id);
-                                  children.forEach(child => {
-                                    all = all.concat(getDescendantIds(child.id));
+                                const getDescendantIds = (
+                                  parentId: string | number,
+                                ): (string | number)[] => {
+                                  const children = treeData.filter(
+                                    (n) => n.parent === parentId,
+                                  );
+                                  let all = children.map((n) => n.id);
+                                  children.forEach((child) => {
+                                    all = all.concat(
+                                      getDescendantIds(child.id),
+                                    );
                                   });
                                   return all;
                                 };
                                 const descendants = getDescendantIds(node.id);
                                 if (
                                   selectedSubNode &&
-                                  (descendants.includes(selectedSubNode.id) || selectedSubNode.id === node.id)
+                                  (descendants.includes(selectedSubNode.id) ||
+                                    selectedSubNode.id === node.id)
                                 ) {
                                   setSelectedSubNode(null);
                                   setSelectedParentNode(null);
                                   setNewCategoryName("");
                                 }
-                                return prevStr.filter(id => id !== idStr);
+                                return prevStr.filter((id) => id !== idStr);
                               } else {
                                 // 여는 동작: 자동 선택
                                 setSelectedSubNode(node);
-                                setSelectedParentNode(treeData.find(n => n.id === node.parent) || null);
+                                setSelectedParentNode(
+                                  treeData.find((n) => n.id === node.parent) ||
+                                    null,
+                                );
                                 setNewCategoryName(node.text || "");
                                 return [...prevStr, idStr];
                               }
@@ -622,68 +660,72 @@ function CategoryPage() {
                           }
                         }}
                         style={{ paddingLeft: `${depth * 16}px` }}
-                        className={`cursor-pointer py-3 border-b border-gray-200 flex items-center transition-colors
-                          ${String(selectedSubNode?.id) === String(node.id)
+                        className={`flex cursor-pointer items-center border-b border-gray-200 py-3 transition-colors ${
+                          String(selectedSubNode?.id) === String(node.id)
                             ? "bg-blue-100"
                             : isSearchResult
                               ? "bg-sky-100"
-                              : "hover:bg-gray-100"}
-                          ${isExpanded ? 'expanded' : ''}
-                        `}
+                              : "hover:bg-gray-100"
+                        } ${isExpanded ? "expanded" : ""} `}
                       >
                         {node.droppable && (
                           <span
                             onDragOver={(e) => {
                               // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                              if (e.dataTransfer.types.includes('Files')) {
+                              if (e.dataTransfer.types.includes("Files")) {
                                 e.preventDefault();
                                 e.stopPropagation();
                               }
                             }}
                             onDrop={(e) => {
                               // 파일 드롭은 방지하되, 트리 내부 드롭은 허용
-                              if (e.dataTransfer.types.includes('Files')) {
+                              if (e.dataTransfer.types.includes("Files")) {
                                 e.preventDefault();
                                 e.stopPropagation();
                               }
                             }}
                             onDragEnter={(e) => {
                               // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                              if (e.dataTransfer.types.includes('Files')) {
+                              if (e.dataTransfer.types.includes("Files")) {
                                 e.preventDefault();
                                 e.stopPropagation();
                               }
                             }}
                             onDragLeave={(e) => {
                               // 파일 드래그는 방지하되, 트리 내부 드래그는 허용
-                              if (e.dataTransfer.types.includes('Files')) {
+                              if (e.dataTransfer.types.includes("Files")) {
                                 e.preventDefault();
                                 e.stopPropagation();
                               }
                             }}
-                            onClick={e => {
+                            onClick={(e) => {
                               e.stopPropagation();
                               onToggle();
-                              setExpandedIds(prev => {
+                              setExpandedIds((prev) => {
                                 const idStr = String(node.id);
                                 const prevStr = prev.map(String);
-                                const isCurrentlyExpanded = prevStr.includes(idStr);
+                                const isCurrentlyExpanded =
+                                  prevStr.includes(idStr);
                                 if (isCurrentlyExpanded) {
-                                  return prevStr.filter(id => id !== idStr);
+                                  return prevStr.filter((id) => id !== idStr);
                                 } else {
                                   setSelectedSubNode(node);
-                                  setSelectedParentNode(treeData.find(n => n.id === node.parent) || null);
+                                  setSelectedParentNode(
+                                    treeData.find(
+                                      (n) => n.id === node.parent,
+                                    ) || null,
+                                  );
                                   setNewCategoryName(node.text || "");
                                   return [...prevStr, idStr];
                                 }
                               });
                             }}
-                            className="mr-2 flex items-center justify-center cursor-pointer toggle-button"
+                            className="toggle-button mr-2 flex cursor-pointer items-center justify-center"
                           >
                             {isExpanded ? (
-                              <ChevronDown className="w-4 h-4 text-gray-500" />
+                              <ChevronDown className="h-4 w-4 text-gray-500" />
                             ) : (
-                              <ChevronRight className="w-4 h-4 text-gray-400" />
+                              <ChevronRight className="h-4 w-4 text-gray-400" />
                             )}
                           </span>
                         )}
@@ -695,36 +737,46 @@ function CategoryPage() {
               </DndProvider>
             </div>
           </div>
-          <div className="card card-border flex-1 flex flex-col w-[60%] overflow-y-auto">
+          <div className="card card-border flex w-[60%] flex-1 flex-col overflow-y-auto">
             <div className="card-header">
               <h3 className="text-2xl font-medium text-label">분류 추가</h3>
             </div>
-            <div className="p-4 flex-1 flex flex-col">
+            <div className="flex flex-1 flex-col p-4">
               <div>
                 <div className="mb-[10px]">
-                  <label className="block text-md font-medium text-label mb-1">
+                  <label className="text-md mb-1 block font-medium text-label">
                     상위 항목
                   </label>
                   <input
                     type="text"
-                    className="w-full rounded border px-3 py-2 h-[3.2rem] !text-[1.3rem] bg-gray-200 cursor-not-allowed"
+                    className="h-[3.2rem] w-full cursor-not-allowed rounded border bg-gray-200 px-3 py-2 !text-[1.3rem]"
                     readOnly
                     placeholder="상위 분류를 선택해주세요"
-                    value={isAddingMode ? (addingParentNode?.text || "") : (selectedParentNode?.text || "")}
+                    value={
+                      isAddingMode
+                        ? addingParentNode?.text || ""
+                        : selectedParentNode?.text || ""
+                    }
                   />
                 </div>
 
                 <div className="mb-[10px]">
-                  <label className="block text-md font-medium text-label mb-1 flex items-center">
+                  <label className="text-md mb-1 block flex items-center font-medium text-label">
                     <span className="text-red-500">*</span> 분류 이름
                   </label>
                   <input
                     ref={categoryNameInputRef}
                     type="text"
-                    className={`w-full rounded border px-3 py-2 h-[3.2rem] !text-[1.3rem] ${
-                      showCategoryNameError ? 'border-red-500 focus:border-red-500 focus:ring-red-500' : 'border-gray-300 focus:border-blue-500 focus:ring-blue-500'
+                    className={`h-[3.2rem] w-full rounded border px-3 py-2 !text-[1.3rem] ${
+                      showCategoryNameError
+                        ? "border-red-500 focus:border-red-500 focus:ring-red-500"
+                        : "border-gray-300 focus:border-blue-500 focus:ring-blue-500"
                     }`}
-                    placeholder={isAddingMode ? "새로 추가할 분류 이름을 입력해주세요" : "분류 이름을 입력해주세요"}
+                    placeholder={
+                      isAddingMode
+                        ? "새로 추가할 분류 이름을 입력해주세요"
+                        : "분류 이름을 입력해주세요"
+                    }
                     value={newCategoryName}
                     onChange={(e) => {
                       setNewCategoryName(e.target.value);
@@ -735,17 +787,17 @@ function CategoryPage() {
                     readOnly={false}
                   />
                   {showCategoryNameError && (
-                    <p className="text-red-600 text-sm mt-2"></p>
+                    <p className="mt-2 text-sm text-red-600"></p>
                   )}
                 </div>
               </div>
-              <div className="flex-1 flex flex-col justify-end">
-                <div className="flex justify-end mt-10 gap-2">
+              <div className="flex flex-1 flex-col justify-end">
+                <div className="mt-10 flex justify-end gap-2">
                   {isAddingMode ? (
                     <>
                       <button
                         type="button"
-                        className="bg-primary text-white px-8 py-2 rounded-sm hover:bg-primary/80 text-md h-[3.2rem]"
+                        className="hover:bg-primary/80 text-md h-[3.2rem] rounded-sm bg-primary px-8 py-2 text-white"
                         onClick={() => setDialog({ type: "add" })}
                         disabled={loading}
                       >
@@ -753,7 +805,7 @@ function CategoryPage() {
                       </button>
                       <button
                         type="button"
-                        className="bg-gray-500 text-white px-8 py-2 rounded-sm hover:bg-gray-600 text-md h-[3.2rem]"
+                        className="text-md h-[3.2rem] rounded-sm bg-gray-500 px-8 py-2 text-white hover:bg-gray-600"
                         onClick={() => {
                           setIsAddingMode(false);
                           setAddingParentNode(null);
@@ -771,7 +823,7 @@ function CategoryPage() {
                     <>
                       <button
                         type="button"
-                        className="bg-primary text-white px-8 py-2 rounded-sm hover:bg-primary/80 text-md h-[3.2rem]"
+                        className="hover:bg-primary/80 text-md h-[3.2rem] rounded-sm bg-primary px-8 py-2 text-white"
                         onClick={handleAddCategory}
                         disabled={loading}
                       >
@@ -779,7 +831,7 @@ function CategoryPage() {
                       </button>
                       <button
                         type="button"
-                        className="bg-gray-600 text-white px-8 py-2 rounded-sm hover:bg-gray-700 text-md h-[3.2rem]"
+                        className="text-md h-[3.2rem] rounded-sm bg-gray-600 px-8 py-2 text-white hover:bg-gray-700"
                         onClick={handleEditCategory}
                         disabled={loading}
                       >
@@ -787,7 +839,7 @@ function CategoryPage() {
                       </button>
                       <button
                         type="button"
-                        className="bg-red-600 text-white px-8 py-2 rounded-sm hover:bg-red-700 text-md h-[3.2rem] cursor-pointer"
+                        className="text-md h-[3.2rem] cursor-pointer rounded-sm bg-red-600 px-8 py-2 text-white hover:bg-red-700"
                         onClick={handleDeleteCategory}
                         disabled={!selectedSubNode || loading}
                       >
@@ -807,10 +859,10 @@ function CategoryPage() {
           dialog?.type === "add"
             ? "분류를 추가하시겠습니까?"
             : dialog?.type === "edit"
-            ? "분류를 수정하시겠습니까?"
-            : dialog?.type === "delete"
-            ? "분류를 삭제하시겠습니까?"
-            : ""
+              ? "분류를 수정하시겠습니까?"
+              : dialog?.type === "delete"
+                ? "분류를 삭제하시겠습니까?"
+                : ""
         }
         loading={loading}
         onConfirm={handleDialogConfirm}
@@ -820,4 +872,4 @@ function CategoryPage() {
   );
 }
 
-export { CategoryPage };
\ No newline at end of file
+export { CategoryPage };
diff --git a/apps/dc/src/pages/chatbot/ui/chatbot-page.tsx b/apps/dc/src/pages/chatbot/ui/chatbot-page.tsx
index 60e014173..7c2002683 100644
--- a/apps/dc/src/pages/chatbot/ui/chatbot-page.tsx
+++ b/apps/dc/src/pages/chatbot/ui/chatbot-page.tsx
@@ -5,12 +5,15 @@ import { Button, Input } from "@common/components";
 import { PageLayout } from "@/shared/ui/page-layout";
 import { UserCircle, Bot } from "lucide-react";
 import { useSearchParams } from "next/navigation";
-import { askQuestion, downloadPdf } from "@/entities/datalibrary/api/flask-service";
+import {
+  askQuestion,
+  downloadPdf,
+} from "@/entities/datalibrary/api/flask-service";
 
 interface Message {
   role: "user" | "bot";
   text: string;
-  sources?: Array<{ 
+  sources?: Array<{
     pdf_path: string;
     original_filename: string;
     page: number;
@@ -39,39 +42,45 @@ function ChatBotPage() {
   // RAG 요청 함수
   const handleRagRequest = async (question: string) => {
     setLoading(true);
-    
+
     // "봇이 답변을 생성중입니다..." 메시지를 먼저 추가
-    setMessages(prev => [...prev, { role: "bot", text: "봇이 답변을 생성중입니다...", sources: [] }]);
-    
+    setMessages((prev) => [
+      ...prev,
+      { role: "bot", text: "봇이 답변을 생성중입니다...", sources: [] },
+    ]);
+
     try {
       const data = await askQuestion(question, sessionId);
-      const answer = data.answer || data.response || '답변을 찾을 수 없습니다.';
+      const answer = data.answer || data.response || "답변을 찾을 수 없습니다.";
       const sources = data.sources || [];
-      
+
       // session_id가 응답에 포함되어 있으면 저장
       if (data.session_id) {
         setSessionId(data.session_id);
       }
-      
+
       // 답변을 한 글자씩 실시간으로 표시
       for (let i = 0; i <= answer.length; i++) {
-        await new Promise(resolve => setTimeout(resolve, 30)); // 30ms 딜레이
-        setMessages(prev => {
+        await new Promise((resolve) => setTimeout(resolve, 30)); // 30ms 딜레이
+        setMessages((prev) => {
           const newMessages = [...prev];
           // 마지막 메시지(봇 메시지)를 실제 답변으로 교체
-          newMessages[newMessages.length - 1] = { 
-            role: "bot", 
-            text: answer.substring(0, i), 
-            sources: sources // 모든 출처 표시
+          newMessages[newMessages.length - 1] = {
+            role: "bot",
+            text: answer.substring(0, i),
+            sources: sources, // 모든 출처 표시
           };
           return newMessages;
         });
       }
     } catch (error) {
-      console.error('RAG 요청 오류:', error);
-      setMessages(prev => {
+      console.error("RAG 요청 오류:", error);
+      setMessages((prev) => {
         const newMessages = [...prev];
-        newMessages[newMessages.length - 1] = { role: "bot", text: '질문에 대한 답변을 생성하는 중 오류가 발생했습니다.' };
+        newMessages[newMessages.length - 1] = {
+          role: "bot",
+          text: "질문에 대한 답변을 생성하는 중 오류가 발생했습니다.",
+        };
         return newMessages;
       });
     } finally {
@@ -84,7 +93,7 @@ function ChatBotPage() {
     try {
       const blob = await downloadPdf(pdfPath, fileName);
       const url = window.URL.createObjectURL(blob);
-      const link = document.createElement('a');
+      const link = document.createElement("a");
       link.href = url;
       link.download = fileName;
       document.body.appendChild(link);
@@ -92,87 +101,98 @@ function ChatBotPage() {
       document.body.removeChild(link);
       window.URL.revokeObjectURL(url);
     } catch (error) {
-      console.error('파일 다운로드 오류:', error);
-      alert('파일 다운로드 중 오류가 발생했습니다.');
+      console.error("파일 다운로드 오류:", error);
+      alert("파일 다운로드 중 오류가 발생했습니다.");
     }
   };
 
-  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+  const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
     if (!input.trim() || loading) return;
-    
+
     const question = input.trim();
-    setMessages(prev => [...prev, { role: "user", text: question }]);
+    setMessages((prev) => [...prev, { role: "user", text: question }]);
     setInput("");
-    
+
     // RAG 요청
     handleRagRequest(question);
   };
 
   return (
     <PageLayout pageTitle="하수도 GPT">
-      <div className="card card-border mt-6 flex flex-col h-[calc(100vh-16.8rem)]">
+      <div className="card card-border mt-6 flex h-[calc(100vh-16.8rem)] flex-col">
         <div className="card card-header flex-shrink-0">
           <h3 className="text-2xl font-medium text-label">하수도 GPT</h3>
         </div>
 
-        <div className="flex-1 overflow-y-auto p-4 space-y-3 min-h-0">
+        <div className="min-h-0 flex-1 space-y-3 overflow-y-auto p-4">
           {messages.map((msg, index) => (
             <div
               key={index}
-              className={`flex items-end gap-2 max-w-[75%] ${
+              className={`flex max-w-[75%] items-end gap-2 ${
                 msg.role === "user"
-                  ? "flex-row-reverse self-end ml-auto"
-                  : "self-start mr-auto"
+                  ? "ml-auto flex-row-reverse self-end"
+                  : "mr-auto self-start"
               }`}
             >
-              <span className="shrink-0 flex items-center">
+              <span className="flex shrink-0 items-center">
                 {msg.role === "user" ? (
-                  <UserCircle className="w-8 h-8 text-blue-400" />
+                  <UserCircle className="h-8 w-8 text-blue-400" />
                 ) : (
-                  <Bot className="w-8 h-8 text-gray-400" />
+                  <Bot className="h-8 w-8 text-gray-400" />
                 )}
               </span>
               <span
-                className={`p-3 rounded-md text-2xl whitespace-pre-wrap ${
-                  msg.role === "user"
-                    ? "bg-blue-100"
-                    : "bg-gray-100"
+                className={`whitespace-pre-wrap rounded-md p-3 text-2xl ${
+                  msg.role === "user" ? "bg-blue-100" : "bg-gray-100"
                 }`}
                 style={{ maxWidth: "calc(100% - 2.5rem)" }}
               >
                 {msg.text}
                 {/* 출처 표시: bot 답변에만 */}
-                {msg.role === "bot" && msg.sources && msg.sources.length > 0 && (
-                  <div className="mt-2 text-lg text-gray-500 space-y-1">
-                    <div className="font-semibold flex items-center gap-1">
-                      <span role="img" aria-label="출처">🔗</span> 출처
+                {msg.role === "bot" &&
+                  msg.sources &&
+                  msg.sources.length > 0 && (
+                    <div className="mt-2 space-y-1 text-lg text-gray-500">
+                      <div className="flex items-center gap-1 font-semibold">
+                        <span role="img" aria-label="출처">
+                          🔗
+                        </span>{" "}
+                        출처
+                      </div>
+                      <ul className="ml-2 list-inside list-disc">
+                        {msg.sources.map((src, i) => (
+                          <li key={i}>
+                            <button
+                              onClick={() =>
+                                handleSourceDownload(
+                                  src.pdf_path,
+                                  src.original_filename,
+                                )
+                              }
+                              className="text-left underline hover:text-blue-600"
+                            >
+                              {src.original_filename} (페이지 {src.page})
+                            </button>
+                          </li>
+                        ))}
+                      </ul>
                     </div>
-                    <ul className="list-disc list-inside ml-2">
-                      {msg.sources.map((src, i) => (
-                        <li key={i}>
-                          <button
-                            onClick={() => handleSourceDownload(src.pdf_path, src.original_filename)}
-                            className="underline hover:text-blue-600 text-left"
-                          >
-                            {src.original_filename} (페이지 {src.page})
-                          </button>
-                        </li>
-                      ))}
-                    </ul>
-                  </div>
-                )}
+                  )}
               </span>
             </div>
           ))}
-          
+
           {/* 로딩 상태 표시 - 실시간 답변 생성 중에는 표시하지 않음 */}
           {loading && messages.length === 0 && (
-            <div className="flex items-end gap-2 max-w-[75%] self-start mr-auto">
-              <span className="shrink-0 flex items-center">
-                <Bot className="w-8 h-8 text-gray-400" />
+            <div className="mr-auto flex max-w-[75%] items-end gap-2 self-start">
+              <span className="flex shrink-0 items-center">
+                <Bot className="h-8 w-8 text-gray-400" />
               </span>
-              <span className="p-3 rounded-md text-2xl bg-gray-100" style={{ maxWidth: "calc(100% - 2.5rem)" }}>
+              <span
+                className="rounded-md bg-gray-100 p-3 text-2xl"
+                style={{ maxWidth: "calc(100% - 2.5rem)" }}
+              >
                 답변을 생성하고 있습니다...
               </span>
             </div>
@@ -181,10 +201,10 @@ function ChatBotPage() {
 
         <form
           onSubmit={handleSubmit}
-          className="flex items-center gap-2 p-4 border-t flex-shrink-0"
+          className="flex flex-shrink-0 items-center gap-2 border-t p-4"
         >
           <Input
-            className="flex-1 h-[3.2rem] !text-[1.5rem]"
+            className="h-[3.2rem] flex-1 !text-[1.5rem]"
             placeholder="질문을 입력하세요..."
             value={input}
             onChange={(e) => setInput(e.target.value)}
@@ -199,4 +219,4 @@ function ChatBotPage() {
   );
 }
 
-export { ChatBotPage };
\ No newline at end of file
+export { ChatBotPage };
diff --git a/apps/dm/.env.local b/apps/dm/.env.local
index 88b6f8067..4dce58c9d 100644
--- a/apps/dm/.env.local
+++ b/apps/dm/.env.local
@@ -1,12 +1,13 @@
 NEXT_PUBLIC_SITE_ID = DM
+NEXT_PUBLIC_PORT = 3015
 NEXT_PUBLIC_CLAIM_NAME = Authorization
 NEXT_PUBLIC_AUTH_USER_ID = token-id
 NEXT_PUBLIC_ACCESS_TOKEN = access-token
 NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
-NEXT_PUBLIC_PORT = 3005
-NEXT_PUBLIC_PROXY_HOST = http://localhost:3005
-NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
+NEXT_PUBLIC_PROXY_HOST = http://localhost:3015
+NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
 NEXT_PUBLIC_SERVER_API_URL = http://dev.onasys.co.kr:8000
+NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
 NEXT_PUBLIC_DM_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
 # NEXT_PUBLIC_FO_SERVER_API_URL = http://192.168.1.222:8883/operation-service/api/v1
 NEXT_PUBLIC_FO_SERVER_API_URL = http://con.mind-one.co.kr:11083/operation-service/api/v1
@@ -19,7 +20,6 @@ NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&ver
 NEXT_PUBLIC_GATEWAY_URL=http://con.mind-one.co.kr:11083  # 개발 서버 API
 #NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.128:8883/sewerage-service/api          # 최용성 
 #NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.66:8883/sewerage-service/api          # 박이정
-NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
 
 
 NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
diff --git a/apps/dm/.env.mindone b/apps/dm/.env.mindone
index da6f80177..22fb6274c 100644
--- a/apps/dm/.env.mindone
+++ b/apps/dm/.env.mindone
@@ -1,23 +1,25 @@
 NEXT_PUBLIC_SITE_ID = DM
-NEXT_PUBLIC_PORT = 11035
-NEXT_PUBLIC_PROXY_HOST = http://con.mind-one.co.kr:11035
-NEXT_PUBLIC_SERVER_API_URL = http://dev.onasys.co.kr:8000
-NEXT_PUBLIC_DM_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
-NEXT_PUBLIC_FO_SERVER_API_URL = http://con.mind-one.co.kr:11083/operation-service/api/v1
-NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
-NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
+NEXT_PUBLIC_PORT = 11315
 NEXT_PUBLIC_CLAIM_NAME = Authorization
 NEXT_PUBLIC_AUTH_USER_ID = token-id
 NEXT_PUBLIC_ACCESS_TOKEN = access-token
 NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
+NEXT_PUBLIC_PROXY_HOST = http://con.mind-one.co.kr:11315
+NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
+NEXT_PUBLIC_SERVER_API_URL = http://dev.onasys.co.kr:8000
+NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
+NEXT_PUBLIC_DM_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
+NEXT_PUBLIC_FO_SERVER_API_URL = http://con.mind-one.co.kr:11083/operation-service/api/v1
 NEXT_PUBLIC_WR_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
+#NEXT_PUBLIC_GEOSERVER_URL = http://rsone.iptime.org:10010/geoserver
+#NEXT_PUBLIC_LX_GEOSERVER_URL = http://con.mind-one.co.kr:11306/geoserver
+NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
 NEXT_PUBLIC_NGII_URL = https://map.ngii.go.kr
 NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={x}&tilerow={y}
 NEXT_PUBLIC_SEWERAGE_API_URL=http://con.mind-one.co.kr:11083/sewerage-service   # 개발 서버 API
 NEXT_PUBLIC_GATEWAY_URL=http://con.mind-one.co.kr:11083  # 개발 서버 API
 # NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.128:8883/sewerage-service/api          # 최용성 
 #NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.66:8883/sewerage-service/api          # 박이정
-NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
 
 
 NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
diff --git a/apps/dm/.env.production b/apps/dm/.env.production
index 5a401c89a..587001101 100644
--- a/apps/dm/.env.production
+++ b/apps/dm/.env.production
@@ -8,16 +8,16 @@ NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
 #NEXT_PUBLIC_PROXY_HOST = https://devreuse.hasuon.or.kr
 #NEXT_PUBLIC_CM_LOGIN_PAGE_URL = https://devqueen.hasuon.or.kr/auth/login
 NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
-NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
 NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
-NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
+NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
+NEXT_PUBLIC_WR_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/reuse-service/api/v1
 NEXT_PUBLIC_GEOSERVER_URL = http://172.29.143.87:8080/geoserver
 NEXT_PUBLIC_LX_GEOSERVER_URL = http://172.29.143.87:8080/geoserver_swl
-NEXT_PUBLIC_WR_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/reuse-service/api/v1
+NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
 NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/sewerage-service
-NEXT_PUBLIC_GATEWAY_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
 NEXT_PUBLIC_NGII_URL = http://172.29.143.87/poiact
 NEXT_PUBLIC_NGII_PARAM = BDE2BEF39DAFEC293AB6730150F222AC&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={y}&tilerow={x}
+NEXT_PUBLIC_GATEWAY_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
 
 
 NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
diff --git a/apps/dm/.gitignore b/apps/dm/.gitignore
deleted file mode 100644
index c1b3c4e38..000000000
--- a/apps/dm/.gitignore
+++ /dev/null
@@ -1,39 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/.pnp
-.pnp.*
-.yarn/*
-!.yarn/patches
-!.yarn/plugins
-!.yarn/releases
-!.yarn/versions
-
-# testing
-/coverage
-
-# next.js
-/.next/
-/out/
-
-# production
-/build
-
-# misc
-.DS_Store
-*.pem
-
-# debug
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-.pnpm-debug.log*
-
-# env files (can opt-in for committing if needed)
-
-# vercel
-.vercel
-
-# typescript
-*.tsbuildinfo
-next-env.d.ts
diff --git a/apps/dm/app/(base-layout)/layout.tsx b/apps/dm/app/(base-layout)/layout.tsx
deleted file mode 100644
index 5caa088b0..000000000
--- a/apps/dm/app/(base-layout)/layout.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-"use client";
-import Base from "../base";
-import "../globals.css";
-import { StoreProvider } from "../store";
-
-export default function BaseLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-  return (
-    <StoreProvider>
-      <Base>{children}</Base>
-    </StoreProvider>
-  );
-}
diff --git a/apps/dm/app/(base-layout)/pages/sdmMng/sdmApplyList/page.tsx b/apps/dm/app/(base-layout)/pages/sdmMng/sdmApplyList/page.tsx
deleted file mode 100644
index 8c681876c..000000000
--- a/apps/dm/app/(base-layout)/pages/sdmMng/sdmApplyList/page.tsx
+++ /dev/null
@@ -1,209 +0,0 @@
-"use client"
-import { Table, TableBody, TableCell, TableRow } from '@common/components/ui/table';
-
-import { useDmStore } from '@/app/store';
-import { ContentsDiv, Title, UiModal, UiTable } from '@common/business_components/ui';
-import ListDiv from '@common/business_components/ui/list_div';
-import { useEffect, useState } from 'react';
-import { Toaster } from 'react-hot-toast';
-import SdmLogin from '../sdmLogin/page';
-import type { DemandCompBizType } from '@/app/store/sdmMng';
-import TransValueFormat from '@/app/common/transValueFormat';
-import { useRouter } from 'next/navigation';
-
-const TABLE_STYLES = {
-  header: "text-center border border-[var(--border)] bg-[rgb(234,243,251)] text-[rgb(100,119,132)] whitespace-pre-line",
-  cell: "text-right whitespace-pre-line",
-  fullWidth: "text-center border border-[var(--border)] bg-[rgb(234,243,251)] text-[rgb(100,119,132)] whitespace-pre-line",
-  table: "fixed w-full"
-} as const;
-
-type SdmApplyProps = {
-  sdmNo : string;
-}
-
-export default function SdmApplyList({}: SdmApplyProps) {
-
-  const router = useRouter();
-  
-  const {getSdmInfoStatusList, Sdm, Common} = useDmStore((state) => state);
-  const {successLogin, sdmInfoStatusList, upHeadSdmInfoStatus} = Sdm;
-  const {selectSidoData, selectSigunData} = Common;
-  const [isLogin, setIsLogin] = useState(false);
-  const [isLoginStorageInfo, setIsLoginStorageInfo] = useState(false);
-  const [sdmApplyDetail, setSdmApplyDetail] = useState<DemandCompBizType>({} as DemandCompBizType);
-  const [transformedList, setTransformedList] = useState<DemandCompBizType[]>([]);
-
-  useEffect(() => {
-    console.log('sessionStorage : ',sessionStorage.getItem('user'));
-    const user = sessionStorage.getItem('user');
-    if (user) {
-      setIsLoginStorageInfo(true);
-    }
-  }, []);
-
-  useEffect(() => {
-    if (successLogin || isLoginStorageInfo) {
-      setIsLogin(true);
-      const user = sessionStorage.getItem('user');
-      if (user) {
-        try {
-          const userData = JSON.parse(user);
-          getSdmInfoStatusList(userData.dmdInfoId);
-        } catch (error) {
-          console.error('Error parsing user data:', error);
-        }
-      }
-    }
-  }, [successLogin, getSdmInfoStatusList, isLoginStorageInfo]);
-
-  // 데이터 변환을 위한 별도의 useEffect
-  useEffect(() => {
-    if (sdmInfoStatusList.length > 0) {
-
-      
-      const newTransformedList = sdmInfoStatusList.map((item: DemandCompBizType) => ({
-        ...item,
-        ctpvCd: selectSidoData.find(sido => sido.val === item.ctpvCd?.trim())?.text || '',
-        sggCd: selectSigunData.find(sigun => sigun.val === item.sggCd?.trim())?.text || '',
-      }));
-      setTransformedList(newTransformedList);
-    }
-  }, [sdmInfoStatusList, selectSidoData, selectSigunData]);
-
-  const onClickSdmStatus = (index: number | undefined) => {
-    if (index !== undefined) {
-      const selectedStatus = transformedList[index];
-      if (selectedStatus) {
-
-
-        setSdmApplyDetail(selectedStatus);
-      }
-    }
-  }
-
-  return (
-    <>
-      <Title title="수요신청현황" />
-      <ContentsDiv>
-        <ListDiv>
-          <div className="overflow-y-scroll h-[250px]">
-            <div className="h-[110%] w-[99%]">
-              <UiTable
-                headName='수요정보 신청현황'
-                tableData={transformedList} 
-                headlist={upHeadSdmInfoStatus} 
-                pageSize={0} 
-                total={0} 
-                cellClick={(index) => onClickSdmStatus(index)} 
-                onPageChange={() => {}}
-              />
-            </div>
-          </div>
-        </ListDiv>
-        <ListDiv>
-          <div className="card-header">
-            <h3 className="text-2xl font-medium text-label">수요신청 상세현황</h3>
-          </div>
-          <div className={`card !m-[1.2rem] !p-0r`}>
-            <Table variant="secondary" style={{ tableLayout: 'fixed', width: '100%' }}>
-              <TableBody>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>요구시기</TableCell>
-                  <TableCell colSpan={2} className={TABLE_STYLES.cell}>{sdmApplyDetail?.dmndTmng?.toString()}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>요구수량(m³/일)</TableCell>
-                  <TableCell colSpan={2} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.dmndQty} format="number"/>}</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>사용용도</TableCell>
-                  <TableCell colSpan={2} className={TABLE_STYLES.cell}>{sdmApplyDetail?.useUsgCd}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>희망단가(원/m³)</TableCell>
-                  <TableCell colSpan={2} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.wntUntprc} format="number"/>}</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={6} className={TABLE_STYLES.fullWidth}>요구수량</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>총대장균군수(개/100ml)</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{   sdmApplyDetail?.grssClfg!=-1?<TransValueFormat value={sdmApplyDetail?.grssClfg ?? ''} format="number"/>:''}  {sdmApplyDetail?.grssClfg?sdmApplyDetail.grssClfg!=-1? '이하':'불검출':'-'}  </TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>결합잔류염소(mg/L)​</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.combResdch ?? ''} format="number"/>}  {sdmApplyDetail?.combResdch?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>탁도(NTU)</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.trbt ?? ''} format="number"/>}  {sdmApplyDetail?.trbt?'이하':'-'}</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>생물학적 산소요구량(BOD)(mg/L)</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.blgcOxygDmndQnt ?? ''} format="number"/>}  {sdmApplyDetail?.blgcOxygDmndQnt?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>냄새</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.smll} format="number"/>}  {sdmApplyDetail?.smll?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>색도(도)</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.crmty ?? ''} format="number"/>}  {sdmApplyDetail?.crmty?'이하':'-'}</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>총질소(T-N)(mg/L)</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.tn ?? ''} format="number"/>}  {sdmApplyDetail?.tn?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>총인(T-P)(mg/L)​</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.tph ?? ''} format="number"/>}  {sdmApplyDetail?.tph?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>수소이온농도(pH)​</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.ph} format="number"/>}</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>염화물(mgCL/L)​</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.clIonQnt ?? ''} format="number"/>}  {sdmApplyDetail?.clIonQnt?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>전기전도도(㎲/cm)​</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{<TransValueFormat value={sdmApplyDetail?.cdtnv ?? ''} format="number"/>}  {sdmApplyDetail?.cdtnv?'이하':'-'}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>비고</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{sdmApplyDetail?.rmrk}</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={6} className={TABLE_STYLES.fullWidth}>공급처 후보지​</TableCell>
-                </TableRow>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>후보지1</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{ sdmApplyDetail?.splyCndtList?.[0]?.ruseUtztnFcltNm ?? ""}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>후보지2</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{sdmApplyDetail?.splyCndtList?.[1]?.ruseUtztnFcltNm ?? ""}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>후보지3</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.cell}>{sdmApplyDetail?.splyCndtList?.[2]?.ruseUtztnFcltNm ?? ""}</TableCell>
-                </TableRow>
-              </TableBody>
-            </Table>
-          </div>
-        </ListDiv>
-        <ListDiv>
-          <div className="card-header">
-            <h3 className="text-2xl font-medium text-label">수요신청 진행상태</h3>
-          </div>
-          <div className={`card !m-[1.2rem] !p-0r`}>
-            <Table variant="secondary" style={{ tableLayout: 'fixed', width: '100%' }}>
-              <TableBody>
-                <TableRow>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>진행상태</TableCell>
-                  <TableCell colSpan={2} className={TABLE_STYLES.cell}>{sdmApplyDetail?.status?.toString()}</TableCell>
-                  <TableCell colSpan={1} className={TABLE_STYLES.header}>공급처매칭결과</TableCell>
-                  <TableCell colSpan={2} className={TABLE_STYLES.cell}>{sdmApplyDetail?.ruseUtztnFcltNm??''}</TableCell>
-                </TableRow>
-              </TableBody>
-            </Table>
-          </div>
-        </ListDiv>
-      </ContentsDiv>
-      {!isLogin?
-        <UiModal
-          body={<SdmLogin/>}
-          bodyClass="sm:max-w-[90vw] w-[530px] h-[430px]"
-          open={!isLogin}
-          onOpenChange={(open) => {
-            if(!open){
-              setIsLogin(false)
-              router.push('/');
-            }
-          }}
-          noHeaderYn="Y"
-          noFooterYn="Y"
-        />
-      :null}
-      <Toaster position="top-center" />
-    </>
-  );
-}
diff --git a/apps/dm/app/(base-layout)/pages/sdmMng/sdmInfoInsert/modalSimilar/page.tsx b/apps/dm/app/(base-layout)/pages/sdmMng/sdmInfoInsert/modalSimilar/page.tsx
deleted file mode 100644
index 35836d07c..000000000
--- a/apps/dm/app/(base-layout)/pages/sdmMng/sdmInfoInsert/modalSimilar/page.tsx
+++ /dev/null
@@ -1,166 +0,0 @@
-"use client"
-
-import { useDmStore } from '@/app/store';
-import type { MoneyDetailType, SimilarCaseType } from '@/app/store/sdmMng';
-import { SelectBox, Title, UiTable } from '@common/business_components/ui';
-import { HeadMakeColSpan } from '@common/business_components/ui/table/HeadMakeColSpan';
-import { Table, TableBody, TableCell, TableHeader, TableRow } from '@common/components/ui/table';
-import { useEffect, useMemo, useState } from 'react';
-
-type modalType = {
-  sply: number | 0;
-  usageCd: string | '';
-  money: number | 0;
-};
-
-const searchUseTypeList = [
-  { text: '공급량', val: 'S' },
-  { text: '사용용도', val: 'U' },
-];
-
-export default function ModalSimilarPage({ sply = 0, usageCd = '', money = 0 }: modalType) {
-  const { Sdm, getSimilarCaseList } = useDmStore((state) => state);
-  const [searchUseType, setSearchUseType] = useState<{text: string, value: string}>({text: '공급량', value: 'S'});
-  const [moneyDetailList, setMoneyDetailList] = useState<MoneyDetailType[]>([]);
-  const {
-    upHeadSimilarCaseList,
-    similarCaseList,
-    upHeadMoneyDetailList,
-  } = Sdm;
-
-  const rowSpans = useMemo(() => {
-    const spans: { [key: number]: number } = {};
-    let currentValue = '';
-    let currentSpan = 0;
-    let startIndex = 0;
-
-    similarCaseList.forEach((item: SimilarCaseType, index: number) => {
-      if (item.ruseBizNm === currentValue
-        || item.bizBgngDate === currentValue
-        || item.bizEndDate === currentValue
-        || item.reqBizReuseFcltCst === currentValue) {
-        currentSpan++;
-        spans[startIndex] = currentSpan;
-      } else {
-        currentValue = item.ruseBizNm;
-        currentSpan = 1;
-        startIndex = index;
-        spans[index] = 1;
-      }
-    });
-
-    return spans;
-  }, [similarCaseList]);
-
-  const handleCellClick = (index: number) => {
-    setMoneyDetailList([{
-      reqBizGrssCst: similarCaseList[index]?.reqBizGrssCst ?? '',
-      reqBizReuseFcltCst: similarCaseList[index]?.reqBizReuseFcltCst ?? '',
-      reqBizPplCst: similarCaseList[index]?.reqBizPplCst ?? '',
-      reqBizArchCst: similarCaseList[index]?.reqBizArchCst ?? '',
-      reqBizMchnCst: similarCaseList[index]?.reqBizMchnCst ?? '',
-      reqBizMtrngCst: similarCaseList[index]?.reqBizMtrngCst ?? '',
-      reqBizGisCst: similarCaseList[index]?.reqBizGisCst ?? '',
-      reqBizCctvCst: similarCaseList[index]?.reqBizCctvCst ?? '',
-      reqBizCmcnCst: similarCaseList[index]?.reqBizCmcnCst ?? '',
-      reqBizWstCst: similarCaseList[index]?.reqBizWstCst ?? '',
-      reqBizDesignCst: similarCaseList[index]?.reqBizDesignCst ?? '',
-      reqBizSpvsCst: similarCaseList[index]?.reqBizSpvsCst ?? '',
-      reqBizSbsdCst: similarCaseList[index]?.reqBizSbsdCst ?? '',
-      reqBizEtc: similarCaseList[index]?.reqBizEtc ?? '',
-      prcmPlanNlep: similarCaseList[index]?.prcmPlanNlep ?? '',
-      prcmPlanLcep: similarCaseList[index]?.prcmPlanLcep ?? '',
-      prcmPlanBrdnCst: similarCaseList[index]?.prcmPlanBrdnCst ?? '',
-      prcmPlanEcqrRt: similarCaseList[index]?.prcmPlanEcqrRt ?? '',
-      prcmPlanGrssCst: similarCaseList[index]?.prcmPlanGrssCst ?? '',
-      clclnNlep: similarCaseList[index]?.clclnNlep ?? '',
-      clclnLcep: similarCaseList[index]?.clclnLcep ?? '',
-      clclnBrdnCst: similarCaseList[index]?.clclnBrdnCst ?? '',
-      clclnEcqrRt: similarCaseList[index]?.clclnEcqrRt ?? '',
-      clclnGrssCst: similarCaseList[index]?.clclnGrssCst ?? ''
-    }]);
-  }
-
-  useEffect(() => {
-    const type = searchUseType.value;
-    getSimilarCaseList(type, type === 'S' ? sply : type === 'U' ? usageCd : money);
-  }, [getSimilarCaseList, money, searchUseType, sply, usageCd]);
-
-  return (
-    <div className="align-top w-[1360px] h-full">
-      <Title title="유사사례 조회" />
-      <div className="overflow-x-auto h-[480px] w-full mt-8" tabIndex={0} aria-label="유사사례 테이블 영역">
-        <div className="w-[150%]">
-          <div className="card-header justify-self-start">
-            <h3 className="text-2xl font-medium text-label">유사사례</h3>
-            <SelectBox
-              tabIndex={0}
-              aria-label="검색 기준 선택"
-              selectArray={searchUseTypeList}
-              value={searchUseType.value}
-              onSelectValue={(val) => {
-                setSearchUseType({text: searchUseTypeList.find(item => item.val === val)?.text ?? '', value: val.toString()});
-              }}
-              className="w-[140px] ml-20"
-              label=""
-              selectClass="w-[140px]"
-            />
-          </div>
-          <div className={`card !m-[1.2rem] !p-0r`}>
-            <Table variant="secondary">
-              <TableHeader className="font-bold">
-                <HeadMakeColSpan upHeadList={upHeadSimilarCaseList} />
-              </TableHeader>
-              <TableBody className='text-center'>
-                {similarCaseList.length > 0 ? similarCaseList?.map((el: SimilarCaseType, index) => (
-                  <TableRow key={`similar-case-row-${index}-${el.ruseBizNm}-${el.bizBgngDate}`}>
-                    {upHeadSimilarCaseList.map((head) => (
-                      head.id && head.id.length > 1 && (
-                        <TableCell
-                          tabIndex={head.id === 'someClickableId' ? 0 : undefined}
-                          role="button"
-                          aria-label={`유사사례 ${head.id} 클릭 시 상세 정보 표시`}
-                          className={`${head.align === 'right' ? 'text-right' : head.align === 'center' ? 'text-center' : typeof el[head.id as keyof SimilarCaseType] === 'number' ? 'text-right' : 'text-center'} cursor-pointer`}
-                          key={`similar-case-cell-${head.id}-${index}-${el.ruseBizNm}`}
-                          rowSpan={(head.id === 'businessName' || head.id ==='businessDuration' || head.id === 'money') ? rowSpans[index] : undefined}
-                          style={(head.id === 'businessName' || head.id === 'businessDuration' || head.id === 'money') && index > 0 && similarCaseList[index - 1]?.ruseBizNm === el.ruseBizNm ? { display: 'none' } : undefined}
-                          onClick={() => handleCellClick(index)}
-                          onKeyDown={(e) => {
-                            if (e.key === 'Enter' || e.key === ' ') {
-                              handleCellClick(index);
-                            }
-                          }}
-                        >
-                          {typeof el[head.id as keyof SimilarCaseType] !== 'number' 
-                            ? String(el[head.id as keyof SimilarCaseType] ?? '')
-                            : String(el[head.id as keyof SimilarCaseType]).includes('.') 
-                              ? String(el[head.id as keyof SimilarCaseType]).split('.').map((part, index) => 
-                              index === 0 ? part.replace(/\B(?=(\d{3})+(?!\d))/g, ",") : part
-                            ).join('.')
-                          : String(el[head.id as keyof SimilarCaseType] ?? '').replace(/\B(?=(\d{3})+(?!\d))/g, ",")}
-                        </TableCell>
-                      )
-                    ))}
-                  </TableRow>
-                )) : <></>}
-              </TableBody>
-            </Table>
-          </div>
-        </div>
-      </div>
-      <div className="overflow-x-auto h-[270px] w-full mt-8 overflow-y-hidden">
-        <div className="w-[130%]">
-          <UiTable
-            headName={"사업비 상세정보"}
-            tableData={moneyDetailList}
-            headlist={upHeadMoneyDetailList}
-            pageSize={0}
-            total={0}
-            cellClick={undefined}
-            onPageChange={() => {}}
-          />
-        </div>
-      </div>
-    </div>
-  )
-}
\ No newline at end of file
diff --git a/apps/dm/app/(base-layout)/pages/sdmMng/sdmInfoInsert/page.tsx b/apps/dm/app/(base-layout)/pages/sdmMng/sdmInfoInsert/page.tsx
deleted file mode 100644
index df418b20f..000000000
--- a/apps/dm/app/(base-layout)/pages/sdmMng/sdmInfoInsert/page.tsx
+++ /dev/null
@@ -1,294 +0,0 @@
-"use client";
-
-/**
- *  수요정보등록 화면
- *
- * 🔗 사용 API
- * - 수요정보등록: POST /reuseFc/request/demandInfo
- */
-import { useDmStore } from "@/app/store";
-import { sdmInfoFormSchema, type DemandCompBizType, type SdmInfoFormData } from "@/app/store/sdmMng";
-import { SdmInfoRegForm } from "@/components/ui/sdmInfoInsertForm/component";
-import { UiModal } from "@common/business_components/ui/dialog_ui";
-import { Button } from "@common/components/ui";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { useRouter, useSearchParams } from "next/navigation";
-import { Suspense, useEffect, useState } from "react";
-import { FormProvider, useForm, type SubmitHandler } from "react-hook-form";
-import toast, { Toaster } from "react-hot-toast";
-import SdmLogin from "../sdmLogin/page";
-
-
-
-function SdmInfoInsertContent() {
-  const searchParams = useSearchParams();
-  const { insertSdmInfoData, Sdm, setSubsInfo } = useDmStore((state) => state);
-  const { successLogin } = Sdm;
-  const [ismoneyDisabled, setIsmoneyDisabled] = useState(false);
-  const formSchema = sdmInfoFormSchema;
-
-  const [isLogin, setIsLogin] = useState(false);
-  const [facilityName, setFacilityName] = useState<string>("");
-  const [defaultValues, setDefaultValues] = useState<SdmInfoFormData>({
-    sdmNm: "",
-    demandYmd: new Date(),
-    demandQnty: "",
-    usePurpose: "",
-    money: "",
-    /**요구수질 */
-    reqWaterQlty: "",
-    grssClfg: null,
-    tn: null,
-    combResdch: null,
-    tph: null,
-    trbt: null,
-    ph: null,
-    bod: null,
-    /**컬럼확인필요 */
-    clIonQnt: null,
-    smll: "",
-    cdtnv: null,
-    crmty: null,
-    rmrk: "",
-    /** 후보지 제목 */
-    candidateTitle: [
-      { ruseUtztnFcltNm: "", ruseUtztnFcltCd: "" },
-      { ruseUtztnFcltNm: "", ruseUtztnFcltCd: "" },
-      { ruseUtztnFcltNm: "", ruseUtztnFcltCd: "" },
-    ],
-  });
-
-  useEffect(() => {
-    const user = sessionStorage.getItem("user");
-
-
-    setDefaultValues((prev) => ({
-      ...prev,
-      sdmNm: searchParams.get("dmdCoNm") || "",
-    }));
-    if (searchParams.get("dmdInfoId")) {
-      // const data = {
-      //   dmdCoNm: searchParams.get("dmdCoNm") || '',
-      //   ctpvCd: searchParams.get("ctpvCd") || '',
-      //   sggCd: searchParams.get("sggCd") || '',
-      //   dmdInfoId: searchParams.get("dmdInfoId") || '',
-      //   daddr: searchParams.get("daddr") || '',
-      //   telno: searchParams.get("telno") || '',
-      // }
-
-      // sessionStorage.setItem("user", JSON.stringify(data || {}));
-    }
-    //sessionStorage.setItem("user", JSON.parse(user||'') || "");
-    setIsLogin(user || searchParams.get("dmdInfoId") ? true : false);
-  }, [searchParams]);
-
-  useEffect(() => {
-    const local = localStorage.getItem("user");
-    if (local) {
-      setIsLogin(true);
-    }
-    setSubsInfo([]); // subsInfo 초기화 후보지 처음 화면 들어올때 초기화(스토어내 객체만)
-  }, [setSubsInfo]);
-
-  const form = useForm<SdmInfoFormData>({
-    resolver: zodResolver(formSchema),
-    defaultValues,
-    mode: "onSubmit",
-  });
-
-  const subsInfo = useDmStore((state) => state.map.subsInfo);
-
-  useEffect(() => {
-    //map.subsInfo 스토어 객체 값이 변경되면 해당 값이 폼에 자동으로 들어가도록 수정 대신 값이 있어야함
-    if (subsInfo.length > 0) {
-      form.setValue("candidateTitle", subsInfo);
-    }
-  }, [subsInfo, form]);
-
-  //후보지 팝업 값 셋팅
-  useEffect(() => {
-    const handleMessage = (event: MessageEvent) => {
-      if (event.data?.type === "SET_SUBS_INFO") {
-        setSubsInfo(event.data.payload); // zustand로 값 설정
-      }
-    };
-
-    window.addEventListener("message", handleMessage);
-    return () => window.removeEventListener("message", handleMessage);
-  }, [setSubsInfo]);
-
-  // 로그인 성공 시 모달 닫기 및 폼 업데이트
-  useEffect(() => {
-    if (successLogin) {
-      setIsLogin(true);
-      const user = sessionStorage.getItem("user");
-      if (user) {
-        try {
-          const userData = JSON.parse(user);
-          if (userData.dmdCoNm) {
-            setFacilityName(userData.dmdCoNm);
-            form.setValue("sdmNm", userData.dmdCoNm); // 수요처명(회사명)
-          }
-        } catch (error) {
-          console.error("Error parsing user data:", error);
-        }
-      }
-    }
-  }, [successLogin, form]);
-
-  useEffect(() => {
-    console.log("Form state changed:", form.formState.errors);
-  }, [form.formState.errors]);
-
-  // 체크박스 상태가 변경될 때마다 money 필드의 에러를 초기화
-  useEffect(() => {
-    if (ismoneyDisabled) {
-      form.clearErrors("money");
-      form.setValue("money", "");
-    }
-  }, [ismoneyDisabled, form]);
-  const router = useRouter();
-  const onSubmit: SubmitHandler<SdmInfoFormData> = async (data) => {
-    try {
-      const dmSubsInfo = data.candidateTitle?.filter(
-        (item) => item.ruseUtztnFcltNm && item.ruseUtztnFcltCd
-      );
-      // Transform form data to madata.candidateTitletch API schema
-      const apiData: DemandCompBizType = {
-        dmdInfoId:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.dmdInfoId?.toString() ||
-          searchParams.get("dmdInfoId") + (searchParams.get("bznmTotNo") || ""),
-        dmdInfoFk:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.dmdInfoId?.toString() ||
-          searchParams.get("dmdInfoId") + (searchParams.get("bznmTotNo") || ""),
-        dmdCoNm:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.dmdCoNm?.toString() || data.sdmNm,
-        ctpvCd:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.ctpvCd?.toString() ||
-          searchParams.get("ctpvCd") ||
-          "",
-        sggCd:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.sggCd?.toString() ||
-          searchParams.get("sggCd") ||
-          "",
-        daddr:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.daddr?.toString() ||
-          searchParams.get("daddr") ||
-          "",
-        telno:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.telno?.toString() ||
-          searchParams.get("telno") ||
-          "",
-        rgtr:
-          JSON.parse(
-            sessionStorage.getItem("user") || "{}"
-          )?.rgtr?.toString() ||
-          searchParams.get("rgtr") ||
-          "",
-        useUsgCd: data.usePurpose || "",
-        wntUntprc: Number(data.money) || "",
-        dmndTmng: data.demandYmd || new Date(),
-        dmndQty: Number(data.demandQnty) || "",
-        grssClfg: data.grssClfg === null ? -1 : Number(data.grssClfg),
-        tn: Number(data.tn) || null,
-        combResdch: Number(data.combResdch) || null,
-        tph: Number(data.tph) || null,
-        trbt: Number(data.trbt) || null,
-        ph: data.ph || "",
-        blgcOxygDmndQnt: Number(data.bod) || null,
-        clIonQnt: Number(data.clIonQnt) || null,
-        smll: data.smll || "",
-        cdtnv: Number(data.cdtnv) || null,
-        crmty: Number(data.crmty) || null,
-        rmrk: data.rmrk || "",
-        bzmnNo: "",
-        dmdAplyPswd: "",
-        index: 0,
-        reqDt: "",
-        dmdInfoSn: 0,
-        status: "",
-        splyCndtList: dmSubsInfo || [],
-      };
-
-      await insertSdmInfoData(apiData);
-      setTimeout(() => {
-        router.push("/");
-      }, 1000); // 0.8초 후 이동
-    } catch (error) {
-      console.error("Error submitting form:", error);
-    }
-  };
-
-  return (
-    <div className="min-h-screen bg-[#F2F2F2]">
-      <div className="container mx-auto px-4 py-8">
-        <div className="text-center mb-8">
-          <h1 className="text-4xl font-bold text-gray-900 underline">
-            수요정보 등록
-          </h1>
-        </div>
-
-        <div className="max-w-3xl mx-auto bg-white rounded-lg shadow-md p-6">
-          <FormProvider {...form}>
-            <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
-              <SdmInfoRegForm
-                form={form}
-                onCheckboxChange={setIsmoneyDisabled}
-                facilityName={facilityName}
-              />
-              <div className="flex justify-center pt-4">
-                <Button
-                  color="sky"
-                  size={"sm"}
-                  type="submit"
-                  className="w-40 font-semibold py-2 px-4 rounded-md "
-                >
-                  수요정보 등록
-                </Button>
-              </div>
-            </form>
-          </FormProvider>
-        </div>
-      </div>
-
-      {!isLogin ? (
-        <UiModal
-          body={<SdmLogin />}
-          bodyClass="sm:max-w-[90vw] w-[530px] h-[430px]"
-          open={!isLogin}
-          onOpenChange={(open) => {
-            if (!open) {
-              toast.dismiss();
-              router.push("/");
-            }
-          }}
-          noHeaderYn="Y"
-          noFooterYn="Y"
-        />
-      ) : null}
-      <Toaster position="top-center" />
-    </div>
-  );
-}
-
-export default function MyForm() {
-  return (
-    <Suspense fallback={<div>Loading...</div>}>
-      <SdmInfoInsertContent />
-    </Suspense>
-  );
-}
diff --git a/apps/dm/app/(base-layout)/pages/sdmMng/sdmInsert/page.tsx b/apps/dm/app/(base-layout)/pages/sdmMng/sdmInsert/page.tsx
deleted file mode 100644
index 79eb07830..000000000
--- a/apps/dm/app/(base-layout)/pages/sdmMng/sdmInsert/page.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-"use client";
-
-import { useDmStore } from "@/app/store";
-import SdmInsertForm from '@common/business_components/ui/sdmInsertForm';
-import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
-import { useRouter } from "next/navigation";
-import { useCallback, useEffect, useRef } from "react";
-import { Toaster } from "react-hot-toast";
-
-export default function MyForm() {
-  const { Common, initializeCommonData, getDemandCompList, insertSdmData, Sdm } = useDmStore((state) => state);
-  const { selectSidoData, selectSigunData } = Common;
-  const { demandCompList, successNextPage } = Sdm;
-  const router = useRouter();
-  const formDataRef = useRef<DemandCompType | null>(null);
-
-  useEffect(() => {
-    initializeCommonData();
-  }, [initializeCommonData]);
-
-  useEffect(() => {
-    if (successNextPage && formDataRef.current) {
-      const data = formDataRef.current;
-      console.log(data);
-      const queryParams = new URLSearchParams({
-        dmdCoNm: data.dmdCoNm || '',
-        ctpvCd: data.ctpvCd || '',
-        sggCd: data.sggCd || '',
-        dmdInfoId: data.dmdInfoId || '',
-        daddr: data.daddr || '',
-        telno: data.telno || '',
-      });
-      router.push(`/pages/sdmMng/sdmInfoInsert?${queryParams.toString()}`);
-    }
-  }, [successNextPage, router]);
-
-  const callback = useCallback((searchText: string, pageCnt: number) => {
-    searchText = searchText.trim();
-    if (searchText.length > 0) {
-      getDemandCompList(searchText, pageCnt);
-    }
-  }, [getDemandCompList]);
-
-  const handleInsertSdmData = useCallback((data: import('@common/business_components/ui/sdmInsertForm/form').DemandCompType) => {
-    const convertedData: DemandCompType = {
-      ...data,
-    };
-    formDataRef.current = convertedData;
-    insertSdmData(convertedData)
-  }, [insertSdmData]);
-
-  return (
-    <div className="min-h-screen bg-[#F2F2F2]">
-      <div className="pt-12">
-        <SdmInsertForm
-          selectSidoData={selectSidoData}
-          selectSigunData={selectSigunData}
-          dataList={demandCompList}
-          rtnValue={callback}
-          rtnInputData={handleInsertSdmData}
-          openNetwork={true}
-        />
-        <Toaster position="top-center" />
-      </div>
-    </div>
-  );
-}
diff --git a/apps/dm/app/(base-layout)/pages/sdmMng/sdmLogin/page.tsx b/apps/dm/app/(base-layout)/pages/sdmMng/sdmLogin/page.tsx
deleted file mode 100644
index 2fd6fc461..000000000
--- a/apps/dm/app/(base-layout)/pages/sdmMng/sdmLogin/page.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-'use client'
-
-import { SdmLoginForm } from '@/components/ui/sdmLoginForm/component';
-
-export default function SdmLogin() {
-  return (
-    <div className="container mx-auto px-4 py-8">
-      <div className="text-center mb-8">
-        <h1 className="text-4xl font-bold text-gray-900 underline">
-          수요처 로그인
-        </h1>
-      </div>
-      <div className="max-w-3xl mx-auto bg-white rounded-lg shadow-md p-6">
-        <SdmLoginForm />
-      </div>
-    </div>
-  );
-}
\ No newline at end of file
diff --git a/apps/dm/app/(base-layout)/pages/sdmMng/sdmLogout/page.tsx b/apps/dm/app/(base-layout)/pages/sdmMng/sdmLogout/page.tsx
deleted file mode 100644
index 2c682bdbf..000000000
--- a/apps/dm/app/(base-layout)/pages/sdmMng/sdmLogout/page.tsx
+++ /dev/null
@@ -1,22 +0,0 @@
-"use client";
-/**
- *  수요처 로그아웃 화면
- *
- * 🔗 사용 API
- *  
- */
-import { useDmStore } from "@/app/store";
-import { useRouter } from "next/navigation";
-import { useEffect } from "react";
-
-export default function SdmLogout() {
-  const router = useRouter();
-  const { actionLogout } = useDmStore((state) => state);
-
-  useEffect(() => {
-    actionLogout();
-    router.push("/pages/sdmMng/sdmInfoInsert");
-  }, [actionLogout, router]);
-
-  return null;
-}
diff --git a/apps/dm/app/(base-layout)/pages/wrAbout/page.tsx b/apps/dm/app/(base-layout)/pages/wrAbout/page.tsx
deleted file mode 100644
index da3324ffc..000000000
--- a/apps/dm/app/(base-layout)/pages/wrAbout/page.tsx
+++ /dev/null
@@ -1,339 +0,0 @@
-'use client';
-
-import { useEffect, useRef, useState } from 'react';
-import Image from 'next/image';
-
-const NAVS = [
-  { id: 'card1', label: '물재이용이란' },
-  { id: 'card2', label: '물재이용 필요성' },
-  { id: 'card3', label: '빗물 재이용' },
-  { id: 'card4', label: '중수 재이용' },
-  { id: 'card5', label: '하수 재이용' },
-  { id: 'card6', label: '물재이용 목표' },
-];
-
-export default function WrAboutPage() {
-  const [activeIdx, setActiveIdx] = useState(0);
-  const navRefs = useRef<(HTMLLIElement | null)[]>([]);
-  const cardRefs = useRef<(HTMLElement | null)[]>([]);
-
-  // 클릭 시 이동
-  const handleNavClick = (idx: number) => {
-    setActiveIdx(idx);
-    const targetCard = cardRefs.current[idx];
-    if (targetCard) {
-      targetCard.scrollIntoView({ behavior: 'smooth', block: 'start' });
-    }
-  };
-
-  // 키보드 이벤트 처리
-  const handleKeyDown = (e: React.KeyboardEvent, idx: number) => {
-    if (e.key === 'Enter' || e.key === ' ') {
-      e.preventDefault();
-      handleNavClick(idx);
-    }
-  };
-
-  useEffect(() => {
-    const observerOptions = {
-      root: null,
-      rootMargin: '-200px 0px 0px 0px', // 상단에서 200px 지점을 기준으로
-      threshold: 0
-    };
-
-    const observer = new IntersectionObserver((entries) => {
-      entries.forEach((entry) => {
-        if (entry.isIntersecting) {
-          const idx = cardRefs.current.findIndex(ref => ref === entry.target);
-          if (idx !== -1) {
-            setActiveIdx(idx);
-          }
-        }
-      });
-    }, observerOptions);
-
-    // 각 카드 요소를 관찰
-    const cardsSnapshot = [...cardRefs.current];
-
-    cardsSnapshot.forEach((card) => {
-      if (card) {
-        observer.observe(card);
-      }
-    });
-  
-    return () => {
-      cardsSnapshot.forEach((card) => {
-        if (card) {
-          observer.unobserve(card);
-        }
-      });
-    };
-  }, []);
-
-  return (
-    <div className='bg-[#F2F2F2]'>
-      <main className="relative w-[950px] mx-auto pt-[100px] font-sans">
-        {/* 사이드바 */}
-        <nav className="fixed left-[290px] top-[195px] w-[210px] z-50" aria-label="물재이용 정보 섹션 내비게이션">
-          <ul role="list" className="relative space-y-6">
-            {NAVS.map((nav, idx) => (
-              <li
-                key={nav.id}
-                ref={(el) => { navRefs.current[idx] = el; }}
-                role="listitem"
-                tabIndex={0}
-                aria-current={idx === activeIdx ? 'true' : 'false'}
-                aria-label={`현재 위치: ${nav.label}`}
-                onClick={() => handleNavClick(idx)}
-                onKeyDown={(e) => handleKeyDown(e, idx)}
-                className={`font-NotoSansKR nav-item relative pl-6 text-2xl font-bold text-[#383838] cursor-pointer transition-all duration-300
-                after:content-[''] after:absolute after:top-6 after:left-[0.5rem] after:w-[2px] after:h-[24px] after:bg-[#C5C5C5] last:after:hidden 
-                ${idx === activeIdx ? 'text-4xl font-bold text-[#383838]' : ''}`}
-              >
-                <span className={`absolute left-[0.5rem] top-1 w-4 h-4 rounded-full -translate-x-1/2 transition-all duration-300
-                ${idx === activeIdx ? 'bg-blue-500 border-blue-500' : 'bg-white border-gray-400 border'}`}></span>
-                {nav.label}
-              </li>
-            ))}
-          </ul>
-        </nav>
-
-        <article ref={(el) => { cardRefs.current[0] = el; }} className="card-wrap pl-[100px] mb-24 !pt-0" id="card1" aria-labelledby="card1-title">
-          <h2 id="card1-title" className="font-NotoSansKR relative text-center text-4xl font-medium text-gray-900 mb-6">
-            <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-            물재이용이란
-          </h2>
-          <section aria-labelledby="card1-desc" className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px] ">
-            <h1 id="card1-desc" className="font-NotoSansKR text-[#269DDA] text-5xl font-bold mb-8">물 재이용이 무엇인가요?</h1>
-            <p className="font-NotoSansKR text-[#231815] text-2xl mb-10 leading-relaxed">
-              물 재이용은 빗물, 오수, 하수처리수, 폐수처리수 및 발전소 온배수를<br />
-              물 재이용시설을 이용하여 처리하고, 그 처리된 물을 생활, 공업, 농업, 조경,<br />
-              하천 유지 등의 용도로 이용하는 것을 말합니다.
-            </p>
-            <Image
-              src="/img/wrAbout/img_01_1.png"
-              alt="이 이미지는 물 재이용 시스템의 개요를 나타냅니다. 가정, 공공기관, 하수처리장 등에서 발생한 생활하수, 빗물, 하수처리수를 물 재이용 시설에서 처리한 후, 청소나 화장실, 농업, 살수차, 하천 유지, 공장, 공원 및 골프장 등 다양한 용도로 활용하는 과정을 도식화한 것입니다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto mb-8 rounded"
-            />
-            <p className="font-NotoSansKR text-center font-normal text-2xl">
-              환경부는 2011년에 &apos;물의 재이용 촉진 및 지원에 관한 법률&apos;을 제정하여<br />
-              한국환경공단과 함께 물 재이용 확대 및 촉진을 위해 노력하고 있습니다.
-            </p>
-          </section>
-        </article>
-
-        {/* 카드2 */}
-        <article ref={(el) => { cardRefs.current[1] = el; }} className="card-wrap pl-[100px] mb-24" id="card2" aria-labelledby="card2-title">
-          <h2 id="card2-title" className="font-NotoSansKR relative text-center text-4xl font-medium text-gray-900 mb-6">
-            <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-            물재이용 필요성
-          </h2>
-          <section aria-labelledby="card2-desc" className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px] ">
-            <h1 id="card2-desc" className="font-NotoSansKR text-[#D63F1F] text-5xl font-semibold mb-8">물 재이용, 왜 필요한가요?</h1>
-            <p className="font-NotoSansKR text-2xl font-normal mb-10 leading-relaxed">
-              빗물, 중수, 하수처리수는 지속적으로 이용 가능한 순환자원입니다.<br />
-              물 재이용을 통한 효율적인 수자원 활용은 물 스트레스국가인 우리나라에서<br />가뭄대응능력 향상 및 하천수질보전을 위해 반드시 필요한 일입니다.
-            </p>
-            <Image
-              src="/img/wrAbout/img_02_1.png"
-              alt="이 이미지는 기후변화로 인한 온도 상승 추이를 설명한다. 왼쪽에는 지구 그림과 온도계가 함께 표시되어 있으며, 지구 평균 기온은 지난 100년간 약 0.9℃ 상승했음을 나타낸다. 오른쪽에는 대한민국 지도와 함께 온도계가 있으며, 지난 100년간 약 1.8℃ 상승했음을 보여준다. 이는 지구 평균보다 2배 높은 수치이며, 자료 출처는 「기후변화 평가보고서 2020, 환경부·기상청」이다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto mb-8 w-[80%]"
-            />
-            <p className="font-NotoSansKR text-2xl mb-10 leading-relaxed">
-              - 우리나라의 기후변화 진행속도는 세계 평균을 상회하고 있습니다.<br />
-              - 기후변화로 인한 국지적인 가뭄은 더욱 자주, 더욱 심하게 일어나고 있으며, 우리의 물 안보를 위협하고 있습니다.
-            </p>
-            <Image
-              src="/img/wrAbout/img_02_2.png"
-              alt="세계 평균 1인당 강수량은 15,044m³이며, 대한민국은 2,546m³로 약 1/6 수준입니다. 계절별 강수량은 봄 10%, 여름 70%, 가을 15%, 겨울 5%입니다. 이는 여름철에 강수량이 집중되는 문제를 나타냅니다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto mb-8"
-            />
-            <p className="font-NotoSansKR text-2xl mb-10 leading-relaxed">
-              - 우리나라의 1인당 강수량은 2,546㎥ 으로 세계 평균 15,044㎥의 약 1/6 수준입니다.<br />
-              - 우리나라 강수량의 70%는 여름철에 집중되어 있어 이용 가능한 수자원확보가 어렵습니다.
-            </p>
-            <Image
-              src="/img/wrAbout/img_02_3.png"
-              alt="물 재이용은 환경을 보호하며 지속 가능한 발전이 가능하게 하고, 안정적인 수자원 확보, 깨끗하고 경제적인 공업용수 공급, 하천 수질 개선을 통한 생태계 회복에 기여합니다."
-              width={800}
-              height={400}
-              className="w-[93%] mx-auto"
-            />
-          </section>
-        </article>
-
-        {/* 카드3 */}
-        <article ref={(el) => { cardRefs.current[2] = el; }} className="card-wrap pl-[100px] mb-24" id="card3" aria-labelledby="card3-title">
-          <h2 id="card3-title" className="font-NotoSansKR relative text-center text-4xl font-medium text-gray-900 mb-6">
-            <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-            빗물 재이용
-          </h2>
-          <section aria-labelledby="card3-desc" className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px] ">
-            <h1 id="card3-desc" className="font-NotoSansKR leading-snug text-[#269DDA] text-5xl font-bold mb-6">친환경 수자원 빗물,<br />편리하게 사용할 수 있어요!</h1>
-            <p className="font-NotoSansKR text-2xl mb-10 leading-relaxed">가뭄을 극복하고 홍수를 예방하기 위해<br />비가 내릴 때 빗물을 모아두었다가 사용합니다.</p>
-            <Image
-              src="/img/wrAbout/img_03_1.png"
-              alt="주택 지붕에 내린 빗물을 저장조에 모아 조경용수, 화장실용수, 세척·살수용수로 재활용하는 과정을 보여줍니다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto mb-6"
-            />
-            <Image
-              src="/img/wrAbout/img_03_2.png"
-              alt="빗물이용"
-              width={200}
-              height={100}
-              className="mb-5 w-[20%]"
-            />
-            <p className="font-NotoSansKR text-2xl leading-relaxed">
-              - 의무 설치대상: 지붕면적 1,000㎡ 이상의 운동장, 체육관, 공공업무시설 등<br />
-              - 설 치 기 준: 집수시설, 처리시설, 빗물 저류조(지붕 집수면적 x 0.05m 이상)<br />
-              - 활 용 용 도: 골프장 등의 조경용수, 화장실용수, 세척·살수용수 등
-            </p>
-          </section>
-        </article>
-
-        {/* 카드4 */}
-        <article ref={(el) => { cardRefs.current[3] = el; }} className="card-wrap pl-[100px] mb-24" id="card4" aria-labelledby="card4-title">
-          <h2 id="card4-title" className="font-NotoSansKR relative text-center text-4xl font-medium text-gray-900 mb-6">
-            <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-            중수 재이용
-          </h2>
-          <section aria-labelledby="card4-desc" className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px] ">
-            <h1 id="card4-desc" className="font-NotoSansKR leading-snug text-[#9771B0] text-5xl font-bold mb-6">요모조모 쓸모 많은 중수,<br />알뜰하게 재이용할 수 있어요!</h1>
-            <p className="font-NotoSansKR text-2xl mb-10 leading-relaxed">한번 사용한 물을 중수도 시설을 통해 재생하여<br />개별적 또는 지역적으로 재이용할 수 있습니다.</p>
-            <Image
-              src="/img/wrAbout/img_04_1.png"
-              alt="욕실, 세면대, 주방, 세탁기 등에서 발생한 생활용수를 중수도 시설에서 처리하여 화장실 변기용수와 조경용수로 재이용하는 시스템 흐름도입니다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto mb-6"
-            />
-            <Image
-              src="/img/wrAbout/img_04_2.png"
-              alt="중수재이용"
-              width={200}
-              height={100}
-              className="mb-5 w-[20%]"
-            />
-            <p className="font-NotoSansKR text-2xl leading-relaxed">
-              - 의무 설치대상: 일정규모 이상의 대규모점포, 숙박/목욕장, 공장, 각종 개발사업 등<br />
-              - 의무 재이용량: 물 사용량의 10% 이상<br />
-              - 활 용 용 도: 청소·화장실용수, 세척·살수용수, 조경용수, 공업용수 등
-            </p>
-          </section>
-        </article>
-
-        {/* 카드5 */}
-        <article ref={(el) => { cardRefs.current[4] = el; }} className="card-wrap pl-[100px] mb-24" id="card5" aria-labelledby="card5-title">
-          <h2 id="card5-title" className="font-NotoSansKR relative text-center text-4xl font-medium text-gray-900 mb-6">
-            <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-            하수 재이용
-          </h2>
-          <section aria-labelledby="card5-desc" className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px] ">
-            <h1 id="card5-desc" className="font-NotoSansKR leading-snug text-[#00818A] text-5xl font-bold mb-6">아직 할 일이 많은 하수처리수,<br />풍족하게 재이용할 수 있어요!</h1>
-            <p className="font-NotoSansKR text-2xl mb-10 leading-relaxed">사용하고 버려져 공공하수처리장으로 모여든 물은<br />용도에 맞는 처리 후 재이용 할 수 있습니다.</p>
-            <Image
-              src="/img/wrAbout/img_05_1.png"
-              alt="주택과 건물에서 발생한 하수가 공공하수처리장을 거쳐 처리된 후, 물 재이용 시설에서 정화되어 공업용수, 하천유지용수, 농업용수, 세척·살수용수로 재활용됩니다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto mb-6"
-            />
-            <Image
-              src="/img/wrAbout/img_05_2.png"
-              alt="하수처리 재이용"
-              width={200}
-              height={100}
-              className="mb-5 w-[20%]"
-            />
-            <p className="font-NotoSansKR text-2xl leading-relaxed">
-              - 의무 이용대상: 공공하수처리장(시설용량 5,000㎥/일 이상)<br />
-              - 의무 재이용량: 일 하수처리량의 10% 이상<br />
-              - 활 용 용 도: 공업용수, 하천유지용수, 농업용수 등
-            </p>
-          </section>
-        </article>
-
-        {/* 카드6 */}
-        <article ref={(el) => { cardRefs.current[5] = el; }} className="card-wrap pl-[100px] mb-24" id="card6" aria-labelledby="card6-title">
-          <h2 id="card6-title" className="font-NotoSansKR relative text-center text-4xl font-medium text-gray-900 mb-6">
-            <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-            물재이용 목표
-          </h2>
-          <section aria-labelledby="card6-desc" className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px] ">
-            <h1 id="card6-desc" className="font-NotoSansKR leading-snug text-[#269DDA] text-5xl font-bold mb-6">2030년 물 재이용 목표를 위해<br />모두의 관심과 노력이 필요합니다.</h1>
-            <p className="font-NotoSansKR text-2xl mb-6 leading-relaxed">
-              환경부는 2030년까지의 제2차 물 재이용 기본계획을 수립하여<br />한국환경공단과 함께 물 재이용 확대 및 촉진을 위해 노력하고 있습니다.
-            </p>
-            <Image
-              src="/img/wrAbout/img_06_1.png"
-              alt="지속가능한 물 재이용 정착으로 건전한 물순환 확산"
-              width={800}
-              height={400}
-              className="w-[80%] mx-auto mb-6"
-            />
-            <div className="flex gap-3 flex-wrap justify-between bg-gray-100 p-6 rounded-lg mb-8">
-              <div className="flex-1 text-center">
-                <Image
-                  src="/img/wrAbout/icon_01.png"
-                  alt=""
-                  width={70}
-                  height={70}
-                  className="mx-auto mb-4 w-[auto] h-[70px]"
-                />
-                <h3 className="font-NotoSansKR text-center font-medium text-nowrap mb-2 text-2xl">도시 물 순환이용<br />체계로의 전환</h3>
-                <ul className="font-NotoSansKR text-xl text-gray-600 leading-relaxed space-y-1">
-                  <li className="text-nowrap">- 지속가능한 물 순환이용체계 구축</li>
-                  <li>- 물 재이용시설 관리체계 강화</li>
-                </ul>
-              </div>
-              <div className="flex-1 text-center">
-                <Image
-                  src="/img/wrAbout/icon_02.png"
-                  alt=""
-                  width={70}
-                  height={70}
-                  className="mx-auto mb-4 w-[auto] h-[70px]"
-                />
-                <h3 className="font-NotoSansKR text-center font-medium text-nowrap mb-2 text-2xl">유역기반 하수처리수 재이용<br />수요확대 및 공급체계 구축</h3>
-                <ul className="font-NotoSansKR text-xl text-gray-600 leading-relaxed space-y-1">
-                  <li>- 유역기반 통합물관리 연계 강화</li>
-                  <li>- 하수처리수 재이용 공업용수 공급 활성화</li>
-                  <li>- 하수처리수 재이용을 활용한 물순환 촉진</li>
-                </ul>
-              </div>
-              <div className="flex-1 text-center">
-                <Image
-                  src="/img/wrAbout/icon_03.png"
-                  alt=""
-                  width={70}
-                  height={70}
-                  className="mx-auto mb-4 w-[auto] h-[70px]"
-                />
-                <h3 className="font-NotoSansKR text-center font-medium text-nowrap mb-2 text-2xl">물 재이용 인식제고<br />및 산업발전 기반 마련</h3>
-                <ul className="font-NotoSansKR text-xl text-gray-600 leading-relaxed space-y-1">
-                  <li>- 물 재이용 교육 및 대국민 홍보 강화</li>
-                  <li>- 핵심기술 육성 및 산업발전 지원 강화</li>
-                </ul>
-              </div>
-            </div>
-            <Image
-              src="/img/wrAbout/img_06_2.png"
-              alt="물 재이용량은 2014년 13.3억톤에서 2030년 25.9억톤까지 증가할 것으로 예상됩니다. 그에 따른 기대 효과로는 연간 상수대체 17.9억톤, 물산업 시장성장 약 2조3,541억 원, 건천화된 73개 하천 해소, 약 20,550명의 고용 효과가 포함됩니다."
-              width={800}
-              height={400}
-              className="w-[90%] mx-auto"
-            />
-          </section>
-        </article>
-      </main>
-    </div>
-  );
-}
diff --git a/apps/dm/app/(base-layout)/pages/wrExample/page.tsx b/apps/dm/app/(base-layout)/pages/wrExample/page.tsx
deleted file mode 100644
index 4849c02b0..000000000
--- a/apps/dm/app/(base-layout)/pages/wrExample/page.tsx
+++ /dev/null
@@ -1,364 +0,0 @@
-import Image from "next/image";
-
-export default function WrExamplePage() {
-  return (
-    <div className="bg-[#F2F2F2]">
-      <div className="relative w-[950px] mx-auto pt-[50px] font-sans">
-        <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-          <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 rounded-full"></span>
-          물 재이용사례
-        </h2>
-      </div>
-      <div className="bg-[#F2F2F2] text-gray-800">
-        <div className="relative w-[950px] mx-auto pt-[50px] font-sans">
-          {/* 카드 1 */}
-          <div className="card-wrap mb-24" id="card1">
-            <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-              <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-              사업사례 1 
-            </h2>
-            <div className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px]">
-              {/* 사업명 */}
-              <section>
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업명</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  경기권역 반도체 사업장 물 재이용 사업<br />
-                  : 삼성전자 반도체 사업장 하수재이용수 공급(재이용시설 설치, 공급망 구축 등)
-                </p>
-              </section>
-              {/* 사업 배경 및 목적 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 배경 및 목적</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  삼성전자는 환경경영전략 실현과 반도체 공장의 안정적 용수 공급을 위해 하수 재이용수를 공업용수로 도입하기로 결정
-                </p>
-              </section>
-              {/* 사업 주요 내용 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 주요 내용</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  1단계 사업[화성·오산(12만㎥/일) → 삼성 화성·기흥(29년 공급)]<br />
-                  2단계 사업[수원(21만㎥/일) → 삼성 평택(30년 공급)]
-                </p>
-              </section>
-              {/* 특이사항 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">특이사항</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  본 사업은 광역 하수 재이용 공급망 구축의 첫 사업으로 초기 민관협의체를 구성·운영 후 관계기관(환경부, 경기도, 지자체, 공단, 수공, 삼성전자) 간 MOU 체결을 통해 사업을 추진하였으며, 반도체 사업장에 하수 재이용수를 공업용수로 공급하는 국내 첫 사업으로 위협부담 해소를 위해 사업을 단계별로 시행
-                </p>
-              </section>
-              {/* 단계별 시각 정보 */}
-              <section className="bg-white px-4 mt-8">
-                <Image 
-                  src="/img/wrExample/img_ex_01_1.png" 
-                  alt="사업단계 설명" 
-                  width={800}
-                  height={400}
-                  className="w-[100%] mx-auto mb-8" 
-                />
-              </section>
-            </div>
-          </div>
-
-          {/* 카드2 */}
-          <div className="card-wrap mb-24" id="card2">
-            <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-              <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-              사업사례 2
-            </h2>
-            <div className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px]">
-              {/* 사업명 */}
-              <section>
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업명</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  경기도 파주시 하수재이용<br />
-                  : 운정·금촌하수처리시설의 하수처리수를 막공법(U/F, R/O)으로 재처리하여 파주 LCD 산업단지내 3개 업체*에 공업용수 공급<br /><br />
-                  *LG디스플레이(P10공장), 희성전자, 엔비텍 등
-                </p>
-              </section>
-              {/* 사업 방식 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 방식</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  민간투자사업(시행사 : 파주그린허브(주), 운영사 : 테크로스)
-                </p>
-              </section>
-              {/* 사업 주요 내용 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 주요 내용</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  처리공정 : 전처리분리막(U/F) + 역삼투서비(R/O)<br />
-                  공급량 : 4만m³/일<br />
-                  관로 : 13.6km<br />
-                  사업비 : 651억원
-                </p>
-              </section>
-              {/* 특이사항 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">특이사항</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  하수처리수 재이용시설 자체 농축폐수 처리공정 개발 및 적용 성공사례
-                </p>
-                <div className="grid grid-cols-1 gap-0 items-start">
-                  {/* 좌측 이미지 */}
-                  <div>
-                    <Image 
-                      src="/img/wrExample/img_ex_02_1.png" 
-                      alt="적용 성공사례 지도" 
-                      width={1000}
-                      height={1200}
-                      className="w-[100%] mx-auto" 
-                    />
-                  </div>
-
-                  {/* 우측 표 */}
-                  <div className="space-y-3">
-                    {/* 하수처리수 공급 */}
-                    <div>
-                      <table className="min-w-full h-[500px]text-center border border-black">
-                        <colgroup>
-                          <col style={{ width: "20%" }} />
-                          <col style={{ width: "40%" }} />
-                          <col style={{ width: "40%" }} />
-                        </colgroup>
-                        <tbody>
-                          <tr>
-                            <td colSpan={3} className="font-NotoSansKR bg-[#ffc000] h-[30px] text-xl text-white font-semibold text-center pt-[6px] pb-[6px] px-0">하수처리수 공급</td>
-                          </tr>
-                          <tr className="text-xl h-[30px]">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">위치</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">금촌하수</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">운정하수</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">시설용량</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">44,000㎥/일</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">60,000㎥/일</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">유입량</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">27,000㎥/일<br />자연유하</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">30,000㎥/일<br />이송펌프장</td>
-                          </tr>
-                        </tbody>
-                      </table>
-                      {/* 첫 화살표 (자연유하 / 관로이송) */}
-                      <div className="flex h-[30px] justify-between items-center my-3 px-4">
-                        <div className="flex text-xl items-center gap-1 text-orange-600 font-bold pl-6">
-                          <span className="font-NotoSansKR">자연유하: 161m</span>
-                          <Image 
-                            src="/img/wrExample/img_arrow_down_1.png" 
-                            alt="오른쪽 화살표" 
-                            width={24}
-                            height={24}
-                            className="h-6 w-6" 
-                          />
-                        </div>
-                        <div className="flex text-xl items-center gap-1 text-orange-600 font-bold">
-                          <Image 
-                            src="/img/wrExample/img_arrow_down_1.png" 
-                            alt="왼쪽 화살표" 
-                            width={24}
-                            height={24}
-                            className="h-6 w-6" 
-                          />
-                          <span className="font-NotoSansKR">관로이송: 3.2km</span>
-                        </div>
-                      </div>
-                    </div>
-
-                    {/* 물재이용 처리시설 */}
-                    <div>
-                      <table className="min-w-full text-center border border-black">
-                        <colgroup>
-                          <col style={{ width: "50%" }} />
-                          <col style={{ width: "50%" }} />
-                        </colgroup>
-                        <tbody>
-                          <tr>
-                            <td colSpan={2} className="font-NotoSansKR bg-[#00b050] text-xl h-[30px] text-white font-semibold text-center pt-[6px] pb-[6px] px-0">물재이용 처리시설</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">유입유량</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">57,000㎥/일</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">재이용시설</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">40,000㎥/일</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">농축폐수처리</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">17,000㎥/일</td>
-                          </tr>
-                        </tbody>
-                      </table>
-                      {/* 두 번째 화살표 (공급관로) */}
-                      <div className="flex flex-col items-center my-3">
-                        <div className="flex h-[30px] items-center gap-1 text-xl text-blue-600 font-semibold">
-                          <span className="font-NotoSansKR">공급관로 L=10.4km</span>
-                          <Image 
-                            src="/img/wrExample/img_arrow_down_2.png" 
-                            alt="아래 화살표" 
-                            width={24}
-                            height={24}
-                            className="h-6 w-6" 
-                          />
-                        </div>
-                      </div>
-                    </div>
-
-                    {/* 수요처 공급 */}
-                    <div>
-                      <table className="min-w-full text-center border border-black">
-                        <colgroup>
-                          <col style={{ width: "50%" }} />
-                          <col style={{ width: "50%" }} />
-                        </colgroup>
-                        <tbody>
-                          <tr>
-                            <td colSpan={2} className="font-NotoSansKR bg-[#3399ff] h-[30px] text-xl text-white font-semibold text-center pt-[6px] pb-[6px] px-0">수요처 공급</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">수요처</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">LG디스플레이 외 2개사</td>
-                          </tr>
-                          <tr className="text-sm">
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">수요량</td>
-                            <td className="font-NotoSansKR text-xl h-[30px] border-black border p-1 font-bold">40,000㎥/일</td>
-                          </tr>
-                        </tbody>
-                      </table>
-                    </div>
-                  </div>
-                </div>
-              </section>
-            </div>
-          </div>
-
-          {/* 카드3 */}
-          <div className="card-wrap mb-24" id="card3">
-            <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-              <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-              사업사례 3
-            </h2>
-            <div className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px]">
-              {/* 사업명 */}
-              <section>
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업명</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  충남 보령 하수재이용<br />
-                  : 보령·신보령화력발전소에 하루 1만톤의 탈황용수 공급을 위해 보령하수처리시설의 하수처리수 재이용 사업 추진
-                </p>
-              </section>
-              {/* 사업 방식 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 방식</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  2017년 한국환경공단과 사업대행 위 · 수탁 협약 체결
-                </p>
-              </section>
-              {/* 사업 주요 내용 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 주요 내용</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  처리공정 : 전처리분리막(U/F) + 역삼투서비(R/O)<br />
-                  공급량 : 1만m3/일<br />
-                  관로 : 8.7km<br />
-                  사업비 : 315억원(국비 216억원, 재원협의(안))
-                </p>
-              </section>
-              {/* 특이사항 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">특이사항</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  국내 유일 하수재이용 공업용수 공급 재정사업으로 2016년 충남 서부권 가뭄 시 지역사회 기여 차원에서 기관간 MOU (환경부, 충청남도, 보령시, 한국중부발전㈜)를 바탕
-                  으로 추진 되어 경제성보다 공익성을 바탕으로 국가전력 기반시설의 안정적 운영 도모
-                </p>
-                <div className="p-2">
-                  <Image 
-                    src="/img/wrExample/img_ex_03_1.png" 
-                    alt="국가전력 기반시설 설명" 
-                    width={700}
-                    height={350}
-                    className="w-[100%] mx-auto" 
-                  />
-                </div>
-              </section>
-            </div>
-          </div>
-
-          {/* 카드4 */}
-          <div className="card-wrap mb-24" id="card4">
-            <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-              <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-              사업사례 4
-            </h2>
-            <div className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px]">
-              {/* 사업명 */}
-              <section>
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업명</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  경기도 수원시 빗물이용과 중수도
-                </p>
-              </section>
-              {/* 사업 내용 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 내용</h2>
-                <p className="font-NotoSansKR text-2xl font-semibold text-gray-800 leading-relaxed">
-                  (빗물) 월드컵경기장 등 4개소에 노면 빗물분사시스템 및 빗물 공급기를 설치하여 혹서기 도시 열섬효과 및 도로 비산먼지 저감<br />
-                  &nbsp;&nbsp;※ 시설 가동중 도로 노면 온도의 7.2 ~ 26.3℃ 감소 효과 확인(21.7월, 수원시청).<br />
-                  &nbsp;&nbsp;다만, 가뭄기나 강우량이 적을 경우 빗물을 원활히 공급하기 다소 곤란<br /><br />
-                  - (중수도) 수원시청, 장안구청, 월드컵경기장에 빗물 연계 중수도를 화장실·조경용수 등으로 사용하여 수도요금 절감(연 7백~30백만원)
-                </p>
-                <div className="grid grid-cols-1 md:grid-cols-2 gap-2 items-start p-2">
-                  <div>
-                    <Image 
-                      src="/img/wrExample/img_ex_04_1.png" 
-                      alt="월드컵경기장 인근도로 노면 살수 이미지" 
-                      width={350}
-                      height={250}
-                      className="w-[100%] mx-auto" 
-                    />
-                    <span className="font-NotoSansKR text-xl block text-center font-semibold my-2">＜월드컵경기장 인근도로 노면 살수＞</span>
-                  </div>
-                  <div>
-                    <Image 
-                      src="/img/wrExample/img_ex_04_2.png" 
-                      alt="주유기 모양의 빗물 공급기 이미지" 
-                      width={350}
-                      height={250}
-                      className="w-[100%] mx-auto" 
-                    />
-                    <span className="font-NotoSansKR text-xl block text-center font-semibold my-2">＜주유기 모양의 빗물 공급기＞</span>
-                  </div>
-                  <div>
-                    <Image 
-                      src="/img/wrExample/img_ex_04_3.png" 
-                      alt="빗물주유기에서 살수용수 공급 이미지" 
-                      width={350}
-                      height={250}
-                      className="w-[100%] mx-auto" 
-                    />
-                    <span className="font-NotoSansKR text-xl block text-center font-semibold my-2">＜빗물주유기에서 살수용수 공급＞</span>
-                  </div>
-                  <div>
-                    <Image 
-                      src="/img/wrExample/img_ex_04_4.png" 
-                      alt="빗물 공급기 및 빗물분사장치 위치" 
-                      width={350}
-                      height={250}
-                      className="w-[100%] mx-auto" 
-                    />
-                    <span className="font-NotoSansKR text-xl block text-center font-semibold my-2">＜빗물 공급기 및 빗물분사장치 위치＞</span>
-                  </div>
-                </div>
-              </section>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}
-
diff --git a/apps/dm/app/(base-layout)/pages/wrOverview/page.tsx b/apps/dm/app/(base-layout)/pages/wrOverview/page.tsx
deleted file mode 100644
index 3e5825899..000000000
--- a/apps/dm/app/(base-layout)/pages/wrOverview/page.tsx
+++ /dev/null
@@ -1,113 +0,0 @@
-import Image from "next/image";
-
-export default function WrOverviewPage() {
-  return (
-    <div className="bg-[#F2F2F2]">
-        <div className="relative w-[950px] mx-auto pt-[50px] font-sans">
-          {/* 카드 1 - 물재이용 사업 추진 절차 */}
-          <div className="card-wrap mb-24" id="card1">
-            <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-              <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-              물재이용 사업 추진 절차 
-            </h2>
-            <div className="bg-white border border-gray-300 rounded-xl p-[60px] py-[50px]">
-              <table className="table-fixed w-full text-center text-sm">
-                <caption className="sr-only">물 재이용 추진 절차 상세 표</caption>
-                <colgroup>
-                  <col style={{ width: "28%" }} />
-                  <col style={{ width: "2%" }} />
-                  <col style={{ width: "35%" }} />
-                  <col style={{ width: "5%" }} />
-                  <col style={{ width: "30%" }} />
-                </colgroup>
-                <tbody>
-                  {/* 1단계 */}
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">타당성 조사</td><td></td><td></td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 2단계 */}
-                  <tr><td className="font-NotoSansKR text-2xl bg-[#F4D62D] text-black font-bold py-5">매칭시스템 신청</td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">사업계획(안) 수립</td><td></td><td></td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 3단계 */}
-                  <tr><td className="font-NotoSansKR text-2xl bg-[#F4D62D] text-black font-bold py-5">하수도정보시스템 신청</td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">국고지원 신청</td><td className="font-NotoSansKR text-2xl font-bold">→</td><td className="font-NotoSansKR text-2xl text-[#fff] bg-[#00B076] font-bold py-5">기술검토(한국환경공단)</td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 4단계 */}
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">국고지원 확정 통보</td><td></td><td></td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 5단계 */}
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">사업계획 수립(실시설계)</td><td></td><td></td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 6단계 */}
-                  <tr><td className="font-NotoSansKR text-2xl bg-[#F4D62D] text-black font-bold py-5">(행정관) 기술검토 신청</td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">재원협의(지방환경관서장)</td><td className="font-NotoSansKR text-2xl font-bold">→</td><td className="font-NotoSansKR text-2xl text-[#fff] bg-[#00B076] font-bold py-5">기술검토(한국환경공단)</td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 7단계 */}
-                  <tr><td className="font-NotoSansKR text-2xl bg-[#F4D62D] text-black font-bold py-5">(행정관) 기술검토 신청</td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">설치승인(시도지사)</td><td className="font-NotoSansKR text-2xl font-bold">→</td><td className="font-NotoSansKR text-2xl text-[#fff] bg-[#00B076] font-bold py-5">기술검토(한국환경공단)</td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 8단계 */}
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">공사시행</td><td></td><td></td></tr>
-                  <tr><td></td><td></td><td className="font-NotoSansKR text-2xl font-bold text-center">↓</td><td></td><td></td></tr>
-                  {/* 9단계 */}
-                  <tr><td className="font-NotoSansKR text-2xl bg-[#F4D62D] text-black font-bold py-5">(행정관) 기술검토 신청</td><td></td><td className="font-NotoSansKR text-[17px] bg-[#EAEFF3] font-bold py-5">준공(국고정산)</td><td className="font-NotoSansKR text-2xl font-bold">→</td><td className="font-NotoSansKR text-2xl text-[#fff] bg-[#00B076] font-bold py-5">기술검토(한국환경공단)</td></tr>
-                </tbody>
-              </table>
-            </div>
-          </div>
-
-          {/* 카드 2 - 물재이용 매칭 시스템 */}
-          <div className="mt-36 card-wrap mb-24" id="card2">
-            <h2 className="font-NotoSansKR relative text-center text-4xl font-bold text-gray-900 mb-6">
-              <span className="absolute left-1/2 top-[-15px] -translate-x-1/2 w-24 h-2 bg-blue-500 rounded-full"></span>
-              물재이용 매칭 시스템이란?
-            </h2>
-            <div className="bg-white border border-gray-300 rounded-xl p-[60px] pt-[70px] pb-[70px]">
-              {/* 개요 */}
-              <section>
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">개요</h2>
-                <p className="font-NotoSansKR text-2xl font-bold text-gray-800 leading-relaxed">
-                  기후변화 및 지자체의 개발속도 차이에 따라 물 자원의 수요-공급 불균형이 발생하여 빗물, 중수도, 하수처리 재처리수 등의 공급 여유가 있는 지자체의 재이용수를 부족한 지자체 수요처에 공급하여 불균형 해소를 통한 수자원 절약 및 물 자원 순환
-                </p>
-              </section>
-
-              {/* 구성 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">구성</h2>
-                <ul className=" font-NotoSansKR list-[square] pl-6 text-2xl font-bold text-gray-800 leading-relaxed space-y-2">
-                  <li>공급자: 하수처리장, 빗물이용시설, 중수도 등</li>
-                  <li>수요자: 산업체(냉각수), 공공시설(조경, 도로청소), 농민(농업용수) 등</li>
-                  <li>시스템: 수질, 수량, 거리 기반 매칭, 중개</li>
-                  <li>운영주체: 한국환경공단</li>
-                </ul>
-              </section>
-
-              {/* 절차 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">사업 주요 내용</h2>
-                <p className="font-NotoSansKR text-2xl font-bold text-gray-800 leading-relaxed">
-                  ① 공급자 등록 → ② 수요자 조건 입력 → ③ 매칭 검토 → ④ 시스템 매칭 → ⑤ 계약·공급 이행
-                </p>
-              </section>
-
-              {/* 기대효과 */}
-              <section className="mt-8">
-                <h2 className="font-NotoSansKR text-2xl text-[#657D91] font-bold bg-[#EAEFF3] p-3 rounded mb-4">기대효과</h2>
-                <ul className="font-NotoSansKR list-[square] pl-6 text-2xl font-bold text-gray-800 leading-relaxed space-y-2">
-                  <li>물 자원 수요-공급 조정을 통한 효율적 분배</li>
-                  <li>물 재이용시설 데이터 수집으로 체계적 관리</li>
-                  <li>지자체, 사업시행자 등 재이용 정보 획득 용이</li>
-                </ul>
-                <div className="text-center my-6">
-                  <Image 
-                    src="/img/wrOverview/img_ov_01_1.png" 
-                    alt="하수 재이용 시스템 흐름도. 저장탱크에서 재처리된 물이 손 씻기, 수도, 세정 등에 공급되며 재이용 활성화를 통해 최적의 물공급 방안이 마련되는 과정을 시각화함." 
-                    width={650}
-                    height={500}
-                    className="h-[500px] mx-auto mb-4 rounded" 
-                  />
-                  <p className="font-NotoSansKR text-2xl font-bold text-gray-800 mt-10">(하수 재이용 시스템 개요도)</p>
-                </div>
-              </section>
-              </div>
-        </div>
-      </div>
-    </div>
-  );
-}
\ No newline at end of file
diff --git a/apps/dm/app/(base-layout)/pages/wrStatus/page.tsx b/apps/dm/app/(base-layout)/pages/wrStatus/page.tsx
deleted file mode 100644
index f8d9704d4..000000000
--- a/apps/dm/app/(base-layout)/pages/wrStatus/page.tsx
+++ /dev/null
@@ -1,387 +0,0 @@
-'use client';
-
-import { regionData, regionIdMap } from '@/app/common/comFunction';
-import { useDmStore } from '@/app/store';
-import type { DmStatusDataType } from '@/app/store/wrStatus/type';
-import { CHART_FORM, MainChart, type ChartConfig } from '@common/business_components';
-import React, { useEffect, useRef, useState,  useCallback } from 'react';
-import { setCookie } from "../../../../src/shared/lib";
-
-setCookie("site-id-key", process.env.NEXT_PUBLIC_SITE_ID || "DM");
-
-interface WrStatusChartProps {
-  chartForm: string;
-  chartConfig: ChartConfig;
-  chartData: any;
-  chartTitle: string;
-  chartClassName?: string;
-  graphSize?: number;
-  yFieldText? : string | undefined;
-  yFieldText2? : string | undefined;
-  showLegend? : boolean;
-  setXAxisYearTick ?: boolean;
-}
-
-export default function WrStatusPage() {
-
-
-
-
-  const { Common, dmStatus, getDmStatusData,initializeCommonData} = useDmStore((state) => state);
-  const { year:defaultYear, statusData,facilityTotals ,chartData} = dmStatus;
-  const [selectedRegion, setSelectedRegion] = useState<string | null>(null);
-  const [hoveredRegion, setHoveredRegion] = useState<string | null>(null);
-  const [tooltipPosition, setTooltipPosition] = useState<{ x: number; y: number } | null>(null);
-  const [chartOption, setChartOption] = useState<WrStatusChartProps>({} as WrStatusChartProps);
-
-  const svgContainerRef = useRef<HTMLDivElement>(null);
-  const colorLegend = [
-    { label: '하수', color: '#FF6B6B', key: 'sewage' },
-    { label: '빗물', color: '#4ECDC4', key: 'rainwater' },
-    { label: '중수도', color: '#45B7D1', key: 'reclaimed' },
-  ];
-  const facilityTotalsColor = ['#FF6B6B', '#4ECDC4', '#45B7D1', '#FED16A'];
-  // const [defaultYear, setDefaultYear] = useState<string>("");
-  // const defaultYear= '2023';
-
-
-  const handleMarkerClick = (regionId: string) => {
-    if (selectedRegion === regionId) {
-      setSelectedRegion(null);
-    } else {
-      setSelectedRegion(regionId);
-    }
-  };
-
-
-  useEffect(() => {
-    initializeCommonData();
-  }, [initializeCommonData]);
-
-  const createDonutMarker = useCallback((svg: SVGSVGElement, x: number, y: number, name: string, values: number[]) => {
-    const colors = ['#FF6B6B', '#4ECDC4', '#45B7D1', '#FED16A'];
-    const radius = 26;
-    const innerRadius = 18;
-    // const regionId = regionIdMap[name];
-    const regionId = regionIdMap[name];
-    if (!regionId) {
-      console.warn(`Invalid region name: ${name}`);
-      return;
-    }
-    const g = document.createElementNS('http://www.w3.org/2000/svg', 'g');
-    g.setAttribute('transform', `translate(${x}, ${y})`);
-    g.setAttribute('id', `marker-${name}`);
-    g.style.cursor = 'pointer';
-    g.setAttribute('role', 'button');
-    g.setAttribute('tabindex', '0');
-    g.setAttribute('aria-label', `${name} 지역 선택`);
-
-    const bg = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
-    bg.setAttribute('r', radius.toString());
-    bg.setAttribute('fill', 'white');
-    bg.setAttribute('pointer-events', 'all');
-    g.appendChild(bg);
-
-    let startAngle = 0;
-    values.forEach((value, idx) => {
-      const endAngle = startAngle + value * 2 * Math.PI;
-      const x1 = radius * Math.sin(startAngle);
-      const y1 = -radius * Math.cos(startAngle);
-      const x2 = radius * Math.sin(endAngle);
-      const y2 = -radius * Math.cos(endAngle);
-      const largeArc = endAngle - startAngle > Math.PI ? 1 : 0;
-      const d = `M ${x1} ${y1} A ${radius} ${radius} 0 ${largeArc} 1 ${x2} ${y2} L 0 0 Z`;
-
-      const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
-      path.setAttribute('d', d);
-      path.setAttribute('fill', colors[idx % colors.length] as string);
-      g.appendChild(path);
-
-      startAngle = endAngle;
-    });
-
-    const center = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
-    center.setAttribute('r', innerRadius.toString());
-    center.setAttribute('fill', 'white');
-    g.appendChild(center);
-
-    const text = document.createElementNS('http://www.w3.org/2000/svg', 'text');
-    text.setAttribute('x', '0');
-    text.setAttribute('y', '2');
-    text.setAttribute('text-anchor', 'middle');
-    text.setAttribute('font-size', '13');
-    text.setAttribute('font-weight', 'bold');
-    text.setAttribute('dominant-baseline', 'middle');
-    text.setAttribute('fill', 'black');
-    text.textContent = name || '';
-    g.appendChild(text);
-    
-    g.addEventListener('mouseenter', (e) => {
-      setHoveredRegion(regionId);
-      setTooltipPosition({ x: e.clientX, y: e.clientY });
-    });
-
-    g.addEventListener('mouseleave', () => {
-      setHoveredRegion(null);
-      setTooltipPosition(null);
-    });
-
-    g.addEventListener('click', () => {
-      handleMarkerClick(regionId);
-    });
-
-    g.addEventListener('keydown', (e) => {
-      if (e.key === 'Enter' || e.key === ' ') {
-        e.preventDefault();
-
-        const matrix = g.getScreenCTM();
-        if (!matrix) return; // 또는 console.warn('matrix is null'); return;
-
-        const point = svg.createSVGPoint();
-        point.x = 0;
-        point.y = 0;
-        const transformed = point.matrixTransform(matrix);
-
-        setTooltipPosition({ x: transformed.x, y: transformed.y });
-        setHoveredRegion(regionId);
-        handleMarkerClick(regionId);
-      }
-    });
-
-    svg.appendChild(g);
-  }, [handleMarkerClick, regionIdMap]);
-
-
-  useEffect(() => {
-    if(Common.selectSidoData&&Common.selectSidoData.length>1) {
-      getDmStatusData(Common.selectSidoData);
-    }
-  },[Common.selectSidoData, getDmStatusData])
-
-  useEffect(() => {
-    const loadSVG = async () => {
-      try {
-        const response = await fetch('/img/wrStatus/southKoreaMap.svg');
-        const svgText = await response.text();
-        
-        if (svgContainerRef.current) {
-          svgContainerRef.current.innerHTML = svgText;
-          
-          const svg = svgContainerRef.current.querySelector('svg') as SVGSVGElement;
-          if (svg) {
-            svg.style.width = '58%';
-            svg.style.height = 'auto';
-            svg.style.objectFit = 'contain';
-
-            // Set default fills
-            const paths = svg.querySelectorAll('path');
-            paths.forEach(path => {
-              if (!path.getAttribute('fill') || path.getAttribute('fill') === 'none') {
-                path.setAttribute('fill', '#ffffff');
-              }
-            });
-
-            // Create markers
-            regionData.forEach(region => {
-              createDonutMarker(svg, region.x, region.y, region.name, region.values);
-            });
-          }
-        }
-      } catch (error) {
-        console.error('SVG 로딩 실패:', error);
-        if (svgContainerRef.current) {
-          svgContainerRef.current.innerHTML = "<p className='text-red-500'>SVG 로딩 실패</p>";
-        }
-      }
-    };
-
-    loadSVG();
-  }, [createDonutMarker, regionData]);
-
-  useEffect(() => {
-    const svg = svgContainerRef.current?.querySelector('svg');
-    if (svg) {
-      const paths = svg.querySelectorAll('path');
-      paths.forEach(path => {
-        const pathId = path.getAttribute('id');
-        if (pathId) {
-          if (selectedRegion === pathId) {
-            path.setAttribute('fill', '#2563eb');
-          } else {
-            const original = '#ffffff';
-            path.setAttribute('fill', original);
-          }
-        }
-      });
-    }
-  }, [selectedRegion]);
-  useEffect(() => {
-    if(chartData.length>0){
-      const chartConfig = chartData.reduce((config, element) => {
-        config[element.label] = {
-          label: element.label,
-          color : "hsl(var(--chart-1))"
-        };
-        return config;
-      }, {} as Record<string, { label: string; color: string; }>) satisfies ChartConfig;
-    
-      const Option = {
-        chartForm : CHART_FORM.BAR,
-        chartConfig : chartConfig,
-        chartData : chartData,
-        chartTitle : '',
-        chartClassName : "w-full h-[350px] ",
-        graphSize : 10,
-        yFieldText : '시설(개소)',
-        showLegend : true
-      }
-      setChartOption(Option)
-    }else{
-      setChartOption({} as WrStatusChartProps)
-    }
-  }, [chartData]);
-
-  return (
-    <div className="flex h-screen bg-[#F2F2F2] text-gray-800">
-      {/* 우측 콘텐츠 영역 */}
-      <main className="flex-1 p-6 overflow-auto">
-        {/* 상단 제목 */}
-        <div className="mb-6 flex justify-between items-center">
-          <h2 className="text-2xl font-bold">물재이용 현황</h2>
-        </div>
-
-        {/* 콘텐츠 본문 */}
-        <div className="grid grid-cols-1 xl:grid-cols-2 gap-4">
-          {/* 지도 카드 */}
-          <div className="bg-white rounded-xl shadow border border-[#DBE2E6] overflow-hidden max-h-[900px]">
-            {/* 타이틀 영역 */}
-            <div className="border-b border-[#DBE2E6] px-4 py-3">
-              <h3 className="text-[12px] font-semibold">{`재이용시설현황(${defaultYear})`}</h3>
-              <p className="text-[12px] text-[#999] font-medium">행정구역별 재이용시설현황(개소)</p>
-            </div>
-            
-            {/* 본문 콘텐츠 */}
-            <div className="p-4">
-              <div className="bg-[#E2EDF3] p-4 rounded shadow relative">
-                <div className="flex justify-center">
-                  <div 
-                    ref={svgContainerRef}
-                    className="w-full max-w-5xl max-h-[680px] overflow-y-auto block mx-auto"
-                    aria-label="대한민국 지역별 재이용시설 분포도" 
-                    role="region" 
-                    tabIndex={0}
-                  />
-                </div>
-
-                {typeof window !== 'undefined' && hoveredRegion && tooltipPosition && (
-                  <div
-                    className="fixed bg-white text-[12px] text-gray-700 border border-gray-300 shadow-lg rounded px-3 py-2 z-50"
-                    style={{
-                      top: tooltipPosition.y + 10,
-                      left: tooltipPosition.x + 10,
-                      pointerEvents: 'none',
-                    }}
-                  >
-                    <div className="font-semibold mb-1">{hoveredRegion}</div>
-                    <div className="space-y-1">
-                      {colorLegend.map(({ label, color, key }) => (
-                        <div key={key+'' +color} className="flex items-center space-x-2">
-                          <span className="text-[12px] inline-block w-3 h-3 rounded-sm" style={{ backgroundColor: color }}></span>
-                          <span className="text-[12px]">
-                            {label}:{' '}
-                            {statusData?.find(d => d.region === hoveredRegion)?.[key as keyof DmStatusDataType] || '-'}
-                          </span>
-                        </div>
-                      ))}
-                    </div>
-                  </div>
-                )}
-
-                {/* 범례 */}
-                <div className="absolute bottom-2 right-2 bg-white rounded-lg shadow-md p-4 text-sm space-y-2">
-                  {facilityTotals?.map((item, index) => (
-                      <div key ={'fcltTotal' +index}className="flex items-center space-x-2">
-                      <span className="inline-block w-4 h-4 rounded-sm" style={{backgroundColor:facilityTotalsColor[index]}}></span>
-                      <span className="text-[12px] text-gray-900">{item}</span>
-                    </div>
-                    )) }
-                </div>
-              </div>
-            </div>
-          </div>
-
-          {/* 우측 콘텐츠 (표 + 차트) */}
-          <div className="col-span-1 flex flex-col space-y-4">
-            {/* 재이용시설현황 표 */}
-            <div className="bg-white rounded-xl shadow border border-[#DBE2E6] overflow-hidden">
-              {/* 타이틀 + 버튼 영역 */}
-              <div className="flex justify-between items-center border-b border-[#436d85] px-4 py-3">
-                <div>
-                  <h3 className="text-[12px] font-semibold">{`재이용시설현황(${defaultYear})`}</h3>
-                  <p className="text-[12px] text-[#999] font-medium">행정구역별 재이용시설현황[개소(천m³/년)]</p>
-                </div>
-              </div>
-              <div className="p-4">
-                <div className="rounded border border-[#DBE2E6] shadow overflow-auto max-h-[292px] p-4">
-                  <table className="min-w-full text-sm text-center">
-                    <caption className="sr-only text-[12px]">행정구역별 하수, 빗물, 중수도, 온배수 재이용시설 수</caption>
-                    <thead className="bg-gray-50 text-xs text-gray-600 uppercase border-b">
-                      <tr>
-                        <th className="text-[12px] font-semibold px-4 py-2">번호</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">시도</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">하수재이용시설</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">빗물이용시설</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">중수도시설</th>
-                        {/* <th className="text-[12px] font-semibold px-4 py-2">하수(이용량,천𝓂³/년)</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">빗물(이용량,천𝓂³/년)</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">중수도(이용량,천𝓂³/년)</th>
-                        <th className="text-[12px] font-semibold px-4 py-2">온배수(이용량,천𝓂³/년)</th> */}
-                      </tr>
-                    </thead>
-                    <tbody className="divide-y">
-                      {statusData?.map((row, index) => (
-                        <tr key={index} className="hover:bg-gray-50">
-                          <td className="text-[12px] px-4 py-2 text-center">
-                            {index+1}
-                          </td>
-                          <td className="text-[12px]">{row.region}</td>
-                          <td className="text-[12px]">{row.sewage}</td>
-                          <td className="text-[12px]">{row.rainwater}</td>
-                          <td className="text-[12px]">{row.reclaimed}</td>
-                        </tr>
-                      ))}
-                    </tbody>
-                  </table>
-                </div>
-              </div>
-            </div>
-
-            {/* 재이용통계 차트 */}
-            <div className="bg-white rounded-xl shadow border border-[#DBE2E6] overflow-hidden">
-              <div className="border-b border-[#DBE2E6] px-4 py-3">
-                <h3 className="text-[12px] font-semibold">{`재이용통계(${defaultYear})`}</h3>
-                <p className="text-[12px] text-[#999] font-medium">행정구역별 재이용시설 현황 개소수 그래프</p>
-              </div>
-              <div className="p-4 bg-[#f9fbfd]">
-                <div className="h-[305px] text-gray-500">
-                {chartOption?
-                 <MainChart 
-                  chartForm={chartOption.chartForm}
-                  chartConfig={chartOption.chartConfig} 
-                  chartData={chartOption.chartData?.filter(item=>item.label!= '')} 
-                  chartTitle={chartOption.chartTitle} 
-                  chartClassName={chartOption.chartClassName}
-                  graphSize={chartOption.graphSize}
-                  yFieldText={chartOption.yFieldText}
-                  showLegend={chartOption.showLegend}
-                />
-              :<></>}
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </main>
-    </div>
-  );
-};
diff --git a/apps/dm_new/app/(landing)/reuse/_components/CaseTabsCarousel.tsx b/apps/dm/app/(landing)/reuse/_components/CaseTabsCarousel.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/CaseTabsCarousel.tsx
rename to apps/dm/app/(landing)/reuse/_components/CaseTabsCarousel.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/ImageSlider.tsx b/apps/dm/app/(landing)/reuse/_components/ImageSlider.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/ImageSlider.tsx
rename to apps/dm/app/(landing)/reuse/_components/ImageSlider.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/Lnb.tsx b/apps/dm/app/(landing)/reuse/_components/Lnb.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/Lnb.tsx
rename to apps/dm/app/(landing)/reuse/_components/Lnb.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/LoginStatus.tsx b/apps/dm/app/(landing)/reuse/_components/LoginStatus.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/LoginStatus.tsx
rename to apps/dm/app/(landing)/reuse/_components/LoginStatus.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/PostcodeModal.tsx b/apps/dm/app/(landing)/reuse/_components/PostcodeModal.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/PostcodeModal.tsx
rename to apps/dm/app/(landing)/reuse/_components/PostcodeModal.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/SideIndicator.tsx b/apps/dm/app/(landing)/reuse/_components/SideIndicator.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/SideIndicator.tsx
rename to apps/dm/app/(landing)/reuse/_components/SideIndicator.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/SubPageHeader.tsx b/apps/dm/app/(landing)/reuse/_components/SubPageHeader.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_components/SubPageHeader.tsx
rename to apps/dm/app/(landing)/reuse/_components/SubPageHeader.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_components/TopNav.tsx b/apps/dm/app/(landing)/reuse/_components/TopNav.tsx
similarity index 92%
rename from apps/dm_new/app/(landing)/reuse/_components/TopNav.tsx
rename to apps/dm/app/(landing)/reuse/_components/TopNav.tsx
index 17c6f5e04..95598aaa7 100644
--- a/apps/dm_new/app/(landing)/reuse/_components/TopNav.tsx
+++ b/apps/dm/app/(landing)/reuse/_components/TopNav.tsx
@@ -53,7 +53,9 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
 
   // ✅ 유효성/서버 에러 표시용
   const [errors, setErrors] = useState<Partial<Record<FieldKey, string>>>({});
-  const [touched, setTouched] = useState<Partial<Record<FieldKey, boolean>>>({});
+  const [touched, setTouched] = useState<Partial<Record<FieldKey, boolean>>>(
+    {},
+  );
   const [submitting, setSubmitting] = useState(false);
 
   useEffect(() => {
@@ -99,7 +101,8 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
 
     if (!b) next.bizNo = "사업자등록번호를 입력해주세요.";
     else if (!isBizNoValid(b))
-      next.bizNo = "사업자등록번호 형식이 올바르지 않습니다. (예: 123-45-67890)";
+      next.bizNo =
+        "사업자등록번호 형식이 올바르지 않습니다. (예: 123-45-67890)";
 
     if (!noWorker && !w) next.workerNo = "종사자등록번호를 입력해주세요.";
 
@@ -115,7 +118,7 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
   const markAllTouched = () =>
     setTouched({ bizNo: true, workerNo: true, pw: true });
 
-  const submit = async (e: React.FormEvent) => {
+  const submit = async (e: React.SubmitEvent) => {
     e.preventDefault();
     markAllTouched();
 
@@ -138,7 +141,10 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
       // --- 데모: 비밀번호가 "1234"면 성공 처리(원하면 제거) ---
       const serverOk = pw.trim() === "1234";
       if (!serverOk) {
-        setErrors((p) => ({ ...p, pw: "잘못된 비밀번호입니다. (데모: 1234 입력 시 성공)" }));
+        setErrors((p) => ({
+          ...p,
+          pw: "잘못된 비밀번호입니다. (데모: 1234 입력 시 성공)",
+        }));
         setTouched((p) => ({ ...p, pw: true }));
         return;
       }
@@ -210,7 +216,9 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
                     validate();
                   }}
                   placeholder="사업자등록번호를 입력하세요. (예: 123-45-67890)"
-                  className={inputCls({ hasError: !!(touched.bizNo && errors.bizNo) })}
+                  className={inputCls({
+                    hasError: !!(touched.bizNo && errors.bizNo),
+                  })}
                 />
                 {touched.bizNo && errors.bizNo && (
                   <p className="mt-3 text-[14px] font-medium text-red-500">
@@ -251,7 +259,8 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
                   placeholder="종사자등록번호를 입력하세요."
                   className={inputCls({
                     disabled: noWorker,
-                    hasError: !noWorker && !!(touched.workerNo && errors.workerNo),
+                    hasError:
+                      !noWorker && !!(touched.workerNo && errors.workerNo),
                   })}
                 />
 
@@ -279,7 +288,9 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
                     validate();
                   }}
                   placeholder="비밀번호를 입력하세요."
-                  className={inputCls({ hasError: !!(touched.pw && errors.pw) })}
+                  className={inputCls({
+                    hasError: !!(touched.pw && errors.pw),
+                  })}
                 />
                 {touched.pw && errors.pw && (
                   <p className="mt-3 text-[14px] font-medium text-red-500">
@@ -305,7 +316,9 @@ function DemandLoginModal({ open, onClose, onSuccess }: LoginModalProps) {
               {/* 비밀번호 초기화 요청 */}
               <button
                 type="button"
-                onClick={() => alert("TODO: 비밀번호 초기화 요청 화면/기능 연결")}
+                onClick={() =>
+                  alert("TODO: 비밀번호 초기화 요청 화면/기능 연결")
+                }
                 className="mx-auto block text-[14px] text-[#767676] hover:text-gray-900"
               >
                 비밀번호 초기화 요청
@@ -439,7 +452,10 @@ export default function TopNav() {
               ) : (
                 <>
                   <span className="text-base text-gray-700">
-                    <strong className="text-xl text-emerald-600">{userName}</strong>님 환영합니다.
+                    <strong className="text-xl text-emerald-600">
+                      {userName}
+                    </strong>
+                    님 환영합니다.
                   </span>
                   <button
                     type="button"
@@ -448,13 +464,13 @@ export default function TopNav() {
                   >
                     로그아웃
                     <span aria-hidden>
-                        <Image
-                          src="/images/landing/icon_logout.png"
-                          alt="로그아웃 아이콘"
-                          width={24}
-                          height={24}
-                          className="h-6 w-6 object-contain"
-                        />
+                      <Image
+                        src="/images/landing/icon_logout.png"
+                        alt="로그아웃 아이콘"
+                        width={24}
+                        height={24}
+                        className="h-6 w-6 object-contain"
+                      />
                     </span>
                   </button>
                 </>
diff --git a/apps/dm_new/app/(landing)/reuse/_constants/lnb.ts b/apps/dm/app/(landing)/reuse/_constants/lnb.ts
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_constants/lnb.ts
rename to apps/dm/app/(landing)/reuse/_constants/lnb.ts
diff --git a/apps/dm_new/app/(landing)/reuse/_hooks/useScrollSpy.ts b/apps/dm/app/(landing)/reuse/_hooks/useScrollSpy.ts
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_hooks/useScrollSpy.ts
rename to apps/dm/app/(landing)/reuse/_hooks/useScrollSpy.ts
diff --git a/apps/dm_new/app/(landing)/reuse/_sections/Cases.tsx b/apps/dm/app/(landing)/reuse/_sections/Cases.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_sections/Cases.tsx
rename to apps/dm/app/(landing)/reuse/_sections/Cases.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_sections/Hero.tsx b/apps/dm/app/(landing)/reuse/_sections/Hero.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_sections/Hero.tsx
rename to apps/dm/app/(landing)/reuse/_sections/Hero.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_sections/IntroCards.tsx b/apps/dm/app/(landing)/reuse/_sections/IntroCards.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_sections/IntroCards.tsx
rename to apps/dm/app/(landing)/reuse/_sections/IntroCards.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/_sections/ProcessFlow.tsx b/apps/dm/app/(landing)/reuse/_sections/ProcessFlow.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/_sections/ProcessFlow.tsx
rename to apps/dm/app/(landing)/reuse/_sections/ProcessFlow.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/apply/layout.tsx b/apps/dm/app/(landing)/reuse/apply/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/apply/layout.tsx
rename to apps/dm/app/(landing)/reuse/apply/layout.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/apply/modal/CandidateSiteModal.tsx b/apps/dm/app/(landing)/reuse/apply/modal/CandidateSiteModal.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/apply/modal/CandidateSiteModal.tsx
rename to apps/dm/app/(landing)/reuse/apply/modal/CandidateSiteModal.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/apply/modal/SimilarCaseModal.tsx b/apps/dm/app/(landing)/reuse/apply/modal/SimilarCaseModal.tsx
similarity index 98%
rename from apps/dm_new/app/(landing)/reuse/apply/modal/SimilarCaseModal.tsx
rename to apps/dm/app/(landing)/reuse/apply/modal/SimilarCaseModal.tsx
index f997d88e1..774ab81b8 100644
--- a/apps/dm_new/app/(landing)/reuse/apply/modal/SimilarCaseModal.tsx
+++ b/apps/dm/app/(landing)/reuse/apply/modal/SimilarCaseModal.tsx
@@ -71,16 +71,18 @@ export default function SimilarCaseModal({
   onClose,
   rows,
   detailsByCaseId,
+  onSearch
 }: {
   open: boolean;
   onClose: () => void;
   rows: SimilarCaseRow[];
   detailsByCaseId: Record<string, SimilarCaseDetail | undefined>;
+  onSearch :(criterion: Criterion) => void;
 }) {
   const titleId = useId();
 
   const [mounted, setMounted] = useState(false);
-  const [criterion, setCriterion] = useState<Criterion>("");
+  const [criterion, setCriterion] = useState<Criterion>("supplyAmt");
   const [selectedCaseId, setSelectedCaseId] = useState<string>("");
 
   useEffect(() => setMounted(true), []);
@@ -88,7 +90,8 @@ export default function SimilarCaseModal({
   // 모달 열릴 때 초기화
   useEffect(() => {
     if (!open) return;
-    setCriterion("");
+    setCriterion("supplyAmt");
+    onSearch("supplyAmt");
     setSelectedCaseId("");
   }, [open]);
 
@@ -192,12 +195,14 @@ export default function SimilarCaseModal({
                   const v = e.target.value as Criterion;
                   setCriterion(v);
                   setSelectedCaseId("");
+
+                  if(v){
+                    onSearch(v);
+                  }
                 }}
                 className="h-10 w-[180px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
               >
-                <option value="">유사기준선택</option>
                 <option value="supplyAmt">공급량</option>
-                <option value="treatment">처리공법</option>
                 <option value="usePurpose">이용용도</option>
               </select>
             </div>
diff --git a/apps/dm_new/app/(landing)/reuse/apply/modal/WaterQualityRefModal.tsx b/apps/dm/app/(landing)/reuse/apply/modal/WaterQualityRefModal.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/apply/modal/WaterQualityRefModal.tsx
rename to apps/dm/app/(landing)/reuse/apply/modal/WaterQualityRefModal.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/apply/place/page.tsx b/apps/dm/app/(landing)/reuse/apply/place/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/apply/place/page.tsx
rename to apps/dm/app/(landing)/reuse/apply/place/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/apply/register/page.tsx b/apps/dm/app/(landing)/reuse/apply/register/page.tsx
similarity index 99%
rename from apps/dm_new/app/(landing)/reuse/apply/register/page.tsx
rename to apps/dm/app/(landing)/reuse/apply/register/page.tsx
index 2a9bbaf9a..9350f59f4 100644
--- a/apps/dm_new/app/(landing)/reuse/apply/register/page.tsx
+++ b/apps/dm/app/(landing)/reuse/apply/register/page.tsx
@@ -633,6 +633,9 @@ export default function DemandRegisterPage() {
         onClose={() => setOpenSimilar(false)}
         rows={similarRows}
         detailsByCaseId={similarDetailsByCaseId}
+        onSearch={async (criterion) => {
+            console.log(criterion);
+          }}
       />
     </>
   );
diff --git a/apps/dm_new/app/(landing)/reuse/apply/status/page.tsx b/apps/dm/app/(landing)/reuse/apply/status/page.tsx
similarity index 98%
rename from apps/dm_new/app/(landing)/reuse/apply/status/page.tsx
rename to apps/dm/app/(landing)/reuse/apply/status/page.tsx
index b69b0fdd9..3282f54a5 100644
--- a/apps/dm_new/app/(landing)/reuse/apply/status/page.tsx
+++ b/apps/dm/app/(landing)/reuse/apply/status/page.tsx
@@ -3,6 +3,7 @@
 
 import { useEffect, useMemo, useRef, useState } from "react";
 import SubPageHeader from "../../_components/SubPageHeader";
+//import { useDmStore } from "@/app/store";
 
 type WaterDetail = {
   toc: string;
@@ -114,12 +115,17 @@ type PairField = { label: string; value: string };
 export default function DemandStatusPage() {
   const rows = useMemo(() => MOCK, []);
 
-  // ✅ rows가 빈 경우도 대비 (런타임 오류 방지)
+  // rows가 빈 경우도 대비 (런타임 오류 방지)
   const [selectedId, setSelectedId] = useState<number | null>(rows[0]?.id ?? null);
 
-  // ✅ 상세영역 스크롤 이동용
+  // 상세영역 스크롤 이동용
   const detailRef = useRef<HTMLDivElement | null>(null);
 
+  // update
+  /* const updateSdmInfoData = useDmStore(
+    (state) => state.updateSdmInfoData
+  ); */
+
   // ✅ selected 계산 안정화
   const selected = useMemo(() => {
     if (!rows.length) return null;
diff --git a/apps/dm_new/app/(landing)/reuse/business/globalCase/australia/page.tsx b/apps/dm/app/(landing)/reuse/business/globalCase/australia/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/globalCase/australia/page.tsx
rename to apps/dm/app/(landing)/reuse/business/globalCase/australia/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/globalCase/eu/page.tsx b/apps/dm/app/(landing)/reuse/business/globalCase/eu/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/globalCase/eu/page.tsx
rename to apps/dm/app/(landing)/reuse/business/globalCase/eu/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/globalCase/overview/page.tsx b/apps/dm/app/(landing)/reuse/business/globalCase/overview/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/globalCase/overview/page.tsx
rename to apps/dm/app/(landing)/reuse/business/globalCase/overview/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/globalCase/singapore/page.tsx b/apps/dm/app/(landing)/reuse/business/globalCase/singapore/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/globalCase/singapore/page.tsx
rename to apps/dm/app/(landing)/reuse/business/globalCase/singapore/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/globalCase/taiwan/page.tsx b/apps/dm/app/(landing)/reuse/business/globalCase/taiwan/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/globalCase/taiwan/page.tsx
rename to apps/dm/app/(landing)/reuse/business/globalCase/taiwan/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/layout.tsx b/apps/dm/app/(landing)/reuse/business/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/layout.tsx
rename to apps/dm/app/(landing)/reuse/business/layout.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/rain/suwon/page.tsx b/apps/dm/app/(landing)/reuse/business/rain/suwon/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/rain/suwon/page.tsx
rename to apps/dm/app/(landing)/reuse/business/rain/suwon/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/sewage/bolyeong/page.tsx b/apps/dm/app/(landing)/reuse/business/sewage/bolyeong/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/sewage/bolyeong/page.tsx
rename to apps/dm/app/(landing)/reuse/business/sewage/bolyeong/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/sewage/cheongju/page.tsx b/apps/dm/app/(landing)/reuse/business/sewage/cheongju/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/sewage/cheongju/page.tsx
rename to apps/dm/app/(landing)/reuse/business/sewage/cheongju/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/sewage/guri/page.tsx b/apps/dm/app/(landing)/reuse/business/sewage/guri/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/sewage/guri/page.tsx
rename to apps/dm/app/(landing)/reuse/business/sewage/guri/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/sewage/hwanggu/page.tsx b/apps/dm/app/(landing)/reuse/business/sewage/hwanggu/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/sewage/hwanggu/page.tsx
rename to apps/dm/app/(landing)/reuse/business/sewage/hwanggu/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/sewage/paju/page.tsx b/apps/dm/app/(landing)/reuse/business/sewage/paju/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/sewage/paju/page.tsx
rename to apps/dm/app/(landing)/reuse/business/sewage/paju/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/business/sewage/yeosu/page.tsx b/apps/dm/app/(landing)/reuse/business/sewage/yeosu/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/business/sewage/yeosu/page.tsx
rename to apps/dm/app/(landing)/reuse/business/sewage/yeosu/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/cases/greywater/page.tsx b/apps/dm/app/(landing)/reuse/cases/greywater/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/cases/greywater/page.tsx
rename to apps/dm/app/(landing)/reuse/cases/greywater/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/cases/layout.tsx b/apps/dm/app/(landing)/reuse/cases/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/cases/layout.tsx
rename to apps/dm/app/(landing)/reuse/cases/layout.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/cases/rain/page.tsx b/apps/dm/app/(landing)/reuse/cases/rain/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/cases/rain/page.tsx
rename to apps/dm/app/(landing)/reuse/cases/rain/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/cases/treated/page.tsx b/apps/dm/app/(landing)/reuse/cases/treated/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/cases/treated/page.tsx
rename to apps/dm/app/(landing)/reuse/cases/treated/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/intro/greywater/page.tsx b/apps/dm/app/(landing)/reuse/intro/greywater/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/intro/greywater/page.tsx
rename to apps/dm/app/(landing)/reuse/intro/greywater/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/intro/law/page.tsx b/apps/dm/app/(landing)/reuse/intro/law/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/intro/law/page.tsx
rename to apps/dm/app/(landing)/reuse/intro/law/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/intro/layout.tsx b/apps/dm/app/(landing)/reuse/intro/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/intro/layout.tsx
rename to apps/dm/app/(landing)/reuse/intro/layout.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/intro/rain/page.tsx b/apps/dm/app/(landing)/reuse/intro/rain/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/intro/rain/page.tsx
rename to apps/dm/app/(landing)/reuse/intro/rain/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/intro/treated/page.tsx b/apps/dm/app/(landing)/reuse/intro/treated/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/intro/treated/page.tsx
rename to apps/dm/app/(landing)/reuse/intro/treated/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/layout.tsx b/apps/dm/app/(landing)/reuse/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/layout.tsx
rename to apps/dm/app/(landing)/reuse/layout.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/page.tsx b/apps/dm/app/(landing)/reuse/page.tsx
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/page.tsx
rename to apps/dm/app/(landing)/reuse/page.tsx
diff --git a/apps/dm_new/app/(landing)/reuse/reuse.module.css b/apps/dm/app/(landing)/reuse/reuse.module.css
similarity index 100%
rename from apps/dm_new/app/(landing)/reuse/reuse.module.css
rename to apps/dm/app/(landing)/reuse/reuse.module.css
diff --git a/apps/dm/app/(popup-layout)/map/popup/page.tsx b/apps/dm/app/(popup-layout)/map/popup/page.tsx
index e410ad2a7..1c625bcac 100644
--- a/apps/dm/app/(popup-layout)/map/popup/page.tsx
+++ b/apps/dm/app/(popup-layout)/map/popup/page.tsx
@@ -29,10 +29,15 @@ const Map = () => {
       ruseUtztnFcltCd: fclt.pbnstRuseFcltId,
     }));
 
+    if (!window.opener || typeof window.opener.postMessage !== "function") {
+      alert("부모 창을 찾을 수 없습니다. 팝업이 'noopener'로 열렸거나, 보안 정책으로 차단되었을 수 있어요.");
+      return;
+    }
+
     window.opener.postMessage(
       {
         type: "SET_SUBS_INFO",
-        payload: subsInfoList, // 또는 필요한 데이터
+        payload: subsInfoList, // 배열로 전송 (최대 3개)
       },
       "*"
     );
@@ -52,9 +57,23 @@ const Map = () => {
 
   //하수처리시설코드로 재이용시설 목록 조회
   const reuseData = async (ruseFcltPk: any) => {
+    if (!ruseFcltPk) {
+      console.warn("[reuseData] ruseFcltPk가 없습니다.");
+      return;
+    }
     try {
+      console.log("[reuseData] API 호출 - ruseFcltPk:", ruseFcltPk);
       const response = await mapService.getPbnstRuseFclts(ruseFcltPk);
-      const data = response.data || [];
+      console.log("[reuseData] API 응답 전체:", response);
+      // 응답이 배열이면 바로 사용, 객체면 .data 추출
+      const data = Array.isArray(response)
+        ? response
+        : Array.isArray(response?.data)
+          ? response.data
+          : response?.data
+            ? [response.data]
+            : [];
+      console.log("[reuseData] 파싱된 data:", data);
       setSelectedFclts((prev) => {
         const newItems = data.filter(
           (item: any) =>
@@ -62,7 +81,7 @@ const Map = () => {
             Object.keys(item).length > 0 &&
             !prev.some((f) => f.pbnstRuseFcltId === item.pbnstRuseFcltId)
         );
-        console.log(newItems);
+        console.log("[reuseData] 추가될 newItems:", newItems);
         return [...prev, ...newItems];
       });
     } catch (error) {
@@ -75,11 +94,45 @@ const Map = () => {
     fetchData();
   }, []);
 
+  // 부모창에 초기 선택값 요청 (팝업 열릴 때 기존 선택 목록 받아오기)
+  useEffect(() => {
+    const origin = window.location.origin;
+    if (window.opener) {
+      window.opener.postMessage({ type: "REQUEST_INIT_SUBS_INFO" }, origin);
+    }
+  }, []);
+
+  // 부모창에서 초기 선택값 수신
+  useEffect(() => {
+    const origin = window.location.origin;
+
+    const handler = (event: MessageEvent) => {
+      if (event.origin !== origin) return;
+
+      const data = event.data;
+      if (!data || typeof data !== "object") return;
+
+      if (data.type === "INIT_SUBS_INFO") {
+        const list = Array.isArray(data.payload) ? data.payload : [];
+        setSelectedFclts(
+          list.map((x) => ({
+            ruseUtztnFcltNm: x.ruseUtztnFcltNm ?? "",
+            pbnstRuseFcltId: x.ruseUtztnFcltCd ?? "",
+          }))
+        );
+      }
+    };
+
+    window.addEventListener("message", handler);
+    return () => window.removeEventListener("message", handler);
+  }, []);
+
   // 레이어 생성 후 초기화 처리
   const onCheckedLayersChange = () => {
     //수요처 ID
     const urlParams = new URLSearchParams(window.location.search);
     const dmdInfoId = urlParams.get("dmdInfoId");
+    console.log("[하이라이트] dmdInfoId:", dmdInfoId);
 
     //수요처 위치로 화면 이동
     const maps = gisMaps.current;
@@ -88,22 +141,42 @@ const Map = () => {
     const featureId = `${layerNm}.${dmdInfoId}`;
     let foundFeature: any = null;
 
+    // 현재 로드된 레이어 목록 출력
+    const allLayerNames = maps
+      .getLayers()
+      .getArray()
+      .map((l: any) => l.get("lyrTyNm") || l.get("name") || "(unnamed)");
+    console.log("[하이라이트] 전체 레이어 목록:", allLayerNames);
+    console.log("[하이라이트] 탐색 대상 레이어:", layerNm);
+    console.log("[하이라이트] 탐색 대상 featureId:", featureId);
+
     maps
       .getLayers()
       .getArray()
       .forEach((layer: any) => {
         if (layer.get("lyrTyNm") == layerNm) {
+          console.log("[하이라이트] 레이어 발견:", layerNm);
           const source = layer.getSource?.();
           if (source?.getFeatureById) {
             const feature = source.getFeatureById(String(featureId).trim());
+            console.log("[하이라이트] feature 탐색결과:", feature);
             if (feature) {
               foundFeature = feature;
               return;
-            } 
+            }
+            // feature 못 찾을 때 소스 내 전체 feature ID 출력
+            if (source?.getFeatures) {
+              const allIds = source.getFeatures().map((f: any) => f.getId());
+              console.log("[하이라이트] 소스 내 전체 feature ID:", allIds);
+            }
           }
         }
       });
 
+    if (!foundFeature) {
+      console.warn("[하이라이트] feature를 찾지 못했습니다. 위 레이어 목록/ID를 확인하세요.");
+    }
+
     if (foundFeature) {
       const geometry = foundFeature.getGeometry();
 
@@ -133,7 +206,7 @@ const Map = () => {
         { width: 30 }
       );
     } else {
-      alert("수요처의 좌표정보를 찾을수 없으므로, 상단 조회조건의 시설명을 입력하여 위치를 조회하시기 바랍니다.");
+      console.warn("수요처의 좌표정보를 찾을 수 없습니다. dmdInfoId:", dmdInfoId);
     }
 
     const formatNumber = (val: any) => {
@@ -185,6 +258,7 @@ const Map = () => {
 
   // 검색해서 재이용시설 선택하면 해당 시설로 화면 이동 처리
   useEffect(() => {
+    console.warn(selectDataPk);
     if (!selectDataPk || Object.keys(selectDataPk).length === 0) return;
     const maps = gisMaps.current;
     let foundFeature: any = null;
@@ -226,8 +300,12 @@ const Map = () => {
 
   // 재이용시설 클릭 시 선택 시설목록에 추가
   const onFeatureSelect = (data: any) => {
+    // feature의 모든 속성 출력 (어떤 키가 있는지 확인)
+    const properties = data.getProperties?.() ?? {};
+    console.log("[onFeatureSelect] feature 속성 전체:", properties);
     // 처리시설코드
     const swtrmtFcltCd = data.get("swtrmt_fclt_cd");
+    console.log("[onFeatureSelect] swtrmt_fclt_cd:", swtrmtFcltCd);
     reuseData(swtrmtFcltCd);
   };
 
diff --git a/apps/dm/app/(popup-layout)/map/popup/selectedFcltList.tsx b/apps/dm/app/(popup-layout)/map/popup/selectedFcltList.tsx
index bdf4d7e2c..5c742684f 100644
--- a/apps/dm/app/(popup-layout)/map/popup/selectedFcltList.tsx
+++ b/apps/dm/app/(popup-layout)/map/popup/selectedFcltList.tsx
@@ -22,36 +22,32 @@ export default function SelectedFcltList({
 
   const TableContent = (
     <>
-      <thead className="bg-gray-100 text-gray-700 text-[13px]">
+      <thead className="bg-gray-100 text-gray-600 text-[11px] font-medium border-b border-cyan-800">
         <tr>
-          <th className="px-3 py-2 text-left border-b">시설명</th>
-          <th className="px-3 py-2 text-right border-b">
-            하수처리량
-            <br />
-            (㎥/일)
+          <th className="px-2 py-1.5 text-left w-1/3">시설명</th>
+          <th className="px-2 py-1.5 text-right whitespace-nowrap">
+            처리량(㎥/일)
           </th>
-          <th className="px-3 py-2 text-right border-b">
-            재이용량
-            <br />
-            (㎥/일)
+          <th className="px-2 py-1.5 text-right whitespace-nowrap">
+            재이용량(㎥/일)
           </th>
-          <th className="px-3 py-2 border-b">삭제</th>
+          <th className="px-2 py-1.5 text-center w-10">삭제</th>
         </tr>
       </thead>
       <tbody>
         {data.map((item) => (
-          <tr key={item.pbnstRuseFcltId} className="border-b last:border-none">
-            <td className="px-3 py-2 text-[12px]">{item.ruseUtztnFcltNm}</td>
-            <td className="px-3 py-2 text-right text-[12px]">
+          <tr key={item.pbnstRuseFcltId} className="border-b border-gray-100 last:border-none hover:bg-gray-50/50">
+            <td className="px-2 py-1.5 text-[11px] font-medium text-gray-800 break-keep">{item.ruseUtztnFcltNm}</td>
+            <td className="px-2 py-1.5 text-right text-[11px] text-gray-600">
               {Number(item.splyExtraCpct || 0).toLocaleString()}
             </td>
-            <td className="px-3 py-2 text-right text-[12px]">
+            <td className="px-2 py-1.5 text-right text-[11px] text-gray-600">
               {Number(item.ruseCpct || 0).toLocaleString()}
             </td>
-            <td className="px-3 py-2 text-center">
+            <td className="px-2 py-1.5 text-center">
               <button
                 onClick={() => handleDelete(item.pbnstRuseFcltId)}
-                className="text-red-500 hover:text-red-700 text-sm font-bold"
+                className="text-gray-400 hover:text-red-500 text-[11px] font-bold transition-colors"
                 aria-label="삭제"
                 title="삭제"
               >
@@ -64,15 +60,13 @@ export default function SelectedFcltList({
     </>
   );
 
-  if (data.length === 0) return null;
-
   return (
-    <div className="fixed right-40 top-[8rem] w-[40rem] max-h-[130rem] overflow-auto bg-white shadow-lg rounded p-4 border border-gray-300 z-50">
-      <h3 className="bg-cyan-700 text-white text-xl font-bold mb-2 p-2">
+    <div className="fixed right-20 top-[3.5rem] w-[22rem] max-h-[80vh] overflow-hidden bg-white/95 backdrop-blur-sm shadow-[0_4px_12px_rgba(0,0,0,0.1)] rounded-lg border border-gray-200 z-50 flex flex-col">
+      <h3 className="bg-cyan-700 text-white text-[13px] font-semibold p-2">
         선택된 시설
       </h3>
-      <div className="overflow-x-auto">
-        <table className="w-full text-sm text-gray-800 border border-gray-200">
+      <div className="overflow-y-auto w-full">
+        <table className="w-full text-sm text-gray-800 border-t border-gray-200 table-fixed">
           {TableContent}
         </table>
       </div>
diff --git a/apps/dm/app/(popup-layout)/map/service/map.ts b/apps/dm/app/(popup-layout)/map/service/map.ts
index 00e3ab561..dea14f0d0 100644
--- a/apps/dm/app/(popup-layout)/map/service/map.ts
+++ b/apps/dm/app/(popup-layout)/map/service/map.ts
@@ -6,7 +6,7 @@ import { DEV_URL_WR, DEV_URL_SN } from "@/components/ui/config";
 export type LyrStngProps = {
   lyr_sn: string
   lyr_nm: string
-  upper_lyr_sn: string  
+  upper_lyr_sn: string
   drawOrdr: string
   flterSql: string
   gobjTy: string
@@ -29,7 +29,7 @@ export type LyrStngProps = {
 export const mapService = {
   //레이어 설정 조회
   getLyrStngs: async () => {
-    const response = await fetch(`${DEV_URL_SN}/api/v1/map/lyrStngs/DM_NETWORK`, {
+    const response = await fetch(`${DEV_URL_SN}/map/lyrStngs/DM_NETWORK`, {
       method: 'GET',
       headers: {
         'Accept': 'application/json',
@@ -42,7 +42,7 @@ export const mapService = {
 
     return response.json();
   },
-  getPbnstRuseFclts: async (ruseFcltPk:any) => {
+  getPbnstRuseFclts: async (ruseFcltPk: any) => {
     const response = await fetch(`${DEV_URL_WR}/reuseFc/pubFc/${ruseFcltPk}`, {
       method: 'GET',
       headers: {
diff --git a/apps/dm_new/app/(with-layout)/apply/dmdco/page.tsx b/apps/dm/app/(with-layout)/apply/dmdco/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/apply/dmdco/page.tsx
rename to apps/dm/app/(with-layout)/apply/dmdco/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/apply/layout.tsx b/apps/dm/app/(with-layout)/apply/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/apply/layout.tsx
rename to apps/dm/app/(with-layout)/apply/layout.tsx
diff --git a/apps/dm_new/app/(with-layout)/apply/modal/WaterQualityRefModal.tsx b/apps/dm/app/(with-layout)/apply/modal/WaterQualityRefModal.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/apply/modal/WaterQualityRefModal.tsx
rename to apps/dm/app/(with-layout)/apply/modal/WaterQualityRefModal.tsx
diff --git a/apps/dm/app/(with-layout)/apply/register/page.tsx b/apps/dm/app/(with-layout)/apply/register/page.tsx
new file mode 100644
index 000000000..db1c47cb5
--- /dev/null
+++ b/apps/dm/app/(with-layout)/apply/register/page.tsx
@@ -0,0 +1,895 @@
+// app/(with-layout)/apply/register/page.tsx
+/**
+ *  수요정보등록(수정) 화면
+ *
+ * 🔗 사용 API
+ * - 수요정보등록: POST /reuseFc/request/demandInfo
+ * - 수요정보조회: GET  /reuseFc/request/' + dmdInfoId - getSdmInfoStatusList
+ */
+"use client";
+
+import { useMemo, useState, useRef, useEffect } from "react";
+import { useRouter } from "next/navigation";
+import SubPageHeader from "@/components/SubPageHeader";
+import WaterQualityRefModal from "../modal/WaterQualityRefModal";
+import CandidateSiteModal, { type CandidateSite } from "@/components/CandidateSiteModal";
+import { useDmStore } from "@/app/store";
+import type { SdmInfoFormData } from "@/app/store/sdmMng";
+import SimilarCaseModal, { type SimilarCaseDetail, type SimilarCaseRow } from "@/app/(landing)/reuse/apply/modal/SimilarCaseModal";
+//import type { SubsInfo } from "@/app/store/map/type";
+
+type PHRange = { min: string; max: string };
+
+export default function DemandRegisterPage() {
+  const router = useRouter();
+  const today = useMemo(() => {
+    const d = new Date();
+    const yyyy = d.getFullYear();
+    const mm = String(d.getMonth() + 1).padStart(2, "0");
+    const dd = String(d.getDate()).padStart(2, "0");
+    return `${yyyy}-${mm}-${dd}`;
+  }, []);
+
+  const [openRef, setOpenRef] = useState(false);
+
+  const [openCand, setOpenCand] = useState(false);
+  const [selectedCands, setSelectedCands] = useState<CandidateSite[]>([]);
+
+  // 기본정보
+  const [reqDate, setReqDate] = useState<string>(today);
+  const [reqQty, setReqQty] = useState<string>("");
+  const [usePurpose, setUsePurpose] = useState<string>("");
+  const [hopePrice, setHopePrice] = useState<string>("");
+
+  // 요구수질
+  const [coliform, setColiform] = useState<string>(""); // 총대장균군수
+  const [noDetect, setNoDetect] = useState<boolean>(false);
+
+  const [tn, setTn] = useState<string>("");
+  const [residualCl, setResidualCl] = useState<string>("");
+  const [tp, setTp] = useState<string>("");
+  const [turbidity, setTurbidity] = useState<string>("");
+  const [ph, setPh] = useState<PHRange>({ min: "", max: "" });
+  const [bod, setBod] = useState<string>("");
+  const [chloride, setChloride] = useState<string>("");
+  const [odor, setOdor] = useState<string>("불쾌하지 않을 것");
+  const [ec, setEc] = useState<string>("");
+  const [color, setColor] = useState<string>("");
+  const [remark, setRemark] = useState<string>("");
+
+  // 공급처 후보지 선택(필수아님)
+  const [cand1, setCand1] = useState("");
+  const [cand2, setCand2] = useState("");
+  const [cand3, setCand3] = useState("");
+  //const [candidateList, setCandidateList] = useState<SubsInfo[]>([]);
+
+  const useTypesData = useDmStore((state) => state.Sdm.useTypesData);
+  const getUseTypesData = useDmStore((state) => state.getUseTypesData);
+  const [openSimilar, setOpenSimilar] = useState(false);
+
+  // 후보지 팝업 메시지 핸들러
+  const candsRef = useRef<{ name: string; code: string }[]>([]);
+
+  useEffect(() => {
+    const origin = window.location.origin;
+
+    const handleMessage = (event: MessageEvent) => {
+      const data = event.data;
+      if (!data || typeof data !== "object") return;
+
+      if (data.type === "SET_SUBS_INFO") {
+        // 팝업에서 배열로 전송 (최대 3개)
+        const list = Array.isArray(data.payload) ? data.payload : [];
+        setCand1(list[0]?.ruseUtztnFcltNm ?? "");
+        setCand2(list[1]?.ruseUtztnFcltNm ?? "");
+        setCand3(list[2]?.ruseUtztnFcltNm ?? "");
+        // 추후 REQUEST_INIT_SUBS_INFO 응답용 ref 갱신
+        candsRef.current = list.map((x: any) => ({
+          name: x.ruseUtztnFcltNm ?? "",
+          code: x.ruseUtztnFcltCd ?? "",
+        }));
+      }
+
+      if (data.type === "REQUEST_INIT_SUBS_INFO") {
+        // 팝업이 현재 선택된 후보지 초기값을 요청하면 응답
+        const initList = candsRef.current
+          .filter((x) => x.name)
+          .map((x) => ({
+            ruseUtztnFcltNm: x.name,
+            ruseUtztnFcltCd: x.code,
+          }));
+        const target = event.source as Window | null;
+        target?.postMessage(
+          { type: "INIT_SUBS_INFO", payload: initList },
+          { targetOrigin: origin }
+        );
+      }
+    };
+
+    window.addEventListener("message", handleMessage);
+    return () => window.removeEventListener("message", handleMessage);
+  }, []);
+
+  // 유사사례
+  const similarCaseList = useDmStore((state) => state.Sdm.similarCaseList);
+  const getSimilarCaseList = useDmStore((state) => state.getSimilarCaseList);
+  const [farmText, setFarmText] = useState("이하");
+
+  const insertSdmInfoData = useDmStore(
+    (state) => state.insertSdmInfoData
+  );
+
+  useEffect(() => {
+    getUseTypesData();
+  }, [getUseTypesData]);
+
+  useEffect(() => {
+    const handler = (event: MessageEvent) => {
+      if (!event.data) return;
+
+      if (event.data.type === "SET_SUBS_INFO") {
+        const list = event.data.payload || [];
+
+        // 최대 3개
+        setCand1(list[0]?.ruseUtztnFcltNm || "");
+        setCand2(list[1]?.ruseUtztnFcltNm || "");
+        setCand3(list[2]?.ruseUtztnFcltNm || "");
+        //setCandidateList(list);
+      }
+    };
+
+    window.addEventListener("message", handler);
+
+    return () => {
+      window.removeEventListener("message", handler);
+    };
+  }, []);
+
+  // option
+  // 'req':필수 / 'num' : 숫자 / 'num+[숫자] : 자릿수 
+  const validation = (val, text, option: string[] = []) => {
+    if (option.includes('req')) {
+      if (val.trim() === "" || val === undefined) {
+        alert(`${text} 항목은 필수 입력값입니다.`);
+        return false;
+      }
+    } else {
+      if (val.trim() === "") {
+        return true;
+      }
+    }
+
+    const numOption = option.find((opt) => opt.startsWith("num"));
+    if (numOption) {
+      const isDot = numOption.includes("Dot");
+
+      // 3. 숫자 체크
+      const regex = isDot ? /^\d+(\.\d+)?$/ : /^\d+$/;
+
+      if (!regex.test(val)) {
+        alert(
+          `${text}은(는) ${isDot ? "숫자 또는 소수" : "숫자"
+          }만 입력 가능합니다.`
+        );
+        return false;
+      }
+
+      // 4. 자리수 체크
+      const lengthStr = numOption.replace("numDot", "").replace("num", "");
+
+      if (lengthStr) {
+        const length = Number(lengthStr);
+
+        if (isDot) {
+          // 🔥 소수 자리수 체크 (소수점 기준)
+          const decimalPart = val.split(".")[1];
+
+          if (decimalPart && decimalPart.length > length) {
+            alert(`${text}은(는) 소수점 ${length}자리까지 가능합니다.`);
+            return false;
+          }
+        } else {
+          // 정수 자리수 체크
+          if (val.length !== length) {
+            alert(`${text}은(는) ${length}자리여야 합니다.`);
+            return false;
+          }
+        }
+      }
+    }
+    return true;
+  }
+
+  const rows: SimilarCaseRow[] = similarCaseList.map((el, idx) => ({
+    caseId: String(idx),
+    projectName: el.ruseBizNm,
+    period: `${el.bizBgngDate} ~ ${el.bizEndDate}`,
+
+    supplyFacilityType: el.splyFcltKnd,
+    supplyName: el.splyFcltNm,
+    supplyCapacity: Number(el.splyFcltCpct),
+
+    demandName: el.dmdFcltNm,
+    demandAddress: el.dmdFcltAddr,
+
+    facilityCapacity: Number(el.ruseFcltCpct),
+    pipeKm: Number(el.ruseFcltPplLen),
+    purpose: el.ruseFcltUsg,
+
+    supplyAmt: Number(el.ruseFcltSplyCpct),
+    treatment: el.ruseFcltPrcsMsrc,
+    usePurpose: el.ruseFcltUsg,
+  }));
+
+  const detailsByCaseId: Record<string, SimilarCaseDetail> = {};
+  similarCaseList.forEach((el, idx) => {
+    detailsByCaseId[String(idx)] = {
+      coliform: el.grnteWqGrssClfg,
+      residualCl: el.grnteWqCombResdch,
+      turbidity: el.grnteWqTrbt,
+      bod: el.grnteWqBod,
+      odor: el.grnteWqSmll,
+      color: el.grnteWqCrmty,
+      tn: el.grnteWqTn,
+      tp: el.grnteWqTp,
+      ph: el.grnteWqPh,
+      chloride: el.grnteWqClIonQnt,
+      ec: el.grnteWqCndctStat,
+      note: el.grnteWqRmrk,
+
+      costTotal: Number(el.reqBizGrssCst),
+      costFacility: Number(el.reqBizReuseFcltCst),
+      costPipe: Number(el.reqBizPplCst),
+      costDesign: Number(el.reqBizDesignCst),
+      costSupervision: Number(el.reqBizSpvsCst),
+      costOther: Number(el.reqBizEtc),
+
+      fundingTotal: Number(el.prcmPlanGrssCst),
+      fundingNational: Number(el.prcmPlanNlep),
+      fundingLocal: Number(el.prcmPlanLcep),
+      fundingSelf: Number(el.prcmPlanBrdnCst),
+      fundingRate: Number(el.prcmPlanEcqrRt),
+    };
+  });
+
+  // 데이터 저장
+  const saveInfo = async () => {
+    if (!validation(reqQty, '요구수량', ['req', 'numDot'])) return false;
+    if (!validation(usePurpose, '사용용도', ['req'])) return false;
+    if (!validation(hopePrice, '희망단가', ['req', 'numDot'])) return false;
+    /*  if(!noDetect && !validation(coliform, '총대장균군수', ['req','numDot'])) return false;
+     if(!validation(residualCl, ['req', '결합잔류염소', 'numDot'])) return false;
+     if(!validation(turbidity, '탁도', ['req', 'numDot'])) return false;
+     if(!validation(bod, '생물화학적산소요구량', ['req', 'numDot'])) return false;
+     if(!validation(odor, '냄새', ['req'])) return false; */
+
+    // 필수는 아니지만 숫자로는 들어와야함.
+    /*   if(!validation(tn, '총질소', ['numDot'])) return false;
+      if(!validation(residualCl, '결합잔류염소', ['numDot'])) return false;
+      if(!validation(tp, '총인', ['numDot'])) return false;
+      if(!validation(ph.min, 'ph', ['numDot'])) return false;
+      if(!validation(ph.max, 'ph', ['numDot'])) return false;
+      if(!validation(chloride, '염화물', ['numDot'])) return false;
+      if(!validation(ec, '전기전도도', ['numDot'])) return false; */
+
+    const userStr = sessionStorage.getItem("user");
+    const user = userStr ? JSON.parse(userStr) : null;
+
+    if (user) {
+      // 후보지 목록 (candsRef에 코드까지 보관됨)
+      const splyCndtList = candsRef.current
+        .filter((x) => x.name)
+        .map((x) => ({
+          ruseUtztnFcltNm: x.name,
+          ruseUtztnFcltCd: x.code,
+        }));
+
+      const payload: SdmInfoFormData = {
+        dmndTmng: new Date(reqDate),
+        dmdInfoId: user.dmdInfoId,
+        dmndQty: Number(reqQty),
+        wntUntprc: Number(hopePrice),
+        useUsgCd: usePurpose,
+        // 수질
+        grssClfg: Number(coliform),
+        tn: Number(tn) || null,
+        combResdch: Number(residualCl) || null,
+        tph: Number(tp) || null,
+        trbt: Number(turbidity),
+        ph: ph.min || '' + ((ph.min || ph.max) ? '~' : '') + ph.max || '',
+        blgcOxygDmndQnt: Number(bod),
+        clIonQnt: Number(chloride) || null,
+        smll: odor,
+        cdtnv: Number(ec) || null,
+        crmty: Number(color) || null,
+        rmrk: remark,
+        splyCndtList, // 후보지 목록 추가
+      }
+      const success = await insertSdmInfoData(payload);
+      if (success) {
+        router.push("/apply/status");
+      }
+    }
+  }
+
+  const searchCandidate = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const dmdInfoId = JSON.parse(
+      sessionStorage.getItem("user") || "{}"
+    )?.dmdInfoId?.toString();
+
+    const url = `/map/popup?dmdInfoId=${encodeURIComponent(dmdInfoId)}`;
+    const width = window.screen.availWidth;
+    const height = window.screen.availHeight;
+    const left = 0;
+    const top = 0;
+    const popupOptions = `width=${width},height=${height},left=${left},top=${top},resizable=yes,scrollbars=yes`;
+    window.open(url, "candidatePopup", popupOptions);
+  };
+
+  const getCriterionCode = (criterion: string) => {
+    switch (criterion) {
+      case "supplyAmt":
+        return "S";
+      case "money":
+        return "M";
+      case "usePurpose":
+        return "U";
+      default:
+        return "";
+    }
+  };
+
+  const searchSimilarCase = async (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setOpenSimilar(true);
+  };
+
+  const initQualityForm = () => {
+    setColiform("");
+    setNoDetect(false);
+    setTn("");
+    setResidualCl("");
+    setTp("");
+    setTurbidity("");
+    setPh({ min: "", max: "" });
+    setBod("");
+    setChloride("");
+    setOdor("불쾌하지 않을 것");
+    setEc("");
+    setColor("");
+    setRemark("");
+    setFarmText("이하");
+  }
+
+  const fncSetOptionValue = (e: React.ChangeEvent<HTMLSelectElement>) => {
+    const value = e.target.value;
+    initQualityForm();
+
+    switch (value) {
+      // 청소화장실용도
+      case '01':
+        setTp('0.2');
+        setTurbidity('2');
+        setPh({ min: '5.8', max: '8.5' });
+        setBod('5');
+        setColor('20');
+        break;
+      // 세척살수용도  
+      case '02':
+        setTp('0.2');
+        setTurbidity('2');
+        setPh({ min: '5.8', max: '8.5' });
+        setBod('5');
+        break;
+      // 조경용도
+      case '03':
+        setTp('0.2');
+        setTurbidity('2');
+        setPh({ min: '5.8', max: '8.5' });
+        setBod('5');
+        setChloride('250');
+        break;
+      // 지하수
+      case '05':
+        break;
+      // 농업용도
+      case '06':
+        setTurbidity('5');
+        setPh({ min: '5.8', max: '8.5' });
+        setBod('8');
+        setEc('2000');
+        setFarmText("이하 (** 간접:2000,직접:700 )");
+        break;
+      // 하천 등 유지보수
+      case '07':
+        setColiform('1000');
+        setTn('10');
+        setTp('0.5');
+        setPh({ min: '5.8', max: '8.5' });
+        setBod('5');
+        break;
+      // 공업
+      case '08':
+        setPh({ min: '5.8', max: '8.5' });
+        break;
+      default:
+        console.log('잘못된 선택입니다.');
+    }
+
+    setUsePurpose(value);
+  }
+
+  return (
+    <>
+
+      <main className="bg-white">
+
+        {/* 서브 타이틀 + 브레드크럼 */}
+        <SubPageHeader
+          title="수요정보등록"
+          crumbs={[
+            { label: "Home", href: "/reuse" },
+            { label: "수요신청", href: "/reuse/apply" },
+            { label: "수요정보등록" },
+          ]}
+        />
+
+        {/* 컨텐츠 영역 */}
+        <div>
+
+          {/* 기본정보 테이블 */}
+          <div className="border border-neutral-200 bg-white">
+            <FormRow label="요구시기" required>
+              <DateInput value={reqDate} onChange={setReqDate} />
+            </FormRow>
+
+            <Divider />
+
+            <FormRow label="요구수량(m²/d)" required>
+              <TextInput value={reqQty} onChange={setReqQty} placeholder="" />
+            </FormRow>
+
+            <Divider />
+
+            <FormRow label="사용용도" required>
+              <select
+                value={usePurpose}
+                onChange={(e) => fncSetOptionValue(e)}
+                className="h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
+              >
+                <option value="">선택하세요</option>
+                {useTypesData.map((item) => (
+                  <option key={item.val} value={item.val}>
+                    {item.text}
+                  </option>
+                ))}
+              </select>
+            </FormRow>
+
+            <Divider />
+
+            <FormRow label="희망단가(원)" required>
+              <TextInput value={hopePrice} onChange={setHopePrice} />
+            </FormRow>
+          </div>
+
+          {/* 요구수질 섹션 타이틀 바 */}
+          <div className="grid grid-cols-12">
+            <div className="col-span-12 lg:col-span-2 inline-flex justify-center items-center gap-3 px-6 py-6 text-center">
+              <span className="text-lg font-semibold text-neutral-800">요구수질</span>
+              <button
+                type="button"
+                onClick={() => setOpenRef(true)}
+                className="rounded border-[2px] border-[#DE3412] px-2 py-3 text-[15px] font-medium text-[#4F4F4F] hover:bg-orange-50"
+              >
+                수질기준 참고
+              </button>
+              {/* 수질기준참고 모달 */}
+              <WaterQualityRefModal
+                open={openRef}
+                onClose={() => setOpenRef(false)}
+                imageSrc="/images/landing/water_quality_ref_1.png"
+              />
+            </div>
+          </div>
+
+          {/* 요구수질 테이블 */}
+          <div className="border border-neutral-200 bg-white">
+            {/* 1행 */}
+            <QualityRow
+              leftLabel="총대장균군수(개/mg)"
+
+              leftControl={
+                <div className="flex items-center gap-4">
+                  <TextInput
+                    value={coliform}
+                    onChange={setColiform}
+                    disabled={noDetect}
+                    className={noDetect ? "bg-neutral-100 text-neutral-400" : ""}
+                  />
+                  <label className="flex items-center gap-2 text-sm text-neutral-700">
+                    <input
+                      type="checkbox"
+                      checked={noDetect}
+                      onChange={(e) => {
+                        setNoDetect(e.target.checked);
+                        if (e.target.checked) setColiform("");
+                      }}
+                      className="h-4 w-4 rounded border-neutral-300"
+                    />
+                    불검출
+                  </label>
+                </div>
+              }
+              rightLabel="총질소(T-N)(mg/L)"
+              rightControl={
+                <InlineSuffixInput value={tn} onChange={setTn} suffix="이하" />
+              }
+            />
+            <Divider />
+
+            {/* 2행 */}
+            <QualityRow
+              leftLabel="결합잔류염소(mg/L)"
+              /* leftRequired */
+              leftControl={<TextInput value={residualCl} onChange={setResidualCl} />}
+              rightLabel="총인(T-P)(mg/L)"
+              rightControl={
+                <InlineSuffixInput value={tp} onChange={setTp} suffix="이하" />
+              }
+            />
+            <Divider />
+
+            {/* 3행 */}
+            <QualityRow
+              leftLabel="탁도(NTU)"
+              /* leftRequired */
+              leftControl={
+                <InlineSuffixInput value={turbidity} onChange={setTurbidity} suffix="이하" />
+              }
+              rightLabel="수소이온농도(pH)"
+              rightControl={
+                <div className="flex items-center gap-2">
+                  <TextInput
+                    value={ph.min}
+                    onChange={(v) => setPh((p) => ({ ...p, min: v }))}
+                    className="w-32"
+                  />
+                  <span className="text-neutral-500">~</span>
+                  <TextInput
+                    value={ph.max}
+                    onChange={(v) => setPh((p) => ({ ...p, max: v }))}
+                    className="w-32"
+                  />
+                </div>
+              }
+            />
+            <Divider />
+
+            {/* 4행 */}
+            <QualityRow
+              leftLabel={
+                <>
+                  생물화학적산소요구량
+                  <br />
+                  (BOD)(mg/L)
+                </>
+              }
+              /* leftRequired */
+              leftControl={<InlineSuffixInput value={bod} onChange={setBod} suffix="이하" />}
+              rightLabel="염화물(mgCL/L)"
+              rightControl={<InlineSuffixInput value={chloride} onChange={setChloride} suffix="이하" />}
+            />
+            <Divider />
+
+            {/* 5행 */}
+            <QualityRow
+              leftLabel="냄새"
+              /* leftRequired */
+              leftControl={
+                <select
+                  value={odor}
+                  onChange={(e) => setOdor(e.target.value)}
+                  className="h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
+                >
+                  <option>불쾌하지 않을 것</option>
+                  <option>약간 있음</option>
+                  <option>있음</option>
+                </select>
+              }
+              rightLabel="전기전도도(µs/cm)"
+              rightControl={<InlineSuffixInput value={ec} onChange={setEc} suffix={farmText} />}
+            />
+            <Divider />
+
+            {/* 6행 */}
+            <QualityRow
+              leftLabel="색도(도)"
+              /* leftRequired */
+              leftControl={<InlineSuffixInput value={color} onChange={setColor} suffix="이하" />}
+              rightLabel="비고"
+              rightControl={
+                <textarea
+                  value={remark}
+                  onChange={(e) => setRemark(e.target.value)}
+                  className="h-11 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-sm outline-none focus:border-neutral-500"
+                />
+              }
+            />
+            <Divider />
+
+            {/* 후보지 선택 */}
+            <div className="grid grid-cols-12">
+              <LabelCell>
+                공급처 후보지 선택
+                <br />
+                (필수아님)
+              </LabelCell>
+
+              <div className="col-span-12 md:col-span-10 p-6">
+                <div className="flex flex-col gap-3 xl:flex-row xl:items-center xl:gap-4">
+                  <TextInput value={cand1} onChange={setCand1} className="max-w-[220px]" />
+                  <TextInput value={cand2} onChange={setCand2} className="max-w-[220px]" />
+                  <TextInput value={cand3} onChange={setCand3} className="max-w-[220px]" />
+
+                  <div className="flex items-center gap-3 xl:ml-2">
+                    <button
+                      type="button"
+                      className="h-11 rounded-md bg-[#888] px-5 text-base text-white hover:bg-neutral-700"
+                      onClick={(e) => {
+                        searchCandidate(e);
+
+                        //splyList => 해당객체가 대민에서 선택한 후보처 리스트
+                        //setLastSub => 해당 스테이트가 선택한 마지막 후보처를 넣어야하는 스테이트
+                      }}>
+                      후보지 조회
+                    </button>
+
+                    <button
+                      type="button"
+                      className="h-11 rounded-md bg-[#888] px-5 text-base text-white hover:bg-neutral-600"
+                      onClick={(e) => {
+                        // TODO: 유사사례 연결
+                        searchSimilarCase(e);
+                      }}
+                    >
+                      유사사례
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+
+          {/* 하단 버튼 */}
+          <div className="flex justify-center py-12">
+            <button
+              type="button"
+              className="h-11 rounded-md bg-[#0B4EA2] px-10 text-lg text-white hover:opacity-90"
+              onClick={() => {
+                // TODO: 저장 처리
+                saveInfo();
+              }}
+            >
+              수요정보 등록
+            </button>
+          </div>
+        </div>
+      </main>
+
+      <SimilarCaseModal
+        open={openSimilar}
+        onClose={() => setOpenSimilar(false)}
+        rows={rows} // 실제 데이터
+        detailsByCaseId={detailsByCaseId}
+        onSearch={async (criterion) => {
+          const code = getCriterionCode(criterion);
+          if (!code) return;
+          // 값은 상황에 맞게 (예시: usePurpose)
+          console.log(code+' req: '+reqQty+' purpose :'+usePurpose);
+          await getSimilarCaseList(code, code == 'S' ? reqQty : code == 'U' ? usePurpose : '');
+        }}
+      />
+
+      <CandidateSiteModal
+        open={openCand}
+        onClose={() => setOpenCand(false)}
+        initialSelected={selectedCands}
+        onApply={(list) => {
+          setSelectedCands(list);
+
+          // ✅ cand1~3 입력칸에 반영(시설명만 넣는 버전)
+          setCand1(list[0]?.name ?? "");
+          setCand2(list[1]?.name ?? "");
+          setCand3(list[2]?.name ?? "");
+
+          setOpenCand(false);
+        }}
+      />
+    </>
+  );
+}
+
+/* ----------------------------- UI helpers ----------------------------- */
+
+function Divider() {
+  return <div className="h-px w-full bg-neutral-200" />;
+}
+
+function LabelCell({
+  children,
+  required,
+}: {
+  children: React.ReactNode;
+  required?: boolean;
+}) {
+  return (
+    <div className="col-span-12 md:col-span-2 flex items-center justify-center text-center  bg-emerald-50/70 px-6 py-6 text-lg font-semibold text-neutral-800">
+      <span className="inline-flex items-center gap-1">
+        {children}
+        {required ? <span className="text-red-500">*</span> : null}
+      </span>
+    </div>
+  );
+}
+
+function FormRow({
+  label,
+  required,
+  children,
+}: {
+  label: string;
+  required?: boolean;
+  children: React.ReactNode;
+}) {
+  return (
+    <div className="grid grid-cols-12">
+      <LabelCell required={required}>{label}</LabelCell>
+      <div className="col-span-12 md:col-span-10 p-6">{children}</div>
+    </div>
+  );
+}
+
+function QualityRow({
+  leftLabel,
+  leftRequired,
+  leftControl,
+  rightLabel,
+  rightControl,
+}: {
+  leftLabel: React.ReactNode;
+  leftRequired?: boolean;
+  leftControl: React.ReactNode;
+  rightLabel: React.ReactNode;
+  rightControl: React.ReactNode;
+}) {
+  return (
+    <div className="grid grid-cols-12">
+      {/* 좌측 라벨 */}
+      <div className="col-span-12 lg:col-span-2 flex items-center justify-center text-center  bg-emerald-50/70 px-6 py-6 text-lg font-semibold text-neutral-800">
+        <span className="inline-flex items-center gap-1">
+          <span className="leading-6">{leftLabel}</span>
+          {leftRequired ? <span className="text-red-500">*</span> : null}
+        </span>
+      </div>
+
+      {/* 좌측 입력 */}
+      <div className="col-span-12 lg:col-span-4 p-6">{leftControl}</div>
+
+      {/* 우측 라벨 */}
+      <div className="col-span-12 lg:col-span-2 flex items-center justify-center text-center  bg-emerald-50/70 px-6 py-6 text-lg font-semibold text-neutral-800">
+        <span className="leading-6">{rightLabel}</span>
+      </div>
+
+      {/* 우측 입력 */}
+      <div className="col-span-12 lg:col-span-4 p-6">{rightControl}</div>
+    </div>
+  );
+}
+
+function TextInput({
+  value,
+  onChange,
+  placeholder,
+  disabled,
+  className,
+}: {
+  value: string;
+  onChange: (v: string) => void;
+  placeholder?: string;
+  disabled?: boolean;
+  className?: string;
+}) {
+  return (
+    <input
+      value={value}
+      onChange={(e) => onChange(e.target.value)}
+      placeholder={placeholder}
+      disabled={disabled}
+      className={[
+        "h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none",
+        "focus:border-neutral-500",
+        disabled ? "cursor-not-allowed" : "",
+        className ?? "",
+      ].join(" ")}
+    />
+  );
+}
+
+function InlineSuffixInput({
+  value,
+  onChange,
+  suffix,
+}: {
+  value: string;
+  onChange: (v: string) => void;
+  suffix: string;
+}) {
+  return (
+    <div className="flex items-center gap-3">
+      <TextInput value={value} onChange={onChange} className="max-w-[200px]" />
+      <span className="text-sm text-neutral-600">{suffix}</span>
+    </div>
+  );
+}
+
+function DateInput({
+  value,
+  onChange,
+}: {
+  value: string;
+  onChange: (v: string) => void;
+}) {
+
+  const ref = useRef<HTMLInputElement | null>(null);
+
+  const openPicker = () => {
+    const el = ref.current;
+    if (!el) return;
+
+    // Chrome/Edge 등 지원
+    if (typeof (el as any).showPicker === "function") {
+      (el as any).showPicker();
+      return;
+    }
+
+    // fallback (일부 브라우저)
+    el.focus();
+    el.click();
+  };
+  return (
+    <div className="relative w-full max-w-[200px]">
+      <input
+        ref={ref}
+        type="date"
+        value={value}
+        onChange={(e) => onChange(e.target.value)}
+        className={[
+          "h-11 w-full rounded-md border border-neutral-300 bg-white px-3 pr-10 text-sm outline-none focus:border-neutral-500",
+          // ✅ 기본 달력 아이콘 숨김 (Tailwind arbitrary selector)
+          "[&::-webkit-calendar-picker-indicator]:opacity-0",
+          "[&::-webkit-calendar-picker-indicator]:absolute",
+          "[&::-webkit-calendar-picker-indicator]:right-0",
+          "[&::-webkit-calendar-picker-indicator]:w-10",
+          "[&::-webkit-calendar-picker-indicator]:h-full",
+          "[&::-webkit-calendar-picker-indicator]:cursor-pointer",
+        ].join(" ")}
+      />
+
+      {/* ✅ 클릭 가능한 아이콘 버튼 */}
+      <button
+        type="button"
+        onClick={openPicker}
+        className="absolute right-2 top-1/2 -translate-y-1/2 p-1 text-neutral-500 hover:text-neutral-700"
+        aria-label="달력 열기"
+      >
+        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" aria-hidden="true">
+          <path d="M7.14286 7.99104H16.7812M6.48512 2.5625V4.19126M17.3125 2.5625V4.19106M20.5 7.19106L20.5 18.5625C20.5 20.2194 19.1569 21.5625 17.5 21.5625H6.5C4.84315 21.5625 3.5 20.2194 3.5 18.5625V7.19106C3.5 5.53421 4.84315 4.19106 6.5 4.19106H17.5C19.1569 4.19106 20.5 5.53421 20.5 7.19106Z" stroke="#1A1A1A" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" />
+        </svg>
+      </button>
+    </div>
+  );
+}
diff --git a/apps/dm/app/(with-layout)/apply/status/page.tsx b/apps/dm/app/(with-layout)/apply/status/page.tsx
new file mode 100644
index 000000000..dab5d46bb
--- /dev/null
+++ b/apps/dm/app/(with-layout)/apply/status/page.tsx
@@ -0,0 +1,727 @@
+"use client";
+
+import { useDmStore } from "@/app/store";
+import type { DemandCompBizType } from "@/app/store/sdmMng";
+import SubPageHeader from "@/components/SubPageHeader";
+import { useEffect, useMemo, useRef, useState } from "react";
+
+type TopField = { label: string; key: string, value: string; required?: boolean };
+type PairField = { label: string; key: string, value: string };
+type SessionUser = { dmdInfoId?: string };
+
+const formatDate = (value: string | Date | "" | undefined) => {
+  if (!value) return "-";
+  const date = new Date(value);
+  if (Number.isNaN(date.getTime())) return String(value);
+  const yyyy = date.getFullYear();
+  const mm = String(date.getMonth() + 1).padStart(2, "0");
+  const dd = String(date.getDate()).padStart(2, "0");
+  return `${yyyy}-${mm}-${dd}`;
+};
+
+const formatValue = (value: string | number | null | undefined) => {
+  if (value === null || value === undefined || value === "") return "-";
+  return String(value);
+};
+
+const formatBelow = (value: string | number | null | undefined) => {
+  if (value === null || value === undefined || value === "") return "-";
+  if (Number(value) === -1) return "불검출";
+  return `${value} 이하`;
+};
+
+function StatusBadge({ v }: { v: string }) {
+  const cls = v === "신청" ? "text-red-600" : "text-lime-600";
+  return <span className={["font-medium", cls].join(" ")}>{v || "-"}</span>;
+}
+
+function TextInput({
+  value,
+  onChange,
+  placeholder,
+  disabled,
+  className,
+}: {
+  value: string;
+  onChange: (v: string) => void;
+  placeholder?: string;
+  disabled?: boolean;
+  className?: string;
+}) {
+  return (
+    <input
+      value={value}
+      onChange={(e) => onChange(e.target.value)}
+      placeholder={placeholder}
+      disabled={disabled}
+      className={[
+        "h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none",
+        "focus:border-neutral-500",
+        disabled ? "cursor-not-allowed" : "",
+        className ?? "",
+      ].join(" ")}
+    />
+  );
+}
+
+function DateInput({
+  value,
+  onChange,
+}: {
+  value: string;
+  onChange: (v: string) => void;
+}) {
+  
+  const ref = useRef<HTMLInputElement | null>(null);
+
+  const openPicker = () => {
+    const el = ref.current;
+    if (!el) return;
+
+    // Chrome/Edge 등 지원
+    if (typeof (el as any).showPicker === "function") {
+      (el as any).showPicker();
+      return;
+    }
+
+    // fallback (일부 브라우저)
+    el.focus();
+    el.click();
+  };
+  return (
+    <div className="relative w-full max-w-[200px]">
+      <input
+        ref={ref}
+        type="date"
+        value={value}
+        onChange={(e) => onChange(e.target.value)}
+        className={[
+          "h-11 w-full rounded-md border border-neutral-300 bg-white px-3 pr-10 text-sm outline-none focus:border-neutral-500",
+          // ✅ 기본 달력 아이콘 숨김 (Tailwind arbitrary selector)
+          "[&::-webkit-calendar-picker-indicator]:opacity-0",
+          "[&::-webkit-calendar-picker-indicator]:absolute",
+          "[&::-webkit-calendar-picker-indicator]:right-0",
+          "[&::-webkit-calendar-picker-indicator]:w-10",
+          "[&::-webkit-calendar-picker-indicator]:h-full",
+          "[&::-webkit-calendar-picker-indicator]:cursor-pointer",
+        ].join(" ")}
+      />
+
+      {/* ✅ 클릭 가능한 아이콘 버튼 */}
+      <button
+        type="button"
+        onClick={openPicker}
+        className="absolute right-2 top-1/2 -translate-y-1/2 p-1 text-neutral-500 hover:text-neutral-700"
+        aria-label="달력 열기"
+      >
+        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" aria-hidden="true">
+            <path d="M7.14286 7.99104H16.7812M6.48512 2.5625V4.19126M17.3125 2.5625V4.19106M20.5 7.19106L20.5 18.5625C20.5 20.2194 19.1569 21.5625 17.5 21.5625H6.5C4.84315 21.5625 3.5 20.2194 3.5 18.5625V7.19106C3.5 5.53421 4.84315 4.19106 6.5 4.19106H17.5C19.1569 4.19106 20.5 5.53421 20.5 7.19106Z" stroke="#1A1A1A" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" />
+        </svg>
+      </button>
+    </div>
+  );
+}
+
+export default function DemandStatusPage() {
+  const { getSdmInfoStatusList, updateSdmInfoData, Sdm, Common } = useDmStore((state) => state);
+  const { successLogin, sdmInfoStatusList } = Sdm;
+  const { selectSidoData, selectSigunData } = Common;
+
+  const detailRef = useRef<HTMLDivElement | null>(null);
+
+  const [isLoginStorageInfo, setIsLoginStorageInfo] = useState(false);
+  const [selectedDmdInfoSn, setSelectedDmdInfoSn] = useState<number | "" | null>(null);
+  const [transformedSdmInfoStatusList, setTransformedSdmInfoStatusList] = useState<DemandCompBizType[]>([]);
+
+  // 수정 유무
+  const [ isEditMode, setIsEditMode ] = useState(false);
+  // 수정용 (UI에서 바뀌는 값)
+  const [editData, setEditData] = useState<any>(null);
+  // 원본 백업 (취소용)
+  const [originData, setOriginData] = useState<any>(null);
+  // 사용용도
+  const useTypesData = useDmStore((state) => state.Sdm.useTypesData);
+  const getUseTypesData = useDmStore((state) => state.getUseTypesData);
+
+  useEffect(() => {
+    const user = sessionStorage.getItem("user");
+    if (user) {
+      setIsLoginStorageInfo(true);
+    }
+  }, []);
+
+  useEffect(() => {
+    getUseTypesData();
+  }, [getUseTypesData]);
+
+  useEffect(() => {
+    if (!successLogin && !isLoginStorageInfo) return;
+
+    const user = sessionStorage.getItem("user");
+    if (!user) return;
+
+    try {
+      const userData = JSON.parse(user) as SessionUser;
+      const dmdInfoId = userData.dmdInfoId?.trim();
+      if (dmdInfoId) {
+        getSdmInfoStatusList(dmdInfoId);
+      }
+    } catch (error) {
+      console.error("Error parsing user data:", error);
+    }
+  }, [successLogin, isLoginStorageInfo, getSdmInfoStatusList]);
+
+  useEffect(() => {
+    const mappedList = sdmInfoStatusList.map((item) => ({
+      ...item,
+      ctpvCd: selectSidoData.find((sido) => sido.val === item.ctpvCd?.trim())?.text || item.ctpvCd,
+      sggCd: selectSigunData.find((sigun) => sigun.val === item.sggCd?.trim())?.text || item.sggCd,
+    }));
+
+    setTransformedSdmInfoStatusList(mappedList);
+  }, [sdmInfoStatusList, selectSidoData, selectSigunData]);
+
+  useEffect(() => {
+    const first = transformedSdmInfoStatusList[0];
+    if (!first) {
+      setSelectedDmdInfoSn(null);
+      return;
+    }
+
+    if (selectedDmdInfoSn == null) {
+      setSelectedDmdInfoSn(first.dmdInfoSn);
+      return;
+    }
+
+    const exists = transformedSdmInfoStatusList.some(
+      (item) => item.dmdInfoSn === selectedDmdInfoSn,
+    );
+    if (!exists) {
+      setSelectedDmdInfoSn(first.dmdInfoSn);
+    }
+  }, [transformedSdmInfoStatusList, selectedDmdInfoSn]);
+
+  const selectedSdmInfoStatus = useMemo(() => {
+    if (!transformedSdmInfoStatusList.length) return null;
+    return (
+      transformedSdmInfoStatusList.find((item) => item.dmdInfoSn === selectedDmdInfoSn) ??
+      transformedSdmInfoStatusList[0]
+    );
+  }, [transformedSdmInfoStatusList, selectedDmdInfoSn]);
+
+  const topFields: TopField[] = useMemo(() => {
+    if (!selectedSdmInfoStatus) return [];
+
+    return [
+      { label: "요구시기", key: "dmndTmng", value: formatDate(selectedSdmInfoStatus.dmndTmng), required: true },
+      { label: "요구수량(㎥/d)", key: "dmndQty", value: formatValue(selectedSdmInfoStatus.dmndQty) },
+      { label: "사용용도", key: "useUsgCd",  value: formatValue(selectedSdmInfoStatus.useUsgCd) },
+      { label: "희망단가(원/㎥)", key: "wntUntprc", value: formatValue(selectedSdmInfoStatus.wntUntprc) },
+    ];
+  }, [selectedSdmInfoStatus]);
+
+  const waterFields: PairField[] = useMemo(() => {
+    if (!selectedSdmInfoStatus) return [];
+
+    return [
+      { label: "총대장균군수(개/100mL)", key: "grssClfg", value: formatBelow(selectedSdmInfoStatus.grssClfg) },
+      { label: "결합잔류염소(mg/L)", key:"combResdch", value: formatBelow(selectedSdmInfoStatus.combResdch) },
+      { label: "탁도(NTU)", key:"trbt", value: formatBelow(selectedSdmInfoStatus.trbt) },
+
+      { label: "생물학적산소요구량(BOD)(mg/L)", key:"blgcOxygDmndQnt", value: formatBelow(selectedSdmInfoStatus.blgcOxygDmndQnt) },
+      { label: "냄새", key:"smll", value: formatValue(selectedSdmInfoStatus.smll) },
+      { label: "색도(도)", key:"crmty", value: formatBelow(selectedSdmInfoStatus.crmty) },
+
+      { label: "총질소(T-N)(mg/L)", key:"tn", value: formatBelow(selectedSdmInfoStatus.tn) },
+      { label: "총인(T-P)(mg/L)", key:"tph", value: formatBelow(selectedSdmInfoStatus.tph) },
+      { label: "수소이온농도(pH)", key:"ph", value: formatValue(selectedSdmInfoStatus.ph) },
+
+      { label: "염화물(mgCL/L)", key:"clIonQnt", value: formatBelow(selectedSdmInfoStatus.clIonQnt) },
+      { label: "전기전도도(μS/cm)", key:"cdtnv", value: formatBelow(selectedSdmInfoStatus.cdtnv) },
+      { label: "비고", key:"rmrk", value: formatValue(selectedSdmInfoStatus.rmrk) },
+    ];
+  }, [selectedSdmInfoStatus]);
+
+  const candidateNames = useMemo(() => {
+    const list = isEditMode
+    ? editData?.splyCndtList ?? []
+    : selectedSdmInfoStatus?.splyCndtList ?? [];
+    return [
+      list[0]?.ruseUtztnFcltNm ?? "",
+      list[1]?.ruseUtztnFcltNm ?? "",
+      list[2]?.ruseUtztnFcltNm ?? "",
+    ];
+  }, [isEditMode, editData, selectedSdmInfoStatus]);
+
+  const onSelectSdmInfoStatus = (dmdInfoSn: number | "") => {
+    if(isEditMode){
+      if(confirm('저장되지 않은 데이터는 사라집니다.\n진행하시겠습니까?')){
+        setIsEditMode(false);
+      }
+    }
+    setSelectedDmdInfoSn(dmdInfoSn);
+    requestAnimationFrame(() => {
+      detailRef.current?.scrollIntoView({ behavior: "smooth", block: "start" });
+    });
+  };
+
+  // ph 전후로 나눔
+  const getRange = (val: string) => {
+    const a = val.split('~')[0]||''; const b = val.split('~')[1]||'';
+    return { a, b };
+  };
+
+  const searchCandidate = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const dmdInfoId = JSON.parse(
+      sessionStorage.getItem("user") || "{}"
+    )?.dmdInfoId?.toString();
+
+    const url = `/map/popup?dmdInfoId=${encodeURIComponent(dmdInfoId)}`;
+    const width = window.screen.availWidth;
+    const height = window.screen.availHeight;
+    const left = 0;
+    const top = 0;
+    const popupOptions = `width=${width},height=${height},left=${left},top=${top},resizable=yes,scrollbars=yes`;
+    window.open(url, "candidatePopup", popupOptions);
+  };
+
+  const saveInfo = () => {
+    if(confirm('수정된 데이터를 저장하시겠습니까?')){
+      const payload = {
+        ...editData,
+        splyCndtList : editData.splyCndtList ?? []
+      };
+      
+      updateSdmInfoData(payload).then((res) => {
+        if (res) {
+          const user = JSON.parse(sessionStorage.getItem("user") || "{}");
+          if (user?.dmdInfoId) {
+            getSdmInfoStatusList(user.dmdInfoId);
+          }
+          setIsEditMode(false);
+        }
+      });
+    }
+  }
+
+  useEffect(() => {
+    const handler = (event: MessageEvent) => {
+      if (!event.data) return;
+
+      if (event.data.type === "SET_SUBS_INFO") {
+        const list = event.data.payload || [];
+        setEditData((prev) => ({
+          ...prev,
+          splyCndtList: list,
+        }));
+      }
+    };
+
+    window.addEventListener("message", handler);
+
+    return () => {
+      window.removeEventListener("message", handler);
+    };
+  }, []);
+
+  return (
+    
+    <main className="bg-white">
+      <SubPageHeader
+        title="수요신청현황"
+        crumbs={[
+          { label: "Home", href: "/main" },
+          { label: "수요신청", href: "/apply/status" },
+          { label: "수요신청현황" },
+        ]}
+        hideFooterLine
+        hideGuideText
+      />
+
+      <div>
+        <section className="mt-6">
+          <div className="text-2xl font-bold text-slate-700">수요정보 신청현황</div>
+
+          <div className="mt-3 border border-neutral-200">
+            <table className="w-full table-fixed">
+              <thead className="bg-[#E7F4E2]">
+                <tr className="text-sm text-slate-700">
+                  <th className="w-[60px] px-3 py-3 text-center">NO.</th>
+                  <th className="w-[120px] px-3 py-3 text-center">시도</th>
+                  <th className="w-[120px] px-3 py-3 text-center">시군구</th>
+                  <th className="w-[180px] px-3 py-3 text-center">회사명</th>
+                  <th className="px-3 py-3 text-center">공장주소</th>
+                  <th className="w-[140px] px-3 py-3 text-center">전화번호</th>
+                  <th className="w-[120px] px-3 py-3 text-center">요구시기</th>
+                  <th className="w-[120px] px-3 py-3 text-center">등록일자</th>
+                  <th className="w-[120px] px-3 py-3 text-center">수정일자</th>
+                  <th className="w-[110px] px-3 py-3 text-center">진행상태</th>
+                </tr>
+              </thead>
+
+              <tbody className="bg-white text-base text-slate-700">
+                {transformedSdmInfoStatusList.length === 0 ? (
+                  <tr>
+                    <td colSpan={8} className="px-3 py-10 text-center text-slate-400">
+                      조회된 신청내역이 없습니다.
+                    </td>
+                  </tr>
+                ) : (
+                  transformedSdmInfoStatusList.map((sdmInfoStatus, index) => {
+                    const active = sdmInfoStatus.dmdInfoSn === selectedSdmInfoStatus?.dmdInfoSn;
+                    return (
+                      <tr
+                        key={`${sdmInfoStatus.dmdInfoSn}-${index}`}
+                        role="row"
+                        tabIndex={0}
+                        onClick={() => onSelectSdmInfoStatus(sdmInfoStatus.dmdInfoSn)}
+                        onKeyDown={(e) => {
+                          if (e.key === "Enter" || e.key === " ") {
+                            onSelectSdmInfoStatus(sdmInfoStatus.dmdInfoSn);
+                          } 
+                        }}
+                        className={[
+                          "border-t border-neutral-200 outline-none",
+                          "cursor-pointer",
+                          active ? "bg-slate-50" : "hover:bg-slate-50",
+                          "focus-visible:ring-2 focus-visible:ring-slate-300",
+                        ].join(" ")}
+                        aria-selected={active}
+                      >
+                        <td className="px-3 py-3 text-center">{sdmInfoStatus.index || index + 1}</td>
+                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.ctpvCd)}</td>
+                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.sggCd)}</td>
+                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.dmdCoNm)}</td>
+                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.daddr)}</td>
+                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.telno)}</td>
+                        <td className="px-3 py-3 text-center">{formatDate(sdmInfoStatus.dmndTmng)}</td>
+                        <td className="px-3 py-3 text-center">{formatDate(sdmInfoStatus.regDt)}</td>
+                        <td className="px-3 py-3 text-center">{formatDate(sdmInfoStatus.mdfcnDt)}</td>
+                        <td className="px-3 py-3 text-center">
+                          <StatusBadge v={formatValue(sdmInfoStatus.status)} />
+                        </td>
+                      </tr>
+                    );
+                  })
+                )}
+              </tbody>
+            </table>
+          </div>
+        </section>
+
+        <section className="mt-10 pb-16" ref={detailRef}>
+          <div className="flex justify-between items-center">
+            <div className="text-2xl font-bold text-slate-700">수요신청 상세현황</div>
+            {
+              !isEditMode ? (
+                <button
+                  type="button"
+                  className="h-8 rounded-md bg-[#888] px-4 text-base text-white hover:bg-neutral-700"
+                  onClick={() => {
+                    setOriginData(selectedSdmInfoStatus);
+                    setEditData({...selectedSdmInfoStatus});
+                    setIsEditMode(true)}
+                  }
+                >
+                  수정
+                </button>
+            ) : ( 
+               <div className="flex gap-2">
+                <button
+                  type="button"
+                  className="h-8 rounded-md bg-[#888] px-4 text-base text-white hover:bg-neutral-700"
+                  onClick={() => {
+                    saveInfo();
+                  }}
+                >
+                  저장
+                </button>
+                <button
+                  type="button"
+                  className="h-8 rounded-md bg-[#888] px-4 text-base text-white hover:bg-neutral-700"
+                  onClick={() => {
+                    setEditData(originData);
+                    setIsEditMode(false)
+                  }}
+                >
+                  취소
+                </button>
+              </div>
+            )
+          }
+          </div>
+
+          {!selectedSdmInfoStatus ? (
+            <div className="mt-3 border border-neutral-200 px-6 py-10 text-center text-sm text-slate-400">
+              상세 정보를 표시할 신청건이 없습니다.
+            </div>
+          ) : (
+            <div className="mt-3 border border-neutral-200">
+              <div className="bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-b border-neutral-200">
+                요구수량
+              </div>
+
+              <div className="grid grid-cols-12 text-sm">
+                {topFields.map((field) => (
+                  <div
+                    key={field.label}
+                    className="col-span-12 md:col-span-6 grid grid-cols-12 border-b border-neutral-200"
+                  >
+                    <div className="col-span-4 bg-sky-50 px-4 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
+                      {field.label}
+                      {field.required ? <span className="ml-1 text-red-500">*</span> : null}
+                    </div>
+                    {
+                      !isEditMode ?
+                        <div className="col-span-8 px-4 py-4 flex items-center justify-center text-center">
+                          {field.key==='useUsgCd'? useTypesData.filter(item=>item.val===field.value)[0]?.text: field.value}
+                        </div>
+                      : <div className="col-span-8 px-4 py-4 flex items-center justify-center text-center">
+                          {field.key ==='dmndTmng'?
+                          <DateInput value={editData?.[field.key] ?? ""} onChange={(v) =>
+                              setEditData((prev) => ({
+                                ...prev,
+                                [field.key]: v,
+                              }))
+                            } />
+                          : field.key ==='useUsgCd'?
+                          <select
+                            value={editData?.[field.key] ?? ""}
+                            onChange={(e) =>
+                              setEditData((prev) => ({
+                                ...prev,
+                                [field.key]: e.target.value,
+                              }))
+                            }
+                            className="h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
+                          >
+                            <option value="">선택하세요</option>
+                              {useTypesData.map((item) => (
+                                <option key={item.val} value={item.val}>
+                                  {item.text}
+                                </option>
+                              ))}
+                          </select>
+
+                          : <TextInput value={editData?.[field.key] ?? ""} onChange={(v) =>
+                              setEditData((prev) => ({
+                                ...prev,
+                                [field.key]: v,
+                              }))
+                            }></TextInput> 
+                          }
+                        </div>
+                    }
+                  </div>
+                ))}
+
+                <div className="col-span-12 bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-b border-neutral-200">
+                  요구수질
+                </div>
+
+                {waterFields.map((field) => {
+                  const { a, b } = editData?.ph ? getRange(editData.ph) : { a: "", b: "" };
+                  return (
+                  <div
+                  key={field.label}
+                  className="col-span-12 md:col-span-4 grid grid-cols-12 border-b border-neutral-200"
+                  >
+                    <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
+                      {field.label}
+                    </div>
+                    <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
+                      {
+                        !isEditMode ? field.value 
+                        :
+                          field.key === "grssClfg" ? (
+                            <div className="flex items-center gap-4">
+                              <TextInput
+                                value={
+                                  editData?.grssClfg === -1
+                                    ? ""
+                                    : editData?.grssClfg ?? ""
+                                }
+                                onChange={(v) =>
+                                  setEditData((prev) => ({
+                                    ...prev,
+                                    grssClfg: v,
+                                  }))
+                                }
+                                disabled={editData?.grssClfg === -1}
+                                className={
+                                  editData?.grssClfg === -1
+                                    ? "bg-neutral-100 text-neutral-400"
+                                    : ""
+                                }
+                              />
+                              <label className="flex items-center gap-2 w-3/4 text-sm text-neutral-700">
+                                <input
+                                  type="checkbox"
+                                  checked={editData?.grssClfg === -1}
+                                  onChange={(e) => {
+                                    const checked = e.target.checked;
+
+                                    setEditData((prev) => ({
+                                      ...prev,
+                                      grssClfg: checked ? -1 : "",
+                                    }));
+                                  }}
+                                  className="h-4 w-4 rounded border-neutral-300"
+                                />
+                                불검출
+                              </label>
+                            </div>
+                          ) : field.key === 'smll' ? (
+                            <select
+                              value={
+                                  editData?.smll === -1
+                                    ? ""
+                                    : editData?.smll ?? ""
+                                }
+                              onChange={(v) =>
+                                  setEditData((prev) => ({
+                                    ...prev,
+                                    grssClfg: v,
+                                  }))
+                                }
+                              className="h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500">
+                              <option>불쾌하지 않을 것</option>
+                              <option>약간 있음</option>
+                              <option>있음</option>
+                          </select>
+                          ) : field.key === 'ph' ? (
+                            <>
+                              <TextInput
+                                value={a}
+                                onChange={(v) =>
+                                  setEditData((prev) => ({
+                                    ...prev,
+                                    [field.key]: `${v}~${b}`,
+                                  }))
+                                }
+                              />
+                              ~
+                              <TextInput
+                                value={b}
+                                onChange={(v) =>
+                                  setEditData((prev) => ({
+                                    ...prev,
+                                    [field.key]: `${a}~${v}`,
+                                  }))
+                                }
+                              />
+                            </>
+                          ) : (
+                            <>
+                              <TextInput
+                                value={editData?.[field.key] ?? ""}
+                                onChange={(v) =>
+                                  setEditData((prev) => ({
+                                    ...prev,
+                                    [field.key]: v,
+                                  }))
+                                }
+                              />
+                            {
+                              field.key==='tn'||field.key === 'tph'||field.key === 'trbt'||field.key==='blgcOxygDmndQnt'||field.key==='clIonQnt'||field.key==='cdtnv'|| field.key=='crmty'
+                              ?<>이하</>:<></>
+                            }
+                            </>
+                          )
+                        }
+                    </div>
+                  </div>
+                )})}
+
+                <div className="col-span-12 bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-b border-neutral-200">
+                  공급처 후보지
+                  {
+                    isEditMode &&
+                    <button
+                      type="button"
+                      className="h-8 w-25 ml-12 rounded-md bg-[#888] px-2 text-base text-white hover:bg-neutral-700"
+                      onClick={(e) => {
+                        searchCandidate(e);
+
+                        //splyList => 해당객체가 대민에서 선택한 후보처 리스트
+                        //setLastSub => 해당 스테이트가 선택한 마지막 후보처를 넣어야하는 스테이트
+                      }}>
+                      후보지 조회
+                    </button>
+                  }
+
+                </div>
+
+                {candidateNames.map((candidateName, index) => (
+                  isEditMode ? (
+                    <div
+                      key={`candidate-${index}`}
+                      className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200"
+                    >
+                      <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
+                        후보지{index + 1}
+                      </div>
+                      <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
+                        <TextInput
+                          value={candidateName}
+                          disabled={true}
+                          onChange={(v) => {
+                            setEditData((prev) => {
+                              const newList = [...(prev.splyCndtList || [])];
+                              newList[index] = {
+                                ...newList[index],
+                                ruseUtztnFcltNm: v,
+                              };
+                              return {
+                                ...prev,
+                                splyCndtList: newList,
+                              };
+                            });
+                          }}
+                        />
+                      </div>
+                    </div>
+                  ) :
+                  <div
+                    key={`candidate-${index}`}
+                    className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200"
+                  >
+                    <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
+                      후보지{index + 1}
+                    </div>
+                    <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
+                      {candidateName}
+                    </div>
+                  </div>
+                ))}
+
+                <div className="col-span-12 bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-t border-b border-neutral-200">
+                  수요신청 진행상태
+                </div>
+
+                <div className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200">
+                  <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
+                    진행상태
+                  </div>
+                  <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
+                    {formatValue(selectedSdmInfoStatus.status)}
+                  </div>
+                </div>
+                <div className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200">
+                  <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
+                    공급처매칭결과
+                  </div>
+                  <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
+                    {formatValue(selectedSdmInfoStatus.ruseUtztnFcltNm)}
+                  </div>
+                </div>
+              </div>
+            </div>
+          )}
+        </section>
+      </div>
+    </main>
+  );
+}
diff --git a/apps/dm_new/app/(with-layout)/example/globalCase/australia/page.tsx b/apps/dm/app/(with-layout)/example/globalCase/australia/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/globalCase/australia/page.tsx
rename to apps/dm/app/(with-layout)/example/globalCase/australia/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/globalCase/eu/page.tsx b/apps/dm/app/(with-layout)/example/globalCase/eu/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/globalCase/eu/page.tsx
rename to apps/dm/app/(with-layout)/example/globalCase/eu/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/globalCase/overview/page.tsx b/apps/dm/app/(with-layout)/example/globalCase/overview/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/globalCase/overview/page.tsx
rename to apps/dm/app/(with-layout)/example/globalCase/overview/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/globalCase/singapore/page.tsx b/apps/dm/app/(with-layout)/example/globalCase/singapore/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/globalCase/singapore/page.tsx
rename to apps/dm/app/(with-layout)/example/globalCase/singapore/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/globalCase/taiwan/page.tsx b/apps/dm/app/(with-layout)/example/globalCase/taiwan/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/globalCase/taiwan/page.tsx
rename to apps/dm/app/(with-layout)/example/globalCase/taiwan/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/layout.tsx b/apps/dm/app/(with-layout)/example/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/layout.tsx
rename to apps/dm/app/(with-layout)/example/layout.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/rain/suwon/page.tsx b/apps/dm/app/(with-layout)/example/rain/suwon/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/rain/suwon/page.tsx
rename to apps/dm/app/(with-layout)/example/rain/suwon/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/sewage/bolyeong/page.tsx b/apps/dm/app/(with-layout)/example/sewage/bolyeong/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/sewage/bolyeong/page.tsx
rename to apps/dm/app/(with-layout)/example/sewage/bolyeong/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/sewage/cheongju/page.tsx b/apps/dm/app/(with-layout)/example/sewage/cheongju/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/sewage/cheongju/page.tsx
rename to apps/dm/app/(with-layout)/example/sewage/cheongju/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/sewage/guri/page.tsx b/apps/dm/app/(with-layout)/example/sewage/guri/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/sewage/guri/page.tsx
rename to apps/dm/app/(with-layout)/example/sewage/guri/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/sewage/hwanggu/page.tsx b/apps/dm/app/(with-layout)/example/sewage/hwanggu/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/sewage/hwanggu/page.tsx
rename to apps/dm/app/(with-layout)/example/sewage/hwanggu/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/sewage/paju/page.tsx b/apps/dm/app/(with-layout)/example/sewage/paju/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/sewage/paju/page.tsx
rename to apps/dm/app/(with-layout)/example/sewage/paju/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/example/sewage/yeosu/page.tsx b/apps/dm/app/(with-layout)/example/sewage/yeosu/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/example/sewage/yeosu/page.tsx
rename to apps/dm/app/(with-layout)/example/sewage/yeosu/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/intro/greywater/page.tsx b/apps/dm/app/(with-layout)/intro/greywater/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/intro/greywater/page.tsx
rename to apps/dm/app/(with-layout)/intro/greywater/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/intro/law/page.tsx b/apps/dm/app/(with-layout)/intro/law/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/intro/law/page.tsx
rename to apps/dm/app/(with-layout)/intro/law/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/intro/layout.tsx b/apps/dm/app/(with-layout)/intro/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/intro/layout.tsx
rename to apps/dm/app/(with-layout)/intro/layout.tsx
diff --git a/apps/dm_new/app/(with-layout)/intro/rain/page.tsx b/apps/dm/app/(with-layout)/intro/rain/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/intro/rain/page.tsx
rename to apps/dm/app/(with-layout)/intro/rain/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/intro/sewage/page.tsx b/apps/dm/app/(with-layout)/intro/sewage/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/intro/sewage/page.tsx
rename to apps/dm/app/(with-layout)/intro/sewage/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/layout.tsx b/apps/dm/app/(with-layout)/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/layout.tsx
rename to apps/dm/app/(with-layout)/layout.tsx
diff --git a/apps/dm_new/app/(with-layout)/status/greywater/page.tsx b/apps/dm/app/(with-layout)/status/greywater/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/status/greywater/page.tsx
rename to apps/dm/app/(with-layout)/status/greywater/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/status/layout.tsx b/apps/dm/app/(with-layout)/status/layout.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/status/layout.tsx
rename to apps/dm/app/(with-layout)/status/layout.tsx
diff --git a/apps/dm_new/app/(with-layout)/status/rain/page.tsx b/apps/dm/app/(with-layout)/status/rain/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/status/rain/page.tsx
rename to apps/dm/app/(with-layout)/status/rain/page.tsx
diff --git a/apps/dm_new/app/(with-layout)/status/sewage/page.tsx b/apps/dm/app/(with-layout)/status/sewage/page.tsx
similarity index 100%
rename from apps/dm_new/app/(with-layout)/status/sewage/page.tsx
rename to apps/dm/app/(with-layout)/status/sewage/page.tsx
diff --git a/apps/dm_new/app/api/postcode/route.ts b/apps/dm/app/api/postcode/route.ts
similarity index 100%
rename from apps/dm_new/app/api/postcode/route.ts
rename to apps/dm/app/api/postcode/route.ts
diff --git a/apps/dm/app/base.tsx b/apps/dm/app/base.tsx
deleted file mode 100644
index bae02acb2..000000000
--- a/apps/dm/app/base.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-"use client";
-
-import { BaseLayout } from "@common/components";
-import type { MenuItem } from "./store/common";
-import { useDmStore } from "./store";
-import { usePathname, useRouter } from "next/navigation";
-
-export default function Base({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-  const { getMenuAuth } = useDmStore((state) => state);
-
-  const router = useRouter();
-  const pathname = usePathname();
-
-  const handleClick = (id: MenuItem) => {
-    getMenuAuth(id.menuCd);
-    router.push(id.urlPath);
-  };
-
-  return (
-    <BaseLayout currentPath={pathname ?? ""} handleMenuClick={handleClick}>
-      {children}
-    </BaseLayout>
-  );
-}
diff --git a/apps/dm_new/app/globals.css b/apps/dm/app/commonOrigin.css
similarity index 93%
rename from apps/dm_new/app/globals.css
rename to apps/dm/app/commonOrigin.css
index 2fee793a1..fdc8d0eb8 100644
--- a/apps/dm_new/app/globals.css
+++ b/apps/dm/app/commonOrigin.css
@@ -1,5 +1,4 @@
-/* @import "../../../packages/common/components/src/base.css"; */
-/* @import "../../../packages/common/components/src/base.css"; */
+@import "../../../packages/common/components/src/base.css";
 
 @tailwind base;
 @tailwind components;
@@ -80,4 +79,4 @@
 
 body {
   font-family: "NotoSansKR", sans-serif;
-}
+}
\ No newline at end of file
diff --git a/apps/dm/app/globals.css b/apps/dm/app/globals.css
index f30aa3031..2fee793a1 100644
--- a/apps/dm/app/globals.css
+++ b/apps/dm/app/globals.css
@@ -1,4 +1,5 @@
-@import "../../../packages/common/components/src/base.css";
+/* @import "../../../packages/common/components/src/base.css"; */
+/* @import "../../../packages/common/components/src/base.css"; */
 
 @tailwind base;
 @tailwind components;
@@ -68,3 +69,15 @@
     @apply bg-background text-foreground;
   }
 }
+
+@font-face {
+  font-family: "NotoSansKR";
+  src: url("/fonts/NotoSansKR-Regular.woff2") format("woff2");
+  font-weight: 400;
+  font-style: normal;
+  font-display: swap;
+}
+
+body {
+  font-family: "NotoSansKR", sans-serif;
+}
diff --git a/apps/dm/app/layout.tsx b/apps/dm/app/layout.tsx
index 7224c9dc2..0e45865e7 100644
--- a/apps/dm/app/layout.tsx
+++ b/apps/dm/app/layout.tsx
@@ -15,7 +15,11 @@ export default function RootLayout({
       <head>
         <title>물재이용 대민</title>
       </head>
-      <body>{children}</body>
+      <body>
+        <div className="min-w-[1800px] overflow-x-auto">
+          {children}
+        </div>
+      </body>
     </html>
   );
 }
diff --git a/apps/dm_new/app/main/SideIndicator.tsx b/apps/dm/app/main/SideIndicator.tsx
similarity index 100%
rename from apps/dm_new/app/main/SideIndicator.tsx
rename to apps/dm/app/main/SideIndicator.tsx
diff --git a/apps/dm_new/app/main/_hooks/useScrollSpy.ts b/apps/dm/app/main/_hooks/useScrollSpy.ts
similarity index 100%
rename from apps/dm_new/app/main/_hooks/useScrollSpy.ts
rename to apps/dm/app/main/_hooks/useScrollSpy.ts
diff --git a/apps/dm_new/app/main/_sections/Cases.tsx b/apps/dm/app/main/_sections/Cases.tsx
similarity index 100%
rename from apps/dm_new/app/main/_sections/Cases.tsx
rename to apps/dm/app/main/_sections/Cases.tsx
diff --git a/apps/dm_new/app/main/_sections/Hero.tsx b/apps/dm/app/main/_sections/Hero.tsx
similarity index 100%
rename from apps/dm_new/app/main/_sections/Hero.tsx
rename to apps/dm/app/main/_sections/Hero.tsx
diff --git a/apps/dm_new/app/main/_sections/IntroCards.tsx b/apps/dm/app/main/_sections/IntroCards.tsx
similarity index 100%
rename from apps/dm_new/app/main/_sections/IntroCards.tsx
rename to apps/dm/app/main/_sections/IntroCards.tsx
diff --git a/apps/dm_new/app/main/_sections/ProcessFlow.tsx b/apps/dm/app/main/_sections/ProcessFlow.tsx
similarity index 100%
rename from apps/dm_new/app/main/_sections/ProcessFlow.tsx
rename to apps/dm/app/main/_sections/ProcessFlow.tsx
diff --git a/apps/dm_new/app/main/layout.tsx b/apps/dm/app/main/layout.tsx
similarity index 100%
rename from apps/dm_new/app/main/layout.tsx
rename to apps/dm/app/main/layout.tsx
diff --git a/apps/dm_new/app/main/page.tsx b/apps/dm/app/main/page.tsx
similarity index 100%
rename from apps/dm_new/app/main/page.tsx
rename to apps/dm/app/main/page.tsx
diff --git a/apps/dm/app/page.tsx b/apps/dm/app/page.tsx
deleted file mode 100644
index fdb323086..000000000
--- a/apps/dm/app/page.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-"use client"
-
-import Link from 'next/link';
-import { Button } from '@common/components/ui';
-
-export default function Home() {
-  return (
-    <>
-      <div className='flex'>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/wrAbout">물재이용이란</Link>
-        </Button>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/wrExample">물재이용 사례</Link>
-        </Button>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/wrStatus">물재이용 현황</Link>
-        </Button>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/wrOverview">물재이용 사업추진절차</Link>
-        </Button>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/sdmMng/sdmInsert">수요처 등록</Link>
-        </Button>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/sdmMng/sdmInfoInsert">수요처 정보 등록</Link>
-        </Button>
-      </div>
-      <div className='flex'>
-        <Button className='ml-5 place-self-auto'> 
-          <Link href="/pages/sdmMng/sdmApplyList">수요처 신청 현황(개발중)</Link>
-        </Button>
-      </div>
-    </>  
-  );
-}
diff --git a/apps/dm_new/app/reuse.module.css b/apps/dm/app/reuse.module.css
similarity index 100%
rename from apps/dm_new/app/reuse.module.css
rename to apps/dm/app/reuse.module.css
diff --git a/apps/dm/app/store/common/index.tsx b/apps/dm/app/store/common/index.tsx
index 6721d2620..e875c2eca 100644
--- a/apps/dm/app/store/common/index.tsx
+++ b/apps/dm/app/store/common/index.tsx
@@ -327,12 +327,95 @@ const fetchEnvPartData = async (): Promise<envPartSelectDataType[]> => {
   }
 };
 
+function sortMenus(items: MenuItem[]): MenuItem[] {
+  return [...items]
+    .sort((a, b) => a.sortSeq - b.sortSeq)
+    .map((item) => ({
+      ...item,
+      children: item.children ? sortMenus(item.children) : [],
+    }));
+}
+
+function isVisible(item: MenuItem): boolean {
+  return item.useYn !== "N" && item.otptYn !== "N";
+}
+
+function normalizeMenus(items: MenuItem[]): MenuItem[] {
+  return sortMenus(items)
+    .filter(isVisible)
+    .map((item) => ({
+      ...item,
+      children: item.children ? normalizeMenus(item.children) : [],
+    }));
+}
+
+export const REUSE_SITE_ID = process.env.NEXT_PUBLIC_SITE_ID || "DM";
+const anonymousMenuCache = new Map<string, MenuItem[]>();
+const anonymousMenuInFlight = new Map<string, Promise<MenuItem[]>>();
+
+export async function fetchAnonymousMenu(siteId = REUSE_SITE_ID): Promise<MenuItem[]> {
+  const cached = anonymousMenuCache.get(siteId);
+  if (cached) return cached;
+
+  const inFlight = anonymousMenuInFlight.get(siteId);
+  if (inFlight) return inFlight;
+
+  const request = (async () => {
+    const response = await fetch(`/cms-service/api/v1/menu/anonymous/user/${siteId}`, {
+      method: "GET",
+      headers: { "Content-Type": "application/json" },
+      cache: "no-store",
+    });
+
+    if (!response.ok) {
+      throw new Error(`Failed to load menu: ${response.status}`);
+    }
+
+    const data = (await response.json()) as MenuItem[];
+    const normalized = Array.isArray(data) ? normalizeMenus(data) : [];
+    anonymousMenuCache.set(siteId, normalized);
+    return normalized;
+  })();
+
+  anonymousMenuInFlight.set(siteId, request);
+  try {
+    return await request;
+  } finally {
+    anonymousMenuInFlight.delete(siteId);
+  }
+}
+
+function isPathMatched(pathname: string, urlPath: string) {
+  if (!urlPath) return false;
+  return pathname === urlPath || pathname.startsWith(`${urlPath}/`);
+}
+
+function hasMatchedPathInTree(menu: MenuItem, pathname: string): boolean {
+  if (isPathMatched(pathname, menu.urlPath)) return true;
+  return (menu.children ?? []).some((child) => hasMatchedPathInTree(child, pathname));
+}
+
+export function findActiveTopMenu(menus: MenuItem[], pathname: string): MenuItem | null {
+  const level1Menus = menus.filter((menu) => menu.levelNo === 1 || menu.parentId === null);
+  const matched = level1Menus.filter((menu) => hasMatchedPathInTree(menu, pathname));
+
+  return matched[0] ?? level1Menus[0] ?? null;
+}
+
+export function hasAnyChild(item: MenuItem): boolean {
+  return Array.isArray(item.children) && item.children.length > 0;
+}
+
+export function isMenuActive(pathname: string, menu: MenuItem): boolean {
+  return isPathMatched(pathname, menu.urlPath);
+}
 /**====================================
  * Store - expaort
  ====================================*/
 export type CommonAction = {
   initializeCommonData: () => Promise<void>;
   getMenuAuth: (menuCd:number) => Promise<void>;
+  fetchAnonymousMenu: (siteId?: string) => Promise<MenuItem[]>;
 }
 
 export type CommonType = {
@@ -413,7 +496,7 @@ export const CommonReducer:(set:any)=>CommonAction=(set: any) => {
         }
       })
     )},
+    fetchAnonymousMenu: async (siteId = REUSE_SITE_ID) => fetchAnonymousMenu(siteId)
   }
 }
-
 export type CommonStore = CommonType & CommonAction;
diff --git a/apps/dm/app/store/sdmMng/index.tsx b/apps/dm/app/store/sdmMng/index.tsx
index 2e52ac13d..1f4bfa572 100644
--- a/apps/dm/app/store/sdmMng/index.tsx
+++ b/apps/dm/app/store/sdmMng/index.tsx
@@ -1,4 +1,4 @@
-import { fetchType, getFetch, postFetch } from "@/components/ui/api";
+import { fetchType, getFetch, postFetch, getFetchWithCount } from "@/components/ui/api";
 import type { SelectDataType } from "@common/business_components/ui";
 import type { TableUpperProps } from "../common";
 import toast from "react-hot-toast";
@@ -10,34 +10,27 @@ import { z } from "zod";
 =====================================*/
 
 export const sdmInfoFormSchema = z.object({
-  sdmNm: z.string().min(1, "수요처를 선택해주세요"),
-  demandYmd: z.date().optional(),
-  demandQnty: z
-    .string()
-    .min(1, "요구수량을 입력해주세요")
-    .regex(/^[0-9]+$/, "요구수량은 숫자만 입력 가능합니다"),
-  usePurpose: z.string().optional(),
-  money: z.string().regex(/^[0-9]+$/, "희망단가는 숫자만 입력 가능합니다"),
-  /**요구수질 */
-  reqWaterQlty: z.string().optional(),
+  dmdInfoId: z.string().optional(),
+  dmndTmng: z.date().optional(),
+  dmndQty: z.number().min(1, "요구수량을 입력해주세요"),
+  wntUntprc: z.number().min(1, "희망단가를 입력해주세요"),
+  useUsgCd: z.string().min(1, "사용용도를 선택해주세요"),
+  /** 수질 */
   grssClfg: z.number().nullish(),
   tn: z.number().nullish(),
   combResdch: z.number().nullish(),
   tph: z.number().nullish(),
   trbt: z.number().nullish(),
   ph: z.string().nullish(),
-  bod: z.number().nullish(),
-  /**컬럼확인필요 */
+  blgcOxygDmndQnt: z.number().nullish(),
   clIonQnt: z.number().nullish(),
   smll: z.string(),
   cdtnv: z.number().nullish(),
   crmty: z.number().nullish(),
+
   rmrk: z.string().optional(),
-  /* telno: z.string()
-    .min(8, "전화번호는 8자 이상 입력해주세요")
-    .max(12, "전화번호는 12자 이내로 입력해주세요")
-    .regex(/^[0-9-]+$/, "전화번호는 숫자와 하이픈(-)만 입력 가능합니다"), */
-  candidateTitle: z
+
+  splyCndtList: z
     .array(
       z.object({
         ruseUtztnFcltNm: z.string(),
@@ -45,58 +38,6 @@ export const sdmInfoFormSchema = z.object({
       })
     )
     .optional(),
-}).superRefine((data, ctx) => {
-  const disabledFields = disableRules[data.usePurpose ?? ""] || [];
-  // 모든 수질 관련 필드
-  // 총대장균군수는 null 값을 불검출로 표시하기때문에 해당 검사에서 제외함.
-  const allFields: (keyof typeof data)[] = [
-    "tn", "combResdch", "tph",
-    "trbt", "ph", "bod", "clIonQnt",
-    "smll", "cdtnv", "crmty",
-  ];
-
-  const allFieldsName: Record<string, string> = {
-    tn: "총질소(T-N)(mg/L)",
-    combResdch: "결합잔류염소(mg/L)",
-    tph: "총인(T-P)(mg/L)",
-    trbt: "탁도(NTU)",
-    ph: "수소이온농도(pH)",
-    bod: "생물학적 산소요구량(BOD)(mg/L)",
-    clIonQnt: "염화물(mgCL/L)",
-    smll: "냄새",
-    cdtnv: "전기전도도(㎲/cm)",
-    crmty: "색도(도)",
-  };
-  allFields.forEach((field) => {
-    const isDisabled = disabledFields.includes(field);
-    if (!isDisabled) {
-      // disabled가 아닌 필드는 반드시 값이 있어야 함
-      const value = data[field];
-      if (typeof value === "string") {
-        if (value.trim().length === 0) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            path: [field],
-            message: `${allFieldsName[field]} 을 입력해주세요.`,
-          });
-        }
-      } else if (typeof value === "number") {
-        if (value <= 0 || Number.isNaN(value)) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            path: [field],
-            message: `${allFieldsName[field]} 을 입력해주세요.`,
-          });
-        }
-      } else if (value == null) {
-        ctx.addIssue({
-          code: z.ZodIssueCode.custom,
-          path: [field],
-          message: `${allFieldsName[field]}  을 입력해주세요.`,
-        });
-      }
-    }
-  });
 });
 
 export type SdmInfoFormData = z.infer<typeof sdmInfoFormSchema>;
@@ -109,6 +50,7 @@ export type DemandCompBizType = {
   dmdInfoFk: string | '';
   bzmnNo: string | '';
   dmdCoNm: string | '';
+  zip: string | '';
   daddr: string | '';
   telno: string | '';
   rgtr: string | '';
@@ -135,8 +77,9 @@ export type DemandCompBizType = {
   dmdInfoSn: number | '';
   status: string | '';
   splyCndtList: SupplyCandidate[] | [],
-  ruseUtztnFcltNm?: string | ''
-
+  ruseUtztnFcltNm?: string | '';
+  regDt: string | '';
+  mdfcnDt : string | '';
 }
 
 // 공급 후보자 타입 정의
@@ -393,7 +336,7 @@ const defaultRules: Record<string, object> = {
 
 // 사용용도
 const useTypesData: SelectDataType[] = [
-  { text: '청소', val: "청소" },
+/*   { text: '청소', val: "청소" },
   { text: "화장실용수", val: "화장실용수" },
   { text: "세척", val: "세척" },
   { text: "살수", val: "살수" },
@@ -401,7 +344,7 @@ const useTypesData: SelectDataType[] = [
   { text: "농업_간접용수", val: "농업_간접용수" },
   { text: "농업_직접용수", val: "농업_직접용수" },
   { text: "하천", val: "하천" },
-  { text: "공업", val: "공업" },
+  { text: "공업", val: "공업" }, */
 ];
 
 // 유사사례 모달 헤더
@@ -512,13 +455,28 @@ const postSdmData = async (data: DemandCompType) => {
 }
 
 // 수요정보 등록
-const postSdmInfoData = async (data: DemandCompBizType) => {
+const postSdmInfoData = async (data: SdmInfoFormData): Promise<boolean> => {
   try {
     await postFetch("/reuseFc/request/demandInfo", data);
-    toast.success('수요 정보 등록에 성공하였습니다.');
+    alert('수요 정보 등록에 성공하였습니다.');
+    return true;
   } catch (error) {
     console.log(error);
-    toast.error('수요 정보 등록에 실패하였습니다.');
+    alert('수요 정보 등록에 실패하였습니다.');
+    return false;
+  }
+}
+
+// 수요정보 수정
+const fetchUpdateSdmInfoData = async (data: SdmInfoFormData): Promise<boolean> => {
+  try {
+    await postFetch("/reuseFc/request/updateDemandInfo", data);
+    alert('수요 정보 수정에 성공하였습니다.');
+    return true;
+  } catch (error) {
+    console.log(error);
+    alert('수요 정보 수정에 실패하였습니다.');
+    return false;
   }
 }
 
@@ -532,6 +490,8 @@ const postSdmLoginData = async (data: DemandCompType) => {
     let loginSuccess = false;
     if (status === 200 && loginData != null) {
       alert("수요처 로그인에 성공하였습니다.");
+      delete loginData.dmdAplyPswd;
+      delete loginData.rgtr;
       sessionStorage.setItem("user", JSON.stringify(loginData));
       loginSuccess = true;
     } else if (status === 401) {
@@ -592,12 +552,15 @@ const fetchGetSimilarCaseList = async (part: string, value: number | string) =>
 export type SdmActions = {
   initializeSdmData: () => void;
   insertSdmData: (data: DemandCompType) => Promise<void>;
-  insertSdmInfoData: (data: DemandCompBizType) => Promise<void>;
+  insertSdmInfoData: (data: SdmInfoFormData) => Promise<boolean>;
+  updateSdmInfoData: (data: SdmInfoFormData) => Promise<boolean>;
   getDemandCompList: (searchText: string, pageCnt: number) => Promise<void>;
   actionLogin: (data: DemandCompType) => Promise<void>;
   getSdmInfoStatusList: (dmdInfoId: string) => Promise<void>;
   getSimilarCaseList: (part: string, value: number | string) => Promise<void>;
   actionLogout: () => Promise<void>;
+
+  getUseTypesData: () => Promise<void>;
 }
 
 export type SdmType = {
@@ -665,8 +628,12 @@ export const SdmReducer = (set: any): SdmActions => {
       }
     },
 
-    insertSdmInfoData: async (data: DemandCompBizType) => {
-      postSdmInfoData(data);
+    insertSdmInfoData: async (data: SdmInfoFormData): Promise<boolean> => {
+      return await postSdmInfoData(data);
+    },
+
+    updateSdmInfoData: async (data: SdmInfoFormData): Promise<boolean> => {
+      return await fetchUpdateSdmInfoData(data);
     },
 
     // 수요처 정보
@@ -717,6 +684,7 @@ export const SdmReducer = (set: any): SdmActions => {
           bzmnNo: res.bzmnNo,
           dmdCoNm: res.dmdCoNm,
           dmdInfoId: res.dmdInfoId,
+          zip: res.zip || '',
           daddr: res.daddr,
           telno: res.telno.replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3'),
           rgtr: res.rgtr,
@@ -762,7 +730,6 @@ export const SdmReducer = (set: any): SdmActions => {
           ruseBizNm: maskedBizNm,
         };
       });
-      console.log(similarCaseList);
 
       if (similarCaseList && similarCaseList.length !== 0) {
         set((state: SdmType) => ({
@@ -791,6 +758,24 @@ export const SdmReducer = (set: any): SdmActions => {
           successLogin: false,
         }
       }))
+    },
+
+    getUseTypesData: async () => {
+      //http://dev.onasys.co.kr:3000/server/cms-service/api/v1/lwpo-cds?lwpoCdNm=&sort=regDt,desc&upCd=WR018&page=0&size=10
+
+      const upCd = await getFetchWithCount(
+        fetchType.CS,
+        "/cms-service/api/v1/lwpo-cds/?lwpoCdNm=&sort=regDt,desc&upCd=WR018&page=0&size=100"
+      );
+
+      const comUseTypes = upCd.content.filter(el=>el.lwpoCdNm != '친수용수').map((el: any) => ({ text: el.lwpoCdNm, val: el.lwpoCd }));
+
+      set((state: SdmType) => ({
+        Sdm: {
+          ...state.Sdm,
+          useTypesData: comUseTypes,
+        }
+      }));
     }
   }
 }
diff --git a/apps/dm_new/app/store/sdmMng/postcode-service.ts b/apps/dm/app/store/sdmMng/postcode-service.ts
similarity index 100%
rename from apps/dm_new/app/store/sdmMng/postcode-service.ts
rename to apps/dm/app/store/sdmMng/postcode-service.ts
diff --git a/apps/dm/app/store/store.tsx b/apps/dm/app/store/store.tsx
index f885a3bd0..25508bae2 100644
--- a/apps/dm/app/store/store.tsx
+++ b/apps/dm/app/store/store.tsx
@@ -33,7 +33,7 @@ export const StoreZus = (
 ) => {
   return createStore<DmStore>()((set) => {
     if (typeof window !== "undefined") {
-      tokenManager.setToken("site-id-key", "DM");
+      tokenManager.setToken("site-id-key", process.env.NEXT_PUBLIC_SITE_ID||"DM");
       tokenManager.setToken("site-theme-key", "green");
     }
 
diff --git a/apps/dm/app/style/PublicReuseFaciltyInsert.module.css b/apps/dm/app/style/PublicReuseFaciltyInsert.module.css
deleted file mode 100644
index 6fc6f75ee..000000000
--- a/apps/dm/app/style/PublicReuseFaciltyInsert.module.css
+++ /dev/null
@@ -1,9 +0,0 @@
-.formInsideTitle{
-    background-color: gray;
-    text-align: center;
-}
-
-
-
-.smallTitle{
-}
\ No newline at end of file
diff --git a/apps/dm_new/components/CandidateSiteModal.tsx b/apps/dm/components/CandidateSiteModal.tsx
similarity index 100%
rename from apps/dm_new/components/CandidateSiteModal.tsx
rename to apps/dm/components/CandidateSiteModal.tsx
diff --git a/apps/dm_new/components/CaseImageSlider.tsx b/apps/dm/components/CaseImageSlider.tsx
similarity index 100%
rename from apps/dm_new/components/CaseImageSlider.tsx
rename to apps/dm/components/CaseImageSlider.tsx
diff --git a/apps/dm_new/components/CaseTabsCarousel.tsx b/apps/dm/components/CaseTabsCarousel.tsx
similarity index 100%
rename from apps/dm_new/components/CaseTabsCarousel.tsx
rename to apps/dm/components/CaseTabsCarousel.tsx
diff --git a/apps/dm_new/components/ImageSlider.tsx b/apps/dm/components/ImageSlider.tsx
similarity index 100%
rename from apps/dm_new/components/ImageSlider.tsx
rename to apps/dm/components/ImageSlider.tsx
diff --git a/apps/dm_new/components/Lnb.tsx b/apps/dm/components/Lnb.tsx
similarity index 100%
rename from apps/dm_new/components/Lnb.tsx
rename to apps/dm/components/Lnb.tsx
diff --git a/apps/dm_new/components/LoginModal.tsx b/apps/dm/components/LoginModal.tsx
similarity index 92%
rename from apps/dm_new/components/LoginModal.tsx
rename to apps/dm/components/LoginModal.tsx
index 60f46f7ad..21eb4dc65 100644
--- a/apps/dm_new/components/LoginModal.tsx
+++ b/apps/dm/components/LoginModal.tsx
@@ -4,7 +4,7 @@ import { useEffect, useId, useState } from "react";
 import { useRouter } from "next/navigation";
 import { useDmStore } from "@/app/store";
 import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
-import { sha512 } from 'js-sha512';
+import { sha512 } from "js-sha512";
 
 type LoginModalProps = {
   open: boolean;
@@ -21,13 +21,19 @@ function isBizNoValid(v: string) {
 }
 
 function inputCls(opts: { hasError?: boolean; disabled?: boolean }) {
-  const base = "h-[48px] w-full rounded-[4px] border px-5 text-[18px] outline-none";
+  const base =
+    "h-[48px] w-full rounded-[4px] border px-5 text-[18px] outline-none";
   if (opts.disabled) return `${base} border-gray-200 bg-gray-50 text-gray-400`;
-  if (opts.hasError) return `${base} border-red-500 ring-1 ring-red-400 focus:border-red-500`;
+  if (opts.hasError)
+    return `${base} border-red-500 ring-1 ring-red-400 focus:border-red-500`;
   return `${base} border-gray-300 focus:border-sky-400`;
 }
 
-export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps) {
+export default function LoginModal({
+  open,
+  onClose,
+  onSuccess,
+}: LoginModalProps) {
   const titleId = useId();
   const router = useRouter();
   const { actionLogin } = useDmStore((state) => state);
@@ -39,7 +45,9 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
 
   // ✅ 유효성/서버 에러 표시용
   const [errors, setErrors] = useState<Partial<Record<FieldKey, string>>>({});
-  const [touched, setTouched] = useState<Partial<Record<FieldKey, boolean>>>({});
+  const [touched, setTouched] = useState<Partial<Record<FieldKey, boolean>>>(
+    {},
+  );
   const [submitting, setSubmitting] = useState(false);
 
   useEffect(() => {
@@ -64,7 +72,8 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
   }, [open, onClose]);
 
   useEffect(() => {
-    if (noWorker) { // 종사업자번호 해당없음
+    if (noWorker) {
+      // 종사업자번호 해당없음
       setWorkerNo(""); // 종사업자번호
       setErrors((p) => {
         const nextErrors = { ...p };
@@ -122,7 +131,7 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
   const markAllTouched = () =>
     setTouched({ bizNo: true, workerNo: true, pw: true });
 
-  const submit = async (e: React.FormEvent) => {
+  const submit = async (e: React.SubmitEvent) => {
     e.preventDefault();
     markAllTouched();
 
@@ -150,8 +159,10 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
   };
 
   const initPassword = () => {
-    alert("관리자(031-0000-0000)에게 비밀번호 초기화 요청을 유선으로 하시기 바랍니다.");
-  }
+    alert(
+      "관리자(031-0000-0000)에게 비밀번호 초기화 요청을 유선으로 하시기 바랍니다.",
+    );
+  };
 
   return (
     <div className="fixed inset-0 z-[100]">
@@ -212,7 +223,9 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
                     validate();
                   }}
                   placeholder="사업자등록번호를 입력하세요. (예: 123-45-67890)"
-                  className={inputCls({ hasError: !!(touched.bizNo && errors.bizNo) })}
+                  className={inputCls({
+                    hasError: !!(touched.bizNo && errors.bizNo),
+                  })}
                 />
                 {touched.bizNo && errors.bizNo && (
                   <p className="mt-3 text-[14px] font-medium text-red-500">
@@ -253,7 +266,8 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
                   placeholder="종사자등록번호를 입력하세요."
                   className={inputCls({
                     disabled: noWorker,
-                    hasError: !noWorker && !!(touched.workerNo && errors.workerNo),
+                    hasError:
+                      !noWorker && !!(touched.workerNo && errors.workerNo),
                   })}
                 />
 
@@ -281,7 +295,9 @@ export default function LoginModal({ open, onClose, onSuccess }: LoginModalProps
                     validate();
                   }}
                   placeholder="비밀번호를 입력하세요."
-                  className={inputCls({ hasError: !!(touched.pw && errors.pw) })}
+                  className={inputCls({
+                    hasError: !!(touched.pw && errors.pw),
+                  })}
                 />
                 {touched.pw && errors.pw && (
                   <p className="mt-3 text-[14px] font-medium text-red-500">
diff --git a/apps/dm_new/components/LoginStatus.tsx b/apps/dm/components/LoginStatus.tsx
similarity index 100%
rename from apps/dm_new/components/LoginStatus.tsx
rename to apps/dm/components/LoginStatus.tsx
diff --git a/apps/dm_new/components/PostcodeModal.tsx b/apps/dm/components/PostcodeModal.tsx
similarity index 100%
rename from apps/dm_new/components/PostcodeModal.tsx
rename to apps/dm/components/PostcodeModal.tsx
diff --git a/apps/dm_new/components/SubPageHeader.tsx b/apps/dm/components/SubPageHeader.tsx
similarity index 100%
rename from apps/dm_new/components/SubPageHeader.tsx
rename to apps/dm/components/SubPageHeader.tsx
diff --git a/apps/dm_new/components/TopNav.tsx b/apps/dm/components/TopNav.tsx
similarity index 100%
rename from apps/dm_new/components/TopNav.tsx
rename to apps/dm/components/TopNav.tsx
diff --git a/apps/dm/components/toastFromUi.tsx b/apps/dm/components/toastFromUi.tsx
deleted file mode 100644
index 24b0b985f..000000000
--- a/apps/dm/components/toastFromUi.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-
-import { Button } from "@common/components/ui";
-import Link from "next/link";
-import toast from "react-hot-toast";
-
-export function ToastFormUi(body:string,title:string,url:string,buttonName:string){
-
-  //const router = useRouter();
-
-    return(
-
-      toast.custom((t) => (
-      
-        <div
-          className={`${
-            t.visible ? 'animate-enter' : 'animate-leave'
-          }  w-4/12 h-40 bg-white shadow-lg rounded-lg pointer-events-auto flex ring-1 ring-black ring-opacity-5`}
-        >
-          <div className="w-full flex-1 py-10">
-            <div className="flex items-start">
-              <div className="flex-shrink-0 pt-0.5">
-          
-              </div>
-              <div className="ml-3  flex-1">
-                <p className="text-xl font-medium  underline">
-                {title}
-                </p>
-                <p className="mt-1 text-2xl">
-                  {body}
-                </p>
-              </div>
-            </div>
-          </div>
-          <div className="flex py-20">
-            <Button
-              size='sm'
-              onClick={() => toast.dismiss(t.id)}
-            >
-              <Link href={url}> {buttonName}</Link>
-            </Button>
-          </div>
-          <div className="flex  pl-4 pr-4 py-20">
-            <Button
-              onClick={() => toast.dismiss(t.id)}
-              size='sm'
-            >
-              닫기
-            </Button>
-          </div>
-        </div>
-      ))
-    )
-}
\ No newline at end of file
diff --git a/apps/dm/components/ui/api/index.ts b/apps/dm/components/ui/api/index.ts
index abb0c2c73..49d244d25 100644
--- a/apps/dm/components/ui/api/index.ts
+++ b/apps/dm/components/ui/api/index.ts
@@ -1,6 +1,7 @@
 //8880
 import { AUTH_USER_ID, CLAIM_NAME } from "@/src/shared/config";
 import { getCookie } from "@common/components/lib/cookie";
+import { DEV_URL_FO, DEV_URL_WR, LOCAL_URL } from "../config/";
 
 
 const tokenId = getCookie(AUTH_USER_ID);
@@ -10,7 +11,9 @@ export const fetchType = {
   COMMON: "common",
   WR: "wr",
   FO: "fo",
-  SN: "sn"
+  SN: "sn",
+  LOCAL: "LOCAL",
+  CS: "CS",
 };
 
 const API_VERSION = "/api/v1"
@@ -44,6 +47,55 @@ export const getFetch = async (type: string, url: string) => {
   return res;
 };
 
+export const getFetchWithCount = async (type: string, url: string) => {
+  const div =
+    type === fetchType.COMMON
+      ? DEV_URL_FO
+      : type === fetchType.LOCAL
+        ? LOCAL_URL
+        : type === fetchType.CS
+          ? ""
+          : DEV_URL_WR;
+  const apiUrl = div + url;
+
+  const response = await fetch(apiUrl, {
+    method: "GET",
+    headers: {
+      accept: "application/json",
+    },
+  });
+
+  if (!response.ok) {
+    console.log(`오류 발생: ${response.status}`);
+  }
+
+  const contentType = response.headers.get("content-type") ?? "";
+
+  if (contentType.includes("application/json")) {
+    // JSON 응답 처리
+    const res = await response.json();
+
+    return res;
+  } else if(contentType.includes('application/octet-stream')) {
+    // 파일 응답 처리 (ex. PDF, Excel 등)
+
+    console.log('contentType ' ,contentType)
+    const blob = await response.blob();
+    const blobUrl = window.URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    const filename = "downloaded_file.PDF";
+
+    a.href = blobUrl;
+    a.download = filename;
+    a.click();
+    window.URL.revokeObjectURL(blobUrl);
+
+    return null; // 다운로드이므로 반환값 없음
+  }else{
+    throw Error('오류 발생')
+  } 
+};
+
 export const postFetch = async (url: string, params: RequestParams) => {
   const baseUrl = servers[fetchType.WR];
   const response = await fetch(baseUrl + url, {
diff --git a/apps/dm/components/ui/config/index.ts b/apps/dm/components/ui/config/index.ts
index 1585bb767..8dc7bdb50 100644
--- a/apps/dm/components/ui/config/index.ts
+++ b/apps/dm/components/ui/config/index.ts
@@ -1,6 +1,6 @@
 import { PROXY_HOST } from "@/src/shared/config/env";
 
 export const LOCAL_URL = PROXY_HOST;
-export const DEV_URL_FO = "/operation-service";
-export const DEV_URL_WR = "/reuse-service";
-export const DEV_URL_SN = "/sewerage-service";
+export const DEV_URL_FO = "/operation-service/api/v1";
+export const DEV_URL_WR = "/reuse-service/api/v1";
+export const DEV_URL_SN = "/sewerage-service/api/v1";
diff --git a/apps/dm/components/ui/map/SearchInputText/SearchInputText.tsx b/apps/dm/components/ui/map/SearchInputText/SearchInputText.tsx
index 05f41d09b..b37fdb788 100644
--- a/apps/dm/components/ui/map/SearchInputText/SearchInputText.tsx
+++ b/apps/dm/components/ui/map/SearchInputText/SearchInputText.tsx
@@ -94,7 +94,7 @@ export default function SearchInputText({
         value={textValue || ""}
         onChange={handleInputChange}
         onKeyDown={handleKeyDown}
-        className="w-full h-[3.2rem] !text-xl pl-3 text-gray-600 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
+        className="w-full h-8 text-xs pl-2 pr-2 text-gray-600 border border-gray-300 rounded focus:outline-none focus:ring-1 focus:ring-blue-500"
         placeholder={`${label}을(를) 입력하세요`}
         onClick={() => {
           setTextValue("");
@@ -109,10 +109,10 @@ export default function SearchInputText({
               searchList.map((item, index) => (
                 <div
                   key={index}
-                  className={`w-full cursor-pointer overflow-auto px-5 py-3 text-left !text-xl ${
+                  className={`w-full cursor-pointer px-3 py-2 text-left text-xs ${
                     highlightIndex === index
-                      ? "bg-blue-100"
-                      : "hover:bg-gray-100"
+                      ? "bg-blue-50"
+                      : "hover:bg-gray-50"
                   }`}
                   onClick={() => handleSuggestionClick(item.bscFctNm)}
                   role="button"
@@ -127,7 +127,7 @@ export default function SearchInputText({
                 </div>
               ))
             ) : (
-              <div className="!text-xl w-full px-5 py-3 hover:bg-gray-100 cursor-pointer overflow-auto">
+              <div className="text-xs w-full px-3 py-2 hover:bg-gray-50 cursor-pointer text-gray-500">
                 검색 결과가 없습니다.
               </div>
             )}
diff --git a/apps/dm/components/ui/map/searchBar/searchBar.tsx b/apps/dm/components/ui/map/searchBar/searchBar.tsx
index 7ca64bbce..c52b85b0a 100644
--- a/apps/dm/components/ui/map/searchBar/searchBar.tsx
+++ b/apps/dm/components/ui/map/searchBar/searchBar.tsx
@@ -62,50 +62,51 @@ export function SearchBar({
   );
 
   return (
-    <div className="flex justify-center w-full px-4 py-3">
-      <div className="flex items-center w-full max-w-screen-lg rounded-xl bg-white shadow-md px-6 py-4 space-x-3">
+    <div className="flex justify-center w-full px-4 py-2">
+      <div className="flex items-center w-auto shadow-md px-4 py-2 space-x-2 bg-white/95 backdrop-blur-sm rounded-lg text-sm border border-gray-200">
         <SelectBox
-          labelClass="w-[40px]"
-          className="w-[200px]"
+          labelClass="w-[50px] text-xs font-medium text-gray-700"
+          className="w-[110px]"
           label="시도"
-          selectClass="rounded-lg bg-white"
+          selectClass="rounded bg-white text-xs h-8"
           selectArray={Common.selectSidoData || []}
           onSelectValue={(val) => onSelectValue(val.toString(), "ctpvCd")}
           value={sidoValue || Common.selectSidoData[0]?.val || ""}
         />
         <SelectBox
-          labelClass="w-[65px]"
-          className="w-[200px]"
+          labelClass="w-[70px] text-xs font-medium text-gray-700"
+          className="w-[110px]"
           label="시군구"
-          selectClass="rounded-lg bg-white"
+          selectClass="rounded bg-white text-xs h-8"
           selectArray={filteredSigunData || []}
           onSelectValue={(val) => onSelectValue(val.toString(), "sggCd")}
           value={sigunValue}
         />
-        <Label className="text-gray-600">하수재이용시설</Label>
-        <SearchInputText
-          label="시설명"
-          initValue={undefined}
-          setValue={(searchNm?: string) => {
-            let sggOrCity = "";
-            if (searchNm) {
-              if (sigunValue === "0" || sigunValue === "") {
-                sggOrCity = sidoValue;
-              } else {
-                sggOrCity = sigunValue;
+        <Label className="text-gray-700 text-xs font-medium pl-2 pr-1">하수재이용시설</Label>
+        <div className="w-[180px]">
+          <SearchInputText
+            label="시설명 입력"
+            initValue={undefined}
+            setValue={(searchNm?: string) => {
+              let sggOrCity = "";
+              if (searchNm) {
+                if (sigunValue === "0" || sigunValue === "") {
+                  sggOrCity = sidoValue;
+                } else {
+                  sggOrCity = sigunValue;
+                }
+                findRuseFclt(sggOrCity, searchNm);
               }
-              findRuseFclt(sggOrCity, searchNm);
-            }
-          }}
-          setRtnData={(rtnData: any) => {
-            setHasuPk(rtnData);
-          }}
-          searchList={map.ruseFcltList || []}
-        />
+            }}
+            setRtnData={(rtnData: any) => {
+              setHasuPk(rtnData);
+            }}
+            searchList={map.ruseFcltList || []}
+          />
+        </div>
         <Button
           color="sky"
-          className="ml-2 text-white"
-          size="sm"
+          className="ml-2 text-white !h-8 !py-0 !px-3 !text-xs font-semibold rounded"
           onClick={() => {
             onApply();
           }}
diff --git a/apps/dm/components/ui/sdmInfoInsertForm/component.tsx b/apps/dm/components/ui/sdmInfoInsertForm/component.tsx
index 62b214f04..44c6d3f82 100644
--- a/apps/dm/components/ui/sdmInfoInsertForm/component.tsx
+++ b/apps/dm/components/ui/sdmInfoInsertForm/component.tsx
@@ -1,962 +1,962 @@
-import ModalSimilarPage from "@/app/(base-layout)/pages/sdmMng/sdmInfoInsert/modalSimilar/page";
-import { useDmStore } from "@/app/store";
-import {
-  CANDIDATE,
- // DatePicker,
-  FormField,
-  FormLabel,
-  FormUi,
-  SelectBox,
-  UiModal,
-} from "@common/business_components";
-import { Input } from "@common/components";
-import { Button, Label } from "@common/components/ui";
-import { useSearchParams } from "next/navigation";
-import { useCallback, useEffect, useState } from "react";
-import { AccessibleFormField } from "./AccessibleFormField";
-import {
-  type ControllerRenderProps,
-  type UseFormReturn,
-  type FieldError,
-  useWatch,
-} from "react-hook-form";
-import SearchInputText from "../common/searhDemandInput/component";
-import React from "react";
-import { formatDateToYMD, sanitizeInput } from "../common/utils/utils";
-import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
-import type { SdmInfoFormData } from "@/app/store/sdmMng";
+// import ModalSimilarPage from "@/app/(base-layout)/pages/sdmMng/sdmInfoInsert/modalSimilar/page";
+// import { useDmStore } from "@/app/store";
+// import {
+//   CANDIDATE,
+//  // DatePicker,
+//   FormField,
+//   FormLabel,
+//   FormUi,
+//   SelectBox,
+//   UiModal,
+// } from "@common/business_components";
+// import { Input } from "@common/components";
+// import { Button, Label } from "@common/components/ui";
+// import { useSearchParams } from "next/navigation";
+// import { useCallback, useEffect, useState } from "react";
+// import { AccessibleFormField } from "./AccessibleFormField";
+// import {
+//   type ControllerRenderProps,
+//   type UseFormReturn,
+//   type FieldError,
+//   useWatch,
+// } from "react-hook-form";
+// import SearchInputText from "../common/searhDemandInput/component";
+// import React from "react";
+// import { formatDateToYMD, sanitizeInput } from "../common/utils/utils";
+// import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
+// import type { SdmInfoFormData } from "@/app/store/sdmMng";
 
-export interface SdmInfoRegFormProps {
-  form: UseFormReturn<SdmInfoFormData>;
-  onCheckboxChange?: (checked: boolean) => void;
-  facilityName?: string;
-}
+// export interface SdmInfoRegFormProps {
+//   form: UseFormReturn<SdmInfoFormData>;
+//   onCheckboxChange?: (checked: boolean) => void;
+//   facilityName?: string;
+// }
 
-type FieldComponent = (
-  field: ControllerRenderProps<SdmInfoFormData, keyof SdmInfoFormData>
-) => React.ReactElement<{ disabled?: boolean }>;
+// type FieldComponent = (
+//   field: ControllerRenderProps<SdmInfoFormData, keyof SdmInfoFormData>
+// ) => React.ReactElement<{ disabled?: boolean }>;
 
-export function SdmInfoRegForm({
-  form,
-  onCheckboxChange,
-  facilityName,
-}: SdmInfoRegFormProps) {
-  const { initializeCommonData, Sdm } = useDmStore((state) => state);
-  const { useTypesData, defaultRules, disableRules } = Sdm;
-  const searchParams = useSearchParams();
+// export function SdmInfoRegForm({
+//   form,
+//   onCheckboxChange,
+//   facilityName,
+// }: SdmInfoRegFormProps) {
+//   const { initializeCommonData, Sdm } = useDmStore((state) => state);
+//   const { useTypesData, defaultRules, disableRules } = Sdm;
+//   const searchParams = useSearchParams();
 
-  const [sdmNmValue, setSdmNmValue] = useState<string>(
-    searchParams.get("dmdCoNm") || ""
-  );
+//   const [sdmNmValue, setSdmNmValue] = useState<string>(
+//     searchParams.get("dmdCoNm") || ""
+//   );
 
-  const [frontPHdata, setFrontPHdata] = useState("0");
-  const [backPHdata, setBackPHdata] = useState("0");
-  const [isBznmTotNoDisabled, setIsBznmTotNoDisabled] = useState(false);
-  const [isSimilarCase, setIsSimilarCase] = useState(false);
-  const [key, setKey] = useState(0);
-  // 후보지 팝업 오픈 상태
+//   const [frontPHdata, setFrontPHdata] = useState("0");
+//   const [backPHdata, setBackPHdata] = useState("0");
+//   const [isBznmTotNoDisabled, setIsBznmTotNoDisabled] = useState(false);
+//   const [isSimilarCase, setIsSimilarCase] = useState(false);
+//   const [key, setKey] = useState(0);
+//   // 후보지 팝업 오픈 상태
 
-  //모달 조회에 필요한 데이터
-  const [sply, setSply] = useState<number>(0);
-  const [usageCd, setUsageCd] = useState<string>("청소");
-  const [money, setMoney] = useState<number>(0);
+//   //모달 조회에 필요한 데이터
+//   const [sply, setSply] = useState<number>(0);
+//   const [usageCd, setUsageCd] = useState<string>("청소");
+//   const [money, setMoney] = useState<number>(0);
 
-  useEffect(() => {
-    initializeCommonData();
-  }, [initializeCommonData]);
+//   useEffect(() => {
+//     initializeCommonData();
+//   }, [initializeCommonData]);
 
-  useEffect(() => {
-    console.log("candidateTitle ", form.getValues("candidateTitle"));
-  }, [form.getValues]);
+//   useEffect(() => {
+//     console.log("candidateTitle ", form.getValues("candidateTitle"));
+//   }, [form.getValues]);
 
-  useEffect(() => {
-    if (useTypesData && useTypesData.length > 0) {
-      setTimeout(() => {
-        form.setValue("usePurpose", useTypesData[0]?.val?.toString() || "");
-      }, 500);
-    }
-  }, [useTypesData, form.setValue, form]);
+//   useEffect(() => {
+//     if (useTypesData && useTypesData.length > 0) {
+//       setTimeout(() => {
+//         form.setValue("usePurpose", useTypesData[0]?.val?.toString() || "");
+//       }, 500);
+//     }
+//   }, [useTypesData, form.setValue, form]);
 
-  useEffect(() => {
-    if (facilityName) {
-      setSdmNmValue(facilityName);
-      form.setValue("sdmNm", facilityName);
-      setKey((prev) => prev + 1);
-    }
-  }, [facilityName, form.setValue, form]);
+//   useEffect(() => {
+//     if (facilityName) {
+//       setSdmNmValue(facilityName);
+//       form.setValue("sdmNm", facilityName);
+//       setKey((prev) => prev + 1);
+//     }
+//   }, [facilityName, form.setValue, form]);
 
-  useEffect(() => {
-    if (searchParams.get("dmdCoNm")) {
-      form.setValue("sdmNm", searchParams.get("dmdCoNm") || "");
-      setSdmNmValue(searchParams.get("dmdCoNm") || "");
-      setKey((prev) => prev + 1);
-    }
-  }, [searchParams, form.setValue, form]);
+//   useEffect(() => {
+//     if (searchParams.get("dmdCoNm")) {
+//       form.setValue("sdmNm", searchParams.get("dmdCoNm") || "");
+//       setSdmNmValue(searchParams.get("dmdCoNm") || "");
+//       setKey((prev) => prev + 1);
+//     }
+//   }, [searchParams, form.setValue, form]);
 
-  const searchCandidate = (e: React.MouseEvent) => {
-    e.preventDefault();
-    e.stopPropagation();
-    const dmdInfoId = JSON.parse(
-      sessionStorage.getItem("user") || "{}"
-    )?.dmdInfoId?.toString();
+//   const searchCandidate = (e: React.MouseEvent) => {
+//     e.preventDefault();
+//     e.stopPropagation();
+//     const dmdInfoId = JSON.parse(
+//       sessionStorage.getItem("user") || "{}"
+//     )?.dmdInfoId?.toString();
 
-    const url = `/map/popup?dmdInfoId=${encodeURIComponent(dmdInfoId)}`;
-    const width = window.screen.availWidth;
-    const height = window.screen.availHeight;
-    const left = 0;
-    const top = 0;
-    const popupOptions = `width=${width},height=${height},left=${left},top=${top},resizable=yes,scrollbars=yes`;
-    window.open(url, "candidatePopup", popupOptions);
-  };
+//     const url = `/map/popup?dmdInfoId=${encodeURIComponent(dmdInfoId)}`;
+//     const width = window.screen.availWidth;
+//     const height = window.screen.availHeight;
+//     const left = 0;
+//     const top = 0;
+//     const popupOptions = `width=${width},height=${height},left=${left},top=${top},resizable=yes,scrollbars=yes`;
+//     window.open(url, "candidatePopup", popupOptions);
+//   };
 
-  const searchSimilarCase = (e: React.MouseEvent) => {
-    e.preventDefault();
-    e.stopPropagation();
-    setIsSimilarCase(true);
-  };
+//   const searchSimilarCase = (e: React.MouseEvent) => {
+//     e.preventDefault();
+//     e.stopPropagation();
+//     setIsSimilarCase(true);
+//   };
 
-  const handleCheckboxChange = (checked: boolean) => {
-    setIsBznmTotNoDisabled(checked);
-    onCheckboxChange?.(checked);
-  };
+//   const handleCheckboxChange = (checked: boolean) => {
+//     setIsBznmTotNoDisabled(checked);
+//     onCheckboxChange?.(checked);
+//   };
 
-  useEffect(() => {
-    const watchPH = form.getValues(`ph`);
-    if (watchPH && watchPH !== undefined) {
-      const [frontPH, backPH] = watchPH.split("~");
-      if (frontPH) {
-        setFrontPHdata(frontPH);
-      }
-      if (backPH) {
-        setBackPHdata(backPH);
-      }
-    } else {
-      setFrontPHdata("0");
-      setBackPHdata("0");
-    }
-  }, [form.getValues(`ph`)]);
+//   useEffect(() => {
+//     const watchPH = form.getValues(`ph`);
+//     if (watchPH && watchPH !== undefined) {
+//       const [frontPH, backPH] = watchPH.split("~");
+//       if (frontPH) {
+//         setFrontPHdata(frontPH);
+//       }
+//       if (backPH) {
+//         setBackPHdata(backPH);
+//       }
+//     } else {
+//       setFrontPHdata("0");
+//       setBackPHdata("0");
+//     }
+//   }, [form.getValues(`ph`)]);
 
-  const isSetPh = useCallback(
-    (typePHdata: string, index: number) => {
-      const PHdata = form.getValues("ph");
-      const isPH = PHdata?.split("~")[index] || "";
-      if (index == 0) {
-        form.setValue("ph", `${isPH}~${typePHdata}`);
-        setBackPHdata(typePHdata);
-      } else if (index == 1) {
-        form.setValue("ph", `${typePHdata}~${isPH}`);
-        setFrontPHdata(typePHdata);
-      }
-    },
-    [form]
-  );
+//   const isSetPh = useCallback(
+//     (typePHdata: string, index: number) => {
+//       const PHdata = form.getValues("ph");
+//       const isPH = PHdata?.split("~")[index] || "";
+//       if (index == 0) {
+//         form.setValue("ph", `${isPH}~${typePHdata}`);
+//         setBackPHdata(typePHdata);
+//       } else if (index == 1) {
+//         form.setValue("ph", `${typePHdata}~${isPH}`);
+//         setFrontPHdata(typePHdata);
+//       }
+//     },
+//     [form]
+//   );
 
-  const usePurpose = useWatch({ control: form.control, name: "usePurpose" });
+//   const usePurpose = useWatch({ control: form.control, name: "usePurpose" });
 
-  useEffect(() => {
-    if (!usePurpose) return;
+//   useEffect(() => {
+//     if (!usePurpose) return;
 
-    // Apply default values
-    const defaults = defaultRules[usePurpose];
+//     // Apply default values
+//     const defaults = defaultRules[usePurpose];
 
-    if (defaults) {
-      Object.entries(defaults).forEach(([field, value]) => {
-        form.setValue(field as keyof SdmInfoFormData, value, {
-          shouldDirty: true,
-        });
-      });
-    }
-  }, [form.getValues("usePurpose")]);
+//     if (defaults) {
+//       Object.entries(defaults).forEach(([field, value]) => {
+//         form.setValue(field as keyof SdmInfoFormData, value, {
+//           shouldDirty: true,
+//         });
+//       });
+//     }
+//   }, [form.getValues("usePurpose")]);
 
-  // 시설 선택시 이벤트
-  const selectComp = useCallback(
-    (rtnData: DemandCompType[]) => {
-      const rtnCompData = rtnData?.[0];
-      form.setValue("sdmNm", rtnCompData?.dmdCoNm || "");
-    },
-    [form]
-  );
+//   // 시설 선택시 이벤트
+//   const selectComp = useCallback(
+//     (rtnData: DemandCompType[]) => {
+//       const rtnCompData = rtnData?.[0];
+//       form.setValue("sdmNm", rtnCompData?.dmdCoNm || "");
+//     },
+//     [form]
+//   );
 
-  const formFields: Array<{
-    name: keyof SdmInfoFormData;
-    label: string;
-    component: FieldComponent | undefined;
-    formIndex: number;
-    required?: boolean;
-  }> = [
-    {
-      name: "sdmNm",
-      label: "수요처선택",
-      formIndex: 0,
-      required: true,
-      component: (field) => (
-        <div key={key}>
-          <SearchInputText
-            label="수요처명"
-            setValue={(val) => {
-              setSdmNmValue(val || "");
-              field.onChange(val || "");
-            }}
-            setRtnData={selectComp}
-            initValue={facilityName || sdmNmValue}
-            {...field}
-          />
-        </div>
-      ),
-    },
-    {
-      name: "demandYmd",
-      label: "요구시기",
-      formIndex: 0,
-      required: true,
-      component: (field) => (
-        <div className="relative w-64">
-          {/* <DatePicker
-            mode="single"
-            selected={field.value as Date}
-            onSelect={(date) => {
-              field.onChange(date as Date);
-            }}
-            className=""
-            //defaultMonth={field.value as Date}
-            field={{
-              value: field.value as Date,
-              onChange: (date: Date | undefined) => {
-                field.onChange(date as Date);
-              },
-            }}
-            showOutsideDays={true}
-            selectClass={undefined}
-          /> */}
-            {/* 네이티브 input */}
-            <Input
-              className="w-full !text-xl text-right"
-              type="date"
-              onChange= {(e) => {
-                const selectedDate = e.target.value ? new Date(e.target.value) : null;
-                field.onChange(selectedDate);
-              }}
-              value={ formatDateToYMD(field.value as Date) }
-            />
-        </div>
-      ),
-    },
-    {
-      name: "demandQnty",
-      label: "요구수량(㎥/d)",
-      formIndex: 0,
-      required: true,
-      component: (field) => (
-        <Input
-          type="text"
-          className="!text-xl text-gray-600"
-          value={field.value as string}
-          onChange={(e) => {
-            field.onChange(e);
-            setSply(Number(e.target.value));
-          }}
-          onBlur={field.onBlur}
-          name={field.name}
-          ref={field.ref}
-        />
-      ),
-    },
-    {
-      name: "usePurpose",
-      label: "사용용도",
-      formIndex: 0,
-      required: true,
-      component: (field) => (
-        <SelectBox
-          selectClass={undefined}
-          label=""
-          selectArray={useTypesData}
-          onSelectValue={(val) => {
-            field.onChange(val.toString());
-            setUsageCd(val.toString());
-          }}
-          className=""
-          value={field.value as string}
-        />
-      ),
-    },
-    {
-      name: "money",
-      label: "희망단가(원)",
-      formIndex: 0,
-      required: true,
-      component: (field) => (
-        <FormUi
-          onCheckboxChange={handleCheckboxChange}
-          isDisabled={isBznmTotNoDisabled}
-        >
-          <Input
-            type="text"
-            className="!text-xl text-gray-600"
-            value={field.value as string}
-            onChange={(e) => {
-              field.onChange(e);
-              setMoney(Number(e.target.value));
-            }}
-            onBlur={field.onBlur}
-            name={field.name}
-            ref={field.ref}
-          />
-        </FormUi>
-      ),
-    },
-    {
-      name: "reqWaterQlty",
-      label: "요구수질",
-      formIndex: 0,
-      required: true,
-      component: undefined,
-    },
+//   const formFields: Array<{
+//     name: keyof SdmInfoFormData;
+//     label: string;
+//     component: FieldComponent | undefined;
+//     formIndex: number;
+//     required?: boolean;
+//   }> = [
+//     {
+//       name: "sdmNm",
+//       label: "수요처선택",
+//       formIndex: 0,
+//       required: true,
+//       component: (field) => (
+//         <div key={key}>
+//           <SearchInputText
+//             label="수요처명"
+//             setValue={(val) => {
+//               setSdmNmValue(val || "");
+//               field.onChange(val || "");
+//             }}
+//             setRtnData={selectComp}
+//             initValue={facilityName || sdmNmValue}
+//             {...field}
+//           />
+//         </div>
+//       ),
+//     },
+//     {
+//       name: "demandYmd",
+//       label: "요구시기",
+//       formIndex: 0,
+//       required: true,
+//       component: (field) => (
+//         <div className="relative w-64">
+//           {/* <DatePicker
+//             mode="single"
+//             selected={field.value as Date}
+//             onSelect={(date) => {
+//               field.onChange(date as Date);
+//             }}
+//             className=""
+//             //defaultMonth={field.value as Date}
+//             field={{
+//               value: field.value as Date,
+//               onChange: (date: Date | undefined) => {
+//                 field.onChange(date as Date);
+//               },
+//             }}
+//             showOutsideDays={true}
+//             selectClass={undefined}
+//           /> */}
+//             {/* 네이티브 input */}
+//             <Input
+//               className="w-full !text-xl text-right"
+//               type="date"
+//               onChange= {(e) => {
+//                 const selectedDate = e.target.value ? new Date(e.target.value) : null;
+//                 field.onChange(selectedDate);
+//               }}
+//               value={ formatDateToYMD(field.value as Date) }
+//             />
+//         </div>
+//       ),
+//     },
+//     {
+//       name: "demandQnty",
+//       label: "요구수량(㎥/d)",
+//       formIndex: 0,
+//       required: true,
+//       component: (field) => (
+//         <Input
+//           type="text"
+//           className="!text-xl text-gray-600"
+//           value={field.value as string}
+//           onChange={(e) => {
+//             field.onChange(e);
+//             setSply(Number(e.target.value));
+//           }}
+//           onBlur={field.onBlur}
+//           name={field.name}
+//           ref={field.ref}
+//         />
+//       ),
+//     },
+//     {
+//       name: "usePurpose",
+//       label: "사용용도",
+//       formIndex: 0,
+//       required: true,
+//       component: (field) => (
+//         <SelectBox
+//           selectClass={undefined}
+//           label=""
+//           selectArray={useTypesData}
+//           onSelectValue={(val) => {
+//             field.onChange(val.toString());
+//             setUsageCd(val.toString());
+//           }}
+//           className=""
+//           value={field.value as string}
+//         />
+//       ),
+//     },
+//     {
+//       name: "money",
+//       label: "희망단가(원)",
+//       formIndex: 0,
+//       required: true,
+//       component: (field) => (
+//         <FormUi
+//           onCheckboxChange={handleCheckboxChange}
+//           isDisabled={isBznmTotNoDisabled}
+//         >
+//           <Input
+//             type="text"
+//             className="!text-xl text-gray-600"
+//             value={field.value as string}
+//             onChange={(e) => {
+//               field.onChange(e);
+//               setMoney(Number(e.target.value));
+//             }}
+//             onBlur={field.onBlur}
+//             name={field.name}
+//             ref={field.ref}
+//           />
+//         </FormUi>
+//       ),
+//     },
+//     {
+//       name: "reqWaterQlty",
+//       label: "요구수질",
+//       formIndex: 0,
+//       required: true,
+//       component: undefined,
+//     },
 
-    {
-      name: "candidateTitle",
-      label: CANDIDATE || "공급처 후보지 선택(필수아님)",
-      formIndex: 2,
-      component: () => (
-        <div>
-          <div className="-mt-14 float-right flex gap-10">
-            <Button
-              className="rounded-md"
-              color="sky"
-              size={"sm"}
-              onClick={searchCandidate}
-            >
-              후보지 조회
-            </Button>
-            <Button
-              className="rounded-md"
-              color="sky"
-              size={"sm"}
-              onClick={searchSimilarCase}
-            >
-              유사사례
-            </Button>
-          </div>
-          <div className="flex justify-center gap-10 mt-5">
-            {(form.getValues("candidateTitle") || []).map(
-              (candidate: any, index: number) => (
-                <Input
-                  key={index}
-                  placeholder={`후보지${index + 1}`}
-                  type="text"
-                  className="!text-xl w-[130px] text-gray-600"
-                  value={candidate.ruseUtztnFcltNm}
-                  readOnly
-                />
-              )
-            )}
-          </div>
-        </div>
-      ),
-    },
-  ];
+//     {
+//       name: "candidateTitle",
+//       label: CANDIDATE || "공급처 후보지 선택(필수아님)",
+//       formIndex: 2,
+//       component: () => (
+//         <div>
+//           <div className="-mt-14 float-right flex gap-10">
+//             <Button
+//               className="rounded-md"
+//               color="sky"
+//               size={"sm"}
+//               onClick={searchCandidate}
+//             >
+//               후보지 조회
+//             </Button>
+//             <Button
+//               className="rounded-md"
+//               color="sky"
+//               size={"sm"}
+//               onClick={searchSimilarCase}
+//             >
+//               유사사례
+//             </Button>
+//           </div>
+//           <div className="flex justify-center gap-10 mt-5">
+//             {(form.getValues("candidateTitle") || []).map(
+//               (candidate: any, index: number) => (
+//                 <Input
+//                   key={index}
+//                   placeholder={`후보지${index + 1}`}
+//                   type="text"
+//                   className="!text-xl w-[130px] text-gray-600"
+//                   value={candidate.ruseUtztnFcltNm}
+//                   readOnly
+//                 />
+//               )
+//             )}
+//           </div>
+//         </div>
+//       ),
+//     },
+//   ];
 
-  const normalFields = formFields.filter(
-    (f) => f.formIndex === 0 && f.component
-  );
+//   const normalFields = formFields.filter(
+//     (f) => f.formIndex === 0 && f.component
+//   );
 
-  const candidateFields = formFields.filter(
-    (f) => f.formIndex === 2 && f.component
-  );
+//   const candidateFields = formFields.filter(
+//     (f) => f.formIndex === 2 && f.component
+//   );
 
-  return (
-    <>
-      {normalFields.map(({ name, label, component, required }) =>
-        component ? (
-          <FormField
-            key={name}
-            control={form.control}
-            name={name}
-            render={({ field }) =>
-              name === "money" ? (
-                <div>
-                  <Label className="text-black">희망단가(원)*</Label>
-                  {component(field)}
-                </div>
-              ) : (
-                // <FormUi label={label + "*"}>{component(field)}</FormUi>
-                <AccessibleFormField
-                  field={field}
-                  label={label}
-                  required={required}
-                  error={
-                    typeof form.formState.errors[name]?.message === "string"
-                      ? (form.formState.errors[name] as FieldError)
-                      : undefined
-                  }
-                  inputComponent={component(field)}
-                />
-              )
-            }
-          />
-        ) : null
-      )}
+//   return (
+//     <>
+//       {normalFields.map(({ name, label, component, required }) =>
+//         component ? (
+//           <FormField
+//             key={name}
+//             control={form.control}
+//             name={name}
+//             render={({ field }) =>
+//               name === "money" ? (
+//                 <div>
+//                   <Label className="text-black">희망단가(원)*</Label>
+//                   {component(field)}
+//                 </div>
+//               ) : (
+//                 // <FormUi label={label + "*"}>{component(field)}</FormUi>
+//                 <AccessibleFormField
+//                   field={field}
+//                   label={label}
+//                   required={required}
+//                   error={
+//                     typeof form.formState.errors[name]?.message === "string"
+//                       ? (form.formState.errors[name] as FieldError)
+//                       : undefined
+//                   }
+//                   inputComponent={component(field)}
+//                 />
+//               )
+//             }
+//           />
+//         ) : null
+//       )}
 
-      <div className="mt-10">
-        <FormLabel className="text-xl">요구수질</FormLabel>
-        <div className="grid grid-cols-2 gap-x-10 gap-y-6 mt-3 mb-3">
-          <FormField
-            control={form.control}
-            name={`grssClfg`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={
-                    !isDisabled ? `총대장균군수(개/mg)*` : "총대장균군수(개/mg)"
-                  }
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : "불검출"
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      {/* TODO:  총대장균군수 확인 필요*/}
-                      {field.value !== null ? (
-                        <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                          이하
-                        </span>
-                      ) : (
-                        <></>
-                      )}
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`tn`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={
-                    !isDisabled ? `총질소(T-N)(mg/L)*` : "총질소(T-N)(mg/L)"
-                  }
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : ""
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`combResdch`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={
-                    !isDisabled ? `결합잔류염소(mg/L)*` : "결합잔류염소(mg/L)"
-                  }
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const cleanValue = sanitizeInput(
-                            e.target.value,
-                            true
-                          );
-                          field.onChange(
-                            cleanValue === "" ? null : Number(cleanValue)
-                          );
-                        }}
-                        value={field.value ?? ""}
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이상
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`tph`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={!isDisabled ? `총인(T-P)(mg/L)*` : "총인(T-P)(mg/L)"}
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const cleanValue = sanitizeInput(
-                            e.target.value,
-                            true
-                          );
-                          field.onChange(
-                            cleanValue === "" ? null : Number(cleanValue)
-                          );
-                        }}
-                        value={field.value ?? ""}
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`trbt`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi label={!isDisabled ? `탁도(NTU)*` : "탁도(NTU)"}>
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : ""
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <div className="col-span-1">
-            <Label className="text-xl">수소이온농도(pH)</Label>
-            <div className="flex flex-row items-center gap-2">
-              <Input
-                className="!text-xl w-36"
-                placeholder=""
-                type="text"
-                onChange={(e) => {
-                  const cleanValue = sanitizeInput(e.target.value, true);
-                  isSetPh(cleanValue, 1);
-                }}
-                value={frontPHdata ?? ""}
-                maxLength={5}
-              />
-              <span className="text-xl mx-2">~</span>
-              <Input
-                className="!text-xl w-36 "
-                placeholder=""
-                type="text"
-                onChange={(e) => {
-                  const cleanValue = sanitizeInput(e.target.value, true);
-                  isSetPh(cleanValue, 0);
-                }}
-                value={backPHdata ?? ""}
-                maxLength={5}
-              />
-            </div>
-          </div>
-          <FormField
-            control={form.control}
-            name={`bod`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={
-                    !isDisabled
-                      ? `생물학적 산소요구량(BOD)(mg/L)*`
-                      : "생물학적 산소요구량(BOD)(mg/L)"
-                  }
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : ""
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`clIonQnt`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={!isDisabled ? `염화물(mgCL/L)*` : "염화물(mgCL/L)"}
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : ""
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`smll`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi label={!isDisabled ? `냄새*` : "냄새"}>
-                  <SelectBox
-                    className="!text-2xl rounded-md"
-                    label={""}
-                    selectClass={undefined}
-                    selectArray={[
-                      { text: "불쾌하지않을것", val: "불쾌하지않을것" },
-                      { text: "해당사항없음", val: "해당사항없음" },
-                    ]}
-                    onSelectValue={(val: string | number) => {
-                      field.onChange(val.toString());
-                    }}
-                    value={field.value}
-                    readOnly={isDisabled}
-                    onBlur={field.onBlur}
-                    ref={field.ref}
-                  />
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`cdtnv`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi
-                  label={
-                    !isDisabled ? `전기전도도(㎲/cm)*` : "전기전도도(㎲/cm)"
-                  }
-                >
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : ""
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`crmty`}
-            render={({ field }) => {
-              const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-              const isDisabled = disabledFields
-                ? disabledFields.includes(field.name)
-                : true;
-              return (
-                <FormUi label={!isDisabled ? `색도(도)*` : "색도(도)"}>
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2 text-right rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          const inputValue = e.target.value.replace(
-                            /[^0-9]/g,
-                            ""
-                          ); // 정수만
-                          field.onChange(
-                            inputValue === "" ? null : Number(inputValue)
-                          );
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== null
-                            ? `${field.value}`
-                            : ""
-                        }
-                        maxLength={6}
-                        disabled={isDisabled}
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                      <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-                        이하
-                      </span>
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-          <FormField
-            control={form.control}
-            name={`rmrk`}
-            render={({ field }) => {
-              return (
-                <FormUi label={"비고"}>
-                  <div className="flex items-center gap-2">
-                    <div className="relative flex-1 min-w-0">
-                      <Input
-                        type="text"
-                        className="w-full pr-16 border py-2  rounded-md"
-                        placeholder=""
-                        onChange={(e) => {
-                          field.onChange(e.target.value);
-                        }}
-                        value={
-                          field.value !== undefined && field.value !== ""
-                            ? `${field.value}`
-                            : ""
-                        }
-                        onBlur={field.onBlur}
-                        name={field.name}
-                        ref={field.ref}
-                      />
-                    </div>
-                  </div>
-                </FormUi>
-              );
-            }}
-          />
-        </div>
-      </div>
+//       <div className="mt-10">
+//         <FormLabel className="text-xl">요구수질</FormLabel>
+//         <div className="grid grid-cols-2 gap-x-10 gap-y-6 mt-3 mb-3">
+//           <FormField
+//             control={form.control}
+//             name={`grssClfg`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={
+//                     !isDisabled ? `총대장균군수(개/mg)*` : "총대장균군수(개/mg)"
+//                   }
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : "불검출"
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       {/* TODO:  총대장균군수 확인 필요*/}
+//                       {field.value !== null ? (
+//                         <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                           이하
+//                         </span>
+//                       ) : (
+//                         <></>
+//                       )}
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`tn`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={
+//                     !isDisabled ? `총질소(T-N)(mg/L)*` : "총질소(T-N)(mg/L)"
+//                   }
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`combResdch`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={
+//                     !isDisabled ? `결합잔류염소(mg/L)*` : "결합잔류염소(mg/L)"
+//                   }
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const cleanValue = sanitizeInput(
+//                             e.target.value,
+//                             true
+//                           );
+//                           field.onChange(
+//                             cleanValue === "" ? null : Number(cleanValue)
+//                           );
+//                         }}
+//                         value={field.value ?? ""}
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이상
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`tph`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={!isDisabled ? `총인(T-P)(mg/L)*` : "총인(T-P)(mg/L)"}
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const cleanValue = sanitizeInput(
+//                             e.target.value,
+//                             true
+//                           );
+//                           field.onChange(
+//                             cleanValue === "" ? null : Number(cleanValue)
+//                           );
+//                         }}
+//                         value={field.value ?? ""}
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`trbt`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi label={!isDisabled ? `탁도(NTU)*` : "탁도(NTU)"}>
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <div className="col-span-1">
+//             <Label className="text-xl">수소이온농도(pH)</Label>
+//             <div className="flex flex-row items-center gap-2">
+//               <Input
+//                 className="!text-xl w-36"
+//                 placeholder=""
+//                 type="text"
+//                 onChange={(e) => {
+//                   const cleanValue = sanitizeInput(e.target.value, true);
+//                   isSetPh(cleanValue, 1);
+//                 }}
+//                 value={frontPHdata ?? ""}
+//                 maxLength={5}
+//               />
+//               <span className="text-xl mx-2">~</span>
+//               <Input
+//                 className="!text-xl w-36 "
+//                 placeholder=""
+//                 type="text"
+//                 onChange={(e) => {
+//                   const cleanValue = sanitizeInput(e.target.value, true);
+//                   isSetPh(cleanValue, 0);
+//                 }}
+//                 value={backPHdata ?? ""}
+//                 maxLength={5}
+//               />
+//             </div>
+//           </div>
+//           <FormField
+//             control={form.control}
+//             name={`bod`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={
+//                     !isDisabled
+//                       ? `생물학적 산소요구량(BOD)(mg/L)*`
+//                       : "생물학적 산소요구량(BOD)(mg/L)"
+//                   }
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`clIonQnt`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={!isDisabled ? `염화물(mgCL/L)*` : "염화물(mgCL/L)"}
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`smll`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi label={!isDisabled ? `냄새*` : "냄새"}>
+//                   <SelectBox
+//                     className="!text-2xl rounded-md"
+//                     label={""}
+//                     selectClass={undefined}
+//                     selectArray={[
+//                       { text: "불쾌하지않을것", val: "불쾌하지않을것" },
+//                       { text: "해당사항없음", val: "해당사항없음" },
+//                     ]}
+//                     onSelectValue={(val: string | number) => {
+//                       field.onChange(val.toString());
+//                     }}
+//                     value={field.value}
+//                     readOnly={isDisabled}
+//                     onBlur={field.onBlur}
+//                     ref={field.ref}
+//                   />
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`cdtnv`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi
+//                   label={
+//                     !isDisabled ? `전기전도도(㎲/cm)*` : "전기전도도(㎲/cm)"
+//                   }
+//                 >
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`crmty`}
+//             render={({ field }) => {
+//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
+//               const isDisabled = disabledFields
+//                 ? disabledFields.includes(field.name)
+//                 : true;
+//               return (
+//                 <FormUi label={!isDisabled ? `색도(도)*` : "색도(도)"}>
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2 text-right rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           const inputValue = e.target.value.replace(
+//                             /[^0-9]/g,
+//                             ""
+//                           ); // 정수만
+//                           field.onChange(
+//                             inputValue === "" ? null : Number(inputValue)
+//                           );
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== null
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         maxLength={6}
+//                         disabled={isDisabled}
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
+//                         이하
+//                       </span>
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//           <FormField
+//             control={form.control}
+//             name={`rmrk`}
+//             render={({ field }) => {
+//               return (
+//                 <FormUi label={"비고"}>
+//                   <div className="flex items-center gap-2">
+//                     <div className="relative flex-1 min-w-0">
+//                       <Input
+//                         type="text"
+//                         className="w-full pr-16 border py-2  rounded-md"
+//                         placeholder=""
+//                         onChange={(e) => {
+//                           field.onChange(e.target.value);
+//                         }}
+//                         value={
+//                           field.value !== undefined && field.value !== ""
+//                             ? `${field.value}`
+//                             : ""
+//                         }
+//                         onBlur={field.onBlur}
+//                         name={field.name}
+//                         ref={field.ref}
+//                       />
+//                     </div>
+//                   </div>
+//                 </FormUi>
+//               );
+//             }}
+//           />
+//         </div>
+//       </div>
 
-      {candidateFields.map(({ name, label, component, required }, index) =>
-        component ? (
-          <FormField
-            key={name + index}
-            control={form.control}
-            name={name}
-            render={({ field }) => (
-              // <FormUi label={label}>
-              //   {component(field)}
-              // </FormUi>
-              <AccessibleFormField
-                field={field}
-                label={label}
-                required={required}
-                error={
-                  typeof form.formState.errors[name]?.message === "string"
-                    ? (form.formState.errors[name] as FieldError)
-                    : undefined
-                }
-                inputComponent={component?.(field)}
-              />
-            )}
-          />
-        ) : null
-      )}
+//       {candidateFields.map(({ name, label, component, required }, index) =>
+//         component ? (
+//           <FormField
+//             key={name + index}
+//             control={form.control}
+//             name={name}
+//             render={({ field }) => (
+//               // <FormUi label={label}>
+//               //   {component(field)}
+//               // </FormUi>
+//               <AccessibleFormField
+//                 field={field}
+//                 label={label}
+//                 required={required}
+//                 error={
+//                   typeof form.formState.errors[name]?.message === "string"
+//                     ? (form.formState.errors[name] as FieldError)
+//                     : undefined
+//                 }
+//                 inputComponent={component?.(field)}
+//               />
+//             )}
+//           />
+//         ) : null
+//       )}
 
-      {isSimilarCase && (
-        <UiModal
-          body={
-            <ModalSimilarPage sply={sply} usageCd={usageCd} money={money} />
-          }
-          bodyClass="sm:max-w-[100vw] w-[1400px] h-[100dvh] max-h-[900px] overflow-y-auto overflow-x-hidden"
-          open={isSimilarCase}
-          onOpenChange={(open) => !open && setIsSimilarCase(false)}
-          noHeaderYn="Y"
-          noFooterYn="Y"
-        />
-      )}
-    </>
-  );
-}
+//       {isSimilarCase && (
+//         <UiModal
+//           body={
+//             <ModalSimilarPage sply={sply} usageCd={usageCd} money={money} />
+//           }
+//           bodyClass="sm:max-w-[100vw] w-[1400px] h-[100dvh] max-h-[900px] overflow-y-auto overflow-x-hidden"
+//           open={isSimilarCase}
+//           onOpenChange={(open) => !open && setIsSimilarCase(false)}
+//           noHeaderYn="Y"
+//           noFooterYn="Y"
+//         />
+//       )}
+//     </>
+//   );
+// }
diff --git a/apps/dm/eslint.config.mjs b/apps/dm/eslint.config.mjs
index f477f55e1..7de132089 100644
--- a/apps/dm/eslint.config.mjs
+++ b/apps/dm/eslint.config.mjs
@@ -12,9 +12,19 @@ const compat = new FlatCompat({
 
 const eslintConfig = [
   ...compat.extends("next/core-web-vitals", "next/typescript"),
+  {
+    files: ["**/*.{ts,tsx,mts,cts}"],
+    languageOptions: {
+      parserOptions: {
+        tsconfigRootDir: __dirname,
+        project: ["./tsconfig.json"],
+      },
+    },
+  },
   {rules:{
     // other rules..
     "@typescript-eslint/no-explicit-any": "off",
+    // "@next/next/no-img-element": "off",
     ...(isProd ? { "react-hooks/exhaustive-deps": "off" } : {}),
   }},
 ];
diff --git a/apps/dm/middleware.ts b/apps/dm/middleware.ts
index 44d4cb390..e55f65515 100644
--- a/apps/dm/middleware.ts
+++ b/apps/dm/middleware.ts
@@ -8,6 +8,7 @@ const serverApiUrl = process.env.NEXT_PUBLIC_CS_SERVER_API_URL;
 const GEOSERVER_URL = process.env.NEXT_PUBLIC_GEOSERVER_URL || "";
 const LX_GEOSERVER_URL = process.env.NEXT_PUBLIC_LX_GEOSERVER_URL || "";
 const GATEWAY_URL = process.env.NEXT_PUBLIC_GATEWAY_URL || "";
+const SEWERAGE_API_URL = process.env.NEXT_PUBLIC_SEWERAGE_API_URL || "";
 const BUSINESS_JUSO_API_URL = process.env.NEXT_PUBLIC_FINDADRESS_URL || "";
 const AdressKey = process.env.NEXT_PRIVATE_WR_ADDRESS_KEY || "";
 
@@ -28,15 +29,6 @@ export function middleware(req: NextRequest) {
   console.log(`[Middleware] Request URL: ${req.url}`);
   const searchParams = req.nextUrl.searchParams;
 
-  // if (pathname.startsWith("/server")) {
-  //   const queryParams = searchParams.toString();
-  //   const newUrl = `${serverApiUrl}${pathname.replace("/server", "")}${
-  //     queryParams ? `?${queryParams}` : ""
-  //   }`;
-  //   console.log(`[Middleware] Rewriting from '/server' path to: ${newUrl}`);
-  //   return NextResponse.rewrite(new URL(newUrl));
-  // }
-
   if (pathname.startsWith("/server")) {
     const decodedParams = Array.from(searchParams.entries())
       .map(([key, value]) => `${key}=${decodeURIComponent(value)}`)
@@ -49,7 +41,7 @@ export function middleware(req: NextRequest) {
 
   if (pathname === "/") {
     console.log(" maim 화면이동 ");
-    return NextResponse.redirect(new URL("/pages/wrStatus", req.url));
+    return NextResponse.redirect(new URL("/main", req.url));
   }
 
   if (pathname.startsWith("/attach-service")) {
@@ -81,6 +73,8 @@ export function middleware(req: NextRequest) {
   if (pathname.startsWith("/geoserver")) {
     let queryParams = searchParams.toString();
     const typename = searchParams.get("TYPENAME");
+    const startYmd = searchParams.get("START_YMD") ?? null;
+    const endYmd = searchParams.get("END_YMD") ?? null;
     console.log("typename  ", typename);
 
     let newUrl = `${GEOSERVER_URL}${pathname.replace("/geoserver", "")}${queryParams ? `?${queryParams}` : ""}`;
@@ -111,8 +105,10 @@ export function middleware(req: NextRequest) {
     ) {
       const url = req.nextUrl.clone();
       url.searchParams.set("TYPENAME", typename.replace("hasudo:", ""));
+      if (startYmd) url.searchParams.set("startYmd", startYmd);
+      if (endYmd) url.searchParams.set("endYmd", endYmd);
       queryParams = url.searchParams.toString();
-      newUrl = `${GATEWAY_URL}/api/v1/map/geometry${queryParams ? `?${queryParams}` : ""}`;
+      newUrl = `${GATEWAY_URL}/sewerage-service/api/v1/map/geometry${queryParams ? `?${queryParams}` : ""}`;
     }
 
     console.log(`[Middleware] Rewriting from '/geoserver' path to: ${newUrl}`);
diff --git a/apps/dm/next.config.ts b/apps/dm/next.config.ts
index 5e1533ec9..5b5bf85da 100644
--- a/apps/dm/next.config.ts
+++ b/apps/dm/next.config.ts
@@ -1,4 +1,5 @@
 import type { NextConfig } from "next";
+// import path from "path";
 
 const subDomain =
   process.env.NEXT_PUBLIC_PROXY_HOST || "http://localhost:3000";
@@ -8,6 +9,17 @@ const nextConfig: NextConfig = {
   experimental: {
     proxyTimeout: 600000,
   },
+
+  // // 🔥 반드시 필요
+  // webpack(config) {
+  //   config.resolve.alias = {
+  //     ...(config.resolve.alias || {}),
+  //     // monorepo 구조 기준
+  //     "@common": path.resolve(__dirname, "../../packages/common"),
+  //   };
+  //   return config;
+  // },
+
   async rewrites() {
     return {
       beforeFiles: [
diff --git a/apps/dm/package.json b/apps/dm/package.json
index 844e0b1aa..272584f3e 100644
--- a/apps/dm/package.json
+++ b/apps/dm/package.json
@@ -3,9 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev -p 3005",
+    "dev": "next dev -p 3015",
     "build": "next build",
-    "start:dm": "next start -p 3005",
+    "start:dm": "next start -p 3015",
     "lint": "next lint"
   },
   "dependencies": {
@@ -30,7 +30,7 @@
     "@types/webpack": "^5.28.5",
     "eslint": "^9",
     "eslint-config-next": "15.3.8",
-    "postcss": "^8",
+    "postcss": "^8",  
     "tailwindcss": "^3.4.1",
     "typescript": "^5"
   }
diff --git a/apps/dm/public/data/wrStatusData.json b/apps/dm/public/data/wrStatusData.json
deleted file mode 100644
index 334b521c1..000000000
--- a/apps/dm/public/data/wrStatusData.json
+++ /dev/null
@@ -1,20 +0,0 @@
-[
-    { "region": "전국", "sewage": "717(1,137,538)", "rainwater": "3544(13,945)", "reclaimed": "1018(222,476)", "thermal": "123(492)" },
-    { "region": "서울특별시", "sewage": "4(114,908)", "rainwater": "816(430)", "reclaimed": "371(341)", "thermal": "0" },
-    { "region": "부산광역시", "sewage": "13(146,197)", "rainwater": "68(335)", "reclaimed": "20(512)", "thermal": "1(18)" },
-    { "region": "대구광역시", "sewage": "9(102,380)", "rainwater": "294(133)", "reclaimed": "14(44)", "thermal": "2(12)" },
-    { "region": "인천광역시", "sewage": "17(57,691)", "rainwater": "165(642)", "reclaimed": "35(7,859)", "thermal": "15(32)" },
-    { "region": "광주광역시", "sewage": "3(28,738)", "rainwater": "74(23)", "reclaimed": "15(450)", "thermal": "15(6)" },
-    { "region": "대전광역시", "sewage": "2(11,966)", "rainwater": "52(2)", "reclaimed": "11(492)", "thermal": "20(100)" },
-    { "region": "울산광역시", "sewage": "8(36,076)", "rainwater": "111(39)", "reclaimed": "19(28,904)", "thermal": "30(130)" },
-    { "region": "세종특별자치시", "sewage": "9(2,555)", "rainwater": "65(16)", "reclaimed": "0(0)", "thermal": "0" },
-    { "region": "경기도", "sewage": "176(313,298)", "rainwater": "1009(4,735)", "reclaimed": "252(77,096)", "thermal": "40(143)" },
-    { "region": "강원특별자치도", "sewage": "69(19,677)", "rainwater": "69(4)", "reclaimed": "22(447)", "thermal": "0" },
-    { "region": "충청북도", "sewage": "38(15,607)", "rainwater": "17(91)", "reclaimed": "91(2,211)", "thermal": "0" },
-    { "region": "충청남도", "sewage": "67(41,368)", "rainwater": "54(77)", "reclaimed": "188(50,434)", "thermal": "0" },
-    { "region": "전라북도", "sewage": "55(42,671)", "rainwater": "33(199)", "reclaimed": "220(9,453)", "thermal": "0" },
-    { "region": "전라남도", "sewage": "83(23,560)", "rainwater": "16(885)", "reclaimed": "75(15,412)", "thermal": "0" },
-    { "region": "경상북도", "sewage": "81(129,081)", "rainwater": "37(341)", "reclaimed": "70(27,818)", "thermal": "0" },
-    { "region": "경상남도", "sewage": "75(50,101)", "rainwater": "27(244)", "reclaimed": "140(343)", "thermal": "0" },
-    { "region": "제주특별자치도", "sewage": "8(1,666)", "rainwater": "47(5,746)", "reclaimed": "64(660)", "thermal": "0" }
-  ]
\ No newline at end of file
diff --git a/apps/dm/public/file.svg b/apps/dm/public/file.svg
deleted file mode 100644
index 004145cdd..000000000
--- a/apps/dm/public/file.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg"><path d="M14.5 13.5V5.41a1 1 0 0 0-.3-.7L9.8.29A1 1 0 0 0 9.08 0H1.5v13.5A2.5 2.5 0 0 0 4 16h8a2.5 2.5 0 0 0 2.5-2.5m-1.5 0v-7H8v-5H3v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1M9.5 5V2.12L12.38 5zM5.13 5h-.62v1.25h2.12V5zm-.62 3h7.12v1.25H4.5zm.62 3h-.62v1.25h7.12V11z" clip-rule="evenodd" fill="#666" fill-rule="evenodd"/></svg>
\ No newline at end of file
diff --git a/apps/dm/public/fonts/NotoSansKR-Black.otf b/apps/dm/public/fonts/NotoSansKR-Black.otf
deleted file mode 100644
index 2b54d195e..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Black.otf and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Black.woff b/apps/dm/public/fonts/NotoSansKR-Black.woff
deleted file mode 100644
index 90ef00381..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Black.woff and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Black.woff2 b/apps/dm/public/fonts/NotoSansKR-Black.woff2
deleted file mode 100644
index 8953c8fa7..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Black.woff2 and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Bold.otf b/apps/dm/public/fonts/NotoSansKR-Bold.otf
deleted file mode 100644
index 2b78dd845..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Bold.otf and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Bold.woff b/apps/dm/public/fonts/NotoSansKR-Bold.woff
deleted file mode 100644
index 74b20d49c..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Bold.woff and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Bold.woff2 b/apps/dm/public/fonts/NotoSansKR-Bold.woff2
deleted file mode 100644
index 216f94dad..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Bold.woff2 and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Light.otf b/apps/dm/public/fonts/NotoSansKR-Light.otf
deleted file mode 100644
index ecab31abc..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Light.otf and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Light.woff b/apps/dm/public/fonts/NotoSansKR-Light.woff
deleted file mode 100644
index 40aabd2a4..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Light.woff and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Light.woff2 b/apps/dm/public/fonts/NotoSansKR-Light.woff2
deleted file mode 100644
index 6b7cd1307..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Light.woff2 and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Medium.otf b/apps/dm/public/fonts/NotoSansKR-Medium.otf
deleted file mode 100644
index 371959d51..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Medium.otf and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Medium.woff b/apps/dm/public/fonts/NotoSansKR-Medium.woff
deleted file mode 100644
index e15aae09e..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Medium.woff and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Medium.woff2 b/apps/dm/public/fonts/NotoSansKR-Medium.woff2
deleted file mode 100644
index b97668034..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Medium.woff2 and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Regular.otf b/apps/dm/public/fonts/NotoSansKR-Regular.otf
deleted file mode 100644
index 7ba76b49c..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Regular.otf and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Regular.woff b/apps/dm/public/fonts/NotoSansKR-Regular.woff
deleted file mode 100644
index 40fab257c..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Regular.woff and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Thin.otf b/apps/dm/public/fonts/NotoSansKR-Thin.otf
deleted file mode 100644
index 06c566278..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Thin.otf and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Thin.woff b/apps/dm/public/fonts/NotoSansKR-Thin.woff
deleted file mode 100644
index 40723731f..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Thin.woff and /dev/null differ
diff --git a/apps/dm/public/fonts/NotoSansKR-Thin.woff2 b/apps/dm/public/fonts/NotoSansKR-Thin.woff2
deleted file mode 100644
index 7835c23ed..000000000
Binary files a/apps/dm/public/fonts/NotoSansKR-Thin.woff2 and /dev/null differ
diff --git a/apps/dm/public/globe.svg b/apps/dm/public/globe.svg
deleted file mode 100644
index 567f17b0d..000000000
--- a/apps/dm/public/globe.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><g clip-path="url(#a)"><path fill-rule="evenodd" clip-rule="evenodd" d="M10.27 14.1a6.5 6.5 0 0 0 3.67-3.45q-1.24.21-2.7.34-.31 1.83-.97 3.1M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m.48-1.52a7 7 0 0 1-.96 0H7.5a4 4 0 0 1-.84-1.32q-.38-.89-.63-2.08a40 40 0 0 0 3.92 0q-.25 1.2-.63 2.08a4 4 0 0 1-.84 1.31zm2.94-4.76q1.66-.15 2.95-.43a7 7 0 0 0 0-2.58q-1.3-.27-2.95-.43a18 18 0 0 1 0 3.44m-1.27-3.54a17 17 0 0 1 0 3.64 39 39 0 0 1-4.3 0 17 17 0 0 1 0-3.64 39 39 0 0 1 4.3 0m1.1-1.17q1.45.13 2.69.34a6.5 6.5 0 0 0-3.67-3.44q.65 1.26.98 3.1M8.48 1.5l.01.02q.41.37.84 1.31.38.89.63 2.08a40 40 0 0 0-3.92 0q.25-1.2.63-2.08a4 4 0 0 1 .85-1.32 7 7 0 0 1 .96 0m-2.75.4a6.5 6.5 0 0 0-3.67 3.44 29 29 0 0 1 2.7-.34q.31-1.83.97-3.1M4.58 6.28q-1.66.16-2.95.43a7 7 0 0 0 0 2.58q1.3.27 2.95.43a18 18 0 0 1 0-3.44m.17 4.71q-1.45-.12-2.69-.34a6.5 6.5 0 0 0 3.67 3.44q-.65-1.27-.98-3.1" fill="#666"/></g><defs><clipPath id="a"><path fill="#fff" d="M0 0h16v16H0z"/></clipPath></defs></svg>
\ No newline at end of file
diff --git a/apps/dm/public/images/help.png b/apps/dm/public/images/help.png
deleted file mode 100644
index e872802e4..000000000
Binary files a/apps/dm/public/images/help.png and /dev/null differ
diff --git a/apps/dm_new/public/images/landing/australia_01.png b/apps/dm/public/images/landing/australia_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/australia_01.png
rename to apps/dm/public/images/landing/australia_01.png
diff --git a/apps/dm_new/public/images/landing/business/globalCase/australia_01.png b/apps/dm/public/images/landing/business/globalCase/australia_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/globalCase/australia_01.png
rename to apps/dm/public/images/landing/business/globalCase/australia_01.png
diff --git a/apps/dm_new/public/images/landing/business/globalCase/eu_01.png b/apps/dm/public/images/landing/business/globalCase/eu_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/globalCase/eu_01.png
rename to apps/dm/public/images/landing/business/globalCase/eu_01.png
diff --git a/apps/dm_new/public/images/landing/business/globalCase/overview_01.png b/apps/dm/public/images/landing/business/globalCase/overview_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/globalCase/overview_01.png
rename to apps/dm/public/images/landing/business/globalCase/overview_01.png
diff --git a/apps/dm_new/public/images/landing/business/globalCase/singapore_01.png b/apps/dm/public/images/landing/business/globalCase/singapore_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/globalCase/singapore_01.png
rename to apps/dm/public/images/landing/business/globalCase/singapore_01.png
diff --git a/apps/dm_new/public/images/landing/business/globalCase/taiwan_01.png b/apps/dm/public/images/landing/business/globalCase/taiwan_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/globalCase/taiwan_01.png
rename to apps/dm/public/images/landing/business/globalCase/taiwan_01.png
diff --git a/apps/dm_new/public/images/landing/business/rain/rain_01.png b/apps/dm/public/images/landing/business/rain/rain_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/rain/rain_01.png
rename to apps/dm/public/images/landing/business/rain/rain_01.png
diff --git a/apps/dm_new/public/images/landing/business/rain/rain_02.png b/apps/dm/public/images/landing/business/rain/rain_02.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/rain/rain_02.png
rename to apps/dm/public/images/landing/business/rain/rain_02.png
diff --git a/apps/dm_new/public/images/landing/business/rain/rain_03.png b/apps/dm/public/images/landing/business/rain/rain_03.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/rain/rain_03.png
rename to apps/dm/public/images/landing/business/rain/rain_03.png
diff --git a/apps/dm_new/public/images/landing/business/rain/rain_04.png b/apps/dm/public/images/landing/business/rain/rain_04.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/rain/rain_04.png
rename to apps/dm/public/images/landing/business/rain/rain_04.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/bolyeong_01.png b/apps/dm/public/images/landing/business/sewage/bolyeong_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/bolyeong_01.png
rename to apps/dm/public/images/landing/business/sewage/bolyeong_01.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/cheongju_01.png b/apps/dm/public/images/landing/business/sewage/cheongju_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/cheongju_01.png
rename to apps/dm/public/images/landing/business/sewage/cheongju_01.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/guri_01.png b/apps/dm/public/images/landing/business/sewage/guri_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/guri_01.png
rename to apps/dm/public/images/landing/business/sewage/guri_01.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/guri_02.png b/apps/dm/public/images/landing/business/sewage/guri_02.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/guri_02.png
rename to apps/dm/public/images/landing/business/sewage/guri_02.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/hwanggu_01.png b/apps/dm/public/images/landing/business/sewage/hwanggu_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/hwanggu_01.png
rename to apps/dm/public/images/landing/business/sewage/hwanggu_01.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/hwanggu_02.png b/apps/dm/public/images/landing/business/sewage/hwanggu_02.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/hwanggu_02.png
rename to apps/dm/public/images/landing/business/sewage/hwanggu_02.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/hwanggu_03.png b/apps/dm/public/images/landing/business/sewage/hwanggu_03.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/hwanggu_03.png
rename to apps/dm/public/images/landing/business/sewage/hwanggu_03.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/paju_01.png b/apps/dm/public/images/landing/business/sewage/paju_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/paju_01.png
rename to apps/dm/public/images/landing/business/sewage/paju_01.png
diff --git a/apps/dm_new/public/images/landing/business/sewage/yeosu_01.png b/apps/dm/public/images/landing/business/sewage/yeosu_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/business/sewage/yeosu_01.png
rename to apps/dm/public/images/landing/business/sewage/yeosu_01.png
diff --git a/apps/dm_new/public/images/landing/calendar.svg b/apps/dm/public/images/landing/calendar.svg
similarity index 100%
rename from apps/dm_new/public/images/landing/calendar.svg
rename to apps/dm/public/images/landing/calendar.svg
diff --git a/apps/dm_new/public/images/landing/card_01.jpg b/apps/dm/public/images/landing/card_01.jpg
similarity index 100%
rename from apps/dm_new/public/images/landing/card_01.jpg
rename to apps/dm/public/images/landing/card_01.jpg
diff --git a/apps/dm_new/public/images/landing/card_02.jpg b/apps/dm/public/images/landing/card_02.jpg
similarity index 100%
rename from apps/dm_new/public/images/landing/card_02.jpg
rename to apps/dm/public/images/landing/card_02.jpg
diff --git a/apps/dm_new/public/images/landing/card_03.jpg b/apps/dm/public/images/landing/card_03.jpg
similarity index 100%
rename from apps/dm_new/public/images/landing/card_03.jpg
rename to apps/dm/public/images/landing/card_03.jpg
diff --git a/apps/dm_new/public/images/landing/card_04.jpg b/apps/dm/public/images/landing/card_04.jpg
similarity index 100%
rename from apps/dm_new/public/images/landing/card_04.jpg
rename to apps/dm/public/images/landing/card_04.jpg
diff --git a/apps/dm_new/public/images/landing/cases/greywater_building.png b/apps/dm/public/images/landing/cases/greywater_building.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/greywater_building.png
rename to apps/dm/public/images/landing/cases/greywater_building.png
diff --git a/apps/dm_new/public/images/landing/cases/greywater_factory.png b/apps/dm/public/images/landing/cases/greywater_factory.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/greywater_factory.png
rename to apps/dm/public/images/landing/cases/greywater_factory.png
diff --git a/apps/dm_new/public/images/landing/cases/greywater_overall.png b/apps/dm/public/images/landing/cases/greywater_overall.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/greywater_overall.png
rename to apps/dm/public/images/landing/cases/greywater_overall.png
diff --git a/apps/dm_new/public/images/landing/cases/greywater_usage.png b/apps/dm/public/images/landing/cases/greywater_usage.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/greywater_usage.png
rename to apps/dm/public/images/landing/cases/greywater_usage.png
diff --git a/apps/dm_new/public/images/landing/cases/rainwater_building.png b/apps/dm/public/images/landing/cases/rainwater_building.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/rainwater_building.png
rename to apps/dm/public/images/landing/cases/rainwater_building.png
diff --git a/apps/dm_new/public/images/landing/cases/rainwater_usage.png b/apps/dm/public/images/landing/cases/rainwater_usage.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/rainwater_usage.png
rename to apps/dm/public/images/landing/cases/rainwater_usage.png
diff --git a/apps/dm_new/public/images/landing/cases/rainwater_usage_amount.png b/apps/dm/public/images/landing/cases/rainwater_usage_amount.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/rainwater_usage_amount.png
rename to apps/dm/public/images/landing/cases/rainwater_usage_amount.png
diff --git a/apps/dm_new/public/images/landing/cases/treated_water_facility.png b/apps/dm/public/images/landing/cases/treated_water_facility.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/treated_water_facility.png
rename to apps/dm/public/images/landing/cases/treated_water_facility.png
diff --git a/apps/dm_new/public/images/landing/cases/treated_water_region.png b/apps/dm/public/images/landing/cases/treated_water_region.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/treated_water_region.png
rename to apps/dm/public/images/landing/cases/treated_water_region.png
diff --git a/apps/dm_new/public/images/landing/cases/treated_water_usage.png b/apps/dm/public/images/landing/cases/treated_water_usage.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/treated_water_usage.png
rename to apps/dm/public/images/landing/cases/treated_water_usage.png
diff --git a/apps/dm_new/public/images/landing/cases/treated_water_year.png b/apps/dm/public/images/landing/cases/treated_water_year.png
similarity index 100%
rename from apps/dm_new/public/images/landing/cases/treated_water_year.png
rename to apps/dm/public/images/landing/cases/treated_water_year.png
diff --git a/apps/dm_new/public/images/landing/drop_arrow.svg b/apps/dm/public/images/landing/drop_arrow.svg
similarity index 100%
rename from apps/dm_new/public/images/landing/drop_arrow.svg
rename to apps/dm/public/images/landing/drop_arrow.svg
diff --git a/apps/dm_new/public/images/landing/eu_01.png b/apps/dm/public/images/landing/eu_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/eu_01.png
rename to apps/dm/public/images/landing/eu_01.png
diff --git a/apps/dm_new/public/images/landing/hero_bg.jpg b/apps/dm/public/images/landing/hero_bg.jpg
similarity index 100%
rename from apps/dm_new/public/images/landing/hero_bg.jpg
rename to apps/dm/public/images/landing/hero_bg.jpg
diff --git a/apps/dm_new/public/images/landing/icon_left_arrow.png b/apps/dm/public/images/landing/icon_left_arrow.png
similarity index 100%
rename from apps/dm_new/public/images/landing/icon_left_arrow.png
rename to apps/dm/public/images/landing/icon_left_arrow.png
diff --git a/apps/dm_new/public/images/landing/icon_login.png b/apps/dm/public/images/landing/icon_login.png
similarity index 100%
rename from apps/dm_new/public/images/landing/icon_login.png
rename to apps/dm/public/images/landing/icon_login.png
diff --git a/apps/dm_new/public/images/landing/icon_logout.png b/apps/dm/public/images/landing/icon_logout.png
similarity index 100%
rename from apps/dm_new/public/images/landing/icon_logout.png
rename to apps/dm/public/images/landing/icon_logout.png
diff --git a/apps/dm_new/public/images/landing/icon_right_arrow.png b/apps/dm/public/images/landing/icon_right_arrow.png
similarity index 100%
rename from apps/dm_new/public/images/landing/icon_right_arrow.png
rename to apps/dm/public/images/landing/icon_right_arrow.png
diff --git a/apps/dm_new/public/images/landing/intro/domestic_textbox.png b/apps/dm/public/images/landing/intro/domestic_textbox.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/domestic_textbox.png
rename to apps/dm/public/images/landing/intro/domestic_textbox.png
diff --git a/apps/dm_new/public/images/landing/intro/greywater_intro.png b/apps/dm/public/images/landing/intro/greywater_intro.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/greywater_intro.png
rename to apps/dm/public/images/landing/intro/greywater_intro.png
diff --git a/apps/dm_new/public/images/landing/intro/greywater_mandatory.png b/apps/dm/public/images/landing/intro/greywater_mandatory.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/greywater_mandatory.png
rename to apps/dm/public/images/landing/intro/greywater_mandatory.png
diff --git a/apps/dm_new/public/images/landing/intro/greywater_standard.png b/apps/dm/public/images/landing/intro/greywater_standard.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/greywater_standard.png
rename to apps/dm/public/images/landing/intro/greywater_standard.png
diff --git a/apps/dm_new/public/images/landing/intro/law_timeline.png b/apps/dm/public/images/landing/intro/law_timeline.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/law_timeline.png
rename to apps/dm/public/images/landing/intro/law_timeline.png
diff --git a/apps/dm_new/public/images/landing/intro/linkage.png b/apps/dm/public/images/landing/intro/linkage.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/linkage.png
rename to apps/dm/public/images/landing/intro/linkage.png
diff --git a/apps/dm_new/public/images/landing/intro/performance_left.png b/apps/dm/public/images/landing/intro/performance_left.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/performance_left.png
rename to apps/dm/public/images/landing/intro/performance_left.png
diff --git a/apps/dm_new/public/images/landing/intro/policy_timeline.png b/apps/dm/public/images/landing/intro/policy_timeline.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/policy_timeline.png
rename to apps/dm/public/images/landing/intro/policy_timeline.png
diff --git a/apps/dm_new/public/images/landing/intro/rainreuse_intro.png b/apps/dm/public/images/landing/intro/rainreuse_intro.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/rainreuse_intro.png
rename to apps/dm/public/images/landing/intro/rainreuse_intro.png
diff --git a/apps/dm_new/public/images/landing/intro/rainreuse_mandatory.png b/apps/dm/public/images/landing/intro/rainreuse_mandatory.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/rainreuse_mandatory.png
rename to apps/dm/public/images/landing/intro/rainreuse_mandatory.png
diff --git a/apps/dm_new/public/images/landing/intro/rainwater_design.png b/apps/dm/public/images/landing/intro/rainwater_design.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/rainwater_design.png
rename to apps/dm/public/images/landing/intro/rainwater_design.png
diff --git a/apps/dm_new/public/images/landing/intro/rainwater_standards.png b/apps/dm/public/images/landing/intro/rainwater_standards.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/rainwater_standards.png
rename to apps/dm/public/images/landing/intro/rainwater_standards.png
diff --git a/apps/dm_new/public/images/landing/intro/rel_note.png b/apps/dm/public/images/landing/intro/rel_note.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/rel_note.png
rename to apps/dm/public/images/landing/intro/rel_note.png
diff --git a/apps/dm_new/public/images/landing/intro/treatedwater_intro.png b/apps/dm/public/images/landing/intro/treatedwater_intro.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/treatedwater_intro.png
rename to apps/dm/public/images/landing/intro/treatedwater_intro.png
diff --git a/apps/dm_new/public/images/landing/intro/treatedwater_mandatory.png b/apps/dm/public/images/landing/intro/treatedwater_mandatory.png
similarity index 100%
rename from apps/dm_new/public/images/landing/intro/treatedwater_mandatory.png
rename to apps/dm/public/images/landing/intro/treatedwater_mandatory.png
diff --git a/apps/dm_new/public/images/landing/logo.png b/apps/dm/public/images/landing/logo.png
similarity index 100%
rename from apps/dm_new/public/images/landing/logo.png
rename to apps/dm/public/images/landing/logo.png
diff --git a/apps/dm_new/public/images/landing/overview_01.png b/apps/dm/public/images/landing/overview_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/overview_01.png
rename to apps/dm/public/images/landing/overview_01.png
diff --git a/apps/dm_new/public/images/landing/rain_01.png b/apps/dm/public/images/landing/rain_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/rain_01.png
rename to apps/dm/public/images/landing/rain_01.png
diff --git a/apps/dm_new/public/images/landing/scroll_down.svg b/apps/dm/public/images/landing/scroll_down.svg
similarity index 100%
rename from apps/dm_new/public/images/landing/scroll_down.svg
rename to apps/dm/public/images/landing/scroll_down.svg
diff --git a/apps/dm_new/public/images/landing/section_03.png b/apps/dm/public/images/landing/section_03.png
similarity index 100%
rename from apps/dm_new/public/images/landing/section_03.png
rename to apps/dm/public/images/landing/section_03.png
diff --git a/apps/dm_new/public/images/landing/sewage_01.png b/apps/dm/public/images/landing/sewage_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/sewage_01.png
rename to apps/dm/public/images/landing/sewage_01.png
diff --git a/apps/dm_new/public/images/landing/sewage_02.png b/apps/dm/public/images/landing/sewage_02.png
similarity index 100%
rename from apps/dm_new/public/images/landing/sewage_02.png
rename to apps/dm/public/images/landing/sewage_02.png
diff --git a/apps/dm_new/public/images/landing/sewage_03.png b/apps/dm/public/images/landing/sewage_03.png
similarity index 100%
rename from apps/dm_new/public/images/landing/sewage_03.png
rename to apps/dm/public/images/landing/sewage_03.png
diff --git a/apps/dm_new/public/images/landing/sewage_04.png b/apps/dm/public/images/landing/sewage_04.png
similarity index 100%
rename from apps/dm_new/public/images/landing/sewage_04.png
rename to apps/dm/public/images/landing/sewage_04.png
diff --git a/apps/dm_new/public/images/landing/sewage_05.png b/apps/dm/public/images/landing/sewage_05.png
similarity index 100%
rename from apps/dm_new/public/images/landing/sewage_05.png
rename to apps/dm/public/images/landing/sewage_05.png
diff --git a/apps/dm_new/public/images/landing/sewage_06.png b/apps/dm/public/images/landing/sewage_06.png
similarity index 100%
rename from apps/dm_new/public/images/landing/sewage_06.png
rename to apps/dm/public/images/landing/sewage_06.png
diff --git a/apps/dm_new/public/images/landing/singapore_01.png b/apps/dm/public/images/landing/singapore_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/singapore_01.png
rename to apps/dm/public/images/landing/singapore_01.png
diff --git a/apps/dm_new/public/images/landing/taiwan_01.png b/apps/dm/public/images/landing/taiwan_01.png
similarity index 100%
rename from apps/dm_new/public/images/landing/taiwan_01.png
rename to apps/dm/public/images/landing/taiwan_01.png
diff --git a/apps/dm_new/public/images/landing/water_quality_ref_1.png b/apps/dm/public/images/landing/water_quality_ref_1.png
similarity index 100%
rename from apps/dm_new/public/images/landing/water_quality_ref_1.png
rename to apps/dm/public/images/landing/water_quality_ref_1.png
diff --git a/apps/dm/public/img/wrAbout/icon_01.png b/apps/dm/public/img/wrAbout/icon_01.png
deleted file mode 100644
index 30eff5745..000000000
Binary files a/apps/dm/public/img/wrAbout/icon_01.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/icon_02.png b/apps/dm/public/img/wrAbout/icon_02.png
deleted file mode 100644
index 36401729f..000000000
Binary files a/apps/dm/public/img/wrAbout/icon_02.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/icon_03.png b/apps/dm/public/img/wrAbout/icon_03.png
deleted file mode 100644
index 87f48c444..000000000
Binary files a/apps/dm/public/img/wrAbout/icon_03.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_01_1.png b/apps/dm/public/img/wrAbout/img_01_1.png
deleted file mode 100644
index 9aab4e824..000000000
Binary files a/apps/dm/public/img/wrAbout/img_01_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_02_1.png b/apps/dm/public/img/wrAbout/img_02_1.png
deleted file mode 100644
index aa1c8ee5a..000000000
Binary files a/apps/dm/public/img/wrAbout/img_02_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_02_2.png b/apps/dm/public/img/wrAbout/img_02_2.png
deleted file mode 100644
index c8283053e..000000000
Binary files a/apps/dm/public/img/wrAbout/img_02_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_02_3.png b/apps/dm/public/img/wrAbout/img_02_3.png
deleted file mode 100644
index f5ba9d81e..000000000
Binary files a/apps/dm/public/img/wrAbout/img_02_3.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_03_1.png b/apps/dm/public/img/wrAbout/img_03_1.png
deleted file mode 100644
index a7534ae68..000000000
Binary files a/apps/dm/public/img/wrAbout/img_03_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_03_2.png b/apps/dm/public/img/wrAbout/img_03_2.png
deleted file mode 100644
index 6b4faca7d..000000000
Binary files a/apps/dm/public/img/wrAbout/img_03_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_04_1.png b/apps/dm/public/img/wrAbout/img_04_1.png
deleted file mode 100644
index a160072bd..000000000
Binary files a/apps/dm/public/img/wrAbout/img_04_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_04_2.png b/apps/dm/public/img/wrAbout/img_04_2.png
deleted file mode 100644
index 374fc55bf..000000000
Binary files a/apps/dm/public/img/wrAbout/img_04_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_05_1.png b/apps/dm/public/img/wrAbout/img_05_1.png
deleted file mode 100644
index 1418fa92d..000000000
Binary files a/apps/dm/public/img/wrAbout/img_05_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_05_2.png b/apps/dm/public/img/wrAbout/img_05_2.png
deleted file mode 100644
index 0c2f92396..000000000
Binary files a/apps/dm/public/img/wrAbout/img_05_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_06_1.png b/apps/dm/public/img/wrAbout/img_06_1.png
deleted file mode 100644
index 08acf4971..000000000
Binary files a/apps/dm/public/img/wrAbout/img_06_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrAbout/img_06_2.png b/apps/dm/public/img/wrAbout/img_06_2.png
deleted file mode 100644
index 19b150b7c..000000000
Binary files a/apps/dm/public/img/wrAbout/img_06_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/icon_01.png b/apps/dm/public/img/wrExample/icon_01.png
deleted file mode 100644
index 30eff5745..000000000
Binary files a/apps/dm/public/img/wrExample/icon_01.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/icon_02.png b/apps/dm/public/img/wrExample/icon_02.png
deleted file mode 100644
index 36401729f..000000000
Binary files a/apps/dm/public/img/wrExample/icon_02.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/icon_03.png b/apps/dm/public/img/wrExample/icon_03.png
deleted file mode 100644
index 87f48c444..000000000
Binary files a/apps/dm/public/img/wrExample/icon_03.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_01_1.png b/apps/dm/public/img/wrExample/img_01_1.png
deleted file mode 100644
index 9aab4e824..000000000
Binary files a/apps/dm/public/img/wrExample/img_01_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_02_1.png b/apps/dm/public/img/wrExample/img_02_1.png
deleted file mode 100644
index 3d61c6e5d..000000000
Binary files a/apps/dm/public/img/wrExample/img_02_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_02_2.png b/apps/dm/public/img/wrExample/img_02_2.png
deleted file mode 100644
index c8283053e..000000000
Binary files a/apps/dm/public/img/wrExample/img_02_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_02_3.png b/apps/dm/public/img/wrExample/img_02_3.png
deleted file mode 100644
index f5ba9d81e..000000000
Binary files a/apps/dm/public/img/wrExample/img_02_3.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_03_1.png b/apps/dm/public/img/wrExample/img_03_1.png
deleted file mode 100644
index a7534ae68..000000000
Binary files a/apps/dm/public/img/wrExample/img_03_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_03_2.png b/apps/dm/public/img/wrExample/img_03_2.png
deleted file mode 100644
index 6b4faca7d..000000000
Binary files a/apps/dm/public/img/wrExample/img_03_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_04_1.png b/apps/dm/public/img/wrExample/img_04_1.png
deleted file mode 100644
index a160072bd..000000000
Binary files a/apps/dm/public/img/wrExample/img_04_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_04_2.png b/apps/dm/public/img/wrExample/img_04_2.png
deleted file mode 100644
index 374fc55bf..000000000
Binary files a/apps/dm/public/img/wrExample/img_04_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_05_1.png b/apps/dm/public/img/wrExample/img_05_1.png
deleted file mode 100644
index 1418fa92d..000000000
Binary files a/apps/dm/public/img/wrExample/img_05_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_05_2.png b/apps/dm/public/img/wrExample/img_05_2.png
deleted file mode 100644
index 0c2f92396..000000000
Binary files a/apps/dm/public/img/wrExample/img_05_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_06_1.png b/apps/dm/public/img/wrExample/img_06_1.png
deleted file mode 100644
index 08acf4971..000000000
Binary files a/apps/dm/public/img/wrExample/img_06_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_06_2.png b/apps/dm/public/img/wrExample/img_06_2.png
deleted file mode 100644
index 19b150b7c..000000000
Binary files a/apps/dm/public/img/wrExample/img_06_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_arrow_down_1.png b/apps/dm/public/img/wrExample/img_arrow_down_1.png
deleted file mode 100644
index 9e8fb76c6..000000000
Binary files a/apps/dm/public/img/wrExample/img_arrow_down_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_arrow_down_2.png b/apps/dm/public/img/wrExample/img_arrow_down_2.png
deleted file mode 100644
index 2002bb607..000000000
Binary files a/apps/dm/public/img/wrExample/img_arrow_down_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_01_1.png b/apps/dm/public/img/wrExample/img_ex_01_1.png
deleted file mode 100644
index 9d6bfb002..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_01_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_02_1.png b/apps/dm/public/img/wrExample/img_ex_02_1.png
deleted file mode 100644
index 70c1f8ed2..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_02_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_03_1.png b/apps/dm/public/img/wrExample/img_ex_03_1.png
deleted file mode 100644
index c981fa9fb..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_03_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_04_1.png b/apps/dm/public/img/wrExample/img_ex_04_1.png
deleted file mode 100644
index f5547820e..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_04_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_04_2.png b/apps/dm/public/img/wrExample/img_ex_04_2.png
deleted file mode 100644
index b102942ee..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_04_2.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_04_3.png b/apps/dm/public/img/wrExample/img_ex_04_3.png
deleted file mode 100644
index 50ca8045f..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_04_3.png and /dev/null differ
diff --git a/apps/dm/public/img/wrExample/img_ex_04_4.png b/apps/dm/public/img/wrExample/img_ex_04_4.png
deleted file mode 100644
index 6e6d0c294..000000000
Binary files a/apps/dm/public/img/wrExample/img_ex_04_4.png and /dev/null differ
diff --git a/apps/dm/public/img/wrOverview/img_ov_01_1.png b/apps/dm/public/img/wrOverview/img_ov_01_1.png
deleted file mode 100644
index e59a10192..000000000
Binary files a/apps/dm/public/img/wrOverview/img_ov_01_1.png and /dev/null differ
diff --git a/apps/dm/public/img/wrStatus/icon_favorit_off.png b/apps/dm/public/img/wrStatus/icon_favorit_off.png
deleted file mode 100644
index 4de0b3ebc..000000000
Binary files a/apps/dm/public/img/wrStatus/icon_favorit_off.png and /dev/null differ
diff --git a/apps/dm/public/img/wrStatus/icon_favorit_on.png b/apps/dm/public/img/wrStatus/icon_favorit_on.png
deleted file mode 100644
index f2edfa4e9..000000000
Binary files a/apps/dm/public/img/wrStatus/icon_favorit_on.png and /dev/null differ
diff --git a/apps/dm/public/img/wrStatus/icon_right.png b/apps/dm/public/img/wrStatus/icon_right.png
deleted file mode 100644
index fef56226c..000000000
Binary files a/apps/dm/public/img/wrStatus/icon_right.png and /dev/null differ
diff --git a/apps/dm/public/img/wrStatus/southKoreaMap.svg b/apps/dm/public/img/wrStatus/southKoreaMap.svg
deleted file mode 100644
index 7b3c170e3..000000000
--- a/apps/dm/public/img/wrStatus/southKoreaMap.svg
+++ /dev/null
@@ -1,19 +0,0 @@
-<svg width="506" height="785" viewBox="0 0 506 785" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path id="전라북도" d="M273.567 425.516L274.188 429.893L276.776 436.366L272.497 444.123L262.388 453.507L253.164 454.538L241.456 466.408L234.164 484.969L234.199 489.884L228.425 500.23L234.578 510.92L233.336 516.076L236.637 519.971L228.736 529.825L229.207 534.786L222.445 540.171L212.531 530.741L203.135 532.139L199.017 538.372L191.864 536.768L186.861 538.819L178.752 536.126L178.43 533.686L170.644 532.093L159.695 536.699L152.358 532.517L155.785 526.261L152.174 521.77L153.301 515.491L150.678 509.923L146.09 512.799L143.398 518.848L135.29 516.167L133.266 509.43L123.122 503.816L114.117 508.754L114.416 513.612L109.16 518.184L110.057 521.77L99.1308 527.9L94.1739 524.096L89.24 525.711L90.4706 530.077L82.9604 529.126L82.5924 520.2L79.1881 518.573L78.9811 511.447L73.0925 508.709L79.9126 497.056L93.1848 491.912L98.1302 491.935L102.064 487.913L106.906 492.153L107.423 488.944L103.754 484.98L84.6165 484.969L78.9811 480.489L80.7752 474.141L98.1762 464.196L104.306 451.112L124.123 456.68L124.364 451.33L120.201 449.978L113.634 443.859L122.673 440.548L127.63 441.453L130.552 436.286L130.149 434.155L121.098 437.409L112.541 435.621L109.608 438.749L102.627 436.057L103.168 425.779L97.0031 422.823L98.6938 419.707L117.038 419.237L140.604 407.436L141.846 399.336L147.608 396.54L155.164 396.987L161.248 399.45L167.044 409.808L173.347 412.283L175.969 408.822L181.513 407.757L188.08 409.132L193.911 406.187L199.305 404.835L211.634 423.27L214.555 422.606L217.936 428.438L226.436 427.853L227.85 421.93L235.429 423.018L236.499 426.776L240.11 422.606L239.455 417.221L243.837 416.854L245.033 420.097L246.447 420.452L247.678 417.897L250.461 417.771L253.969 423.362L256.798 423.408L260.49 425.837L270.254 423.305L273.567 425.516Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="서울특별시" d="M200.823 161.685L192.036 164.378L194.072 156.747L192.485 153.378L193.393 150.686L190.909 149.792L191.588 144.407L187.309 142.391L180.777 141.039L177.177 150.021L175.153 150.239L172.22 146.195L167.24 149.403L165.687 156.747L152.829 155.315L150.828 157.641L147.895 163.473L153.531 165.054L154.209 170.427L152.852 171.55L153.531 174.919L158.706 174.243L162.985 182.32L167.263 181.873L171.093 183.225L181.007 179.41L181.455 182.549L182.352 184.566L189.333 181.209H191.818L194.072 179.628L196.993 178.287L195.187 173.349L200.823 167.07V161.685Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="인천광역시" d="M126.722 162.453L125.376 165.054L126.285 167.517L129.068 166.875L130.782 169.98L126.423 172.1L128.079 180.303L131.702 186.914L140.259 190.214L146.768 178.951L143.398 173.578L143.168 168.411H145.422L147.895 163.472L150.828 157.641L146.55 157.423L134.381 146.871L130.103 148.899V150.468L123.582 153.608L126.722 162.453Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="경기도" d="M286.172 172.455L282.618 168.537L274.475 166.394L258.259 155.177H251.036L253.521 145.977L246.769 140.363L252.393 134.313L252.163 123.715L263.653 116.359L262.756 104.466L256.235 100.88L254.613 97.1337L244.285 90.3394L245.194 80.463L243.837 75.5249L228.299 78.2174L224.469 65.8777L210.725 60.275L199.029 45.0137L185.504 55.3368L181.904 64.984L169.517 74.4021L165.687 81.3567L155.336 89.6634L146.55 93.9256L142.72 111.421L133.933 122.42L120.201 123.543L118.165 152.255L123.582 153.607L130.103 150.468V148.898L134.381 146.87L146.55 157.423L150.828 157.64L152.829 155.315L165.687 156.747L167.24 149.403L172.22 146.194L175.153 150.239L177.177 150.021L180.777 141.039L187.309 142.391L191.588 144.407L190.909 149.792L193.393 150.686L192.485 153.378L194.072 156.747L192.036 164.377L200.823 161.685V167.07L195.187 173.349L196.993 178.287L194.072 179.627L191.818 181.208H189.333L182.352 184.566L181.455 182.549L181.007 179.41L171.093 183.225L167.263 181.873L162.985 182.32L158.706 174.242L153.531 174.918L152.852 171.55L154.209 170.427L153.531 165.053L147.895 163.472L145.422 168.41H143.168L143.398 173.578L146.768 178.951L140.258 190.214L135.405 195.748L153.082 208.569L146.09 211.937L138.211 210.815L129.206 212.167L130.552 216.876L127.182 223.83L130.782 226.305L129.885 230.785L138.441 228.539L142.49 224.953L147.447 228.986L141.593 231.232L142.49 242.678L145.422 249.403L144.065 254.124L149.252 260.62L154.209 273.418L163.859 268.698L177.844 266.91L186.642 262.648L195.866 266.234L206.228 275.435L209.161 270.496L216.993 268.847L235.061 253.677L244.745 255.464L256.177 245.198L259.375 238.416L263.078 241.417L265.873 236.25L271.543 231.908L272.21 222.261L275.142 219.121L275.372 204.765L281.595 187.659L281.226 179.857L284.378 177.164L286.172 172.455Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-miterlimit="10"/>
-<path id="강원특별자치도" d="M210.047 41.6452L215.912 42.3212L220.858 38.2882L231.669 45.2429L235.05 40.7515L253.291 44.3377L274.234 40.0755L292.256 42.3212L300.583 47.7062L308.472 45.4606L320.629 47.0302L337.064 46.5834L349.462 40.3047L358.916 29.7638L363.873 7.99466L369.612 1.81909L372.545 7.88009L377.502 18.4324L378.399 28.9733L386.622 42.7681L396.754 72.1679L401.481 87.6469L412.971 107.617L425.357 133.419L450.579 165.054L449.452 169.98L458.009 180.533L456.882 187.029L483.23 235.952L486.83 254.101L472.419 262.648L463 270.726L451.258 261.972L442.022 264.665L429.406 259.956L421.079 267.586L409.141 259.727L404.863 267.357L392.027 262.946L386.622 260.254L380.538 259.807L370.635 251.649H359.813L353.062 244.775L341.572 244.694L348.105 233.707L323.102 230.785L312.072 236.399L307.564 226.076L296.534 225.893L292.923 238.267L279.639 239.092L274.464 240.432L271.543 231.908L272.21 222.261L275.143 219.121L275.373 204.765L281.595 187.659L281.227 179.857L284.378 177.164L286.172 172.455L282.618 168.537L274.475 166.394L258.248 155.177H251.036L253.521 145.977L246.758 140.363L252.394 134.313L252.164 123.715L263.653 116.359L262.756 104.466L256.235 100.88L254.613 97.1337L244.285 90.3394L245.194 80.4631L243.837 75.5249L228.299 78.2174L224.458 65.8777L210.725 60.275L199.029 45.0137L210.047 41.6452Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="경상북도" d="M481.264 504.297L493.903 466.82L494.57 458.742L501.551 447.972L504.346 437.535L500.206 434.052L496.594 439.219L484.012 447.205L476.813 439.322L483.759 430.019L480.378 392.77L488.268 377.074L489.843 341.395L497.721 321.196L492.995 303.482V271.619L486.83 254.101L472.419 262.648L463 270.726L451.257 261.972L442.022 264.665L429.405 259.956L421.079 267.586L409.141 259.726L404.862 267.357L392.027 262.946L382.194 265.111L374.902 272.742L364.77 277.99L358.479 289.206L361.17 295.588L350.163 302.841L333.464 290.467L327 298.556L319.295 295.623L314.763 298.544L308.725 298.922L304.424 307.378L308.898 313.599L304.286 315.616L299.685 311.422L282.871 316.945L289.243 323.155L288.012 328.471L281.893 323.522L270.254 330.304L279.053 336.205L283.446 343.733L279.421 348.671L277.845 365.605L279.869 370.176L273.567 377.612L273.498 381.783L278.075 384.762L280.41 380.912L287.598 388.382L297.995 386.87L299.801 398.155L290.519 397.491L290.002 406.92L282.791 421.804L273.636 425.527L274.188 429.893L276.775 436.366L272.497 444.123L279.041 453.357L291.209 459.602L300.479 459.682L303.492 466.809L311.612 474.829L312.693 483.995L306.586 488.841L312.82 492.84L330.393 492.164L339.56 499.164L335.5 483.903L343.067 485.702L344.689 483.181L339.111 476.272L343.389 468.424L350.14 467.53L352.004 464.471L340.077 458.96L347.886 446.437L354.097 443.894L352.165 452.269L355.546 454.286L358.479 452.04L362.079 440.823L369.957 439.7L375.592 437.237L382.803 436.332L388.301 439.104L389.474 443.951L389.784 450.883L391.13 454.068L388.784 462.535L384.598 463.257L383.24 466.408L382.93 470.681L379.871 474.027L380.101 477.178L378.513 484.35L369.06 485.702V482.104L361.618 482.631L355.316 490.697L358.099 499.313L387.3 511.252L404.264 502.006L418.675 505.81L422.033 502.716L430.372 501.376L435.674 491.568L446.358 490.617L456.939 494.421L455.593 500.929L462.126 502.728L466.853 500.482L473.592 500.253L481.264 504.297Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="충청북도" d="M274.464 240.432L279.639 239.092L292.923 238.267L296.534 225.893L307.564 226.042L312.072 236.399L323.102 230.785L348.105 233.707L341.572 244.694L353.062 244.774L359.813 251.649H370.635L380.538 259.807L386.622 260.253L392.027 262.946L382.194 265.203L374.902 272.742L364.77 277.99L358.479 289.206L361.17 295.588L350.164 302.841L333.464 290.467L327 298.556L319.295 295.623L314.763 298.544L308.725 298.922L304.424 307.378L308.898 313.599L304.286 315.616L299.686 311.423L282.871 316.945L289.243 323.155L288.012 328.471L281.893 323.522L270.254 330.304L279.053 336.205L283.446 343.733L279.421 348.671L277.845 365.605L279.869 370.176L273.567 377.612L273.498 381.783L278.075 384.762L280.41 380.912L287.598 388.382L297.995 386.87L299.801 398.155L290.462 397.594L290.002 406.92L282.791 421.804L273.567 425.608L270.254 423.305L260.49 425.837L256.798 423.408L253.969 423.362L250.461 417.771L247.678 417.897L246.447 420.452L245.033 420.096L243.837 416.854L240.122 412.225L238.144 402.67L240.053 401.467L237.994 394.191L233.014 385.896L226.505 385.415L224.584 382.172L231.554 362.42L234.946 359.75L234.268 357.046L228.954 356.084V350.527L225.93 346.047L221.18 349.988L217.821 349.037L216.016 343.32L212.013 342.713V335.586L209.863 332.607L210.058 330.866L207.091 327.818L203.71 320.852L201.007 318.618L204.561 309.234L213.819 300.779L219.581 301.626L222.042 298.315L210.323 278.517L206.228 275.435L209.161 270.496L216.993 268.847L235.061 253.677L244.745 255.464L256.177 245.198L259.375 238.416L263.078 241.417L265.873 236.25L271.543 231.908L274.464 240.432Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="충청남도" d="M226.505 385.415L219.397 392.942L215.567 391.04L214.762 388.038L212.197 386.434V380.603L210.392 380.144L209.092 385.713L204.308 392.266L198.81 386.331L198.672 379.927L195.164 377.521L195.682 371.322L198.672 367.587L197.994 365.502L200.052 356.118L194.244 346.207L197.407 341.727L194.681 339.997L192.899 329.835L185.239 318.835L187.493 311.434L185.239 304.479L188.206 302.841L195.153 306.496L204.561 309.234L213.819 300.778L219.581 301.626L222.042 298.315L210.323 278.517L206.228 275.435L195.866 266.234L186.642 262.648L177.844 266.91L163.859 268.698L154.209 273.418L145.917 273.132L137.13 255.418L131.955 258.317L129.609 252.898L118.66 250.251L107.4 241.498L103.685 241.624L100.465 246.103L101.443 252.004L103.478 257.126L102.374 257.882L98.1419 250.664L91.6668 247.604L85.6403 247.364L80.6259 250.48L86.2844 253.746L82.857 255.877L87.9865 260.047L90.3672 260.849L90.7928 263.748L84.5707 269.568L76.198 280.281L72.3681 278.425L78.5787 265.501L77.0375 263.702L78.1301 256.163L76.1405 253.299L71.5861 267.128L68.6878 268.812L65.0765 263.324L60.8211 265.936L61.2696 273.968L59.8435 275.606L56.6922 274.827L52.6554 277.898L47.7214 291.097L48.1585 292.506L51.8618 292.323L52.0228 286.147L57.3593 288.565L60.108 293.606L52.9659 295.863L52.8969 298.762L58.6474 299.931L62.8338 298.498L64.858 295.313L68.7108 294.992L67.3997 300.767L71.3675 304.342L69.0558 313.29L73.1732 319.145L74.1853 344.958L85.3643 346.952L79.0272 321.413L81.2354 317.483L75.2089 312.843L76.888 311.044L77.7966 304.433L79.7173 302.99L81.799 311.56L86.0313 314.653L88.9871 312.797L91.9544 306.965L93.668 308.421L91.8739 316.681L95.7037 343.606L92.9664 349.782L100.879 357.287V359.292L94.2776 362.053L97.0493 382.86L89.7692 391.052L90.9883 393.618L94.105 391.04L101.949 393.756L107.964 401.1L106.779 403.77L111.702 416.281L117.038 419.237L140.604 407.436L141.846 399.336L147.608 396.54L155.164 396.987L161.248 399.45L167.102 409.773L173.405 412.237L175.969 408.822L181.513 407.757L188.08 409.132L193.911 406.187L199.305 404.835L211.634 423.27L214.555 422.606L217.937 428.437L226.436 427.853L227.85 421.93L235.43 423.018L236.499 426.776L240.11 422.606L239.455 417.221L243.837 416.854L240.122 412.225L238.144 402.67L240.053 401.467L237.994 394.191L233.014 385.896L226.505 385.415Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="세종특별자치시" d="M204.561 309.234L201.007 318.618L203.71 320.852L207.091 327.818L210.058 330.866L209.863 332.607L212.013 335.586V342.713L210.84 349.633L209.253 350.928L207.919 354.8L200.052 356.118L194.244 346.207L197.407 341.727L194.681 339.997L192.899 329.835L185.239 318.835L187.493 311.434L185.239 304.479L188.206 302.841L195.153 306.496L204.561 309.234Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="대전광역시" d="M200.052 356.118L207.919 354.8L209.253 350.928L210.84 349.633L212.013 342.713L216.016 343.32L217.821 349.037L221.18 349.988L225.93 346.047L228.954 350.527V356.084L234.268 357.046L234.946 359.75L231.554 362.42L224.584 382.172L226.505 385.415L219.397 392.942L215.567 391.04L214.762 388.039L212.197 386.435V380.603L210.392 380.144L209.092 385.713L204.308 392.266L198.81 386.331L198.672 379.927L195.164 377.521L195.682 371.322L198.672 367.587L197.994 365.502L200.052 356.118Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="대구광역시" d="M361.619 482.631L369.06 482.104V485.702L378.514 484.35L380.101 477.178L379.871 474.027L382.93 470.681L383.24 466.408L384.598 463.257L388.784 462.535L391.13 454.068L389.785 450.883L389.474 443.951L388.301 439.105L382.803 436.332L375.592 437.237L369.957 439.7L362.079 440.823L358.479 452.04L355.546 454.286L352.165 452.269L354.097 443.894L347.886 446.437L340.077 458.96L352.004 464.471L350.141 467.53L343.389 468.424L339.111 476.273L344.689 483.181L343.067 485.702L335.5 483.903L339.56 499.164L350.819 496.472L355.316 490.697L361.619 482.631Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="울산광역시" d="M459.136 556.349L456.663 554.332L454.19 547.377L446.496 545.327L444.161 538.326L439.204 536.699L432.361 528.06L420.515 521.724L416.858 516.465L422.769 511.183L422.033 502.716L430.372 501.376L435.674 491.568L446.358 490.617L456.939 494.421L455.593 500.929L462.126 502.728L466.853 500.482L473.592 500.253L481.264 504.297L481.206 506.761L483.012 511.252L481.666 515.743L481.885 522.469L478.963 528.977L474.455 532.116L473.109 526.731L471.683 524.13L471.752 531.669L465.898 535.702L467.704 538.624L467.474 544.685L465.001 548.718L466.347 550.517L462.597 552.797L459.136 556.349Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="부산광역시" d="M446.496 545.327L454.19 547.378L456.663 554.332L459.136 556.349L453.857 558.216L449.233 567.336L449.452 570.258L438.871 583.503L432.338 581.922L429.187 585.737L430.993 588.876L430.935 591.569L426.484 591.351L423.103 587.983L415.673 597.412L412.522 595.384L411.395 600.322L408.244 601.216L406.887 596.954L408.692 585.29L402.93 591.5L399.434 589.151L395.409 592.245L391.004 591.122L391.13 586.722L386.909 580.959L403.908 570.682L411.959 570.854L416.203 568.253L418.077 564.197L433.132 556.039L435.754 549.554L443.046 549.99L446.496 545.327Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="경상남도" d="M272.497 444.123L262.388 453.506L253.164 454.538L241.456 466.408L234.164 484.969L234.199 489.884L228.425 500.23L234.578 510.92L233.336 516.076L236.637 519.971L228.736 529.825L229.207 534.786L222.445 540.171L225.907 549.085L227.712 563.888L233.589 569.742L239.639 582.506L245.251 586.676L246.769 593.001L242.652 598.684L255.2 603.026L258.892 602.797L264.838 597.286L265.321 595.075L267.793 596.198L268.242 598.89L272.095 597.676L274.326 598.89L277.132 597.263L274.498 590.824L276.799 589.919L278.846 590.492L280.145 586.39L285.091 584.946L282.434 589.243L282.216 599.784L280.881 606.509L289.795 611.218L291.968 615.297L293.245 615.939L297.098 614.243L299.778 615.492L301.319 615.263L303.849 609.076L309.692 609.557L312.613 614.369L316.742 612.376L320.042 607.185L322.297 613.693L317.041 616.088L318.248 619.525L323.067 621.003L324.999 619.525L327.024 621.278L326.794 628.725L321.492 627.373L320.042 628.954L324.585 632.793L327.208 639.369L329.738 640.538L332.061 638.636L333.165 632.735L331.854 628.806L334.787 627.488L338.628 620.155L336.259 617.222L333.947 621.324L331.808 620.419L334.545 606.532L334.235 603.828L341.216 602.476L344.252 598.936L338.962 593.952L330.635 595.522L328.887 598.214L325.448 598.661L328.312 593.345L340.296 589.403L339.18 585.794L351.578 584.981L354.12 586.699L355.857 594.181L361.998 591.706L355.857 572.194L359.422 567.565L361.032 568.379L359.917 574.841L362.159 579.813L366.645 580.478L369.807 584.076L371.21 580.26L373.189 581.841L372.2 587.318L377.697 589.69L385.196 588.384L386.035 590.583L391.004 591.122L391.13 586.722L386.909 580.959L403.908 570.682L411.924 570.842L416.202 568.253L418.077 564.197L433.097 556.039L435.754 549.554L443.011 549.978L446.496 545.327L444.161 538.326L439.204 536.699L432.361 528.06L420.515 521.724L416.858 516.465L422.77 511.183L422.033 502.716L418.675 505.81L404.264 502.006L387.3 511.252L358.099 499.313L355.316 490.697L350.647 496.598L339.56 499.164L330.393 492.164L312.843 492.771L306.586 488.841L312.693 483.995L311.612 474.829L303.492 466.809L300.479 459.682L291.209 459.602L279.041 453.358L272.497 444.123Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="전라남도" d="M238.224 616.271L235.165 615.859L225.619 619.64L224.043 615.824L217.81 608.721L222.019 601.239L224.055 605.272L229.127 606.991L239.593 598.1L242.675 598.695L246.781 593.012L245.263 586.677L239.65 582.517L233.601 569.754L227.724 563.899L225.918 549.096L222.456 540.182L212.554 530.764L203.146 532.162L199.04 538.395L191.875 536.791L186.872 538.842L178.764 536.149L178.442 533.709L170.656 532.105L159.707 536.711L152.369 532.529L155.796 526.273L152.197 521.781L153.324 515.503L150.69 509.934L146.113 512.81L143.41 518.871L135.302 516.179L133.277 509.442L123.145 503.828L114.14 508.766L114.439 513.796L109.183 518.195L110.08 521.781L99.1539 527.911L94.197 524.096L89.2515 525.723L90.4821 530.077L82.972 529.126L82.6039 520.2L79.2111 518.573L79.0041 511.447L73.1156 508.709L68.4347 513.509L69.5618 516.649L72.1725 518.39L71.0914 519.353L66.445 518.172L61.0855 529.068L56.7611 531.222L51.9997 541.992L60.89 543.608L58.0838 548.271L64.7314 560.279L69.3433 562.18V565.767L64.1678 571.828L62.6152 565.526L54.4839 564.655L53.4143 566.03L55.8296 569.364L59.7744 571.679L58.7508 574.073L54.2539 575.643L53.3453 578.782L47.8364 580.822L46.8243 586.631L52.4483 590.446L54.9325 588.212L57.6352 581.246L58.7623 588.647L59.6594 600.987L54.2539 608.618L54.2884 613.155L52.4368 618.047L64.6048 623.879L76.4279 634.408L73.1616 634.878L70.4589 632.862L69.5618 636.906L63.2592 627.488L54.0239 623.455L52.4483 629.516L55.151 634.901L58.7623 636.241L61.4651 642.967L57.1867 642.52L50.8726 634.443L47.7213 621.656L43.5465 615.95L37.1289 627.488L40.2572 641.019L44.5586 647.012L46.8128 646.336L50.5736 648.879L51.7697 652.649L54.4724 652.397L57.1752 650.151L63.2592 658.457L61.9251 669.537L66.859 671.015L63.9263 677.74L60.9015 680.8L61.6836 682.908L66.6405 683.584L66.7785 691.535L76.7729 690.321L80.8328 684.042L80.6028 680.674L95.0135 672.825L93.6564 667.44L99.959 665.87L103.375 660.039L102.869 645.877L105.376 643.654L107.182 647.47L106.963 656.441L104.939 665.859L108.09 671.244L116.877 675.277L118.901 671.691L125.204 673.49L127.458 668.998L130.609 669.674L129.885 660.382L133.542 658.904L134.255 656.235L133.082 654.081L136.245 645.442L142.996 643.643L148.183 638.934L155.382 635.348L159.96 636.837L163.939 635.577L167.09 629.069L172.266 627.946L174.29 630.41H181.501L182.18 636.688L180.156 641.844L175.67 642.44L174.52 636.688L169.575 636.917L167.55 644.101L169.103 648.02L165.975 653.978L162.145 653.302L163.272 648.363L161.627 646.714L156.509 663.843L169.115 666.088L171.599 672.596L175.199 677.305L183.307 675.506L186.688 669.228L192.324 665.641L193.221 661.597L188.494 658.973L189.172 655.994L196.832 656.67L199.753 658.469L202.824 655.88L201.329 647.023L188.379 634.397L188.724 630.203L191.875 627.064L189.621 624.372L194.348 619.88L190.944 617.509L192.542 616.294H200.65L206.056 614.278L206.504 610.015L209.207 612.032L210.104 621.003L214.348 624.177L216.407 630.203L212.807 636.711L210.817 644.8L213.025 649.28L216.694 649.223L221.352 651.961L222.249 647.47L221.122 643.654L223.595 635.806L227.425 632.438L232.336 636.998L238.684 634.019L239.363 629.081L242.066 625.265L243.871 619.204L241.629 615.836L238.247 616.283L238.224 616.271ZM145.871 561.275L143.617 563.968L142.938 567.554C141.604 568.883 135.727 571.816 135.727 571.816H131.449L128.516 569.8C126.779 570.59 121.305 571.816 121.305 571.816L118.372 573.833L110.494 572.939L110.275 569.8L111.563 568.562L107.124 564.415L95.1861 563.074L97.0492 558.995L96.9917 554.767L100.373 553.198L98.5674 548.707C99.8555 548.328 105.997 546.908 105.997 546.908V544.215L110.505 541.523H113.887V545.109L116.589 546.461L117.602 545.349L134.163 542.646L138.671 548.707V552.293L142.559 555.146L145.883 558.571V561.264L145.871 561.275Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-miterlimit="10"/>
-<path id="광주광역시" d="M98.5788 548.707C99.8669 548.329 106.008 546.908 106.008 546.908V544.215L110.517 541.523H113.898V545.109L116.601 546.461L117.613 545.35L134.174 542.646L138.683 548.707V552.293L142.57 555.146L145.894 558.572V561.264L143.64 563.957L142.961 567.543C141.627 568.872 135.762 571.805 135.762 571.805H131.483L128.55 569.789C126.814 570.579 121.339 571.805 121.339 571.805L118.407 573.822L110.528 572.928L110.31 569.789L111.598 568.551L107.159 564.403L95.2205 563.063L97.0836 558.984L97.0261 554.756L100.407 553.187L98.6018 548.695L98.5788 548.707Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-<path id="제주특별자치도" d="M50.8266 732.613L44.9726 734.641H36.1858L33.2646 738.009L20.1994 742.718L14.794 748.321L1.49878 759.091L3.75298 772.107L17.0482 783.095L21.5451 778.615L45.1911 778.844L50.8266 781.983L64.1103 779.062L69.2973 776.151L84.3866 775.693L91.8163 772.336L95.1976 771.878L99.9245 763.353L109.16 754.165L108.481 740.026L96.0947 730.379L83.248 729.027L77.854 730.597L65.2374 730.826L50.8266 732.613Z" fill="white" stroke="#E2EDF3" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
diff --git a/apps/dm/public/next.svg b/apps/dm/public/next.svg
deleted file mode 100644
index 5174b28c5..000000000
--- a/apps/dm/public/next.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>
\ No newline at end of file
diff --git a/apps/dm/public/vercel.svg b/apps/dm/public/vercel.svg
deleted file mode 100644
index 770539603..000000000
--- a/apps/dm/public/vercel.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1155 1000"><path d="m577.3 0 577.4 1000H0z" fill="#fff"/></svg>
\ No newline at end of file
diff --git a/apps/dm/public/window.svg b/apps/dm/public/window.svg
deleted file mode 100644
index b2b2a44f6..000000000
--- a/apps/dm/public/window.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg fill="none" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill-rule="evenodd" clip-rule="evenodd" d="M1.5 2.5h13v10a1 1 0 0 1-1 1h-11a1 1 0 0 1-1-1zM0 1h16v11.5a2.5 2.5 0 0 1-2.5 2.5h-11A2.5 2.5 0 0 1 0 12.5zm3.75 4.5a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5M7 4.75a.75.75 0 1 1-1.5 0 .75.75 0 0 1 1.5 0m1.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5" fill="#666"/></svg>
\ No newline at end of file
diff --git a/apps/dm/src/shared/lib/index.ts b/apps/dm/src/shared/lib/index.ts
index a5679f1b5..c9cff1a80 100644
--- a/apps/dm/src/shared/lib/index.ts
+++ b/apps/dm/src/shared/lib/index.ts
@@ -2,7 +2,7 @@ export { getCookie, setCookie, removeCookie } from "./cookie";
 // export { useMutationWrapper } from "./use-mutation-wrapper";
 // export { useAlertStore } from "./use-alert-store";
 // export { useDataTable } from "./use-data-table";
-// export { useMenuStore } from "./use-menu-store";
+export { useMenuStore } from "./use-menu-store";
 // export { useUserStore } from "./use-user-store";
 // export { usePrompt } from "./use-prompt";
 // export { useSelectPrompt } from "./use-select-prompt";
diff --git a/apps/dm_new/src/shared/lib/use-menu-store.ts b/apps/dm/src/shared/lib/use-menu-store.ts
similarity index 100%
rename from apps/dm_new/src/shared/lib/use-menu-store.ts
rename to apps/dm/src/shared/lib/use-menu-store.ts
diff --git a/apps/dm_new/src/shared/providers/index.ts b/apps/dm/src/shared/providers/index.ts
similarity index 100%
rename from apps/dm_new/src/shared/providers/index.ts
rename to apps/dm/src/shared/providers/index.ts
diff --git a/apps/dm_new/src/shared/providers/prompt-provider.tsx b/apps/dm/src/shared/providers/prompt-provider.tsx
similarity index 100%
rename from apps/dm_new/src/shared/providers/prompt-provider.tsx
rename to apps/dm/src/shared/providers/prompt-provider.tsx
diff --git a/apps/dm_new/src/shared/providers/store-provider.tsx b/apps/dm/src/shared/providers/store-provider.tsx
similarity index 100%
rename from apps/dm_new/src/shared/providers/store-provider.tsx
rename to apps/dm/src/shared/providers/store-provider.tsx
diff --git a/apps/dm_new/src/shared/store/alert-store.ts b/apps/dm/src/shared/store/alert-store.ts
similarity index 100%
rename from apps/dm_new/src/shared/store/alert-store.ts
rename to apps/dm/src/shared/store/alert-store.ts
diff --git a/apps/dm_new/src/shared/store/attachment-store.ts b/apps/dm/src/shared/store/attachment-store.ts
similarity index 100%
rename from apps/dm_new/src/shared/store/attachment-store.ts
rename to apps/dm/src/shared/store/attachment-store.ts
diff --git a/apps/dm_new/src/shared/store/index.ts b/apps/dm/src/shared/store/index.ts
similarity index 100%
rename from apps/dm_new/src/shared/store/index.ts
rename to apps/dm/src/shared/store/index.ts
diff --git a/apps/dm_new/src/shared/store/menu-store.ts b/apps/dm/src/shared/store/menu-store.ts
similarity index 100%
rename from apps/dm_new/src/shared/store/menu-store.ts
rename to apps/dm/src/shared/store/menu-store.ts
diff --git a/apps/dm_new/src/shared/store/user-store.ts b/apps/dm/src/shared/store/user-store.ts
similarity index 100%
rename from apps/dm_new/src/shared/store/user-store.ts
rename to apps/dm/src/shared/store/user-store.ts
diff --git a/apps/dm/tsconfig.json b/apps/dm/tsconfig.json
index 493584782..ba8cd2c2f 100644
--- a/apps/dm/tsconfig.json
+++ b/apps/dm/tsconfig.json
@@ -40,6 +40,7 @@
   "include": [
     ".eslintrc.*",
     "next-env.d.ts",
+    "**/*.d.ts",
     "**/*.ts",
     "**/*.tsx",
     "**/*.mts",
diff --git a/apps/dm_new/types/style.d.ts b/apps/dm/types/style.d.ts
similarity index 100%
rename from apps/dm_new/types/style.d.ts
rename to apps/dm/types/style.d.ts
diff --git a/apps/dm_new/.env.local b/apps/dm_new/.env.local
deleted file mode 100644
index 58001643c..000000000
--- a/apps/dm_new/.env.local
+++ /dev/null
@@ -1,26 +0,0 @@
-NEXT_PUBLIC_SITE_ID = DN
-NEXT_PUBLIC_PORT = 3015
-NEXT_PUBLIC_CLAIM_NAME = Authorization
-NEXT_PUBLIC_AUTH_USER_ID = token-id
-NEXT_PUBLIC_ACCESS_TOKEN = access-token
-NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
-NEXT_PUBLIC_PROXY_HOST = http://localhost:3005
-NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
-NEXT_PUBLIC_SERVER_API_URL = http://dev.onasys.co.kr:8000
-NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
-NEXT_PUBLIC_DM_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
-# NEXT_PUBLIC_FO_SERVER_API_URL = http://192.168.1.222:8883/operation-service/api/v1
-NEXT_PUBLIC_FO_SERVER_API_URL = http://con.mind-one.co.kr:11083/operation-service/api/v1
-NEXT_PUBLIC_WR_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
-NEXT_PUBLIC_GEOSERVER_URL = http://rsone.iptime.org:10010/geoserver
-NEXT_PUBLIC_LX_GEOSERVER_URL = http://con.mind-one.co.kr:11306/geoserver
-NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
-NEXT_PUBLIC_NGII_URL = https://map.ngii.go.kr
-NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={x}&tilerow={y}
-NEXT_PUBLIC_GATEWAY_URL=http://con.mind-one.co.kr:11083  # 개발 서버 API
-#NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.128:8883/sewerage-service/api          # 최용성 
-#NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.66:8883/sewerage-service/api          # 박이정
-
-
-NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
-NEXT_PRIVATE_WR_ADDRESS_KEY = devU01TX0FVVEgyMDI1MDgyNTEwMzkwNDExNjEwNTM=
diff --git a/apps/dm_new/.env.mindone b/apps/dm_new/.env.mindone
deleted file mode 100644
index 9a5005d2b..000000000
--- a/apps/dm_new/.env.mindone
+++ /dev/null
@@ -1,26 +0,0 @@
-NEXT_PUBLIC_SITE_ID = DN
-NEXT_PUBLIC_PORT = 11315
-NEXT_PUBLIC_CLAIM_NAME = Authorization
-NEXT_PUBLIC_AUTH_USER_ID = token-id
-NEXT_PUBLIC_ACCESS_TOKEN = access-token
-NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
-NEXT_PUBLIC_PROXY_HOST = http://con.mind-one.co.kr:11315
-NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
-NEXT_PUBLIC_SERVER_API_URL = http://dev.onasys.co.kr:8000
-NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
-NEXT_PUBLIC_DM_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
-NEXT_PUBLIC_FO_SERVER_API_URL = http://con.mind-one.co.kr:11083/operation-service/api/v1
-NEXT_PUBLIC_WR_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/api/v1
-#NEXT_PUBLIC_GEOSERVER_URL = http://rsone.iptime.org:10010/geoserver
-#NEXT_PUBLIC_LX_GEOSERVER_URL = http://con.mind-one.co.kr:11306/geoserver
-NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
-NEXT_PUBLIC_NGII_URL = https://map.ngii.go.kr
-NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={x}&tilerow={y}
-NEXT_PUBLIC_SEWERAGE_API_URL=http://con.mind-one.co.kr:11083/sewerage-service   # 개발 서버 API
-NEXT_PUBLIC_GATEWAY_URL=http://con.mind-one.co.kr:11083  # 개발 서버 API
-# NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.128:8883/sewerage-service/api          # 최용성 
-#NEXT_PUBLIC_SEWERAGE_API_URL=http://192.168.1.66:8883/sewerage-service/api          # 박이정
-
-
-NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
-NEXT_PRIVATE_WR_ADDRESS_KEY = devU01TX0FVVEgyMDI1MDgyNTEwMzkwNDExNjEwNTM=
diff --git a/apps/dm_new/.env.production b/apps/dm_new/.env.production
deleted file mode 100644
index b413d1312..000000000
--- a/apps/dm_new/.env.production
+++ /dev/null
@@ -1,24 +0,0 @@
-# 공단 운영
-NEXT_PUBLIC_SITE_ID = DN
-NEXT_PUBLIC_PORT = 3000
-NEXT_PUBLIC_CLAIM_NAME = Authorization
-NEXT_PUBLIC_AUTH_USER_ID = token-id
-NEXT_PUBLIC_ACCESS_TOKEN = access-token
-NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
-#NEXT_PUBLIC_PROXY_HOST = https://devreuse.hasuon.or.kr
-#NEXT_PUBLIC_CM_LOGIN_PAGE_URL = https://devqueen.hasuon.or.kr/auth/login
-NEXT_PUBLIC_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
-NEXT_PUBLIC_CS_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
-NEXT_PUBLIC_FO_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/operation-service/api/v1
-NEXT_PUBLIC_WR_SERVER_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/reuse-service/api/v1
-NEXT_PUBLIC_GEOSERVER_URL = http://172.29.143.87:8080/geoserver
-NEXT_PUBLIC_LX_GEOSERVER_URL = http://172.29.143.87:8080/geoserver_swl
-NEXT_PUBLIC_CS_TUS_UPLOAD = /attach-service/api/v1/tus/upload
-NEXT_PUBLIC_SEWERAGE_API_URL = http://apigateway.iipbs-was.svc.cluster.local:8000/sewerage-service
-NEXT_PUBLIC_NGII_URL = http://172.29.143.87/poiact
-NEXT_PUBLIC_NGII_PARAM = BDE2BEF39DAFEC293AB6730150F222AC&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={y}&tilerow={x}
-NEXT_PUBLIC_GATEWAY_URL = http://apigateway.iipbs-was.svc.cluster.local:8000
-
-
-NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
-NEXT_PRIVATE_WR_ADDRESS_KEY = U01TXOFVVEgyMDI1MDgyODE0MTAxNzExNjEyMjA=
diff --git a/apps/dm_new/AGENTS.md b/apps/dm_new/AGENTS.md
deleted file mode 100644
index 7eefb1676..000000000
--- a/apps/dm_new/AGENTS.md
+++ /dev/null
@@ -1,38 +0,0 @@
-## Project
-This repository contains a Next.js web application.
-
-Main technologies:
-- Next.js
-- TypeScript
-- pnpm workspace
-- turborepo
-
-이 저장소는 pnpm workspace + Turborepo 기반 monorepo이다.
-
-- 워크스페이스 범위는 `apps/*`, `apps/common/*`, `packages/*`, `packages/common/*`
-- 루트 스크립트는 `turbo run build`, `turbo run dev` 를 사용한다
-- `build` 작업은 의존 패키지의 `build` 를 먼저 수행한다 (`dependsOn: ["^build"]`)
-- `dev` 는 캐시하지 않는 지속 실행 작업이다
-- 변경 범위만 선택 실행할 수 있으므로, 전체 빌드보다 `--filter` 사용을 우선한다
-
-## Encoding 
-- UTF-8 
-- 한글이 깨지지 않도록 주의할 것
-
-## 주석 comment
-- 한글 주석을 삭제하지 말 것
-
-## Monorepo structure
-apps/
-  _template
-  as
-  cm
-  cs
-  dc
-  dm
-  dm_new
-  fo
-  sn
-  st
-  wr
-
diff --git a/apps/dm_new/app/(with-layout)/apply/register/page.tsx b/apps/dm_new/app/(with-layout)/apply/register/page.tsx
deleted file mode 100644
index 3c084bf73..000000000
--- a/apps/dm_new/app/(with-layout)/apply/register/page.tsx
+++ /dev/null
@@ -1,500 +0,0 @@
-// app/(with-layout)/apply/register/page.tsx
-/**
- *  수요정보등록(수정) 화면
- *
- * 🔗 사용 API
- * - 수요정보등록: POST /reuseFc/request/demandInfo
- * - 수요정보조회: GET  /reuseFc/request/' + dmdInfoId - getSdmInfoStatusList
- */
-"use client";
-
-import { useMemo, useState, useRef } from "react";
-import SubPageHeader from "@/components/SubPageHeader";
-import WaterQualityRefModal from "../modal/WaterQualityRefModal";
-import CandidateSiteModal, { type CandidateSite } from "@/components/CandidateSiteModal";
-
-type PHRange = { min: string; max: string };
-
-export default function DemandRegisterPage() {
-  const today = useMemo(() => {
-    const d = new Date();
-    const yyyy = d.getFullYear();
-    const mm = String(d.getMonth() + 1).padStart(2, "0");
-    const dd = String(d.getDate()).padStart(2, "0");
-    return `${yyyy}-${mm}-${dd}`;
-  }, []);
-
-  const [openRef, setOpenRef] = useState(false);
-
-  const [openCand, setOpenCand] = useState(false);
-  const [selectedCands, setSelectedCands] = useState<CandidateSite[]>([]);
-
-  // 기본정보
-  const [reqDate, setReqDate] = useState<string>(today);
-  const [reqQty, setReqQty] = useState<string>("");
-  const [usePurpose, setUsePurpose] = useState<string>("");
-  const [hopePrice, setHopePrice] = useState<string>("");
-
-  // 요구수질
-  const [coliform, setColiform] = useState<string>("");
-  const [noDetect, setNoDetect] = useState<boolean>(false);
-
-  const [tn, setTn] = useState<string>("");
-  const [residualCl, setResidualCl] = useState<string>("");
-  const [tp, setTp] = useState<string>("");
-  const [turbidity, setTurbidity] = useState<string>("");
-  const [ph, setPh] = useState<PHRange>({ min: "", max: "" });
-  const [bod, setBod] = useState<string>("");
-  const [chloride, setChloride] = useState<string>("");
-  const [odor, setOdor] = useState<string>("불쾌하지 않을 것");
-  const [ec, setEc] = useState<string>("");
-  const [color, setColor] = useState<string>("");
-  const [remark, setRemark] = useState<string>("");
-
-  // 공급처 후보지 선택(필수아님)
-  const [cand1, setCand1] = useState("");
-  const [cand2, setCand2] = useState("");
-  const [cand3, setCand3] = useState("");
-
-  return (
-    <>
-    
-        <main className="bg-white">
-
-            {/* 서브 타이틀 + 브레드크럼 */}
-            <SubPageHeader
-                title="수요정보등록"
-                crumbs={[
-                { label: "Home", href: "/reuse" },
-                { label: "수요신청", href: "/reuse/apply" },
-                { label: "수요정보등록" },
-                ]}
-            />
-
-            {/* 컨텐츠 영역 */}
-            <div>
-
-                {/* 기본정보 테이블 */}
-                <div className="border border-neutral-200 bg-white">
-                    <FormRow label="요구시기" required>
-                        <DateInput value={reqDate} onChange={setReqDate} />
-                    </FormRow>
-
-                    <Divider />
-
-                    <FormRow label="요구수량(m²/d)" required>
-                        <TextInput value={reqQty} onChange={setReqQty} placeholder="" />
-                    </FormRow>
-
-                    <Divider />
-
-                    <FormRow label="사용용도" required>
-                        <TextInput value={usePurpose} onChange={setUsePurpose} />
-                    </FormRow>
-
-                    <Divider />
-
-                    <FormRow label="희망단가(원)" required>
-                        <TextInput value={hopePrice} onChange={setHopePrice} />
-                    </FormRow>
-                </div>
-
-                {/* 요구수질 섹션 타이틀 바 */}
-                <div className="grid grid-cols-12">
-                    <div className="col-span-12 lg:col-span-2 inline-flex justify-center items-center gap-3 px-6 py-6 text-center">
-                        <span className="text-lg font-semibold text-neutral-800">요구수질</span>
-                        <button
-                            type="button"
-                             onClick={() => setOpenRef(true)}
-                            className="rounded border-[2px] border-[#DE3412] px-2 py-3 text-[15px] font-medium text-[#4F4F4F] hover:bg-orange-50"
-                        >
-                            수질기준 참고
-                        </button>
-                        {/* 수질기준참고 모달 */}
-                        <WaterQualityRefModal
-                            open={openRef}
-                            onClose={() => setOpenRef(false)}
-                            imageSrc="/images/landing/water_quality_ref_1.png"
-                        />
-                    </div>
-                </div>
-
-                {/* 요구수질 테이블 */}
-                <div className="border border-neutral-200 bg-white">
-                    {/* 1행 */}
-                    <QualityRow
-                        leftLabel="총대장균군수(개/mg)"
-                        leftRequired
-                        leftControl={
-                        <div className="flex items-center gap-4">
-                            <TextInput
-                            value={coliform}
-                            onChange={setColiform}
-                            disabled={noDetect}
-                            className={noDetect ? "bg-neutral-100 text-neutral-400" : ""}
-                            />
-                            <label className="flex items-center gap-2 text-sm text-neutral-700">
-                            <input
-                                type="checkbox"
-                                checked={noDetect}
-                                onChange={(e) => {
-                                setNoDetect(e.target.checked);
-                                if (e.target.checked) setColiform("");
-                                }}
-                                className="h-4 w-4 rounded border-neutral-300"
-                            />
-                            불검출
-                            </label>
-                        </div>
-                        }
-                        rightLabel="총질소(T-N)(mg/L)"
-                        rightControl={
-                        <InlineSuffixInput value={tn} onChange={setTn} suffix="이하" />
-                        }
-                    />
-                    <Divider />
-
-                    {/* 2행 */}
-                    <QualityRow
-                        leftLabel="결합잔류염소(mg/L)"
-                        leftRequired
-                        leftControl={<TextInput value={residualCl} onChange={setResidualCl} />}
-                        rightLabel="총인(T-P)(mg/L)"
-                        rightControl={
-                        <InlineSuffixInput value={tp} onChange={setTp} suffix="이하" />
-                        }
-                    />
-                    <Divider />
-
-                    {/* 3행 */}
-                    <QualityRow
-                        leftLabel="탁도(NTU)"
-                        leftRequired
-                        leftControl={
-                        <InlineSuffixInput value={turbidity} onChange={setTurbidity} suffix="이하" />
-                        }
-                        rightLabel="수소이온농도(pH)"
-                        rightControl={
-                        <div className="flex items-center gap-2">
-                            <TextInput
-                            value={ph.min}
-                            onChange={(v) => setPh((p) => ({ ...p, min: v }))}
-                            className="w-32"
-                            />
-                            <span className="text-neutral-500">~</span>
-                            <TextInput
-                            value={ph.max}
-                            onChange={(v) => setPh((p) => ({ ...p, max: v }))}
-                            className="w-32"
-                            />
-                        </div>
-                        }
-                    />
-                    <Divider />
-
-                    {/* 4행 */}
-                    <QualityRow
-                        leftLabel={
-                        <>
-                            생물화학적산소요구량
-                            <br />
-                            (BOD)(mg/L)
-                        </>
-                        }
-                        leftRequired
-                        leftControl={<InlineSuffixInput value={bod} onChange={setBod} suffix="이하" />}
-                        rightLabel="염화물(mgCL/L)"
-                        rightControl={<InlineSuffixInput value={chloride} onChange={setChloride} suffix="이하" />}
-                    />
-                    <Divider />
-
-                    {/* 5행 */}
-                    <QualityRow
-                        leftLabel="냄새"
-                        leftRequired
-                        leftControl={
-                        <select
-                            value={odor}
-                            onChange={(e) => setOdor(e.target.value)}
-                            className="h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
-                        >
-                            <option>불쾌하지 않을 것</option>
-                            <option>약간 있음</option>
-                            <option>있음</option>
-                        </select>
-                        }
-                        rightLabel="전기전도도(µs/cm)"
-                        rightControl={<InlineSuffixInput value={ec} onChange={setEc} suffix="이하" />}
-                    />
-                    <Divider />
-
-                    {/* 6행 */}
-                    <QualityRow
-                        leftLabel="색도(도)"
-                        leftRequired
-                        leftControl={<InlineSuffixInput value={color} onChange={setColor} suffix="이하" />}
-                        rightLabel="비고"
-                        rightControl={
-                        <textarea
-                            value={remark}
-                            onChange={(e) => setRemark(e.target.value)}
-                            className="h-11 w-full rounded-md border border-neutral-300 bg-white px-3 py-2 text-sm outline-none focus:border-neutral-500"
-                        />
-                        }
-                    />
-                    <Divider />
-
-                    {/* 후보지 선택 */}
-                    <div className="grid grid-cols-12">
-                        <LabelCell>
-                        공급처 후보지 선택
-                        <br />
-                        (필수아님)
-                        </LabelCell>
-
-                        <div className="col-span-12 md:col-span-10 p-6">
-                            <div className="flex flex-col gap-3 xl:flex-row xl:items-center xl:gap-4">
-                                <TextInput value={cand1} onChange={setCand1} className="max-w-[220px]" />
-                                <TextInput value={cand2} onChange={setCand2} className="max-w-[220px]" />
-                                <TextInput value={cand3} onChange={setCand3} className="max-w-[220px]" />
-
-                                <div className="flex items-center gap-3 xl:ml-2">
-                                <button
-                                    type="button"
-                                    className="h-11 rounded-md bg-[#888] px-5 text-base text-white hover:bg-neutral-700"
-                                    onClick={() => setOpenCand(true)}
-                                >
-                                    후보지 조회
-                                </button>
-                                <button
-                                    type="button"
-                                    className="h-11 rounded-md bg-[#888] px-5 text-base text-white hover:bg-neutral-600"
-                                    onClick={() => {
-                                    // TODO: 유사사례 연결
-                                    console.log("유사사례");
-                                    }}
-                                >
-                                    유사사례
-                                </button>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-
-                {/* 하단 버튼 */}
-                <div className="flex justify-center py-12">
-                    <button
-                        type="button"
-                        className="h-11 rounded-md bg-[#0B4EA2] px-10 text-lg text-white hover:opacity-90"
-                        onClick={() => {
-                        // TODO: 저장 처리
-                        console.log("수요정보 등록");
-                        }}
-                    >
-                        수요정보 등록
-                    </button>
-                </div>
-
-            </div>
-        </main>
-
-        <CandidateSiteModal
-            open={openCand}
-            onClose={() => setOpenCand(false)}
-            initialSelected={selectedCands}
-            onApply={(list) => {
-                setSelectedCands(list);
-
-                // ✅ cand1~3 입력칸에 반영(시설명만 넣는 버전)
-                setCand1(list[0]?.name ?? "");
-                setCand2(list[1]?.name ?? "");
-                setCand3(list[2]?.name ?? "");
-
-                setOpenCand(false);
-            }}
-        />
-    </>
-  );
-}
-
-/* ----------------------------- UI helpers ----------------------------- */
-
-function Divider() {
-  return <div className="h-px w-full bg-neutral-200" />;
-}
-
-function LabelCell({
-  children,
-  required,
-}: {
-  children: React.ReactNode;
-  required?: boolean;
-}) {
-  return (
-    <div className="col-span-12 md:col-span-2 flex items-center justify-center text-center  bg-emerald-50/70 px-6 py-6 text-lg font-semibold text-neutral-800">
-      <span className="inline-flex items-center gap-1">
-        {children}
-        {required ? <span className="text-red-500">*</span> : null}
-      </span>
-    </div>
-  );
-}
-
-function FormRow({
-  label,
-  required,
-  children,
-}: {
-  label: string;
-  required?: boolean;
-  children: React.ReactNode;
-}) {
-  return (
-    <div className="grid grid-cols-12">
-      <LabelCell required={required}>{label}</LabelCell>
-      <div className="col-span-12 md:col-span-10 p-6">{children}</div>
-    </div>
-  );
-}
-
-function QualityRow({
-  leftLabel,
-  leftRequired,
-  leftControl,
-  rightLabel,
-  rightControl,
-}: {
-  leftLabel: React.ReactNode;
-  leftRequired?: boolean;
-  leftControl: React.ReactNode;
-  rightLabel: React.ReactNode;
-  rightControl: React.ReactNode;
-}) {
-  return (
-    <div className="grid grid-cols-12">
-      {/* 좌측 라벨 */}
-      <div className="col-span-12 lg:col-span-2 flex items-center justify-center text-center  bg-emerald-50/70 px-6 py-6 text-lg font-semibold text-neutral-800">
-        <span className="inline-flex items-center gap-1">
-          <span className="leading-6">{leftLabel}</span>
-          {leftRequired ? <span className="text-red-500">*</span> : null}
-        </span>
-      </div>
-
-      {/* 좌측 입력 */}
-      <div className="col-span-12 lg:col-span-4 p-6">{leftControl}</div>
-
-      {/* 우측 라벨 */}
-      <div className="col-span-12 lg:col-span-2 flex items-center justify-center text-center  bg-emerald-50/70 px-6 py-6 text-lg font-semibold text-neutral-800">
-        <span className="leading-6">{rightLabel}</span>
-      </div>
-
-      {/* 우측 입력 */}
-      <div className="col-span-12 lg:col-span-4 p-6">{rightControl}</div>
-    </div>
-  );
-}
-
-function TextInput({
-  value,
-  onChange,
-  placeholder,
-  disabled,
-  className,
-}: {
-  value: string;
-  onChange: (v: string) => void;
-  placeholder?: string;
-  disabled?: boolean;
-  className?: string;
-}) {
-  return (
-    <input
-      value={value}
-      onChange={(e) => onChange(e.target.value)}
-      placeholder={placeholder}
-      disabled={disabled}
-      className={[
-        "h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none",
-        "focus:border-neutral-500",
-        disabled ? "cursor-not-allowed" : "",
-        className ?? "",
-      ].join(" ")}
-    />
-  );
-}
-
-function InlineSuffixInput({
-  value,
-  onChange,
-  suffix,
-}: {
-  value: string;
-  onChange: (v: string) => void;
-  suffix: string;
-}) {
-  return (
-    <div className="flex items-center gap-3">
-      <TextInput value={value} onChange={onChange} className="max-w-[200px]" />
-      <span className="text-sm text-neutral-600">{suffix}</span>
-    </div>
-  );
-}
-
-function DateInput({
-  value,
-  onChange,
-}: {
-  value: string;
-  onChange: (v: string) => void;
-}) {
-  
-  const ref = useRef<HTMLInputElement | null>(null);
-
-  const openPicker = () => {
-    const el = ref.current;
-    if (!el) return;
-
-    // Chrome/Edge 등 지원
-    if (typeof (el as any).showPicker === "function") {
-      (el as any).showPicker();
-      return;
-    }
-
-    // fallback (일부 브라우저)
-    el.focus();
-    el.click();
-  };
-  return (
-    <div className="relative w-full max-w-[200px]">
-      <input
-        ref={ref}
-        type="date"
-        value={value}
-        onChange={(e) => onChange(e.target.value)}
-        className={[
-          "h-11 w-full rounded-md border border-neutral-300 bg-white px-3 pr-10 text-sm outline-none focus:border-neutral-500",
-          // ✅ 기본 달력 아이콘 숨김 (Tailwind arbitrary selector)
-          "[&::-webkit-calendar-picker-indicator]:opacity-0",
-          "[&::-webkit-calendar-picker-indicator]:absolute",
-          "[&::-webkit-calendar-picker-indicator]:right-0",
-          "[&::-webkit-calendar-picker-indicator]:w-10",
-          "[&::-webkit-calendar-picker-indicator]:h-full",
-          "[&::-webkit-calendar-picker-indicator]:cursor-pointer",
-        ].join(" ")}
-      />
-
-      {/* ✅ 클릭 가능한 아이콘 버튼 */}
-      <button
-        type="button"
-        onClick={openPicker}
-        className="absolute right-2 top-1/2 -translate-y-1/2 p-1 text-neutral-500 hover:text-neutral-700"
-        aria-label="달력 열기"
-      >
-        <svg width="18" height="18" viewBox="0 0 24 24" fill="none" aria-hidden="true">
-            <path d="M7.14286 7.99104H16.7812M6.48512 2.5625V4.19126M17.3125 2.5625V4.19106M20.5 7.19106L20.5 18.5625C20.5 20.2194 19.1569 21.5625 17.5 21.5625H6.5C4.84315 21.5625 3.5 20.2194 3.5 18.5625V7.19106C3.5 5.53421 4.84315 4.19106 6.5 4.19106H17.5C19.1569 4.19106 20.5 5.53421 20.5 7.19106Z" stroke="#1A1A1A" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" />
-        </svg>
-      </button>
-    </div>
-  );
-}
diff --git a/apps/dm_new/app/(with-layout)/apply/status/page.tsx b/apps/dm_new/app/(with-layout)/apply/status/page.tsx
deleted file mode 100644
index fc9e61134..000000000
--- a/apps/dm_new/app/(with-layout)/apply/status/page.tsx
+++ /dev/null
@@ -1,340 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useRef, useState } from "react";
-import SubPageHeader from "@/components/SubPageHeader";
-import { useDmStore } from "@/app/store";
-import type { DemandCompBizType } from "@/app/store/sdmMng";
-
-type TopField = { label: string; value: string; required?: boolean };
-type PairField = { label: string; value: string };
-type SessionUser = { dmdInfoId?: string };
-
-const formatDate = (value: string | Date | "" | undefined) => {
-  if (!value) return "-";
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) return String(value);
-  const yyyy = date.getFullYear();
-  const mm = String(date.getMonth() + 1).padStart(2, "0");
-  const dd = String(date.getDate()).padStart(2, "0");
-  return `${yyyy}-${mm}-${dd}`;
-};
-
-const formatValue = (value: string | number | null | undefined) => {
-  if (value === null || value === undefined || value === "") return "-";
-  return String(value);
-};
-
-const formatBelow = (value: string | number | null | undefined) => {
-  if (value === null || value === undefined || value === "") return "-";
-  if (Number(value) === -1) return "불검출";
-  return `${value} 이하`;
-};
-
-function StatusBadge({ v }: { v: string }) {
-  const cls = v === "신청" ? "text-red-600" : "text-lime-600";
-  return <span className={["font-medium", cls].join(" ")}>{v || "-"}</span>;
-}
-
-export default function DemandStatusPage() {
-  const { getSdmInfoStatusList, Sdm, Common } = useDmStore((state) => state);
-  const { successLogin, sdmInfoStatusList } = Sdm;
-  const { selectSidoData, selectSigunData } = Common;
-
-  const detailRef = useRef<HTMLDivElement | null>(null);
-
-  const [isLoginStorageInfo, setIsLoginStorageInfo] = useState(false);
-  const [selectedDmdInfoSn, setSelectedDmdInfoSn] = useState<number | "" | null>(null);
-  const [transformedSdmInfoStatusList, setTransformedSdmInfoStatusList] = useState<DemandCompBizType[]>([]);
-
-  useEffect(() => {
-    const user = sessionStorage.getItem("user");
-    if (user) {
-      setIsLoginStorageInfo(true);
-    }
-  }, []);
-
-  useEffect(() => {
-    if (!successLogin && !isLoginStorageInfo) return;
-
-    const user = sessionStorage.getItem("user");
-    if (!user) return;
-
-    try {
-      const userData = JSON.parse(user) as SessionUser;
-      const dmdInfoId = userData.dmdInfoId?.trim();
-      if (dmdInfoId) {
-        getSdmInfoStatusList(dmdInfoId);
-      }
-    } catch (error) {
-      console.error("Error parsing user data:", error);
-    }
-  }, [successLogin, isLoginStorageInfo, getSdmInfoStatusList]);
-
-  useEffect(() => {
-    const mappedList = sdmInfoStatusList.map((item) => ({
-      ...item,
-      ctpvCd: selectSidoData.find((sido) => sido.val === item.ctpvCd?.trim())?.text || item.ctpvCd,
-      sggCd: selectSigunData.find((sigun) => sigun.val === item.sggCd?.trim())?.text || item.sggCd,
-    }));
-
-    setTransformedSdmInfoStatusList(mappedList);
-  }, [sdmInfoStatusList, selectSidoData, selectSigunData]);
-
-  useEffect(() => {
-    const first = transformedSdmInfoStatusList[0];
-    if (!first) {
-      setSelectedDmdInfoSn(null);
-      return;
-    }
-
-    if (selectedDmdInfoSn == null) {
-      setSelectedDmdInfoSn(first.dmdInfoSn);
-      return;
-    }
-
-    const exists = transformedSdmInfoStatusList.some(
-      (item) => item.dmdInfoSn === selectedDmdInfoSn,
-    );
-    if (!exists) {
-      setSelectedDmdInfoSn(first.dmdInfoSn);
-    }
-  }, [transformedSdmInfoStatusList, selectedDmdInfoSn]);
-
-  const selectedSdmInfoStatus = useMemo(() => {
-    if (!transformedSdmInfoStatusList.length) return null;
-    return (
-      transformedSdmInfoStatusList.find((item) => item.dmdInfoSn === selectedDmdInfoSn) ??
-      transformedSdmInfoStatusList[0]
-    );
-  }, [transformedSdmInfoStatusList, selectedDmdInfoSn]);
-
-  const topFields: TopField[] = useMemo(() => {
-    if (!selectedSdmInfoStatus) return [];
-
-    return [
-      { label: "요구시기", value: formatDate(selectedSdmInfoStatus.dmndTmng), required: true },
-      { label: "요구수량(㎥/d)", value: formatValue(selectedSdmInfoStatus.dmndQty) },
-      { label: "사용용도", value: formatValue(selectedSdmInfoStatus.useUsgCd) },
-      { label: "희망단가(원/㎥)", value: formatValue(selectedSdmInfoStatus.wntUntprc) },
-    ];
-  }, [selectedSdmInfoStatus]);
-
-  const waterFields: PairField[] = useMemo(() => {
-    if (!selectedSdmInfoStatus) return [];
-
-    return [
-      { label: "총대장균군수(개/100mL)", value: formatBelow(selectedSdmInfoStatus.grssClfg) },
-      { label: "결합잔류염소(mg/L)", value: formatBelow(selectedSdmInfoStatus.combResdch) },
-      { label: "탁도(NTU)", value: formatBelow(selectedSdmInfoStatus.trbt) },
-
-      { label: "생물학적산소요구량(BOD)(mg/L)", value: formatBelow(selectedSdmInfoStatus.blgcOxygDmndQnt) },
-      { label: "냄새", value: formatValue(selectedSdmInfoStatus.smll) },
-      { label: "색도(도)", value: formatBelow(selectedSdmInfoStatus.crmty) },
-
-      { label: "총질소(T-N)(mg/L)", value: formatBelow(selectedSdmInfoStatus.tn) },
-      { label: "총인(T-P)(mg/L)", value: formatBelow(selectedSdmInfoStatus.tph) },
-      { label: "수소이온농도(pH)", value: formatValue(selectedSdmInfoStatus.ph) },
-
-      { label: "염화물(mgCL/L)", value: formatBelow(selectedSdmInfoStatus.clIonQnt) },
-      { label: "전기전도도(μS/cm)", value: formatBelow(selectedSdmInfoStatus.cdtnv) },
-      { label: "비고", value: formatValue(selectedSdmInfoStatus.rmrk) },
-    ];
-  }, [selectedSdmInfoStatus]);
-
-  const candidateNames = useMemo(() => {
-    const list = selectedSdmInfoStatus?.splyCndtList ?? [];
-    return [
-      list[0]?.ruseUtztnFcltNm ?? "",
-      list[1]?.ruseUtztnFcltNm ?? "",
-      list[2]?.ruseUtztnFcltNm ?? "",
-    ];
-  }, [selectedSdmInfoStatus]);
-
-  const onSelectSdmInfoStatus = (dmdInfoSn: number | "") => {
-    setSelectedDmdInfoSn(dmdInfoSn);
-    requestAnimationFrame(() => {
-      detailRef.current?.scrollIntoView({ behavior: "smooth", block: "start" });
-    });
-  };
-
-  return (
-    <main className="bg-white">
-      <SubPageHeader
-        title="수요신청현황"
-        crumbs={[
-          { label: "Home", href: "/main" },
-          { label: "수요신청", href: "/apply/status" },
-          { label: "수요신청현황" },
-        ]}
-        hideFooterLine
-        hideGuideText
-      />
-
-      <div>
-        <section className="mt-6">
-          <div className="text-2xl font-bold text-slate-700">수요정보 신청현황</div>
-
-          <div className="mt-3 border border-neutral-200">
-            <table className="w-full table-fixed">
-              <thead className="bg-[#E7F4E2]">
-                <tr className="text-sm text-slate-700">
-                  <th className="w-[60px] px-3 py-3 text-center">NO.</th>
-                  <th className="w-[120px] px-3 py-3 text-center">시도</th>
-                  <th className="w-[120px] px-3 py-3 text-center">시군구</th>
-                  <th className="w-[180px] px-3 py-3 text-center">회사명</th>
-                  <th className="px-3 py-3 text-center">공장주소</th>
-                  <th className="w-[140px] px-3 py-3 text-center">전화번호</th>
-                  <th className="w-[120px] px-3 py-3 text-center">신청일자</th>
-                  <th className="w-[110px] px-3 py-3 text-center">진행상태</th>
-                </tr>
-              </thead>
-
-              <tbody className="bg-white text-base text-slate-700">
-                {transformedSdmInfoStatusList.length === 0 ? (
-                  <tr>
-                    <td colSpan={8} className="px-3 py-10 text-center text-slate-400">
-                      조회된 신청내역이 없습니다.
-                    </td>
-                  </tr>
-                ) : (
-                  transformedSdmInfoStatusList.map((sdmInfoStatus, index) => {
-                    const active = sdmInfoStatus.dmdInfoSn === selectedSdmInfoStatus?.dmdInfoSn;
-                    return (
-                      <tr
-                        key={`${sdmInfoStatus.dmdInfoSn}-${index}`}
-                        role="row"
-                        tabIndex={0}
-                        onClick={() => onSelectSdmInfoStatus(sdmInfoStatus.dmdInfoSn)}
-                        onKeyDown={(e) => {
-                          if (e.key === "Enter" || e.key === " ") {
-                            onSelectSdmInfoStatus(sdmInfoStatus.dmdInfoSn);
-                          }
-                        }}
-                        className={[
-                          "border-t border-neutral-200 outline-none",
-                          "cursor-pointer",
-                          active ? "bg-slate-50" : "hover:bg-slate-50",
-                          "focus-visible:ring-2 focus-visible:ring-slate-300",
-                        ].join(" ")}
-                        aria-selected={active}
-                      >
-                        <td className="px-3 py-3 text-center">{sdmInfoStatus.index || index + 1}</td>
-                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.ctpvCd)}</td>
-                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.sggCd)}</td>
-                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.dmdCoNm)}</td>
-                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.daddr)}</td>
-                        <td className="px-3 py-3 text-center">{formatValue(sdmInfoStatus.telno)}</td>
-                        <td className="px-3 py-3 text-center">{formatDate(sdmInfoStatus.dmndTmng)}</td>
-                        <td className="px-3 py-3 text-center">
-                          <StatusBadge v={formatValue(sdmInfoStatus.status)} />
-                        </td>
-                      </tr>
-                    );
-                  })
-                )}
-              </tbody>
-            </table>
-          </div>
-        </section>
-
-        <section className="mt-10 pb-16" ref={detailRef}>
-          <div className="flex justify-between items-center">
-            <div className="text-2xl font-bold text-slate-700">수요신청 상세현황</div>
-            <button
-              type="button"
-              className="h-8 rounded-md bg-[#888] px-4 text-base text-white hover:bg-neutral-700"
-            >
-              수정
-            </button>
-          </div>
-
-          {!selectedSdmInfoStatus ? (
-            <div className="mt-3 border border-neutral-200 px-6 py-10 text-center text-sm text-slate-400">
-              상세 정보를 표시할 신청건이 없습니다.
-            </div>
-          ) : (
-            <div className="mt-3 border border-neutral-200">
-              <div className="bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-b border-neutral-200">
-                요구수량
-              </div>
-
-              <div className="grid grid-cols-12 text-sm">
-                {topFields.map((field) => (
-                  <div
-                    key={field.label}
-                    className="col-span-12 md:col-span-6 grid grid-cols-12 border-b border-neutral-200"
-                  >
-                    <div className="col-span-4 bg-sky-50 px-4 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
-                      {field.label}
-                      {field.required ? <span className="ml-1 text-red-500">*</span> : null}
-                    </div>
-                    <div className="col-span-8 px-4 py-4 flex items-center justify-center text-center">
-                      {field.value}
-                    </div>
-                  </div>
-                ))}
-
-                <div className="col-span-12 bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-b border-neutral-200">
-                  요구수질
-                </div>
-
-                {waterFields.map((field) => (
-                  <div
-                    key={field.label}
-                    className="col-span-12 md:col-span-4 grid grid-cols-12 border-b border-neutral-200"
-                  >
-                    <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
-                      {field.label}
-                    </div>
-                    <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
-                      {field.value}
-                    </div>
-                  </div>
-                ))}
-
-                <div className="col-span-12 bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-b border-neutral-200">
-                  공급처 후보지
-                </div>
-
-                {candidateNames.map((candidateName, index) => (
-                  <div
-                    key={`candidate-${index}`}
-                    className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200"
-                  >
-                    <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
-                      후보지{index + 1}
-                    </div>
-                    <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
-                      {candidateName}
-                    </div>
-                  </div>
-                ))}
-
-                <div className="col-span-12 bg-sky-50 px-4 py-3 text-sm font-semibold text-slate-700 border-t border-b border-neutral-200">
-                  수요신청 진행상태
-                </div>
-
-                <div className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200">
-                  <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
-                    진행상태
-                  </div>
-                  <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
-                    {formatValue(selectedSdmInfoStatus.status)}
-                  </div>
-                </div>
-                <div className="col-span-12 md:col-span-4 grid grid-cols-12 border-b md:border-b-0 border-neutral-200">
-                  <div className="col-span-5 bg-sky-50 px-3 py-4 flex items-center justify-center text-center font-semibold text-slate-700">
-                    공급처매칭결과
-                  </div>
-                  <div className="col-span-7 px-3 py-4 flex items-center justify-center text-center">
-                    {formatValue(selectedSdmInfoStatus.ruseUtztnFcltNm)}
-                  </div>
-                </div>
-              </div>
-            </div>
-          )}
-        </section>
-      </div>
-    </main>
-  );
-}
diff --git a/apps/dm_new/app/common/comFunction.ts b/apps/dm_new/app/common/comFunction.ts
deleted file mode 100644
index ec4894d49..000000000
--- a/apps/dm_new/app/common/comFunction.ts
+++ /dev/null
@@ -1,65 +0,0 @@
-import type {  RegionData,  } from "../store/wrStatus/type";
-
-
-
-export  const regionData:RegionData[] = [
-    { name: '서울', x: 170, y: 140, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '인천', x: 120, y: 150, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '경기', x: 210, y: 210, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '강원', x: 330, y: 120, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '충북', x: 260, y: 280, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '충남', x: 100, y: 320, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '세종', x: 180, y: 305, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '대전', x: 195, y: 360, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '전북', x: 170, y: 450, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '전남', x: 160, y: 600, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '광주', x: 120, y: 530, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '경북', x: 400, y: 320, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '경남', x: 310, y: 530, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '대구', x: 350, y: 450, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '울산', x: 450, y: 500, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '부산', x: 420, y: 550, values: [0.3, 0.3, 0.2, 0.2] },
-    { name: '제주', x: 60, y: 750, values: [0.3, 0.3, 0.2, 0.2] },
-  ]
-
-export const regionIdMap: Record<string, string> = {
-    서울: '서울특별시',
-    부산: '부산광역시',
-    대구: '대구광역시',
-    인천: '인천광역시',
-    광주: '광주광역시',
-    대전: '대전광역시',
-    울산: '울산광역시',
-    세종: '세종특별자치시',
-    경기: '경기도',
-    강원: '강원특별자치도',
-    충북: '충청북도',
-    충남: '충청남도',
-    전북: '전라북도',
-    전남: '전라남도',
-    경북: '경상북도',
-    경남: '경상남도',
-    제주: '제주특별자치도'
-  };
-
-
-export const makeRegion = (region: string) => {
-  if (region === '서울특별시') return '서울'
-  if (region === '부산광역시') return '부산'
-  if (region === '대구광역시') return   '대구'
-  if (region === '인천광역시') return  '인천'
-  if (region === '광주광역시') return  '광주'
-  if (region === '대전광역시') return  '대전'
-  if (region === '울산광역시') return  '울산'
-  if (region === '세종특별자치시') return  '세종'
-  if (region === '경기도') return  '경기'
-  if (region === '강원특별자치도') return  '강원'
-  if (region === '충청북도') return  '충북'
-  if (region === '충청남도') return  '충남'
-  if (region === '전북특별자치도') return  '전북'
-  if (region === '전라남도') return  '전남'
-  if (region === '경상북도') return  '경북'
-  if (region === '경상남도') return  '경남'
-  if (region === '제주특별자치도') return  '제주'
-    return region;
-}
diff --git a/apps/dm_new/app/common/transValueFormat.tsx b/apps/dm_new/app/common/transValueFormat.tsx
deleted file mode 100644
index 4d76d84e0..000000000
--- a/apps/dm_new/app/common/transValueFormat.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from 'react'
-
-type CommonProps = {
-  value: string | number | '';
-  format: string;
-}
-
-export default function TransValueFormat({value='', format=''}: CommonProps) {
-  return (
-    format === 'yyyyMMdd' ? 
-      <>{value.toString().substring(0,4)+'-'+value.toString().substring(4,6)+'-'+value.toString().substring(6,8)}</>
-    : format === 'number' ?
-      <>{String(value ?? '').includes('.') 
-        ? String(value).split('.').map((part, index) => 
-            index === 0 ? part.replace(/\B(?=(\d{3})+(?!\d))/g, ",") : part
-          ).join('.')
-        : String(value ?? '').replace(/\B(?=(\d{3})+(?!\d))/g, ",")}</>
-    : format === 'float1' ?
-      <>{String(value ?? '').includes('.') 
-        ? String(value).split('.').map((part, index) =>
-            index === 0 ? part.replace(/\B(?=(\d{3})+(?!\d))/g, ",") : part
-          ).join('.')
-        : String(value ?? '').replace(/\B(?=(\d{3})+(?!\d))/g, ",")}</>
-    : <>{value}</>
-  )
-}
\ No newline at end of file
diff --git a/apps/dm_new/app/layout.tsx b/apps/dm_new/app/layout.tsx
deleted file mode 100644
index 0e45865e7..000000000
--- a/apps/dm_new/app/layout.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-"use client";
-import "./globals.css";
-import { setCookie } from "../src/shared/lib";
-
-setCookie("site-id-key", process.env.NEXT_PUBLIC_SITE_ID || "DM");
-
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-
-  return (
-    <html lang="ko">
-      <head>
-        <title>물재이용 대민</title>
-      </head>
-      <body>
-        <div className="min-w-[1800px] overflow-x-auto">
-          {children}
-        </div>
-      </body>
-    </html>
-  );
-}
diff --git a/apps/dm_new/app/store/common/index.tsx b/apps/dm_new/app/store/common/index.tsx
deleted file mode 100644
index e875c2eca..000000000
--- a/apps/dm_new/app/store/common/index.tsx
+++ /dev/null
@@ -1,502 +0,0 @@
-/**====================================
- * 보편적으로 쓰는 store 공간
- ====================================**/
-
-import { fetchType, getFetch } from '@/components/ui/api';
-
-/**
- * STORE - TYPE
- */
-
-// selectBox
-export type SelectDataType = {
-  text: string;
-  val: string;
-}
-
-export interface MenuItem {
-  menuCd: number;
-  menuKornNm: string;
-  menuEngNm: string;
-  parentId: number | null;
-  sortSeq: number;
-  iconNm?: string;
-  children: MenuItem[] | null;
-  levelNo: number;
-  urlPath: string;
-  menuLnkgTypeCd: string;
-  menuLnkgSn: number;
-  menuPath: string;
-  qrcd: string;
-  useYn: string;
-  otptYn: string;
-  newWndwYn: string;
-  requiredUrlPath: boolean;
-}
-
-// grid header 
-export type TableUpperProps = {
-    id: string;
-    title: string;
-    upName?: string;
-    upSequnce?: number;
-    align? : string;
-    row? : number;
-    rowSpan?: number;
-    colSpan?: number;
-}
-
-// 시도 데이터
-export type sidoDataType = {
-  adstDstrCd: number,
-  sido: string,
-}
-
-// 시군구 데이터
-export type sigunDataType = {
-  adstDstrCd: number,
-  gugun: string
-}
-
-// 권역 데이터
-export type regionDataType = {
-  rvbsnCd: string,
-  rvbsn: string,
-}
-
-// 단위유역 데이터
-export type unitWaterShedDataType = {
-  rvbsnCd: string,
-  lgbsn: string,
-}
-
-// 중권역 데이터
-export type middleRegionDataType = {
-  rvbsnCd: string,
-  mdmbsn: string,
-}
-
-// 환경청 데이터
-export type envPartDataType = {
-  lclgvrnmntCd: string,
-  lclgvrnmntNm: string,
-  adstDliStrCd: string,
-  adstDstrCd: string,
-}
-
-export type envPartSelectDataType = SelectDataType & {
-  adstDliStrCd: string,
-}
-
-/**
- * STORE - DATA
- */
-
-// 시도 데이터
-let selectSidoData: SelectDataType[] = [
-  { text: "전체", val: '0' }
-];
-
-// 시군구 데이터
-let selectSigunData: SelectDataType[] = [
-  { text: "전체", val: '0' }
-];
-
-// 권역 데이터
-const selectRegionData: SelectDataType[] = [
-  { text: "전체", val: '0' }
-];
-
-// 단위유역 데이터
-const selectUnitWaterShedData: SelectDataType[] = [
-];
-
-// 환경청 데이터
-let selectEnvPartData: envPartSelectDataType[] = [
-  { text: "전체", val: '0', adstDliStrCd: '' }
-];
-
-// 환경청 내 시도 데이터
-const selectEnvPartSidoData: SelectDataType[] = [
-  { text: "전체", val: '0' }
-];
-
-// 환경청 내 시군구 데이터
-const selectEnvPartSigunData: SelectDataType[] = [
-  { text: "전체", val: '0' }
-];
-
-// 구분 데이터
-// const selectPartData:SelectDataType[] = [
-//   { text: "행정별", val: '0' },
-//   { text: "유역별", val: '01' },
-//   { text: "환경청별", val: '02' },
-// ];
-
-// 상향 하향 데이터
-const selectUpdownData:SelectDataType[] = [
-  { text: "전체", val: '0' },
-  { text: "500이하", val: '499' },
-  { text: "500이상", val: '500' },
-];
-
-// 운영 상태 데이터
-const selectOperationData:SelectDataType[] = [
-  { text: "전체", val: '0' },
-  { text: "가동중", val: '1' },
-  { text: "재가동", val: '2' },
-  { text: "가동중지", val: '3' },
-  { text: "시설폐쇄", val: '4' },
-];
-
-// 시설 구분 데이터
-const selectFacilityPartData:SelectDataType[] = [
-  { text: "전체", val: '0' },
-  { text: "공공하수처리시설", val: 'SW' },
-  { text: "오수처리장", val: 'SS' },
-  { text: "개인하수처리시설", val: 'PB' },
-  { text: "분뇨처리장", val: 'NS' },
-  { text: "폐수처리장", val: 'LW' },
-  { text: "침출수처리장", val: 'LC' },
-  { text: "기타기초시설", val: 'ET' },
-];
-
-// 년도 데이터
-const getYearData = () => {
-  const year = new Date().getFullYear();
-  const year1 = year - 1;
-  const year2 = year - 2;
-  const year3 = year - 3;
-  const year4 = year - 4;
-  const year5 = year - 5;
-  return [
-    { text: year1 + "년", val: year1.toString() },
-    { text: year2 + "년", val: year2.toString() },
-    { text: year3 + "년", val: year3.toString() },
-    { text: year4 + "년", val: year4.toString() },
-    { text: year5 + "년", val: year5.toString() },
-  ]
-}
-
-const selectSearchYear:SelectDataType[] = getYearData();
-
-// 유량 기간 구분
-const selectFlowTerm : SelectDataType[] = [
-  { text: "연간", val: '0' },
-  { text: "하절기", val: '01' },
-  { text: "동절기", val: '02' },
-  { text: "청천시", val: '03' },
-  { text: "강우시", val: '04' },
-];
-
-// 유량 기간 구분
-const selectFlowPanel : SelectDataType[] = [
-  { text: "전체", val: '0'},
-    { text: "3mm미만", val: '1'},
-    { text: "3~10mm미만", val: '2'},
-    { text: "10~20mm미만", val: '3'},
-    { text: "20~30mm미만", val: '4'},
-    { text: "30~40mm미만", val: '5'},
-    { text: "40~50mm미만", val: '6'},
-    { text: "50~60mm미만", val: '7'},
-    { text: "60mm이상", val: '8'}, 
-];
-
-// 중권역 데이터
-const selectMiddleRegionData: SelectDataType[] = [
-  { text: "전체", val: '0' }
-];
-
-/**
- * STORE - API
- */
-
-// 시도 API 호출 함수 추가
-const fetchSidoData = async (): Promise<SelectDataType[]> => {
-  try {
-    const res = await getFetch(fetchType.FO, '/addr/city');
-    const data = res.data;
-    selectSidoData = [
-      { text: "전체", val: '0'},
-      ...data.map((item: sidoDataType) => ({
-          text: item.sido || '',
-          val: String(item.adstDstrCd) || ''
-      }))
-    ];
-    return selectSidoData;
-  } catch (error) {
-      console.error('시도 데이터를 가져오는데 실패했습니다:', error);
-      return selectSidoData;
-  }
-};
-
-// 시군구 API 호출 함수 추가
-const fetchSigunData = async (): Promise<SelectDataType[]> => {
-  try {
-    const res = await getFetch(fetchType.FO, '/addr/sgg');
-    const data = res.data;
-    selectSigunData = [
-      { text: "전체", val: '0' },
-      ...data
-      .map((item: sigunDataType) => ({
-          text: item.gugun || '',
-          val: String(item.adstDstrCd) || ''
-      }))
-    ];
-    return selectSigunData;
-  } catch (error) {
-    console.error('시군구 데이터를 가져오는데 실패했습니다:', error);
-    return selectSigunData;
-  }
-};
-
-// 권역 API 호출 함수 추가
-const fetchRegionData = async (): Promise<SelectDataType[]> => {
-  try {
-    const res = await getFetch(fetchType.FO, '/addr/sarea');
-    const data = res.data;
-    return [
-      { text: "전체", val: '0'},
-      ...data.map((item: regionDataType) => ({
-        text: item.rvbsn || '',
-        val: String(item.rvbsnCd) || ''
-      }))
-    ];
-  } catch (error) {
-    console.error('권역 데이터를 가져오는데 실패했습니다:', error);
-    return selectRegionData;
-  }
-};
-
-// 중권역 API 호출 함수 추가
-const fetchMiddleRegionData = async (): Promise<SelectDataType[]> => {
-  try {
-    const res = await getFetch(fetchType.FO, '/addr/midArea');
-    const data = res.data;
-    return [
-      { text: "전체", val: '0' },
-      ...data
-      .map((item: middleRegionDataType) => ({
-        text: item.mdmbsn || '',
-        val: String(item.rvbsnCd) || ''
-      }))
-    ];
-  } catch (error) {
-    console.error('중권역 데이터를 가져오는데 실패했습니다:', error);
-    return selectMiddleRegionData;
-  }
-};
-
-// 단위유역 API 호출 함수 추가
-const fetchUnitWaterShedData = async (): Promise<SelectDataType[]> => {
-  try {
-    const res = await getFetch(fetchType.FO, '/addr/largeArea');
-    const data = res.data;
-    return [
-      { text: "전체", val: '0' },
-      ...data
-      .map((item: unitWaterShedDataType) => ({
-        text: item.lgbsn || '',
-        val: String(item.rvbsnCd) || ''
-      }))
-    ];
-  } catch (error) {
-    console.error('단위유역 데이터를 가져오는데 실패했습니다:', error);
-    return selectUnitWaterShedData;
-  }
-};
-
-// 환경청 데이터
-const fetchEnvPartData = async (): Promise<envPartSelectDataType[]> => {
-  try {
-    const res = await getFetch(fetchType.FO, '/addr/govArea');
-    const data = res.data;
-    selectEnvPartData = [
-      { text: "전체", val: '0', adstDliStrCd: '' },
-      ...data
-      .map((item: envPartDataType) => ({
-        text: item.lclgvrnmntNm || '',
-        val: String(item.lclgvrnmntCd) || '',
-        adstDliStrCd: item.adstDliStrCd || ''
-      }))
-    ];
-    return selectEnvPartData;
-  } catch (error) {
-    console.error('환경청 데이터를 가져오는데 실패했습니다:', error);
-    return selectEnvPartData;
-  }
-};
-
-function sortMenus(items: MenuItem[]): MenuItem[] {
-  return [...items]
-    .sort((a, b) => a.sortSeq - b.sortSeq)
-    .map((item) => ({
-      ...item,
-      children: item.children ? sortMenus(item.children) : [],
-    }));
-}
-
-function isVisible(item: MenuItem): boolean {
-  return item.useYn !== "N" && item.otptYn !== "N";
-}
-
-function normalizeMenus(items: MenuItem[]): MenuItem[] {
-  return sortMenus(items)
-    .filter(isVisible)
-    .map((item) => ({
-      ...item,
-      children: item.children ? normalizeMenus(item.children) : [],
-    }));
-}
-
-export const REUSE_SITE_ID = process.env.NEXT_PUBLIC_SITE_ID || "DM";
-const anonymousMenuCache = new Map<string, MenuItem[]>();
-const anonymousMenuInFlight = new Map<string, Promise<MenuItem[]>>();
-
-export async function fetchAnonymousMenu(siteId = REUSE_SITE_ID): Promise<MenuItem[]> {
-  const cached = anonymousMenuCache.get(siteId);
-  if (cached) return cached;
-
-  const inFlight = anonymousMenuInFlight.get(siteId);
-  if (inFlight) return inFlight;
-
-  const request = (async () => {
-    const response = await fetch(`/cms-service/api/v1/menu/anonymous/user/${siteId}`, {
-      method: "GET",
-      headers: { "Content-Type": "application/json" },
-      cache: "no-store",
-    });
-
-    if (!response.ok) {
-      throw new Error(`Failed to load menu: ${response.status}`);
-    }
-
-    const data = (await response.json()) as MenuItem[];
-    const normalized = Array.isArray(data) ? normalizeMenus(data) : [];
-    anonymousMenuCache.set(siteId, normalized);
-    return normalized;
-  })();
-
-  anonymousMenuInFlight.set(siteId, request);
-  try {
-    return await request;
-  } finally {
-    anonymousMenuInFlight.delete(siteId);
-  }
-}
-
-function isPathMatched(pathname: string, urlPath: string) {
-  if (!urlPath) return false;
-  return pathname === urlPath || pathname.startsWith(`${urlPath}/`);
-}
-
-function hasMatchedPathInTree(menu: MenuItem, pathname: string): boolean {
-  if (isPathMatched(pathname, menu.urlPath)) return true;
-  return (menu.children ?? []).some((child) => hasMatchedPathInTree(child, pathname));
-}
-
-export function findActiveTopMenu(menus: MenuItem[], pathname: string): MenuItem | null {
-  const level1Menus = menus.filter((menu) => menu.levelNo === 1 || menu.parentId === null);
-  const matched = level1Menus.filter((menu) => hasMatchedPathInTree(menu, pathname));
-
-  return matched[0] ?? level1Menus[0] ?? null;
-}
-
-export function hasAnyChild(item: MenuItem): boolean {
-  return Array.isArray(item.children) && item.children.length > 0;
-}
-
-export function isMenuActive(pathname: string, menu: MenuItem): boolean {
-  return isPathMatched(pathname, menu.urlPath);
-}
-/**====================================
- * Store - expaort
- ====================================*/
-export type CommonAction = {
-  initializeCommonData: () => Promise<void>;
-  getMenuAuth: (menuCd:number) => Promise<void>;
-  fetchAnonymousMenu: (siteId?: string) => Promise<MenuItem[]>;
-}
-
-export type CommonType = {
-  Common: {
-    isInit: boolean;
-    selectSidoData: SelectDataType[];
-    selectSigunData: SelectDataType[];
-    selectUpdownData: SelectDataType[];
-    selectOperationData: SelectDataType[];
-    selectFacilityPartData: SelectDataType[];
-    selectSearchYear: SelectDataType[];
-    selectUnitWaterShedData: SelectDataType[];
-    selectRegionData: SelectDataType[];
-    selectMiddleRegionData: SelectDataType[];
-    selectEnvPartSidoData: SelectDataType[];
-    selectEnvPartSigunData: SelectDataType[];
-    selectFlowTerm: SelectDataType[];
-    selectFlowPanel: SelectDataType[];
-    selectEnvPartData: envPartSelectDataType[];
-    btnClass: string;
-  }
-}
-
-export const CommonState:CommonType = {
-  Common: {
-    isInit: false,
-    selectSidoData: selectSidoData,
-    selectSigunData: selectSigunData,
-    selectUpdownData: selectUpdownData,
-    selectOperationData: selectOperationData,
-    selectFacilityPartData: selectFacilityPartData,
-    selectSearchYear: selectSearchYear,
-    selectRegionData: selectRegionData,
-    selectUnitWaterShedData: selectUnitWaterShedData,
-    selectMiddleRegionData: selectMiddleRegionData,
-    selectEnvPartSidoData : selectEnvPartSidoData,
-    selectEnvPartSigunData : selectEnvPartSigunData,
-    selectFlowTerm: selectFlowTerm,
-    selectFlowPanel: selectFlowPanel,
-    selectEnvPartData : selectEnvPartData,
-    btnClass: "p-4 m-2 text-white rounded-sm text-lg font-medium"
-  }
-}
-
-export const CommonReducer:(set:any)=>CommonAction=(set: any) => {
-  return {
-    getMenuAuth : async (menuCd : number) =>{
-      const response = await getFetch(
-        "local",
-        `/cms-service/api/v1/menu-authrts/pageinfo/${menuCd}`
-      );
-      set((state: CommonType) => {
-        return {
-          ...state,
-          auth: {
-            mngAuthrtYn: response[0].mngAuthrtYn,
-            inqAuthrtYn: response[0].mngAuthrtYn,
-            regAuthrtYn: response[0].mngAuthrtYn,
-            mdfcnAuthrtYn: response[0].mngAuthrtYn,
-            delAuthrtYn: response[0].mngAuthrtYn,
-          },
-        };
-      });
-    },
-    // 시도 변경 이벤트
-    initializeCommonData: async () => {
-      const promiseSet = await Promise.all([fetchSidoData(), fetchSigunData(), fetchRegionData(), fetchUnitWaterShedData(), fetchMiddleRegionData(), fetchEnvPartData()]);
-      const [sidoData, sggData, regionData, unitData, midData, envData] = promiseSet;
-      set((state: CommonType) => ({
-        Common: {
-          ...state.Common,
-          selectSidoData: sidoData,
-          selectSigunData: sggData,
-          selectRegionData: regionData,
-          selectMiddleRegionData: midData,
-          selectUnitWaterShedData: unitData,
-          selectEnvPartData: envData
-        }
-      })
-    )},
-    fetchAnonymousMenu: async (siteId = REUSE_SITE_ID) => fetchAnonymousMenu(siteId)
-  }
-}
-export type CommonStore = CommonType & CommonAction;
diff --git a/apps/dm_new/app/store/index.tsx b/apps/dm_new/app/store/index.tsx
deleted file mode 100644
index 47170b3db..000000000
--- a/apps/dm_new/app/store/index.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-'use client'
-
-import { type ReactNode, createContext, useContext, useRef } from 'react'
-import { useStore } from 'zustand'
-import { type DmStore, StoreZus } from './store'
-
-
-export type StoreApi = ReturnType<typeof StoreZus>
-
-export const StoreContext = createContext<StoreApi | undefined>(
-  undefined,
-)
-
-export interface StoreProviderProps {
-  children: ReactNode
-}
-
-export const StoreProvider = ({
-  children,
-}: StoreProviderProps) => {
-  const storeRef = useRef<StoreApi | null>(null)
-  if (!storeRef.current) {
-    // Create store instance if not initialized
-    storeRef.current = StoreZus() as StoreApi
-  }
-  return (
-    <StoreContext.Provider value={storeRef.current}>
-      {children}
-    </StoreContext.Provider>
-  )
-}
-
-export const useDmStore = <T,>(
-  selector: (store: DmStore) => T,
-): T => {
-  const storeContext = useContext(StoreContext)
-  if (!storeContext) {
-    throw new Error(`useStore must be used within StoreProvider`)
-  }
-
-  return useStore(storeContext, selector)
-}
\ No newline at end of file
diff --git a/apps/dm_new/app/store/map/index.tsx b/apps/dm_new/app/store/map/index.tsx
deleted file mode 100644
index f5b44c891..000000000
--- a/apps/dm_new/app/store/map/index.tsx
+++ /dev/null
@@ -1,114 +0,0 @@
-import { AUTH_USER_ID, CLAIM_NAME } from "@/src/shared/config";
-import { fetchType, getFetch } from "@/components/ui/api";
-import { DEV_URL_FO } from "@/components/ui/config";
-import { getCookie } from "@common/components/lib/cookie";
-import type { FacilityInfo, SubsInfo } from "./type";
-
-const tokenId = getCookie(AUTH_USER_ID);
-const Authorization = getCookie(CLAIM_NAME);
-
-const checkWrRegList = async () => {
-  const wrRegList = await getFetch(fetchType.WR, `/reuseFc/pubFc`);
-  return wrRegList;
-};
-
-const getRuseFclt = async (
-  page: string,
-  sggOrCity: string,
-  searchTxt?: string
-) => {
-  const checkWrRegListRes = await checkWrRegList();
-
-  let url = `/prcsFclt/ruseInfo/${page ? page : 1}/5/A/${sggOrCity ? sggOrCity : "0"}/0/1/SW`;
-
-  const ruseList = checkWrRegListRes.data.filter((item: string) => item !== "");
-
-  if (searchTxt) {
-    url = url + `/${searchTxt}`;
-  }
-
-  const response = await fetch(DEV_URL_FO + url, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      [AUTH_USER_ID]: tokenId ?? "",
-      [CLAIM_NAME]: Authorization ?? "",
-    },
-    body: JSON.stringify(ruseList),
-  });
-
-  const hasuList = await response.json().then((res: any) => {
-    const data = res.data
-      .map((item: any) => {
-        return {
-          ...item,
-          fctCpc: Number(item.fctCpc) || 0,
-          searchNm: item.fctNm,
-          searchPk: item.bscFctNm,
-        };
-      })
-      .filter((hasu:any) => ruseList.find((ruse:any) => hasu.bscFctCd === ruse));
-    return { data: data, count: res.count };
-  });
-
-  return hasuList;
-};
-
-export type DmMapActions = {
-  findRuseFclt(sggOrCity: string, searchTxt: string): void;
-  setSubsInfo(subsInfo: SubsInfo[]): void;
-};
-
-export type DmMapType = {
-  map: {
-    ruseFcltList: FacilityInfo[];
-    subsInfo: SubsInfo[];
-  };
-};
-
-export const dmMapState: DmMapType = {
-  map: {
-    ruseFcltList: [],
-    // subsInfo: [
-    //   {
-    //     ruseUtztnFcltNm: "수원제1,2 재이용1", // 재이용시설명
-    //     ruseUtztnFcltCd: "41110PB001R1",
-    //   },
-    //   {
-    //     ruseUtztnFcltNm: "낙양 재이용1", // 재이용시설명
-    //     ruseUtztnFcltCd: "41150SW001R1",
-    //   },
-    //   {
-    //     ruseUtztnFcltNm: "서남 재이용1", // 재이용시설명
-    //     ruseUtztnFcltCd: "11500PB001R1",
-    //   },
-    // ],
-    subsInfo:[]
-  },
-};
-export type DmMapStore = DmMapType & DmMapActions;
-
-export const DmMapReducer = (set: any): DmMapActions => {
-  return {
-    findRuseFclt: async (sggOrCity: string, searchTxt: string) => {
-      const ruseFcltList = await getRuseFclt("1", sggOrCity, searchTxt);
-
-      set((state: DmMapType) => ({
-        ...state,
-        map: {
-          ...state.map,
-          ruseFcltList: ruseFcltList.data,
-        },
-      }));
-    },
-    setSubsInfo: async (subsInfo: SubsInfo[]) => {
-      set((state: DmMapType) => ({
-        ...state,
-        map: {
-          ...state.map,
-          subsInfo: subsInfo,
-        },
-      }));
-    },
-  };
-};
diff --git a/apps/dm_new/app/store/map/type.tsx b/apps/dm_new/app/store/map/type.tsx
deleted file mode 100644
index adcaf7f37..000000000
--- a/apps/dm_new/app/store/map/type.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-export type FacilityInfo= {
-    bscFctCd: string;                 // 기본시설 코드
-    bscFctNm: string;                 // 기본시설명
-    rvbsnCd: string;                  // 유역 코드
-    rvbsn: string;                    // 유역명
-    lgbsn: string;                    // 대권역명
-    mdmbsn: string;                   // 중권역명
-    rgnCd: string;                    // 관할청 코드
-    rgnNm: string;                    // 관할청 명칭
-    adstDstrCd: string;              // 행정구역 코드
-    sido: string;                     // 시도
-    gugun: string;                    // 구군
-    addr: string;                     // 주소
-    fctCpc: string;                   // 시설용량
-    efflWqltStndrdCd: string;        // 방류수 수질기준 코드
-    efflWqltStndrdNm: string;        // 방류수 수질기준명
-    trtFrfNm: string;                // 처리공법명
-    trtDstr: string;                 // 처리구역
-    rnDt: string;                    // 사용개시일 (예: YYYYMMDD)
-    cmplDt: string;                  // 준공일자 (예: YYYYMMDD)
-    trstOprEtpNm: string;            // 위탁운영기관명
-    bscFctClsNm: string;             // 기본시설 구분명
-    sitArea: string;                 // 부지면적
-    trtDstrArea: string;             // 처리구역 면적
-    swrTrtPopl: string;              // 하수처리 인구
-    mnstr: string;                   // 총괄 유역
-    efflWtrrgn: string;              // 방류수역
-    rvNm: string;                    // 하천명
-    bscFctClsCd: string;             // 기본시설 구분 코드
-    rvbsnNm: string;                 // 유역명
-    tel: string;                     // 전화번호
-    rswtrYn: string;                 // 재이용수 여부 ("Y" 또는 "N")
-    ruse: boolean;                   // 재이용 여부 (boolean)
-  }
-
-  export type SubsInfo={
-    ruseUtztnFcltNm: string;        // 재이용시설명
-    ruseUtztnFcltCd: string;        // 재이용시설 코드
-  }
\ No newline at end of file
diff --git a/apps/dm_new/app/store/readme.md b/apps/dm_new/app/store/readme.md
deleted file mode 100644
index 0710aa69b..000000000
--- a/apps/dm_new/app/store/readme.md
+++ /dev/null
@@ -1,121 +0,0 @@
-# Zustand store
-## Zustand 등록방법 
-**-- index.tsx --**
-### context 등록
-기본적으로 createContext를 통해 react에 context를 생성해서 react에서 사용할 수 있도록 해야함.
-``` js
-//StoreZus는 내부적으로 사용하기 위한 store파일에서 따로 생성함.
-export type StoreApi = ReturnType<typeof StoreZus>
-//react에서 사용하기 위한 context 생성.
-export const StoreContext = createContext<StoreApi | undefined>(
-  undefined,
-)
-```
-
-### component로 작성
-등록된 context를 component화 시키기 위한 작업
-```js
-//외부에서 호출시 <StoreProvider> 형태로 호출.
-//app이나 home에서 전체적인 사용이 되도록 작성해야함.
-export const StoreProvider = ({
-  children,
-}: StoreProviderProps) => {
-  const storeRef = useRef<StoreApi>(null)
-  if (!storeRef.current) {
-    //StoreZus는 store.tsx를 봐야함.
-    storeRef.current = StoreZus()
-  }
-  return (
-    <StoreContext.Provider value={storeRef.current}>
-      {children}
-    </StoreContext.Provider>
-  )
-}
-```
-
-### store 등록
-react에서 사용하는 store에 현재 context 등록
-```js
-export const useWrStore = <T,>(
-  selector: (store: WrStore) => T,
-): T => {
-  const storeContext = useContext(StoreContext)
-  if (!storeContext) {
-    throw new Error(`useStore must be used within StoreProvider`)
-  }
-
-  return useStore(storeContext, selector)
-}
-```
-
-## Zustand 사용방법
-**-- store.tsx, 폴더별 index.tsx --**
-### 기본 store 생성
-index.tsx의 context에 사용되는 StoreZus를 추가하여 사용됨.
-
-외부에서 생성된 state, actions를 사용 가능한 구조
-```js
-import { createStore } from 'zustand/vanilla';
-import { tableActionsExport, tableStateExport, type tableState, type tableType } from './publicReuseFaciltyInsert/index';//외부 파일 위치.
-export type WrStore = tableType;//typescript이므로 사용되는 스크립트를 type1 & type2 형식으로 넣어야함.
-//index.tsx에서 사용하는 store 생성.
-export const StoreZus = (initState: tableState = tableStateExport) => {
-  return createStore<WrStore>()((set) => {
-    return {
-        //아래에서 사용하는 state & actions은 외부 폴더에서 가져다가 사용.
-      ...initState,//외부에 있는 기본 초기값 state
-      ...tableActionsExport(set)//외부에 있는 actions
-    }
-  })
-}
-```
-### 외부 스토어 작성 방법
-외부 스토어는 export를 어떻게 할건지만 정하면됨.
-
-사용하는 store.tsx에서 import를 받기만 하면 사용가능.
-#### 타입을 외부로 빼는 방법
-```js
-export type tableState = {
-    isInit: boolean;
-    upHeadList: TableUpperProps[];
-    publicReuseFacilityUper: PublicReuseFacility[];
-}
-type tableActions = {
-    decrementList: () => void
-}
-
-export type tableType = tableState & tableActions;
-```
-#### 초기값 state를 외부로 빼는 방법
-```js
-export const tableStateExport:tableState= {
-    isInit:false,
-    upHeadList: upHeadList,
-    publicReuseFacilityUper: publicReuseFacilityUper,
-}
-```
-#### actions를 외부로 빼는 방법
-```js
-//tableActionsExport를 import 받아서 실행하여 return 된 값을 사용
-export const tableActionsExport:(set:any)=>tableActions=
-//set을 통해 react store에 등록
-(set: any) => {
-    return {
-        //decrementList Object 형태로 전달
-        decrementList:
-        //set 함수를 실행해서 react store에 등록
-        ()=>set(
-            // store에 등록되는 함수 구조를 가지고 있음.
-            (state:tableState) => {
-                //actions 실질적인 로직 작성하는 곳.
-            return (
-            { 
-                upHeadList: state.upHeadList, 
-                publicReuseFacilityUper: 
-                state.publicReuseFacilityUper.slice(0, state.publicReuseFacilityUper.length - 1)
-            })}
-        )
-    }
-}
-```
-
diff --git a/apps/dm_new/app/store/sdmMng/index.tsx b/apps/dm_new/app/store/sdmMng/index.tsx
deleted file mode 100644
index 393f2503b..000000000
--- a/apps/dm_new/app/store/sdmMng/index.tsx
+++ /dev/null
@@ -1,801 +0,0 @@
-import { fetchType, getFetch, postFetch } from "@/components/ui/api";
-import type { SelectDataType } from "@common/business_components/ui";
-import type { TableUpperProps } from "../common";
-import toast from "react-hot-toast";
-import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
-import { z } from "zod";
-
-/**====================================
- * Store - 타입
-=====================================*/
-
-export const sdmInfoFormSchema = z.object({
-  sdmNm: z.string().min(1, "수요처를 선택해주세요"),
-  demandYmd: z.date().optional(),
-  demandQnty: z
-    .string()
-    .min(1, "요구수량을 입력해주세요")
-    .regex(/^[0-9]+$/, "요구수량은 숫자만 입력 가능합니다"),
-  usePurpose: z.string().optional(),
-  money: z.string().regex(/^[0-9]+$/, "희망단가는 숫자만 입력 가능합니다"),
-  /**요구수질 */
-  reqWaterQlty: z.string().optional(),
-  grssClfg: z.number().nullish(),
-  tn: z.number().nullish(),
-  combResdch: z.number().nullish(),
-  tph: z.number().nullish(),
-  trbt: z.number().nullish(),
-  ph: z.string().nullish(),
-  bod: z.number().nullish(),
-  /**컬럼확인필요 */
-  clIonQnt: z.number().nullish(),
-  smll: z.string(),
-  cdtnv: z.number().nullish(),
-  crmty: z.number().nullish(),
-  rmrk: z.string().optional(),
-  /* telno: z.string()
-    .min(8, "전화번호는 8자 이상 입력해주세요")
-    .max(12, "전화번호는 12자 이내로 입력해주세요")
-    .regex(/^[0-9-]+$/, "전화번호는 숫자와 하이픈(-)만 입력 가능합니다"), */
-  candidateTitle: z
-    .array(
-      z.object({
-        ruseUtztnFcltNm: z.string(),
-        ruseUtztnFcltCd: z.string(),
-      })
-    )
-    .optional(),
-}).superRefine((data, ctx) => {
-  const disabledFields = disableRules[data.usePurpose ?? ""] || [];
-  // 모든 수질 관련 필드
-  // 총대장균군수는 null 값을 불검출로 표시하기때문에 해당 검사에서 제외함.
-  const allFields: (keyof typeof data)[] = [
-    "tn", "combResdch", "tph",
-    "trbt", "ph", "bod", "clIonQnt",
-    "smll", "cdtnv", "crmty",
-  ];
-
-  const allFieldsName: Record<string, string> = {
-    tn: "총질소(T-N)(mg/L)",
-    combResdch: "결합잔류염소(mg/L)",
-    tph: "총인(T-P)(mg/L)",
-    trbt: "탁도(NTU)",
-    ph: "수소이온농도(pH)",
-    bod: "생물학적 산소요구량(BOD)(mg/L)",
-    clIonQnt: "염화물(mgCL/L)",
-    smll: "냄새",
-    cdtnv: "전기전도도(㎲/cm)",
-    crmty: "색도(도)",
-  };
-  allFields.forEach((field) => {
-    const isDisabled = disabledFields.includes(field);
-    if (!isDisabled) {
-      // disabled가 아닌 필드는 반드시 값이 있어야 함
-      const value = data[field];
-      if (typeof value === "string") {
-        if (value.trim().length === 0) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            path: [field],
-            message: `${allFieldsName[field]} 을 입력해주세요.`,
-          });
-        }
-      } else if (typeof value === "number") {
-        if (value <= 0 || Number.isNaN(value)) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            path: [field],
-            message: `${allFieldsName[field]} 을 입력해주세요.`,
-          });
-        }
-      } else if (value == null) {
-        ctx.addIssue({
-          code: z.ZodIssueCode.custom,
-          path: [field],
-          message: `${allFieldsName[field]}  을 입력해주세요.`,
-        });
-      }
-    }
-  });
-});
-
-export type SdmInfoFormData = z.infer<typeof sdmInfoFormSchema>;
-
-
-// 수요처 정보
-export type DemandCompBizType = {
-  index: number | '';
-  dmdInfoId: string | '';
-  dmdInfoFk: string | '';
-  bzmnNo: string | '';
-  dmdCoNm: string | '';
-  zip: string | '';
-  daddr: string | '';
-  telno: string | '';
-  rgtr: string | '';
-  useUsgCd: string | '';
-  ctpvCd: string | '';
-  sggCd: string | '';
-  dmdAplyPswd: string | '';
-  wntUntprc: number | '';
-  dmndTmng: Date | '';
-  dmndQty: number | '';
-  grssClfg: number | null //총대장균군수
-  tn: number | null //총질소
-  combResdch: number | null //결합잔류염소
-  tph: number | null //총인
-  trbt: number | null //탁도
-  ph: string | ''; //수소이온농
-  blgcOxygDmndQnt: number | null //생물학적산소요구량
-  clIonQnt: number | null //염화물
-  smll: string | ''; //냄새
-  cdtnv: number | null; //전기전도도
-  crmty: number | null //색도
-  rmrk: string | '';
-  reqDt: string | '';
-  dmdInfoSn: number | '';
-  status: string | '';
-  splyCndtList: SupplyCandidate[] | [],
-  ruseUtztnFcltNm?: string | ''
-
-}
-
-// 공급 후보자 타입 정의
-export type SupplyCandidate = {
-  ruseUtztnFcltNm: string;
-  ruseUtztnFcltCd: string;
-};
-
-
-export type DemandMatchings = {
-  splyFcltFk: string | '';
-  splyFcltFlg: string | '';
-  pbnstRuseFcltBizFk: number | '';
-  splyBgngDay: string | '';
-  splyEndDay: string | '';
-  splyCpct: number | '';
-  splyFmYn: string | '';
-  useUsgCd: string | '';
-  dmdInfoSn: number | '';
-  splyCndtList: string | '';
-  mtchnCmptnYmd: string | '';
-  rvwCmptnYmd: string | '';
-  regDt: string | '';
-  rgtr: string | '';
-  mdfcnDt: string | '';
-  mdfr: string | '';
-}
-
-// 유사사례
-export type SimilarCaseType = {
-  ruseBizNm: string | '';    // 사업명
-  bizBgngDate: string | '';
-  bizEndDate: string | '';
-  splyFcltKnd: string | '';
-  splyFcltNm: string | '';
-  splyFcltCpct: string | '';
-  dmdFcltNm: string | '';
-  dmdFcltAddr: string | '';
-  ruseFcltCpct: string | '';
-  ruseFcltPplLen: string | '';
-  ruseFcltUsg: string | '';
-  ruseFcltSplyCpct: string | '';
-  ruseFcltPrcsMsrc: string | '';
-  grnteWqUsg: string | '';
-  grnteWqGrssClfg: string | '';
-  grnteWqCombResdch: string | '';
-  grnteWqTrbt: string | '';
-  grnteWqBod: string | '';
-  grnteWqSmll: string | '';
-  grnteWqCrmty: string | '';
-  grnteWqTn: string | '';
-  grnteWqTp: string | '';
-  grnteWqPh: string | '';
-  grnteWqClIonQnt: string | '';
-  grnteWqCndctStat: string | '';
-  grnteWqRmrk: string | '';
-  reqBizReuseFcltCst: string | '';
-  reqBizPplCst: string | '';
-  reqBizArchCst: string | '';
-  reqBizMchnCst: string | '';
-  reqBizMtrngCst: string | '';
-  reqBizGisCst: string | '';
-  reqBizCctvCst: string | '';
-  reqBizCmcnCst: string | '';
-  reqBizWstCst: string | '';
-  reqBizDesignCst: string | '';
-  reqBizSpvsCst: string | '';
-  reqBizSbsdCst: string | '';
-  reqBizEtc: string | '';
-  reqBizGrssCst: string | '';
-  prcmPlanNlep: string | '';
-  prcmPlanLcep: string | '';
-  prcmPlanBrdnCst: string | '';
-  prcmPlanEcqrRt: string | '';
-  prcmPlanGrssCst: string | '';
-  clclnNlep: string | '';
-  clclnLcep: string | '';
-  clclnBrdnCst: string | '';
-  clclnEcqrRt: string | '';
-  clclnGrssCst: string | '';
-}
-
-// 사업비 상세정보
-export type MoneyDetailType = {
-  reqBizGrssCst: string | '';
-  reqBizReuseFcltCst: string | '';
-  reqBizPplCst: string | '';
-  reqBizArchCst: string | '';
-  reqBizMchnCst: string | '';
-  reqBizMtrngCst: string | '';
-  reqBizGisCst: string | '';
-  reqBizCctvCst: string | '';
-  reqBizCmcnCst: string | '';
-  reqBizWstCst: string | '';
-  reqBizDesignCst: string | '';
-  reqBizSpvsCst: string | '';
-  reqBizSbsdCst: string | '';
-  reqBizEtc: string | '';
-
-  /** 재원조달계획(백만원원) */
-  prcmPlanGrssCst: string | '';
-  prcmPlanNlep: string | '';
-  prcmPlanLcep: string | '';
-  prcmPlanBrdnCst: string | '';
-  prcmPlanEcqrRt: string | '';
-  /** 사업비 정산(백만원) */
-  clclnGrssCst: string | '';
-  clclnNlep: string | '';
-  clclnLcep: string | '';
-  clclnBrdnCst: string | '';
-  clclnEcqrRt: string | '';
-}
-// 규칙 타입 선언
-export type DisableRulesType = Record<string, string[]>;
-/**====================================
- * Store - 데이터
- ====================================*/
-// 수요처 정보
-const demandCompList: DemandCompType[] = [
-]
-
-
-const disableRules: DisableRulesType = {
-  "청소": ["tn", 'tph', "clIonQnt", 'cdtnv'],
-  "화장실용수": ["tn", 'tph', "clIonQnt", 'cdtnv'],
-  "세척": ["combResdch", "crmty", 'tph', 'tn', "clIonQnt", 'cdtnv'],
-  "살수": ["combResdch", "crmty", 'tph', 'tn', "clIonQnt", 'cdtnv'],
-  "조경": ["combResdch", "crmty", 'tph', 'cdtnv'],
-  "농업_간접용수": ["combResdch", "crmty", 'tn', 'tph', 'clIonQnt'],
-  "농업_직접용수": ["combResdch", "crmty", 'tn', 'tph', 'clIonQnt'],
-  "하천": ["combResdch", "trbt", "crmty", 'clIonQnt', 'cdtnv'],
-  '공업': []
-};
-
-const defaultRules: Record<string, object> = {
-  "청소": {
-    grssClfg: null,
-    combResdch: 0.2,
-    trbt: 2,
-    bod: 5,
-    crmty: 20,
-    ph: "5.8~8.5",
-    smll: '불쾌하지않을것',
-    tn: null,
-    tph: null,
-    clIonQnt: null,
-    cdtnv: null,
-
-  },
-  "화장실용수": {
-    grssClfg: null,
-    combResdch: 0.2,
-    trbt: 2,
-    bod: 5,
-    crmty: 20,
-    smll: '불쾌하지않을것',
-    ph: "5.8~8.5",
-    tn: null,
-    tph: null,
-    clIonQnt: null,
-    cdtnv: null,
-  },
-  "세척": {
-    grssClfg: null,
-    trbt: 2,
-    bod: 5,
-    ph: "5.8~8.5",
-    combResdch: null,
-    smll: '불쾌하지않을것',
-    crmty: null,
-    tn: null,
-    tph: null,
-    clIonQnt: null,
-    cdtnv: null,
-  },
-  "살수": {
-    grssClfg: null,
-    trbt: 2,
-    bod: 5,
-    ph: "5.8~8.5",
-    smll: '불쾌하지않을것',
-    combResdch: null,
-    crmty: null,
-    tn: null,
-    tph: null,
-    clIonQnt: null,
-    cdtnv: null,
-  },
-  "조경": {
-    grssClfg: null,
-    trbt: 2,
-    bod: 5,
-    ph: "5.8~8.5",
-    smll: '불쾌하지않을것',
-    clIonQnt: 250,
-    combResdch: null,
-    crmty: null,
-    tn: null,
-    tph: null,
-    cdtnv: null,
-  },
-  "농업_간접용수": {
-    grssClfg: null,
-    trbt: 5,
-    bod: 8,
-    ph: "5.8~8.5",
-    cdtnv: 2000,
-    combResdch: null,
-    crmty: null,
-    tn: null,
-    tph: null,
-    clIonQnt: null,
-  },
-  "농업_직접용수": {
-    grssClfg: null,
-    trbt: 2,
-    bod: 8,
-    smll: '불쾌하지않을것',
-    ph: "5.8~8.5",
-    cdtnv: 700,
-    combResdch: null,
-    crmty: null,
-    tn: null,
-    tph: null,
-    clIonQnt: null,
-  },
-  "하천": {
-    grssClfg: 1000,
-    bod: 5,
-    tn: 10,
-    tph: 0.5,
-    smll: '불쾌하지않을것',
-    ph: "5.8~8.5",
-    combResdch: null,
-    trbt: null,
-    crmty: null,
-    clIonQnt: null,
-    cdtnv: null
-  },
-  '공업': {
-    grssClfg: null,
-    bod: null,
-    tn: null,
-    tph: null,
-    ph: "~",
-    combResdch: null,
-    smll: '불쾌하지않을것',
-    trbt: null,
-    crmty: null,
-    clIonQnt: null,
-    cdtnv: null
-  }
-};
-
-// 사용용도
-const useTypesData: SelectDataType[] = [
-  { text: '청소', val: "청소" },
-  { text: "화장실용수", val: "화장실용수" },
-  { text: "세척", val: "세척" },
-  { text: "살수", val: "살수" },
-  { text: "조경", val: "조경" },
-  { text: "농업_간접용수", val: "농업_간접용수" },
-  { text: "농업_직접용수", val: "농업_직접용수" },
-  { text: "하천", val: "하천" },
-  { text: "공업", val: "공업" },
-];
-
-// 유사사례 모달 헤더
-export const similarCaseModalHeader: TableUpperProps[] = [
-  { id: "ruseBizNm", title: "사업명", row: 0, rowSpan: 2 },
-  { id: "bizBgngDate", title: "사업시작일", row: 0, rowSpan: 2 },
-  { id: "bizEndDate", title: "사업종료일", row: 0, rowSpan: 2 },
-  { id: "A", title: "공급처", row: 0, colSpan: 3 },
-  { id: "splyFcltKnd", title: "시설종류", row: 1 },
-  { id: "splyFcltNm", title: "공급처명", row: 1 },
-  { id: "splyFcltCpct", title: "시설용량\n(㎥/일)", row: 1 },
-  { id: "B", title: "수요처", row: 0, colSpan: 2 },
-  { id: "dmdFcltNm", title: "수요처명", row: 1 },
-  { id: "dmdFcltAddr", title: "주소", row: 1 },
-  { id: "C", title: "재이용시설", row: 0, colSpan: 5 },
-  { id: "ruseFcltCpct", title: "시설용량\n(㎥/일)", row: 1 },
-  { id: "ruseFcltPplLen", title: "관로\n(km)", row: 1 },
-  { id: "ruseFcltUsg", title: "용도", row: 1 },
-  { id: "ruseFcltSplyCpct", title: "공급량\n(㎥/일)", row: 1 },
-  { id: "ruseFcltPrcsMsrc", title: "처리공법", row: 1 },
-  { id: "D", title: "보증수질", row: 0, colSpan: 13 },
-  { id: "grnteWqUsg", title: "용도별", row: 1 },
-  { id: "grnteWqGrssClfg", title: "총대장균군수\n(개/100ml)", row: 1 },
-  { id: "grnteWqCombResdch", title: "결합잔류염소\n(mg/L)", row: 1 },
-  { id: "grnteWqTrbt", title: "탁도\n(NTU)", row: 1 },
-  { id: "grnteWqBod", title: "생물학적산소요구량\n(BOD)\n(mg/L)", row: 1 },
-  { id: "grnteWqSmll", title: "냄새\n(개/100ml)", row: 1 },
-  { id: "grnteWqCrmty", title: "색도\n(도)", row: 1 },
-  { id: "grnteWqTn", title: "총질소\n(T-N)\n(mg/L)", row: 1 },
-  { id: "grnteWqTp", title: "총인\n(T-P)\n(mg/L)", row: 1 },
-  { id: "grnteWqPh", title: "수소이온농도\n(pH)", row: 1 },
-  { id: "grnteWqClIonQnt", title: "염화물\n(mgCL/L)", row: 1 },
-  { id: "grnteWqCndctStat", title: "전기전도도\n(μS/cm)", row: 1 },
-  { id: "grnteWqRmrk", title: "비고", row: 1 },
-  { id: "reqBizGrssCst", title: "소요사업비\n(백만원)", row: 0, rowSpan: 2 },
-]
-
-// 유사사례 데이터
-const similarCaseList: SimilarCaseType[] = [
-
-]
-
-// 사업비 상세정보 모달 헤더
-export const moneyDetailModalHeader: TableUpperProps[] = [
-  { id: "A", title: "소요사업비(백만원)", row: 0, colSpan: 14 },
-  { id: "reqBizGrssCst", title: "총", row: 1, rowSpan: 2 },
-  { id: "B", title: "토목", row: 1, colSpan: 2 },
-  { id: "reqBizReuseFcltCst", title: "재이용시설", row: 2 },
-  { id: "reqBizPplCst", title: "관로", row: 2 },
-  { id: "reqBizArchCst", title: "건축", row: 1, rowSpan: 2 },
-  { id: "reqBizMchnCst", title: "기계", row: 1, rowSpan: 2 },
-  { id: "reqBizMtrngCst", title: "전기,계측", row: 1, rowSpan: 2 },
-  { id: "reqBizGisCst", title: "GIS/DB", row: 1, rowSpan: 2 },
-  { id: "reqBizCctvCst", title: "CCTV", row: 1, rowSpan: 2 },
-  { id: "reqBizCmcnCst", title: "시공 및 준공", row: 1, rowSpan: 2 },
-  { id: "reqBizWstCst", title: "폐기물", row: 1, rowSpan: 2 },
-  { id: "reqBizDesignCst", title: "설계비", row: 1, rowSpan: 2 },
-  { id: "reqBizSpvsCst", title: "감리비", row: 1, rowSpan: 2 },
-  { id: "reqBizSbsdCst", title: "시설 부대비", row: 1, rowSpan: 2 },
-  { id: "reqBizEtc", title: "기타", row: 1, rowSpan: 2 },
-  { id: "C", title: "재원조달계획(백만원)", row: 0, colSpan: 5 },
-  { id: "prcmPlanGrssCst", title: "총", row: 1, rowSpan: 2 },
-  { id: "prcmPlanNlep", title: "국비", row: 1, rowSpan: 2 },
-  { id: "prcmPlanLcep", title: "지방비", row: 1, rowSpan: 2 },
-  { id: "prcmPlanBrdnCst", title: "원인자부담", row: 1, rowSpan: 2 },
-  { id: "prcmPlanEcqrRt", title: "국고비율", row: 1, rowSpan: 2 },
-  { id: "D", title: "사업비 정산(백만원)", row: 0, colSpan: 5 },
-  { id: "clclnGrssCst", title: "총", row: 1, rowSpan: 2 },
-  { id: "clclnNlep", title: "국비", row: 1, rowSpan: 2 },
-  { id: "clclnLcep", title: "지방비", row: 1, rowSpan: 2 },
-  { id: "clclnBrdnCst", title: "원인자부담", row: 1, rowSpan: 2 },
-  { id: "clclnEcqrRt", title: "국고비율", row: 1, rowSpan: 2 },
-]
-
-// 사업비 상세정보
-const moneyDetailList: MoneyDetailType[] = [
-]
-
-// 수요정보 신청현황 헤더
-export const upHeadSdmInfoStatus: TableUpperProps[] = [
-  { id: "index", title: "No." },
-  { id: "ctpvCd", title: "시도", row: 0, rowSpan: 2 },
-  { id: "sggCd", title: "시군구", row: 0, rowSpan: 2 },
-  { id: "dmdCoNm", title: "회사명", row: 0, rowSpan: 2 },
-  { id: "daddr", title: "공장주소", row: 0, rowSpan: 2 },
-  { id: "telno", title: "전화번호", row: 0, rowSpan: 2 },
-  { id: "dmndTmng", title: "신청일자", row: 0, rowSpan: 2 },
-  { id: "status", title: "진행상태", row: 0, rowSpan: 2 },
-]
-
-// 수요정보 신청현황 데이터
-
-/**====================================
- * Store - Api
-=====================================*/
-// 수요처 등록  
-const postSdmData = async (data: DemandCompType) => {
-  try {
-    await postFetch("/reuseFc/request", data);
-    sessionStorage.setItem("user", JSON.stringify(data));
-    toast.success("수요처 등록에 성공하였습니다.");
-    return true;
-  } catch (error) {
-    console.log(error);
-    toast.error("수요처 등록에 실패하였습니다.");
-    return false;
-  }
-}
-
-// 수요정보 등록
-const postSdmInfoData = async (data: DemandCompBizType) => {
-  try {
-    await postFetch("/reuseFc/request/demandInfo", data);
-    toast.success('수요 정보 등록에 성공하였습니다.');
-  } catch (error) {
-    console.log(error);
-    toast.error('수요 정보 등록에 실패하였습니다.');
-  }
-}
-
-const postSdmLoginData = async (data: DemandCompType) => {
-  try {
-    const res = await postFetch("/reuseFc/request/login", data);
-    const jsonData = await res.json();
-
-    const status = jsonData.status;
-    const loginData = jsonData.data;
-    let loginSuccess = false;
-    if (status === 200 && loginData != null) {
-      alert("수요처 로그인에 성공하였습니다.");
-      delete loginData.dmdAplyPswd;
-      delete loginData.rgtr;
-      sessionStorage.setItem("user", JSON.stringify(loginData));
-      loginSuccess = true;
-    } else if (status === 401) {
-      alert("패스워드가 일치하지 않습니다.");
-      loginSuccess = false;
-    } else {
-      alert("등록된 수요처가 없습니다.");
-      loginSuccess = false;
-    }
-
-    return loginSuccess;
-  } catch (error) {
-    console.log(error);
-    alert("수요처 로그인에 실패하였습니다.");
-  }
-}
-
-const getDemandCompList = async (searchText: string, pageCnt: number) => {
-  try {
-    const url = '/reuseFc/request/' + (searchText ? searchText : '') + '/' + pageCnt;
-    const res = await getFetch(fetchType.WR, url);
-    return {
-      data: res?.data || [],
-      count: res?.count || 0
-    }
-  } catch (error) {
-    console.error(error + ' 수요처 정보를 불러오지 못했습니다.');
-    return { data: [], count: 0 };
-  }
-}
-
-const getSdmInfoStatusList = async (dmdInfoId: string) => {
-  try {
-    const url = '/reuseFc/request/' + dmdInfoId;
-    const res = await getFetch(fetchType.WR, url);
-    return res?.data || [];
-  } catch (error) {
-    console.error(error + ' 수요정보 신청현황을 불러오지 못했습니다.');
-    return [];
-  }
-}
-
-// 유사사례 조회
-const fetchGetSimilarCaseList = async (part: string, value: number | string) => {
-  try {
-    const url = '/reuseFc/pubFcRuseCase/dm/' + part + '/' + (value ? value : 0);
-    const res = await getFetch(fetchType.WR, url);
-    return res?.data || [];
-  } catch (error) {
-    console.error(error + ' 유사사례 조회에 실패하였습니다.');
-    return [];
-  }
-}
-
-/**====================================
- * Store - expaort
- ====================================*/
-export type SdmActions = {
-  initializeSdmData: () => void;
-  insertSdmData: (data: DemandCompType) => Promise<void>;
-  insertSdmInfoData: (data: DemandCompBizType) => Promise<void>;
-  getDemandCompList: (searchText: string, pageCnt: number) => Promise<void>;
-  actionLogin: (data: DemandCompType) => Promise<void>;
-  getSdmInfoStatusList: (dmdInfoId: string) => Promise<void>;
-  getSimilarCaseList: (part: string, value: number | string) => Promise<void>;
-  actionLogout: () => Promise<void>;
-}
-
-export type SdmType = {
-  Sdm: {
-    isInit: boolean;
-    useTypesData: SelectDataType[];
-    demandCompList: DemandCompType[];
-    upHeadSimilarCaseList: TableUpperProps[];
-    similarCaseList: SimilarCaseType[];
-    upHeadMoneyDetailList: TableUpperProps[];
-    moneyDetailList: MoneyDetailType[];
-
-    // 수요정보 신청현황
-    sdmInfoStatusList: DemandCompBizType[];
-    upHeadSdmInfoStatus: TableUpperProps[];
-    defaultRules: Record<string, object>
-    disableRules: DisableRulesType;
-    // 로그인관련
-    successNextPage: boolean;
-    successLogin: boolean;
-  }
-}
-
-export const SdmState: SdmType = {
-  Sdm: {
-    isInit: false,
-    useTypesData: useTypesData,
-    demandCompList: demandCompList,
-    upHeadSimilarCaseList: similarCaseModalHeader,
-    similarCaseList: similarCaseList,
-    upHeadMoneyDetailList: moneyDetailModalHeader,
-    moneyDetailList: moneyDetailList,
-    // 수요정보 신청현황
-    sdmInfoStatusList: [],
-    defaultRules: defaultRules,
-    disableRules: disableRules,
-    upHeadSdmInfoStatus: upHeadSdmInfoStatus,
-
-    // 로그인관련
-    successNextPage: false,
-    successLogin: false,
-  }
-}
-
-export const SdmReducer = (set: any): SdmActions => {
-  return {
-    initializeSdmData: async () => {
-    },
-
-    insertSdmData: async (data: DemandCompType) => {
-      const preRes = await getSdmInfoStatusList(data.dmdInfoId);
-      if (preRes?.dmdInfoId) {
-        toast.error('이미 등록된 수요처입니다.');
-        return;
-      }
-
-      const res = await postSdmData(data);
-      if (res) {
-        set((state: SdmType) => ({
-          Sdm: {
-            ...state.Sdm,
-            successNextPage: true,
-          }
-        }))
-      }
-    },
-
-    insertSdmInfoData: async (data: DemandCompBizType) => {
-      postSdmInfoData(data);
-    },
-
-    // 수요처 정보
-    getDemandCompList: async (searchText: string, pageCnt: number) => {
-      const res = await getDemandCompList(searchText, pageCnt);
-      if (res.data.length === 0) {
-        set((state: SdmType) => ({
-          Sdm: {
-            ...state.Sdm,
-            demandCompList: [],
-          }
-        }))
-        return;
-      } else {
-        set((state: SdmType) => ({
-          Sdm: {
-            ...state.Sdm,
-            demandCompList: res.data,
-          }
-        }))
-      }
-    },
-
-    // 수요정보 신청현황
-    getSdmInfoStatusList: async (dmdInfoId: string) => {
-      const res = await getSdmInfoStatusList(dmdInfoId);
-
-      if (res.length === 0) {
-        set((state: SdmType) => ({
-          Sdm: {
-            ...state.Sdm,
-            sdmInfoStatusList: [],
-          }
-        }))
-        return;
-      }
-      //const sdmInfoStatusList : DemandCompBizType[] = [];
-
-      const sdmInfoStatusList: DemandCompBizType[] = res.demandInfo.map((el: DemandCompBizType, index: number) => {
-        const matchingInfo = res.demandMatchings.find((matching: DemandMatchings) => matching.dmdInfoSn === el.dmdInfoSn);
-        const status = matchingInfo?.splyFcltFlg?.trim() === 'Sub' ? '검토' : matchingInfo?.splyFcltFlg?.trim() === 'matched' ? '매칭완료' : '신청';
-        const ruseUtztnFcltNm = matchingInfo?.ruseUtztnFcltNm ? matchingInfo.ruseUtztnFcltNm : '';
-
-
-        return ({
-          ...el,
-          index: ++index,
-          bzmnNo: res.bzmnNo,
-          dmdCoNm: res.dmdCoNm,
-          dmdInfoId: res.dmdInfoId,
-          zip: res.zip || '',
-          daddr: res.daddr,
-          telno: res.telno.replace(/(\d{3})(\d{4})(\d{4})/, '$1-$2-$3'),
-          rgtr: res.rgtr,
-          ctpvCd: res.ctpvCd,
-          sggCd: res.sggCd,
-          useUsgCd: el.useUsgCd,
-          dmndTmng: el.dmndTmng,
-          dmdInfoSn: el.dmdInfoSn,
-          status: status,
-          splyCndtList: el.splyCndtList,
-          ruseUtztnFcltNm: ruseUtztnFcltNm || ''
-        })
-      })
-
-      set((state: SdmType) => ({
-        Sdm: {
-          ...state.Sdm,
-          sdmInfoStatusList: sdmInfoStatusList,
-        }
-      }))
-    },
-
-    actionLogin: async (data: DemandCompType) => {
-      const loginSuccess = await postSdmLoginData(data);
-      set((state: SdmType) => ({
-        Sdm: {
-          ...state.Sdm,
-          successLogin: loginSuccess,
-        }
-      }))
-    },
-
-    // 유사사례 조회
-    getSimilarCaseList: async (part: string, value: number | string) => {
-      const res = await fetchGetSimilarCaseList(part, value);
-      const similarCaseList = res.map((el: SimilarCaseType) => {
-        const maskedBizNm = el.ruseBizNm
-          ? el.ruseBizNm.replace(/^(\s*)^\S+/, "***") // 첫 단어(공백 전까지) 치환
-          : el.ruseBizNm;
-
-        return {
-          ...el,
-          ruseBizNm: maskedBizNm,
-        };
-      });
-      console.log(similarCaseList);
-
-      if (similarCaseList && similarCaseList.length !== 0) {
-        set((state: SdmType) => ({
-          Sdm: {
-            ...state.Sdm,
-            similarCaseList: similarCaseList,
-          }
-        }))
-        return;
-      } else {
-        set((state: SdmType) => ({
-          Sdm: {
-            ...state.Sdm,
-            similarCaseList: [],
-          }
-        }))
-        return;
-      }
-    },
-
-    actionLogout: async () => {
-      sessionStorage.removeItem("user");
-      set((state: SdmType) => ({
-        Sdm: {
-          ...state.Sdm,
-          successLogin: false,
-        }
-      }))
-    }
-  }
-}
-export type SdmStore = SdmType & SdmActions;
diff --git a/apps/dm_new/app/store/store.tsx b/apps/dm_new/app/store/store.tsx
deleted file mode 100644
index 25508bae2..000000000
--- a/apps/dm_new/app/store/store.tsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import { createStore } from "zustand/vanilla";
-import {
-  CommonReducer,
-  CommonState,
-  type CommonStore,
-  type CommonType,
-} from "./common";
-import { SdmReducer, SdmState, type SdmStore, type SdmType } from "./sdmMng";
-import {
-  dmMapState,
-  type DmMapType,
-  type DmMapStore,
-  DmMapReducer,
-} from "./map";
-import { tokenManager } from "@/src/entities/auth/lib/token-manager";
-import {
-  DmStatusReducer,
-  dmStatusState,
-  type DmStatusStore,
-  type DmStatusType,
-} from "./wrStatus";
-
-export type DmStore = CommonStore & SdmStore & DmMapStore & DmStatusStore;
-export type DmState = CommonType & SdmType & DmMapType & DmStatusType;
-
-export const StoreZus = (
-  initState: DmState = {
-    ...CommonState,
-    ...SdmState,
-    ...dmMapState,
-    ...dmStatusState,
-  }
-) => {
-  return createStore<DmStore>()((set) => {
-    if (typeof window !== "undefined") {
-      tokenManager.setToken("site-id-key", process.env.NEXT_PUBLIC_SITE_ID||"DM");
-      tokenManager.setToken("site-theme-key", "green");
-    }
-
-    return {
-      ...initState,
-      ...CommonReducer(set),
-      ...SdmReducer(set),
-      ...DmMapReducer(set),
-      ...DmStatusReducer(set),
-    };
-  });
-};
diff --git a/apps/dm_new/app/store/wrStatus/index.tsx b/apps/dm_new/app/store/wrStatus/index.tsx
deleted file mode 100644
index d3cc61cc4..000000000
--- a/apps/dm_new/app/store/wrStatus/index.tsx
+++ /dev/null
@@ -1,129 +0,0 @@
-import { fetchType, getFetch } from "@/components/ui/api";
-import type {
-  DmStatusDataType,
-  DmStatusChartType,
-  DmStatusBoardType,
-} from "./type";
-import type { SelectDataType } from "../common";
-import { makeRegion } from "@/app/common/comFunction";
-
-export type DmStatusActions = {
-  getDmStatusData(cityCd: SelectDataType[]): void; // 데이터의 연도 반환
-};
-
-export type DmStatusType = {
-  dmStatus: {
-    year : string;
-    statusData: DmStatusDataType[];
-    facilityTotals: string[];
-    chartData: DmStatusChartType[];
-  };
-};
-
-export const dmStatusState: DmStatusType = {
-  dmStatus: {
-    year : '',
-    statusData: [],
-    facilityTotals: [],
-    chartData: [],
-  },
-};
-export type DmStatusStore = DmStatusType & DmStatusActions;
-
-export const DmStatusReducer = (set: any): DmStatusActions => {
-  return {
-    getDmStatusData: async (cityCd: SelectDataType[]) => {
-      const data = await getFetch(fetchType.FO, "/dashBoard/daemin");
-      const year = data.data[0]?.year; // API 응답에서 year 값을 할당합니다.
-      console.log('cityCd ', cityCd)
-      const dataSum = data.data.reduce(
-        (acc: DmStatusDataType, item: DmStatusDataType) => {
-          acc.sewage = (
-            parseInt(acc.sewage.replaceAll(",", "")) +
-            parseInt(item.sewage.replaceAll(",", ""))
-          ).toLocaleString();
-          acc.rainwater = (
-            parseInt(acc.rainwater.replaceAll(",", "")) +
-            parseInt(item.rainwater.replaceAll(",", ""))
-          ).toLocaleString();
-          acc.reclaimed = (
-            parseInt(acc.reclaimed.replaceAll(",", "")) +
-            parseInt(item.reclaimed.replaceAll(",", ""))
-          ).toLocaleString();
-          acc.sewageCnt = (
-            parseInt(acc.sewageCnt.replaceAll(",", "")) +
-            parseInt(item.sewageCnt.replaceAll(",", ""))
-          ).toLocaleString();
-          acc.rainwaterCnt = (
-            parseInt(acc.rainwaterCnt.replaceAll(",", "")) +
-            parseInt(item.rainwaterCnt.replaceAll(",", ""))
-          ).toLocaleString();
-          acc.reclaimedCnt = (
-            parseInt(acc.reclaimedCnt.replaceAll(",", "")) +
-            parseInt(item.reclaimedCnt.replaceAll(",", ""))
-          ).toLocaleString();
-          return acc;
-        },
-        {
-          region: "합계",
-          sewage: "0",
-          rainwater: "0",
-          reclaimed: "0",
-          sewageCnt: "0",
-          rainwaterCnt: "0",
-          reclaimedCnt: "0",
-        }
-      );
-      data.data.unshift(dataSum);
-
-      //console.log("dataSum ", dataSum);
-      const facilityTotals = [
-        "하수재이용시설" + "(총" + dataSum?.sewageCnt + "개소)",
-        "빗물재이용시설" + "(총" + dataSum?.rainwaterCnt + "개소)",
-        "중수도재이용시설" + "(총" + dataSum?.reclaimedCnt + "개소)",
-      ];
-
-      const boardData: DmStatusBoardType[] = data.data.map(
-        (item: DmStatusDataType) => {
-          const regionText = item.sidoNm; //cityCd.find((city) => item.region === city.val);
-          const sewage = item.sewage;
-          const rainwater = item.rainwater;
-          const reclaimed = item.reclaimed;
-          const sewageCnt = item.sewageCnt;
-          const rainwaterCnt = item.rainwaterCnt;
-          const reclaimedCnt = item.reclaimedCnt;
-          
-            return {
-              region: regionText ? regionText : item.region,
-              sewage: sewageCnt + "(" + sewage.toLocaleString() + ")",
-              rainwater: rainwaterCnt + "(" + rainwater.toLocaleString() + ")",
-              reclaimed: reclaimedCnt + "(" + reclaimed.toLocaleString() + ")",
-            };
-        }
-      ).filter((item): item is DmStatusBoardType => item !== undefined);
-
-      //console.log("boardData ", boardData);
-      
-      const chartData = data.data.map((item) => ({
-        label: makeRegion(
-          cityCd.find((city) => item.region === city.val)?.text ?? ""
-        ),
-        하수: item.sewage,
-        빗물: item.rainwater,
-        중수도: item.reclaimed,
-      }));
-
-      set((state: DmStatusType) => ({
-        ...state,
-        dmStatus: {
-          ...state.dmStatus,
-          year : year,
-          statusData: boardData,
-          chartData: chartData,
-          facilityTotals: facilityTotals,
-        },
-      }));
-
-    },
-  };
-};
diff --git a/apps/dm_new/app/store/wrStatus/type.ts b/apps/dm_new/app/store/wrStatus/type.ts
deleted file mode 100644
index 2cf1b36f0..000000000
--- a/apps/dm_new/app/store/wrStatus/type.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-export type DmStatusDataType = {
-  sidoNm: string; // 시도명
-  region: string; // 시도코드
-  sewage: string;
-  rainwater: string;
-  reclaimed: string;
-  sewageCnt:string;
-  rainwaterCnt:string;
-  reclaimedCnt:string;
-};
-
-export type DmStatusBoardType = {
-  sidoNm: string; // 시도명
-  region: string;
-  sewage: string;
-  rainwater: string;
-  reclaimed: string;
-};
-
-export type DmStatusFcltType = {
-    sewageFclt: string;
-    rainwaterFclt: string;
-    reclaimedFclt: string;
-    thermalFclt: string;
-  };
-  
-  
-  
-export type DmStatusChartType = {
-    label: string,
-    하수: string,
-    빗물: string,
-    중수도: string,
-}
-
-export type RegionData = {
-    name: string;
-    x: number;
-    y: number;
-    values: number[];
-  }
\ No newline at end of file
diff --git a/apps/dm_new/components.json b/apps/dm_new/components.json
deleted file mode 100644
index d9ef0ae53..000000000
--- a/apps/dm_new/components.json
+++ /dev/null
@@ -1,21 +0,0 @@
-{
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "default",
-  "rsc": true,
-  "tsx": true,
-  "tailwind": {
-    "config": "tailwind.config.ts",
-    "css": "app/globals.css",
-    "baseColor": "neutral",
-    "cssVariables": true,
-    "prefix": ""
-  },
-  "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils",
-    "ui": "@/components/ui",
-    "lib": "@/lib",
-    "hooks": "@/hooks"
-  },
-  "iconLibrary": "lucide"
-}
\ No newline at end of file
diff --git a/apps/dm_new/components/ui/api/index.ts b/apps/dm_new/components/ui/api/index.ts
deleted file mode 100644
index abb0c2c73..000000000
--- a/apps/dm_new/components/ui/api/index.ts
+++ /dev/null
@@ -1,99 +0,0 @@
-//8880
-import { AUTH_USER_ID, CLAIM_NAME } from "@/src/shared/config";
-import { getCookie } from "@common/components/lib/cookie";
-
-
-const tokenId = getCookie(AUTH_USER_ID);
-const Authorization = getCookie(CLAIM_NAME);
-
-export const fetchType = {
-  COMMON: "common",
-  WR: "wr",
-  FO: "fo",
-  SN: "sn"
-};
-
-const API_VERSION = "/api/v1"
-const servers = {
-  common: "",
-  local: "",
-  fo: "/operation-service" + API_VERSION,
-  wr: "/reuse-service" + API_VERSION,
-  sn: "/sewerage-service" + API_VERSION,
-}
-
-interface RequestParams {
-  [key: string]: unknown;
-}
-
-export const getFetch = async (type: string, url: string) => {
-  const baseUrl = servers[type];
-  const response = await fetch(baseUrl + url, {
-    method: "GET",
-    headers: {
-      accept: "application/json",
-      [AUTH_USER_ID]: tokenId ?? "",
-      [CLAIM_NAME]: Authorization ?? "",
-    },
-  });
-
-  if (!response.ok) {
-    throw new Error(`오류 발생: ${response.status}`);
-  }
-  const res = await response.json();
-  return res;
-};
-
-export const postFetch = async (url: string, params: RequestParams) => {
-  const baseUrl = servers[fetchType.WR];
-  const response = await fetch(baseUrl + url, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      [AUTH_USER_ID]: tokenId ?? "",
-      [CLAIM_NAME]: Authorization ?? "",
-    },
-    body: JSON.stringify(params),
-  });
-
-  if (!response.ok) {
-    throw new Error(`오류 발생: ${response.status}`);
-  }
-  return response;
-};
-
-export const putFetch = async (url: string, params: RequestParams) => {
-  const baseUrl = servers[fetchType.WR];
-  const response = await fetch(baseUrl + url, {
-    method: "PUT",
-    headers: {
-      "Content-Type": "application/json",
-      [AUTH_USER_ID]: tokenId ?? "",
-      [CLAIM_NAME]: Authorization ?? "",
-    },
-    body: JSON.stringify(params),
-  });
-
-  if (!response.ok) {
-    throw new Error(`오류 발생: ${response.status}`);
-  }
-  return response;
-};
-
-export const deleteFetch = async (url: string, params: RequestParams) => {
-  const baseUrl = servers[fetchType.WR];
-  const response = await fetch(baseUrl + url, {
-    method: "DELETE",
-    headers: {
-      "Content-Type": "application/json",
-      [AUTH_USER_ID]: tokenId ?? "",
-      [CLAIM_NAME]: Authorization ?? "",
-    },
-    body: JSON.stringify(params),
-  });
-
-  if (!response.ok) {
-    throw new Error(`오류 발생: ${response.status}`);
-  }
-  return response;
-};   
\ No newline at end of file
diff --git a/apps/dm_new/components/ui/common/searhDemandInput/component.tsx b/apps/dm_new/components/ui/common/searhDemandInput/component.tsx
deleted file mode 100644
index 70ccf9efc..000000000
--- a/apps/dm_new/components/ui/common/searhDemandInput/component.tsx
+++ /dev/null
@@ -1,103 +0,0 @@
-import { useDmStore } from '@/app/store';
-import type { DemandCompType } from '@common/business_components/ui/sdmInsertForm/form';
-import React, { useCallback, useEffect, useRef, useState } from 'react';
-
-type thisProps = {
-  label: string | undefined;
-  initValue: string | undefined;
-  setValue : (dmdCoNm?: string) => void;
-  setRtnData : (rtnData: DemandCompType[]) => void;
-}
-
-export default function SearchInputText({label=undefined, initValue=undefined, setValue=()=>{}, setRtnData=()=>{}} :thisProps) {
-  
-  const { getDemandCompList, Sdm } = useDmStore((state) => state);
-
-  const { 
-    demandCompList 
-  } = Sdm;
-  
-  const [isOpen, setIsOpen] = useState(false);
-  const [textValue, setTextValue] = useState(initValue || '');
-  const wrapperRef = useRef<HTMLDivElement>(null);
-  const handleInputChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
-    const value = e.target.value;
-    setTextValue(value);
-    setValue(value);
-    if (value) {
-      setIsOpen(true);
-      getDemandCompList(value, 20);
-    } else {
-      setIsOpen(false);
-    }
-  }, [getDemandCompList, setValue]);
-
-  const handleSuggestionClick = useCallback((dmdCoNm: string) => {
-    setTextValue(dmdCoNm);
-    setValue(dmdCoNm);
-    setIsOpen(false);
-    setRtnData(demandCompList);
-  }, [demandCompList, setRtnData, setValue]);
-
-  useEffect(() => {
-    const handleClickOutside = (event: MouseEvent) => {
-      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {
-        setIsOpen(false);
-      }
-    };
-
-    document.addEventListener('mousedown', handleClickOutside);
-    return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
-    };
-  }, []);
-
-  return (
-    <div ref={wrapperRef}>
-      <input
-        type="text"
-        value={textValue}
-        onChange={handleInputChange}
-        /* onFocus={() => setIsOpen(true)} */
-        className="w-full h-[3.2rem] !text-xl pl-3 text-gray-600 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-        placeholder={`${label}을(를) 입력하세요`}
-      />
-      {isOpen && (
-        <div className=" z-1 w-full mt-2 bg-white border border-gray-300 rounded-md shadow-lg h-90 overflow-auto">
-          <div className="max-h-72">
-            {demandCompList && demandCompList.length > 0 ? demandCompList.map((item : DemandCompType, index : number) => (
-              <div
-                key={index}
-                className="!text-xl w-full text-left px-5 py-3 hover:bg-gray-100 cursor-pointer overflow-auto"
-                onClick={() => handleSuggestionClick(item.dmdCoNm)}
-                role="button"
-                tabIndex={0}
-                onKeyDown={(e) => {
-                  if (e.key === 'Enter' || e.key === ' ') {
-                    handleSuggestionClick(item.dmdCoNm);
-                  }
-                }}
-              >
-                {item.dmdInfoId.substring(10,14) !== '0000' ? (
-                  <>
-                    <span className="text-gray-500">사업자번호 : </span> {item.dmdInfoId.substring(0,10)}&nbsp;
-                    <span className="text-gray-500">종사업자번호 : </span> {item.dmdInfoId.substring(10,14)}&nbsp;
-                  </>
-                ) : (
-                  <>
-                    <span className="text-gray-500">사업자번호 : </span> {item.dmdInfoId.substring(0,10)}&nbsp;
-                  </>
-                )}
-                <span className="float-right">{item.dmdCoNm}</span>
-              </div>
-            )) : (
-              <div className="!text-xl w-full px-5 py-3 hover:bg-gray-100 cursor-pointer overflow-auto">
-                검색 결과가 없습니다.
-              </div>
-            )}
-          </div>
-        </div>
-      )}
-    </div>
-  )
-}
\ No newline at end of file
diff --git a/apps/dm_new/components/ui/common/utils/utils.ts b/apps/dm_new/components/ui/common/utils/utils.ts
deleted file mode 100644
index 19c92bff2..000000000
--- a/apps/dm_new/components/ui/common/utils/utils.ts
+++ /dev/null
@@ -1,54 +0,0 @@
-export const sanitizeInput = (val: string, allowDecimal = false) => {
-  if (val === "") return ""; // 빈 값 허용
-
-  // 소숫점 허용
-  if (allowDecimal) {
-    // 숫자와 점만 허용
-    let cleaned = val.replace(/[^0-9.]/g, "");
-    // 소숫점 여러 개일 경우 첫 번째만 유지
-    const parts = cleaned.split(".");
-    if (parts.length > 2) {
-      cleaned = parts[0] + "." + parts.slice(1).join("");
-    }
-    return cleaned;
-  }
-
-  // 정수만 허용
-  return val.replace(/[^0-9]/g, "");
-};
-
-
-
-// utils: format Date <-> "YYYY-MM-DD" without moment
-export const  formatDateToYMD=(value: Date): string => {
-  if (!value) return "";
-  // value can be Date | string ("YYYY-MM-DD")
-  if (typeof value === "string") {
-    // assume already in yyyy-mm-dd
-    if (/^\d{4}-\d{2}-\d{2}$/.test(value)) return value;
-    const d = new Date(value);
-    if (isNaN(d.getTime())) return "";
-    return toYMD(d);
-  }
-  if (value instanceof Date) {
-    if (isNaN(value.getTime())) return "";
-    return toYMD(value);
-  }
-  return "";
-}
-
-const  toYMD=(date: Date): string => {
-  // avoid timezone shift by normalizing to local date parts
-  const y = date.getFullYear();
-  const m = String(date.getMonth() + 1).padStart(2, "0");
-  const day = String(date.getDate()).padStart(2, "0");
-  return `${y}-${m}-${day}`;
-}
-
-// const  parseYMDToDate=(ymd: string): Date | null => {
-//   if (!/^\d{4}-\d{2}-\d{2}$/.test(ymd)) return null;
-//   const [y, m, d] = ymd.split("-").map(Number);
-//   const date = new Date(y, (m - 1), d);
-//   // validate round-trip
-//   return (date.getFullYear() === y && date.getMonth() === m - 1 && date.getDate() === d) ? date : null;
-// }
\ No newline at end of file
diff --git a/apps/dm_new/components/ui/config/index.ts b/apps/dm_new/components/ui/config/index.ts
deleted file mode 100644
index 1585bb767..000000000
--- a/apps/dm_new/components/ui/config/index.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { PROXY_HOST } from "@/src/shared/config/env";
-
-export const LOCAL_URL = PROXY_HOST;
-export const DEV_URL_FO = "/operation-service";
-export const DEV_URL_WR = "/reuse-service";
-export const DEV_URL_SN = "/sewerage-service";
diff --git a/apps/dm_new/components/ui/map/SearchInputText/SearchInputText.tsx b/apps/dm_new/components/ui/map/SearchInputText/SearchInputText.tsx
deleted file mode 100644
index 05f41d09b..000000000
--- a/apps/dm_new/components/ui/map/SearchInputText/SearchInputText.tsx
+++ /dev/null
@@ -1,139 +0,0 @@
-import React, { useCallback, useEffect, useRef, useState } from "react";
-
-type SearchType = {
-  bscFctNm: string;
-  bscFctCd: string;
-};
-
-type thisProps = {
-  label: string | undefined;
-  initValue: string | undefined;
-  setValue: (searchNm?: string) => void;
-  setRtnData: (rtnData: any) => void;
-  searchList?: SearchType[];
-};
-
-export default function SearchInputText({
-  label = undefined,
-  initValue = undefined,
-  setValue = () => {},
-  setRtnData = () => {},
-  searchList = [],
-}: thisProps) {
-  const [isOpen, setIsOpen] = useState(false);
-  const [textValue, setTextValue] = useState(initValue || "");
-  const [highlightIndex, setHighlightIndex] = useState<number>(-1);
-
-  const wrapperRef = useRef<HTMLDivElement>(null);
-
-  const handleInputChange = useCallback(
-    (e: React.ChangeEvent<HTMLInputElement>) => {
-      const value = e.target.value;
-      setTextValue(value);
-      setValue(value);
-      setHighlightIndex(-1);
-      setIsOpen(value !== "");
-    },
-    [setValue]
-  );
-
-  const handleSuggestionClick = useCallback(
-    (searchNm: string) => {
-      setValue(searchNm);
-      setTextValue(searchNm);
-      setIsOpen(false);
-      setRtnData(searchList?.find((item) => item.bscFctNm === searchNm) || {});
-    },
-    [searchList, setRtnData, setValue]
-  );
-
-  const handleKeyDown = useCallback(
-    (e: React.KeyboardEvent<HTMLInputElement>) => {
-      if (!isOpen || searchList.length === 0) return;
-
-      if (e.key === "ArrowDown") {
-        e.preventDefault();
-        setHighlightIndex((prev) => (prev + 1) % searchList.length);
-      } else if (e.key === "ArrowUp") {
-        e.preventDefault();
-        setHighlightIndex((prev) =>
-          prev <= 0 ? searchList.length - 1 : prev - 1
-        );
-      } else if (e.key === "Enter") {
-        e.preventDefault();
-        if (searchList.length === 1 && searchList[0]) {
-          handleSuggestionClick(searchList[0].bscFctNm);
-        } else if (highlightIndex >= 0 && highlightIndex < searchList.length && searchList[highlightIndex]) {
-          handleSuggestionClick(searchList[highlightIndex].bscFctNm);
-        }
-      }
-    },
-    [highlightIndex, isOpen, searchList, handleSuggestionClick]
-  );
-
-  useEffect(() => {
-    const handleClickOutside = (event: MouseEvent) => {
-      if (
-        wrapperRef.current &&
-        !wrapperRef.current.contains(event.target as Node)
-      ) {
-        setIsOpen(false);
-      }
-    };
-
-    document.addEventListener("mousedown", handleClickOutside);
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
-  }, []);
-
-  return (
-    <div ref={wrapperRef} className="relative">
-      <input
-        type="text"
-        value={textValue || ""}
-        onChange={handleInputChange}
-        onKeyDown={handleKeyDown}
-        className="w-full h-[3.2rem] !text-xl pl-3 text-gray-600 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
-        placeholder={`${label}을(를) 입력하세요`}
-        onClick={() => {
-          setTextValue("");
-          setValue("");
-          setIsOpen(false);
-        }}
-      />
-      {isOpen && (
-        <div className="absolute top-full left-0 z-50 mb-2 max-h-72 w-full overflow-auto rounded-md border border-gray-300 bg-white shadow-lg">
-          <div className="max-h-72">
-            {searchList.length > 0 ? (
-              searchList.map((item, index) => (
-                <div
-                  key={index}
-                  className={`w-full cursor-pointer overflow-auto px-5 py-3 text-left !text-xl ${
-                    highlightIndex === index
-                      ? "bg-blue-100"
-                      : "hover:bg-gray-100"
-                  }`}
-                  onClick={() => handleSuggestionClick(item.bscFctNm)}
-                  role="button"
-                  tabIndex={0}
-                  onKeyDown={(e) => {
-                    if (e.key === "Enter" || e.key === " ") {
-                      handleSuggestionClick(item.bscFctNm);
-                    }
-                  }}
-                >
-                  <span className="float-left">{item.bscFctNm}</span>
-                </div>
-              ))
-            ) : (
-              <div className="!text-xl w-full px-5 py-3 hover:bg-gray-100 cursor-pointer overflow-auto">
-                검색 결과가 없습니다.
-              </div>
-            )}
-          </div>
-        </div>
-      )}
-    </div>
-  );
-}
diff --git a/apps/dm_new/components/ui/map/searchBar/searchBar.tsx b/apps/dm_new/components/ui/map/searchBar/searchBar.tsx
deleted file mode 100644
index 7ca64bbce..000000000
--- a/apps/dm_new/components/ui/map/searchBar/searchBar.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-"use client";
-import { useDmStore } from "@/app/store";
-import {
-  SelectBox,
-  type SelectDataType,
-} from "@common/business_components/ui";
-import { Button, Label } from "@common/components/ui";
-import { useCallback, useEffect, useState } from "react";
-import SearchInputText from "../SearchInputText/SearchInputText";
-
-export function SearchBar({
-  setHasuPk,
-  onApply,
-}: {
-  setHasuPk: (hasuPk: any) => void;
-  onApply: () => void;
-}) {
-  const { map, Common, initializeCommonData, findRuseFclt } = useDmStore(
-    (state) => state
-  );
-  const [sidoValue, setSidoValue] = useState<string>("");
-  const [sigunValue, setSigunValue] = useState<string>("");
-  const [filteredSigunData, setFilteredSigunData] = useState<SelectDataType[]>([
-    { text: "전체", val: "0" },
-  ]);
-
-  useEffect(() => {
-    initializeCommonData();
-  }, [initializeCommonData]);
-
-  const initializeSigunData = useCallback(
-    (sidoCd: string) => {
-      if (sidoCd === "0") {
-        setSigunValue("0");
-        setFilteredSigunData([{ text: "전체", val: "0" }]);
-      } else {
-        const newFilteredData = [
-          { text: "전체", val: "0" },
-          ...Common.selectSigunData.filter(
-            (item: SelectDataType) => item.val.substring(0, 2) === sidoCd
-          ),
-        ];
-        setSigunValue("0");
-        setFilteredSigunData(newFilteredData);
-      }
-    },
-    [Common.selectSigunData]
-  );
-
-  const onSelectValue = useCallback(
-    (val: string, type: string) => {
-      switch (type) {
-        case "ctpvCd":
-          initializeSigunData(val);
-          setSidoValue(val);
-          break;
-        case "sggCd":
-          setSigunValue(val);
-      }
-    },
-    [initializeSigunData]
-  );
-
-  return (
-    <div className="flex justify-center w-full px-4 py-3">
-      <div className="flex items-center w-full max-w-screen-lg rounded-xl bg-white shadow-md px-6 py-4 space-x-3">
-        <SelectBox
-          labelClass="w-[40px]"
-          className="w-[200px]"
-          label="시도"
-          selectClass="rounded-lg bg-white"
-          selectArray={Common.selectSidoData || []}
-          onSelectValue={(val) => onSelectValue(val.toString(), "ctpvCd")}
-          value={sidoValue || Common.selectSidoData[0]?.val || ""}
-        />
-        <SelectBox
-          labelClass="w-[65px]"
-          className="w-[200px]"
-          label="시군구"
-          selectClass="rounded-lg bg-white"
-          selectArray={filteredSigunData || []}
-          onSelectValue={(val) => onSelectValue(val.toString(), "sggCd")}
-          value={sigunValue}
-        />
-        <Label className="text-gray-600">하수재이용시설</Label>
-        <SearchInputText
-          label="시설명"
-          initValue={undefined}
-          setValue={(searchNm?: string) => {
-            let sggOrCity = "";
-            if (searchNm) {
-              if (sigunValue === "0" || sigunValue === "") {
-                sggOrCity = sidoValue;
-              } else {
-                sggOrCity = sigunValue;
-              }
-              findRuseFclt(sggOrCity, searchNm);
-            }
-          }}
-          setRtnData={(rtnData: any) => {
-            setHasuPk(rtnData);
-          }}
-          searchList={map.ruseFcltList || []}
-        />
-        <Button
-          color="sky"
-          className="ml-2 text-white"
-          size="sm"
-          onClick={() => {
-            onApply();
-          }}
-        >
-          적용
-        </Button>
-      </div>
-    </div>
-  );
-}
diff --git a/apps/dm_new/components/ui/sdmInfoInsertForm/AccessibleFormField.tsx b/apps/dm_new/components/ui/sdmInfoInsertForm/AccessibleFormField.tsx
deleted file mode 100644
index c37270df8..000000000
--- a/apps/dm_new/components/ui/sdmInfoInsertForm/AccessibleFormField.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import { FormUi } from "@common/business_components/ui";
-import type { ControllerRenderProps, FieldError, FieldValues, Path } from "react-hook-form";
-import { cloneElement, isValidElement } from "react";
-interface AccessibleFormFieldProps<T extends FieldValues> {
-  field: ControllerRenderProps<T, Path<T>>;
-  label: string;
-  required?: boolean;
-  error?: FieldError;
-  isDisabled?: boolean;
-  inputComponent: React.ReactElement<{ disabled?: boolean }>;
-}
-
-export function AccessibleFormField<T extends FieldValues>({
-  label,
-  required = false,
-  inputComponent,
-  isDisabled = false,
-}: AccessibleFormFieldProps<T>) {
-  const labelText = required ? `${label} *` : label;
-  
-  return (
-    <FormUi label={labelText} isDisabled={isDisabled}>
-      <div>
-      {isValidElement(inputComponent)
-          ? cloneElement(inputComponent, { disabled: isDisabled } as Partial<typeof inputComponent.props>)
-          : inputComponent}
-        {/* {error?.message && Array.from(new Set(error.message.split('\n'))).map((msg, idx) => (
-            <p key={idx} className="text-red-500 text-sm mt-1" role="alert">
-                {msg}
-            </p>
-        ))} */}
-      </div>
-    </FormUi>
-  );
-}
diff --git a/apps/dm_new/components/ui/sdmInfoInsertForm/component.tsx b/apps/dm_new/components/ui/sdmInfoInsertForm/component.tsx
deleted file mode 100644
index 44c6d3f82..000000000
--- a/apps/dm_new/components/ui/sdmInfoInsertForm/component.tsx
+++ /dev/null
@@ -1,962 +0,0 @@
-// import ModalSimilarPage from "@/app/(base-layout)/pages/sdmMng/sdmInfoInsert/modalSimilar/page";
-// import { useDmStore } from "@/app/store";
-// import {
-//   CANDIDATE,
-//  // DatePicker,
-//   FormField,
-//   FormLabel,
-//   FormUi,
-//   SelectBox,
-//   UiModal,
-// } from "@common/business_components";
-// import { Input } from "@common/components";
-// import { Button, Label } from "@common/components/ui";
-// import { useSearchParams } from "next/navigation";
-// import { useCallback, useEffect, useState } from "react";
-// import { AccessibleFormField } from "./AccessibleFormField";
-// import {
-//   type ControllerRenderProps,
-//   type UseFormReturn,
-//   type FieldError,
-//   useWatch,
-// } from "react-hook-form";
-// import SearchInputText from "../common/searhDemandInput/component";
-// import React from "react";
-// import { formatDateToYMD, sanitizeInput } from "../common/utils/utils";
-// import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
-// import type { SdmInfoFormData } from "@/app/store/sdmMng";
-
-// export interface SdmInfoRegFormProps {
-//   form: UseFormReturn<SdmInfoFormData>;
-//   onCheckboxChange?: (checked: boolean) => void;
-//   facilityName?: string;
-// }
-
-// type FieldComponent = (
-//   field: ControllerRenderProps<SdmInfoFormData, keyof SdmInfoFormData>
-// ) => React.ReactElement<{ disabled?: boolean }>;
-
-// export function SdmInfoRegForm({
-//   form,
-//   onCheckboxChange,
-//   facilityName,
-// }: SdmInfoRegFormProps) {
-//   const { initializeCommonData, Sdm } = useDmStore((state) => state);
-//   const { useTypesData, defaultRules, disableRules } = Sdm;
-//   const searchParams = useSearchParams();
-
-//   const [sdmNmValue, setSdmNmValue] = useState<string>(
-//     searchParams.get("dmdCoNm") || ""
-//   );
-
-//   const [frontPHdata, setFrontPHdata] = useState("0");
-//   const [backPHdata, setBackPHdata] = useState("0");
-//   const [isBznmTotNoDisabled, setIsBznmTotNoDisabled] = useState(false);
-//   const [isSimilarCase, setIsSimilarCase] = useState(false);
-//   const [key, setKey] = useState(0);
-//   // 후보지 팝업 오픈 상태
-
-//   //모달 조회에 필요한 데이터
-//   const [sply, setSply] = useState<number>(0);
-//   const [usageCd, setUsageCd] = useState<string>("청소");
-//   const [money, setMoney] = useState<number>(0);
-
-//   useEffect(() => {
-//     initializeCommonData();
-//   }, [initializeCommonData]);
-
-//   useEffect(() => {
-//     console.log("candidateTitle ", form.getValues("candidateTitle"));
-//   }, [form.getValues]);
-
-//   useEffect(() => {
-//     if (useTypesData && useTypesData.length > 0) {
-//       setTimeout(() => {
-//         form.setValue("usePurpose", useTypesData[0]?.val?.toString() || "");
-//       }, 500);
-//     }
-//   }, [useTypesData, form.setValue, form]);
-
-//   useEffect(() => {
-//     if (facilityName) {
-//       setSdmNmValue(facilityName);
-//       form.setValue("sdmNm", facilityName);
-//       setKey((prev) => prev + 1);
-//     }
-//   }, [facilityName, form.setValue, form]);
-
-//   useEffect(() => {
-//     if (searchParams.get("dmdCoNm")) {
-//       form.setValue("sdmNm", searchParams.get("dmdCoNm") || "");
-//       setSdmNmValue(searchParams.get("dmdCoNm") || "");
-//       setKey((prev) => prev + 1);
-//     }
-//   }, [searchParams, form.setValue, form]);
-
-//   const searchCandidate = (e: React.MouseEvent) => {
-//     e.preventDefault();
-//     e.stopPropagation();
-//     const dmdInfoId = JSON.parse(
-//       sessionStorage.getItem("user") || "{}"
-//     )?.dmdInfoId?.toString();
-
-//     const url = `/map/popup?dmdInfoId=${encodeURIComponent(dmdInfoId)}`;
-//     const width = window.screen.availWidth;
-//     const height = window.screen.availHeight;
-//     const left = 0;
-//     const top = 0;
-//     const popupOptions = `width=${width},height=${height},left=${left},top=${top},resizable=yes,scrollbars=yes`;
-//     window.open(url, "candidatePopup", popupOptions);
-//   };
-
-//   const searchSimilarCase = (e: React.MouseEvent) => {
-//     e.preventDefault();
-//     e.stopPropagation();
-//     setIsSimilarCase(true);
-//   };
-
-//   const handleCheckboxChange = (checked: boolean) => {
-//     setIsBznmTotNoDisabled(checked);
-//     onCheckboxChange?.(checked);
-//   };
-
-//   useEffect(() => {
-//     const watchPH = form.getValues(`ph`);
-//     if (watchPH && watchPH !== undefined) {
-//       const [frontPH, backPH] = watchPH.split("~");
-//       if (frontPH) {
-//         setFrontPHdata(frontPH);
-//       }
-//       if (backPH) {
-//         setBackPHdata(backPH);
-//       }
-//     } else {
-//       setFrontPHdata("0");
-//       setBackPHdata("0");
-//     }
-//   }, [form.getValues(`ph`)]);
-
-//   const isSetPh = useCallback(
-//     (typePHdata: string, index: number) => {
-//       const PHdata = form.getValues("ph");
-//       const isPH = PHdata?.split("~")[index] || "";
-//       if (index == 0) {
-//         form.setValue("ph", `${isPH}~${typePHdata}`);
-//         setBackPHdata(typePHdata);
-//       } else if (index == 1) {
-//         form.setValue("ph", `${typePHdata}~${isPH}`);
-//         setFrontPHdata(typePHdata);
-//       }
-//     },
-//     [form]
-//   );
-
-//   const usePurpose = useWatch({ control: form.control, name: "usePurpose" });
-
-//   useEffect(() => {
-//     if (!usePurpose) return;
-
-//     // Apply default values
-//     const defaults = defaultRules[usePurpose];
-
-//     if (defaults) {
-//       Object.entries(defaults).forEach(([field, value]) => {
-//         form.setValue(field as keyof SdmInfoFormData, value, {
-//           shouldDirty: true,
-//         });
-//       });
-//     }
-//   }, [form.getValues("usePurpose")]);
-
-//   // 시설 선택시 이벤트
-//   const selectComp = useCallback(
-//     (rtnData: DemandCompType[]) => {
-//       const rtnCompData = rtnData?.[0];
-//       form.setValue("sdmNm", rtnCompData?.dmdCoNm || "");
-//     },
-//     [form]
-//   );
-
-//   const formFields: Array<{
-//     name: keyof SdmInfoFormData;
-//     label: string;
-//     component: FieldComponent | undefined;
-//     formIndex: number;
-//     required?: boolean;
-//   }> = [
-//     {
-//       name: "sdmNm",
-//       label: "수요처선택",
-//       formIndex: 0,
-//       required: true,
-//       component: (field) => (
-//         <div key={key}>
-//           <SearchInputText
-//             label="수요처명"
-//             setValue={(val) => {
-//               setSdmNmValue(val || "");
-//               field.onChange(val || "");
-//             }}
-//             setRtnData={selectComp}
-//             initValue={facilityName || sdmNmValue}
-//             {...field}
-//           />
-//         </div>
-//       ),
-//     },
-//     {
-//       name: "demandYmd",
-//       label: "요구시기",
-//       formIndex: 0,
-//       required: true,
-//       component: (field) => (
-//         <div className="relative w-64">
-//           {/* <DatePicker
-//             mode="single"
-//             selected={field.value as Date}
-//             onSelect={(date) => {
-//               field.onChange(date as Date);
-//             }}
-//             className=""
-//             //defaultMonth={field.value as Date}
-//             field={{
-//               value: field.value as Date,
-//               onChange: (date: Date | undefined) => {
-//                 field.onChange(date as Date);
-//               },
-//             }}
-//             showOutsideDays={true}
-//             selectClass={undefined}
-//           /> */}
-//             {/* 네이티브 input */}
-//             <Input
-//               className="w-full !text-xl text-right"
-//               type="date"
-//               onChange= {(e) => {
-//                 const selectedDate = e.target.value ? new Date(e.target.value) : null;
-//                 field.onChange(selectedDate);
-//               }}
-//               value={ formatDateToYMD(field.value as Date) }
-//             />
-//         </div>
-//       ),
-//     },
-//     {
-//       name: "demandQnty",
-//       label: "요구수량(㎥/d)",
-//       formIndex: 0,
-//       required: true,
-//       component: (field) => (
-//         <Input
-//           type="text"
-//           className="!text-xl text-gray-600"
-//           value={field.value as string}
-//           onChange={(e) => {
-//             field.onChange(e);
-//             setSply(Number(e.target.value));
-//           }}
-//           onBlur={field.onBlur}
-//           name={field.name}
-//           ref={field.ref}
-//         />
-//       ),
-//     },
-//     {
-//       name: "usePurpose",
-//       label: "사용용도",
-//       formIndex: 0,
-//       required: true,
-//       component: (field) => (
-//         <SelectBox
-//           selectClass={undefined}
-//           label=""
-//           selectArray={useTypesData}
-//           onSelectValue={(val) => {
-//             field.onChange(val.toString());
-//             setUsageCd(val.toString());
-//           }}
-//           className=""
-//           value={field.value as string}
-//         />
-//       ),
-//     },
-//     {
-//       name: "money",
-//       label: "희망단가(원)",
-//       formIndex: 0,
-//       required: true,
-//       component: (field) => (
-//         <FormUi
-//           onCheckboxChange={handleCheckboxChange}
-//           isDisabled={isBznmTotNoDisabled}
-//         >
-//           <Input
-//             type="text"
-//             className="!text-xl text-gray-600"
-//             value={field.value as string}
-//             onChange={(e) => {
-//               field.onChange(e);
-//               setMoney(Number(e.target.value));
-//             }}
-//             onBlur={field.onBlur}
-//             name={field.name}
-//             ref={field.ref}
-//           />
-//         </FormUi>
-//       ),
-//     },
-//     {
-//       name: "reqWaterQlty",
-//       label: "요구수질",
-//       formIndex: 0,
-//       required: true,
-//       component: undefined,
-//     },
-
-//     {
-//       name: "candidateTitle",
-//       label: CANDIDATE || "공급처 후보지 선택(필수아님)",
-//       formIndex: 2,
-//       component: () => (
-//         <div>
-//           <div className="-mt-14 float-right flex gap-10">
-//             <Button
-//               className="rounded-md"
-//               color="sky"
-//               size={"sm"}
-//               onClick={searchCandidate}
-//             >
-//               후보지 조회
-//             </Button>
-//             <Button
-//               className="rounded-md"
-//               color="sky"
-//               size={"sm"}
-//               onClick={searchSimilarCase}
-//             >
-//               유사사례
-//             </Button>
-//           </div>
-//           <div className="flex justify-center gap-10 mt-5">
-//             {(form.getValues("candidateTitle") || []).map(
-//               (candidate: any, index: number) => (
-//                 <Input
-//                   key={index}
-//                   placeholder={`후보지${index + 1}`}
-//                   type="text"
-//                   className="!text-xl w-[130px] text-gray-600"
-//                   value={candidate.ruseUtztnFcltNm}
-//                   readOnly
-//                 />
-//               )
-//             )}
-//           </div>
-//         </div>
-//       ),
-//     },
-//   ];
-
-//   const normalFields = formFields.filter(
-//     (f) => f.formIndex === 0 && f.component
-//   );
-
-//   const candidateFields = formFields.filter(
-//     (f) => f.formIndex === 2 && f.component
-//   );
-
-//   return (
-//     <>
-//       {normalFields.map(({ name, label, component, required }) =>
-//         component ? (
-//           <FormField
-//             key={name}
-//             control={form.control}
-//             name={name}
-//             render={({ field }) =>
-//               name === "money" ? (
-//                 <div>
-//                   <Label className="text-black">희망단가(원)*</Label>
-//                   {component(field)}
-//                 </div>
-//               ) : (
-//                 // <FormUi label={label + "*"}>{component(field)}</FormUi>
-//                 <AccessibleFormField
-//                   field={field}
-//                   label={label}
-//                   required={required}
-//                   error={
-//                     typeof form.formState.errors[name]?.message === "string"
-//                       ? (form.formState.errors[name] as FieldError)
-//                       : undefined
-//                   }
-//                   inputComponent={component(field)}
-//                 />
-//               )
-//             }
-//           />
-//         ) : null
-//       )}
-
-//       <div className="mt-10">
-//         <FormLabel className="text-xl">요구수질</FormLabel>
-//         <div className="grid grid-cols-2 gap-x-10 gap-y-6 mt-3 mb-3">
-//           <FormField
-//             control={form.control}
-//             name={`grssClfg`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={
-//                     !isDisabled ? `총대장균군수(개/mg)*` : "총대장균군수(개/mg)"
-//                   }
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : "불검출"
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       {/* TODO:  총대장균군수 확인 필요*/}
-//                       {field.value !== null ? (
-//                         <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                           이하
-//                         </span>
-//                       ) : (
-//                         <></>
-//                       )}
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`tn`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={
-//                     !isDisabled ? `총질소(T-N)(mg/L)*` : "총질소(T-N)(mg/L)"
-//                   }
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`combResdch`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={
-//                     !isDisabled ? `결합잔류염소(mg/L)*` : "결합잔류염소(mg/L)"
-//                   }
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const cleanValue = sanitizeInput(
-//                             e.target.value,
-//                             true
-//                           );
-//                           field.onChange(
-//                             cleanValue === "" ? null : Number(cleanValue)
-//                           );
-//                         }}
-//                         value={field.value ?? ""}
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이상
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`tph`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={!isDisabled ? `총인(T-P)(mg/L)*` : "총인(T-P)(mg/L)"}
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const cleanValue = sanitizeInput(
-//                             e.target.value,
-//                             true
-//                           );
-//                           field.onChange(
-//                             cleanValue === "" ? null : Number(cleanValue)
-//                           );
-//                         }}
-//                         value={field.value ?? ""}
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`trbt`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi label={!isDisabled ? `탁도(NTU)*` : "탁도(NTU)"}>
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <div className="col-span-1">
-//             <Label className="text-xl">수소이온농도(pH)</Label>
-//             <div className="flex flex-row items-center gap-2">
-//               <Input
-//                 className="!text-xl w-36"
-//                 placeholder=""
-//                 type="text"
-//                 onChange={(e) => {
-//                   const cleanValue = sanitizeInput(e.target.value, true);
-//                   isSetPh(cleanValue, 1);
-//                 }}
-//                 value={frontPHdata ?? ""}
-//                 maxLength={5}
-//               />
-//               <span className="text-xl mx-2">~</span>
-//               <Input
-//                 className="!text-xl w-36 "
-//                 placeholder=""
-//                 type="text"
-//                 onChange={(e) => {
-//                   const cleanValue = sanitizeInput(e.target.value, true);
-//                   isSetPh(cleanValue, 0);
-//                 }}
-//                 value={backPHdata ?? ""}
-//                 maxLength={5}
-//               />
-//             </div>
-//           </div>
-//           <FormField
-//             control={form.control}
-//             name={`bod`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={
-//                     !isDisabled
-//                       ? `생물학적 산소요구량(BOD)(mg/L)*`
-//                       : "생물학적 산소요구량(BOD)(mg/L)"
-//                   }
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`clIonQnt`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={!isDisabled ? `염화물(mgCL/L)*` : "염화물(mgCL/L)"}
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`smll`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi label={!isDisabled ? `냄새*` : "냄새"}>
-//                   <SelectBox
-//                     className="!text-2xl rounded-md"
-//                     label={""}
-//                     selectClass={undefined}
-//                     selectArray={[
-//                       { text: "불쾌하지않을것", val: "불쾌하지않을것" },
-//                       { text: "해당사항없음", val: "해당사항없음" },
-//                     ]}
-//                     onSelectValue={(val: string | number) => {
-//                       field.onChange(val.toString());
-//                     }}
-//                     value={field.value}
-//                     readOnly={isDisabled}
-//                     onBlur={field.onBlur}
-//                     ref={field.ref}
-//                   />
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`cdtnv`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi
-//                   label={
-//                     !isDisabled ? `전기전도도(㎲/cm)*` : "전기전도도(㎲/cm)"
-//                   }
-//                 >
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`crmty`}
-//             render={({ field }) => {
-//               const disabledFields = usePurpose ? disableRules[usePurpose] : [];
-//               const isDisabled = disabledFields
-//                 ? disabledFields.includes(field.name)
-//                 : true;
-//               return (
-//                 <FormUi label={!isDisabled ? `색도(도)*` : "색도(도)"}>
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2 text-right rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           const inputValue = e.target.value.replace(
-//                             /[^0-9]/g,
-//                             ""
-//                           ); // 정수만
-//                           field.onChange(
-//                             inputValue === "" ? null : Number(inputValue)
-//                           );
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== null
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         maxLength={6}
-//                         disabled={isDisabled}
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                       <span className="text-xl absolute inset-y-0 right-3 flex items-center text-gray-500 pointer-events-none">
-//                         이하
-//                       </span>
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//           <FormField
-//             control={form.control}
-//             name={`rmrk`}
-//             render={({ field }) => {
-//               return (
-//                 <FormUi label={"비고"}>
-//                   <div className="flex items-center gap-2">
-//                     <div className="relative flex-1 min-w-0">
-//                       <Input
-//                         type="text"
-//                         className="w-full pr-16 border py-2  rounded-md"
-//                         placeholder=""
-//                         onChange={(e) => {
-//                           field.onChange(e.target.value);
-//                         }}
-//                         value={
-//                           field.value !== undefined && field.value !== ""
-//                             ? `${field.value}`
-//                             : ""
-//                         }
-//                         onBlur={field.onBlur}
-//                         name={field.name}
-//                         ref={field.ref}
-//                       />
-//                     </div>
-//                   </div>
-//                 </FormUi>
-//               );
-//             }}
-//           />
-//         </div>
-//       </div>
-
-//       {candidateFields.map(({ name, label, component, required }, index) =>
-//         component ? (
-//           <FormField
-//             key={name + index}
-//             control={form.control}
-//             name={name}
-//             render={({ field }) => (
-//               // <FormUi label={label}>
-//               //   {component(field)}
-//               // </FormUi>
-//               <AccessibleFormField
-//                 field={field}
-//                 label={label}
-//                 required={required}
-//                 error={
-//                   typeof form.formState.errors[name]?.message === "string"
-//                     ? (form.formState.errors[name] as FieldError)
-//                     : undefined
-//                 }
-//                 inputComponent={component?.(field)}
-//               />
-//             )}
-//           />
-//         ) : null
-//       )}
-
-//       {isSimilarCase && (
-//         <UiModal
-//           body={
-//             <ModalSimilarPage sply={sply} usageCd={usageCd} money={money} />
-//           }
-//           bodyClass="sm:max-w-[100vw] w-[1400px] h-[100dvh] max-h-[900px] overflow-y-auto overflow-x-hidden"
-//           open={isSimilarCase}
-//           onOpenChange={(open) => !open && setIsSimilarCase(false)}
-//           noHeaderYn="Y"
-//           noFooterYn="Y"
-//         />
-//       )}
-//     </>
-//   );
-// }
diff --git a/apps/dm_new/components/ui/sdmLoginForm/component.tsx b/apps/dm_new/components/ui/sdmLoginForm/component.tsx
deleted file mode 100644
index 7ec417c71..000000000
--- a/apps/dm_new/components/ui/sdmLoginForm/component.tsx
+++ /dev/null
@@ -1,197 +0,0 @@
-import { useDmStore } from "@/app/store";
-import { BZNM_TOT_NO, FormField, FormUi } from "@common/business_components";
-import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
-import { Button, Input } from "@common/components";
-import { zodResolver } from "@hookform/resolvers/zod";
-import { sha512 } from 'js-sha512';
-import React, { useEffect, useMemo, useState } from "react";
-import { FormProvider, useForm, type ControllerRenderProps } from "react-hook-form";
-import toast from "react-hot-toast";
-import * as z from "zod";
-
-export function SdmLoginForm() {
-  const { actionLogin, initializeCommonData } = useDmStore((state) => state);
-  const [isBznmTotNoDisabled, setIsBznmTotNoDisabled] = useState(true);
-
-  const formatBusinessNumber = (value: string) => {
-    // 숫자만 추출
-    const digitsOnly = value.replace(/\D/g, "");
-
-    // 10자리까지만 처리
-    const limitedDigits = digitsOnly.slice(0, 10);
-
-    // 3-2-5 형식으로 포맷팅
-    if (limitedDigits.length <= 3) {
-      return limitedDigits;
-    } else if (limitedDigits.length <= 5) {
-      return `${limitedDigits.slice(0, 3)}-${limitedDigits.slice(3)}`;
-    } else {
-      return `${limitedDigits.slice(0, 3)}-${limitedDigits.slice(3, 5)}-${limitedDigits.slice(5)}`;
-    }
-  };
-
-  // 스키마를 useMemo로 최적화
-  const sdmLoginFormSchema = useMemo(() => z.object({
-    dmdInfoId: z.string()
-      .min(1, "사업자등록번호를 입력해주세요")
-      .regex(/^\d{10}$/, "사업자등록번호는 10자리 숫자만 입력 가능합니다"),
-    bznmTotNo: isBznmTotNoDisabled
-      ? z.string().optional()
-      : z.string().length(4, "종사업자등록번호는 4자리 숫자만 입력 가능합니다"),
-    password: z.string()
-      .min(1, "비밀번호를 입력해주세요")
-      .min(8, "비밀번호는 8자 이상 입력해주세요")
-      .max(16, "비밀번호는 16자 이내로 입력해주세요"),
-    rgtr: z.string().optional(),
-    dmdAplyPswd: z.string().optional(),
-  }), [isBznmTotNoDisabled]);
-
-  type SdmLoginForm = z.infer<typeof sdmLoginFormSchema>;
-  type FieldComponent = (field: ControllerRenderProps<SdmLoginForm, keyof SdmLoginForm>) => React.ReactElement;
-
-  const formSchema = sdmLoginFormSchema;
-
-  useEffect(() => {
-    initializeCommonData();
-  }, [initializeCommonData]);
-
-  const defaultValues: SdmLoginForm = {
-    dmdInfoId: '',
-    bznmTotNo: '',
-    password: '',
-    rgtr: '',
-    dmdAplyPswd: '',
-  };
-
-  const form = useForm<SdmLoginForm>({
-    resolver: zodResolver(formSchema),
-    defaultValues,
-    mode: "onChange",
-  });
-
-  const handleCheckboxChange = (checked: boolean) => {
-    setIsBznmTotNoDisabled(checked);
-  };
-
-  const initPassword = () => {
-    toast(
-      (t) => (
-        <div className="flex flex-col items-center">
-          <div className="text-2xl mb-2">
-            관리자(031-0000-0000)에게 비밀번호 초기화 요청을 유선으로 하시기 바랍니다.
-          </div>
-          <Button size={"sm"} onClick={() => toast.dismiss(t.id)}>
-            확인
-          </Button>
-        </div>
-      ),
-      {
-        id: "pwd-reset",
-        duration: Infinity,
-        position: "top-center",
-      }
-    );
-  }
-
-  const handleLogin = () => {
-    const data = form.getValues();
-    const passwordStr = sha512.hex(data.password)
-    data.dmdAplyPswd = passwordStr;
-    const param = {
-      dmdInfoId: data.dmdInfoId + (isBznmTotNoDisabled ? '0000' : data.bznmTotNo),
-      dmdAplyPswd: data.dmdAplyPswd,
-    }
-    actionLogin(param as unknown as DemandCompType);
-  };
-
-  const formFields: Array<{
-    name: keyof SdmLoginForm;
-    label: string;
-    component: FieldComponent | undefined;
-  }> = [
-      {
-        name: "dmdInfoId",
-        label: "사업자등록번호",
-        component: (field) => (
-          <Input
-            placeholder="사업자등록번호를 입력하세요"
-            type="text"
-            className="!mt-5 !mb-5 !text-xl text-gray-600"
-            {...field}
-            value={formatBusinessNumber(field.value as string)}
-            onChange={(e) => {
-              const dmdId = e.target.value.replace(/\D/g, "").slice(0, 10);
-              field.onChange(dmdId);
-            }}
-          />
-        )
-      },
-      {
-        name: "bznmTotNo",
-        label: BZNM_TOT_NO || "종사업자등록번호",
-        component: (field) => (
-          <FormUi
-            label="종사업자등록번호"
-            onCheckboxChange={handleCheckboxChange}
-            isDisabled={isBznmTotNoDisabled}
-          >
-            <Input
-              placeholder="여러사업장이 있을 경우 입력해주세요"
-              type="text"
-              className="!mt-5 !text-xl text-gray-600"
-              disabled={isBznmTotNoDisabled}
-              {...field}
-            />
-          </FormUi>
-        )
-      },
-      {
-        name: "password",
-        label: "비밀번호",
-        component: (field) => (
-          <Input
-            placeholder="비밀번호를 입력하세요"
-            type="password"
-            className="!mt-5 !mb-5 !text-xl text-gray-600"
-            {...field}
-          />
-        )
-      }
-    ];
-
-  return (
-    <>
-      <div>
-        <FormProvider {...form}>
-          {formFields.map(({ name, label, component }) => (
-            <FormField
-              key={name}
-              control={form.control}
-              name={name}
-              render={({ field }) => (
-                label === '종사업자등록번호' ?
-                  <>
-                    {component && component(field)}
-                  </>
-                  : <FormUi label={label}>
-                    {component && component(field)}
-                  </FormUi>
-              )}
-            />
-          ))}
-        </FormProvider>
-        <div className="flex justify-center pt-4">
-          <div className="flex flex-col items-center">
-            <Button
-              onClick={handleLogin}
-              className="w-32 bg-blue-600 hover:bg-blue-700 text-white font-semibold py-2 px-4 rounded-md transition-colors duration-200"
-            >
-              로그인
-            </Button>
-            <div className="text-xl mt-2 text-gray-400 cursor-pointer" onClick={initPassword}>비밀번호 초기화 요청</div>
-          </div>
-        </div>
-      </div>
-    </>
-  );
-}
\ No newline at end of file
diff --git a/apps/dm_new/eslint.config.mjs b/apps/dm_new/eslint.config.mjs
deleted file mode 100644
index 7de132089..000000000
--- a/apps/dm_new/eslint.config.mjs
+++ /dev/null
@@ -1,32 +0,0 @@
-import { dirname } from "path";
-import { fileURLToPath } from "url";
-import { FlatCompat } from "@eslint/eslintrc";
-
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = dirname(__filename);
-const isProd = process.env.NODE_ENV === "production";
-
-const compat = new FlatCompat({
-  baseDirectory: __dirname,
-});
-
-const eslintConfig = [
-  ...compat.extends("next/core-web-vitals", "next/typescript"),
-  {
-    files: ["**/*.{ts,tsx,mts,cts}"],
-    languageOptions: {
-      parserOptions: {
-        tsconfigRootDir: __dirname,
-        project: ["./tsconfig.json"],
-      },
-    },
-  },
-  {rules:{
-    // other rules..
-    "@typescript-eslint/no-explicit-any": "off",
-    // "@next/next/no-img-element": "off",
-    ...(isProd ? { "react-hooks/exhaustive-deps": "off" } : {}),
-  }},
-];
-
-export default eslintConfig;
diff --git a/apps/dm_new/middleware.ts b/apps/dm_new/middleware.ts
deleted file mode 100644
index e7d7a1509..000000000
--- a/apps/dm_new/middleware.ts
+++ /dev/null
@@ -1,179 +0,0 @@
-import { NextRequest, NextResponse } from "next/server";
-import { CLAIM_NAME, AUTH_USER_ID } from "./src/shared/config";
-// import { SERVER_API_FO_URL, SERVER_API_WR_URL } from "./src/shared/config/env";
-
-// const CLAIM_NAME = "Authorization";
-// const AUTH_USER_ID = "token-id";
-const serverApiUrl = process.env.NEXT_PUBLIC_CS_SERVER_API_URL;
-const GEOSERVER_URL = process.env.NEXT_PUBLIC_GEOSERVER_URL || "";
-const LX_GEOSERVER_URL = process.env.NEXT_PUBLIC_LX_GEOSERVER_URL || "";
-const GATEWAY_URL = process.env.NEXT_PUBLIC_GATEWAY_URL || "";
-const BUSINESS_JUSO_API_URL = process.env.NEXT_PUBLIC_FINDADRESS_URL || "";
-const AdressKey = process.env.NEXT_PRIVATE_WR_ADDRESS_KEY || "";
-
-/** 공통: URLSearchParams의 값을 decodeURIComponent 적용하여 querystring 생성 */
-function toDecodedQueryString(params: URLSearchParams): string {
-  const entries: string[][] = Array.from(params.entries()).map(([k, v]) => {
-    try {
-      return [k, decodeURIComponent(v)] as string[];
-    } catch {
-      return [k, v] as string[];
-    }
-  });
-  return new URLSearchParams(entries).toString();
-}
-
-export function middleware(req: NextRequest) {
-  const pathname = req.nextUrl.pathname;
-  console.log(`[Middleware] Request URL: ${req.url}`);
-  const searchParams = req.nextUrl.searchParams;
-
-  // if (pathname.startsWith("/server")) {
-  //   const queryParams = searchParams.toString();
-  //   const newUrl = `${serverApiUrl}${pathname.replace("/server", "")}${
-  //     queryParams ? `?${queryParams}` : ""
-  //   }`;
-  //   console.log(`[Middleware] Rewriting from '/server' path to: ${newUrl}`);
-  //   return NextResponse.rewrite(new URL(newUrl));
-  // }
-
-  if (pathname.startsWith("/server")) {
-    const decodedParams = Array.from(searchParams.entries())
-      .map(([key, value]) => `${key}=${decodeURIComponent(value)}`)
-      .join("&");
-
-    const newUrl = `${serverApiUrl}${pathname.replace("/server", "")}${decodedParams ? `?${decodedParams}` : ""
-      }`;
-    return NextResponse.rewrite(new URL(newUrl));
-  }
-
-  if (pathname === "/") {
-    console.log(" maim 화면이동 ");
-    return NextResponse.redirect(new URL("/main", req.url));
-  }
-
-  if (pathname.startsWith("/attach-service")) {
-    const requestHeaders = new Headers(req.headers);
-    const token = req.cookies.get(CLAIM_NAME)?.value;
-    const userId = req.cookies.get(AUTH_USER_ID)?.value;
-    const newUrl = `${serverApiUrl}${pathname}`;
-    if (token) requestHeaders.set(CLAIM_NAME, token);
-    if (userId) requestHeaders.set(AUTH_USER_ID, userId);
-
-    console.log(`[Middleware] Rewriting from '/attach-service' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl), {
-      headers: requestHeaders,
-    });
-  }
-
-  if (pathname.startsWith("/user-service")
-    || pathname.startsWith("/cms-service")) {
-    let queryParams = searchParams.toString();
-    const requestHeaders = new Headers(req.headers);
-    const newUrl = `${serverApiUrl}${pathname}${queryParams ? `?${queryParams}` : ""}`;
-
-    console.log(`[Middleware] Rewriting from '/user-service' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl), {
-      headers: requestHeaders,
-    });
-  }
-
-  if (pathname.startsWith("/geoserver")) {
-    let queryParams = searchParams.toString();
-    const typename = searchParams.get("TYPENAME");
-    console.log("typename  ", typename);
-
-    let newUrl = `${GEOSERVER_URL}${pathname.replace("/geoserver", "")}${queryParams ? `?${queryParams}` : ""}`;
-
-    if (
-      typename == "hasudo:tb_il_swage_prcs_fclt" || //하수처리시설
-      typename == "hasudo:tb_ms_swage_prcs_zone" || //하수처리구역
-      typename == "hasudo:tb_ms_sbmrg_dngr_map" || //침수위험지도
-      typename == "hasudo:tb_ms_flood_dngr_map" //도시침수지도
-    ) {
-      newUrl = `${GEOSERVER_URL}${pathname.replace("/geoserver", "")}${queryParams ? `?${queryParams}` : ""}`;
-    } else if (
-      typename == "hasudo:tb_ms_swage_ppl" || //관로
-      typename == "hasudo:tb_ms_swage_mhl" || //맨홀
-      typename == "hasudo:tb_ms_swage_pmstn" || //펌프장
-      typename == "hasudo:tb_ms_stofcbr" //우수토실
-    ) {
-      newUrl = `${LX_GEOSERVER_URL}${pathname.replace("/geoserver", "")}${queryParams ? `?${queryParams}` : ""}`;
-    } else if (
-      typename == "hasudo:om_dt_untrt_swg_rain" || //중점우수토실
-      typename == "hasudo:om_wqlt_station" || //관측소
-      typename == "hasudo:tb_wr_bdst_ruse_fclt" || //재이용시설
-      typename == "hasudo:tb_wr_rnwtr_utztn_fclt" || //빗물이용시설
-      typename == "hasudo:tb_wr_rswtr_fclt" || //중수도시설
-      typename == "hasudo:tb_wr_htdfl_fclt" || //온배수시설
-      typename == "hasudo:tb_wr_ruse_fclt_dmd_co" || //수요처
-      typename == "hasudo:tb_wr_tmpr_dmd_co" //잠재수요처
-    ) {
-      const url = req.nextUrl.clone();
-      url.searchParams.set("TYPENAME", typename.replace("hasudo:", ""));
-      queryParams = url.searchParams.toString();
-      newUrl = `${GATEWAY_URL}/api/v1/map/geometry${queryParams ? `?${queryParams}` : ""}`;
-    }
-
-    console.log(`[Middleware] Rewriting from '/geoserver' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl));
-  }
-
-  if (pathname.startsWith("/reuse-service")) {
-    const queryParams = searchParams.toString();
-    const newUrl = `${GATEWAY_URL}${pathname}${queryParams ? `?${queryParams}` : ""}`;
-    console.log(`[Middleware] Rewriting from '/reuse-service' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl));
-  } else if (pathname.startsWith("/operation-service")) {
-    const queryParams = searchParams.toString();
-    const newUrl = `${GATEWAY_URL}${pathname}${queryParams ? `?${queryParams}` : ""}`;
-    console.log(`[Middleware] Rewriting from '/operation-service' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl));
-  } else if (pathname.startsWith("/sewerage-service")) {
-    const queryParams = searchParams.toString();
-    const newUrl = `${GATEWAY_URL}${pathname}${queryParams ? `?${queryParams}` : ""}`;
-    console.log(`[Middleware] Rewriting from '/sewerage-service' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl));
-  }
-
-  if (pathname.startsWith("/ngii-server")) {
-    const decodedQuery = toDecodedQueryString(searchParams);
-    const newUrl = `${process.env.NEXT_PUBLIC_NGII_URL}${pathname.replace("/ngii-server", "")}${decodedQuery ? `?${decodedQuery}` : ""}`;
-    console.log(`[Middleware] Rewriting from '${pathname}' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl));
-  }
-
-  if (pathname.startsWith("/bussiness-juso-service")) {
-    console.log("AdressKey ", AdressKey);
-    const params = new URLSearchParams({
-      currentPage: "1", // 원하는 페이지
-      countPerPage: "5", // 페이지당 결과 수
-      keyword: searchParams.get("keyword") || "", // 검색어(주소)
-      confmKey: AdressKey, // 인증키 인터넷용 패쇄망용은 따로 발급 필요 즉 middleware에서 치환해서 사용해야할듯
-      resultType: "json", // 결과 형식 기본은 xml
-    });
-    const newUrl = `${BUSINESS_JUSO_API_URL}?${params.toString()}`;
-    console.log(`[Middleware] Request to business.juso.go.kr`);
-    console.log(req.url);
-    console.log(`[Middleware] Rewriting from '/business.juso.go.kr' path to: ${newUrl}`);
-    return NextResponse.rewrite(new URL(newUrl));
-  }
-
-  return NextResponse.next();
-}
-
-export const config = {
-  matcher: [
-    "/server/:path*",
-    "/user-service/:path*",
-    "/cms-service/:path*",
-    "/attach-service/:path*",
-    "/geoserver/:path*",
-    "/operation-service/:path*",
-    "/reuse-service/:path*",
-    "/sewerage-service/:path*",
-    "/bussiness-juso-service/:path*",
-    "/ngii-server/:path*",
-    "/",
-  ],
-};
diff --git a/apps/dm_new/next-env.d.ts b/apps/dm_new/next-env.d.ts
deleted file mode 100644
index 1b3be0840..000000000
--- a/apps/dm_new/next-env.d.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-/// <reference types="next" />
-/// <reference types="next/image-types/global" />
-
-// NOTE: This file should not be edited
-// see https://nextjs.org/docs/app/api-reference/config/typescript for more information.
diff --git a/apps/dm_new/next.config.ts b/apps/dm_new/next.config.ts
deleted file mode 100644
index 5b5bf85da..000000000
--- a/apps/dm_new/next.config.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import type { NextConfig } from "next";
-// import path from "path";
-
-const subDomain =
-  process.env.NEXT_PUBLIC_PROXY_HOST || "http://localhost:3000";
-
-const nextConfig: NextConfig = {
-  output: "standalone",
-  experimental: {
-    proxyTimeout: 600000,
-  },
-
-  // // 🔥 반드시 필요
-  // webpack(config) {
-  //   config.resolve.alias = {
-  //     ...(config.resolve.alias || {}),
-  //     // monorepo 구조 기준
-  //     "@common": path.resolve(__dirname, "../../packages/common"),
-  //   };
-  //   return config;
-  // },
-
-  async rewrites() {
-    return {
-      beforeFiles: [
-        {
-          source: "/_next/static/:path*",
-          destination: `${subDomain}/_next/static/:path*`,
-          has: [
-            {
-              type: "header",
-              key: "referer",
-              value: "(.*)/pst(.*)",
-            },
-          ],
-        },
-      ],
-      afterFiles: [
-        {
-          source: "/sewerage-service/:path*",
-          destination: `${subDomain}/sewerage-service/:path*`,
-        },
-        {
-          source: "/reuse-service/:path*",
-          destination: `${subDomain}/reuse-service/:path*`,
-        },
-        {
-          source: "/operation-service/:path*",
-          destination: `${subDomain}/operation-service/:path*`,
-        },
-      ],
-      fallback: [],
-    };
-  },
-};
-
-export default nextConfig;
diff --git a/apps/dm_new/package.json b/apps/dm_new/package.json
deleted file mode 100644
index 3df43f28e..000000000
--- a/apps/dm_new/package.json
+++ /dev/null
@@ -1,37 +0,0 @@
-{
-  "name": "dm_new",
-  "version": "0.1.0",
-  "private": true,
-  "scripts": {
-    "dev": "next dev -p 3015",
-    "build": "next build",
-    "start:dm_new": "next start -p 3015",
-    "lint": "next lint"
-  },
-  "dependencies": {
-    "@common/assets": "workspace:*",
-    "@common/business_components": "workspace:*",
-    "@common/components": "workspace:*",
-    "@hookform/resolvers": "^4.1.3",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "js-cookie": "^3.0.5",
-    "js-sha512": "^0.9.0",
-    "lucide-react": "^0.474.0",
-    "next": "15.3.8",
-    "react-hook-form": "^7.54.2",
-    "react-hot-toast": "^2.5.2",
-    "tailwind-merge": "^3.0.1",
-    "tailwindcss-animate": "^1.0.7",
-    "zod": "^3.24.2"
-  },
-  "devDependencies": {
-    "@eslint/eslintrc": "^3",
-    "@types/webpack": "^5.28.5",
-    "eslint": "^9",
-    "eslint-config-next": "15.3.8",
-    "postcss": "^8",  
-    "tailwindcss": "^3.4.1",
-    "typescript": "^5"
-  }
-}
diff --git a/apps/dm_new/postcss.config.mjs b/apps/dm_new/postcss.config.mjs
deleted file mode 100644
index 1a69fd2a4..000000000
--- a/apps/dm_new/postcss.config.mjs
+++ /dev/null
@@ -1,8 +0,0 @@
-/** @type {import('postcss-load-config').Config} */
-const config = {
-  plugins: {
-    tailwindcss: {},
-  },
-};
-
-export default config;
diff --git a/apps/dm_new/public/favicon.ico b/apps/dm_new/public/favicon.ico
deleted file mode 100644
index d304b6981..000000000
Binary files a/apps/dm_new/public/favicon.ico and /dev/null differ
diff --git a/apps/dm_new/public/fonts/NotoSansKR-Regular.woff2 b/apps/dm_new/public/fonts/NotoSansKR-Regular.woff2
deleted file mode 100644
index 61d064695..000000000
Binary files a/apps/dm_new/public/fonts/NotoSansKR-Regular.woff2 and /dev/null differ
diff --git a/apps/dm_new/src/entities/auth/api/login-service.ts b/apps/dm_new/src/entities/auth/api/login-service.ts
deleted file mode 100644
index 43ea1c33d..000000000
--- a/apps/dm_new/src/entities/auth/api/login-service.ts
+++ /dev/null
@@ -1,78 +0,0 @@
-import type { LoginService, ILogin } from "../model/login-interface";
-import { tokenManager } from "../lib/token-manager";
-import {PROXY_HOST, ACCESS_TOKEN, AUTH_USER_ID,SITE_ID, CLAIM_NAME, ENDPOINT, JWT_EXPIRATION_TIME } from "../../../shared/config";
-
-export class LoginApiService implements LoginService {
-  private static instance: LoginApiService;
-
-  private constructor() {}
-
-  public static getInstance(): LoginApiService {
-    if (!LoginApiService.instance) {
-      LoginApiService.instance = new LoginApiService();
-    }
-    return LoginApiService.instance;
-  }
-
-  public async login(payload: ILogin): Promise<void> {
-    try {
-      const response = await fetch( PROXY_HOST+ ENDPOINT.USER_SERVICE.LOGIN, {
-        method: "POST",
-        body: JSON.stringify({
-          userId: payload.userId,
-          password: payload.password,
-        }),
-      });
-      // const data =  response.headers.get(ACCESS_TOKEN);
-      const accessToken = response.headers.get(ACCESS_TOKEN);
-      const tokenId =    response.headers.get(AUTH_USER_ID);
-      
-      console.log('accessToken ', accessToken)
-      console.log('tokenId ', tokenId)
-
-      if (!accessToken || !tokenId) {
-        throw new Error("Missing required authentication tokens");
-      }
-
-      tokenManager.setToken(CLAIM_NAME, accessToken);
-      tokenManager.setToken(AUTH_USER_ID, tokenId);
-      tokenManager.setToken("site-id-key", SITE_ID);
-      tokenManager.setupRefreshTimer(
-        () => this.silentRefresh(),
-        JWT_EXPIRATION_TIME,
-      );
-    } catch (error) {
-
-      console.log(' login err ' , error)
-      throw new Error(`Login failed: ${error}`);
-    }
-  }
-
-
-  public async silentRefresh(): Promise<void> {
-    console.log('  silentRefresh ')
-    
-    try {
-      const response = await fetch(PROXY_HOST+
-        `${ENDPOINT.USER_SERVICE.SILENT_REFRESH}`,
-        { method: "PUT" },
-      );
-
-      const data = await response.json();
-      const accessToken = data[ACCESS_TOKEN];
-      const tokenId = data[AUTH_USER_ID];
-
-      if (!accessToken || !tokenId) {
-        throw new Error("Missing required authentication tokens");
-      }
-
-      tokenManager.setToken(CLAIM_NAME, accessToken);
-      tokenManager.setToken(AUTH_USER_ID, tokenId);
-    } catch (error) {
-      tokenManager.clearAuthToken();
-      throw new Error(`Silent refresh failed: ${error}`);
-    }
-  }
-}
-
-export const LoginApi = LoginApiService.getInstance();
diff --git a/apps/dm_new/src/entities/auth/index.ts b/apps/dm_new/src/entities/auth/index.ts
deleted file mode 100644
index 9dc9dd368..000000000
--- a/apps/dm_new/src/entities/auth/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { LoginApi } from "./api/login-service";
-//export { AuthWrapper } from "./lib/auth-wrapper";
diff --git a/apps/dm_new/src/entities/auth/lib/auth-wrapper.tsx b/apps/dm_new/src/entities/auth/lib/auth-wrapper.tsx
deleted file mode 100644
index 678ff50d5..000000000
--- a/apps/dm_new/src/entities/auth/lib/auth-wrapper.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-// "use client";
-
-// import { useEffect } from "react";
-// import { useRouter } from "next/navigation";
-// import { LoginApi } from "../api/login-service";
-
-// const AuthWrapper = ({ children }: { children: React.ReactNode }) => {
-//   const router = useRouter();
-//   const { userInfo, setUserInfo } = useUserStore((state) => state);
-
-//   async function authCheck() {
-//     const userId = getCookie(AUTH_USER_ID);
-//     if (!userId) {
-//       throw new Error("Missing required authentication tokens");
-//     }
-
-//     const response = await client.get<IUserInfo>(
-//       `${ENDPOINT.USER_SERVICE.USERS}/info/me`,
-//     );
-//     if (!userInfo) setUserInfo(response.data);
-//   }
-
-//   useEffect(() => {
-//     (async () => {
-//       try {
-//         await authCheck();
-//       } catch (error) {
-//         console.error(error);
-
-//         try {
-//           await LoginApi.silentRefresh();
-//           await authCheck();
-//         } catch (refreshError) {
-//           console.error("Token refresh failed:", refreshError);
-//           setUserInfo(null);
-//           router.push("/auth/login");
-//         }
-//       }
-//     })();
-//   }, []);
-
-//   return <>{children}</>;
-// };
-
-// export { AuthWrapper };
diff --git a/apps/dm_new/src/entities/auth/lib/token-manager.ts b/apps/dm_new/src/entities/auth/lib/token-manager.ts
deleted file mode 100644
index 40d32f33e..000000000
--- a/apps/dm_new/src/entities/auth/lib/token-manager.ts
+++ /dev/null
@@ -1,59 +0,0 @@
-import { AUTH_USER_ID, CLAIM_NAME } from "@/src/shared/config";
-import { getCookie, removeCookie, setCookie } from "@/src/shared/lib/cookie";
-
-export class TokenManager {
-  private static instance: TokenManager;
-  private refreshTimer: NodeJS.Timeout | null = null;
-
-  private constructor() {}
-
-  public static getInstance(): TokenManager {
-    if (!TokenManager.instance) {
-      TokenManager.instance = new TokenManager();
-    }
-    return TokenManager.instance;
-  }
-
-  public getToken(key: string): string | undefined {
-    return getCookie(key);
-  }
-
-  public setToken(key: string, value: string): void {
-    setCookie(key, value, {
-      secure: window.location.protocol === "https:",
-      sameSite: "lax",
-    });
-  }
-
-  public removeToken(key: string): void {
-    removeCookie(key);
-  }
-
-  public setupRefreshTimer(
-    callback: () => Promise<void>,
-    expirationTime: number,
-  ): void {
-    if (this.refreshTimer) {
-      clearTimeout(this.refreshTimer);
-    }
-
-    this.refreshTimer = setTimeout(() => {
-      callback().catch((error) => {
-        console.error("Silent refresh failed:", error);
-        this.clearAuthToken();
-      });
-    }, expirationTime - 60000);
-  }
-
-  public clearAuthToken(): void {
-    if (this.refreshTimer) {
-      clearTimeout(this.refreshTimer);
-      this.refreshTimer = null;
-    }
-
-    this.removeToken(CLAIM_NAME);
-    this.removeToken(AUTH_USER_ID);
-  }
-}
-
-export const tokenManager = TokenManager.getInstance();
diff --git a/apps/dm_new/src/entities/auth/model/login-interface.ts b/apps/dm_new/src/entities/auth/model/login-interface.ts
deleted file mode 100644
index 5aaf53044..000000000
--- a/apps/dm_new/src/entities/auth/model/login-interface.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-export interface ILogin {
-  userId: string;
-  password: string;
-}
-
-export interface LoginService {
-  login(payload: ILogin): Promise<void>;
-  silentRefresh(): Promise<void>;
-}
diff --git a/apps/dm_new/src/shared/api/client.ts b/apps/dm_new/src/shared/api/client.ts
deleted file mode 100644
index cf37e6671..000000000
--- a/apps/dm_new/src/shared/api/client.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Client } from "@common/network";
-import { BASE_URL } from "../config/api";
-import { SITE_ID } from "../config/env";
-import { setCookie } from "../lib";
-
-setCookie("site-id-key", SITE_ID);
-
-export const client = Client.getInstance({
-  baseURL: BASE_URL,
-  siteId: SITE_ID,
-});
diff --git a/apps/dm_new/src/shared/api/index.ts b/apps/dm_new/src/shared/api/index.ts
deleted file mode 100644
index b7b9d6121..000000000
--- a/apps/dm_new/src/shared/api/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { client } from "./client";
diff --git a/apps/dm_new/src/shared/config/api.ts b/apps/dm_new/src/shared/config/api.ts
deleted file mode 100644
index a531bed85..000000000
--- a/apps/dm_new/src/shared/config/api.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-import { PROXY_HOST } from "./env";
-
-export const BASE_URL = `${PROXY_HOST}/server`;
-
-export const ENDPOINT = {
-  ATTACH_SERVICE: {
-    TUS_UPLOAD: "/attach-service/api/v1/tus/upload",
-    EDITOR_UPLOAD: "/attach-service/api/v1/upload/editor",
-    IMAGES: "/attach-service/api/v1/images",
-    MOVIE_THUMBNAIL: "/attach-service/api/v1/movie/thumbnail",
-    ATTACHMENTS: "/attach-service/api/v1/atfl/attachments",
-    DOWNLOAD: "/attach-service/api/v1/atflcd/download",
-    STREAM_VIDEO: "/attach-service/api/v1/stream/video",
-  },
-  USER_SERVICE: {
-    LOGIN: "/user-service/login",
-    USERS: "/user-service/api/v1/users",
-    SILENT_REFRESH: "/user-service/api/v1/users/token/refresh",
-    AUTHORIZATIONS: "/user-service/api/v1/authorizations",
-    ROLE_AUTHORIZATIONS: "/user-service/api/v1/role-authorizations",
-    ROLES: "/user-service/api/v1/roles",
-
-  },
-  CMS_SERVICE: {
-    DMSITES:'cms-service/api/v1/menu/anonymous/user/DM',
-    SITES: "/cms-service/api/v1/sites",
-    IPS: "/cms-service/api/v1/site-ips",
-    DOMAINS: "/cms-service/api/v1/site-dmns",
-    POSTINGS: "/cms-service/api/v1/site-pstgs",
-    CODE: "/cms-service/api/v1/code/cache",
-    MENUS: "/cms-service/api/v1/menus",
-    MENU_ROLES: "/cms-service/api/v1/menu-roles",
-    MENU_AUTHRTS: "/cms-service/api/v1/menu-authrts",
-    CONTENTS: "/cms-service/api/v1/contents",
-    CONTENTS_DETAILS: "/cms-service/api/v1/contents-details",
-    ORGANIZATIONS: "/cms-service/api/v1/ognzs",
-    USER_ORGANIZATION: "/cms-service/api/v1/user-ognz",
-    IMAGES: "/cms-service/api/v1/images",
-    BANNERS: "/cms-service/api/v1/bnrs",
-    TEMPLATE: "/cms-service/api/v1/tmplt",
-    TERMS: "/cms-service/api/v1/trms",
-    LWPO_CODE: "/cms-service/api/v1/lwpo-cds",
-    UP_CODE: "/cms-service/api/v1/up-codes",
-    POPUPS: "/cms-service/api/v1/popups",
-    SCHEDULES: "/cms-service/api/v1/schdls",
-    SURVEY: "/cms-service/api/v1/srvy",
-    SURVEY_QUESTION: "/cms-service/api/v1/srvy-qitem",
-    SURVEY_ARTICLE: "/cms-service/api/v1/srvy-artcl",
-  },
-  BOARD_SERVICE: {
-    BBS: "/board-service/api/v1/bbs",
-    BBS_TEMPLATES: "/board-service/api/v1/bbsTmplt",
-    POSTS: "/board-service/api/v1/posts",
-    POSTS_COMMENTS: "/board-service/api/v1/posts-cmnts",
-  },
-};
-
-export const JWT_EXPIRATION_TIME = 1800000;
diff --git a/apps/dm_new/src/shared/config/env.ts b/apps/dm_new/src/shared/config/env.ts
deleted file mode 100644
index a9011b90e..000000000
--- a/apps/dm_new/src/shared/config/env.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-export const SITE_ID = process.env.NEXT_PUBLIC_SITE_ID || "DM";
-export const PORT = process.env.NEXT_PUBLIC_PORT || "3000";
-export const PROXY_HOST = process.env.NEXT_PUBLIC_PROXY_HOST || `http://localhost:${PORT}`;
-export const SERVER_API_DM_URL = process.env.NEXT_PUBLIC_DM_SERVER_API_URL ||'http://con.mind-one.co.kr:11035/api/v1';
-export const SERVER_API_FO_URL = process.env.NEXT_PUBLIC_FO_SERVER_API_URL||' http://con.mind-one.co.kr:11082/api/v1';
-export const SERVER_API_WR_URL = process.env.NEXT_PUBLIC_WR_SERVER_API_URL||' http://con.mind-one.co.kr:11080/api/v1';
-export const SERVER_API_CS_URL = process.env.NEXT_PUBLIC_CS_SERVER_API_URL||'http://dev.onasys.co.kr:8000';
-export const SERVER_API_CS_TUS_URL = process.env.NEXT_PUBLIC_CS_TUS_UPLOAD ||'/attach-service/api/v1/tus/upload'
-export const CLAIM_NAME = process.env.NEXT_PUBLIC_CLAIM_NAME || "Authorization";
-export const ACCESS_TOKEN =  process.env.NEXT_PUBLIC_ACCESS_TOKEN || "access-token";
-export const REFRESH_TOKEN =process.env.NEXT_PUBLIC_REFRESH_TOKEN || "refresh-token";
-export const AUTH_USER_ID = process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id";
-export const SERVER_SEWERAGE_API_URL = process.env.NEXT_PUBLIC_SEWERAGE_API_URL;
\ No newline at end of file
diff --git a/apps/dm_new/src/shared/config/index.ts b/apps/dm_new/src/shared/config/index.ts
deleted file mode 100644
index 3ac40ddb4..000000000
--- a/apps/dm_new/src/shared/config/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export * from "./api";
-export * from "./env";
\ No newline at end of file
diff --git a/apps/dm_new/src/shared/lib/index.ts b/apps/dm_new/src/shared/lib/index.ts
deleted file mode 100644
index c9cff1a80..000000000
--- a/apps/dm_new/src/shared/lib/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export { getCookie, setCookie, removeCookie } from "./cookie";
-// export { useMutationWrapper } from "./use-mutation-wrapper";
-// export { useAlertStore } from "./use-alert-store";
-// export { useDataTable } from "./use-data-table";
-export { useMenuStore } from "./use-menu-store";
-// export { useUserStore } from "./use-user-store";
-// export { usePrompt } from "./use-prompt";
-// export { useSelectPrompt } from "./use-select-prompt";
diff --git a/apps/dm_new/tailwind.config.ts b/apps/dm_new/tailwind.config.ts
deleted file mode 100644
index 42cfc69f5..000000000
--- a/apps/dm_new/tailwind.config.ts
+++ /dev/null
@@ -1,69 +0,0 @@
-import baseConfig from "../../packages/common/components/tailwind.config";
-
-import type { Config } from "tailwindcss";
-
-export default {
-	darkMode: ["class"],
-	presets: [baseConfig],
-	content: [
-		"./app/**/*.{js,ts,jsx,tsx,mdx}",
-		"./components/**/*.{js,ts,jsx,tsx,mdx}",
-		"../../packages/common/components/src/ui/**/*.{js,ts,jsx,tsx,mdx}",
-		"../../packages/common/business_components/src/ui/**/*.{js,ts,jsx,tsx,mdx}",
-	],
-	plugins: [require("tailwindcss-animate")],
-	theme: {
-		extend: {
-			fontFamily: {
-				NotoSansKR: ['NotoSansKR'],
-			},
-			borderRadius: {
-				lg: 'var(--radius)',
-				md: 'calc(var(--radius) - 2px)',
-				sm: 'calc(var(--radius) - 4px)'
-			},
-			colors: {
-				background: 'hsl(var(--background))',
-				foreground: 'hsl(var(--foreground))',
-				card: {
-					DEFAULT: 'hsl(var(--card))',
-					foreground: 'hsl(var(--card-foreground))'
-				},
-				popover: {
-					DEFAULT: 'hsl(var(--popover))',
-					foreground: 'hsl(var(--popover-foreground))'
-				},
-				primary: {
-					DEFAULT: 'hsl(var(--primary))',
-					foreground: 'hsl(var(--primary-foreground))'
-				},
-				secondary: {
-					DEFAULT: 'hsl(var(--secondary))',
-					foreground: 'hsl(var(--secondary-foreground))'
-				},
-				muted: {
-					DEFAULT: 'hsl(var(--muted))',
-					foreground: 'hsl(var(--muted-foreground))'
-				},
-				accent: {
-					DEFAULT: 'hsl(var(--accent))',
-					foreground: 'hsl(var(--accent-foreground))'
-				},
-				destructive: {
-					DEFAULT: 'hsl(var(--destructive))',
-					foreground: 'hsl(var(--destructive-foreground))'
-				},
-				border: 'hsl(var(--border))',
-				input: 'hsl(var(--input))',
-				ring: 'hsl(var(--ring))',
-				chart: {
-					'1': 'hsl(var(--chart-1))',
-					'2': 'hsl(var(--chart-2))',
-					'3': 'hsl(var(--chart-3))',
-					'4': 'hsl(var(--chart-4))',
-					'5': 'hsl(var(--chart-5))'
-				}
-			}
-		}
-	}
-} satisfies Config;
diff --git a/apps/dm_new/tsconfig.json b/apps/dm_new/tsconfig.json
deleted file mode 100644
index ba8cd2c2f..000000000
--- a/apps/dm_new/tsconfig.json
+++ /dev/null
@@ -1,55 +0,0 @@
-{
-  "$schema": "https://json.schemastore.org/tsconfig",
-  "extends": "../../tsconfig.base.json",
-  "compilerOptions": {
-    "noImplicitAny": false,
-    "baseUrl": ".",
-    "target": "ES2017",
-    "lib": ["dom", "dom.iterable", "esnext"],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "strict": true,
-    "noEmit": true,
-    "esModuleInterop": true,
-    "module": "esnext",
-    "moduleResolution": "bundler",
-    "verbatimModuleSyntax": true,
-    "strictNullChecks": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "jsx": "preserve",
-    "incremental": true,
-    "plugins": [
-      {
-        "name": "next"
-      }
-    ],
-    "paths": {
-      "@/*": ["./*"],
-      "@common/components/*": ["../../packages/common/components/src/*"],
-      "@common/components": ["../../packages/common/components/src/index"],
-      "@common/business_components/*": [
-        "../../packages/common/business_components/src/*"
-      ],
-      "@common/business_components": [
-        "../../packages/common/business_components/src/index"
-      ],
-      "@common/network": ["../../packages/common/network"]
-    }
-  },
-  "include": [
-    ".eslintrc.*",
-    "next-env.d.ts",
-    "**/*.d.ts",
-    "**/*.ts",
-    "**/*.tsx",
-    "**/*.mts",
-    "**/*.js",
-    "**/*.cjs",
-    "**/*.mjs",
-    "**/*.jsx",
-    "**/*.json",
-    ".next/types/**/*.ts"
-  ],
-  "exclude": ["**/node_modules", "**/.*/*"]
-}
diff --git a/apps/fo/.env.mindone b/apps/fo/.env.mindone
index f014168c2..2fd7e91c2 100644
--- a/apps/fo/.env.mindone
+++ b/apps/fo/.env.mindone
@@ -7,7 +7,6 @@ NEXT_PUBLIC_REFRESH_TOKEN = refresh-token
 NEXT_PUBLIC_PROXY_HOST = http://con.mind-one.co.kr:11300
 NEXT_PUBLIC_SUB_DOMAIN = http://con.mind-one.co.kr:13000
 NEXT_PUBLIC_CM_LOGIN_PAGE_URL = http://dev.onasys.co.kr:3000/auth/login
-#NEXT_PUBLIC_SERVER_API_URL = http://con.mind-one.co.kr:11082
 NEXT_PUBLIC_SERVER_API_URL = http://con.mind-one.co.kr:11083/operation-service
 NEXT_PUBLIC_WR_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/
 NEXT_PUBLIC_CS_SERVER_API_URL = http://dev.onasys.co.kr:8000
@@ -17,3 +16,4 @@ NEXT_PUBLIC_DC_URL     = https://apigateway.apps.rsonesoft.com/dc-service
 NEXT_PUBLIC_SEWERAGE_API_URL = http://con.mind-one.co.kr:11083/sewerage-service
 NEXT_PUBLIC_NGII_URL = https://map.ngii.go.kr
 NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={x}&tilerow={y}
+NEXT_PUBLIC_CM_LOGIN_PAGE_URL = /
\ No newline at end of file
diff --git a/apps/sn/.env.mindone b/apps/sn/.env.mindone
index cea5518db..847103c97 100644
--- a/apps/sn/.env.mindone
+++ b/apps/sn/.env.mindone
@@ -12,4 +12,5 @@ NEXT_PUBLIC_LX_GEOSERVER_URL = http://con.mind-one.co.kr:11306/geoserver
 NEXT_PUBLIC_NGII_URL = https://map.ngii.go.kr
 NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={x}&tilerow={y}
 NEXT_PUBLIC_SEWERAGE_API_URL = http://con.mind-one.co.kr:11083
-NEXT_PUBLIC_DC_URL = https://apigateway.apps.rsonesoft.com
\ No newline at end of file
+NEXT_PUBLIC_DC_URL = https://apigateway.apps.rsonesoft.com
+NEXT_PUBLIC_CM_LOGIN_PAGE_URL = /
\ No newline at end of file
diff --git a/apps/st/app/(main)/(with-base-layout)/layout.tsx b/apps/st/app/(main)/(with-base-layout)/layout.tsx
index 6faa92cc1..654a08534 100644
--- a/apps/st/app/(main)/(with-base-layout)/layout.tsx
+++ b/apps/st/app/(main)/(with-base-layout)/layout.tsx
@@ -12,8 +12,9 @@ import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { ENDPOINT } from "@/shared/config";
 import { getCookie, useAlertStore, useMenuStore } from "@/shared/lib";
 import { StatisticsPageLayout } from "@/shared/ui/statistics-page-layout";
-import { MenuApi } from "@/entities/menu";
+import { tokenManager } from "@/entities/auth";
 import type { MenuItem } from "@/entities/menu";
+import { MenuApi } from "@/entities/menu";
 import { BaseLayout } from "@common/components";
 import { getConfig } from "@common/config";
 
@@ -162,6 +163,7 @@ export default function WithBaseLayout({
     return (
         <BaseLayout
             queryClient={queryClient}
+            tokenManager={tokenManager}
             currentPath={currentPath}
             handleMenuClick={handleMenuClick}
         >
diff --git a/apps/st/package.json b/apps/st/package.json
index 0c120b1e2..184138657 100644
--- a/apps/st/package.json
+++ b/apps/st/package.json
@@ -10,8 +10,11 @@
   },
   "dependencies": {
     "@common/assets": "workspace:*",
+    "@common/auth": "workspace:*",
     "@common/components": "workspace:*",
     "@common/config": "workspace:*",
+    "@common/network": "workspace:*",
+    "@rsone/components": "workspace:*",
     "@faker-js/faker": "^9.9.0",
     "@fontsource-variable/noto-sans-kr": "^5.2.5",
     "@frontend-opensource/use-react-hooks": "^1.1.4",
@@ -26,7 +29,6 @@
     "@radix-ui/react-label": "^2.1.2",
     "@radix-ui/react-slot": "^1.1.2",
     "@radix-ui/react-tooltip": "^1.1.8",
-    "@rsone/components": "workspace:*",
     "@tanstack/react-query": "^5.67.1",
     "@tanstack/react-query-devtools": "^5.75.5",
     "@tanstack/react-table": "^8.21.2",
diff --git a/apps/st/src/components/css/DataGrid.css b/apps/st/src/components/css/DataGrid.css
index 68ab82f50..46a1c6304 100644
--- a/apps/st/src/components/css/DataGrid.css
+++ b/apps/st/src/components/css/DataGrid.css
@@ -27,7 +27,7 @@
     }
     /* 셀 클래스가 있으면 위 기본색보다 우선 (같은 specificity + 나중 규칙) */
     .rg-grid .rg-body .rg-table .rg-data-row .rg-data-cell.rg-cell-readonly {
-        @apply !bg-[#f0f0f0] !text-[#666];
+        @apply !bg-[#f9f8f8] !text-[#666];
     }
     .rg-grid .rg-body .rg-table .rg-data-row .rg-data-cell.rg-cell-verify-error {
         @apply !bg-[#ffe6e6] !text-[#c00];
diff --git a/apps/st/src/components/module/CompactDataGrid.tsx b/apps/st/src/components/module/CompactDataGrid.tsx
index b1f97eb14..048c21cec 100644
--- a/apps/st/src/components/module/CompactDataGrid.tsx
+++ b/apps/st/src/components/module/CompactDataGrid.tsx
@@ -72,6 +72,8 @@ const CompactDataGrid = ({
     getGridDataRef,
     cellStyleCallback,
     onRowClick,
+    compactFullWidth = false,
+    compactGridHeightClass = "h-[65vh]",
 }: DataGridProps) => {
     const { columns, columnLayout } = columnInfo;
     const gridRef = useRef<RealGridReact>(null);
@@ -313,7 +315,7 @@ const CompactDataGrid = ({
         return () => {
             if (getGridDataRef) getGridDataRef.current = null;
         };
-    }, [columns, columnLayout, fixedColumns, rowData, showHeaderCheckbox, getGridDataRef]);
+    }, [columns, columnLayout, fixedColumns, rowData, showHeaderCheckbox, getGridDataRef, compactFullWidth, compactGridHeightClass]);
 
     // 행 클릭 이벤트
     useEffect(() => {
@@ -336,8 +338,8 @@ const CompactDataGrid = ({
     }, [onRowClick]);
 
     return (
-        <div className="flex flex-col gap-[0.6rem] mx-[0.6rem] w-1/2">
-            <div className="h-[65vh]">
+        <div className={`flex flex-col gap-[0.6rem] ${compactFullWidth ? "w-full min-w-0" : "w-1/2"}`}>
+            <div className={compactGridHeightClass}>
                 <RealGridReact
                     ref={gridRef}
                     autoGenerateField={true}
diff --git a/apps/st/src/components/module/GridTopActionButton.tsx b/apps/st/src/components/module/GridTopActionButton.tsx
new file mode 100644
index 000000000..d2d8be50e
--- /dev/null
+++ b/apps/st/src/components/module/GridTopActionButton.tsx
@@ -0,0 +1,51 @@
+"use client";
+
+import { useState } from "react";
+import { Button, Dialog, DialogContent, DialogHeader, DialogTitle } from "@common/components";
+
+import SidoSggFacilityNameSearchForm from "./SidoSggFacilityNameSearchForm";
+
+type GridTopActionButtonProps = {
+    text: string;
+    onClick?: (helpers: { openDialog: (title?: string) => void; closeDialog: () => void }) => void;
+    /** 상위 화면 검색 통계연도 — 시설 조회 다이얼로그에 전달 */
+    statsYr?: string;
+};
+
+const GridTopActionButton = ({ text, onClick, statsYr }: GridTopActionButtonProps) => {
+    const [isOpen, setIsOpen] = useState(false);
+    const [title, setTitle] = useState(text);
+
+    const openDialog = (nextTitle?: string) => {
+        setTitle(nextTitle ?? text);
+        setIsOpen(true);
+    };
+
+    const closeDialog = () => setIsOpen(false);
+
+    const handleClick = () => {
+        if (onClick) {
+            onClick({ openDialog, closeDialog });
+            return;
+        }
+        openDialog(text);
+    };
+
+    return (
+        <>
+            <Button className="h-[3.2rem] px-6" color="white" type="button" onClick={handleClick}>
+                <span>{text}</span>
+            </Button>
+            <Dialog open={isOpen} onOpenChange={setIsOpen}>
+                <DialogContent aria-describedby={undefined} className="max-w-[100rem]">
+                    <DialogHeader>
+                        <DialogTitle>{title}</DialogTitle>
+                    </DialogHeader>
+                    <SidoSggFacilityNameSearchForm statsYr={statsYr} />
+                </DialogContent>
+            </Dialog>
+        </>
+    );
+};
+
+export default GridTopActionButton;
diff --git a/apps/st/src/components/module/SearchForm.tsx b/apps/st/src/components/module/SearchForm.tsx
index af35891cf..c3d7e4fc2 100644
--- a/apps/st/src/components/module/SearchForm.tsx
+++ b/apps/st/src/components/module/SearchForm.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { useState, useEffect } from "react";
-import useSWR from 'swr';
+import useSWR from "swr";
 
 import {
     Button,
@@ -12,20 +12,29 @@ import {
     SelectContent,
     SelectItem,
     SelectValue,
-    Checkbox
-}
-from "@common/components";
+    Checkbox,
+} from "@common/components";
 
 import { useAlertStore } from "@/shared/lib";
-import { type SearchFormProps, type SearchFormValues, defaultSearchFormProps } from "../type/SearchForm.type";
+import {
+    type SearchFormProps,
+    type SearchFormValues,
+    defaultSearchFormProps,
+} from "../type/SearchForm.type";
 import { statisticsAPi } from "@/entities/statistics/api/statistics-service";
-import type { ApiResponse, SearchCondition, Sgg } from "@/entities/statistics/model/statistics-interface";
+import type {
+    ApiResponse,
+    SearchCondition,
+    Sgg,
+} from "@/entities/statistics/model/statistics-interface";
 
 const getSidoListFetcher = async (): Promise<ApiResponse<SearchCondition>> => {
     return statisticsAPi.getSidoList();
 };
 
-const getSggListFetcher = async (key: [string, string]): Promise<ApiResponse<Sgg[]>> => {
+const getSggListFetcher = async (
+    key: [string, string],
+): Promise<ApiResponse<Sgg[]>> => {
     return statisticsAPi.getSggList(key[1]);
 };
 
@@ -46,7 +55,7 @@ const SearchForm = (props: SearchFormProps = {}) => {
             dedupingInterval: 2000,
             shouldRetryOnError: false,
             onSuccess: (data) => {
-                if (data.status !== 'success') {
+                if (data.status !== "success") {
                     alert(`시도 목록을 불러오는데 실패했습니다.
                         새로고침 후 다시 시도해주세요.`);
                 }
@@ -55,23 +64,21 @@ const SearchForm = (props: SearchFormProps = {}) => {
                 alert(`시도 목록을 불러오는데 실패했습니다.
                     새로고침 후 다시 시도해주세요.`);
             },
-        }
+        },
     );
 
     const [values, setValues] = useState<SearchFormValues>({
-        sido: props.defaultValues?.sido || '',
-        gugun: props.defaultValues?.gugun || '',
+        sido: props.defaultValues?.sido || "",
+        gugun: props.defaultValues?.gugun || "",
         year: props.defaultValues?.year || defaultYear.toString(),
-        order: props.defaultValues?.order || '',
-        fctName: props.defaultValues?.fctName || '',
-        bsnmCd: props.defaultValues?.bsnmCd || '',
+        order: props.defaultValues?.order || "",
+        fctName: props.defaultValues?.fctName || "",
+        bsnmCd: props.defaultValues?.bsnmCd || "",
         isDetail: false,
     });
 
     const sggKey: [string, string] | null =
-        values.sido && values.sido !== "ALL"
-            ? ["sgg-list", values.sido]
-            : null;
+        values.sido && values.sido !== "ALL" ? ["sgg-list", values.sido] : null;
     const { data: sggList } = useSWR<ApiResponse<Sgg[]>>(
         sggKey,
         getSggListFetcher,
@@ -82,7 +89,7 @@ const SearchForm = (props: SearchFormProps = {}) => {
             dedupingInterval: 2000,
             shouldRetryOnError: false,
             onSuccess: (data) => {
-                if (data.status !== 'success') {
+                if (data.status !== "success") {
                     alert(`시군구 목록을 불러오는데 실패했습니다.
                         새로고침 후 다시 시도해주세요.`);
                 }
@@ -91,23 +98,23 @@ const SearchForm = (props: SearchFormProps = {}) => {
                 alert(`시군구 목록을 불러오는데 실패했습니다.
                     새로고침 후 다시 시도해주세요.`);
             },
-        }
+        },
     );
     const sggOptions = sggList?.data ?? [];
 
-    const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
+    const handleSubmit = (e: React.SubmitEvent<HTMLFormElement>) => {
         e.preventDefault();
         props.onSubmit?.(values);
     };
 
     const handleReset = () => {
         const resetValues: SearchFormValues = {
-            sido: '',
-            gugun: '',
+            sido: "",
+            gugun: "",
             year: String(defaultYear),
-            order: '',
-            fctName: '',
-            bsnmCd: '',
+            order: "",
+            fctName: "",
+            bsnmCd: "",
             isDetail: false,
         };
         setValues(resetValues);
@@ -115,20 +122,23 @@ const SearchForm = (props: SearchFormProps = {}) => {
     };
 
     const handleSidoChange = (value: string) => {
-        const selectedBsnm = sidoList?.data.sidoList.find((v) => v.sido === value)?.bsnmCd || '';
+        const selectedBsnm =
+            sidoList?.data.sidoList.find((v) => v.sido === value)?.bsnmCd || "";
         setValues((prev) => ({
             ...prev,
             sido: value,
-            gugun: '',
+            gugun: "",
             bsnmCd: selectedBsnm,
         }));
     };
 
     const handleSggChange = (value: string) => {
         const listForBsnm = sggList?.data ?? [];
-        const selectedBsnm = value === 'ALL'
-            ? (sidoList?.data.sidoList.find((v) => v.sido === values.sido)?.bsnmCd || '')
-            : (listForBsnm.find((v) => v.gugun === value)?.bsnmCd || '');
+        const selectedBsnm =
+            value === "ALL"
+                ? sidoList?.data.sidoList.find((v) => v.sido === values.sido)
+                      ?.bsnmCd || ""
+                : listForBsnm.find((v) => v.gugun === value)?.bsnmCd || "";
 
         setValues((prev) => ({
             ...prev,
@@ -145,66 +155,80 @@ const SearchForm = (props: SearchFormProps = {}) => {
         <div className="card card-border">
             <form onSubmit={handleSubmit}>
                 <div className="flex items-center gap-8 p-2">
-                    {mergedProps.sido &&
+                    {mergedProps.sido && (
                         <div className="flex items-center gap-2">
-                            <Label className="text-label">
-                                시도
-                            </Label>
-                            <Select value={values.sido} onValueChange={handleSidoChange}>
+                            <Label className="text-label">시도</Label>
+                            <Select
+                                value={values.sido}
+                                onValueChange={handleSidoChange}
+                            >
                                 <SelectTrigger className="w-[12rem]">
                                     <SelectValue placeholder="선택"></SelectValue>
                                 </SelectTrigger>
                                 <SelectContent>
                                     <SelectItem value="ALL">선택</SelectItem>
                                     {sidoList?.data?.sidoList?.map((sido) => (
-                                        <SelectItem key={sido.adstDstrCd} value={sido.sido}>
+                                        <SelectItem
+                                            key={sido.adstDstrCd}
+                                            value={sido.sido}
+                                        >
                                             {sido.sido}
                                         </SelectItem>
                                     ))}
                                 </SelectContent>
                             </Select>
                         </div>
-                    }
-                    {mergedProps.gugun &&
+                    )}
+                    {mergedProps.gugun && (
                         <div className="flex items-center gap-2">
-                            <Label className="text-label">
-                                시군구
-                            </Label>
-                            <Select value={values.gugun} onValueChange={handleSggChange}>
+                            <Label className="text-label">시군구</Label>
+                            <Select
+                                value={values.gugun}
+                                onValueChange={handleSggChange}
+                            >
                                 <SelectTrigger className="w-[12rem]">
                                     <SelectValue placeholder="전체"></SelectValue>
                                 </SelectTrigger>
                                 <SelectContent>
                                     <SelectItem value="ALL">전체</SelectItem>
                                     {sggOptions?.map((sgg) => (
-                                        <SelectItem key={sgg.adstDstrCd} value={sgg.gugun}>
+                                        <SelectItem
+                                            key={sgg.adstDstrCd}
+                                            value={sgg.gugun}
+                                        >
                                             {sgg.gugun}
                                         </SelectItem>
                                     ))}
                                 </SelectContent>
                             </Select>
                         </div>
-                    }
-                    {mergedProps.year &&
+                    )}
+                    {mergedProps.year && (
                         <div className="flex items-center gap-2">
-                            <Label className="text-label">
-                                년도
-                            </Label>
-                            <Select value={values.year} onValueChange={(value) => setValues({ ...values, year: value })}>
+                            <Label className="text-label">년도</Label>
+                            <Select
+                                value={values.year}
+                                onValueChange={(value) =>
+                                    setValues({ ...values, year: value })
+                                }
+                            >
                                 <SelectTrigger className="w-[10rem]">
                                     <SelectValue placeholder="선택"></SelectValue>
                                 </SelectTrigger>
                                 <SelectContent>
                                     {sidoList?.data?.yearList.map((year) => (
-                                        <SelectItem key={year} value={String(year)}>
+                                        <SelectItem
+                                            key={year}
+                                            value={String(year)}
+                                        >
                                             {year}년
                                         </SelectItem>
                                     ))}
                                 </SelectContent>
                             </Select>
                         </div>
-                    }
-                    {mergedProps.isDetail &&
+                    )}
+                    {mergedProps.isDetail && (
                         <div className="flex items-center gap-2">
                             <Label className="text-label">
                                 세부 데이터 포함
@@ -212,17 +236,23 @@ const SearchForm = (props: SearchFormProps = {}) => {
                             <Checkbox
                                 checked={values.isDetail}
                                 onCheckedChange={(value) =>
-                                    setValues({ ...values, isDetail: value === true })
+                                    setValues({
+                                        ...values,
+                                        isDetail: value === true,
+                                    })
                                 }
                             />
                         </div>
-                    }
-                    {mergedProps.order &&
+                    )}
+                    {mergedProps.order && (
                         <div className="flex items-center gap-2">
-                            <Label className="text-label">
-                                차수
-                            </Label>
-                            <Select value={values.order} onValueChange={(value) => setValues({ ...values, order: value })}>
+                            <Label className="text-label">차수</Label>
+                            <Select
+                                value={values.order}
+                                onValueChange={(value) =>
+                                    setValues({ ...values, order: value })
+                                }
+                            >
                                 <SelectTrigger className="w-[10rem]">
                                     <SelectValue placeholder="전체"></SelectValue>
                                 </SelectTrigger>
@@ -231,9 +261,14 @@ const SearchForm = (props: SearchFormProps = {}) => {
                                 </SelectContent>
                             </Select>
                         </div>
-                    }
-                    <div className="flex items-center gap-2 ml-auto">
-                        <Button color="green" className="h-[3.2rem] w-[96px]" type="button" onClick={handleReset}>
+                    )}
+                    <div className="ml-auto flex items-center gap-2">
+                        <Button
+                            color="white"
+                            className="h-[3.2rem] w-[96px]"
+                            type="button"
+                            onClick={handleReset}
+                        >
                             초기화
                         </Button>
                         <Button className="h-[3.2rem] w-[96px]" type="submit">
@@ -241,35 +276,46 @@ const SearchForm = (props: SearchFormProps = {}) => {
                         </Button>
                     </div>
                 </div>
-                {(mergedProps.fctName || mergedProps.userMenual) &&
+                {(mergedProps.fctName || mergedProps.userMenual) && (
                     <div className="flex items-center p-2">
-                        {mergedProps.fctName &&
+                        {mergedProps.fctName && (
                             <div className="flex items-center gap-2">
-                                <Label htmlFor="fctNmSearchInput" className="mr-2 text-label">
+                                <Label
+                                    htmlFor="fctNmSearchInput"
+                                    className="mr-2 text-label"
+                                >
                                     시설명
                                 </Label>
                                 <Input
-                                    className="h-[3.2rem] w-[14rem] rounded-sm !text-[1.3rem] mr-4"
+                                    className="mr-4 h-[3.2rem] w-[14rem] rounded-sm !text-[1.3rem]"
                                     id="fctNmSearchInput"
                                     value={values.fctName}
-                                    onChange={(e) => setValues({ ...values, fctName: e.target.value })}
+                                    onChange={(e) =>
+                                        setValues({
+                                            ...values,
+                                            fctName: e.target.value,
+                                        })
+                                    }
                                     autoComplete="off"
                                 />
                             </div>
-                        }
-                        {mergedProps.userMenual &&
-                            <div className="flex items-center gap-2 ml-auto">
-                                <Button className="h-[3.2rem] w-[124px]" type="button">
+                        )}
+                        {mergedProps.userMenual && (
+                            <div className="ml-auto flex items-center gap-2">
+                                <Button
+                                    className="h-[3.2rem] w-[124px]"
+                                    type="button"
+                                >
                                     <i className="diveicon di-person-fill" />
                                     사용자 메뉴얼
                                 </Button>
                             </div>
-                        }
+                        )}
                     </div>
-                }
+                )}
             </form>
         </div>
     );
 };
 
-export default SearchForm;
\ No newline at end of file
+export default SearchForm;
diff --git a/apps/st/src/components/module/SidoSggFacilityNameSearchForm.tsx b/apps/st/src/components/module/SidoSggFacilityNameSearchForm.tsx
new file mode 100644
index 000000000..13b436ce4
--- /dev/null
+++ b/apps/st/src/components/module/SidoSggFacilityNameSearchForm.tsx
@@ -0,0 +1,408 @@
+"use client";
+
+import { useState } from "react";
+import useSWR from "swr";
+import { ValueType } from "realgrid";
+
+import {
+    Button,
+    Input,
+    Label,
+    Select,
+    SelectTrigger,
+    SelectContent,
+    SelectItem,
+    SelectValue,
+    LoadingWithAnimation,
+} from "@common/components";
+import CompactDataGrid from "./CompactDataGrid";
+import SaveButton from "../button/SaveButton";
+
+import { useAlertStore } from "@/shared/lib";
+import { statisticsAPi } from "@/entities/statistics/api/statistics-service";
+import type {
+    ApiResponse,
+    SearchCondition,
+    Sgg,
+} from "@/entities/statistics/model/statistics-interface";
+import type { ColumnInfo } from "../type/DataGrid.type";
+import type {
+    SeweragePipeFacilitiesListRequest,
+    SeweragePipeFacilityAdminAreaListRequest,
+} from "@/entities/statistics/model/input/statistics-sewage-pipe-input-interface";
+import { statisticsInputSewPipeApiService } from "@/entities/statistics/api/input/statistics-sewage-pipe-input-service";
+
+/** 다이얼로그 좌측: 처리시설 정보 (순번 없음) */
+const treatmentFacilityColumnInfo: ColumnInfo = {
+    columns: [
+        {
+            name: "ctpvNm",
+            fieldName: "ctpvNm",
+            header: { text: "시도" },
+            editable: false,
+        },
+        {
+            name: "sggNm",
+            fieldName: "sggNm",
+            header: { text: "시군구" },
+            editable: false,
+        },
+        {
+            name: "fctNm",
+            fieldName: "fctNm",
+            header: { text: "시설명" },
+            editable: false,
+        },
+        {
+            name: "fctCpc",
+            fieldName: "fctCpc",
+            header: { text: "시설용량(m³/일)" },
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0",
+            editable: false,
+        },
+    ],
+    columnLayout: ["ctpvNm", "sggNm", "fctNm", "fctCpc"],
+};
+
+/** 다이얼로그 우측: 행정구역 정보 (순번 없음, 헤더 체크박스는 showHeaderCheckbox) */
+const adminRegionColumnInfo: ColumnInfo = {
+    columns: [
+        {
+            name: "ctpvNm",
+            fieldName: "ctpvNm",
+            header: { text: "시도" },
+            editable: false,
+        },
+        {
+            name: "sggNm",
+            fieldName: "sggNm",
+            header: { text: "시군구" },
+            editable: false,
+        },
+        {
+            name: "emdNm",
+            fieldName: "emdNm",
+            header: { text: "읍면동" },
+            editable: false,
+        },
+    ],
+    columnLayout: ["ctpvNm", "sggNm", "emdNm"],
+};
+
+const getSidoListFetcher = async (): Promise<ApiResponse<SearchCondition>> => {
+    return statisticsAPi.getSidoList();
+};
+
+const getSggAllListFetcher = async (
+    key: [string, string],
+): Promise<ApiResponse<Sgg[]>> => {
+    return statisticsAPi.getSggAllList(key[1]);
+};
+
+type SidoSggFacilityNameSearchFormProps = {
+    /** 상위(SewagePipeInp 등) 검색 조건의 통계연도 — facilitiesList 등 API 필수값 */
+    statsYr?: string;
+};
+
+const SidoSggFacilityNameSearchForm = ({
+    statsYr,
+}: SidoSggFacilityNameSearchFormProps) => {
+    const { setMessage: alert } = useAlertStore((state) => state);
+
+    const { data: sidoList } = useSWR<ApiResponse<SearchCondition>>(
+        "sido-list",
+        getSidoListFetcher,
+        {
+            revalidateOnFocus: false,
+            revalidateOnReconnect: false,
+            revalidateIfStale: false,
+            dedupingInterval: 2000,
+            shouldRetryOnError: false,
+            onSuccess: (data) => {
+                if (data.status !== "success") {
+                    alert(
+                        `시도 목록을 불러오는데 실패했습니다.\n새로고침 후 다시 시도해주세요.`,
+                    );
+                }
+            },
+            onError: () => {
+                alert(
+                    `시도 목록을 불러오는데 실패했습니다.\n새로고침 후 다시 시도해주세요.`,
+                );
+            },
+        },
+    );
+
+    const [sido, setSido] = useState<string>("ALL");
+    const [gugun, setGugun] = useState<string>("ALL");
+    const [fctNm, setFctNm] = useState<string>("");
+    const [isLoading, setIsLoading] = useState<boolean>(false);
+
+    const [treatmentFacilityRows, setTreatmentFacilityRows] = useState<
+        Record<string, string | number>[]
+    >([]);
+    const [adminRegionRows, setAdminRegionRows] = useState<
+        Record<string, string | number>[]
+    >([]);
+
+    const sggKey: [string, string] | null =
+        sido && sido !== "ALL" ? ["sgg-all", sido] : null;
+    const { data: sggList } = useSWR<ApiResponse<Sgg[]>>(
+        sggKey,
+        getSggAllListFetcher,
+        {
+            revalidateOnFocus: false,
+            revalidateOnReconnect: false,
+            revalidateIfStale: false,
+            dedupingInterval: 2000,
+            shouldRetryOnError: false,
+            onSuccess: (data) => {
+                if (data.status !== "success") {
+                    alert(
+                        `시군구 목록을 불러오는데 실패했습니다.\n새로고침 후 다시 시도해주세요.`,
+                    );
+                }
+            },
+            onError: () => {
+                alert(
+                    `시군구 목록을 불러오는데 실패했습니다.\n새로고침 후 다시 시도해주세요.`,
+                );
+            },
+        },
+    );
+    const sggOptions = sggList?.data ?? [];
+
+    /** 시설 목록·행정구역 API 공통 — 하수도 사업자코드(bsnmCd) */
+    const resolveSewerBzmnCd = (): string => {
+        const sidoItem = sidoList?.data?.sidoList?.find((v) => v.sido === sido);
+        const raw =
+            gugun !== "ALL" && gugun
+                ? sggOptions.find((s) => s.gugun === gugun)?.bsnmCd
+                : sidoItem?.bsnmCd;
+        return raw?.trim() ?? "";
+    };
+
+    const handleSidoChange = (value: string) => {
+        setSido(value);
+        setGugun("ALL");
+    };
+
+    const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
+        e.preventDefault();
+        if (!statsYr?.trim()) {
+            alert("상단에서 통계연도로 조회한 뒤 이용해 주세요.");
+            return;
+        }
+        if (!sido || sido === "ALL") {
+            alert("시도를 선택해주세요.");
+            return;
+        }
+        const trimmedFclty = fctNm.trim();
+
+        const sewerBzmnCd = resolveSewerBzmnCd();
+
+        const params: SeweragePipeFacilitiesListRequest = {
+            statsYr: statsYr.trim(),
+            ...(sewerBzmnCd ? { sewerBzmnCd } : {}),
+            ctpvNm: sido,
+            ...(gugun !== "ALL" && gugun ? { sggNm: gugun } : {}),
+            ...(trimmedFclty ? { fcltyNm: trimmedFclty } : {}),
+        };
+
+        try {
+            setIsLoading(true);
+            const response =
+                await statisticsInputSewPipeApiService.getFacilitiesList(
+                    params,
+                );
+            if (response.status !== "success") {
+                alert(response.message ?? "처리시설 목록 조회에 실패했습니다.");
+                return;
+            }
+            const list = response.data ?? [];
+            setTreatmentFacilityRows(
+                list.map((item) => ({
+                    ctpvNm: item.ctpvNm,
+                    sggNm: item.sggNm,
+                    fctNm: item.bscFctNm,
+                    fctCpc: item.fctCpc,
+                    bscFctCd: item.bscFctCd,
+                    admdstCd: item.admdstCd,
+                    statsYr: item.statsYr,
+                })),
+            );
+            setAdminRegionRows([]);
+        } catch {
+            alert("처리시설 목록 조회 중 오류가 발생했습니다.");
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    const handleTreatmentFacilityRowClick = async (
+        row: Record<string, string | number>,
+    ) => {
+        if (!statsYr?.trim()) {
+            alert("상단에서 통계연도로 조회한 뒤 이용해 주세요.");
+            return;
+        }
+        const swtrmtFcltCd = String(row.bscFctCd ?? "").trim();
+        if (!swtrmtFcltCd) {
+            alert("처리시설 코드가 없습니다.");
+            return;
+        }
+
+        const ctpvNm = String(row.ctpvNm ?? sido);
+        const sggNm = String(
+            row.sggNm ?? (gugun !== "ALL" && gugun ? gugun : ""),
+        );
+
+        const params: SeweragePipeFacilityAdminAreaListRequest = {
+            statsYr: statsYr.trim(),
+            swtrmtFcltCd,
+            sewerBzmnCd: String(row.admdstCd ?? "").trim(),
+            ctpvNm,
+            sggNm,
+        };
+
+        try {
+            setIsLoading(true);
+            const response =
+                await statisticsInputSewPipeApiService.getFacilityAdminAreaList(
+                    params,
+                );
+            if (response.status !== "success") {
+                alert(response.message ?? "행정구역 목록 조회에 실패했습니다.");
+                return;
+            }
+            const list = response.data ?? [];
+            setAdminRegionRows(
+                list.map((item) => ({
+                    ctpvNm: item.ctpvNm,
+                    sggNm: item.sggNm,
+                    emdNm: item.admdstNm,
+                    admdstCd: item.admdstCd,
+                })),
+            );
+        } catch {
+            alert("행정구역 목록 조회 중 오류가 발생했습니다.");
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    const handleSaveAdminRegions = () => {
+        alert("저장 API 연동 예정입니다.");
+    };
+
+    return (
+        <div className="flex flex-col gap-4 pt-2">
+            <form onSubmit={handleSubmit} className="flex flex-col gap-4">
+                <div className="flex flex-wrap items-end gap-4">
+                    <div className="flex items-center gap-2">
+                        <Label className="shrink-0 text-label">시도</Label>
+                        <Select value={sido} onValueChange={handleSidoChange}>
+                            <SelectTrigger className="w-[12rem]">
+                                <SelectValue placeholder="전체" />
+                            </SelectTrigger>
+                            <SelectContent>
+                                <SelectItem value="ALL">전체</SelectItem>
+                                {sidoList?.data?.sidoList?.map((item) => (
+                                    <SelectItem
+                                        key={item.adstDstrCd}
+                                        value={item.sido}
+                                    >
+                                        {item.sido}
+                                    </SelectItem>
+                                ))}
+                            </SelectContent>
+                        </Select>
+                    </div>
+                    <div className="flex items-center gap-2">
+                        <Label className="shrink-0 text-label">시군구</Label>
+                        <Select
+                            value={gugun}
+                            onValueChange={setGugun}
+                            disabled={!sido || sido === "ALL"}
+                        >
+                            <SelectTrigger className="w-[12rem]">
+                                <SelectValue placeholder="전체" />
+                            </SelectTrigger>
+                            <SelectContent>
+                                <SelectItem value="ALL">전체</SelectItem>
+                                {sggOptions?.map((sgg) => (
+                                    <SelectItem
+                                        key={sgg.adstDstrCd}
+                                        value={sgg.gugun}
+                                    >
+                                        {sgg.gugun}
+                                    </SelectItem>
+                                ))}
+                            </SelectContent>
+                        </Select>
+                    </div>
+                    <div className="flex min-w-[20rem] flex-1 items-center gap-2">
+                        <Label className="shrink-0 text-label">시설명</Label>
+                        <Input
+                            className="min-w-[12rem] flex-1"
+                            value={fctNm}
+                            onChange={(e) => setFctNm(e.target.value)}
+                            placeholder="시설명 입력"
+                        />
+                    </div>
+                    <Button
+                        type="submit"
+                        className="h-[3.2rem] w-[96px]"
+                        color="primary"
+                    >
+                        조회
+                    </Button>
+                </div>
+                <div className="ml-auto">
+                    <SaveButton saveFunc={handleSaveAdminRegions} />
+                </div>
+            </form>
+            {isLoading && (
+                <div className="[data-theme='black']:bg-transparent absolute inset-0 z-50 flex items-center justify-center rounded-lg p-10">
+                    <div className="relative size-[5rem]">
+                        <LoadingWithAnimation color="primary" />
+                    </div>
+                </div>
+            )}
+            <div className="flex w-full min-w-0 items-stretch gap-[1.2rem]">
+                <div className="flex min-w-0 flex-1 flex-col gap-2">
+                    <h3 className="text-[1.4rem] font-medium text-foreground">
+                        처리시설 정보
+                    </h3>
+                    <CompactDataGrid
+                        columnInfo={treatmentFacilityColumnInfo}
+                        rowData={treatmentFacilityRows}
+                        setRowData={setTreatmentFacilityRows}
+                        showHeaderCheckbox={false}
+                        compactFullWidth
+                        onRowClick={handleTreatmentFacilityRowClick}
+                        // compactGridHeightClass="h-[min(40vh,28rem)] min-h-[16rem]"
+                    />
+                </div>
+                <div className="flex min-w-0 flex-1 flex-col gap-2">
+                    <div className="flex items-center justify-between gap-2">
+                        <h3 className="text-[1.4rem] font-medium text-foreground">
+                            행정구역 정보
+                        </h3>
+                    </div>
+                    <CompactDataGrid
+                        columnInfo={adminRegionColumnInfo}
+                        rowData={adminRegionRows}
+                        setRowData={setAdminRegionRows}
+                        showHeaderCheckbox
+                        compactFullWidth
+                        // compactGridHeightClass="h-[min(40vh,28rem)] min-h-[16rem]"
+                    />
+                </div>
+            </div>
+        </div>
+    );
+};
+
+export default SidoSggFacilityNameSearchForm;
diff --git a/apps/st/src/components/module/SplitDataGrid.tsx b/apps/st/src/components/module/SplitDataGrid.tsx
index 47ca47012..f275b83a2 100644
--- a/apps/st/src/components/module/SplitDataGrid.tsx
+++ b/apps/st/src/components/module/SplitDataGrid.tsx
@@ -14,7 +14,7 @@ const SplitDataGrid = ({
     enableSort = false,
 }: SplitDataGridProps) => {
     return (
-        <div className="flex gap-[0.6rem] mx-[0.6rem]">
+        <div className="flex gap-[1.2rem]">
             <CompactDataGrid
                 columnInfo={leftColumnInfo}
                 fixedColumns={leftFixedColumns}
diff --git a/apps/st/src/components/module/TabDataGrid.tsx b/apps/st/src/components/module/TabDataGrid.tsx
index 8611ef4dd..7f511665c 100644
--- a/apps/st/src/components/module/TabDataGrid.tsx
+++ b/apps/st/src/components/module/TabDataGrid.tsx
@@ -13,6 +13,7 @@ import { useTabStore } from "@/store/tab-store"
 import { Tabs, TabsList, TabsTrigger, TabsContent } from "@common/components";
 import { Button } from "@common/components";
 import SplitDataGrid from "./SplitDataGrid";
+import GridTopActionButton from "./GridTopActionButton";
 
 // RealGrid 타입 확장
 declare module "realgrid" {
@@ -214,7 +215,20 @@ function createNumberComparer(dp: RealGridDataProviderComparer): (field: string
     };
 }
 
-const TabDataGrid = ({ columnInfo, isExcelImport = true, isExcelExport = true, rows = [], showHeaderCheckbox = false, rowDataMap, setRowDataMap, activeTab: activeTabProp, onActiveTabChange, getGridDataRef, enableSort = false }: TabDataGridProps) => {
+const TabDataGrid = ({
+    columnInfo,
+    isExcelImport = true,
+    isExcelExport = true,
+    rows = [],
+    showHeaderCheckbox = false,
+    rowDataMap,
+    setRowDataMap,
+    activeTab: activeTabProp,
+    onActiveTabChange,
+    getGridDataRef,
+    enableSort = false,
+    facilitySearchStatsYr,
+}: TabDataGridProps) => {
     // 각 탭별로 그리드 ref와 데이터를 관리
     const gridRefs = useRef<Map<string, RealGridReact>>(new Map());
     const activeTabRef = useRef<string>("");
@@ -738,6 +752,11 @@ const TabDataGrid = ({ columnInfo, isExcelImport = true, isExcelExport = true, r
                     if (info.isSplitGrid && info.left && info.right) {
                         const leftRowData = rowDataMap.get(info.left.tabKey || `${tabKey}_left`) || [];
                         const rightRowData = rowDataMap.get(info.right.tabKey || `${tabKey}_right`) || [];
+                        const splitTopButton = info.right.topButton;
+                        const showSplitTopButton =
+                            Boolean(splitTopButton?.text) &&
+                            (splitTopButton?.visible ?? true) &&
+                            isExcelImport;
 
                         // ColumnInfoList를 ColumnInfo로 변환
                         const leftColumnInfo: ColumnInfo = {
@@ -751,6 +770,15 @@ const TabDataGrid = ({ columnInfo, isExcelImport = true, isExcelExport = true, r
 
                         return (
                             <TabsContent key={tabKey} value={tabKey}>
+                                <div className="flex justify-end items-center gap-[0.6rem] mb-[0.6rem]">
+                                    {showSplitTopButton && (
+                                        <GridTopActionButton
+                                            text={splitTopButton?.text ?? ""}
+                                            onClick={splitTopButton?.onClick}
+                                            statsYr={facilitySearchStatsYr ?? undefined}
+                                        />
+                                    )}
+                                </div>
                                 <SplitDataGrid
                                     leftColumnInfo={leftColumnInfo}
                                     rightColumnInfo={rightColumnInfo}
diff --git a/apps/st/src/components/statistics/input/SewagePipeInp.tsx b/apps/st/src/components/statistics/input/SewagePipeInp.tsx
index bdd404b0e..42fc8cfd2 100644
--- a/apps/st/src/components/statistics/input/SewagePipeInp.tsx
+++ b/apps/st/src/components/statistics/input/SewagePipeInp.tsx
@@ -1,4 +1,4 @@
-import { useState, useMemo } from "react";
+import { useState, useMemo, useRef } from "react";
 
 import SearchForm from "@/components/module/SearchForm";
 import TabDataGrid from "@/components/module/TabDataGrid";
@@ -12,16 +12,98 @@ import type { ColumnInfoList, ColumnConfig } from "@/components/type/DataGrid.ty
 import type { SearchFormValues } from "@/components/type/SearchForm.type";
 import { useAlertStore } from "@/shared/lib";
 import { useAdminStore } from "@/store/admin-store";
+import { statisticsInputSewSupplyRateApi } from "@/entities/statistics/api/input/statistics-input-sew-supply-rate-service";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import { doList } from "@/components/util/column/input/DoList";
+import { statisticsInputSewPipeApiService } from "@/entities/statistics/api/input/statistics-sewage-pipe-input-service";
+import type {
+    SeweragePipeInputAdminAreaConnectionItem,
+    SeweragePipeInputFacilityConnectionItem,
+    SeweragePipeInputFactInstallStatusItem,
+    SeweragePipeInputManholeStatusItem,
+    SeweragePipeInputPipeDiameterStatusItem,
+    SeweragePipeInputPipeTypeStatusItem,
+    SeweragePipeInputRegionalFactStatusItem,
+    SeweragePipeInputRegionalFactStatusSaveRequest,
+    SeweragePipeInputStatusInfo,
+    SeweragePipeRequestParams,
+} from "@/entities/statistics/model/input/statistics-sewage-pipe-input-interface";
+import { RegionalFactStatusInpColumn } from "@/components/util/column/input/sewagePipe/RegionalFactStatusInpColumn";
+import { toGridRows } from "@/components/util/grid/gridFunction";
+import { LoadingWithAnimation } from "@common/components";
+import { getUserInfo } from "../../../../../../packages/common/components/src/api";
+
+const applyEnterableFromStatus = (
+    statusInfo: SeweragePipeInputStatusInfo | null | undefined,
+    periodEnterable: boolean,
+    setIsEnterable: (v: boolean) => void
+) => {
+    if (statusInfo?.laeSbmsnSttsCd) {
+        if (["2", "3"].includes(statusInfo.laeSbmsnSttsCd)) {
+            setIsEnterable(false);
+        } else {
+            setIsEnterable(periodEnterable);
+        }
+    } else {
+        setIsEnterable(periodEnterable);
+    }
+};
+
+function buildSewagePipeSearchParam(
+    values: SearchFormValues,
+    overrides?: { mode?: string },
+): SeweragePipeRequestParams {
+    return {
+        statsYr: values.year,
+        sewerBzmnCd: values.bsnmCd,
+        ctpvNm: values.sido,
+        sggNm: values.gugun === "ALL" ? "" : values.gugun,
+        ...(overrides?.mode ? { mode: overrides.mode } : {}),
+    };
+}
 
 // 하수도 통계 관리 > 02. 하수관로
 const SewagePipeInp = () => {
     const [rowDataMap, setRowDataMap] = useState<Map<string, Record<string, string | number>[]>>(new Map());
     const { setMessage: alert } = useAlertStore((state) => state);
-    const [_isLoading, setIsLoading] = useState<boolean>(false);
     const [activeTab, setActiveTab] = useState<string>(SewagePipeInpColumnInfoList[0]?.tabKey ?? "ST00020001");
-    const [isEnterable, _setIsEnterable] = useState<boolean>(true);
+    const [isLoading, setIsLoading] = useState<boolean>(false);
+    const [searchValues, setSearchValues] = useState<SearchFormValues | null>(null);
+    const [isEnterable, setIsEnterable] = useState<boolean>(true);
+    const [lastSearchedYear, setLastSearchedYear] = useState<string | null>(null);
+    const [lastSearchedValues, setLastSearchedValues] = useState<SearchFormValues | null>(null);
+    const [statusInfo, setStatusInfo] = useState<SeweragePipeInputStatusInfo | null>(null);
+    // const [showDailog, setShowDailog] = useState<boolean>(false);
+    // const [isExceptionSubmitFlow, setIsExceptionSubmitFlow] = useState(false);
+    const [_statsCd, setStatsCd] = useState<string>('');
+    /** API 연결 전에도 검색 후 툴바 등 UI를 쓸 수 있게 함 */
+    const [hasSearched, setHasSearched] = useState(false);
+    // const { confirm } = useConfirm();
     const { isAdminInfo } = useAdminStore();
 
+    const getGridDataRef = useRef<(() => Record<string, string | number>[]) | null>(null);
+    const searchParamRef = useRef<SeweragePipeRequestParams | null>(null);
+    /** 검색 시 checkInputPeriod 결과 — 탭 전환 지연 조회 시 편집 가능 여부와 동일하게 맞춤 */
+    const periodEnterableRef = useRef(true);
+    /** 검색 완료 후(API 연결 전) 탭별 지연 로그용 — 첫 탭에 행이 없어도 동작하도록 보조 */
+    const searchDoneRef = useRef(false);
+    const lazyTabLoggedRef = useRef<Set<string>>(new Set());
+
+    const firstTabKey = SewagePipeInpColumnInfoList[0]?.tabKey ?? "ST00020001";
+
+    const handleReset = () => {
+        setRowDataMap(new Map());
+        setStatusInfo(null);
+        setLastSearchedYear(null);
+        setLastSearchedValues(null);
+        setHasSearched(false);
+        searchParamRef.current = null;
+        searchDoneRef.current = false;
+        lazyTabLoggedRef.current.clear();
+        periodEnterableRef.current = true;
+        setActiveTab(firstTabKey);
+    };
+
     const columnInfo = useMemo(() => {
         const canEdit = isEnterable || isAdminInfo;
         return SewagePipeInpColumnInfoList.map((tab: ColumnInfoList) => {
@@ -46,51 +128,313 @@ const SewagePipeInp = () => {
         });
     }, [isEnterable, isAdminInfo]);
 
-    // const handleSearch = async (values: SearchFormValues) => {
-    //     if (!values.sido || values.sido === 'ALL') {
-    //         alert('시도를 선택해주세요.');
-    //         return;
-    //     }
+    /** mergeIntoExistingMap: true면 지난연도(PRE) 등 — 현재 탭만 갱신, 나머지 탭 캐시 유지 */
+    const loadSewagePipeActiveTabData = async (
+        tabKey: string,
+        searchParam: SeweragePipeRequestParams,
+        values: SearchFormValues,
+        checkEnterable: boolean,
+        mergeIntoExistingMap: boolean,
+        updateLastSearchedValues: boolean,
+    ): Promise<boolean> => {
+        const applyRowMap = (apply: (m: Map<string, Record<string, string | number>[]>) => void) => {
+            if (mergeIntoExistingMap) {
+                setRowDataMap((prev) => {
+                    const next = new Map(prev);
+                    apply(next);
+                    return next;
+                });
+            } else {
+                const next = new Map<string, Record<string, string | number>[]>();
+                apply(next);
+                setRowDataMap(next);
+            }
+        };
 
-    //     setActiveTab('ST00020001');
+        if (tabKey === 'ST00020001') {
+            const response = await statisticsInputSewPipeApiService.getRegionalFactStatus(searchParam);
+            if (response.status === 'success') {
+                const commonInfo = response.data.commonInfo;
+                const convertedData = (response.data.regionalFactStatusList ?? []).map((d) => ({
+                    ctpvNm: commonInfo.ctpvNm,
+                    ...d,
+                }));
+                applyRowMap((m) => m.set('ST00020001', toGridRows(convertedData)));
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, checkEnterable, setIsEnterable);
+                if (updateLastSearchedValues) setLastSearchedValues(values);
+                return true;
+            }
+            alert(response.message || '데이터 조회 중 오류가 발생했습니다.');
+            return false;
+        }
+        if (tabKey === 'ST00020002') {
+            const response = await statisticsInputSewPipeApiService.getFactInstallStatus(searchParam);
+            if (response.status === 'success') {
+                const commonInfo = response.data.commonInfo;
+                const convertedData = (response.data.factInstallStatusList ?? []).map((d) => ({
+                    ctpvNm: commonInfo.ctpvNm,
+                    ...d,
+                }));
+                applyRowMap((m) => m.set('ST00020002', toGridRows(convertedData)));
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, checkEnterable, setIsEnterable);
+                if (updateLastSearchedValues) setLastSearchedValues(values);
+                return true;
+            }
+            alert(response.message || '데이터 조회 중 오류가 발생했습니다.');
+            return false;
+        }
+        if (tabKey === 'ST00020003') {
+            const response = await statisticsInputSewPipeApiService.getPipeTypeStatus(searchParam);
+            if (response.status === 'success') {
+                const commonInfo = response.data.commonInfo;
+                const convertedData = (response.data.pipeTypeStatusList ?? []).map((d) => ({
+                    ctpvNm: commonInfo.ctpvNm,
+                    ...d,
+                }));
+                applyRowMap((m) => m.set('ST00020003', toGridRows(convertedData)));
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, checkEnterable, setIsEnterable);
+                if (updateLastSearchedValues) setLastSearchedValues(values);
+                return true;
+            }
+            alert(response.message || '데이터 조회 중 오류가 발생했습니다.');
+            return false;
+        }
+        if (tabKey === 'ST00020004') {
+            const response = await statisticsInputSewPipeApiService.getPipeDiameterStatus(searchParam);
+            if (response.status === 'success') {
+                const commonInfo = response.data.commonInfo;
+                const convertedData = (response.data.pipeDiameterStatusList ?? []).map((d) => ({
+                    ctpvNm: commonInfo.ctpvNm,
+                    ...d,
+                }));
+                applyRowMap((m) => m.set('ST00020004', toGridRows(convertedData)));
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, checkEnterable, setIsEnterable);
+                if (updateLastSearchedValues) setLastSearchedValues(values);
+                return true;
+            }
+            alert(response.message || '데이터 조회 중 오류가 발생했습니다.');
+            return false;
+        }
+        if (tabKey === 'ST00020005') {
+            const response = await statisticsInputSewPipeApiService.getManholeStatus(searchParam);
+            if (response.status === 'success') {
+                const commonInfo = response.data.commonInfo;
+                const convertedData = (response.data.manholeStatusList ?? []).map((d) => ({
+                    ctpvNm: commonInfo.ctpvNm,
+                    ...d,
+                }));
+                applyRowMap((m) => m.set('ST00020005', toGridRows(convertedData)));
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, checkEnterable, setIsEnterable);
+                if (updateLastSearchedValues) setLastSearchedValues(values);
+                return true;
+            }
+            alert(response.message || '데이터 조회 중 오류가 발생했습니다.');
+            return false;
+        }
+        if (tabKey === 'ST00020006') {
+            const response = await statisticsInputSewPipeApiService.getConnectionStatus(searchParam);
+            if (response.status === 'success') {
+                const commonInfo = response.data.commonInfo;
+                const facilityConvertedData = (response.data.facilityConnectionList ?? []).map((d) => ({
+                    ...d,
+                }));
+                const adminConvertedData = (response.data.adminAreaConnectionList ?? []).map((d) => ({
+                    ...d,
+                    ctpvNm: d.ctpvNm || commonInfo.ctpvNm,
+                }));
+                applyRowMap((m) => {
+                    m.set('treatmentPlantConnectionInp', toGridRows(facilityConvertedData));
+                    m.set('adminAreaConnectionInp', toGridRows(adminConvertedData));
+                });
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, checkEnterable, setIsEnterable);
+                if (updateLastSearchedValues) setLastSearchedValues(values);
+                return true;
+            }
+            alert(response.message || '데이터 조회 중 오류가 발생했습니다.');
+            return false;
+        }
+        if (!mergeIntoExistingMap) {
+            setRowDataMap(new Map());
+        }
+        if (updateLastSearchedValues) setLastSearchedValues(values);
+        applyEnterableFromStatus(null, checkEnterable, setIsEnterable);
+        return true;
+    };
 
-    //     setRowDataMap(new Map());
+    const handleSearch = async (values: SearchFormValues) => {
+        if (!values.sido || values.sido === 'ALL') {
+            alert('시도를 선택해주세요.');
+            return;
+        }
 
-    //     try {
-    //         setIsLoading(true);
+        try {
+            const periodResponse = await statisticsInputSewSupplyRateApi.checkInputPeriod(values.year || '');
 
-    //         // const searchParam: SewagePipeReviewRequestParams = {
-    //         //     statsYr: values.year,
-    //         //     sewerBzmnCd: values.bsnmCd,
-    //         //     ctpvNm: values.sido,
-    //         //     sggNm: values.gugun === 'ALL' ? '' : values.gugun
-    //         // };
+            if (periodResponse.status !== 'success') {
+                alert(periodResponse.message);
+                return;
+            }
 
-    //         // searchParamRef.current = searchParam;
-    //         // const response = await statisticsManagementApi.getSewagePipeReviewRegionalList(searchParam);
+            const checkEnterable = periodResponse.data;
+            periodEnterableRef.current = checkEnterable;
 
-    //         // if (response?.status === 'success' && response.data) {
-    //         //     const newRowDataMap = new Map<string, Record<string, string | number>[]>();
-    //         //     newRowDataMap.set('ST00020001', toGridRows(response.data as object[]));
-    //         //     setRowDataMap(newRowDataMap);
-    //         // } else {
-    //         //     alert(response?.message || "데이터가 없습니다.");
-    //         // }
-    //     } catch {
-    //         alert('데이터 조회 중 오류가 발생했습니다.');
-    //     } finally {
-    //         setIsLoading(false);
-    //     }
-    // };
+            setRowDataMap(new Map());
+            lazyTabLoggedRef.current.clear();
+
+            setIsLoading(true);
+
+            const searchParam = buildSewagePipeSearchParam(values);
+            searchParamRef.current = searchParam;
+            searchDoneRef.current = true;
+            setHasSearched(true);
+            setLastSearchedYear(values.year ?? null);
+
+            await loadSewagePipeActiveTabData(activeTab, searchParam, values, checkEnterable, false, true);
+        } catch {
+            alert('데이터 조회 중 오류가 발생했습니다.');
+        } finally {
+            setIsLoading(false);
+        }
+    };
+
+    const handleActiveTabChange = async (tabKey: string) => {
+        setActiveTab(tabKey);
+
+        const activeTabData = rowDataMap.get(tabKey);
+        const hasActiveTabData = Array.isArray(activeTabData) && activeTabData.length > 0;
+
+        const canLazyLoad =
+            searchParamRef.current &&
+            !hasActiveTabData &&
+            !lazyTabLoggedRef.current.has(tabKey) &&
+            searchDoneRef.current;
+
+        if (!canLazyLoad) return;
+
+        const searchParam = searchParamRef.current;
+        if (!searchParam) return;
+
+        try {
+            setIsLoading(true);
+
+            let response;
+
+            if (tabKey === 'ST00020001') {
+                response = await statisticsInputSewPipeApiService.getRegionalFactStatus(searchParam);
+            } else if (tabKey === 'ST00020002') {
+                response = await statisticsInputSewPipeApiService.getFactInstallStatus(searchParam);
+            } else if (tabKey === 'ST00020003') {
+                response = await statisticsInputSewPipeApiService.getPipeTypeStatus(searchParam);
+            } else if (tabKey === 'ST00020004') {
+                response = await statisticsInputSewPipeApiService.getPipeDiameterStatus(searchParam);
+            } else if (tabKey === 'ST00020005') {
+                response = await statisticsInputSewPipeApiService.getManholeStatus(searchParam);
+            } else if (tabKey === 'ST00020006') {
+                response = await statisticsInputSewPipeApiService.getConnectionStatus(searchParam);
+            }
+            lazyTabLoggedRef.current.add(tabKey);
+
+            if (response?.status === 'success') {
+                setStatusInfo(response.data.statusInfo);
+                setStatsCd(response.data.commonInfo.statsCd);
+                applyEnterableFromStatus(response.data.statusInfo, periodEnterableRef.current, setIsEnterable);
+                setRowDataMap(prev => {
+                    const next = new Map(prev);
+                    if (tabKey === 'ST00020001') {
+                        const commonInfo = response.data.commonInfo;
+                        const convertedData = (response.data.regionalFactStatusList ?? []).map((d: SeweragePipeInputRegionalFactStatusItem) => ({
+                            ctpvNm: commonInfo.ctpvNm,
+                            ...d
+                        }));
+                        next.set(tabKey, toGridRows(convertedData));
+                    } else if (tabKey === 'ST00020002') {
+                        const commonInfo = response.data.commonInfo;
+                        const convertedData = (response.data.factInstallStatusList ?? []).map((d: SeweragePipeInputFactInstallStatusItem) => ({
+                            ctpvNm: commonInfo.ctpvNm,
+                            ...d
+                        }));
+                        next.set(tabKey, toGridRows(convertedData));
+                    } else if (tabKey === 'ST00020003') {
+                        const commonInfo = response.data.commonInfo;
+                        const convertedData = (response.data.pipeTypeStatusList ?? []).map((d: SeweragePipeInputPipeTypeStatusItem) => ({
+                            ctpvNm: commonInfo.ctpvNm,
+                            ...d
+                        }));
+                        next.set(tabKey, toGridRows(convertedData));
+                    } else if (tabKey === 'ST00020004') {
+                        const commonInfo = response.data.commonInfo;
+                        const convertedData = (response.data.pipeDiameterStatusList ?? []).map((d: SeweragePipeInputPipeDiameterStatusItem) => ({
+                            ctpvNm: commonInfo.ctpvNm,
+                            ...d
+                        }));
+                        next.set(tabKey, toGridRows(convertedData));
+                    } else if (tabKey === 'ST00020005') {
+                        const commonInfo = response.data.commonInfo;
+                        const convertedData = (response.data.manholeStatusList ?? []).map((d: SeweragePipeInputManholeStatusItem) => ({
+                            ctpvNm: commonInfo.ctpvNm,
+                            ...d
+                        }));
+                        next.set(tabKey, toGridRows(convertedData));
+                    } else if (tabKey === 'ST00020006') {
+                        const commonInfo = response.data.commonInfo;
+                        const facilityConvertedData = (response.data.facilityConnectionList ?? []).map((d: SeweragePipeInputFacilityConnectionItem) => ({
+                            ...d
+                        }));
+                        const adminConvertedData = (response.data.adminAreaConnectionList ?? []).map((d: SeweragePipeInputAdminAreaConnectionItem) => ({
+                            ...d,
+                            ctpvNm: d.ctpvNm || commonInfo.ctpvNm,
+                        }));
+                        next.set('treatmentPlantConnectionInp', toGridRows(facilityConvertedData));
+                        next.set('adminAreaConnectionInp', toGridRows(adminConvertedData));
+                    }
+                    return next;
+                });
+            } else {
+                alert(response?.message || '데이터 조회 중 오류가 발생했습니다.');
+            }
+        } catch {
+            alert('데이터 조회 중 오류가 발생했습니다.');
+        } finally {
+            setIsLoading(false);
+        }
+    };
 
     const SubmitExceptionFunc = () => {
         console.log('submit exception');
         // 예외 제출 로직 
     };
 
-    const getLastYearDataFunc = () => {
-        console.log('get last year data');
-        // 지난연도 데이터 가져오기 로직
+    const getLastYearDataFunc = async () => {
+        const values = lastSearchedValues ?? searchValues;
+        if (!values?.sido || values.sido === 'ALL') {
+            alert('시도를 선택해주세요.');
+            return;
+        }
+        if (!lastSearchedYear) {
+            alert('먼저 데이터를 조회해주세요.');
+            return;
+        }
+        try {
+            setIsLoading(true);
+            const param = buildSewagePipeSearchParam(values, { mode: 'PRE' });
+            await loadSewagePipeActiveTabData(activeTab, param, values, periodEnterableRef.current, true, false);
+        } catch {
+            alert('데이터 조회 중 오류가 발생했습니다.');
+        } finally {
+            setIsLoading(false);
+        }
     };
 
     const submitFunc = () => {
@@ -98,29 +442,146 @@ const SewagePipeInp = () => {
         // 제출 로직
     };
 
-    const saveFunc = () => {
-        console.log('save');
-        // 저장 로직
+    const saveFunc = async () => {
+        if (activeTab !== "ST00020001") {
+            return;
+        }
+        try {
+            const currentData = getGridDataRef.current?.();
+            if (!currentData || currentData.length === 0) {
+                alert("저장할 데이터가 없습니다.");
+                return;
+            }
+            const values = lastSearchedValues ?? searchValues;
+            if (!values?.year) {
+                alert("검색 후 저장해 주세요.");
+                return;
+            }
+
+            const columnFormatMap = new Map<string, string>();
+            RegionalFactStatusInpColumn.columns.forEach((col) => {
+                if (col.fieldName && col.dataFormat) {
+                    columnFormatMap.set(col.fieldName, col.dataFormat);
+                }
+            });
+
+            const formatNumber = (value: string | number | null | undefined, fieldName: string): number => {
+                if (value === null || value === undefined || value === "") return 0;
+                const num = typeof value === "string" ? parseFloat(value.replace(/,/g, "")) : value;
+                if (isNaN(num)) return 0;
+                const format = columnFormatMap.get(fieldName);
+                if (!format) return num;
+                const decimalPlaces = format.match(/\.(\d+)/)?.[1]?.length ?? 0;
+                return decimalPlaces > 0 ? parseFloat(num.toFixed(decimalPlaces)) : Math.round(num);
+            };
+
+            const userInfo = await getUserInfo();
+
+            const saveList = currentData.map((d) => ({
+                admdstCd: String(d.admdstCd ?? ""),
+                sggNm: String(d.sggNm ?? ""),
+                admdstNm: String(d.admdstNm ?? ""),
+                goalYr: String(d.goalYr ?? ""),
+                wholPplMtncPlanPrlg: formatNumber(d.wholPplMtncPlanPrlg, "wholPplMtncPlanPrlg"),
+                wholPlanPrlg: formatNumber(d.wholPlanPrlg, "wholPlanPrlg"),
+                wholFcltPrlg: formatNumber(d.wholFcltPrlg, "wholFcltPrlg"),
+                swagePplPsplyRt: formatNumber(d.swagePplPsplyRt, "swagePplPsplyRt"),
+                cbsysPplMtncPlanArea: formatNumber(d.cbsysPplMtncPlanArea, "cbsysPplMtncPlanArea"),
+                cbsysPplMtncPlanPrlg: formatNumber(d.cbsysPplMtncPlanPrlg, "cbsysPplMtncPlanPrlg"),
+                cbsysPlanPrlg: formatNumber(d.cbsysPlanPrlg, "cbsysPlanPrlg"),
+                cbsysFcltPrlg: formatNumber(d.cbsysFcltPrlg, "cbsysFcltPrlg"),
+                cbsysSqrePrlg: formatNumber(d.cbsysSqrePrlg, "cbsysSqrePrlg"),
+                cbsysCiclPrlg: formatNumber(d.cbsysCiclPrlg, "cbsysCiclPrlg"),
+                cbsysOpnPrlg: formatNumber(d.cbsysOpnPrlg, "cbsysOpnPrlg"),
+                cbsysGttrPrlg: formatNumber(d.cbsysGttrPrlg, "cbsysGttrPrlg"),
+                drtwPplMtncPlanArea: formatNumber(d.drtwPplMtncPlanArea, "drtwPplMtncPlanArea"),
+                drtwPplMtncPlanPrlg: formatNumber(d.drtwPplMtncPlanPrlg, "drtwPplMtncPlanPrlg"),
+                drtwPplPlanPrlg: formatNumber(d.drtwPplPlanPrlg, "drtwPplPlanPrlg"),
+                drtwPplFcltPrlg: formatNumber(d.drtwPplFcltPrlg, "drtwPplFcltPrlg"),
+                drtwPplSqrePrlg: formatNumber(d.drtwPplSqrePrlg, "drtwPplSqrePrlg"),
+                drtwPplCiclPrlg: formatNumber(d.drtwPplCiclPrlg, "drtwPplCiclPrlg"),
+                exlnPplMtncPlanArea: formatNumber(d.exlnPplMtncPlanArea, "exlnPplMtncPlanArea"),
+                exlnPplMtncPlanPrlg: formatNumber(d.exlnPplMtncPlanPrlg, "exlnPplMtncPlanPrlg"),
+                exlnPplPlanPrlg: formatNumber(d.exlnPplPlanPrlg, "exlnPplPlanPrlg"),
+                exlnPplFcltPrlg: formatNumber(d.exlnPplFcltPrlg, "exlnPplFcltPrlg"),
+                exlnPplSqrePrlg: formatNumber(d.exlnPplSqrePrlg, "exlnPplSqrePrlg"),
+                exlnPplCiclPrlg: formatNumber(d.exlnPplCiclPrlg, "exlnPplCiclPrlg"),
+                exlnPplOpnPrlg: formatNumber(d.exlnPplOpnPrlg, "exlnPplOpnPrlg"),
+                exlnPplGttrPrlg: formatNumber(d.exlnPplGttrPrlg, "exlnPplGttrPrlg"),
+                cbsysMnhlCnt: formatNumber(d.cbsysMnhlCnt, "cbsysMnhlCnt"),
+                sprsysDrtwMnhlCnt: formatNumber(d.sprsysDrtwMnhlCnt, "sprsysDrtwMnhlCnt"),
+                sprsysExlnMnhlCnt: formatNumber(d.sprsysExlnMnhlCnt, "sprsysExlnMnhlCnt"),
+                drtwRcvprpCnt: formatNumber(d.drtwRcvprpCnt, "drtwRcvprpCnt"),
+                exlnRcvprpCnt: formatNumber(d.exlnRcvprpCnt, "exlnRcvprpCnt"),
+                stofcbrCnt: formatNumber(d.stofcbrCnt, "stofcbrCnt"),
+                exlnOtflCnt: formatNumber(d.exlnOtflCnt, "exlnOtflCnt"),
+                sewerLdgrEdpPrlg: formatNumber(d.sewerLdgrEdpPrlg, "sewerLdgrEdpPrlg"),
+                sewerLdgrEdpRt: formatNumber(d.sewerLdgrEdpRt, "sewerLdgrEdpRt"),
+                rmrk: (d.rmrk as string | null) ?? null,
+            }));
+
+            const param: SeweragePipeInputRegionalFactStatusSaveRequest = {
+                statsYr: values.year ?? "",
+                ctpvNm: values.sido ?? "",
+                sggNm: values.gugun === "ALL" ? "" : (values.gugun ?? ""),
+                sewerBzmnCd: values.bsnmCd ?? "",
+                userId: userInfo.userUnqId,
+                superAdmin: isAdminInfo ? "superAdmin" : "",
+                saveList,
+            };
+
+            console.log(param);
+        } catch {
+            alert("저장 준비 중 오류가 발생했습니다.");
+        }
     };
 
+    const gugunOkOrNotDoList = doList.includes(lastSearchedValues?.bsnmCd || '')
+        ? Boolean(lastSearchedValues?.gugun && lastSearchedValues.gugun !== 'ALL')
+        : true;
+
+    const showSaveInToolbar = (isEnterable || isAdminInfo) && gugunOkOrNotDoList;
+    const showEnterableToolbarButtons = isEnterable && gugunOkOrNotDoList;
+
+    /** TabDataGrid는 rowDataMap 사용 — 행이 하나라도 있을 때만 툴바 카드 의미 있음 */
+    const hasRowData = Array.from(rowDataMap.values()).some((rows) => rows.length > 0);
+
+    const showActionToolbarCard =
+        (hasRowData || hasSearched) &&
+        (showSaveInToolbar ||
+            (statusInfo?.laeSbmsnSttsCd === '2' && (isAdminInfo || (isEnterable && gugunOkOrNotDoList))));
 
     return (
         <>
-            <SearchForm />
-            <div className="card !py-0">
-                <div className="flex justify-end items-center gap-[0.6rem] mx-[0.6rem]">
-                    <SubmitExceptionButton SubmitExceptionFunc={SubmitExceptionFunc} />
-                    <LastYearDataButton getLastYearDataFunc={getLastYearDataFunc} />
-                    <SubmitButton submitFunc={submitFunc} />
-                    <SaveButton saveFunc={saveFunc} />
+            <SearchForm onSubmit={handleSearch} onReset={handleReset} onValuesChange={setSearchValues} />
+            {showActionToolbarCard && (
+                <div className="card !py-0">
+                    <div className="flex justify-end items-center gap-[0.6rem] mx-[0.6rem]">
+                        {showEnterableToolbarButtons && (
+                            <>
+                                <SubmitExceptionButton SubmitExceptionFunc={SubmitExceptionFunc} />
+                                <LastYearDataButton getLastYearDataFunc={() => void getLastYearDataFunc()} />
+                                <SubmitButton submitFunc={submitFunc} />
+                            </>
+                        )}
+                        {showSaveInToolbar && <SaveButton saveFunc={saveFunc} />}
+                    </div>
                 </div>
-            </div>
+            )}
+            {isLoading && <div className="absolute inset-0 z-50 [data-theme='black']:bg-transparent rounded-lg p-10 flex justify-center items-center">
+                <div className="relative size-[5rem]">
+                    <LoadingWithAnimation color="primary" />
+                </div>
+            </div>}
             <TabDataGrid
                 columnInfo={columnInfo}
                 rowDataMap={rowDataMap}
                 setRowDataMap={setRowDataMap}
                 activeTab={activeTab}
-                onActiveTabChange={setActiveTab}
+                onActiveTabChange={handleActiveTabChange}
+                isExcelImport={hasRowData && isEnterable && gugunOkOrNotDoList}
+                facilitySearchStatsYr={lastSearchedYear}
+                getGridDataRef={getGridDataRef}
             />
         </>
     );
diff --git a/apps/st/src/components/statistics/input/SeweragePenetrationRateInp.tsx b/apps/st/src/components/statistics/input/SeweragePenetrationRateInp.tsx
index e3253995e..e8fec3870 100644
--- a/apps/st/src/components/statistics/input/SeweragePenetrationRateInp.tsx
+++ b/apps/st/src/components/statistics/input/SeweragePenetrationRateInp.tsx
@@ -30,7 +30,7 @@ import type {
     SewerageSupplyRateSaveRequest,
     SewerageSupplyRateStatusInfo,
 } from "@/entities/statistics/model/input/statistics-sewage-supply-rate-input-interface";
-import type { cancelSubmitRequest } from "@/entities/statistics/model/statistics-interface";
+import type { cancelSubmitRequest, SubmitExceptionRequest } from "@/entities/statistics/model/statistics-interface";
 import type { StatisticsInputSubmitInfoFormData } from "@/entities/statistics/model/statistics-input-submit-info-schema";
 import { SeweragePenetrationRateInpColumn } from "@/components/util/column/input/SeweragePenetrationRateInpColumn";
 import { doList } from "@/components/util/column/input/DoList";
@@ -69,6 +69,8 @@ const SeweragePenetrationRateInp = () => {
     const [lastSearchedValues, setLastSearchedValues] = useState<SearchFormValues | null>(null);
     const [statusInfo, setStatusInfo] = useState<SewerageSupplyRateStatusInfo | null>(null);
     const [showDailog, setShowDailog] = useState<boolean>(false);
+    /** 예외제출 버튼으로 연 다이얼로그인지 (확인 시 executeSubmit 대신 SubmitExceptionFunc 경로) */
+    const [isExceptionSubmitFlow, setIsExceptionSubmitFlow] = useState(false);
     const [statsCd, setStatsCd] = useState<string>('');
     const [footerFromApi, setFooterFromApi] = useState<{ sewerBzmnWholPpltnCnt?: number; sewerBzmnDomplWholPpltnCnt?: number; sewerBzmnFrgnrWholPpltnCnt?: number; sewerBzmnArea?: number } | null>(null);
     const { confirm } = useConfirm();
@@ -190,8 +192,39 @@ const SeweragePenetrationRateInp = () => {
         }
     };
 
-    const SubmitExceptionFunc = () => {
-        
+    const SubmitExceptionFunc = async (submitInfo: StatisticsInputSubmitInfoFormData) => {
+        const userInfo = await getUserInfo();
+
+        const params: SubmitExceptionRequest = {
+            ...submitInfo,
+            sewerBzmnCd: searchValues?.bsnmCd ?? '',
+            ctpvNm: searchValues?.sido ?? '',
+            sggNm: searchValues?.gugun ?? '',
+            statsYr: searchValues?.year ?? '',
+            userId: userInfo.userUnqId,
+            statsCd: statsCd,
+        };
+
+        // if (isAdminInfo) {
+        //     params.superAdmin = 'superAdmin';
+        // }
+
+        try {
+            setIsLoading(true);
+
+            const response = await statisticsAPi.submitException(params);
+
+            if (response.status === 'success') {
+                await fetchSewerageSupplyRate(getSewerageSupplyRateParams(searchValues ?? {}), false);
+                alert('제출되었습니다.');
+            } else {
+                alert(response.message || '데이터 제출 중 오류가 발생했습니다.');
+            }
+        } catch {
+            alert('데이터 제출 중 오류가 발생했습니다.');
+        } finally {
+            setIsLoading(false);
+        }
     };
 
     const getLastYearDataFunc = async (values: SearchFormValues) => {
@@ -209,21 +242,33 @@ const SeweragePenetrationRateInp = () => {
         await fetchSewerageSupplyRate(getSewerageSupplyRateParams(values, { mode: 'PRE' }), true);
     };
 
-    const submitFunc = async () => {
-        const isError = rowData.filter((d) =>
-            hasVerificationErrors((d as GridRowWithVerification).verificationResult)
-        );
+    const submitFunc = async (isException: boolean) => {
+        if (!isException) {
+            const isError = rowData.filter((d) =>
+                hasVerificationErrors((d as GridRowWithVerification).verificationResult)
+            );
 
-        if (isError.length > 0) {
-            alert(`데이터에 오류가 있습니다.
-                수정 후 제출해주세요.`);
-            return;
-        }
-        if (await confirm('제출 하시겠습니까?')) {
-            setShowDailog(true);
+            if (isError.length > 0) {
+                alert(`데이터에 오류가 있습니다.
+                    수정 후 제출해주세요.`);
+                return;
+            }
+            if (await confirm('제출 하시겠습니까?')) {
+                setIsExceptionSubmitFlow(false);
+                setShowDailog(true);
+            }
+        } else {
+            if (await confirm('예외 제출 시 검증 결과에 오류가 있어도 제출 처리됩니다.')) {
+                setIsExceptionSubmitFlow(true);
+                setShowDailog(true);
+            }
         }
     };
 
+    const executeExceptionSubmit = async (submitInfo: StatisticsInputSubmitInfoFormData) => {
+        await SubmitExceptionFunc(submitInfo);
+    };
+
     const executeSubmit = async (submitInfo: StatisticsInputSubmitInfoFormData) => {
         try {
             setIsLoading(true);
@@ -457,7 +502,7 @@ const SeweragePenetrationRateInp = () => {
             if (await confirm('제출된 내용을 취소하시겠습니까?')) {
 
                 const userInfo = await getUserInfo();
-                
+
                 const requestData: cancelSubmitRequest = {
                     sewerBzmnCd: searchValues?.bsnmCd ?? '',
                     ctpvNm: searchValues?.sido ?? '',
@@ -503,11 +548,11 @@ const SeweragePenetrationRateInp = () => {
                             {showEnterableToolbarButtons && (
                                 <>
                                     {isAdminInfo && statusInfo && statusInfo.laeSbmsnSttsCd !== '0' && (
-                                        <SubmitExceptionButton SubmitExceptionFunc={SubmitExceptionFunc} />
+                                        <SubmitExceptionButton SubmitExceptionFunc={() => submitFunc(true)} />
                                     )}
                                     <LastYearDataButton getLastYearDataFunc={() => getLastYearDataFunc(searchValues ?? {})} />
-                                    <SubmitButton submitFunc={submitFunc} />
-                                    
+                                    <SubmitButton submitFunc={() => submitFunc(false)} />
+
                                 </>
                             )}
                             {statusInfo?.laeSbmsnSttsCd === '2' && <CancelSubmitButton cnacelSubmitFunc={cnacelSubmitFunc} />}
@@ -557,7 +602,18 @@ const SeweragePenetrationRateInp = () => {
                 />
             </div>
             <ConfirmDialog isOpen={false} />
-            <SubmitDailog open={showDailog} onOpenChange={setShowDailog} statusInfo={statusInfo} onConfirm={executeSubmit} isLoading={isLoading} />
+            <SubmitDailog
+                open={showDailog}
+                onOpenChange={(open) => {
+                    setShowDailog(open);
+                    if (!open) setIsExceptionSubmitFlow(false);
+                }}
+                statusInfo={statusInfo}
+                onConfirm={executeSubmit}
+                onExceptionConfirm={executeExceptionSubmit}
+                submitMode={isExceptionSubmitFlow ? 'exception' : 'normal'}
+                isLoading={isLoading}
+            />
         </>
     );
 };
diff --git a/apps/st/src/components/statistics/input/SubmitDailog.tsx b/apps/st/src/components/statistics/input/SubmitDailog.tsx
index d2de6ab14..65f2f9306 100644
--- a/apps/st/src/components/statistics/input/SubmitDailog.tsx
+++ b/apps/st/src/components/statistics/input/SubmitDailog.tsx
@@ -47,7 +47,10 @@ interface SubmitDialogProps {
     statusInfo: SewerageSupplyRateStatusInfo | null;
     /** 다이얼로그에서 저장 클릭 시 호출. 제출 정보를 넘기면 부모에서 requestData에 포함해 제출 API 호출 */
     onConfirm?: (data: StatisticsInputSubmitInfoFormData) => void | Promise<void>;
-    onExceptionConfirm?: (data: any) => void | Promise<void>;
+    /** 예외 제출로 다이얼로그를 연 경우: 일반 제출(onConfirm) 대신 호출 */
+    onExceptionConfirm?: (data: StatisticsInputSubmitInfoFormData) => void | Promise<void>;
+    /** 'normal': onConfirm / 'exception': onExceptionConfirm */
+    submitMode?: "normal" | "exception";
     isLoading?: boolean;
 }
 
@@ -75,7 +78,15 @@ function statusInfoToFormData(info: SewerageSupplyRateStatusInfo): StatisticsInp
     };
 };
 
-const SubmitDailog = ({ open, onOpenChange, statusInfo, onConfirm, onExceptionConfirm, isLoading }: SubmitDialogProps) => {
+const SubmitDailog = ({
+    open,
+    onOpenChange,
+    statusInfo,
+    onConfirm,
+    onExceptionConfirm,
+    submitMode = "normal",
+    isLoading,
+}: SubmitDialogProps) => {
     const { control, handleSubmit, reset, formState: { errors } } = useForm<StatisticsInputSubmitInfoFormData>({
         resolver: zodResolver(statisticsInputSubmitInfoSchema),
         defaultValues,
@@ -88,7 +99,11 @@ const SubmitDailog = ({ open, onOpenChange, statusInfo, onConfirm, onExceptionCo
     }, [open, statusInfo, reset]);
 
     async function onSubmit(data: StatisticsInputSubmitInfoFormData) {
-        await onConfirm?.(data);
+        if (submitMode === "exception") {
+            await onExceptionConfirm?.(data);
+        } else {
+            await onConfirm?.(data);
+        }
         onOpenChange(false);
         reset(defaultValues);
     }
@@ -164,7 +179,7 @@ const SubmitDailog = ({ open, onOpenChange, statusInfo, onConfirm, onExceptionCo
                             취소
                         </Button>
                         <Button type="submit" color="primary">
-                            제출
+                            {submitMode === 'normal' ? '제출' : '예외 제출'}
                         </Button>
                     </DialogFooter>
                 </form>
diff --git a/apps/st/src/components/statistics/management/LogHistory.tsx b/apps/st/src/components/statistics/management/LogHistory.tsx
index 2938343f8..07ae69d5d 100644
--- a/apps/st/src/components/statistics/management/LogHistory.tsx
+++ b/apps/st/src/components/statistics/management/LogHistory.tsx
@@ -1,112 +1,122 @@
 "use client";
 
-import { useState } from 'react';
-// import useSWR from 'swr';
+import { useCallback, useState } from "react";
 
-import {
-    Button,
-    // Input,
-    Label,
-    // Select,
-    // SelectTrigger,
-    // SelectContent,
-    // SelectItem,
-    // SelectValue
-}
-    from "@common/components";
-import DataGrid from '@/components/module/DataGrid';
-import { CodeSelect } from '@/entities/code';
+import { Button, Label, LoadingWithAnimation } from "@common/components";
+import DataGrid from "@/components/module/DataGrid";
+import { CodeSelectWithAll } from "@/entities/code";
 
-import { LogHistoryColumn } from '@/components/util/column/management/LogHistoryColumn';
-// import { LwpoCodeApi } from "@/entities/code";
+import { statisticsAPi } from "@/entities/statistics/api/statistics-service";
+import type { StatisticsLogRequest } from "@/entities/statistics/model/statistics-interface";
+import { toGridRows } from "@/components/util/grid/gridFunction";
 
-// const getStateCdListFetcher = async () => {
-//     return LwpoCodeApi.getLwpoCodeList({
-//         sort: 'regDt,desc',
-//         upCd: 'STITEM',
-//         page: 0,
-//         size: 100,
-//     });
-// }
+import { LogHistoryColumn } from "@/components/util/column/management/LogHistoryColumn";
+import { LogHistoryTablePagination } from "@/components/statistics/management/LogHistoryTablePagination";
+
+const PAGE_SIZE = 100;
 
 const LogHistory = () => {
     // const { setMessage: alert } = useAlertStore((state) => state);
-    const [statsCd, setStatsCd] = useState('');
+    const [statsCd, setStatsCd] = useState<string>("");
+    const [isLoading, setIsLoading] = useState<boolean>(false);
+    const [rowData, setRowData] = useState<Record<string, string | number>[]>(
+        [],
+    );
+    const [pageIndex, setPageIndex] = useState(0);
+    const [totalPages, setTotalPages] = useState(0);
 
-    // const { data: lwpoCdList } = useSWR(
-    //     "lwpo-code-list",
-    //     getStateCdListFetcher,
-    //     {
-    //         revalidateOnFocus: false,
-    //         revalidateOnReconnect: false,
-    //         revalidateIfStale: false,
-    //         dedupingInterval: 2000,
-    //         shouldRetryOnError: false,
-    //         onSuccess: (data) => {
-    //             if (!data.content || data.content.length == 0) {
-    //                 alert(`시도 목록을 불러오는데 실패했습니다.
-    //                     새로고침 후 다시 시도해주세요.`);
-    //             }
-    //         },
-    //         onError: () => {
-    //             alert(`시도 목록을 불러오는데 실패했습니다.
-    //                 새로고침 후 다시 시도해주세요.`);
-    //         },
-    //     }
-    // );
+    const loadLogs = useCallback(
+        async (page1Based: number) => {
+            const param: StatisticsLogRequest = {
+                statsCd: statsCd === "" || statsCd === "ALL" ? "" : statsCd,
+                page: page1Based,
+                size: PAGE_SIZE,
+            };
+
+            try {
+                setIsLoading(true);
+
+                const response = await statisticsAPi.getLogList(param);
+
+                if (response.status === "success") {
+                    setRowData(toGridRows(response.data?.statsLogList ?? []));
+                    setTotalPages(response.data?.pageInfo?.totalPages ?? 0);
+                    setPageIndex(Math.max(0, page1Based - 1));
+                } else {
+                    alert(
+                        response.message ||
+                            "데이터 조회 중 오류가 발생했습니다.",
+                    );
+                }
+            } catch {
+                alert("데이터 조회 중 오류가 발생했습니다.");
+            } finally {
+                setIsLoading(false);
+            }
+        },
+        [statsCd],
+    );
+
+    const handleSearch = async (e: React.SubmitEvent<HTMLFormElement>) => {
+        e.preventDefault();
+        await loadLogs(1);
+    };
 
     return (
         <div className="relative">
             <div className="card card-border">
-                <form>
+                <form onSubmit={handleSearch}>
                     <div className="flex items-center gap-8 p-2">
                         <div className="flex items-center gap-2">
-                            <Label className="text-label">
-                                통계항목
-                            </Label>
-                            {/* <Select value={lwpoCd} onValueChange={setLwpoCd}>
-                                <SelectTrigger className="w-[22rem]">
-                                    <SelectValue placeholder="전체"></SelectValue>
-                                </SelectTrigger>
-                                <SelectContent>
-                                    <SelectItem value="ALL">전체</SelectItem>
-                                    {lwpoCdList?.content?.map((l) => (
-                                        <SelectItem key={l.lwpoCd} value={l.lwpoCd}>
-                                            {l.lwpoCdNm}
-                                        </SelectItem>
-                                    ))}
-                                </SelectContent>
-                            </Select> */}
-                            <CodeSelect
+                            <Label className="text-label">통계항목</Label>
+                            <CodeSelectWithAll
                                 upCd="STITEM"
                                 value={statsCd}
                                 onValueChange={setStatsCd}
-                                placeholder="선택"
+                                placeholder="전체"
                                 className="w-[16rem]"
                             />
                         </div>
-                        <div className="flex items-center gap-2 ml-auto">
-                            <Button color="green" className="h-[3.2rem] w-[96px]" type="button">
+                        <div className="ml-auto flex items-center gap-2">
+                            <Button
+                                color="green"
+                                className="h-[3.2rem] w-[96px]"
+                                type="button"
+                            >
                                 초기화
                             </Button>
-                            <Button className="h-[3.2rem] w-[96px]" type="submit">
+                            <Button
+                                className="h-[3.2rem] w-[96px]"
+                                type="submit"
+                            >
                                 조회
                             </Button>
                         </div>
                     </div>
                 </form>
             </div>
-            <DataGrid 
+            {isLoading && (
+                <div className="[data-theme='black']:bg-transparent absolute inset-0 z-50 flex items-center justify-center rounded-lg p-10">
+                    <div className="relative size-[5rem]">
+                        <LoadingWithAnimation color="primary" />
+                    </div>
+                </div>
+            )}
+            <DataGrid
                 columnInfo={LogHistoryColumn}
-                // rowStartNum={1}
-                // fixedColumns={1}
                 isExcelImport={false}
-                // showHeaderCheckbox={true}
-                rowData={[]} 
-                setRowData={() => {}} 
+                rowData={rowData}
+                setRowData={() => {}}
+            />
+            <LogHistoryTablePagination
+                pageCount={totalPages}
+                pageIndex={pageIndex}
+                onPageIndexChange={(idx) => {
+                    void loadLogs(idx + 1);
+                }}
             />
         </div>
     );
 };
 
-export default LogHistory;
\ No newline at end of file
+export default LogHistory;
diff --git a/apps/st/src/components/statistics/management/LogHistoryTablePagination.tsx b/apps/st/src/components/statistics/management/LogHistoryTablePagination.tsx
new file mode 100644
index 000000000..88c589e01
--- /dev/null
+++ b/apps/st/src/components/statistics/management/LogHistoryTablePagination.tsx
@@ -0,0 +1,105 @@
+"use client";
+
+/**
+ * @common/components DataTable 내부 Pagination과 동일 마크업/클래스 (복제).
+ * 공용 패키지 수정 없이 LogHistory 전용으로 둠.
+ */
+import {
+    ChevronLeftIcon,
+    ChevronRightIcon,
+    DoubleArrowLeftIcon,
+    DoubleArrowRightIcon,
+} from "@radix-ui/react-icons";
+
+import { Button, cn } from "@common/components";
+
+export type LogHistoryTablePaginationProps = {
+    /** 총 페이지 수 (TanStack table.getPageCount()와 동일) */
+    pageCount: number;
+    /** 0부터 시작하는 현재 페이지 인덱스 */
+    pageIndex: number;
+    onPageIndexChange: (pageIndex: number) => void;
+};
+
+export function LogHistoryTablePagination({
+    pageCount,
+    pageIndex: currentPage,
+    onPageIndexChange,
+}: LogHistoryTablePaginationProps) {
+    const maxVisiblePages = 10;
+
+    let startPage = Math.max(0, currentPage - maxVisiblePages / 2);
+    const endPage = Math.min(pageCount, startPage + maxVisiblePages);
+
+    if (endPage - startPage < maxVisiblePages) {
+        startPage = Math.max(0, endPage - maxVisiblePages);
+    }
+
+    const pageNumbers = Array(endPage - startPage)
+        .fill(0)
+        .map((_, i) => startPage + i);
+
+    const canPrevious = currentPage > 0;
+    const canNext = pageCount > 0 && currentPage < pageCount - 1;
+
+    return (
+        <div className="mt-[24px] flex items-center justify-center space-x-2">
+            <Button
+                variant="ghost"
+                color="white"
+                className="hidden size-10 p-0 lg:flex"
+                onClick={() => onPageIndexChange(0)}
+                disabled={!canPrevious}
+            >
+                <span className="sr-only">첫 페이지로</span>
+                <DoubleArrowLeftIcon className="size-4" />
+            </Button>
+            <Button
+                variant="ghost"
+                color="white"
+                className="size-10 p-0"
+                onClick={() => onPageIndexChange(currentPage - 1)}
+                disabled={!canPrevious}
+            >
+                <span className="sr-only">이전 페이지로</span>
+                <ChevronLeftIcon className="size-4" />
+            </Button>
+            <div className="flex items-center justify-center text-sm font-medium">
+                {pageNumbers.map((pageNumber) => (
+                    <Button
+                        key={pageNumber}
+                        variant="ghost"
+                        className={cn(
+                            "inline-block h-10 min-w-10 !bg-transparent p-1 text-foreground hover:!bg-accent",
+                            currentPage === pageNumber &&
+                                "!bg-primary !font-bold !text-primary-foreground hover:!bg-primary",
+                        )}
+                        onClick={() => onPageIndexChange(pageNumber)}
+                    >
+                        {pageNumber + 1}
+                    </Button>
+                ))}
+            </div>
+            <Button
+                variant="ghost"
+                color="white"
+                className="size-10 p-0"
+                onClick={() => onPageIndexChange(currentPage + 1)}
+                disabled={!canNext}
+            >
+                <span className="sr-only">다음 페이지로</span>
+                <ChevronRightIcon className="size-4" />
+            </Button>
+            <Button
+                variant="ghost"
+                color="white"
+                className="hidden size-10 p-0 lg:flex"
+                onClick={() => onPageIndexChange(Math.max(0, pageCount - 1))}
+                disabled={!canNext}
+            >
+                <span className="sr-only">마지막 페이지로</span>
+                <DoubleArrowRightIcon className="size-4" />
+            </Button>
+        </div>
+    );
+}
diff --git a/apps/st/src/components/statistics/review/SewagePipeRvw.tsx b/apps/st/src/components/statistics/review/SewagePipeRvw.tsx
index 77d3a5d88..37073b2db 100644
--- a/apps/st/src/components/statistics/review/SewagePipeRvw.tsx
+++ b/apps/st/src/components/statistics/review/SewagePipeRvw.tsx
@@ -54,11 +54,11 @@ const SewagePipeRvw = () => {
         try {
             setIsLoading(true);
 
-        const searchParam: SewagePipeReviewRequestParams = {
-                statsYr: values.year,                
-                sewerBzmnCd: values.bsnmCd,        
-                ctpvNm: values.sido,                
-                sggNm: values.gugun === 'ALL' ? '' : values.gugun 
+            const searchParam: SewagePipeReviewRequestParams = {
+                statsYr: values.year,
+                sewerBzmnCd: values.bsnmCd,
+                ctpvNm: values.sido,
+                sggNm: values.gugun === 'ALL' ? '' : values.gugun
             };
 
             searchParamRef.current = searchParam;
@@ -69,7 +69,7 @@ const SewagePipeRvw = () => {
                 newRowDataMap.set('ST00020001', toGridRows(response.data as object[]));
                 setRowDataMap(newRowDataMap);
             } else {
-                alert(response?.message || "데이터가 없습니다.");
+                alert(response?.message || '데이터 조회 중 오류가 발생했습니다.');
             }
         } catch {
             alert('데이터 조회 중 오류가 발생했습니다.');
@@ -96,14 +96,14 @@ const SewagePipeRvw = () => {
 
                 if (tabKey === 'ST00020002') {
                     response = await statisticsManagementApi.getSewagePipeFacilityList(searchParamRef.current);
-                }else if(tabKey === 'ST00020003'){
-                     response = await statisticsManagementApi.getSewagePipeTypeList(searchParamRef.current);
-                }else if(tabKey === 'ST00020004'){
-                     response = await statisticsManagementApi.getSewagePipeDiamList(searchParamRef.current);
+                } else if (tabKey === 'ST00020003') {
+                    response = await statisticsManagementApi.getSewagePipeTypeList(searchParamRef.current);
+                } else if (tabKey === 'ST00020004') {
+                    response = await statisticsManagementApi.getSewagePipeDiamList(searchParamRef.current);
                 }
 
                 if (response?.status === 'success' && response.data) {
-                    
+
                     setRowDataMap(prev => {
                         const next = new Map(prev);
                         next.set(tabKey, toGridRows(response.data as object[]));
diff --git a/apps/st/src/components/statistics/review/StatsInputStatusRvw.tsx b/apps/st/src/components/statistics/review/StatsInputStatusRvw.tsx
index 8fdd74d4f..2b73f5160 100644
--- a/apps/st/src/components/statistics/review/StatsInputStatusRvw.tsx
+++ b/apps/st/src/components/statistics/review/StatsInputStatusRvw.tsx
@@ -1,5 +1,5 @@
 import { useState, useMemo } from "react";
-import { DataGrid } from "@rsone/components";
+import DataGrid from "@/components/module/DataGrid";
 import SearchForm from "@/components/module/SearchForm";
 import SaveButton from "@/components/button/SaveButton";
 import ApproveButton from "@/components/button/ApproveButton";
@@ -45,17 +45,17 @@ const StatsInputStatusRvw = () => {
             setIsLoading(true);
             
             const response = await statisticsManagementApi.getStatsInputStatusList({
-                sido: values.sido,
-                gugun: values.gugun === 'ALL' ? '' : values.gugun, 
-                yr: values.year, 
-                bsnmCd: values.bsnmCd
+                ctpvNm: values.sido,
+                sggNm: values.gugun === 'ALL' ? '' : values.gugun, 
+                statsYr: values.year, 
+                sewerBzmnCd: values.bsnmCd
             });
 
             if (response.status === 'success' && response.data) {
                 const rawList = response.data.sewerageSupplyRateList ?? [];
                 const convertedData: StatsInputStatusReviewItem[] = rawList.map((item: StatsInputStatusReviewItem) => ({
                     ...item,
-                    status: item.status || '미확인',
+                    // status: item.status || '미확인',
                 }));
 
                 setRowData(toGridRows(convertedData));
@@ -100,9 +100,10 @@ const StatsInputStatusRvw = () => {
 
             <DataGrid
                 columnInfo={columnInfo}
-                isExcelImport={false} 
+                isExcelImport={false}
+                showHeaderCheckbox={true} 
                 rowStartNum={2} 
-                fixedColumns={2}
+                fixedColumns={4}
                 rowData={rowData}
                 setRowData={setRowData}
             />
diff --git a/apps/st/src/components/statistics/verification/VerificationArticleManagement.tsx b/apps/st/src/components/statistics/verification/VerificationArticleManagement.tsx
index c91b520ce..99b8391ed 100644
--- a/apps/st/src/components/statistics/verification/VerificationArticleManagement.tsx
+++ b/apps/st/src/components/statistics/verification/VerificationArticleManagement.tsx
@@ -211,7 +211,7 @@ function VerificationArticleManagement() {
         setDialogOpen(true);
     }
 
-    function handleSubmit(e: React.FormEvent) {
+    function handleSubmit(e: React.SubmitEvent) {
         e.preventDefault();
         handleSearch();
     }
diff --git a/apps/st/src/components/type/DataGrid.type.ts b/apps/st/src/components/type/DataGrid.type.ts
index 9d9a0e310..9c724b94e 100644
--- a/apps/st/src/components/type/DataGrid.type.ts
+++ b/apps/st/src/components/type/DataGrid.type.ts
@@ -197,6 +197,12 @@ export type ColumnInfo = {
     columnLayout: ColumnLayoutItem[];
 };
 
+export type GridTopButtonConfig = {
+    visible?: boolean;
+    text: string;
+    onClick?: (helpers: { openDialog: (title?: string) => void; closeDialog: () => void }) => void;
+};
+
 export type ColumnInfoList = {
     tabKey: string; // 탭을 식별하는 고유 키 (필수), server(api)에 전송할 변수 값
     columns?: ColumnConfig[]; // 일반 그리드용 (isSplitGrid가 false일 때)
@@ -204,6 +210,7 @@ export type ColumnInfoList = {
     rowStartNum?: number;
     fixedColumns?: number;
     tabLabel?: string; // 탭에 표시될 레이블
+    topButton?: GridTopButtonConfig; // 탭 상단 커스텀 버튼
     isSplitGrid?: boolean; // 5:5 분리형 그리드 유무
     left?: ColumnInfoList; // SplitDataGrid용 왼쪽 그리드 정보
     right?: ColumnInfoList; // SplitDataGrid용 오른쪽 그리드 정보
@@ -250,6 +257,10 @@ export type DataGridProps = {
     idFieldName?: string;
     /** 전체 정렬 기능 on/off (기본값: false) */
     enableSort?: boolean;
+    /** CompactDataGrid 전용: true면 래퍼 너비 w-full (다이얼로그 등 분할 열 안에서 사용) */
+    compactFullWidth?: boolean;
+    /** CompactDataGrid 전용: 그리드 영역 높이 Tailwind 클래스 */
+    compactGridHeightClass?: string;
 };
 
 export type TabDataGridProps = {
@@ -274,6 +285,8 @@ export type TabDataGridProps = {
     };
     /** 전체 정렬 기능 on/off (기본값: false) */
     enableSort?: boolean;
+    /** 분할 탭 상단 시설 조회 다이얼로그용 — 상위 화면 검색의 통계연도(searchParam.statsYr) */
+    facilitySearchStatsYr?: string | null;
 };
 
 export type SplitDataGridProps = {
diff --git a/apps/st/src/components/util/column/input/sewagePipe/ConnectionStatusInpColumn.ts b/apps/st/src/components/util/column/input/sewagePipe/ConnectionStatusInpColumn.ts
index 03a3157da..8d99e6c9e 100644
--- a/apps/st/src/components/util/column/input/sewagePipe/ConnectionStatusInpColumn.ts
+++ b/apps/st/src/components/util/column/input/sewagePipe/ConnectionStatusInpColumn.ts
@@ -1,52 +1,68 @@
 import { ValueType } from "realgrid";
+import type { GridTopButtonConfig } from "@/components/type/DataGrid.type";
 
 // 하수도 통계 관리 > 02.하수관로 > tab 6. 시설별 현황관리
 // Tab 6-1: 행정구역별 연결 현황 (오른쪽 그리드)
 export const AdminAreaConnectionInpColumn = {
     columns: [
         // 행정구역
-        { name: 'sido', fieldName: '시도', header: { text: '시도' } },
-        { name: 'sgg', fieldName: '시군구', header: { text: '시군구' } },
-        { name: 'adstDong', fieldName: '행정구역명', header: { text: '행정구역명' } },
+        { name: 'ctpvNm', fieldName: 'ctpvNm', header: { text: '시도' }, editable: false },
+        { name: 'sggNm', fieldName: 'sggNm', header: { text: '시군구' }, editable: false },
+        { name: 'admdstNm', fieldName: 'admdstNm', header: { text: '행정구역명' }, editable: false },
         // 연결여부
-        { name: 'iscan', fieldName: '연결여부', header: { text: '연결여부' } },
+        { name: 'isConnection', fieldName: 'isConnection', header: { text: '연결여부' }, editable: false },
         // 연결하수처리장
-        { name: 'bscFctNm', fieldName: '연결하수처리장', header: { text: '연결하수처리장' } },
+        { name: 'connectionBscFctNmList', fieldName: 'connectionBscFctNmList', header: { text: '연결하수처리장' }, editable: false },
+        {
+            name: 'admdstCd',
+            fieldName: 'admdstCd',
+            header: { text: '행정구역코드' },
+            visible: false,
+            editable: false,
+        },
     ],
     columnLayout: [
         {
             name: 'adminArea',
             hideChildHeaders: false,
             header: { text: '행정구역' },
-            items: ['sido', 'sgg', 'adstDong'],
+            items: ['ctpvNm', 'sggNm', 'admdstNm'],
         },
-        'iscan',
-        'bscFctNm',
+        'isConnection',
+        'connectionBscFctNmList',
+        'admdstCd'
     ],
     rowStartNum: 2,
     fixedColumns: 1,
     tabKey: 'adminAreaConnectionInp',
-    tabLabel: '행정구역별 연결 현황'
+    tabLabel: '행정구역별 연결 현황',
+    topButton: {
+        visible: true,
+        text: '시설별 설치 현황 관리',
+        onClick: ({ openDialog }: Parameters<NonNullable<GridTopButtonConfig["onClick"]>>[0]) => {
+            openDialog('시설별 설치 현황 관리');
+        },
+    },
 };
 
 // Tab 6-2: 하수처리장별 연결 현황 (왼쪽 그리드)
 export const TreatPlantConnectionInpColumn = {
     columns: [
         // 하수처리장 정보
-        { name: 'bscFctNm', fieldName: '하수처리장명', header: { text: '하수처리장명' } },
-        { name: 'fctCpc', fieldName: '용량', header: { text: '용량' }, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'bscFctCd', fieldName: '하수처리장코드', header: { text: '하수처리장코드' } },
+        { name: 'bscFctNm', fieldName: 'bscFctNm', header: { text: '하수처리장명' }, editable: false },
+        { name: 'fctCpc', fieldName: 'fctCpc', header: { text: '용량' }, valueType: ValueType.NUMBER, dataFormat: '#,##0', editable: false },
+        { name: 'bscFctCd', fieldName: 'bscFctCd', header: { text: '하수처리장코드' }, editable: false },
         // 연결여부
-        { name: 'iscan', fieldName: '연결여부', header: { text: '연결여부' } },
+        { name: 'isConnection', fieldName: 'isConnection', header: { text: '연결여부' }, editable: false },
         // 연결지역
-        { name: 'nmlist', fieldName: '연결지역', header: { text: '연결지역' } },
+        { name: 'connectionAreaList', fieldName: 'connectionAreaList', header: { text: '연결지역' }, editable: false },
     ],
     columnLayout: [
         'bscFctNm',
         'fctCpc',
         'bscFctCd',
-        'iscan',
-        'nmlist',
+        'isConnection',
+        'connectionAreaList',
     ],
     rowStartNum: 1,
     fixedColumns: 1,
@@ -55,9 +71,9 @@ export const TreatPlantConnectionInpColumn = {
 };
 
 export const ConnectionStatusInpColumn = {
-    tabKey: 'treatmentPlantConnectionInp',
+    tabKey: 'ST00020006',
     tabLabel: '시설별 현황 관리',
     isSplitGrid: true,
-    left: AdminAreaConnectionInpColumn,
-    right: TreatPlantConnectionInpColumn,
+    left: TreatPlantConnectionInpColumn,
+    right: AdminAreaConnectionInpColumn,
 };
\ No newline at end of file
diff --git a/apps/st/src/components/util/column/input/sewagePipe/FactInstallStatusInpColumn.ts b/apps/st/src/components/util/column/input/sewagePipe/FactInstallStatusInpColumn.ts
index 213ceb818..549baf09a 100644
--- a/apps/st/src/components/util/column/input/sewagePipe/FactInstallStatusInpColumn.ts
+++ b/apps/st/src/components/util/column/input/sewagePipe/FactInstallStatusInpColumn.ts
@@ -2,86 +2,97 @@ import { footerInt, footerDecimal2, footerDecimal3 } from "@/components/util/gri
 import { ValueType } from "realgrid";
 
 // 하수도 통계 관리 > 02.하수관로 > tab 2. 시설별 설치현황
+// SeweragePipeInputFactInstallStatusItem + commonInfo.ctpvNm (그리드 행에 병합)
 
 export const FactInstallStatusInpColumn = {
     columns: [
-        // 행정구역
-        { name: 'sido', fieldName: '시도', header: { text: '시도' }, editable: false },
-        { name: 'sgg', fieldName: '시군구', header: { text: '시군구' }, editable: false },
+        // 행정구역 (ctpvNm은 commonInfo에서 주입)
+        { name: 'ctpvNm', fieldName: 'ctpvNm', header: { text: '시도' }, footer: { text: '합계' }, editable: false, styleName: 'rg-cell-readonly' },
+        { name: 'sggNm', fieldName: 'sggNm', header: { text: '시군구' }, editable: false, styleName: 'rg-cell-readonly' },
 
         // 하수처리장 정보
-        { name: 'bscFctNm', fieldName: '하수처리장명', header: { text: '하수처리장명' }, footer: { text: '합계' }, editable: false },
-        { name: 'fctCpc', fieldName: '하수처리시설용량(m³/일)', header: { text: '하수처리시설용량(m³/일)' }, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'swtrmtFcltNm', fieldName: 'swtrmtFcltNm', header: { text: '하수처리장명' }, footer: { text: '합계' }, editable: false },
+        { name: 'admdstNm', fieldName: 'admdstNm', header: { text: '행정구역명' }, editable: false, styleName: 'rg-cell-readonly' },
+        { name: 'prcsFcltCpct', fieldName: 'prcsFcltCpct', header: { text: '하수처리시설용량(m³/일)' }, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
 
         // 처리구역면적(km²)
-        { name: 'procZoneSm', fieldName: '합계', header: { text: '합계' }, footer: footerDecimal3, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.000' },
-        { name: 'cmbnProcZoneAr', fieldName: '합류식', header: { text: '합류식' }, footer: footerDecimal3, valueType: ValueType.NUMBER, dataFormat: '#,##0.000' },
-        { name: 'sprtProcZoneAr', fieldName: '분류식', header: { text: '분류식' }, footer: footerDecimal3, valueType: ValueType.NUMBER, dataFormat: '#,##0.000' },
+        { name: 'prcsZoneArea', fieldName: 'prcsZoneArea', header: { text: '합계' }, footer: footerDecimal3, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.000' },
+        { name: 'cbsysPrcsZoneArea', fieldName: 'cbsysPrcsZoneArea', header: { text: '합류식' }, footer: footerDecimal3, valueType: ValueType.NUMBER, dataFormat: '#,##0.000' },
+        { name: 'sprsysPrcsZoneArea', fieldName: 'sprsysPrcsZoneArea', header: { text: '분류식' }, footer: footerDecimal3, valueType: ValueType.NUMBER, dataFormat: '#,##0.000' },
 
         // 분류식화율
-        { name: 'sprtRt', fieldName: '분류식화율', header: { text: '분류식화율' }, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.0' },
+        { name: 'sprsysVartnRt', fieldName: 'sprsysVartnRt', header: { text: '분류식화율' }, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.0' },
 
         // 배수설비(개소)
-        { name: 'drngEqpSm', fieldName: '합계', header: { text: '합계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'cmbnDrngEqp', fieldName: '합류식', header: { text: '합류식' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'sprtDrngEqpSm', fieldName: '소계', header: { text: '소계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'sprtDrngEqpCnnc', fieldName: '연결', header: { text: '연결' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'sprtDrngEqpDcnnc', fieldName: '미연결', header: { text: '미연결' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'mltvEqpmCnt', fieldName: 'mltvEqpmCnt', header: { text: '합계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'cbsysMltvEqpmCnt', fieldName: 'cbsysMltvEqpmCnt', header: { text: '합류식' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'sprsysMltvEqpmCnt', fieldName: 'sprsysMltvEqpmCnt', header: { text: '소계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'sprsysMltvLnkgCnt', fieldName: 'sprsysMltvLnkgCnt', header: { text: '연결' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'sprsysMltvYetLnkgCnt', fieldName: 'sprsysMltvYetLnkgCnt', header: { text: '미연결' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
 
         // 하수관로 > 총시설연장
-        { name: 'piplFcltyExtn', fieldName: '총시설연장(m)', header: { text: '총시설연장(m)' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'wholFcltPrlg', fieldName: 'wholFcltPrlg', header: { text: '총시설연장(m)' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
 
         // 하수관로 > 차집/오수간선(m)
-        { name: 'icgMnnSm', fieldName: '합계', header: { text: '합계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'icgExtn', fieldName: '차집', header: { text: '차집' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'mnnExtn', fieldName: '오수 간선', header: { text: '오수 간선' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'wholIcptgAtlfcsPrlg', fieldName: 'wholIcptgAtlfcsPrlg', header: { text: '합계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'icptgPrlg', fieldName: 'icptgPrlg', header: { text: '차집' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'atlfcsPrlg', fieldName: 'atlfcsPrlg', header: { text: '오수 간선' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
 
         // 하수관로 > 토실/토구(개소) > 합류식
-        { name: 'cmbnSoilholeSite', fieldName: '우수토실', header: { text: '우수토실' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'cbsysStofcbrCnt', fieldName: 'cbsysStofcbrCnt', header: { text: '우수토실' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
 
         // 하수관로 > 토실/토구(개소) > 분류식
-        { name: 'sprtSoilholeSite', fieldName: '우수토실', header: { text: '우수토실' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'sprtSoilspllSite', fieldName: '우수토구', header: { text: '우수토구' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'sprsysStofcbrCnt', fieldName: 'sprsysStofcbrCnt', header: { text: '우수토실' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'sprsysExlnOtflCnt', fieldName: 'sprsysExlnOtflCnt', header: { text: '우수토구' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
 
         // 하수관로 > 지선(m)
-        { name: 'brnchlnSm', fieldName: '합계', header: { text: '합계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'cmbnBrnchlnExtn', fieldName: '합류식', header: { text: '합류식' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'wholBrchlnPrlg', fieldName: 'wholBrchlnPrlg', header: { text: '합계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'cbsysBrchlnPrlg', fieldName: 'cbsysBrchlnPrlg', header: { text: '합류식' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
 
-        // 하수관로 > 지선(m) > 분류식 
-        { name: 'rainwtrBrnchlnExtn', fieldName: '우수', header: { text: '우수' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'pltwtrBrnchlnExtn', fieldName: '오수', header: { text: '오수' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        // 하수관로 > 지선(m) > 분류식
+        { name: 'exlnBrchlnPrlg', fieldName: 'exlnBrchlnPrlg', header: { text: '우수' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
+        { name: 'drtwBrchlnPrlg', fieldName: 'drtwBrchlnPrlg', header: { text: '오수' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
 
         // 비고
-        { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
+        { name: 'rmrk', fieldName: 'rmrk', header: { text: '비고' } },
+
+        // 식별·키 필드 (API SeweragePipeInputFactInstallStatusItem, 그리드 비표시 — fixedColumns와 겹치지 않도록 맨 뒤)
+        { name: 'admdstCd', fieldName: 'admdstCd', header: { text: '행정구역코드' }, visible: false, editable: false, styleName: 'rg-cell-readonly' },
+        { name: 'prcsFcltSn', fieldName: 'prcsFcltSn', header: { text: '처리시설일련번호' }, visible: false, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
+        { name: 'swtrmtFcltCd', fieldName: 'swtrmtFcltCd', header: { text: '하수처리시설코드' }, visible: false, editable: false, styleName: 'rg-cell-readonly' },
     ],
     columnLayout: [
         {
             name: 'adminArea',
             hideChildHeaders: false,
             header: { text: '행정구역' },
-            items: ['sido', 'sgg'],
+            items: [
+                { column: 'ctpvNm', footerUserSpans: [{ colspan: 2 }] },
+                'sggNm',
+            ],
         },
-        'bscFctNm',
-        'fctCpc',
+        'swtrmtFcltNm',
+        'admdstNm',
+        'prcsFcltCpct',
         {
             name: 'procZone',
             hideChildHeaders: false,
             header: { text: '처리구역면적(km²)' },
-            items: ['procZoneSm', 'cmbnProcZoneAr', 'sprtProcZoneAr'],
+            items: ['prcsZoneArea', 'cbsysPrcsZoneArea', 'sprsysPrcsZoneArea'],
         },
-        'sprtRt',
+        'sprsysVartnRt',
         {
             name: 'drainEquip',
             hideChildHeaders: false,
             header: { text: '배수설비(개소)' },
             items: [
-                'drngEqpSm',
-                'cmbnDrngEqp',
+                'mltvEqpmCnt',
+                'cbsysMltvEqpmCnt',
                 {
                     name: 'sprtDrainEquip',
                     hideChildHeaders: false,
                     header: { text: '분류식' },
-                    items: ['sprtDrngEqpSm', 'sprtDrngEqpCnnc', 'sprtDrngEqpDcnnc'],
+                    items: ['sprsysMltvEqpmCnt', 'sprsysMltvLnkgCnt', 'sprsysMltvYetLnkgCnt'],
                 },
             ],
         },
@@ -90,12 +101,12 @@ export const FactInstallStatusInpColumn = {
             hideChildHeaders: false,
             header: { text: '하수관로' },
             items: [
-                'piplFcltyExtn',
+                'wholFcltPrlg',
                 {
                     name: 'interceptor',
                     hideChildHeaders: false,
                     header: { text: '차집/오수간선(m)' },
-                    items: ['icgMnnSm', 'icgExtn', 'mnnExtn'],
+                    items: ['wholIcptgAtlfcsPrlg', 'icptgPrlg', 'atlfcsPrlg'],
                 },
                 {
                     name: 'soilHole',
@@ -106,13 +117,13 @@ export const FactInstallStatusInpColumn = {
                             name: 'cmbnSoilHole',
                             hideChildHeaders: false,
                             header: { text: '합류식' },
-                            items: ['cmbnSoilholeSite'],
+                            items: ['cbsysStofcbrCnt'],
                         },
                         {
                             name: 'sprtSoilHole',
                             hideChildHeaders: false,
                             header: { text: '분류식' },
-                            items: ['sprtSoilholeSite', 'sprtSoilspllSite'],
+                            items: ['sprsysStofcbrCnt', 'sprsysExlnOtflCnt'],
                         },
                     ],
                 },
@@ -121,22 +132,25 @@ export const FactInstallStatusInpColumn = {
                     hideChildHeaders: false,
                     header: { text: '지선(m)' },
                     items: [
-                        'brnchlnSm',
-                        'cmbnBrnchlnExtn',
+                        'wholBrchlnPrlg',
+                        'cbsysBrchlnPrlg',
                         {
                             name: 'sprtBranchLine',
                             hideChildHeaders: false,
                             header: { text: '분류식' },
-                            items: ['rainwtrBrnchlnExtn', 'pltwtrBrnchlnExtn'],
+                            items: ['exlnBrchlnPrlg', 'drtwBrchlnPrlg'],
                         },
                     ],
                 },
             ],
         },
-        'rmk',
+        'rmrk',
+        'admdstCd',
+        'prcsFcltSn',
+        'swtrmtFcltCd',
     ],
     rowStartNum: 4,
     fixedColumns: 3,
-    tabKey: 'factInstallStatusInp',
+    tabKey: 'ST00020002',
     tabLabel: '시설별 설치현황'
-};
\ No newline at end of file
+};
diff --git a/apps/st/src/components/util/column/input/sewagePipe/ManholeStatusInpColumn.ts b/apps/st/src/components/util/column/input/sewagePipe/ManholeStatusInpColumn.ts
index 5732a82df..8fa0b8bbb 100644
--- a/apps/st/src/components/util/column/input/sewagePipe/ManholeStatusInpColumn.ts
+++ b/apps/st/src/components/util/column/input/sewagePipe/ManholeStatusInpColumn.ts
@@ -1,331 +1,158 @@
+import type { ColumnConfig, ColumnLayoutItem } from "@/components/type/DataGrid.type";
 import { footerInt } from "@/components/util/grid/footerSummary";
 import { ValueType } from "realgrid";
 
 // 하수도 통계 관리 > 02.하수관로 > tab 5. 맨홀 현황
+// SeweragePipeInputManholeStatusItem + commonInfo.ctpvNm (그리드 행에 병합)
+// API: yy14=2014년 … yy25=2025년 (필드 접두 yy + 연도 끝자리)
+
+const MANHOLE_YY_MIN = 14;
+const MANHOLE_YY_MAX = 25;
+const calendarYearFromYy = (yy: number) => 2000 + yy;
+
+const intCol = (name: string, headerText: string): ColumnConfig => ({
+    name,
+    fieldName: name,
+    header: { text: headerText },
+    footer: footerInt,
+    editable: false,
+    valueType: ValueType.NUMBER,
+    dataFormat: "#,##0",
+});
+
+function totalBlockColumns(): ColumnConfig[] {
+    return [
+        intCol("totalWholMnhlCnt", "계"),
+        intCol("totalStep1MnhlCnt", "주철"),
+        intCol("totalStep2MnhlCnt", "주철(조화)"),
+        intCol("totalStep3MnhlCnt", "콘크리트"),
+        intCol("totalStep4MnhlCnt", "기타"),
+        intCol("totalStep5MnhlCnt", "추락방지시설설치맨홀(개)"),
+    ];
+}
+
+function yyBlockColumns(yy: number): ColumnConfig[] {
+    const p = `yy${yy}`;
+    return [
+        intCol(`${p}WholMnhlCnt`, "계"),
+        intCol(`${p}Step1MnhlCnt`, "주철"),
+        intCol(`${p}Step2MnhlCnt`, "주철(조화)"),
+        intCol(`${p}Step3MnhlCnt`, "콘크리트"),
+        intCol(`${p}Step4MnhlCnt`, "기타"),
+        intCol(`${p}Step5MnhlCnt`, "추락방지시설설치맨홀(개)"),
+    ];
+}
+
+function yyYearLayout(yy: number): ColumnLayoutItem {
+    const y = calendarYearFromYy(yy);
+    const p = `yy${yy}`;
+    return {
+        name: `year${y}`,
+        hideChildHeaders: false,
+        header: { text: `${y}년` },
+        items: [
+            {
+                name: `year${y}Material`,
+                hideChildHeaders: false,
+                header: { text: "맨홀뚜껑 재질(개)" },
+                items: [
+                    `${p}WholMnhlCnt`,
+                    `${p}Step1MnhlCnt`,
+                    `${p}Step2MnhlCnt`,
+                    `${p}Step3MnhlCnt`,
+                    `${p}Step4MnhlCnt`,
+                ],
+            },
+            `${p}Step5MnhlCnt`,
+        ],
+    };
+}
+
+const yearLayoutItems: ColumnLayoutItem[] = [];
+for (let yy = MANHOLE_YY_MIN; yy <= MANHOLE_YY_MAX; yy++) {
+    yearLayoutItems.push(yyYearLayout(yy));
+}
 
 export const ManholeStatusInpColumn = {
     columns: [
-        // 행정구역
-        { name: 'a1', fieldName: '시도', header: { text: '시도' }, editable: false },
-        { name: 'a2', fieldName: '시군구', header: { text: '시군구' }, editable: false },
-
-        // 집중강우중점관리구역구분
-        { name: 'a3', fieldName: '집중강우중점관리구역구분', header: { text: '집중강우중점관리구역구분' }, editable: false, footer: { text: '합계' } },
-
-        // 연도별총계 > 맨홀뚜껑 재질(개)
-        { name: 'b1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'b2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'b3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'b4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'b5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 연도별총계 > 추락방지시설설치맨홀(개)
-        { name: 'b6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2015년 이전 > 맨홀뚜껑 재질(개)
-        { name: 'c1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'c2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'c3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'c4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'c5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2015년 이전 > 추락방지시설설치맨홀(개)
-        { name: 'c6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2015년 > 맨홀뚜껑 재질(개)
-        { name: 'd1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'd2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'd3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'd4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'd5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2015년 > 추락방지시설설치맨홀(개)
-        { name: 'd6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2016년 > 맨홀뚜껑 재질(개)
-        { name: 'e1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'e2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'e3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'e4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'e5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2016년 > 추락방지시설설치맨홀(개)
-        { name: 'e6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2017년 > 맨홀뚜껑 재질(개)
-        { name: 'f1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'f2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'f3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'f4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'f5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2017년 > 추락방지시설설치맨홀(개)
-        { name: 'f6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2018년 > 맨홀뚜껑 재질(개)
-        { name: 'g1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'g2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'g3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'g4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'g5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2018년 > 추락방지시설설치맨홀(개)
-        { name: 'g6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2019년 > 맨홀뚜껑 재질(개)
-        { name: 'h1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'h2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'h3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'h4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'h5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2019년 > 추락방지시설설치맨홀(개)
-        { name: 'h6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2020년 > 맨홀뚜껑 재질(개)
-        { name: 'i1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'i2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'i3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'i4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'i5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2020년 > 추락방지시설설치맨홀(개)
-        { name: 'i6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2021년 > 맨홀뚜껑 재질(개)
-        { name: 'j1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'j2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'j3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'j4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'j5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2021년 > 추락방지시설설치맨홀(개)
-        { name: 'j6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2022년 > 맨홀뚜껑 재질(개)
-        { name: 'k1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'k2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'k3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'k4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'k5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2022년 > 추락방지시설설치맨홀(개)
-        { name: 'k6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2023년 > 맨홀뚜껑 재질(개)
-        { name: 'l1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'l2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'l3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'l4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'l5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2023년 > 추락방지시설설치맨홀(개)
-        { name: 'l6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2024년 > 맨홀뚜껑 재질(개)
-        { name: 'm1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'm2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'm3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'm4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'm5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2024년 > 추락방지시설설치맨홀(개)
-        { name: 'm6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 2025년 > 맨홀뚜껑 재질(개)
-        { name: 'n1', fieldName: '계', header: { text: '계' }, footer: footerInt, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'n2', fieldName: '주철', header: { text: '주철' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'n3', fieldName: '주철(조화)', header: { text: '주철(조화)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'n4', fieldName: '콘크리트', header: { text: '콘크리트' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        { name: 'n5', fieldName: '기타', header: { text: '기타' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-        // 2025년 > 추락방지시설설치맨홀(개)
-        { name: 'n6', fieldName: '추락방지시설설치맨홀(개)', header: { text: '추락방지시설설치맨홀(개)' }, footer: footerInt, valueType: ValueType.NUMBER, dataFormat: '#,##0' },
-
-        // 비고
-        { name: 'z1', fieldName: '비고', header: { text: '비고' } },
-    ],
+        {
+            name: "ctpvNm",
+            fieldName: "ctpvNm",
+            header: { text: "시도" },
+            footer: { text: "합계" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "sggNm",
+            fieldName: "sggNm",
+            header: { text: "시군구" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "admdstNm",
+            fieldName: "admdstNm",
+            header: { text: "행정구역명" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "emphsMngSeNm",
+            fieldName: "emphsMngSeNm",
+            header: { text: "집중강우중점관리구역구분" },
+            footer: { text: "합계" },
+            editable: false,
+        },
+        ...totalBlockColumns(),
+        ...Array.from({ length: MANHOLE_YY_MAX - MANHOLE_YY_MIN + 1 }, (_, i) =>
+            yyBlockColumns(MANHOLE_YY_MIN + i)
+        ).flat(),
+        { name: "rmrk", fieldName: "rmrk", header: { text: "비고" } },
+        {
+            name: "admdstCd",
+            fieldName: "admdstCd",
+            header: { text: "행정구역코드" },
+            visible: false,
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+    ] as ColumnConfig[],
     columnLayout: [
         {
-            name: 'adminArea',
+            name: "adminArea",
             hideChildHeaders: false,
-            header: { text: '행정구역' },
-            items: ['a1', 'a2'],
+            header: { text: "행정구역" },
+            items: [{ column: "ctpvNm", footerUserSpans: [{ colspan: 2 }] }, "sggNm"],
         },
-        'a3',
+        "admdstNm",
+        "emphsMngSeNm",
         {
-            name: 'yearlyTotal',
+            name: "yearlyTotal",
             hideChildHeaders: false,
-            header: { text: '연도별총계' },
+            header: { text: "연도별총계" },
             items: [
                 {
-                    name: 'yearlyTotalMaterial',
+                    name: "yearlyTotalMaterial",
                     hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['b1', 'b2', 'b3', 'b4', 'b5'],
+                    header: { text: "맨홀뚜껑 재질(개)" },
+                    items: [
+                        "totalWholMnhlCnt",
+                        "totalStep1MnhlCnt",
+                        "totalStep2MnhlCnt",
+                        "totalStep3MnhlCnt",
+                        "totalStep4MnhlCnt",
+                    ],
                 },
-                'b6',
+                "totalStep5MnhlCnt",
             ],
         },
-        {
-            name: 'before2015',
-            hideChildHeaders: false,
-            header: { text: '2015년 이전' },
-            items: [
-                {
-                    name: 'before2015Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['c1', 'c2', 'c3', 'c4', 'c5'],
-                },
-                'c6',
-            ],
-        },
-        {
-            name: 'year2015',
-            hideChildHeaders: false,
-            header: { text: '2015년' },
-            items: [
-                {
-                    name: 'year2015Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['d1', 'd2', 'd3', 'd4', 'd5'],
-                },
-                'd6',
-            ],
-        },
-        {
-            name: 'year2016',
-            hideChildHeaders: false,
-            header: { text: '2016년' },
-            items: [
-                {
-                    name: 'year2016Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['e1', 'e2', 'e3', 'e4', 'e5'],
-                },
-                'e6',
-            ],
-        },
-        {
-            name: 'year2017',
-            hideChildHeaders: false,
-            header: { text: '2017년' },
-            items: [
-                {
-                    name: 'year2017Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['f1', 'f2', 'f3', 'f4', 'f5'],
-                },
-                'f6',
-            ],
-        },
-        {
-            name: 'year2018',
-            hideChildHeaders: false,
-            header: { text: '2018년' },
-            items: [
-                {
-                    name: 'year2018Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['g1', 'g2', 'g3', 'g4', 'g5'],
-                },
-                'g6',
-            ],
-        },
-        {
-            name: 'year2019',
-            hideChildHeaders: false,
-            header: { text: '2019년' },
-            items: [
-                {
-                    name: 'year2019Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['h1', 'h2', 'h3', 'h4', 'h5'],
-                },
-                'h6',
-            ],
-        },
-        {
-            name: 'year2020',
-            hideChildHeaders: false,
-            header: { text: '2020년' },
-            items: [
-                {
-                    name: 'year2020Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['i1', 'i2', 'i3', 'i4', 'i5'],
-                },
-                'i6',
-            ],
-        },
-        {
-            name: 'year2021',
-            hideChildHeaders: false,
-            header: { text: '2021년' },
-            items: [
-                {
-                    name: 'year2021Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['j1', 'j2', 'j3', 'j4', 'j5'],
-                },
-                'j6',
-            ],
-        },
-        {
-            name: 'year2022',
-            hideChildHeaders: false,
-            header: { text: '2022년' },
-            items: [
-                {
-                    name: 'year2022Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['k1', 'k2', 'k3', 'k4', 'k5'],
-                },
-                'k6',
-            ],
-        },
-        {
-            name: 'year2023',
-            hideChildHeaders: false,
-            header: { text: '2023년' },
-            items: [
-                {
-                    name: 'year2023Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['l1', 'l2', 'l3', 'l4', 'l5'],
-                },
-                'l6',
-            ],
-        },
-        {
-            name: 'year2024',
-            hideChildHeaders: false,
-            header: { text: '2024년' },
-            items: [
-                {
-                    name: 'year2024Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['m1', 'm2', 'm3', 'm4', 'm5'],
-                },
-                'm6',
-            ],
-        },
-        {
-            name: 'year2025',
-            hideChildHeaders: false,
-            header: { text: '2025년' },
-            items: [
-                {
-                    name: 'year2025Material',
-                    hideChildHeaders: false,
-                    header: { text: '맨홀뚜껑 재질(개)' },
-                    items: ['n1', 'n2', 'n3', 'n4', 'n5'],
-                },
-                'n6',
-            ],
-        },
-        'z1',
-    ],
+        ...yearLayoutItems,
+        "rmrk",
+        "admdstCd"
+    ] as ColumnLayoutItem[],
     rowStartNum: 3,
     fixedColumns: 2,
-    tabKey: 'manholeStatusInp',
-    tabLabel: '맨홀 현황'
-};
\ No newline at end of file
+    tabKey: "ST00020005",
+    tabLabel: "맨홀 현황",
+};
diff --git a/apps/st/src/components/util/column/input/sewagePipe/PipeDiameterStatusInpColumn.ts b/apps/st/src/components/util/column/input/sewagePipe/PipeDiameterStatusInpColumn.ts
index af009e292..a852f45f2 100644
--- a/apps/st/src/components/util/column/input/sewagePipe/PipeDiameterStatusInpColumn.ts
+++ b/apps/st/src/components/util/column/input/sewagePipe/PipeDiameterStatusInpColumn.ts
@@ -2,62 +2,151 @@ import { footerDecimal2 } from "@/components/util/grid/footerSummary";
 import { ValueType } from "realgrid";
 
 // 하수도 통계 관리 > 02.하수관로 > tab 4. 관경별 현황
+// SeweragePipeInputPipeDiameterStatusItem + commonInfo.ctpvNm (그리드 행에 병합)
 
 export const PipeDiameterStatusInpColumn = {
     columns: [
-        // 행정구역
-        { name: 'sido', fieldName: '시도', header: { text: '시도' }, editable: false },
-        { name: 'sgg', fieldName: '시군구', header: { text: '시군구' }, editable: false, footer: { text: '합계' } },
-
-        // 관종
-        { name: 'swrgPipeCd', fieldName: '관종', header: { text: '관종' }, editable: false },
-
-        // 총계(m) - 계산
-        { name: 'totalDiameter', fieldName: '총계(m)', header: { text: '총계(m)' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-        // 원형(m)
-        { name: 'under200', fieldName: '200mm 미만', header: { text: '200mm 미만' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'over200Undev300', fieldName: '200mm이상~300mm미만', header: { text: '200mm이상~300mm미만' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'over300Undev500', fieldName: '300mm이상~500mm미만', header: { text: '300mm이상~500mm미만' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'over500Undev500', fieldName: '500mm이상~800mm미만', header: { text: '500mm이상~800mm미만' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-        { name: 'over800', fieldName: '800이상mm', header: { text: '800이상mm' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-        // 사각형(m)
-        { name: 'box', fieldName: '사각형(m)', header: { text: '사각형(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-        // 기타(측구 개거 등)
-        { name: 'etc', fieldName: '기타(측구 개거 등)', header: { text: '기타(측구 개거 등)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-        // 비고
-        { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
+        {
+            name: "ctpvNm",
+            fieldName: "ctpvNm",
+            header: { text: "시도" },
+            footer: { text: "합계" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "sggNm",
+            fieldName: "sggNm",
+            header: { text: "시군구" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "pipeSeNm",
+            fieldName: "pipeSeNm",
+            header: { text: "관종" },
+            editable: false,
+        },
+        {
+            name: "admdstNm",
+            fieldName: "admdstNm",
+            header: { text: "행정구역명" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "pdmtByTsmWhol",
+            fieldName: "pdmtByTsmWhol",
+            header: { text: "총계(m)" },
+            footer: footerDecimal2,
+            editable: false,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "step1PdmtPrlg",
+            fieldName: "step1PdmtPrlg",
+            header: { text: "200mm 미만" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "step2PdmtPrlg",
+            fieldName: "step2PdmtPrlg",
+            header: { text: "200mm이상~300mm미만" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "step3PdmtPrlg",
+            fieldName: "step3PdmtPrlg",
+            header: { text: "300mm이상~500mm미만" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "step4PdmtPrlg",
+            fieldName: "step4PdmtPrlg",
+            header: { text: "500mm이상~800mm미만" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "step5PdmtPrlg",
+            fieldName: "step5PdmtPrlg",
+            header: { text: "800mm 이상" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "sqrePdmtPrlg",
+            fieldName: "sqrePdmtPrlg",
+            header: { text: "사각형(m)" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "etcPdmtPrlg",
+            fieldName: "etcPdmtPrlg",
+            header: { text: "기타(측구 개거 등)" },
+            footer: footerDecimal2,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        { name: "rmrk", fieldName: "rmrk", header: { text: "비고" } },
+        {
+            name: "admdstCd",
+            fieldName: "admdstCd",
+            header: { text: "행정구역코드" },
+            visible: false,
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "pipeSeCd",
+            fieldName: "pipeSeCd",
+            header: { text: "관종코드" },
+            visible: false,
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
     ],
     columnLayout: [
         {
-            name: 'adminArea',
+            name: "adminArea",
             hideChildHeaders: false,
-            header: { text: '행정구역' },
-            items: ['sido', 'sgg'],
+            header: { text: "행정구역" },
+            items: [{ column: "ctpvNm", footerUserSpans: [{ colspan: 2 }] }, "sggNm"],
         },
-        'swrgPipeCd',
-        'totalDiameter',
+        "pipeSeNm",
+        "admdstNm",
+        "pdmtByTsmWhol",
         {
-            name: 'circular',
+            name: "circular",
             hideChildHeaders: false,
-            header: { text: '원형(m)' },
+            header: { text: "원형(m)" },
             items: [
-                'under200',
-                'over200Undev300',
-                'over300Undev500',
-                'over500Undev500',
-                'over800',
+                "step1PdmtPrlg",
+                "step2PdmtPrlg",
+                "step3PdmtPrlg",
+                "step4PdmtPrlg",
+                "step5PdmtPrlg",
             ],
         },
-        'box',
-        'etc',
-        'rmk',
+        "sqrePdmtPrlg",
+        "etcPdmtPrlg",
+        "rmrk",
+        "admdstCd",
+        "pipeSeCd",
     ],
     rowStartNum: 2,
-    fixedColumns: 1,
-    tabKey: 'pipeDiameterStatusInp',
-    tabLabel: '관경별 현황'
-};
\ No newline at end of file
+    fixedColumns: 2,
+    tabKey: "ST00020004",
+    tabLabel: "관경별 현황",
+};
diff --git a/apps/st/src/components/util/column/input/sewagePipe/PipeTypeStatusInpColumn.ts b/apps/st/src/components/util/column/input/sewagePipe/PipeTypeStatusInpColumn.ts
index e1e33a3c8..9b61abe2a 100644
--- a/apps/st/src/components/util/column/input/sewagePipe/PipeTypeStatusInpColumn.ts
+++ b/apps/st/src/components/util/column/input/sewagePipe/PipeTypeStatusInpColumn.ts
@@ -1,377 +1,186 @@
+import type { ColumnConfig, ColumnLayoutItem } from "@/components/type/DataGrid.type";
 import { footerDecimal2 } from "@/components/util/grid/footerSummary";
 import { ValueType } from "realgrid";
 
 // 하수도 통계 관리 > 02.하수관로 > tab 3. 관종별 현황
+// SeweragePipeInputPipeTypeStatusItem + commonInfo.ctpvNm (그리드 행에 병합)
+//
+// 연도 그룹: yy1 = 1996년 이전, yy2 = 1996년 … API 상한 yy30(2024년)까지.
+// 표시 구간: 1996년 ~ (현재 연도 − 1) 까지. API 밖 연도는 yy 인덱스 상한으로 캡.
+
+const YY_API_MAX = 30;
+/** yy 인덱스 → 달력 연도 (yy2 → 1996) */
+const calendarYearForYyIndex = (yyIndex: number) => 1994 + yyIndex;
+
+/** 이 모듈이 로드될 때의 “데이터 기준 마지막 연도” (현재 연도 − 1) */
+const lastDataYear = new Date().getFullYear() - 1;
+
+const yyYearCols = (
+    n: number,
+    opts: { footer?: typeof footerDecimal2; visible?: boolean } = {}
+): ColumnConfig[] => {
+    const whol = `yy${n}PrlgWhol`;
+    const lyng = `yy${n}LyngPrlg`;
+    const dmltn = `yy${n}DmltnPrlg`;
+    const vis = opts.visible === false ? ({ visible: false } as const) : {};
+    return [
+        {
+            name: whol,
+            fieldName: whol,
+            header: { text: "계" },
+            ...(opts.footer !== undefined ? { footer: opts.footer } : {}),
+            editable: false,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+            ...vis,
+        },
+        {
+            name: lyng,
+            fieldName: lyng,
+            header: { text: "매설연장(m)" },
+            ...(opts.footer !== undefined ? { footer: opts.footer } : {}),
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+            ...vis,
+        },
+        {
+            name: dmltn,
+            fieldName: dmltn,
+            header: { text: "철거연장(m)" },
+            ...(opts.footer !== undefined ? { footer: opts.footer } : {}),
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+            ...vis,
+        },
+    ];
+};
+
+/** yy2(1996) ~ yyK 까지 표시. K는 API 상한 YY_API_MAX */
+const maxYyIndex =
+    lastDataYear < 1996 ? 1 : Math.min(YY_API_MAX, lastDataYear - 1994);
+
+const yearLayoutItems: ColumnLayoutItem[] = [];
+for (let yy = 2; yy <= maxYyIndex; yy++) {
+    const y = calendarYearForYyIndex(yy);
+    yearLayoutItems.push({
+        name: `year${y}`,
+        hideChildHeaders: false,
+        header: { text: `${y}년` },
+        items: [`yy${yy}PrlgWhol`, `yy${yy}LyngPrlg`, `yy${yy}DmltnPrlg`],
+    });
+}
 
 export const PipeTypeStatusInpColumn = {
     columns: [
-            // 행정구역
-            { name: 'sido', fieldName: '시도', header: { text: '시도' }, editable: false },
-            { name: 'sgg', fieldName: '시군구', header: { text: '시군구' }, editable: false },
-
-            // 관종
-            { name: 'swrgPipeCd', fieldName: '관종', header: { text: '관종' }, footer: { text: '합계' }, editable: false },
-
-            // 총계
-            { name: 'totalSum', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'totalLayingExtn', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'totalRemvlExtn', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 1996년 이전 (footer 없음)
-            { name: 'totalExtn22y', fieldName: '계', header: { text: '계' }, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn22y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn22y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 1996년 
-            { name: 'totalExtn01y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn01y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn01y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 1997년
-            { name: 'totalExtn02y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn02y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn02y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 1998년
-            { name: 'totalExtn03y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn03y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn03y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 1999년
-            { name: 'totalExtn04y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn04y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn04y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2000년
-            { name: 'totalExtn05y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn05y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn05y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2001년
-            { name: 'totalExtn06y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn06y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn06y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2002년
-            { name: 'totalExtn07y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn07y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn07y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2003년
-            { name: 'totalExtn08y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn08y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn08y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2004년
-            { name: 'totalExtn09y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn09y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn09y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2005년
-            { name: 'totalExtn10y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn10y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn10y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2006년
-            { name: 'totalExtn11y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn11y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn11y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2007년
-            { name: 'totalExtn12y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn12y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn12y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2008년
-            { name: 'totalExtn13y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn13y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn13y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2009년
-            { name: 'totalExtn14y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn14y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn14y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2010년
-            { name: 'totalExtn15y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn15y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn15y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2011년
-            { name: 'totalExtn16y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn16y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn16y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2012년
-            { name: 'totalExtn17y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn17y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn17y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2013년
-            { name: 'totalExtn18y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn18y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn18y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2014년
-            { name: 'totalExtn19y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn19y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn19y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2015년
-            { name: 'totalExtn20y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn20y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn20y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2016년
-            { name: 'totalExtn21y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn21y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn21y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2017년
-            { name: 'totalExtn23y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn23y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn23y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2018년
-            { name: 'totalExtn24y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn24y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn24y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2019년
-            { name: 'totalExtn25y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn25y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn25y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2020년
-            { name: 'totalExtn26y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn26y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn26y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2021년
-            { name: 'totalExtn27y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn27y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn27y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2022년
-            { name: 'totalExtn28y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn28y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn28y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2023년
-            { name: 'totalExtn29y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn29y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn29y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2024년
-            { name: 'totalExtn30y', fieldName: '계', header: { text: '계' }, footer: footerDecimal2, editable: false, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'layingExtn30y', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-            { name: 'remvlExtn30y', fieldName: '철거연장(m)', header: { text: '철거연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 2025년
-            { name: 'layingExtn', fieldName: '매설연장(m)', header: { text: '매설연장(m)' }, footer: footerDecimal2, valueType: ValueType.NUMBER, dataFormat: '#,##0.00' },
-
-            // 비고
-            { name: 'rmk', fieldName: '비고', header: { text: '비고' } },
-        ],
-        columnLayout: [
-            {
-                name: 'adminArea',
-                hideChildHeaders: false,
-                header: { text: '행정구역' },
-                items: ['sido', 'sgg'],
-            },
-            'swrgPipeCd',
-            {
-                name: 'totalGroup',
-                hideChildHeaders: false,
-                header: { text: '총계' },
-                items: ['totalSum', 'totalLayingExtn', 'totalRemvlExtn'],
-            },
-            {
-                name: 'year1996Before',
-                hideChildHeaders: false,
-                header: { text: '1996년 이전' },
-                items: ['totalExtn22y', 'layingExtn22y', 'remvlExtn22y'],
-            },
-            {
-                name: 'year1996',
-                hideChildHeaders: false,
-                header: { text: '1996년' },
-                items: ['totalExtn01y', 'layingExtn01y', 'remvlExtn01y'],
-            },
-            {
-                name: 'year1997',
-                hideChildHeaders: false,
-                header: { text: '1997년' },
-                items: ['totalExtn02y', 'layingExtn02y', 'remvlExtn02y'],
-            },
-            {
-                name: 'year1998',
-                hideChildHeaders: false,
-                header: { text: '1998년' },
-                items: ['totalExtn03y', 'layingExtn03y', 'remvlExtn03y'],
-            },
-            {
-                name: 'year1999',
-                hideChildHeaders: false,
-                header: { text: '1999년' },
-                items: ['totalExtn04y', 'layingExtn04y', 'remvlExtn04y'],
-            },
-            {
-                name: 'year2000',
-                hideChildHeaders: false,
-                header: { text: '2000년' },
-                items: ['totalExtn05y', 'layingExtn05y', 'remvlExtn05y'],
-            },
-            {
-                name: 'year2001',
-                hideChildHeaders: false,
-                header: { text: '2001년' },
-                items: ['totalExtn06y', 'layingExtn06y', 'remvlExtn06y'],
-            },
-            {
-                name: 'year2002',
-                hideChildHeaders: false,
-                header: { text: '2002년' },
-                items: ['totalExtn07y', 'layingExtn07y', 'remvlExtn07y'],
-            },
-            {
-                name: 'year2003',
-                hideChildHeaders: false,
-                header: { text: '2003년' },
-                items: ['totalExtn08y', 'layingExtn08y', 'remvlExtn08y'],
-            },
-            {
-                name: 'year2004',
-                hideChildHeaders: false,
-                header: { text: '2004년' },
-                items: ['totalExtn09y', 'layingExtn09y', 'remvlExtn09y'],
-            },
-            {
-                name: 'year2005',
-                hideChildHeaders: false,
-                header: { text: '2005년' },
-                items: ['totalExtn10y', 'layingExtn10y', 'remvlExtn10y'],
-            },
-            {
-                name: 'year2006',
-                hideChildHeaders: false,
-                header: { text: '2006년' },
-                items: ['totalExtn11y', 'layingExtn11y', 'remvlExtn11y'],
-            },
-            {
-                name: 'year2007',
-                hideChildHeaders: false,
-                header: { text: '2007년' },
-                items: ['totalExtn12y', 'layingExtn12y', 'remvlExtn12y'],
-            },
-            {
-                name: 'year2008',
-                hideChildHeaders: false,
-                header: { text: '2008년' },
-                items: ['totalExtn13y', 'layingExtn13y', 'remvlExtn13y'],
-            },
-            {
-                name: 'year2009',
-                hideChildHeaders: false,
-                header: { text: '2009년' },
-                items: ['totalExtn14y', 'layingExtn14y', 'remvlExtn14y'],
-            },
-            {
-                name: 'year2010',
-                hideChildHeaders: false,
-                header: { text: '2010년' },
-                items: ['totalExtn15y', 'layingExtn15y', 'remvlExtn15y'],
-            },
-            {
-                name: 'year2011',
-                hideChildHeaders: false,
-                header: { text: '2011년' },
-                items: ['totalExtn16y', 'layingExtn16y', 'remvlExtn16y'],
-            },
-            {
-                name: 'year2012',
-                hideChildHeaders: false,
-                header: { text: '2012년' },
-                items: ['totalExtn17y', 'layingExtn17y', 'remvlExtn17y'],
-            },
-            {
-                name: 'year2013',
-                hideChildHeaders: false,
-                header: { text: '2013년' },
-                items: ['totalExtn18y', 'layingExtn18y', 'remvlExtn18y'],
-            },
-            {
-                name: 'year2014',
-                hideChildHeaders: false,
-                header: { text: '2014년' },
-                items: ['totalExtn19y', 'layingExtn19y', 'remvlExtn19y'],
-            },
-            {
-                name: 'year2015',
-                hideChildHeaders: false,
-                header: { text: '2015년' },
-                items: ['totalExtn20y', 'layingExtn20y', 'remvlExtn20y'],
-            },
-            {
-                name: 'year2016',
-                hideChildHeaders: false,
-                header: { text: '2016년' },
-                items: ['totalExtn21y', 'layingExtn21y', 'remvlExtn21y'],
-            },
-            {
-                name: 'year2017',
-                hideChildHeaders: false,
-                header: { text: '2017년' },
-                items: ['totalExtn23y', 'layingExtn23y', 'remvlExtn23y'],
-            },
-            {
-                name: 'year2018',
-                hideChildHeaders: false,
-                header: { text: '2018년' },
-                items: ['totalExtn24y', 'layingExtn24y', 'remvlExtn24y'],
-            },
-            {
-                name: 'year2019',
-                hideChildHeaders: false,
-                header: { text: '2019년' },
-                items: ['totalExtn25y', 'layingExtn25y', 'remvlExtn25y'],
-            },
-            {
-                name: 'year2020',
-                hideChildHeaders: false,
-                header: { text: '2020년' },
-                items: ['totalExtn26y', 'layingExtn26y', 'remvlExtn26y'],
-            },
-            {
-                name: 'year2021',
-                hideChildHeaders: false,
-                header: { text: '2021년' },
-                items: ['totalExtn27y', 'layingExtn27y', 'remvlExtn27y'],
-            },
-            {
-                name: 'year2022',
-                hideChildHeaders: false,
-                header: { text: '2022년' },
-                items: ['totalExtn28y', 'layingExtn28y', 'remvlExtn28y'],
-            },
-            {
-                name: 'year2023',
-                hideChildHeaders: false,
-                header: { text: '2023년' },
-                items: ['totalExtn29y', 'layingExtn29y', 'remvlExtn29y'],
-            },
-            {
-                name: 'year2024',
-                hideChildHeaders: false,
-                header: { text: '2024년' },
-                items: ['totalExtn30y', 'layingExtn30y', 'remvlExtn30y'],
-            },
-            'layingExtn',
-            'rmk',
-        ],
-        rowStartNum: 2,
-        fixedColumns: 2,
-        tabKey: 'pipeTypeStatusInp',
-        tabLabel: '관종별 현황'
-    };
\ No newline at end of file
+        {
+            name: "ctpvNm",
+            fieldName: "ctpvNm",
+            header: { text: "시도" },
+            footer: { text: "합계" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "sggNm",
+            fieldName: "sggNm",
+            header: { text: "시군구" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "pipeSeNm",
+            fieldName: "pipeSeNm",
+            header: { text: "관종" },
+            footer: { text: "합계" },
+            editable: false,
+        },
+        {
+            name: "admdstNm",
+            fieldName: "admdstNm",
+            header: { text: "행정구역명" },
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "pipeByPrstWhol",
+            fieldName: "pipeByPrstWhol",
+            header: { text: "계" },
+            footer: footerDecimal2,
+            editable: false,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "lyngPrlg",
+            fieldName: "lyngPrlg",
+            header: { text: "매설연장(m)" },
+            footer: footerDecimal2,
+            editable: false,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        {
+            name: "dmltnPrlg",
+            fieldName: "dmltnPrlg",
+            header: { text: "철거연장(m)" },
+            footer: footerDecimal2,
+            editable: false,
+            valueType: ValueType.NUMBER,
+            dataFormat: "#,##0.00",
+        },
+        ...yyYearCols(1, {}),
+        ...Array.from({ length: YY_API_MAX - 1 }, (_, i) => {
+            const yy = i + 2;
+            return yyYearCols(yy, {
+                footer: footerDecimal2,
+                visible: yy <= maxYyIndex,
+            });
+        }).flat(),
+        { name: "rmrk", fieldName: "rmrk", header: { text: "비고" } },
+        {
+            name: "admdstCd",
+            fieldName: "admdstCd",
+            header: { text: "행정구역코드" },
+            visible: false,
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+        {
+            name: "pipeSeCd",
+            fieldName: "pipeSeCd",
+            header: { text: "관종코드" },
+            visible: false,
+            editable: false,
+            styleName: "rg-cell-readonly",
+        },
+    ] as ColumnConfig[],
+    columnLayout: [
+        {
+            name: "adminArea",
+            hideChildHeaders: false,
+            header: { text: "행정구역" },
+            items: [{ column: "ctpvNm", footerUserSpans: [{ colspan: 2 }] }, "sggNm"],
+        },
+        "pipeSeNm",
+        "admdstNm",
+        {
+            name: "totalGroup",
+            hideChildHeaders: false,
+            header: { text: "총계" },
+            items: ["pipeByPrstWhol", "lyngPrlg", "dmltnPrlg"],
+        },
+        {
+            name: "year1996Before",
+            hideChildHeaders: false,
+            header: { text: "1996년 이전" },
+            items: ["yy1PrlgWhol", "yy1LyngPrlg", "yy1DmltnPrlg"],
+        },
+        ...yearLayoutItems,
+        "rmrk",
+        'admdstCd',
+    ] as ColumnLayoutItem[],
+    rowStartNum: 2,
+    fixedColumns: 2,
+    tabKey: "ST00020003",
+    tabLabel: "관종별 현황",
+};
diff --git a/apps/st/src/components/util/column/input/sewagePipe/RegionalFactStatusInpColumn.ts b/apps/st/src/components/util/column/input/sewagePipe/RegionalFactStatusInpColumn.ts
index 50c16fe40..4ef03f741 100644
--- a/apps/st/src/components/util/column/input/sewagePipe/RegionalFactStatusInpColumn.ts
+++ b/apps/st/src/components/util/column/input/sewagePipe/RegionalFactStatusInpColumn.ts
@@ -63,6 +63,7 @@ export const RegionalFactStatusInpColumn = {
 
         // 비고
         { name: 'rmrk', fieldName: 'rmrk', header: { text: '비고' } },
+        { name: 'admdstCd', fieldName: 'admdstCd', header: { text: '행정코드' }, visible: false },
     ],
     columnLayout: [
         {
@@ -156,6 +157,7 @@ export const RegionalFactStatusInpColumn = {
         'sewerLdgrEdpPrlg',
         'sewerLdgrEdpRt',
         'rmrk',
+        'admdstCd',
     ],
     rowStartNum: 4,
     fixedColumns: 1,
diff --git a/apps/st/src/components/util/column/review/StatsInputStatusRvwColumn.ts b/apps/st/src/components/util/column/review/StatsInputStatusRvwColumn.ts
index 9f280338c..cb06da831 100644
--- a/apps/st/src/components/util/column/review/StatsInputStatusRvwColumn.ts
+++ b/apps/st/src/components/util/column/review/StatsInputStatusRvwColumn.ts
@@ -1,113 +1,33 @@
-import { ValueType } from "realgrid";
-
 /**
  * 하수도 통계 검토 00. 통계 입력 현황
  */
 const StatsInputStatusInfoColumnRaw = {
     columns: [
         // 기본 정보
-        { name: 'chk', fieldName: 'chk', header: { text: '체크' }, width: 40 },
-        { name: 'sido', fieldName: 'sido', header: { text: '시도' }, width: 80,mergeCells: true},
-        { name: 'gugun', fieldName: 'gugun', header: { text: '시군구' }, width: 100 },
-        { name: 'status', fieldName: 'status', header: { text: '진행상태' }, width: 120 },
+        { name: 'ctpvNm', fieldName: 'ctpvNm', header: { text: '시도' }, },
+        { name: 'sggNm', fieldName: 'sggNm', header: { text: '시군구' }, },
+        { name: 'sewerBzmnCd', fieldName: 'sewerBzmnCd', header: { text: '사업자코드' }, visible: false },
+        { name: 'statsCd', fieldName: 'statsCd', header: { text: '메뉴코드' }, visible: false },
+        { name: 'status', fieldName: 'status', header: { text: '진행상태' }, mergeCells: true },
+        { name: 'statsNm', fieldName: 'statsNm', header: { text: '구분' }, width: 220 },
 
-        // 01. 하수도보급율 (supply)
-        { name: 'supplyCharger', fieldName: 'supplyCharger', header: { text: '제출자' } },
-        { name: 'supplyCttpc', fieldName: 'supplyCttpc', header: { text: '연락처' } },
-        { name: 'supplyStatusNm', fieldName: 'supplyStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'supplyStatus', fieldName: 'supplyStatus', header: { text: '진행상태' } },
-        { name: 'supplyCnt', fieldName: 'supplyCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 02. 하수관로 (facility) - 기존 3번
-        { name: 'facilityCharger', fieldName: 'facilityCharger', header: { text: '제출자' } },
-        { name: 'facilityCttpc', fieldName: 'facilityCttpc', header: { text: '연락처' } },
-        { name: 'facilityStatusNm', fieldName: 'facilityStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'facilityStatus', fieldName: 'facilityStatus', header: { text: '진행상태' } },
-        { name: 'facilityCnt', fieldName: 'facilityCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 03. 하수관로유지관리 (pipe) - 기존 4번
-        { name: 'pipeCharger', fieldName: 'pipeCharger', header: { text: '제출자' } },
-        { name: 'pipeCttpc', fieldName: 'pipeCttpc', header: { text: '연락처' } },
-        { name: 'pipeStatusNm', fieldName: 'pipeStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'pipeCnt', fieldName: 'pipeCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 04. 하수저류시설 (storage) - 기존 5번
-        { name: 'storageCharger', fieldName: 'storageCharger', header: { text: '제출자' } },
-        { name: 'storageCttpc', fieldName: 'storageCttpc', header: { text: '연락처' } },
-        { name: 'storageStatusNm', fieldName: 'storageStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'storageCnt', fieldName: 'storageCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 05. 펌프장 (pump) - 기존 6번
-        { name: 'pumpCharger', fieldName: 'pumpCharger', header: { text: '제출자' } },
-        { name: 'pumpCttpc', fieldName: 'pumpCttpc', header: { text: '연락처' } },
-        { name: 'pumpStatusNm', fieldName: 'pumpStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'pumpCnt', fieldName: 'pumpCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 06. 공공하수처리시설 (treat) - 기존 7번
-        { name: 'treatCharger', fieldName: 'treatCharger', header: { text: '제출자' } },
-        { name: 'treatCttpc', fieldName: 'treatCttpc', header: { text: '연락처' } },
-        { name: 'treatStatusNm', fieldName: 'treatStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'treatCnt', fieldName: 'treatCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 07. 분뇨처리시설 (small) - 기존 8번
-        { name: 'smallCharger', fieldName: 'smallCharger', header: { text: '제출자' } },
-        { name: 'smallCttpc', fieldName: 'smallCttpc', header: { text: '연락처' } },
-        { name: 'smallStatusNm', fieldName: 'smallStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'smallCnt', fieldName: 'smallCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 08. 개인하수처리시설 (private) - 기존 9번
-        { name: 'privateCharger', fieldName: 'privateCharger', header: { text: '제출자' } },
-        { name: 'privateCttpc', fieldName: 'privateCttpc', header: { text: '연락처' } },
-        { name: 'privateStatusNm', fieldName: 'privateStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'privateCnt', fieldName: 'privateCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 09. 하수도재정 (finance) - 기존 10번
-        { name: 'financeCharger', fieldName: 'financeCharger', header: { text: '제출자' } },
-        { name: 'financeCttpc', fieldName: 'financeCttpc', header: { text: '연락처' } },
-        { name: 'financeStatusNm', fieldName: 'financeStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'financeCnt', fieldName: 'financeCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 10. 물재이용 (reuse) - 기존 11번
-        { name: 'reuseCharger', fieldName: 'reuseCharger', header: { text: '제출자' } },
-        { name: 'reuseCttpc', fieldName: 'reuseCttpc', header: { text: '연락처' } },
-        { name: 'reuseStatusNm', fieldName: 'reuseStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'reuseCnt', fieldName: 'reuseCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 11. 하수및분뇨찌꺼기 (sludge) - 기존 12번
-        { name: 'sludgeCharger', fieldName: 'sludgeCharger', header: { text: '제출자' } },
-        { name: 'sludgeCttpc', fieldName: 'sludgeCttpc', header: { text: '연락처' } },
-        { name: 'sludgeStatusNm', fieldName: 'sludgeStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'sludgeCnt', fieldName: 'sludgeCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 12. 하수및분뇨관련산업 (excreta) - 기존 13번
-        { name: 'excretaCharger', fieldName: 'excretaCharger', header: { text: '제출자' } },
-        { name: 'excretaCttpc', fieldName: 'excretaCttpc', header: { text: '연락처' } },
-        { name: 'excretaStatusNm', fieldName: 'excretaStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'excretaCnt', fieldName: 'excretaCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
-
-        // 13. 하수도서비스수준 (complaint) - 기존 15번
-        { name: 'complaintCharger', fieldName: 'complaintCharger', header: { text: '제출자' } },
-        { name: 'complaintCttpc', fieldName: 'complaintCttpc', header: { text: '연락처' } },
-        { name: 'complaintStatusNm', fieldName: 'complaintStatusNm', header: { text: '지자체진행상태' } },
-        { name: 'complaintCnt', fieldName: 'complaintCnt', header: { text: '건수' }, valueType: ValueType.NUMBER },
+        { name: 'chargerNm', fieldName: 'chargerNm', header: { text: '제출자' } },
+        { name: 'chargerCttpc', fieldName: 'chargerCttpc', header: { text: '연락처' } },
+        { name: 'statusNm', fieldName: 'statusNm', header: { text: '지자체진행상태' } },
+        { name: 'statusNm2', fieldName: 'statusNm2', header: { text: '진행상태' } },
     ],
 
     columnLayout: [
-        { name: 'addrGroup', header: { text: '구분' }, items: ['sido', 'gugun'] },
+        'ctpvNm', 
+        'sggNm',
+        'statsNm',
         'status',
-        { name: 'group01', header: { text: '01. 하수도보급율' }, items: ['supplyCharger', 'supplyCttpc', 'supplyStatusNm', 'supplyStatus', 'supplyCnt'] },
-        { name: 'group02', header: { text: '02. 하수관로' }, items: ['facilityCharger', 'facilityCttpc', 'facilityStatusNm', 'facilityStatus', 'facilityCnt'] },
-        { name: 'group03', header: { text: '03. 하수관로유지관리' }, items: ['pipeCharger', 'pipeCttpc', 'pipeStatusNm', 'pipeCnt'] },
-        { name: 'group04', header: { text: '04. 하수저류시설' }, items: ['storageCharger', 'storageCttpc', 'storageStatusNm', 'storageCnt'] },
-        { name: 'group05', header: { text: '05. 펌프장' }, items: ['pumpCharger', 'pumpCttpc', 'pumpStatusNm', 'pumpCnt'] },
-        { name: 'group06', header: { text: '06. 공공하수처리시설' }, items: ['treatCharger', 'treatCttpc', 'treatStatusNm', 'treatCnt'] },
-        { name: 'group07', header: { text: '07. 분뇨처리시설' }, items: ['smallCharger', 'smallCttpc', 'smallStatusNm', 'smallCnt'] },
-        { name: 'group08', header: { text: '08. 개인하수처리시설' }, items: ['privateCharger', 'privateCttpc', 'privateStatusNm', 'privateCnt'] },
-        { name: 'group09', header: { text: '09. 하수도재정' }, items: ['financeCharger', 'financeCttpc', 'financeStatusNm', 'financeCnt'] },
-        { name: 'group10', header: { text: '10. 물재이용' }, items: ['reuseCharger', 'reuseCttpc', 'reuseStatusNm', 'reuseCnt'] },
-        { name: 'group11', header: { text: '11. 하수및분뇨찌꺼기' }, items: ['sludgeCharger', 'sludgeCttpc', 'sludgeStatusNm', 'sludgeCnt'] },
-        { name: 'group12', header: { text: '12. 하수및분뇨관련산업' }, items: ['excretaCharger', 'excretaCttpc', 'excretaStatusNm', 'excretaCnt'] },
-        { name: 'group13', header: { text: '13. 하수도서비스수준' }, items: ['complaintCharger', 'complaintCttpc', 'complaintStatusNm', 'complaintCnt'] }
+        'chargerNm', 
+        'chargerCttpc', 
+        'statusNm',
+        'statusNm2', 
+        'statsCd',
+        'sewerBzmnCd',
     ]
 };
 
diff --git a/apps/st/src/entities/auth/api/login-service.ts b/apps/st/src/entities/auth/api/login-service.ts
index 7fd87cc27..1f7763f56 100644
--- a/apps/st/src/entities/auth/api/login-service.ts
+++ b/apps/st/src/entities/auth/api/login-service.ts
@@ -5,11 +5,11 @@ import {
   AUTH_USER_ID,
   CLAIM_NAME,
   ENDPOINT,
-  JWT_EXPIRATION_TIME,
 } from "@/shared/config";
 import { getCookie } from "@/shared/lib";
+import { getRemainingMs } from "@common/auth";
 
-import { tokenManager } from "../lib/token-manager";
+import { clearAuthToken, setToken, setupRefreshTimer } from "../lib/token-manager";
 import type { ILogin,LoginService } from "../model/login-interface";
 
 import { clearTabStorePersist } from "@/store/tab-store";
@@ -30,10 +30,8 @@ export class LoginApiService implements LoginService {
     try {
       const response = await fetch(`/api/proxy${ENDPOINT.USER_SERVICE.LOGIN}`, {
         method: "POST",
-        body: JSON.stringify({
-          userId: payload.userId,
-          password: payload.password,
-        }),
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify(payload),
       });
 
       const data = await response.json();
@@ -49,12 +47,16 @@ export class LoginApiService implements LoginService {
         clearTabStorePersist();
       }
 
-      tokenManager.setToken(CLAIM_NAME, accessToken);
-      tokenManager.setToken(AUTH_USER_ID, tokenId);
-      tokenManager.setupRefreshTimer(
-        () => this.silentRefresh(),
-        JWT_EXPIRATION_TIME,
-      );
+      setToken(CLAIM_NAME, accessToken);
+      setToken(AUTH_USER_ID, tokenId);
+
+      const remainingMs = getRemainingMs(accessToken);
+      if (remainingMs > 0) {
+        setupRefreshTimer(
+          () => this.silentRefresh(),
+          remainingMs,
+        );
+      }
     } catch (error) {
       if (error instanceof AxiosError) {
         throw new Error(`Login failed: ${error.response?.data?.message}`);
@@ -78,10 +80,18 @@ export class LoginApiService implements LoginService {
         throw new Error("Missing required authentication tokens");
       }
 
-      tokenManager.setToken(CLAIM_NAME, accessToken);
-      tokenManager.setToken(AUTH_USER_ID, tokenId);
+      setToken(CLAIM_NAME, accessToken);
+      setToken(AUTH_USER_ID, tokenId);
+
+      const remainingMs = getRemainingMs(accessToken);
+      if (remainingMs > 0) {
+        setupRefreshTimer(
+          () => this.silentRefresh(),
+          remainingMs,
+        );
+      }
     } catch (error) {
-      tokenManager.clearAuthToken();
+      clearAuthToken();
       if (error instanceof AxiosError) {
         throw new Error(
           `Silent refresh failed: ${error.response?.data?.message}`,
diff --git a/apps/st/src/entities/auth/index.ts b/apps/st/src/entities/auth/index.ts
index 97e142225..a505636b6 100644
--- a/apps/st/src/entities/auth/index.ts
+++ b/apps/st/src/entities/auth/index.ts
@@ -1,2 +1,3 @@
 export { LoginApi } from "./api/login-service";
 export { AuthWrapper } from "./lib/auth-wrapper";
+export { tokenManager } from "./lib/token-manager";
\ No newline at end of file
diff --git a/apps/st/src/entities/auth/lib/token-manager.ts b/apps/st/src/entities/auth/lib/token-manager.ts
index 60cd47de5..d449e711b 100644
--- a/apps/st/src/entities/auth/lib/token-manager.ts
+++ b/apps/st/src/entities/auth/lib/token-manager.ts
@@ -1,85 +1,15 @@
-import { AUTH_USER_ID, CLAIM_NAME } from "@/shared/config";
-import { getCookie, removeCookie,setCookie } from "@/shared/lib";
+import { authConfig } from "@/shared/config/auth";
+import { createTokenManager } from "@common/auth";
 
-import { clearTabStorePersist } from "@/store/tab-store";
+export const tokenManager = createTokenManager(authConfig);
 
-export class TokenManager {
-  private static instance: TokenManager;
-  private refreshTimer: NodeJS.Timeout | null = null;
-
-  private constructor() {}
-
-  public static getInstance(): TokenManager {
-    if (!TokenManager.instance) {
-      TokenManager.instance = new TokenManager();
-    }
-    return TokenManager.instance;
-  }
-
-  public getToken(key: string): string | undefined {
-    return getCookie(key);
-  }
-
-  public setToken(key: string, value: string): void {
-    const domain = this.getCookieDomain();
-    
-    setCookie(key, value, {
-      secure: window.location.protocol === "https:",
-      sameSite: "lax",
-      domain: domain,
-      path: "/", // 모든 경로에서 접근 가능
-    });
-  }
-
-  
-  private getCookieDomain(): string | undefined {
-    const hostname = window.location.hostname;
-    
-    // 개발 환경에서는 localhost 도메인 사용
-    if (hostname === "localhost" || hostname === "127.0.0.1") {
-      return undefined; // localhost에서는 도메인 설정하지 않음
-    }
-    
-    // 운영 환경에서는 서브도메인을 포함한 최상위 도메인 사용
-    if (hostname.includes("hasuon.or.kr")) {
-      return ".hasuon.or.kr";
-    }
-    
-    // 기타 환경에서는 현재 호스트명 사용
-    return hostname;
-  }
-
-  public removeToken(key: string): void {
-    const domain = this.getCookieDomain();
-    removeCookie(key, { domain, path: "/" });
-  }
-
-  public setupRefreshTimer(
-    callback: () => Promise<void>,
-    expirationTime: number,
-  ): void {
-    if (this.refreshTimer) {
-      clearTimeout(this.refreshTimer);
-    }
-
-    this.refreshTimer = setTimeout(() => {
-      callback().catch((error) => {
-        console.error("Silent refresh failed:", error);
-        this.clearAuthToken();
-      });
-    }, expirationTime - 60000);
-  }
-
-  public clearAuthToken(): void {
-    if (this.refreshTimer) {
-      clearTimeout(this.refreshTimer);
-      this.refreshTimer = null;
-    }
-
-    clearTabStorePersist();
-    this.removeToken(CLAIM_NAME);
-    this.removeToken(AUTH_USER_ID);
-  }
-}
-
-export const tokenManager = TokenManager.getInstance();
+export const {
+  getToken,
+  setToken,
+  removeToken,
+  setupRefreshTimer,
+  clearAuthToken,
+  getAccessToken,
+  getRefreshToken,
+  getUserId,
+} = tokenManager;
diff --git a/apps/st/src/entities/statistics/api/input/statistics-sewage-pipe-input-service.ts b/apps/st/src/entities/statistics/api/input/statistics-sewage-pipe-input-service.ts
new file mode 100644
index 000000000..af6aad7fb
--- /dev/null
+++ b/apps/st/src/entities/statistics/api/input/statistics-sewage-pipe-input-service.ts
@@ -0,0 +1,94 @@
+import { ENDPOINT } from "@/shared/config";
+import { stClient } from "@/shared/api/client";
+import type {
+    SeweragePipeFacilityAdminAreaListRequest,
+    SeweragePipeFacilityAdminAreaListResponse,
+    SeweragePipeFacilitiesListRequest,
+    SeweragePipeFacilitiesListResponse,
+    SeweragePipeInputConnectionStatusResponse,
+    SeweragePipeInputFactInstallResponse,
+    SeweragePipeInputManholeResponse,
+    SeweragePipeInputPipeDiameterResponse,
+    SeweragePipeInputPipeTypeResponse,
+    SeweragePipeInputRegionalFactStatusSaveRequest,
+    SeweragePipeInputRegionalFactStatusSaveApiResponse,
+    SeweragePipeInputRegionalResponse,
+    SeweragePipeRequestParams,
+    StatisticsInputSewPipeService,
+} from "../../model/input/statistics-sewage-pipe-input-interface";
+
+export class StatisticsInputSewPipeApiService implements StatisticsInputSewPipeService {
+    public async getRegionalFactStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputRegionalResponse> {
+        const response = await stClient.get<SeweragePipeInputRegionalResponse> (
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/regional-facility-status`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getFactInstallStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputFactInstallResponse> {
+        const response = await stClient.get<SeweragePipeInputFactInstallResponse> (
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/facility-install-status`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getPipeTypeStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputPipeTypeResponse> {
+        const response = await stClient.get<SeweragePipeInputPipeTypeResponse> (
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/pipe-type-status`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getPipeDiameterStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputPipeDiameterResponse> {
+        const response = await stClient.get<SeweragePipeInputPipeDiameterResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/pipe-diameter-status`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getManholeStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputManholeResponse> {
+        const response = await stClient.get<SeweragePipeInputManholeResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/manhole-status`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getConnectionStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputConnectionStatusResponse> {
+        const response = await stClient.get<SeweragePipeInputConnectionStatusResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/facility-connection-status`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getFacilitiesList(param: SeweragePipeFacilitiesListRequest): Promise<SeweragePipeFacilitiesListResponse> {
+        const response = await stClient.get<SeweragePipeFacilitiesListResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/facility-connection-status/popup/facilities`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async getFacilityAdminAreaList(param: SeweragePipeFacilityAdminAreaListRequest): Promise<SeweragePipeFacilityAdminAreaListResponse> {
+        const response = await stClient.get<SeweragePipeFacilityAdminAreaListResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/facility-connection-status/popup/areas`,
+            { params: param },
+        );
+        return response.data;
+    }
+
+    public async saveRegionalFactStatus(param: SeweragePipeInputRegionalFactStatusSaveRequest): Promise<SeweragePipeInputRegionalFactStatusSaveApiResponse> {
+        const response = await stClient.post<SeweragePipeInputRegionalFactStatusSaveApiResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUT}/sewage-pipe/regional-facility-status/save`,
+            param,
+        );
+        return response.data;
+    }
+};
+
+export const statisticsInputSewPipeApiService = new StatisticsInputSewPipeApiService();
\ No newline at end of file
diff --git a/apps/st/src/entities/statistics/api/statistics-management-service.ts b/apps/st/src/entities/statistics/api/statistics-management-service.ts
index 99f7ea552..8c688a2f0 100644
--- a/apps/st/src/entities/statistics/api/statistics-management-service.ts
+++ b/apps/st/src/entities/statistics/api/statistics-management-service.ts
@@ -36,7 +36,7 @@ export class StatisticsManagementApiService {
      * @param params (yr, bsnmCd, sido, gugun)
      */
     public async getStatsInputStatusList(
-        params: { yr?: string; bsnmCd?: string; sido?: string; gugun?: string }
+        params: { statsYr?: string; sewerBzmnCd?: string; ctpvNm?: string; sggNm?: string }
     ): Promise<StatsInputStatusReviewApiResponse> {
         const response = await stClient.get<StatsInputStatusReviewApiResponse>(
             `${ENDPOINT.ST_SERVICE.REVIEW}/input-status`,
diff --git a/apps/st/src/entities/statistics/api/statistics-service.ts b/apps/st/src/entities/statistics/api/statistics-service.ts
index 1f2b66bd8..42b5544e6 100644
--- a/apps/st/src/entities/statistics/api/statistics-service.ts
+++ b/apps/st/src/entities/statistics/api/statistics-service.ts
@@ -9,6 +9,10 @@ import {
     type cancelSubmitRequest,
     type cancelSubmitResponse,
     type ImrRequest,
+    type SubmitExceptionRequest,
+    type SubmitExceptionResponse,
+    type StatisticsLogRequest,
+    type StatisticsLogResponse,
 } from "../model/statistics-interface";
 
 export class StatisticsAPiService implements StatisticsService {
@@ -27,6 +31,14 @@ export class StatisticsAPiService implements StatisticsService {
         return response.data;
     }
 
+    public async getSggAllList(sidoName: string): Promise<ApiResponse<Sgg[]>> {
+        const response = await stClient.get<ApiResponse<Sgg[]>>(
+            `${ENDPOINT.ST_SERVICE.COMMON}/sgg-all`,
+            { params: { sidoName } },
+        );
+        return response.data;
+    }
+
     // 입력 - 제출 취소
     public async cancelSubmit(param: cancelSubmitRequest): Promise<cancelSubmitResponse> {
         const response = await stClient.put<cancelSubmitResponse>(
@@ -43,6 +55,23 @@ export class StatisticsAPiService implements StatisticsService {
         );
         return response.data;
     }
+
+    // 예외 제출
+    public async submitException(param: SubmitExceptionRequest): Promise<SubmitExceptionResponse> {
+        const response = await stClient.post<SubmitExceptionResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUTCOMMON}/submit-exception`,
+            param
+        );
+        return response.data;
+    }
+
+    public async getLogList(param: StatisticsLogRequest): Promise<StatisticsLogResponse> {
+        const response = await stClient.get<StatisticsLogResponse>(
+            `${ENDPOINT.ST_SERVICE.INPUTCOMMON}/logs`,
+            { params: param },
+        );
+        return response.data;
+    }
 }
 
 export const statisticsAPi = new StatisticsAPiService();
\ No newline at end of file
diff --git a/apps/st/src/entities/statistics/model/input/statistics-sewage-pipe-input-interface.ts b/apps/st/src/entities/statistics/model/input/statistics-sewage-pipe-input-interface.ts
new file mode 100644
index 000000000..79f9fd1db
--- /dev/null
+++ b/apps/st/src/entities/statistics/model/input/statistics-sewage-pipe-input-interface.ts
@@ -0,0 +1,523 @@
+import type { SewerageSupplyRateSaveApiResponse } from "./statistics-sewage-supply-rate-input-interface";
+
+export interface SeweragePipeRequestParams {
+    ctpvNm?: string;
+    sggNm?: string;
+    sewerBzmnCd?: string;
+    statsYr?: string;
+    mode?: string;
+}
+
+export interface SeweragePipeInputStatusInfo {
+    laePicNm: string | null;
+    laePicTelNo: string | null;
+    laeKbrdrDeptNm: string | null;
+    laeKbrdrJbgdNm: string | null;
+    laeIdfrNm: string | null;
+    laeIdfrTelNo: string | null;
+    laeIdfrDeptNm: string | null;
+    laeIdfrJbgdNm: string | null;
+    laeSbmsnSttsCd: string | null;
+    laeSbmsnYmd: string | null;
+}
+
+export interface VerifyResultItem {
+    vrfcCd: string;
+    rsnExpln: string;
+}
+
+/** 필드명 -> 검증 결과 배열 */
+export type SeweragePipeInputVerificationResult = Record<string, VerifyResultItem[]>;
+
+export interface SeweragePipeInputCommonInfo {
+    statsYr: string;
+    ctpvNm: string;
+    sewerBzmnCd: string;
+    statsCd: string;
+    verificationResult?: SeweragePipeInputVerificationResult;
+}
+
+export interface SeweragePipeInputRegionalFactStatusItem {
+    admdstCd: string;
+    sggNm: string;
+    admdstNm: string;
+    goalYr: string;
+
+    wholPplMtncPlanPrlg: number;
+    wholPlanPrlg: number;
+    wholFcltPrlg: number;
+    swagePplPsplyRt: number;
+
+    cbsysPplMtncPlanArea: number;
+    cbsysPplMtncPlanPrlg: number;
+    cbsysPlanPrlg: number;
+    cbsysFcltPrlg: number;
+    cbsysSqrePrlg: number;
+    cbsysCiclPrlg: number;
+    cbsysOpnPrlg: number;
+    cbsysGttrPrlg: number;
+
+    drtwPplMtncPlanArea: number;
+    drtwPplMtncPlanPrlg: number;
+    drtwPplPlanPrlg: number;
+    drtwPplFcltPrlg: number;
+    drtwPplSqrePrlg: number;
+    drtwPplCiclPrlg: number;
+
+    exlnPplMtncPlanArea: number;
+    exlnPplMtncPlanPrlg: number;
+    exlnPplPlanPrlg: number;
+    exlnPplFcltPrlg: number;
+    exlnPplSqrePrlg: number;
+    exlnPplCiclPrlg: number;
+    exlnPplOpnPrlg: number;
+    exlnPplGttrPrlg: number;
+
+    cbsysMnhlCnt: number;
+    sprsysDrtwMnhlCnt: number;
+    sprsysExlnMnhlCnt: number;
+
+    drtwRcvprpCnt: number;
+    exlnRcvprpCnt: number;
+
+    stofcbrCnt: number;
+    exlnOtflCnt: number;
+
+    sewerLdgrEdpPrlg: number;
+    sewerLdgrEdpRt: number;
+
+    rmrk: string | null;
+    verificationResult?: SeweragePipeInputVerificationResult;
+}
+
+export interface SeweragePipeInputRegionalResponseData {
+    statusInfo: SeweragePipeInputStatusInfo;
+    commonInfo: SeweragePipeInputCommonInfo;
+    regionalFactStatusList: SeweragePipeInputRegionalFactStatusItem[];
+}
+
+export interface SeweragePipeInputRegionalResponse {
+    status: string;
+    data: SeweragePipeInputRegionalResponseData;
+    message?: string;
+}
+
+/** 지역별 시설현황(Tab1) 저장 — saveList 행 (검증 결과 제외) */
+export type SeweragePipeInputRegionalFactStatusSaveItem = Omit<
+    SeweragePipeInputRegionalFactStatusItem,
+    "verificationResult"
+>;
+
+/** 지역별 시설현황 저장 API 요청 */
+export interface SeweragePipeInputRegionalFactStatusSaveRequest {
+    statsYr: string;
+    ctpvNm: string;
+    sggNm: string;
+    sewerBzmnCd: string;
+    userId: string;
+    superAdmin: string;
+    saveList: SeweragePipeInputRegionalFactStatusSaveItem[];
+}
+
+/** 지역별 시설현황 저장 API 응답 — 보급률 저장과 동일 래핑 */
+export type SeweragePipeInputRegionalFactStatusSaveApiResponse = SewerageSupplyRateSaveApiResponse;
+
+/** 시설별 설치 현황 — 목록 항목 */
+export interface SeweragePipeInputFactInstallStatusItem {
+    admdstCd: string;
+    sggNm: string;
+    admdstNm: string;
+    prcsFcltSn: number;
+    swtrmtFcltCd: string;
+    swtrmtFcltNm: string;
+    prcsFcltCpct: number;
+    prcsZoneArea: number;
+    cbsysPrcsZoneArea: number;
+    sprsysPrcsZoneArea: number;
+    sprsysVartnRt: number;
+    mltvEqpmCnt: number;
+    cbsysMltvEqpmCnt: number;
+    sprsysMltvEqpmCnt: number;
+    sprsysMltvLnkgCnt: number;
+    sprsysMltvYetLnkgCnt: number;
+    wholFcltPrlg: number;
+    wholIcptgAtlfcsPrlg: number;
+    icptgPrlg: number;
+    atlfcsPrlg: number;
+    cbsysStofcbrCnt: number;
+    sprsysStofcbrCnt: number;
+    sprsysExlnOtflCnt: number;
+    wholBrchlnPrlg: number;
+    cbsysBrchlnPrlg: number;
+    exlnBrchlnPrlg: number;
+    drtwBrchlnPrlg: number;
+    rmrk: string;
+    verificationResult?: SeweragePipeInputVerificationResult;
+}
+
+/** 시설별 설치 현황 — data 본문 */
+export interface SeweragePipeInputFactInstallResponseData {
+    statusInfo: SeweragePipeInputStatusInfo;
+    commonInfo: SeweragePipeInputCommonInfo;
+    factInstallStatusList: SeweragePipeInputFactInstallStatusItem[];
+}
+
+/** 시설별 설치 현황 — API 응답 */
+export interface SeweragePipeInputFactInstallResponse {
+    status: string;
+    data: SeweragePipeInputFactInstallResponseData;
+    message?: string;
+}
+
+/** 관종별 현황 — 목록 항목 */
+export interface SeweragePipeInputPipeTypeStatusItem {
+    admdstCd: string;
+    sggNm: string;
+    admdstNm: string;
+    pipeSeCd: string;
+    pipeSeNm: string;
+    pipeByPrstWhol: number;
+    lyngPrlg: number;
+    dmltnPrlg: number;
+    yy1PrlgWhol: number;
+    yy1LyngPrlg: number;
+    yy1DmltnPrlg: number;
+    yy2PrlgWhol: number;
+    yy2LyngPrlg: number;
+    yy2DmltnPrlg: number;
+    yy3PrlgWhol: number;
+    yy3LyngPrlg: number;
+    yy3DmltnPrlg: number;
+    yy4PrlgWhol: number;
+    yy4LyngPrlg: number;
+    yy4DmltnPrlg: number;
+    yy5PrlgWhol: number;
+    yy5LyngPrlg: number;
+    yy5DmltnPrlg: number;
+    yy6PrlgWhol: number;
+    yy6LyngPrlg: number;
+    yy6DmltnPrlg: number;
+    yy7PrlgWhol: number;
+    yy7LyngPrlg: number;
+    yy7DmltnPrlg: number;
+    yy8PrlgWhol: number;
+    yy8LyngPrlg: number;
+    yy8DmltnPrlg: number;
+    yy9PrlgWhol: number;
+    yy9LyngPrlg: number;
+    yy9DmltnPrlg: number;
+    yy10PrlgWhol: number;
+    yy10LyngPrlg: number;
+    yy10DmltnPrlg: number;
+    yy11PrlgWhol: number;
+    yy11LyngPrlg: number;
+    yy11DmltnPrlg: number;
+    yy12PrlgWhol: number;
+    yy12LyngPrlg: number;
+    yy12DmltnPrlg: number;
+    yy13PrlgWhol: number;
+    yy13LyngPrlg: number;
+    yy13DmltnPrlg: number;
+    yy14PrlgWhol: number;
+    yy14LyngPrlg: number;
+    yy14DmltnPrlg: number;
+    yy15PrlgWhol: number;
+    yy15LyngPrlg: number;
+    yy15DmltnPrlg: number;
+    yy16PrlgWhol: number;
+    yy16LyngPrlg: number;
+    yy16DmltnPrlg: number;
+    yy17PrlgWhol: number;
+    yy17LyngPrlg: number;
+    yy17DmltnPrlg: number;
+    yy18PrlgWhol: number;
+    yy18LyngPrlg: number;
+    yy18DmltnPrlg: number;
+    yy19PrlgWhol: number;
+    yy19LyngPrlg: number;
+    yy19DmltnPrlg: number;
+    yy20PrlgWhol: number;
+    yy20LyngPrlg: number;
+    yy20DmltnPrlg: number;
+    yy21PrlgWhol: number;
+    yy21LyngPrlg: number;
+    yy21DmltnPrlg: number;
+    yy22PrlgWhol: number;
+    yy22LyngPrlg: number;
+    yy22DmltnPrlg: number;
+    yy23PrlgWhol: number;
+    yy23LyngPrlg: number;
+    yy23DmltnPrlg: number;
+    yy24PrlgWhol: number;
+    yy24LyngPrlg: number;
+    yy24DmltnPrlg: number;
+    yy25PrlgWhol: number;
+    yy25LyngPrlg: number;
+    yy25DmltnPrlg: number;
+    yy26PrlgWhol: number;
+    yy26LyngPrlg: number;
+    yy26DmltnPrlg: number;
+    yy27PrlgWhol: number;
+    yy27LyngPrlg: number;
+    yy27DmltnPrlg: number;
+    yy28PrlgWhol: number;
+    yy28LyngPrlg: number;
+    yy28DmltnPrlg: number;
+    yy29PrlgWhol: number;
+    yy29LyngPrlg: number;
+    yy29DmltnPrlg: number;
+    yy30PrlgWhol: number;
+    yy30LyngPrlg: number;
+    yy30DmltnPrlg: number;
+    rmrk: string;
+    verificationResult?: SeweragePipeInputVerificationResult;
+}
+
+/** 관종별 현황 — data 본문 */
+export interface SeweragePipeInputPipeTypeResponseData {
+    statusInfo: SeweragePipeInputStatusInfo;
+    commonInfo: SeweragePipeInputCommonInfo;
+    pipeTypeStatusList: SeweragePipeInputPipeTypeStatusItem[];
+}
+
+/** 관종별 현황 — API 응답 */
+export interface SeweragePipeInputPipeTypeResponse {
+    status: string;
+    data: SeweragePipeInputPipeTypeResponseData;
+    message?: string;
+}
+
+/** 관경별 현황 — 목록 항목 */
+export interface SeweragePipeInputPipeDiameterStatusItem {
+    admdstCd: string;
+    sggNm: string;
+    admdstNm: string;
+    pipeSeCd: string;
+    pipeSeNm: string;
+    pdmtByTsmWhol: number;
+    step1PdmtPrlg: number;
+    step2PdmtPrlg: number;
+    step3PdmtPrlg: number;
+    step4PdmtPrlg: number;
+    step5PdmtPrlg: number;
+    sqrePdmtPrlg: number;
+    etcPdmtPrlg: number;
+    rmrk: string;
+    verificationResult?: SeweragePipeInputVerificationResult;
+}
+
+/** 관경별 현황 — data 본문 */
+export interface SeweragePipeInputPipeDiameterResponseData {
+    statusInfo: SeweragePipeInputStatusInfo;
+    commonInfo: SeweragePipeInputCommonInfo;
+    pipeDiameterStatusList: SeweragePipeInputPipeDiameterStatusItem[];
+}
+
+/** 관경별 현황 — API 응답 */
+export interface SeweragePipeInputPipeDiameterResponse {
+    status: string;
+    data: SeweragePipeInputPipeDiameterResponseData;
+    message?: string;
+}
+
+/** 맨홀 현황 — 목록 항목 (yy14=2014년 … yy25=2025년) */
+export interface SeweragePipeInputManholeStatusItem {
+    sggNm: string;
+    admdstCd: string;
+    admdstNm: string;
+    emphsMngSeNm: string;
+    totalWholMnhlCnt: number;
+    totalStep1MnhlCnt: number;
+    totalStep2MnhlCnt: number;
+    totalStep3MnhlCnt: number;
+    totalStep4MnhlCnt: number;
+    totalStep5MnhlCnt: number;
+    yy14WholMnhlCnt: number;
+    yy14Step1MnhlCnt: number;
+    yy14Step2MnhlCnt: number;
+    yy14Step3MnhlCnt: number;
+    yy14Step4MnhlCnt: number;
+    yy14Step5MnhlCnt: number;
+    yy15WholMnhlCnt: number;
+    yy15Step1MnhlCnt: number;
+    yy15Step2MnhlCnt: number;
+    yy15Step3MnhlCnt: number;
+    yy15Step4MnhlCnt: number;
+    yy15Step5MnhlCnt: number;
+    yy16WholMnhlCnt: number;
+    yy16Step1MnhlCnt: number;
+    yy16Step2MnhlCnt: number;
+    yy16Step3MnhlCnt: number;
+    yy16Step4MnhlCnt: number;
+    yy16Step5MnhlCnt: number;
+    yy17WholMnhlCnt: number;
+    yy17Step1MnhlCnt: number;
+    yy17Step2MnhlCnt: number;
+    yy17Step3MnhlCnt: number;
+    yy17Step4MnhlCnt: number;
+    yy17Step5MnhlCnt: number;
+    yy18WholMnhlCnt: number;
+    yy18Step1MnhlCnt: number;
+    yy18Step2MnhlCnt: number;
+    yy18Step3MnhlCnt: number;
+    yy18Step4MnhlCnt: number;
+    yy18Step5MnhlCnt: number;
+    yy19WholMnhlCnt: number;
+    yy19Step1MnhlCnt: number;
+    yy19Step2MnhlCnt: number;
+    yy19Step3MnhlCnt: number;
+    yy19Step4MnhlCnt: number;
+    yy19Step5MnhlCnt: number;
+    yy20WholMnhlCnt: number;
+    yy20Step1MnhlCnt: number;
+    yy20Step2MnhlCnt: number;
+    yy20Step3MnhlCnt: number;
+    yy20Step4MnhlCnt: number;
+    yy20Step5MnhlCnt: number;
+    yy21WholMnhlCnt: number;
+    yy21Step1MnhlCnt: number;
+    yy21Step2MnhlCnt: number;
+    yy21Step3MnhlCnt: number;
+    yy21Step4MnhlCnt: number;
+    yy21Step5MnhlCnt: number;
+    yy22WholMnhlCnt: number;
+    yy22Step1MnhlCnt: number;
+    yy22Step2MnhlCnt: number;
+    yy22Step3MnhlCnt: number;
+    yy22Step4MnhlCnt: number;
+    yy22Step5MnhlCnt: number;
+    yy23WholMnhlCnt: number;
+    yy23Step1MnhlCnt: number;
+    yy23Step2MnhlCnt: number;
+    yy23Step3MnhlCnt: number;
+    yy23Step4MnhlCnt: number;
+    yy23Step5MnhlCnt: number;
+    yy24WholMnhlCnt: number;
+    yy24Step1MnhlCnt: number;
+    yy24Step2MnhlCnt: number;
+    yy24Step3MnhlCnt: number;
+    yy24Step4MnhlCnt: number;
+    yy24Step5MnhlCnt: number;
+    yy25WholMnhlCnt: number;
+    yy25Step1MnhlCnt: number;
+    yy25Step2MnhlCnt: number;
+    yy25Step3MnhlCnt: number;
+    yy25Step4MnhlCnt: number;
+    yy25Step5MnhlCnt: number;
+    rmrk: string;
+    verificationResult?: SeweragePipeInputVerificationResult;
+}
+
+/** 맨홀 현황 — data 본문 */
+export interface SeweragePipeInputManholeResponseData {
+    statusInfo: SeweragePipeInputStatusInfo;
+    commonInfo: SeweragePipeInputCommonInfo;
+    manholeStatusList: SeweragePipeInputManholeStatusItem[];
+}
+
+/** 맨홀 현황 — API 응답 */
+export interface SeweragePipeInputManholeResponse {
+    status: string;
+    data: SeweragePipeInputManholeResponseData;
+    message?: string;
+}
+
+/** 시설별 현황 관리 - 하수처리장별 연결 현황 목록 항목 */
+export interface SeweragePipeInputFacilityConnectionItem {
+    bscFctNm: string;
+    fctCpc: number;
+    bscFctCd: string;
+    isConnection: string;
+    connectionAreaList: string;
+}
+
+/** 시설별 현황 관리 - 행정구역별 연결 현황 목록 항목 */
+export interface SeweragePipeInputAdminAreaConnectionItem {
+    ctpvNm: string;
+    sggNm: string;
+    admdstNm: string;
+    admdstCd: string;
+    isConnection: string;
+    connectionBscFctNmList: string;
+}
+
+/** 시설별 현황 관리 — data 본문 */
+export interface SeweragePipeInputConnectionStatusResponseData {
+    statusInfo: SeweragePipeInputStatusInfo;
+    commonInfo: SeweragePipeInputCommonInfo;
+    facilityConnectionList: SeweragePipeInputFacilityConnectionItem[];
+    adminAreaConnectionList: SeweragePipeInputAdminAreaConnectionItem[];
+}
+
+/** 시설별 현황 관리 — API 응답 */
+export interface SeweragePipeInputConnectionStatusResponse {
+    status: string;
+    data: SeweragePipeInputConnectionStatusResponseData;
+    message?: string;
+}
+
+/** facilitiesList 요청 — statsYr 필수, 나머지 선택 */
+export interface SeweragePipeFacilitiesListRequest {
+    statsYr: string;
+    sewerBzmnCd?: string;
+    ctpvNm?: string;
+    sggNm?: string;
+    fcltyNm?: string;
+}
+
+/** facilitiesList 응답 — 목록 항목 */
+export interface SeweragePipeFacilitiesListItem {
+    statsYr: string;
+    ctpvNm: string;
+    sggNm: string;
+    admdstCd: string;
+    bscFctNm: string;
+    fctCpc: number;
+    bscFctCd: string;
+}
+
+/** facilitiesList API 응답 */
+export interface SeweragePipeFacilitiesListResponse {
+    status: string;
+    data: SeweragePipeFacilitiesListItem[];
+    message?: string;
+}
+
+/** 처리시설 선택 후 행정구역(연결) 목록 조회 요청 */
+export interface SeweragePipeFacilityAdminAreaListRequest {
+    statsYr: string;
+    swtrmtFcltCd: string;
+    sewerBzmnCd: string;
+    ctpvNm: string;
+    sggNm: string;
+}
+
+/** 처리시설별 행정구역 목록 항목 */
+export interface SeweragePipeFacilityAdminAreaItem {
+    ctpvNm: string;
+    sggNm: string;
+    admdstNm: string;
+    admdstCd: string;
+    isConnection: string;
+}
+
+/** 처리시설별 행정구역 목록 API 응답 */
+export interface SeweragePipeFacilityAdminAreaListResponse {
+    status: string;
+    data: SeweragePipeFacilityAdminAreaItem[];
+    message?: string;
+}
+
+export interface StatisticsInputSewPipeService {
+    getRegionalFactStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputRegionalResponse>;
+    getFactInstallStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputFactInstallResponse>;
+    getPipeTypeStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputPipeTypeResponse>;
+    getPipeDiameterStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputPipeDiameterResponse>;
+    getManholeStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputManholeResponse>;
+    getConnectionStatus(param: SeweragePipeRequestParams): Promise<SeweragePipeInputConnectionStatusResponse>;
+    getFacilitiesList(param: SeweragePipeFacilitiesListRequest): Promise<SeweragePipeFacilitiesListResponse>;
+    getFacilityAdminAreaList(param: SeweragePipeFacilityAdminAreaListRequest): Promise<SeweragePipeFacilityAdminAreaListResponse>;
+    saveRegionalFactStatus(
+        param: SeweragePipeInputRegionalFactStatusSaveRequest,
+    ): Promise<SeweragePipeInputRegionalFactStatusSaveApiResponse>;
+}
\ No newline at end of file
diff --git a/apps/st/src/entities/statistics/model/statistics-input-review-interface.ts b/apps/st/src/entities/statistics/model/statistics-input-review-interface.ts
index ff86a8799..e2515fccb 100644
--- a/apps/st/src/entities/statistics/model/statistics-input-review-interface.ts
+++ b/apps/st/src/entities/statistics/model/statistics-input-review-interface.ts
@@ -4,92 +4,16 @@ import type { ApiResponse } from "./statistics-interface";
  * 검토-00.통계 입력현황 아이템 인터페이스
  */
 export interface StatsInputStatusReviewItem {
-    chk: string;
-    sido: string;
-    gugun: string;
-    yr: string;
-    bsnmCd: string;
-    status: string; 
-
-    // 01. 하수도보급율 (supply)
-    supplyCharger: string;
-    supplyCttpc: string;
-    supplyStatusNm: string;
-    supplyStatus: string;
-    supplyCnt: number;
-
-    // 02. 하수관로 (facility - 기존 3번)
-    facilityCharger: string;
-    facilityCttpc: string;
-    facilityStatusNm: string;
-    facilityStatus: string;
-    facilityCnt: number;
-
-    // 03. 하수관로유지관리 (pipe - 기존 4번)
-    pipeCharger: string;
-    pipeCttpc: string;
-    pipeStatusNm: string;
-    pipeCnt: number;
-
-    // 04. 하수저류시설 (storage - 기존 5번)
-    storageCharger: string;
-    storageCttpc: string;
-    storageStatusNm: string;
-    storageCnt: number;
-
-    // 05. 펌프장 (pump - 기존 6번)
-    pumpCharger: string;
-    pumpCttpc: string;
-    pumpStatusNm: string;
-    pumpCnt: number;
-
-    // 06. 공공하수처리시설 (treat - 기존 7번)
-    treatCharger: string;
-    treatCttpc: string;
-    treatStatusNm: string;
-    treatCnt: number;
-
-    // 07. 분뇨처리시설 (small - 기존 8번)
-    smallCharger: string;
-    smallCttpc: string;
-    smallStatusNm: string;
-    smallCnt: number;
-
-    // 08. 개인하수처리시설 (private - 기존 9번)
-    privateCharger: string;
-    privateCttpc: string;
-    privateStatusNm: string;
-    privateCnt: number;
-
-    // 09. 하수도재정 (finance - 기존 10번)
-    financeCharger: string;
-    financeCttpc: string;
-    financeStatusNm: string;
-    financeCnt: number;
-
-    // 10. 물재이용 (reuse - 기존 11번)
-    reuseCharger: string;
-    reuseCttpc: string;
-    reuseStatusNm: string;
-    reuseCnt: number;
-
-    // 11. 하수및분뇨찌꺼기 (sludge - 기존 12번)
-    sludgeCharger: string;
-    sludgeCttpc: string;
-    sludgeStatusNm: string;
-    sludgeCnt: number;
-
-    // 12. 하수및분뇨관련산업 (excreta - 기존 13번)
-    excretaCharger: string;
-    excretaCttpc: string;
-    excretaStatusNm: string;
-    excretaCnt: number;
-
-    // 13. 하수도서비스수준 (complaint - 기존 15번)
-    complaintCharger: string;
-    complaintCttpc: string;
-    complaintStatusNm: string;
-    complaintCnt: number;
+    ctpvNm?: string;
+    sggNm?: string;
+    sewerBzmnCd?: string;
+    status?: string;
+    statsNm?: string;
+    statsCd?: string;
+    statusNm?: string;
+    statusCd?: string;
+    chargerNm?: string;
+    chargerCttpc?: string;
 }
 
 export interface StatsInputStatusReviewResponseData {
diff --git a/apps/st/src/entities/statistics/model/statistics-interface.ts b/apps/st/src/entities/statistics/model/statistics-interface.ts
index 5a2b9eab5..f32f7ef4f 100644
--- a/apps/st/src/entities/statistics/model/statistics-interface.ts
+++ b/apps/st/src/entities/statistics/model/statistics-interface.ts
@@ -43,9 +43,65 @@ export interface ImrRequest {
     lae_sbmsn_stts_cd: string;
 }
 
+export interface SubmitExceptionRequest {
+    statsYr: string;
+    statsCd: string;
+    ctpvNm: string;
+    sggNm: string;
+    sewerBzmnCd: string;
+    userId: string;
+    superAdmin?: string;
+    laePicNm: string;
+    laePicTelNo: string;
+    laeKbrdrDeptNm: string;
+    laeKbrdrJbgdNm: string;
+    laeIdfrNm: string;
+    laeIdfrTelNo: string;
+    laeIdfrDeptNm: string;
+    laeIdfrJbgdNm: string
+}
+
+export interface SubmitExceptionResponse {
+    status: string;
+    message?: string;
+}
+
+export interface StatisticsLog {
+    statsLogSn?: number;
+    menuNm?: string;
+    tabNm?: string;
+    tblNm?: string;
+    dmndFwkNm?: string;
+    rgtrId?: string;
+    regDt?: string;
+}
+
+export interface StatisticsLogRequest {
+    page: number;
+    size: number;
+    statsCd?: string;
+}
+
+export interface StatisticsLogResponse {
+    status: string;
+    message?: string;
+    data?: {
+        statsLogList: StatisticsLog[];
+        pageInfo: {
+            totalElements: number;
+            totalPages: number;
+            currentPage: number;
+            size: number;
+        };
+    };
+}
+
 export interface StatisticsService {
     getSidoList(): Promise<ApiResponse<SearchCondition>>;
     getSggList(sidoName: string): Promise<ApiResponse<Sgg[]>>;
+    getSggAllList(sidoName: string): Promise<ApiResponse<Sgg[]>>;
     cancelSubmit(param: cancelSubmitRequest): Promise<cancelSubmitResponse>;
     callImrService(param: ImrRequest): Promise<null>;
+    submitException(param: SubmitExceptionRequest): Promise<SubmitExceptionResponse>;
+    getLogList(param: StatisticsLogRequest): Promise<StatisticsLogResponse>;
 }
\ No newline at end of file
diff --git a/apps/st/src/pages/auth/login/ui/login-page.tsx b/apps/st/src/pages/auth/login/ui/login-page.tsx
index 8d2b3300a..9f42d1423 100644
--- a/apps/st/src/pages/auth/login/ui/login-page.tsx
+++ b/apps/st/src/pages/auth/login/ui/login-page.tsx
@@ -6,124 +6,132 @@ import { LoginApi } from "@/entities/auth";
 import "./login.css";
 
 function LoginPage() {
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
-    e.preventDefault();
+    const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
+        e.preventDefault();
 
-    const formData = new FormData(e.target as HTMLFormElement);
-    const userId = formData.get("id") as string;
-    const password = formData.get("password") as string;
+        const formData = new FormData(e.target as HTMLFormElement);
+        const userId = formData.get("id") as string;
+        const password = formData.get("password") as string;
 
-    await LoginApi.login({ userId, password });
-    window.location.href = "/statistics";
-  };
+        await LoginApi.login({ userId, password });
+        window.location.href = "/statistics";
+    };
 
-  return (
-    <div className="login fx">
-      <div className="left_box fx">
-        <div className="text">
-          <h1>
-            유역하수도통합플랫폼
-            <br />
-            <span>하수도통계 관리시스템</span>
-          </h1>
-          <p>유역하수도통합플랫폼 하수도통계 관리시스템에 오신 것을 환영합니다.</p>
-        </div>
-        <div className="img">
-          <Image src={images.logo} width={229} height={46} alt="logo" />
-        </div>
-      </div>
-      <form
-        id="loginForm"
-        name="loginForm"
-        method="post"
-        onSubmit={handleSubmit}
-      >
-        <div className="login_box fx">
-          <ul className="fx">
-            <li>
-              <h2>ID</h2>
-              <div className="input_st st1">
-                <i className="diveicon di-account-box" />
-                <input
-                  type="text"
-                  className="id"
-                  title="아이디를 입력하세요."
-                  id="id"
-                  name="id"
-                  maxLength={12}
-                />
-              </div>
-            </li>
-            <li>
-              <h2>PASSWORD</h2>
-              <div className="input_st st2">
-                <i className="diveicon di-key" />
-                <input
-                  type="password"
-                  className="input_style"
-                  maxLength={25}
-                  title="비밀번호를 입력하세요."
-                  id="password"
-                  name="password"
-                />
-              </div>
-            </li>
-          </ul>
-          <div className="bottom_box fx">
-            <div className="checks fx">
-              <input
-                type="checkbox"
-                name="checkId"
-                title="로그인ID 저장여부"
-                id="checkId"
-              />
-              <label htmlFor="checkId">아이디저장</label>
+    return (
+        <div className="login fx">
+            <div className="left_box fx">
+                <div className="text">
+                    <h1>
+                        유역하수도통합플랫폼
+                        <br />
+                        <span>하수도통계 관리시스템</span>
+                    </h1>
+                    <p>
+                        유역하수도통합플랫폼 하수도통계 관리시스템에 오신 것을
+                        환영합니다.
+                    </p>
+                </div>
+                <div className="img">
+                    <Image
+                        src={images.logo}
+                        width={229}
+                        height={46}
+                        alt="logo"
+                    />
+                </div>
             </div>
-            {/* <a href="javascript:fnUserSearch();" className=" pw_message fx"><i className="xi-external-link"></i>비밀번호 또는 아이디를 잃어버리셨나요?</a> */}
-          </div>
-          <button type="submit" className="login_btn fx">
-            <span>LOGIN</span>
-          </button>
-          <div className="footer">
-            <div className="copy fx">
-              <p>copyright © 2023 KECO. All rights reserved.</p>
-            </div>
-            <div className="fot_btn fx">
-              <a
-                href="https://keco.or.kr/web/lay1/S1T6C1348/contents.do"
-                target="_blank"
-              >
-                개인정보처리방침
-              </a>
-              <a
-                href="https://keco.or.kr/web/lay1/S1T6C1349/contents.do"
-                target="_blank"
-              >
-                저작권정책안내
-              </a>
-              <a
-                href="https://keco.or.kr/web/lay1/S1T6C1350/contents.do"
-                target="_blank"
-              >
-                이메일무단수집거부
-              </a>
-            </div>
-            <p className="addr fx">
-              <span>
-                주소 : (22689) 인천광역시 서구 환경로 42(경서동
-                종합환경연구단지)
-              </span>
-              <span>
-                전화 : (시스템) 032-590-4321, 3752, 4314 / (통 계) 032-590-3723,
-                3722
-              </span>
-              <span>팩스 :032-590-3729</span>
-            </p>
-          </div>
+            <form
+                id="loginForm"
+                name="loginForm"
+                method="post"
+                onSubmit={handleSubmit}
+            >
+                <div className="login_box fx">
+                    <ul className="fx">
+                        <li>
+                            <h2>ID</h2>
+                            <div className="input_st st1">
+                                <i className="diveicon di-account-box" />
+                                <input
+                                    type="text"
+                                    className="id"
+                                    title="아이디를 입력하세요."
+                                    id="id"
+                                    name="id"
+                                    maxLength={12}
+                                />
+                            </div>
+                        </li>
+                        <li>
+                            <h2>PASSWORD</h2>
+                            <div className="input_st st2">
+                                <i className="diveicon di-key" />
+                                <input
+                                    type="password"
+                                    className="input_style"
+                                    maxLength={25}
+                                    title="비밀번호를 입력하세요."
+                                    id="password"
+                                    name="password"
+                                />
+                            </div>
+                        </li>
+                    </ul>
+                    <div className="bottom_box fx">
+                        <div className="checks fx">
+                            <input
+                                type="checkbox"
+                                name="checkId"
+                                title="로그인ID 저장여부"
+                                id="checkId"
+                            />
+                            <label htmlFor="checkId">아이디저장</label>
+                        </div>
+                        {/* <a href="javascript:fnUserSearch();" className=" pw_message fx"><i className="xi-external-link"></i>비밀번호 또는 아이디를 잃어버리셨나요?</a> */}
+                    </div>
+                    <button type="submit" className="login_btn fx">
+                        <span>LOGIN</span>
+                    </button>
+                    <div className="footer">
+                        <div className="copy fx">
+                            <p>copyright © 2023 KECO. All rights reserved.</p>
+                        </div>
+                        <div className="fot_btn fx">
+                            <a
+                                href="https://keco.or.kr/web/lay1/S1T6C1348/contents.do"
+                                target="_blank"
+                            >
+                                개인정보처리방침
+                            </a>
+                            <a
+                                href="https://keco.or.kr/web/lay1/S1T6C1349/contents.do"
+                                target="_blank"
+                            >
+                                저작권정책안내
+                            </a>
+                            <a
+                                href="https://keco.or.kr/web/lay1/S1T6C1350/contents.do"
+                                target="_blank"
+                            >
+                                이메일무단수집거부
+                            </a>
+                        </div>
+                        <p className="addr fx">
+                            <span>
+                                주소 : (22689) 인천광역시 서구 환경로 42(경서동
+                                종합환경연구단지)
+                            </span>
+                            <span>
+                                전화 : (시스템) 032-590-4321, 3752, 4314 / (통
+                                계) 032-590-3723, 3722
+                            </span>
+                            <span>팩스 :032-590-3729</span>
+                        </p>
+                    </div>
+                </div>
+            </form>
         </div>
-      </form>
-    </div>
-  );
+    );
 }
 
 export { LoginPage };
diff --git a/apps/st/src/shared/config/auth.ts b/apps/st/src/shared/config/auth.ts
new file mode 100644
index 000000000..7c35ad9f0
--- /dev/null
+++ b/apps/st/src/shared/config/auth.ts
@@ -0,0 +1,17 @@
+import type { AuthConfig } from "@common/auth";
+
+import {
+  ACCESS_TOKEN,
+  AUTH_USER_ID,
+  CLAIM_NAME,
+  COOKIE_DOMAIN,
+  REFRESH_TOKEN,
+} from "./env";
+
+export const authConfig: AuthConfig = {
+  authUserId: AUTH_USER_ID || "token-id",
+  claimName: CLAIM_NAME || "Authorization",
+  cookieDomain: COOKIE_DOMAIN,
+  accessToken: ACCESS_TOKEN || "access-token",
+  refreshToken: REFRESH_TOKEN || "refresh-token",
+};
diff --git a/apps/st/src/shared/config/env.ts b/apps/st/src/shared/config/env.ts
index 560bf72e1..458dfa3a6 100644
--- a/apps/st/src/shared/config/env.ts
+++ b/apps/st/src/shared/config/env.ts
@@ -13,3 +13,4 @@ export const REFRESH_TOKEN =
 export const AUTH_USER_ID = process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id";
 export const ST_SERVICE_URL =
     process.env.NEXT_PUBLIC_ST_SERVICE_URL || "http://localhost:8080";
+export const COOKIE_DOMAIN = process.env.NEXT_PUBLIC_COOKIE_DOMAIN;
\ No newline at end of file
diff --git a/apps/st/tsconfig.json b/apps/st/tsconfig.json
index 234373acb..2061c7cb4 100644
--- a/apps/st/tsconfig.json
+++ b/apps/st/tsconfig.json
@@ -24,11 +24,7 @@
     ],
     "baseUrl": "./src",
     "paths": {
-      "@/*": ["./*"],
-      "@common/components": ["../../../packages/common/components/dist/"],
-      "@common/config": ["../../../packages/common/config/dist/"],
-      "@common/network": ["../../../packages/common/network/"],
-      "@rsone/components": ["../../../packages/rsone/dist/"]
+      "@/*": ["./*"]
     }
   },
   "include": [
diff --git a/apps/wr/.env.mindone b/apps/wr/.env.mindone
index 8749fe39f..f5e3b6d7e 100644
--- a/apps/wr/.env.mindone
+++ b/apps/wr/.env.mindone
@@ -16,6 +16,7 @@ NEXT_PUBLIC_WR_SERVER_API_URL = http://con.mind-one.co.kr:11083/reuse-service/ap
 NEXT_PUBLIC_SEWERAGE_API_URL = http://con.mind-one.co.kr:11083/sewerage-service   # 개발 서버 API
 NEXT_PUBLIC_NGII_URL = https://map.ngii.go.kr
 NEXT_PUBLIC_NGII_PARAM = 04trYP9_xwLAfALjwZ-B8g&service=WMTS&request=GetTile&version=1.0.0&format=image/png&layer=korean_map&style=korean&tilematrixset=korean&tilematrix={z}&tilecol={x}&tilerow={y}
+NEXT_PUBLIC_CM_LOGIN_PAGE_URL = /auth/login
 NEXT_PUBLIC_HASUDOINFO = https://www.hasudoinfo.or.kr
 NEXT_PUBLIC_HASUDOINFO_IN = https://www.hasudoinfo.or.kr
 NEXT_PUBLIC_FINDADRESS_URL=https://business.juso.go.kr/addrlink/addrLinkApi.do
diff --git a/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx b/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx
index 56096015f..4304945bd 100644
--- a/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx
@@ -44,7 +44,6 @@ import { zodResolver } from "@hookform/resolvers/zod";
 import moment from "moment";
 import { useEffect, useRef, useState } from "react";
 import { useForm, useWatch } from "react-hook-form";
-import { Toaster } from "react-hot-toast";
 import { z } from "zod";
 
 
@@ -305,6 +304,7 @@ export default function CoMatRvw() {
                 headName={"수요매칭검토현황"}
                 tableData={dmdMatData || []}
                 headlist={coRvwHeadList}
+                widthFixed={true}
                 pageSize={13}
                 total={coMatRvwCount}
                 cellClick={(index: number | undefined) => {
@@ -770,7 +770,6 @@ export default function CoMatRvw() {
           </div>
         </div>
       </ContentsDiv>
-      <Toaster position="top-center" />
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/matMng/coMat/ruseCaseMng/page.tsx b/apps/wr/app/(with-layout)/matMng/coMat/ruseCaseMng/page.tsx
index edda29ac6..9fc636427 100644
--- a/apps/wr/app/(with-layout)/matMng/coMat/ruseCaseMng/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMat/ruseCaseMng/page.tsx
@@ -23,7 +23,6 @@ import ListDiv from "@common/business_components/ui/list_div";
 import { Button, Label } from "@common/components/ui";
 import { useAlertStore } from "@/src/shared/lib";
 import { useEffect, useState } from "react";
-import { Toaster } from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 import * as XLSX from "xlsx";
 
@@ -44,6 +43,7 @@ export default function RuseCaseMng() {
   const [selectUtz, setSelectUtz] = useState<string>("");
   const [name, setName] = useState<string>("");
   const [resetPage, isResetPage] = useState(false);
+  const [displayRuseCaseMngList, setDisplayRuseCaseMngList] = useState(ruseCaseMngList);
   const { t } = useTranslation("base");
   const alert = useAlertStore((state) => state.setMessage);
 
@@ -56,6 +56,19 @@ export default function RuseCaseMng() {
     ruseCaseMngInit();
   }, []);
 
+  useEffect(() => {
+    const sewageOutUseCodeList = code.sewageOutFclttUse ?? [];
+
+    setDisplayRuseCaseMngList(
+      ruseCaseMngList.map((item) => ({
+        ...item,
+        grnteWqUsg:
+          sewageOutUseCodeList.find((codeItem) => codeItem.val === item.grnteWqUsg)?.text ??
+          item.grnteWqUsg,
+      }))
+    );
+  }, [code.sewageOutFclttUse, ruseCaseMngList]);
+
   // 시도 선택
   const getSelCity = (val: string | number) => {
     const cityValue = String(val);
@@ -133,7 +146,8 @@ export default function RuseCaseMng() {
           item.ruseFcltUsg,
           item.ruseFcltSplyCpct,
           item.ruseFcltPrcsMsrc,
-          item.grnteWqUsg,
+          code.sewageOutFclttUse.find((codeItem) => codeItem.val === item.grnteWqUsg)?.text ??
+            item.grnteWqUsg,
           item.grnteWqGrssClfg,
           item.grnteWqCombResdch,
           item.grnteWqTrbt,
@@ -313,8 +327,9 @@ export default function RuseCaseMng() {
               <div className="w-[350%]">
                 <UiTable
                   headName={"물재이용사례 현황"}
-                  tableData={ruseCaseMngList}
+                  tableData={displayRuseCaseMngList}
                   headlist={ruseCaseMng.ruseHeadList}
+                  widthFixed={true}
                   pageSize={20}
                   total={count}
                   cellClick={undefined}
@@ -341,7 +356,6 @@ export default function RuseCaseMng() {
           </div>
         </div>
       </ContentsDiv>
-      <Toaster position="top-center" />
       {/* 엑셀 등록 모달 */}
       <UiModal
         open={isExcelOpen}
diff --git a/apps/wr/app/(with-layout)/matMng/coMat/ruseRvwHstry/page.tsx b/apps/wr/app/(with-layout)/matMng/coMat/ruseRvwHstry/page.tsx
index 392cc2fd3..b142bff16 100644
--- a/apps/wr/app/(with-layout)/matMng/coMat/ruseRvwHstry/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMat/ruseRvwHstry/page.tsx
@@ -1,4 +1,4 @@
-/**
+/**
  * 수요처매칭 > 재이용검토이력
  */
 "use client";
@@ -7,13 +7,13 @@ import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
 import { type RvwHistTableType } from "@/app/store/matDmd/coMatRvw/type";
 import {
-  confirmToast,
   formatPhoneNumber,
   getCity,
   getdmdMatFlag,
   tableData,
   yearOptions,
 } from "@/components/lib/func/common";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import type { objSearchType } from "@/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal";
 import {
   ContentsDiv,
@@ -30,7 +30,6 @@ import { Button, Label } from "@common/components/ui";
 import { useAlertStore } from "@/src/shared/lib";
 import moment from "moment";
 import { useCallback, useEffect, useState } from "react";
-import { Toaster } from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 export default function RuseRvwHstry() {
   const {
@@ -45,6 +44,7 @@ export default function RuseRvwHstry() {
   const { rvwHistRes, ruseHistHeadList, rvwHistCount } = ruseHist;
   const { regAuthrtYn } = auth;
   const alert = useAlertStore((state) => state.setMessage);
+  const { confirm } = useConfirm();
 
   const [pageNation, setPageNatiion] = useState<number>(1);
 
@@ -146,7 +146,7 @@ export default function RuseRvwHstry() {
     },
     [rvwHistData]
   );
-  const confrirmToast = () => {
+  const confrirmToast = async () => {
     const completeData = rvwHistData
       ?.map((item) => {
         if (item?.completeYn.chk && item.splyFcltFlg === "검토완료") {
@@ -156,31 +156,14 @@ export default function RuseRvwHstry() {
       .filter((item) => item !== undefined);
 
     if (completeData && completeData?.length > 0) {
-      confirmToast(t('isMatchFinishMsg'), () => ruseRvwComplete(completeData as number[]));
+      if (await confirm(t("isMatchFinishMsg"))) {
+        const message = await ruseRvwComplete(completeData as number[]);
+        alert(message);
+      }
 
     //   const handleConfirm = async () => {
     //     ruseRvwComplete(completeData as number[]);
     //  };
-      // toast((t) => (
-      //   <span className="flex flex-col items-center">
-      //    매칭완료를 진행하시겠습니까?  
-      //     <br />
-      //     <div className="mt-2 flex flex-row space-x-2">
-      //       <Button
-      //         size={"sm"}
-      //         onClick={() => {
-      //           toast.dismiss(t.id);
-      //           ruseRvwComplete(completeData as number[]);
-      //         }}
-      //       >
-      //         확인
-      //       </Button>
-      //       <Button size={"sm"} onClick={() => toast.dismiss(t.id)}>
-      //         취소
-      //       </Button>
-      //     </div>
-      //   </span>
-      // ));
     } else {
       alert(t('isNotMatchFinishMsg'));
     }
@@ -217,6 +200,9 @@ export default function RuseRvwHstry() {
           dmdCoNm: item.demandCo?.dmdCoNm,
           daddr: item.demandCo?.daddr,
           telno: formatPhoneNumber(item.demandCo?.telno || ""),
+          useUsgCd:
+            code.sewageOutFclttUse.find((codeItem) => codeItem.val === item.useUsgCd)?.text ??
+            item.useUsgCd,
           dmndTmng: item?.dmndTmng
             ? moment(item?.dmndTmng).format("YYYY-MM-DD")
             : "없음",
@@ -232,7 +218,7 @@ export default function RuseRvwHstry() {
 
       setRvwHistData(tableData(data, { code }));
     }
-  }, [rvwHistRes]);
+  }, [code.sewageOutFclttUse, rvwHistRes]);
 
 
   return (
@@ -317,7 +303,7 @@ export default function RuseRvwHstry() {
                   >
                     조회
                   </Button>
-                  <Button className={btnClass} onClick={confrirmToast} disabled={regAuthrtYn==='N'}>
+                  <Button className={btnClass} onClick={() => { void confrirmToast(); }} disabled={regAuthrtYn==='N'}>
                     저장
                   </Button>
                 </div>
@@ -334,6 +320,7 @@ export default function RuseRvwHstry() {
               headName={"재이용검토현황"}
               tableData={rvwHistData || []}
               headlist={ruseHistHeadList}
+              widthFixed={true}
               pageSize={20}
               total={rvwHistCount}
               cellClick={(index: number | undefined, headId: string) => {
@@ -347,7 +334,6 @@ export default function RuseRvwHstry() {
           </ListDiv>
         </div>
       </div>
-      <Toaster position="top-center" />
     </ContentsDiv>
   );
 }
diff --git a/apps/wr/app/(with-layout)/matMng/coMng/coSttn/page.tsx b/apps/wr/app/(with-layout)/matMng/coMng/coSttn/page.tsx
index 872284783..71ec60cf0 100644
--- a/apps/wr/app/(with-layout)/matMng/coMng/coSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMng/coSttn/page.tsx
@@ -1,4 +1,4 @@
-"use client";
+"use client";
 
 /**
  * 수요처관리
@@ -8,7 +8,6 @@ import { btnClass } from "@/app/store/common/code";
 import { excelCoSttnParsing } from "@/app/store/matDmd/coSttn/excel";
 import { fetchType, getFetch } from "@/components/lib/api";
 import {
-  //confirmToast,
   excelDownload,
   formatPhoneNumber,
   getCity,
@@ -32,7 +31,6 @@ import type { DemandCompType } from "@common/business_components/ui/sdmInsertFor
 import { Button } from "@common/components/ui";
 import moment from "moment";
 import { useCallback, useEffect, useState } from "react";
-// import toast, { Toaster } from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 import { useAlertStore } from "@/src/shared/lib";
 import { useConfirm } from "@frontend-opensource/use-react-hooks";
@@ -181,13 +179,11 @@ export default function CoSttn() {
         const message = await coSttnPwInit(dmdInfoId);
         alert(message);
       };
-      //confirmToast( t('isInitPw', { dmdInfoId: dmdInfoSliceId }), handleConfirm, 'text-2xl');
       if (await confirm(t('isInitPw', { dmdInfoId: dmdInfoSliceId }))) {
         await handleConfirm();
       }
     } else {
       alert("비밀번호 초기화를 원하는 행을 선택해주세요.");
-      // toast.error("비밀번호 초기화를 원하는 행을 선택해주세요.")
     }
   }
 
@@ -345,6 +341,7 @@ export default function CoSttn() {
                   coSttnSearch(String(page), "13", String(con));
                 }}
                 resetSelection={isResetSelection}
+                widthFixed={true}
               ></UiTable>
             </ListDiv>
           </div>
@@ -373,7 +370,6 @@ export default function CoSttn() {
           }
         ></UiModal>
       </ContentsDiv>
-      {/* <Toaster position="top-center" /> */}
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/matMng/coMng/drgtSttn/page.tsx b/apps/wr/app/(with-layout)/matMng/coMng/drgtSttn/page.tsx
index 1509e2081..1aafb4318 100644
--- a/apps/wr/app/(with-layout)/matMng/coMng/drgtSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMng/drgtSttn/page.tsx
@@ -11,7 +11,6 @@ import ListDiv from "@common/business_components/ui/list_div";
 import { Button, Label, ScrollArea } from "@common/components/ui";
 import { useAlertStore } from "@/src/shared/lib";
 import { useEffect, useState, useRef } from "react";
-import { Toaster } from "react-hot-toast";
 
 export default function DrgtSttn() {
     const { code, drgt, drgtSearch, drgtModalSearch, drgtInit } = useWrStore((state) => state);
@@ -292,7 +291,6 @@ export default function DrgtSttn() {
                     bodyClass={"w-[50vw] max-w-none h-[80vh]"}
                     body={<DrgtDetailModal data={drgtModal.data as customDrgt[]} />}
                 />
-                <Toaster position="top-center" />
             </ContentsDiv>
         </>
     )
diff --git a/apps/wr/app/(with-layout)/matMng/coMng/ldrmntCoSttn/page.tsx b/apps/wr/app/(with-layout)/matMng/coMng/ldrmntCoSttn/page.tsx
index 6279d9987..4bbaa3a43 100644
--- a/apps/wr/app/(with-layout)/matMng/coMng/ldrmntCoSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMng/ldrmntCoSttn/page.tsx
@@ -5,7 +5,6 @@ import { btnClass } from "@/app/store/common/code";
 import { type customLdrmnt } from "@/app/store/matDmd/ldrmntCoSttn";
 import { ldrmntHeadListExport } from "@/app/store/matDmd/ldrmntCoSttn/headList";
 import {
-  confirmToast,
   excelDownload,
   getCity,
   tableData
@@ -27,9 +26,9 @@ import {
 } from "@common/business_components/ui";
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components/ui";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import { useAlertStore } from "@/src/shared/lib";
 import { useCallback, useEffect, useState } from "react";
-import { Toaster } from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 
 export default function LdrmntCoSttn() {
@@ -48,6 +47,7 @@ export default function LdrmntCoSttn() {
   const [isDownloadClicked, setIsDownloadClicked] = useState(false);
   const { t } = useTranslation('base');
   const alert = useAlertStore((state) => state.setMessage);
+  const { confirm } = useConfirm();
   const { regAuthrtYn, mdfcnAuthrtYn } = auth;
 
   const excelClick = useCallback(() => {
@@ -248,7 +248,7 @@ export default function LdrmntCoSttn() {
         <div className="grid grid-cols-6 gap-4 ">
           <div className="col-span-6">
             <div className="overflow-x-auto">
-              <ListDiv className="min-w-max">
+              <ListDiv>
                 <UiTable
                   headName={[]}
                   tableData={bdstTable || []}
@@ -258,6 +258,7 @@ export default function LdrmntCoSttn() {
                   cellClick={(index: number | undefined) => { cellClick(index ?? undefined) }}
                   onPageChange={setPageNation}
                   resetPageNo={resetPage}
+                  widthFixed={true}
                 />
               </ListDiv>
             </div>
@@ -277,7 +278,9 @@ export default function LdrmntCoSttn() {
                   setDetailModal({ ...detailModal, isOpen: false });
                   ldrmntSearch(false, pageNation, '20', computeCityNm(), searchTxt || "");
                 };
-                confirmToast(t('isUpdateMsg'), handleConfirm);
+                if (await confirm(t("isUpdateMsg"))) {
+                  await handleConfirm();
+                }
               }} />}
           />
 
@@ -289,7 +292,6 @@ export default function LdrmntCoSttn() {
             bodyClass={"w-[40vw] max-w-none"}
             body={<CoRegExcel isModal={(isOpen) => setIsExcelOpen({ isModal: isOpen })} />}
           />
-          <Toaster position="top-center"></Toaster>
         </div>
       </ContentsDiv>
     </>
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/htdflReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/htdflReg/page.tsx
index acc44571f..d8f52297c 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/htdflReg/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/htdflReg/page.tsx
@@ -18,7 +18,6 @@ import {
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components";
 import { useEffect, useRef, useState } from "react";
-import { Toaster } from "react-hot-toast";
 
 export default function Home() {
   const {
@@ -183,7 +182,6 @@ export default function Home() {
           }}
         />
 
-        <Toaster position="top-center" />
       </ContentsDiv>
     </>
   );
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx
index 87dff04fd..0a243a41f 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx
@@ -30,7 +30,7 @@ import { btnClass } from "@/app/store/common/code";
 import { Tabs, TabsList, TabsTrigger, TabsContent } from "@common/components";
 import { useCallback, useEffect, useRef, useState } from "react";
 import ListDiv from "@common/business_components/ui/list_div";
-import { confirmToast, tableData } from "@/components/lib/func/common";
+import { tableData } from "@/components/lib/func/common";
 import type {
   customPbnst,
   fcBizType,
@@ -44,13 +44,13 @@ import {
 import { PbnstMngForm } from "@/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm";
 import { PbnstBuseForm } from "@/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm";
 import { PbnstRegModal } from "@/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal";
-import { Toaster } from "react-hot-toast";
 import { writeRgtrAndMdfr } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg";
 import { useFieldArray, useForm, type FieldErrors } from "react-hook-form"; // FieldErrors 타입 추가
 import { zodResolver } from "@hookform/resolvers/zod";
 import { z } from "zod";
 import { createDefaultPbnstItem } from "./utilsZod";
 import { useTranslation } from "react-i18next";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import { useAlertStore } from "@/src/shared/lib";
 export default function PublicReuseFaciltyInsert() {
   const {
@@ -67,6 +67,7 @@ export default function PublicReuseFaciltyInsert() {
   } = useWrStore((state) => state);
 
   const { t } = useTranslation("base");
+  const { confirm } = useConfirm();
   const alert = useAlertStore((state) => state.setMessage);
   const { pubFacHeadList, pbnstHasuResCount, pbnstHasuRes, pbnstRes } = pbnst;
   const { regAuthrtYn, mdfcnAuthrtYn, laeSeCd } = auth;
@@ -137,30 +138,29 @@ export default function PublicReuseFaciltyInsert() {
     });
 
     const handleConfirm = async () => {
-      Promise.allSettled([
+      const [resFclt, resBiz] = await Promise.allSettled([
         pbnstRuseFcltUpdate(pbnst as customPbnst[]),
         pbnstRuseBizUpdate(bizs),
-      ]).then(([resFclt, resBiz]) => {
-        const isFcltSuccess = resFclt.status === "fulfilled";
-        const isBizSuccess = resBiz.status === "fulfilled";
-        if (isFcltSuccess && isBizSuccess) {
-          alert("하수 재이용 시설 및 사업이 수정되었습니다.");
-          // 메시지 표시, 페이지 이동 등
-        } else {
-          let message = "";
-          // ✅ 각각 어떤 항목이 실패했는지도 로그/알림 처리
-          if (!isFcltSuccess) {
-            message = "하수재이용 시설 ";
-          }
-          if (!isBizSuccess) {
-            message += "하수재이용 시설 사업 ";
-          }
-          alert(message + "오류 입니다 ");
-          pubHasuInit("1", laeSeCd);
+      ]);
+      const isFcltSuccess = resFclt.status === "fulfilled";
+      const isBizSuccess = resBiz.status === "fulfilled";
+      if (isFcltSuccess && isBizSuccess) {
+        alert("하수 재이용 시설 및 사업이 수정되었습니다.");
+      } else {
+        let message = "";
+        if (!isFcltSuccess) {
+          message = "하수재이용 시설 ";
         }
-      });
+        if (!isBizSuccess) {
+          message += "하수재이용 시설 사업 ";
+        }
+        alert(message + "오류 입니다 ");
+        pubHasuInit("1", laeSeCd);
+      }
     };
-    confirmToast(t("isUpdatetMsg"), handleConfirm);
+    if (await confirm(t("isUpdatetMsg"))) {
+      await handleConfirm();
+    }
   };
 
   // 폼 유효성 검사 실패 시 호출될 함수
@@ -330,9 +330,7 @@ export default function PublicReuseFaciltyInsert() {
                     onClick={() => {
                       //  pbnstMngData([] as customPbnst[]);
                       if (!selectRow) {
-                        alert(
-                          "재시용시설을 등록할 하수리시시설을 테이블에서 선택하고 등록버튼을 눌러주세요"
-                        );
+                        alert("재시용시설을 등록할 하수처리시설을 목록에서 선택하고\n 등록버튼을 눌러주세요");
                         return;
                       } else {
                         appendPbnstRuseFclt();
@@ -433,9 +431,7 @@ export default function PublicReuseFaciltyInsert() {
                     onClick={() => {
                       //  pbnstMngData([] as customPbnst[]);
                       if (!selectRow) {
-                        alert(
-                          "하수리시시설을 테이블을 선택하고 등록버튼을 눌러주세요"
-                        );
+                        alert("하수처리시설을 목록에서 선택하고\n 등록버튼을 눌러주세요");
                         return;
                       } else {
                         appendPbnstRuseFclt();
@@ -454,7 +450,10 @@ export default function PublicReuseFaciltyInsert() {
                 form={form} // form prop 전달
                 setPbnstInsert={(data) => {
                   if (data) {
-                    pbnstInsert(data); // pbnstInsert 함수 호출
+                    void (async () => {
+                      const message = await pbnstInsert(data);
+                      alert(message);
+                    })();
                     setIsRuseReg({ isModal: false });
                   }
                 }}
@@ -470,7 +469,6 @@ export default function PublicReuseFaciltyInsert() {
             }}
           />
         </div>
-        <Toaster position="top-center" />
       </ContentsDiv>
     </>
   );
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rainReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rainReg/page.tsx
index 9dd14c844..82344fa1f 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rainReg/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rainReg/page.tsx
@@ -20,7 +20,6 @@ import {
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components";
 import { useEffect, useRef, useState } from "react";
-import { Toaster } from "react-hot-toast";
 
 
 
@@ -199,7 +198,6 @@ export default function Home() {
           }}
         />
 
-        <Toaster position="top-center" />
       </ContentsDiv>
     </>
   );
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rswtReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rswtReg/page.tsx
index ec2c7eda8..845ebf0e8 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rswtReg/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/rswtReg/page.tsx
@@ -20,7 +20,6 @@ import {
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components";
 import { useEffect, useRef, useState } from "react";
-import { Toaster } from "react-hot-toast";
 
 
 /**
@@ -202,7 +201,6 @@ export default function Home() {
           }}
         />
 
-        <Toaster position="top-center" />
       </ContentsDiv>
     </>
   );
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx
index 1eb3fdbdb..2f31e616c 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/htdflSttn/page.tsx
@@ -1,4 +1,4 @@
-/**
+/**
  * 온배수시설 현황
  */
 "use client";
@@ -34,7 +34,7 @@ import ListDiv from "@common/business_components/ui/list_div";
 import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
 import { Button, Label } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function HtdflSttn() {
@@ -58,6 +58,7 @@ export default function HtdflSttn() {
   //   chBuilding: chgBuilding[];
   // }>({ isOpen: false, chBuilding: [] });
   const [fcltNm, setFcltNm] = useState<string>("");
+  const alert = useAlertStore((state) => state.setMessage);
 
   console.log("laeSeCd : ", laeSeCd);
   useEffect(() => {
@@ -128,7 +129,7 @@ export default function HtdflSttn() {
         sheetArray
       );
     } else {
-      toast.error(t('excelDownErrMsg'));
+      alert(t('excelDownErrMsg'));
     }
     isDownloadTriggered.current = false;
   }, [htdflSttn.excelList, code]);
@@ -241,6 +242,7 @@ export default function HtdflSttn() {
                     }}
                     onPageChange={setPageNation}
                     resetPageNo={resetPage}
+                    widthFixed={true}
                   >
                     <HeadMakeColSpan upHeadList={htdflSttn.htdflSttNodeList} />
                   </UiTable>
@@ -275,7 +277,6 @@ export default function HtdflSttn() {
           body={<SttnDetailModal type={"HTB"} formObj={detailModal.data} />}
         />
       </ContentsDiv>
-      <Toaster position="top-center" />
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/pbnstSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/pbnstSttn/page.tsx
index 185af81b9..3e085ea89 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/pbnstSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/pbnstSttn/page.tsx
@@ -1,4 +1,4 @@
-/**
+/**
  *  하수재이용 시설 현황
  * 재이용시설 현황 - 하수재이용시설 현황
  * - layout.tsx에 의해 공통 레이아웃이 적용됨
@@ -30,7 +30,7 @@ import ListDiv from "@common/business_components/ui/list_div";
 import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
 import { Button, Label } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 
@@ -61,6 +61,7 @@ export default function PbnstSttn() {
   const isDownloadTriggered = useRef(false);
   const [pbnRuseNm, setPbnRuseNm] = useState<string>("");
   const { t } = useTranslation("base");
+  const alert = useAlertStore((state) => state.setMessage);
   const excelClick = useCallback(() => {
     isDownloadTriggered.current = true;
     pbnstSttnSearch(
@@ -119,7 +120,7 @@ export default function PbnstSttn() {
         sheetArray
       );
     } else {
-      toast.error(t("excelDownErrMsg"));
+      alert(t("excelDownErrMsg"));
     }
     isDownloadTriggered.current = false;
   }, [pbnstSttn.excelList]);
@@ -226,6 +227,7 @@ export default function PbnstSttn() {
                       setIsReset(false);
                     }}
                     resetPageNo={isReset}
+                    widthFixed={true}
                   >
                     <HeadMakeColSpan upHeadList={pbnstSttn.pbnstSttNodeList} />
                   </UiTable>
@@ -269,7 +271,6 @@ export default function PbnstSttn() {
           }}
         />
       </ContentsDiv>
-      <Toaster position="top-center" />
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx
index 781b418fa..9de317a08 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rainSttn/page.tsx
@@ -1,4 +1,4 @@
-/**
+/**
  * 빗물이용시설 현황
  */
 "use client";
@@ -32,7 +32,7 @@ import ListDiv from "@common/business_components/ui/list_div";
 import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
 import { Button, Label } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function RainSttn() {
@@ -58,6 +58,7 @@ export default function RainSttn() {
 
   const [fcltNm, setFcltNm] = useState<string>("");
   const { t } = useTranslation("base");
+  const alert = useAlertStore((state) => state.setMessage);
 
   const cellClick = (index: number | undefined) => {
     if (index !== undefined && bdstTable !== undefined) {
@@ -173,7 +174,7 @@ export default function RainSttn() {
         sheetArray
       );
     } else {
-      toast.error(t("excelDownErrMsg"));
+      alert(t("excelDownErrMsg"));
     }
     isDownloadTriggered.current = false;
   }, [rainSttn.excelList]);
@@ -286,6 +287,7 @@ export default function RainSttn() {
                     }}
                     onPageChange={setPageNation}
                     resetPageNo={resetPage}
+                    widthFixed={true}
                   >
                     <HeadMakeColSpan upHeadList={rainSttn.rainSttNodeList} />
                   </UiTable>
@@ -318,7 +320,6 @@ export default function RainSttn() {
           body={<SttnDetailModal type={"RNB"} formObj={detailModal.data} />}
         />
       </ContentsDiv>
-      <Toaster position="top-center" />
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx
index 8ddd0cc7c..c95c7aafe 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/fcltSttn/rswtSttn/page.tsx
@@ -1,4 +1,4 @@
-/**
+/**
  * 중수도시설 현황
  */
 "use client";
@@ -32,7 +32,7 @@ import ListDiv from "@common/business_components/ui/list_div";
 import { HeadMakeColSpan } from "@common/business_components/ui/table/HeadMakeColSpan";
 import { Button, Label } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function RswtSttn() {
@@ -52,6 +52,7 @@ export default function RswtSttn() {
   const [detailModal, setDetailModal] = useState<{ isOpen: boolean, data: customRswtBdst | undefined }>({ data: undefined, isOpen: false })
   const [fcltNm, setFcltNm] = useState<string>("");
   const { t } = useTranslation('base');
+  const alert = useAlertStore((state) => state.setMessage);
   const cellClick = (index: number | undefined) => {
 
     if ( index !== undefined && bdstTable !== undefined) {
@@ -143,7 +144,7 @@ export default function RswtSttn() {
         sheetArray
       );
     } else {
-      toast.error(t('excelDownErrMsg'));
+      alert(t('excelDownErrMsg'));
     }
     isDownloadTriggered.current = false;
   }, [rswtSttn.excelList]);
@@ -243,6 +244,7 @@ export default function RswtSttn() {
                     cellClick={(index: number | undefined) => { cellClick(index ?? undefined) }}
                     onPageChange={setPageNation}
                     resetPageNo={resetPage}
+                    widthFixed={true}
                   >
                     <HeadMakeColSpan upHeadList={rswtSttn.rswtSttNodeList} />
                   </UiTable>
@@ -278,7 +280,6 @@ export default function RswtSttn() {
         />
 
       </ContentsDiv>
-      <Toaster position="top-center" />
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead.tsx
index 28ba6c512..72069f4d8 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead.tsx
@@ -17,6 +17,7 @@ export const headMakeprfmnc = (
                   className={`border border-gray-600 px-2 py-1 `}
                   rowSpan={2}
                   key={head.id}
+                  style={{ width: head.widthPercent ? `${head.widthPercent}%` : undefined }}
                 >
                   {head.title}
                 </TableHead>
@@ -28,6 +29,7 @@ export const headMakeprfmnc = (
                   colSpan={
                     makeHeadNm?.find((ch) => ch.headNm === head.upName)?.length
                   }
+                  style={{ width: head.widthPercent ? `${head.widthPercent}%` : undefined }}
                 >
                   {makeHeadNm?.find((ch) => ch.headNm === head.upName)?.text}
                 </TableHead>
@@ -43,6 +45,7 @@ export const headMakeprfmnc = (
                 <TableHead
                   className={`border border-gray-600 px-2 py-1 `}
                   key={head.id}
+                  style={{ width: head.widthPercent ? `${head.widthPercent}%` : undefined }}
                 >
                   {head.title}
                 </TableHead>
@@ -51,4 +54,4 @@ export const headMakeprfmnc = (
         </TableRow>
       </>
     );
-  };
\ No newline at end of file
+  };
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/page.tsx
index 28f1e01b2..ba0d34f44 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/page.tsx
@@ -1,3 +1,7 @@
+/**
+ * 재이용실적등록 > 지도점검결과등록
+ */
+
 "use client";
 
 import { useWrStore } from "@/app/store";
@@ -11,11 +15,11 @@ import {
   type rswtrChkDetailsZodType,
 } from "@/app/store/prfmncReg/chkgdnReg/rswrtChkgdn";
 import {
-  confirmToast,
   excelArrayDownload,
   excelDownload,
   yearOptions,
 } from "@/components/lib/func/common";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import ChkgdExcel from "@/components/ui/modal/chkgd/chkgdExcel/chkgdExcel";
 import ChkgdModal from "@/components/ui/modal/chkgd/chkgdModal/chkgdModal";
 import RainChkgdTable from "@/components/ui/table/chkgdTable/rainChkgd/rainChkgdTable";
@@ -38,34 +42,35 @@ import {
   TooltipTrigger,
 } from "@common/components/ui/tooltip";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function Page() {
   const {
-    auth,
-    code,
-    rainChkgdn,
-    rswtChkgdn,
-    rainChkInit,
-    rainChkDetilUpdate,
-    rainChkDelete,
-    rainChkExcelDownload,
-    rainChkHeadChange,
-    rainChkNmSearch,
-    isRainSttn,
-    rswtChkgdnInit,
-    rswtChkNmSearch,
-    rswtChkPolInit,
-    rswtChkDetilsUpdate,
-    rswtChkDelete,
-    rswtrChkExcelDownload,
-    rswtChkHeadChange,
-    getLaeSeCdCheck
+    auth, // 사용자 권한 및 로그인 사용자 기준 정보
+    code, // 공통 코드 및 지역 코드 정보
+    rainChkgdn, // 빗물이용시설 지도점검 화면 상태
+    rswtChkgdn, // 중수도시설 지도점검 화면 상태
+    rainChkInit, // 빗물이용시설 지도점검 목록 초기 조회
+    rainChkDetilUpdate, // 빗물이용시설 지도점검 상세 수정 저장
+    rainChkDelete, // 빗물이용시설 지도점검 선택 건 삭제
+    rainChkExcelDownload, // 빗물이용시설 지도점검 엑셀 양식/데이터 조회
+    rainChkHeadChange, // 빗물이용시설 테이블 헤더 선택 상태 변경
+    rainChkNmSearch, // 빗물이용시설명으로 목록 조회
+    isRainSttn, // 빗물이용시설 상세/선택 상태 초기화
+    rswtChkgdnInit, // 중수도시설 지도점검 목록 초기 조회
+    rswtChkNmSearch, // 중수도시설명으로 목록 조회
+    rswtChkPolInit, // 중수도 시설구분 변경 시 조회조건 초기화
+    rswtChkDetilsUpdate, // 중수도시설 지도점검 상세 수정 저장
+    rswtChkDelete, // 중수도시설 지도점검 선택 건 삭제
+    rswtrChkExcelDownload, // 중수도시설 지도점검 엑셀 양식/데이터 조회
+    rswtChkHeadChange, // 중수도시설 테이블 헤더 선택 상태 변경
+    getLaeSeCdCheck // 사용자 관할 기관 코드 조회
   } = useWrStore((state) => {
     return state;
   });
   const { regAuthrtYn, mdfcnAuthrtYn, delAuthrtYn,laeSeCd } = auth;
+  const { confirm } = useConfirm();
   const [isRegExcel, setIsRegExcel] = useState(false);
   const [updateRainDetail, setUpdateRainDetail] = useState<rainChkZodType[]>([]);
   const [updateRswtDetail, setUpdateRSwtDetail] = useState<rswtrChkDetailsZodType[]>([]);
@@ -82,12 +87,13 @@ export default function Page() {
     String(new Date().getFullYear())
   );
 
-  const useInitRef = useRef(false);
+  // laeSeCd가 아직 준비되기 전 초기 렌더에서 rainChkInit, rswtChkgdnInit 같은 초기 조회 로직이 먼저 도는 것을 막는다.
+  const useInitRef = useRef(false); //초기 마운트가 한 번 끝났는지
 
 
   useEffect(() => {
     getLaeSeCdCheck();
-    useInitRef.current = true;
+    useInitRef.current = true; // getLaeSeCdCheck()를 호출한 뒤 true로 바뀜
   }, []);
 
 
@@ -110,8 +116,8 @@ export default function Page() {
       } else { // 중수도
         if (fcltNm) {
           rswtChkNmSearch(
-            rainPageNation,
-            rainPageSize,
+            rswtPageNation,
+            rswtPageSize,
             searchYear,
             laeSeCd,
             fcltNm
@@ -144,7 +150,7 @@ export default function Page() {
       if (fcltNm) {
         rswtChkNmSearch(
           pageNo,
-          rainPageSize,
+          rswtPageSize,
           searchYear,
           laeSeCd,
           fcltNm
@@ -236,33 +242,42 @@ export default function Page() {
   }, [rainChkgdn.isSttn, rswtChkgdn.isSttn]);
 
   const { t } = useTranslation('base');
-  const clickDelete = (data: number[], selFcltDiv: string) => {
+  const alert = useAlertStore((state) => state.setMessage);
+  const clickDelete = async (data: number[], selFcltDiv: string) => {
     if (data.length > 0) {
       if (selFcltDiv === "RNB") {
         const handleConfirm = async () => {
-          rainChkDelete(data, searchYear);
+          const message = await rainChkDelete(data, searchYear);
+          alert(message);
         };
-        confirmToast(t('isDeleteMsg'), handleConfirm);
+        if (await confirm(t("isDeleteMsg"))) {
+          await handleConfirm();
+        }
       } else {
         const handleConfirm = async () => {
-          rswtChkDelete(data, searchYear);
+          const message = await rswtChkDelete(data, searchYear);
+          alert(message);
         };
-        confirmToast(t('isDeleteMsg'), handleConfirm);
+        if (await confirm(t("isDeleteMsg"))) {
+          await handleConfirm();
+        }
       }
     }
   };
-  const chkUpdateTable = (selFcltDiv: string) => {
+  const chkUpdateTable = async (selFcltDiv: string) => {
     if (selFcltDiv === "RNB") {
       if (updateRainDetail && updateRainDetail.length > 0) {
-        rainChkDetilUpdate(updateRainDetail, searchYear);
+        const message = await rainChkDetilUpdate(updateRainDetail, searchYear);
+        alert(message);
       } else {
-        toast.error("수정을 원하는 행을 선택하고 저장버튼을 눌러주세요 ");
+        alert("수정을 원하는 행을 선택하고 저장버튼을 눌러주세요 ");
       }
     } else {
       if (updateRswtDetail && updateRswtDetail.length > 0) {
-        rswtChkDetilsUpdate(updateRswtDetail, searchYear);
+        const message = await rswtChkDetilsUpdate(updateRswtDetail, searchYear);
+        alert(message);
       } else {
-        toast.error("수정을 원하는 행을 선택하고 저장버튼을 눌러주세요 ");
+        alert("수정을 원하는 행을 선택하고 저장버튼을 눌러주세요 ");
       }
     }
   };
@@ -330,7 +345,7 @@ export default function Page() {
                   <Button
                     className={btnClass}
                     onClick={() => {
-                      clickDelete(deleteIdx, selFcltDiv);
+                      void clickDelete(deleteIdx, selFcltDiv);
                     }}
                     disabled={delAuthrtYn === 'N'}
                   >
@@ -343,7 +358,7 @@ export default function Page() {
                         <Button
                           className={btnClass}
                           onClick={() => {
-                            chkUpdateTable(selFcltDiv);
+                            void chkUpdateTable(selFcltDiv);
                           }}
                           disabled={mdfcnAuthrtYn === 'N'}
                         >
@@ -434,7 +449,6 @@ export default function Page() {
           ></ChkgdExcel>
         }
       />
-      <Toaster position="top-center" />
     </ContentsDiv>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/pbnstPrfmncReg/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/pbnstPrfmncReg/page.tsx
index 4261ab657..4838624a2 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/pbnstPrfmncReg/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncReg/pbnstPrfmncReg/page.tsx
@@ -1,3 +1,6 @@
+/**
+ * 재이용실적등록 > 하수재이용실적등록
+ */
 "use client";
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
@@ -11,11 +14,11 @@ import {
   type PrfType,
 } from "@/app/store/prfmncReg/pbnstPrfmncReg/type";
 import {
-  confirmToast,
   excelDownload,
   yearOptions,
 } from "@/components/lib/func/common";
-import { InputTableBody } from "@/components/lib/func/TableData";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import { pbnstTableBody } from "@/components/lib/func/TableData";
 import PbnPrfExcelModal from "@/components/ui/modal/chkgd/pbnPrfExcelModal/pbnPrfExcelModal";
 import {
   ContentsDiv,
@@ -37,7 +40,7 @@ import {
   TableHeader,
 } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 import { headMakeprfmnc } from "../chkgdnReg/TableHead";
 
@@ -72,6 +75,8 @@ export default function PrfmncPrfmncReg() {
   const [searchYear, setSearchYear] = useState<string>(
     String(new Date().getFullYear())
   );
+  const { confirm } = useConfirm();
+  const alert = useAlertStore((state) => state.setMessage);
 
   const useInitRef = useRef(false);
 
@@ -85,11 +90,11 @@ export default function PrfmncPrfmncReg() {
   }, [prfmnc.excelList]);
 
   const { t } = useTranslation("base");
-  const onSave = useCallback(() => {
+  const onSave = useCallback(async () => {
     const handleConfirm = async () => {
       if (!pbnstRuseFcltId) return;
 
-      prfmnRegData(
+      const message = await prfmnRegData(
         1,
         laeSeCd,
         excelToPbnPrfData(
@@ -100,10 +105,13 @@ export default function PrfmncPrfmncReg() {
         searchYear,
         prfPbnFclts
       );
+      alert(message);
     };
 
-    confirmToast(t("isUpdateMsg"), handleConfirm);
-  }, [inputData, searchYear, pbnstRuseFcltId, cellNum, prfPbnFclts]);
+    if (await confirm(t("isUpdateMsg"))) {
+      await handleConfirm();
+    }
+  }, [inputData, searchYear, pbnstRuseFcltId, cellNum, prfPbnFclts, confirm, t, laeSeCd, prfmnRegData]);
 
   const cellClick = useCallback(
     (index: number | undefined) => {
@@ -274,7 +282,7 @@ export default function PrfmncPrfmncReg() {
                     <Button
                       className={btnClass}
                       onClick={() => {
-                        onSave();
+                        void onSave();
                       }}
                       disabled={mdfcnAuthrtYn === "N"}
                     >
@@ -284,7 +292,7 @@ export default function PrfmncPrfmncReg() {
                       className={btnClass}
                       onClick={() => {
                         if (cellNum === undefined) {
-                          toast.error("하수처리재이용시설을 선택해주세요.");
+                          alert("하수처리재이용시설을 선택해주세요.");
                           return;
                         } else {
                           setIsExcelOPen({ ...isExcelOpen, isModal: true });
@@ -350,7 +358,7 @@ export default function PrfmncPrfmncReg() {
                   {headMakeprfmnc(monthHeadList, [])}
                 </TableHeader>
                 <TableBody key={prfmnc.pageKey + "pageKey"}>
-                  {InputTableBody(
+                  {pbnstTableBody(
                     inputData ?? [],
                     monthHeadList,
                     setInputData,
@@ -371,7 +379,8 @@ export default function PrfmncPrfmncReg() {
               setIsExcelOPen({ ...isExcelOpen, isModal: open });
             }}
             setModalExcelData={async (excelData) => {
-              await prfmnRegData(1, laeSeCd, excelData, searchYear, prfPbnFclts);
+              const message = await prfmnRegData(1, laeSeCd, excelData, searchYear, prfPbnFclts);
+              alert(message);
               // 데이터 저장 후 UI 업데이트는 useEffect가 감지하여 처리하므로 여기서는 호출하지 않습니다.
             }}
           ></PbnPrfExcelModal>
@@ -381,7 +390,6 @@ export default function PrfmncPrfmncReg() {
           setIsExcelOPen({ ...isExcelOpen, isModal: false });
         }}
       ></UiModal>
-      <Toaster position="top-center" />
     </>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/chkgdnSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/chkgdnSttn/page.tsx
index 18a30d2be..4e675954a 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/chkgdnSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/chkgdnSttn/page.tsx
@@ -1,4 +1,4 @@
-"use client";
+"use client";
 
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
@@ -21,7 +21,7 @@ import {
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button, Label } from "@common/components/ui";
 import { useCallback, useEffect, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function Page() {
@@ -137,13 +137,14 @@ export default function Page() {
     [isModal]
   );
   const { t } = useTranslation("base");
+  const alert = useAlertStore((state) => state.setMessage);
   const excelDown = () => {
     if (rainChkSttn.sttnExcelList && selFcltDiv === "RNB") {
       if (
         !rainChkSttn.sttnExcelList ||
         rainChkSttn.sttnExcelList.length === 0
       ) {
-        toast.error(t("excelDownErrMsg"));
+        alert(t("excelDownErrMsg"));
         return;
       }
       // console.log(rainChkSttn.sttnExcelList);
@@ -165,7 +166,7 @@ export default function Page() {
         !rswtChkSttn.sttnExcelList ||
         rswtChkSttn.sttnExcelList.length === 0
       ) {
-        toast.error(t("excelDownErrMsg"));
+        alert(t("excelDownErrMsg"));
         return;
       }
       const sheetArray: SheetParameter[] = [{
@@ -307,7 +308,6 @@ export default function Page() {
           />
         }
       ></UiModal>
-      <Toaster position="top-center" />
     </ContentsDiv>
   );
 }
diff --git a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx
index 0754b656f..dc3348a0a 100644
--- a/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx
+++ b/apps/wr/app/(with-layout)/ruseFcltMng/prfmncSttn/pbnstPrfmncSttn/page.tsx
@@ -1,4 +1,4 @@
-"use client";
+"use client";
 
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
@@ -6,12 +6,12 @@ import { initValInUsage, initValOutUsage, subTotalObj, totalObj, type FcPrfType,
 import { excelPrfmncSttnParsing } from "@/app/store/prfmncSttn/pbnstPrfmncSttn/excel";
 import { excelDownloadNumStyle, yearOptions } from "@/components/lib/func/common";
 import { type SheetParameter } from "@common/business_components/ui";
-import { InputTableBody } from "@/components/lib/func/TableData";
+import { pbnstTableBody } from "@/components/lib/func/TableData";
 import { CHART_FORM, ContentsDiv, MainChart, ScrollArea, SearchBaseForm, SearchInput, SelectBox, UiTable, type ChartConfig, type ReturnType } from "@common/business_components";
 import ListDiv from "@common/business_components/ui/list_div";
 import { Label, Table, TableBody, TableHeader } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 import { headMakeprfmnc } from "../../prfmncReg/chkgdnReg/TableHead";
 
@@ -37,6 +37,7 @@ export default function PbnstPrfmncSttn() {
     // const [swtrmtFcltNm, setSwtrmtFcltNm] = useState<string>();
     const [pbnRuseNm, setPbnRuseNm] = useState<string>("");
     const { t } = useTranslation('base');
+    const alert = useAlertStore((state) => state.setMessage);
     const searchYear = String(new Date().getFullYear());
     const [excelData, setExcelData] = useState<any[]>([]);
     const [pageNation, setPageNation] = useState(1);
@@ -44,7 +45,7 @@ export default function PbnstPrfmncSttn() {
 
     const excelClick = useCallback(() => {
         if (!excelData || excelData.length === 0) {
-            toast.error(t('excelDownErrMsg'));
+            alert(t('excelDownErrMsg'));
             return;
         }
         const sheetArray: SheetParameter[] = [{
@@ -598,10 +599,10 @@ export default function PbnstPrfmncSttn() {
                                     const fromNum = Number(fromDate);
                                     const toNum = Number(toDate);
                                     if (fromNum > toNum) {
-                                        toast.error("시작년도가 종료년도 이후로 설정할 수 없습니다.");
+                                        alert("시작년도가 종료년도 이후로 설정할 수 없습니다.");
                                     } else {
                                         if (toNum - fromNum > 4) {
-                                            toast.error("최대 5년까지 선택 가능합니다.");
+                                            alert("최대 5년까지 선택 가능합니다.");
                                         } else {
                                             tableHeadMaker(fromNum, toNum);
 
@@ -635,6 +636,7 @@ export default function PbnstPrfmncSttn() {
                                 onPageChange={setPageNation}
                                 index={0}
                                 resetPageNo={resetPage}
+                                widthFixed={true}
                             />
 
                             <hr />
@@ -712,8 +714,8 @@ export default function PbnstPrfmncSttn() {
                                             {headMakeprfmnc(monthHeadList, [])}
                                         </TableHeader>
                                         <TableBody>
-                                            {/* {InputTableBody(prfData ?? [], monthHeadList, setPrfData)} */}
-                                            {InputTableBody(prfData ?? [], monthHeadList, setPrfData, false)}
+                                            {/* {pbnstTableBody(prfData ?? [], monthHeadList, setPrfData)} */}
+                                            {pbnstTableBody(prfData ?? [], monthHeadList, setPrfData, false)}
                                         </TableBody>
                                     </Table>
                                 </ScrollArea>
@@ -722,7 +724,6 @@ export default function PbnstPrfmncSttn() {
                     </div>
                 </div>
             </ContentsDiv>
-            <Toaster position="top-center" />
         </>
     )
 }
diff --git a/apps/wr/app/(with-layout)/stats/rainStat/page.tsx b/apps/wr/app/(with-layout)/stats/rainStat/page.tsx
index 72d339d24..332ae537f 100644
--- a/apps/wr/app/(with-layout)/stats/rainStat/page.tsx
+++ b/apps/wr/app/(with-layout)/stats/rainStat/page.tsx
@@ -1,4 +1,4 @@
-"use client";
+"use client";
 
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
@@ -17,7 +17,7 @@ import {
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components/ui";
 import { useEffect, useState } from "react";
-import toast from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function RainStat() {
@@ -30,6 +30,7 @@ export default function RainStat() {
   //const [exData, setExData] = useState<Array<Record<string, string | number>>>();
   const [bdstTable, setBdstTable] = useState<RainStatProps[]>();
   const { t } = useTranslation('base');
+  const alert = useAlertStore((state) => state.setMessage);
 
   useEffect(() => {
     searchRainStatList(searchYear ,code.cityCd);
@@ -184,7 +185,7 @@ export default function RainStat() {
       decimalArray0: [1,2,3,4,5,6,7,8,9,10,11,12], // 0부터 시작
     })
     }else{
-      toast.error(t('excelDownErrMsg'));
+      alert(t('excelDownErrMsg'));
     }
   }
 
diff --git a/apps/wr/app/(with-layout)/stats/rswtStat/page.tsx b/apps/wr/app/(with-layout)/stats/rswtStat/page.tsx
index 026c27a62..3e3e26dcf 100644
--- a/apps/wr/app/(with-layout)/stats/rswtStat/page.tsx
+++ b/apps/wr/app/(with-layout)/stats/rswtStat/page.tsx
@@ -1,4 +1,4 @@
-"use client";
+"use client";
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
 import type { RswtStatProps } from "@/app/store/stats/rswtStat";
@@ -15,7 +15,7 @@ import {
 import ListDiv from "@common/business_components/ui/list_div";
 import { Button } from "@common/components/ui";
 import { useEffect, useState } from "react";
-import toast, { Toaster } from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 import { useTranslation } from "react-i18next";
 
 export default function RswtStat() {
@@ -27,6 +27,7 @@ export default function RswtStat() {
   );
 
   const { t } = useTranslation('base');
+  const alert = useAlertStore((state) => state.setMessage);
   useEffect(() => {
     searchRswtStatList(searchYear, code.cityCd, code.rswtBdstType);
   }, [searchRswtStatList, code.cityCd])
@@ -62,7 +63,7 @@ export default function RswtStat() {
         decimalArray0: [1,2,3,4,5,6,7,8,9,10,11,12,13], // 0부터 시작
       })
     } else {
-      toast.error(t("excelDownErrMsg"))
+      alert(t("excelDownErrMsg"))
     }
   }
 
@@ -296,7 +297,6 @@ export default function RswtStat() {
           </ListDiv>
         </div>
       </div>
-      <Toaster position="top-center"></Toaster>
     </ContentsDiv>
   </>
   );
diff --git a/apps/wr/app/store/common/type/header.tsx b/apps/wr/app/store/common/type/header.tsx
index 75bf29433..9f116a9d1 100644
--- a/apps/wr/app/store/common/type/header.tsx
+++ b/apps/wr/app/store/common/type/header.tsx
@@ -3,6 +3,7 @@ export type CommonTableProps = {
   title: string;
   upName?: string;
   upSequnce?: number;
+  widthPercent?: number;
   row?: number;
   rowSpan?: number;
   colSpan?: number;
@@ -14,6 +15,7 @@ export type TableUpperProps = {
     title: string;
     upName?: string;
     upSequnce?: number;
+    widthPercent?: number;
     edit?:boolean;
     visible?:boolean; 
     rowSpan?: number;
diff --git a/apps/wr/app/store/matDmd/coMatRvw/headList.tsx b/apps/wr/app/store/matDmd/coMatRvw/headList.tsx
index 895ba5f89..c6ef94875 100644
--- a/apps/wr/app/store/matDmd/coMatRvw/headList.tsx
+++ b/apps/wr/app/store/matDmd/coMatRvw/headList.tsx
@@ -3,187 +3,46 @@ import type { CommonTableProps } from "../../common/type/header";
 
 
 export const coRvwHeadListExport: CommonTableProps[]= [
-  {
-    id: "cityText",
-    title: "시도",
-    visible: true,
-  },
-  {
-    id: "sggText",
-    title: "시군구",
-    visible: true,
-  },
-  {
-    id: "dmdCoNm",
-    title: "회사명",
-    visible: true,
-  },
-  {
-    id: "daddr",
-    title: "주소",
-    visible: true,
-  },
-  {
-    id: "telno",
-    title: "전화번호",
-    visible: true,
-  },
-  {
-    id: "dmndTmng", 
-    title: "신청일자",
-    visible: true,
-  },
-  {
-    id: "splyFcltFlg", 
-    title: "진행상태",
-    visible: true,
-  },
+  { id: "cityText", title: "시도", visible: true, widthPercent: 12, },
+  { id: "sggText", title: "시군구", visible: true, widthPercent: 8, },
+  { id: "dmdCoNm", title: "회사명", visible: true, widthPercent: 14, },
+  { id: "daddr", title: "주소", visible: true, widthPercent: 28, },
+  { id: "telno", title: "전화번호", visible: true, widthPercent: 12, },
+  { id: "dmndTmng", title: "신청일자", visible: true, widthPercent: 12, },
+  { id: "splyFcltFlg", title: "진행상태", visible: true, widthPercent: 14, },
 ];
 
 // id는 다확인해야함
 export const coRvwNodeListExport: CommonTableProps[] = [
-  {
-    id: "ctpv",
-    title: "시도",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "sgg",
-    title: "시군구",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "coNm",
-    title: "회사명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "addr",
-    title: "공장주소",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "telNo",
-    title: "전화번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "regDt", //바꾸기
-    title: "신청일자",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "state", //바꾸기
-    title: "진행상태",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
+  { id: "ctpv", title: "시도", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "sgg", title: "시군구", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "coNm", title: "회사명", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "addr", title: "공장주소", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "telNo", title: "전화번호", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "regDt", title: "신청일자", visible: true, row: 1, rowSpan: 1, colSpan: 1, }, //바꾸기
+  { id: "state", title: "진행상태", visible: true, row: 1, rowSpan: 1, colSpan: 1, }, //바꾸기
 ];
 
 export const constCostHeadListExport: CommonTableProps[] = [
-  {
-    id: "gubun",
-    title: "구분",
-    visible: true,
-  },
-  {
-    id: "500",
-    title: "500",
-    visible: true,
-  },
-  {
-    id: "1000",
-    title: "1,000",
-    visible: true,
-  },
-  {
-    id: "2000",
-    title: "2,000",
-    visible: true,
-  },
-  {
-    id: "3000", //바꾸기
-    title: "3,000",
-    visible: true,
-  },
-  {
-    id: "5000", //바꾸기
-    title: "5,000",
-    visible: true,
-  },
-  {
-    id: "10000", //
-    title: "10,000",
-    visible: true,
-  },
-  {
-    id: "20000", //
-    title: "20,000",
-    visible: true,
-  },
-  {
-    id: "30000", //
-    title: "30,000",
-    visible: true,
-  },
-  {
-    id: "50000", //
-    title: "50,000",
-    visible: true,
-  },
-  {
-    id: "100000", //바꾸기
-    title: "100,000",
-    visible: true,
-  },
+  { id: "gubun", title: "구분", visible: true, },
+  { id: "500", title: "500", visible: true, },
+  { id: "1000", title: "1,000", visible: true, },
+  { id: "2000", title: "2,000", visible: true, },
+  { id: "3000", title: "3,000", visible: true, }, //바꾸기
+  { id: "5000", title: "5,000", visible: true, }, //바꾸기
+  { id: "10000", title: "10,000", visible: true, }, //
+  { id: "20000", title: "20,000", visible: true, }, //
+  { id: "30000", title: "30,000", visible: true, }, //
+  { id: "50000", title: "50,000", visible: true, }, //
+  { id: "100000", title: "100,000", visible: true, }, //바꾸기
 ];
 
 export const rateFeeHeadListExport: CommonTableProps[] = [
-  {
-    id: "gubun",
-    title: "공사비/구분",
-    visible: true,
-  },
-  {
-    id: "BD",
-    title: "기본조사설계비",
-    visible: true,
-  },
-  {
-    id: "WD",
-    title: "실시설계비",
-    visible: true,
-  },
-  {
-    id: "SE",
-    title: "공사감리비",
-    visible: true,
-  },
-  {
-    id: "CE",
-    title: "시설부대비",
-    visible: true,
-  },
+  { id: "gubun", title: "공사비/구분", visible: true, },
+  { id: "BD", title: "기본조사설계비", visible: true, },
+  { id: "WD", title: "실시설계비", visible: true, },
+  { id: "SE", title: "공사감리비", visible: true, },
+  { id: "CE", title: "시설부대비", visible: true, },
 ];
 
 export const usageProcData = [
diff --git a/apps/wr/app/store/matDmd/coSttn/headList.tsx b/apps/wr/app/store/matDmd/coSttn/headList.tsx
index b3b87aac8..7786be658 100644
--- a/apps/wr/app/store/matDmd/coSttn/headList.tsx
+++ b/apps/wr/app/store/matDmd/coSttn/headList.tsx
@@ -6,6 +6,7 @@ export const sttnHeadListType = z.array(
   id: z.string(),
   title: z.string(),
   visible: z.boolean(),
+  widthPercent: z.number().optional(),
   })
 );
 
@@ -14,90 +15,20 @@ export const coRegExcel = z.object({
 });
 
 export const coSttHeadListExport: z.infer<typeof sttnHeadListType> = [
-  {
-    id: "cityText",
-    title: "시도",
-    visible: true,
-  },
-  {
-    id: "sggText",
-    title: "시군구",
-    visible: true,
-  },
-  {
-    id: "dmdCoNm",
-    title: "회사명",
-    visible: true,
-  },
-  {
-    id: "daddr",
-    title: "주소",
-    visible: true,
-  },
-  {
-    id: "dmdInfoId",
-    title: "사업자번호",
-    visible: true,
-  },
-  {
-    id: "telno",
-    title: "전화번호",
-    visible: true,
-  },
-  {
-    id: "regDt",
-    title: "등록일자",
-    visible: true,
-  },
+  { id: "cityText", title: "시도", visible: true, widthPercent: 8 },
+  { id: "sggText", title: "시군구", visible: true, widthPercent: 8 },
+  { id: "dmdCoNm", title: "회사명", visible: true, widthPercent: 18 },
+  { id: "daddr", title: "주소", visible: true, widthPercent: 28 },
+  { id: "dmdInfoId", title: "사업자번호", visible: true, widthPercent: 14 },
+  { id: "telno", title: "전화번호", visible: true, widthPercent: 12 },
+  { id: "regDt", title: "등록일자", visible: true, widthPercent: 12, },
 ];
 
 export const coSttNodeListExport: CommonTableProps[] = [
-  {
-    id: "cityText",
-    title: "시도",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "sggText",
-    title: "시군구",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "dmdCoNm",
-    title: "회사명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "daddr",
-    title: "주소",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "dmdInfoId",
-    title: "사업자번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "telno",
-    title: "전화번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-];
\ No newline at end of file
+  { id: "cityText", title: "시도", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "sggText", title: "시군구", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "dmdCoNm", title: "회사명", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "daddr", title: "주소", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "dmdInfoId", title: "사업자번호", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "telno", title: "전화번호", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+];
diff --git a/apps/wr/app/store/matDmd/drgtSttn/headList.tsx b/apps/wr/app/store/matDmd/drgtSttn/headList.tsx
index dcdc655b5..34fb7db6f 100644
--- a/apps/wr/app/store/matDmd/drgtSttn/headList.tsx
+++ b/apps/wr/app/store/matDmd/drgtSttn/headList.tsx
@@ -15,87 +15,17 @@ export const drgtZod = z.object({
 })
 
 export const drgtHeadListExport: CommonTableProps[] = [
-  {
-    id: "ctpvCd",
-    title: "시도",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "sggNm",
-    title: "시군구",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "normal",
-    title: "정상(횟수)",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "attention",
-    title: "관심(횟수)",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "caution",
-    title: "주의(횟수)",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "warning",
-    title: "관심+주의(횟수)",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "ranking",
-    title: "가뭄순위",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
+  { id: "ctpvCd", title: "시도", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "sggNm", title: "시군구", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "normal", title: "정상(횟수)", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "attention", title: "관심(횟수)", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "caution", title: "주의(횟수)", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "warning", title: "관심+주의(횟수)", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "ranking", title: "가뭄순위", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
 ];
 
 export const drgtDetailHeadListExport: CommonTableProps[] = [
-  {
-    id: "year",
-    title: "년",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "month",
-    title: "월",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "drgtState",
-    title: "가뭄상태",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-]
\ No newline at end of file
+  { id: "year", title: "년", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "month", title: "월", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+  { id: "drgtState", title: "가뭄상태", visible: true, row: 1, rowSpan: 1, colSpan: 1, },
+]
diff --git a/apps/wr/app/store/matDmd/ldrmntCoSttn/headList.tsx b/apps/wr/app/store/matDmd/ldrmntCoSttn/headList.tsx
index bb7c79024..88dbf1e4d 100644
--- a/apps/wr/app/store/matDmd/ldrmntCoSttn/headList.tsx
+++ b/apps/wr/app/store/matDmd/ldrmntCoSttn/headList.tsx
@@ -46,359 +46,51 @@ export const ldrmntZod = z.object({
 })
 
 export const ldrmntHeadListExport: CommonTableProps[] = [
- {
-    id: "ctpvCd",
-    title: "시도",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "sggCd",
-    title: "시군구",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "dmdCoNm",
-    title: "회사명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctryAddr",
-    title: "회사주소",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctryMngNo",
-    title: "공장관리번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-   {
-    id: "telno",
-    title: "전화번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
+ { id: "ctpvCd", title: "시도", visible: true, row: 1, rowSpan: 1, colSpan: 1, widthPercent: 8, },
+  { id: "sggCd", title: "시군구", visible: true, row: 1, rowSpan: 1, colSpan: 1, widthPercent: 8 },
+  { id: "dmdCoNm", title: "회사명", visible: true, row: 1, rowSpan: 1, colSpan: 1, widthPercent: 18 },
+  { id: "fctryAddr", title: "회사주소", visible: true, row: 1, rowSpan: 1, colSpan: 1, widthPercent: 30 },
+  { id: "fctryMngNo", title: "공장관리번호", visible: true, row: 1, rowSpan: 1, colSpan: 1, widthPercent: 18 },
+  { id: "telno", title: "전화번호", visible: true, row: 1, rowSpan: 1, colSpan: 1, widthPercent: 18 },
 ]
 
 export const ldrmntNodeListExport: CommonTableProps[] = [
-  {
-    id: "ctpvCd",
-    title: "시도",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "sggCd",
-    title: "시군구",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "mngInstNm",
-    title: "관리기관",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "dmdCoNm",
-    title: "회사명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctrySe",
-    title: "공장구분",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "cmpxNm",
-    title: "단지명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fndnSe",
-    title: "설립구분",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "mvnShp",
-    title: "입주형태",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "hldSe",
-    title: "보유구분",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "frstAprvYmd",
-    title: "최초승인일",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "frstRegYmd",
-    title: "최초등록일",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "regSe",
-    title: "등록구분",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "regYmd",
-    title: "등록일",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "telno",
-    title: "전화번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "maleEmpCnt",
-    title: "남자종업원",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fmaleEmpCnt",
-    title: "여자종업원",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "frgnrMaleEmpCnt",
-    title: "외국인남자종업원",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "frgnrFmaleEmpCnt",
-    title: "외국인여자종업원",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "totalEmpCnt",
-    title: "종업원합계",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "prdctnItem",
-    title: "생산품",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "splyMtrl",
-    title: "원자재",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctryScl",
-    title: "공장규모",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "usgRgn",
-    title: "용도지역",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "ldcg",
-    title: "지목",
-    visible: true,
-    row: 1,
-    rowSpan: 1, 
-    colSpan: 1,
-  },
-  {
-    id: "usgRgnArea",
-    title: "용지면적(m²)",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "mnftrFcltArea",
-    title: "제조시설면적",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "sbsdFcltArea",
-    title: "부대시설면적",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "archArea",
-    title: "건축면적",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "knwlIndstCntrNm",
-    title: "지식산업센터명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "rprsTpbiz",
-    title: "대표업종",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "tpbizNm",
-    title: "업종명",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "tpbizCd",
-    title: "업종코드",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "cycl",
-    title: "차수",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "corpAddr",
-    title: "법인주소",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "esntlIdx",
-    title: "필지수",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctryAddr",
-    title: "공장주소",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctryLotnoAddr",
-    title: "공장주소_지번",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-  {
-    id: "fctryMngNo",
-    title: "공장관리번호",
-    visible: true,
-    row: 1,
-    rowSpan: 1,
-    colSpan: 1,
-  },
-];
\ No newline at end of file
+  { id: "ctpvCd", title: "시도", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "sggCd", title: "시군구", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "mngInstNm", title: "관리기관", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "dmdCoNm", title: "회사명", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fctrySe", title: "공장구분", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "cmpxNm", title: "단지명", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fndnSe", title: "설립구분", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "mvnShp", title: "입주형태", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "hldSe", title: "보유구분", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "frstAprvYmd", title: "최초승인일", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "frstRegYmd", title: "최초등록일", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "regSe", title: "등록구분", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "regYmd", title: "등록일", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "telno", title: "전화번호", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "maleEmpCnt", title: "남자종업원", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fmaleEmpCnt", title: "여자종업원", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "frgnrMaleEmpCnt", title: "외국인남자종업원", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "frgnrFmaleEmpCnt", title: "외국인여자종업원", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "totalEmpCnt", title: "종업원합계", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "prdctnItem", title: "생산품", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "splyMtrl", title: "원자재", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fctryScl", title: "공장규모", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "usgRgn", title: "용도지역", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "ldcg", title: "지목", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "usgRgnArea", title: "용지면적(m²)", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "mnftrFcltArea", title: "제조시설면적", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "sbsdFcltArea", title: "부대시설면적", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "archArea", title: "건축면적", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "knwlIndstCntrNm", title: "지식산업센터명", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "rprsTpbiz", title: "대표업종", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "tpbizNm", title: "업종명", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "tpbizCd", title: "업종코드", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "cycl", title: "차수", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "corpAddr", title: "법인주소", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "esntlIdx", title: "필지수", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fctryAddr", title: "공장주소", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fctryLotnoAddr", title: "공장주소_지번", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+  { id: "fctryMngNo", title: "공장관리번호", visible: true, row: 1, rowSpan: 1, colSpan: 1 },
+];
diff --git a/apps/wr/app/store/matDmd/ruseCaseMng/headList.tsx b/apps/wr/app/store/matDmd/ruseCaseMng/headList.tsx
index c201f5d28..003b32caa 100644
--- a/apps/wr/app/store/matDmd/ruseCaseMng/headList.tsx
+++ b/apps/wr/app/store/matDmd/ruseCaseMng/headList.tsx
@@ -2,358 +2,63 @@ import type { SelectDataType } from "@common/business_components/ui";
 import type { TableUpperProps } from "../../common/type/header";
 
 export const ruseCaseHeadListExport: TableUpperProps[] = [
-  {
-    id: "ruseBizNm",
-    title: "사업명",
-    visible: true,
-    row: 0,
-    rowSpan: 2,
-  },
-  {
-    id: "bizBgngDate",
-    title: "사업시작년",
-    visible: true,
-    row: 0,
-    rowSpan: 2,
-  },
-  {
-    id: "bizEndDate",
-    title: "사업종료년",
-    visible: true,
-    row: 0,
-    rowSpan: 2,
-  },
-  {
-    id: "c",
-    title: "공급처",
-    visible: true,
-    row: 0,
-    colSpan: 3,
-  },
-  {
-    id: "splyFcltKnd",
-    title: "시설종류",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "splyFcltNm",
-    title: "공급처명",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "splyFcltCpct",
-    title: "시설용량(m³/일)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "g",
-    title: "수요처",
-    visible: true,
-    row: 0,
-    colSpan: 2,
-  },
-  {
-    id: "dmdFcltNm",
-    title: "수요처명",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "dmdFcltAddr",
-    title: "주소",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "q",
-    title: "재이용시설",
-    visible: true,
-    row: 0,
-    colSpan: 5,
-  },
-  {
-    id: "ruseFcltCpct",
-    title: "시설용량(m³/일)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "ruseFcltPplLen",
-    title: "관로(km)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "ruseFcltUsg",
-    title: "용도",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "ruseFcltSplyCpct",
-    title: "공급량(m³/일)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "ruseFcltPrcsMsrc",
-    title: "처리공법",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "k",
-    title: "보증수질",
-    visible: true,
-    row: 0,
-    colSpan: 13,
-  },
-  {
-    id: "grnteWqUsg",
-    title: "용도별",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqGrssClfg",
-    title: "총대장균군수​(개/100ml)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqCombResdch",
-    title: "결합잔류염소(mg/L)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqTrbt",
-    title: "탁도(NTU)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqBod",
-    title: "생물학적​산소요구량(BOD)(mg/L)​",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqSmll",
-    title: "냄새​",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqCrmty",
-    title: "색도​",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqTn",
-    title: "총질소(T-N)(mg/L)​",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqTp",
-    title: "총인(T-P)(mg/L)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqPh",
-    title: "수소이온농도(pH)​",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqClIonQnt",
-    title: "염화물",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqCndctStat",
-    title: "전기전도도​(㎲/cm)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "grnteWqRmrk",
-    title: "비고​",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "h",
-    title: "소요사업비(백만원)",
-    visible: true,
-    row: 0,
-    colSpan: 14,
-  },
-  {
-    id: "reqBizGrssCst",
-    title: "총",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizReuseFcltCst",
-    title: "토목재이용시설",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizPplCst",
-    title: "토목관로",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizArchCst",
-    title: "건축",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizMchnCst",
-    title: "기계",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizMtrngCst",
-    title: "전기・계측",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizGisCst",
-    title: "GIS・DB",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizCctvCst",
-    title: "CCTV",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizCmcnCst",
-    title: "시공및준공",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizWstCst",
-    title: "페기물",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizDesignCst",
-    title: "설계비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizSpvsCst",
-    title: "감리비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizSbsdCst",
-    title: "시설부대비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "reqBizEtc",
-    title: "기타",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "i",
-    title: "자원조달계획(백만원)",
-    visible: true,
-    row: 0,
-    colSpan: 5,
-  },
-  {
-    id: "prcmPlanGrssCst",
-    title: "총",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "prcmPlanNlep",
-    title: "국비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "prcmPlanLcep",
-    title: "지방비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "prcmPlanBrdnCst",
-    title: "원인자부담",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "prcmPlanEcqrRt",
-    title: "국고비율(%)",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "j",
-    title: "사업비정산(백만원)",
-    visible: true,
-    row: 0,
-    colSpan: 5,
-  },
-  {
-    id: "clclnGrssCst",
-    title: "총",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "clclnNlep",
-    title: "국비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "clclnLcep",
-    title: "지방비",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "clclnBrdnCst",
-    title: "원인자부담",
-    visible: true,
-    row: 1,
-  },
-  {
-    id: "clclnEcqrRt",
-    title: "국고비율(%)",
-    visible: true,
-    row: 1,
-  },
+  { id: "ruseBizNm", title: "사업명", visible: true, row: 0, rowSpan: 2, widthPercent: 6, },
+  { id: "bizBgngDate", title: "사업시작년", visible: true, row: 0, rowSpan: 2, widthPercent: 2, },
+  { id: "bizEndDate", title: "사업종료년", visible: true, row: 0, rowSpan: 2, widthPercent: 2, },
+  { id: "c", title: "공급처", visible: true, row: 0, colSpan: 3, },
+  { id: "splyFcltKnd", title: "시설종류", visible: true, row: 1, widthPercent: 2, },
+  { id: "splyFcltNm", title: "공급처명", visible: true, row: 1, widthPercent: 5, },
+  { id: "splyFcltCpct", title: "시설용량\n(m³/일)", visible: true, row: 1, widthPercent: 3, },
+  { id: "g", title: "수요처", visible: true, row: 0, colSpan: 2, },
+  { id: "dmdFcltNm", title: "수요처명", visible: true, row: 1, widthPercent: 4, },
+  { id: "dmdFcltAddr", title: "주소", visible: true, row: 1, widthPercent: 7, },
+  { id: "q", title: "재이용시설", visible: true, row: 0, colSpan: 5, },
+  { id: "ruseFcltCpct", title: "시설용량\n(m³/일)", visible: true, row: 1, widthPercent: 1.5, },
+  { id: "ruseFcltPplLen", title: "관로(km)", visible: true, row: 1, widthPercent: 1.5, },
+  { id: "ruseFcltUsg", title: "용도", visible: true, row: 1, widthPercent: 3, },
+  { id: "ruseFcltSplyCpct", title: "공급량\n(m³/일)", visible: true, row: 1, widthPercent: 2, },
+  { id: "ruseFcltPrcsMsrc", title: "처리공법", visible: true, row: 1, widthPercent: 3, },
+  { id: "k", title: "보증수질", visible: true, row: 0, colSpan: 13, },
+  { id: "grnteWqUsg", title: "용도별", visible: true, row: 1, widthPercent: 2, },
+  { id: "grnteWqGrssClfg", title: "총대장균군수​\n(개/100ml)", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqCombResdch", title: "결합잔류염소\n(mg/L)", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqTrbt", title: "탁도(NTU)", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqBod", title: "생물학적​산소요구량\n(BOD)(mg/L)​", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqSmll", title: "냄새​", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqCrmty", title: "색도​", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqTn", title: "총질소(T-N)(mg/L)​", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqTp", title: "총인(T-P)(mg/L)", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqPh", title: "수소이온농도(pH)​", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqClIonQnt", title: "염화물", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqCndctStat", title: "전기전도도​(㎲/cm)", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "grnteWqRmrk", title: "비고​", visible: true, row: 1, widthPercent: 1.92, },
+  { id: "h", title: "소요사업비(백만원)", visible: true, row: 0, colSpan: 14, },
+  { id: "reqBizGrssCst", title: "총", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizReuseFcltCst", title: "토목재이용시설", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizPplCst", title: "토목관로", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizArchCst", title: "건축", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizMchnCst", title: "기계", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizMtrngCst", title: "전기・계측", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizGisCst", title: "GIS・DB", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizCctvCst", title: "CCTV", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizCmcnCst", title: "시공및준공", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizWstCst", title: "페기물", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizDesignCst", title: "설계비", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizSpvsCst", title: "감리비", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizSbsdCst", title: "시설부대비", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "reqBizEtc", title: "기타", visible: true, row: 1, widthPercent: 1.43, },
+  { id: "i", title: "자원조달계획(백만원)", visible: true, row: 0, colSpan: 5, },
+  { id: "prcmPlanGrssCst", title: "총", visible: true, row: 1, widthPercent: 1.6, },
+  { id: "prcmPlanNlep", title: "국비", visible: true, row: 1, widthPercent: 1.6, },
+  { id: "prcmPlanLcep", title: "지방비", visible: true, row: 1, widthPercent: 1.6, },
+  { id: "prcmPlanBrdnCst", title: "원인자부담", visible: true, row: 1, widthPercent: 1.6, },
+  { id: "prcmPlanEcqrRt", title: "국고비율(%)", visible: true, row: 1, widthPercent: 1.6, },
+  { id: "j", title: "사업비정산(백만원)", visible: true, row: 0, colSpan: 5, },
+  { id: "clclnGrssCst", title: "총", visible: true, row: 1, widthPercent: 2, },
+  { id: "clclnNlep", title: "국비", visible: true, row: 1, widthPercent: 1.5, },
+  { id: "clclnLcep", title: "지방비", visible: true, row: 1, widthPercent: 1.5, },
+  { id: "clclnBrdnCst", title: "원인자부담", visible: true, row: 1, widthPercent: 1.5, },
+  { id: "clclnEcqrRt", title: "국고비율(%)", visible: true, row: 1, widthPercent: 1.5, },
 ];
 
 export const ruseUtzType: SelectDataType[] = [
diff --git a/apps/wr/app/store/matDmd/ruseRvwHstry/headList.tsx b/apps/wr/app/store/matDmd/ruseRvwHstry/headList.tsx
index e2873d573..c7b1c2c53 100644
--- a/apps/wr/app/store/matDmd/ruseRvwHstry/headList.tsx
+++ b/apps/wr/app/store/matDmd/ruseRvwHstry/headList.tsx
@@ -2,71 +2,18 @@ import type {  TableUpperProps } from "../../common/type/header";
 
 
 export const ruseHstryHeadListExport:TableUpperProps[]= [
-  {
-    id: "cityText",
-    title: "시도",
-    visible: true,
-
-  },
-  {
-    id: "sggText",
-    title: "시군구",
-    visible: true,
-  },
-  {
-    id: "dmdCoNm",
-    title: "회사명",
-    visible: true,
-  },
-  {
-    id: "daddr",
-    title: "주소",
-    visible: true,
-  },
-  {
-    id: "telno",
-    title: "전화번호",
-    visible: true,
-  },
-  {
-    id: "dmndTmng", //바꾸기
-    title: "신청일자",
-    visible: true,
-  },
-  {
-    id: "rvwCmptnYmd", //바꾸기
-    title: "검토일자",
-    visible: true,
-  },
-  {
-    id: "mtchnCmptnYmd", //바꾸기
-    title: "매칭 완료일자",
-    visible: true,
-  },
-  {
-    id: "ruseUtztnFcltNm", //바꾸기
-    title: "공급처",
-    visible: true,
-  },
-  {
-    id: "dmndQty", //바꾸기
-    title: "요구수량(m³/일)",
-    visible: true,
-  },
-  {
-    id: "useUsgCd", //바꾸기
-    title: "사용용도",
-    visible: true,
-  },
-  {
-    id: "splyFcltFlg", //바꾸기
-    title: "진행상태",
-    visible: true,
-  },
-  {
-    id: "completeYn", //바꾸기
-    title: "매칭완료 여부",
-    visible: true,
-  },
+  { id: "cityText", title: "시도", visible: true, widthPercent: 8, },
+  { id: "sggText", title: "시군구", visible: true, widthPercent: 6, },
+  { id: "dmdCoNm", title: "회사명", visible: true, widthPercent: 10, },
+  { id: "daddr", title: "주소", visible: true, widthPercent: 16, },
+  { id: "telno", title: "전화번호", visible: true, widthPercent: 8, },
+  { id: "dmndTmng", title: "신청일자", visible: true, widthPercent: 7, }, //바꾸기
+  { id: "rvwCmptnYmd", title: "검토일자", visible: true, widthPercent: 7, }, //바꾸기
+  { id: "mtchnCmptnYmd", title: "매칭 완료일자", visible: true, widthPercent: 7, }, //바꾸기
+  { id: "ruseUtztnFcltNm", title: "공급처", visible: true, widthPercent: 10, }, //바꾸기
+  { id: "dmndQty", title: "요구수량\n(m³/일)", visible: true, widthPercent: 6, }, //바꾸기
+  { id: "useUsgCd", title: "사용용도", visible: true, widthPercent: 5, }, //바꾸기
+  { id: "splyFcltFlg", title: "진행상태", visible: true, widthPercent: 5, }, //바꾸기
+  { id: "completeYn", title: "매칭완료 여부", visible: true, widthPercent: 5, }, //바꾸기
 ];
 
diff --git a/apps/wr/app/store/matDmd/ruseRvwHstry/index.tsx b/apps/wr/app/store/matDmd/ruseRvwHstry/index.tsx
index c490dc399..352cbcadc 100644
--- a/apps/wr/app/store/matDmd/ruseRvwHstry/index.tsx
+++ b/apps/wr/app/store/matDmd/ruseRvwHstry/index.tsx
@@ -1,5 +1,4 @@
 import { fetchType, getFetchWithCount, postFectch, putFectch } from "@/components/lib/api";
-import toast from "react-hot-toast";
 import type {
   TableUpperProps
 } from "../../common/type/header";
@@ -52,7 +51,7 @@ type ruseHstryActions = {
     endYear: string,
     sggCd?: string
   ) => void;
-  ruseRvwCalUpdate: (data: DmdCoReqType) => void;
+  ruseRvwCalUpdate: (data: DmdCoReqType) => Promise<string>;
   ruseRvwSearch: (
     pageNo: number,
     pageCnt: number,
@@ -69,7 +68,7 @@ type ruseHstryActions = {
     endYear: string,
     sggCd: string
   ) => void;
-  ruseRvwComplete:( data: number[]) => void;
+  ruseRvwComplete:( data: number[]) => Promise<string>;
 };
 
 const irvwHistInit = async (
@@ -119,6 +118,8 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
       }));
     },
     ruseRvwCalUpdate: async (data: DmdCoReqType) => {
+      const successMessage = "매칭 계산 저장이 완료입니다.";
+      const failMessage = "매칭 계산 저장이 오류입니다.";
       try {
 
         const updatedData = addRgtrAndMdfrToDemandObj(data);
@@ -127,14 +128,13 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
          updatedData
         );
         if (update.status === 200) {
-          toast.success("매칭 계산 저장이 완료입니다.");
           const rvwHistRes = await irvwHistInit(
             1,
             13,
             new Date().getFullYear().toString(),
             new Date().getFullYear().toString(),
           );
-          return set((state: ruseHstryState) => ({
+          set((state: ruseHstryState) => ({
             ...state,
             ruseHist: {
               ...state.ruseHist,
@@ -142,10 +142,12 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
               rvwHistRes: rvwHistRes.data,
               rvwHistCount:rvwHistRes.count            },
           }));
+          return successMessage;
         }
+        return failMessage;
       } catch (e) {
-        toast.error("매칭 계산 저장이 오류입니다.");
         console.log(e);
+        return failMessage;
       }
     },
     ruseRvwSearch: async (
@@ -210,6 +212,8 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
       }
     },
     ruseRvwComplete: async (data: number[]) => {
+      const successMessage = "매칭완료가  완료되었습니다.";
+      const failMessage = "매칭 완료 처리 중 오류가 발생했습니다.";
       try {
         const complet = await postFectch(
           `/reuseFc/request/completeCheck`,
@@ -217,7 +221,6 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
           fetchType.WR
         );
         if (complet.status === 200) {
-          toast.success("매칭완료가  완료되었습니다.");
           const rvwHistRes = await irvwHistInit(
             1,
             13,
@@ -225,7 +228,7 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
             new Date().getFullYear().toString(),
           );
 
-          return set((state: ruseHstryState) => ({
+          set((state: ruseHstryState) => ({
             ...state,
             ruseHist: {
               ...state.ruseHist,
@@ -233,10 +236,12 @@ export const ruseHstryActionsExport: (set: any) => ruseHstryActions = (
               rvwHistCount:rvwHistRes.count  
             },
           }));
+          return successMessage;
         }
+        return failMessage;
       } catch (e) {
         console.log(" error ", e);
-        toast.error("매칭 완료 처리 중 오류가 발생했습니다.");
+        return failMessage;
       }
     },
   };
diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/excel.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/excel.tsx
index c9f3fe4f3..dc7612292 100644
--- a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/excel.tsx
+++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/excel.tsx
@@ -1,4 +1,4 @@
-import { TEST_UUID } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
+import { TEST_UUID } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
 import type { SelectDataType } from "@common/business_components";
 import type { rainChkZodType } from ".";
 import {
@@ -6,7 +6,6 @@ import {
   isInvalidNumber,
   parseRawValue,
 } from "@/components/lib/func/excelFunc";
-import toast from "react-hot-toast";
 import { codeToText, textToCode } from "@/components/lib/func/common";
 export const useTypes = [
   "조경용수",
@@ -232,14 +231,21 @@ export const excelToRainChkData = (excelData: any, year: string) => {
         }
       });
     });
-  } else {
-    toast.error("데이터가 없습니다. 점검 데이터를 확인해주세요.");
   }
 
   if (issues.length > 0) {
-    return { rainChkgdData: [], issues };
+    return { rainChkgdData: [], issues, message: "" };
   }
 
-  return { rainChkgdData, issues: [] };
+  if (rainChkgdData.length === 0) {
+    return {
+      rainChkgdData: [],
+      issues: [],
+      message: "데이터가 없습니다. 점검 데이터를 확인해주세요.",
+    };
+  }
+
+  return { rainChkgdData, issues: [], message: "" };
 };
 
+
diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList.tsx
index b615b6532..538135d0a 100644
--- a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList.tsx
+++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList.tsx
@@ -137,68 +137,25 @@ export const rainSplHeadNmExport: chHeadType[] = [
 ];
 
 export const rainChkgdnHeadListExport: TableUpperProps[] = [
-  { id: "order", title: "순번", mergeCell: true },
-  { id: "checkBox", title: "선택", mergeCell: true },
-  { id: "cityText", title: "시도", mergeCell: true },
-  { id: "sggText", title: "시군구", mergeCell: true },
-  { id: "bdstNm", title: "시설명", mergeCell: true },
-  { id: "operMngCdText", title: "운영관리형태", mergeCell: true },
-  { id: "oilqMeasMthdText", title: "유량측정방법", mergeCell: true },
-  { id: "anlOperCst", title: "연간운영비(원/년)", mergeCell: true },
-  { id: "dtfcltCpct", title: "빗물저류조용량(m³)", mergeCell: true },
-  { id: "chckYmd", title: "점검일", mergeCell: true },
-  { id: "utztnUsgCdText", title: "이용용도" },
-  { id: "totalSplyUswtrUtztnQnt", title: "연간대체수이용량(m³)" },
-  { id: "totalRuseFcltUtztnQnt", title: "연간빗물이용량(m³)" },
-  {
-    id: "ph",
-    title: "수소이온농도(pH)",
-    upName: "useQuilty",
-    upSequnce: 1,
-    type: "number",
-    edit: true,
-  },
-  {
-    id: "trbt",
-    title: "탁도(NTU)",
-    upName: "useQuilty",
-    upSequnce: 2,
-    type: "number",
-    edit: true,
-  },
-  {
-    id: "grssClfg",
-    title: "총대장균군수(개/mg)",
-    upName: "useQuilty",
-    upSequnce: 3,
-    type: "number",
-    edit: true,
-  },
-  
-  {
-    id: "vltnDt",
-    title: "부과일(위반일)",
-    upName: "feeHist",
-    upSequnce: 1,
-    type: "text",
-    edit: true,
-  },
-  {
-    id: "vltnMttr",
-    title: "위반사항",
-    upName: "feeHist",
-    upSequnce: 2,
-    type: "text",
-    edit: true,
-  },
-  {
-    id: "levyAmt",
-    title: "부과금액(천원)",
-    upName: "feeHist",
-    upSequnce: 3,
-    type: "text",
-    edit: true,
-  },
+  { id: "order", title: "순번", mergeCell: true, widthPercent: 4 },
+  { id: "checkBox", title: "선택", mergeCell: true, widthPercent: 4 },
+  { id: "cityText", title: "시도", mergeCell: true, widthPercent: 5 },
+  { id: "sggText", title: "시군구", mergeCell: true, widthPercent: 5 },
+  { id: "bdstNm", title: "시설명", mergeCell: true, widthPercent: 7 },
+  { id: "operMngCdText", title: "운영관리형태", mergeCell: true, widthPercent: 6 },
+  { id: "oilqMeasMthdText", title: "유량측정방법", mergeCell: true, widthPercent: 6 },
+  { id: "anlOperCst", title: "연간운영비(원/년)", mergeCell: true, widthPercent: 7 },
+  { id: "dtfcltCpct", title: "빗물저류조용량(m³)", mergeCell: true, widthPercent: 6 },
+  { id: "chckYmd", title: "점검일", mergeCell: true, widthPercent: 5 },
+  { id: "utztnUsgCdText", title: "이용용도", widthPercent: 5 },
+  { id: "totalSplyUswtrUtztnQnt", title: "연간대체수이용량(m³)", widthPercent: 7 },
+  { id: "totalRuseFcltUtztnQnt", title: "연간빗물이용량(m³)", widthPercent: 7 },
+  { id: "ph", title: "수소이온농도(pH)", upName: "useQuilty", upSequnce: 1, type: "number", edit: true, widthPercent: 5 },
+  { id: "trbt", title: "탁도(NTU)", upName: "useQuilty", upSequnce: 2, type: "number", edit: true, widthPercent: 4 },
+  { id: "grssClfg", title: "총대장균군수(개/mg)", upName: "useQuilty", upSequnce: 3, type: "number", edit: true, widthPercent: 5 },
+  { id: "vltnDt", title: "부과일(위반일)", upName: "feeHist", upSequnce: 1, type: "text", edit: true, widthPercent: 5 },
+  { id: "vltnMttr", title: "위반사항", upName: "feeHist", upSequnce: 2, type: "text", edit: true, widthPercent: 6 },
+  { id: "levyAmt", title: "부과금액(천원)", upName: "feeHist", upSequnce: 3, type: "text", edit: true, widthPercent: 5 },
 ];
 
 export const ruseHeadListExport: TableUpperProps[] = [
diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx
index 9c36c4b57..42b1022df 100644
--- a/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx
+++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rainChkgdn/index.tsx
@@ -1,4 +1,4 @@
-import { buildingType } from "@/app/store/common/code";
+import { buildingType } from "@/app/store/common/code";
 import type { TableUpperProps } from "@/app/store/common/type/header";
 import { TEST_UUID } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
 import {
@@ -10,7 +10,6 @@ import {
   putFectch,
 } from "@/components/lib/api";
 import type { SelectDataType } from "@common/business_components/ui";
-import toast from "react-hot-toast";
 import { z } from "zod";
 import { buildingToExcelType } from "./excel";
 import {
@@ -67,15 +66,15 @@ type rainChkgdnActions = {
     sggCd: string,
     searchTxt: string
   ) => void;
-  rainChkDetilUpdate(rainChk: rainChkZodType[] ,year:string) : Promise<void>;
-  rainChkGuidUpdate(rainChk: rainChkZodType): Promise<void>;
+  rainChkDetilUpdate(rainChk: rainChkZodType[] ,year:string) : Promise<string>;
+  rainChkGuidUpdate(rainChk: rainChkZodType): Promise<string>;
   rainChkExcelDownload(
     sidoCode: SelectDataType[],
     sggCode: SelectDataType[],
     sggCd:string
   ): Promise<void>;
-  rainChkExcelDataUPload(excelData: rainChkZodType[] ,year :string,laeSeCd:string) : Promise<void>;
-  rainChkDelete(chkgdnSns: number[] ,year :string): Promise<void>;
+  rainChkExcelDataUPload(excelData: rainChkZodType[] ,year :string,laeSeCd:string) : Promise<string>;
+  rainChkDelete(chkgdnSns: number[] ,year :string): Promise<string>;
   rainChkHeadChange: (rainChkgdn: rainChkgdnState, isEdit: boolean) => void;
   rainChkNmSearch: (
     pageNo: number,
@@ -168,6 +167,8 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
       }));
     },
     rainChkExcelDataUPload: async (excelData: rainChkZodType[] ,year:string,laeSeCd:string) => {
+      const successMessage = "지도점검 등록이 완료되었습니다.";
+      const failMessage = "지도점검 등록이 실패되었습니다.";
       set((state: rainChkgdnType) => (
         { rainChkgdn: { ...state.rainChkgdn, isLoading: true } }));
       try {
@@ -187,13 +188,12 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
               rainChkCount: rainChkRes.count,
             },
           }));
-          toast.success("지도점검 등록이 완료되었습니다.");
-        } else {
-          toast.error("지도점검 등록이 실패되었습니다.");
+          return successMessage;
         }
+        return failMessage;
       } catch (error) {
         console.log(error);
-        toast.error("지도점검 등록이 실패되었습니다.");
+        return failMessage;
       } finally {
         set((state: rainChkgdnType) => ({ rainChkgdn: { ...state.rainChkgdn, isLoading: false } }));
       }
@@ -257,21 +257,20 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
       }
     },
     rainChkDetilUpdate: async (rainChk: rainChkZodType[] ,year:string) => {
+      const successMessage = "지도점검 대체수 및 빗물이용량 수정이 완료되었습니다. ";
+      const failMessage = "지도점검 대체수 및 빗물이용량 수정 오류입니다.";
       try {
         const chData = await makeMdfrChk(rainChk, "rain");
 
         const res = await putFectch("/reuseChk/rainy/list", chData);
         if (res) {
-          toast.success(
-            "지도점검 대체수 및 빗물이용량 수정이 완료되었습니다. "
-          );
           const rainChkRes = await initFetch(
             1,
             rainPageSize,
             year,
             "41"
           );
-          return set((state: rainChkgdnState) => ({
+          set((state: rainChkgdnState) => ({
             ...state,
             rainChkgdn: {
               ...state.rainChkgdn,
@@ -279,21 +278,20 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
               rainChkCount: rainChkRes.count,
             },
           }));
-        } else {
-          toast.error("지도점검 대체수 및 빗물이용량 수정 오류입니다.");
+          return successMessage;
         }
+        return failMessage;
       } catch (error) {
         console.log(error);
-        toast.error("지도점검 대체수 및 빗물이용량 수정 오류입니다.");
+        return failMessage;
       }
     },
     rainChkGuidUpdate: async (rainChk: rainChkZodType) => {
+      const successMessage = "지도점검 수질 및 과태료 수정이 완료되었습니다. ";
+      const failMessage = "지도점검 수질 및 과태료 수정 오류입니다.";
       try {
-        //const chData = await makeMdfrChk(rainChk, "guideDetails", "rainDetil");
         const res = await putFectch("/reuseChk/rainy", rainChk);
         if (res.status === 200) {
-          toast.success("지도점검 수질 및 과태료 수정이 완료되었습니다. ");
-
           const currentYear = new Date().getFullYear().toString();
           const rainChkRes = await initFetch(
             1,
@@ -301,7 +299,7 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
             currentYear,
             "41"
           );
-          return set((state: rainChkgdnState) => ({
+          set((state: rainChkgdnState) => ({
             ...state,
             rainChkgdn: {
               ...state.rainChkgdn,
@@ -309,29 +307,28 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
               rainChkCount: rainChkRes.count,
             },
           }));
-        } else {
-          toast.error("지도점검 수질 및 과태료 수정 오류입니다.");
-
+          return successMessage;
         }
+        return failMessage;
       } catch (error) {
-        console.log(' 지도점검 수질 및 과태료 수정 오류', error)
-        toast.error("지도점검 수질 및 과태료 수정 오류입니다.");
+        console.log(" 지도점검 수질 및 과태료 수정 오류", error);
+        return failMessage;
       }
     },
     rainChkDelete: async (chkgdnSns: number[] ,year :string) => {
+      const successMessage = "삭제가 완료되었습니다. ";
+      const failMessage = "삭제시 오류가 발생하였습니다.. ";
       try {
         const res = await deleteFectch(`/reuseChk/rainy`, chkgdnSns);
 
         if (res) {
-          toast.success("삭제가 완료되었습니다. ");
-
           const rainChkRes = await initFetch(
             1,
             rainPageSize,
             year,
             "41"
           );
-          return set((state: rainChkgdnState) => ({
+          set((state: rainChkgdnState) => ({
             ...state,
             rainChkgdn: {
               ...state.rainChkgdn,
@@ -339,14 +336,12 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
               rainChkCount: rainChkRes.count,
             },
           }));
-        } else {
-          toast.error("삭제시 오류가 발생하였습니다.. ");
-
+          return successMessage;
         }
+        return failMessage;
       } catch (error) {
-        console.log(' 삭제시 오류가 발생하였습니다', error)
-
-        toast.error("삭제시 오류가 발생하였습니다.. ");
+        console.log(" 삭제시 오류가 발생하였습니다.", error);
+        return failMessage;
       }
     },
     rainChkHeadChange: async (rainChkgdn: rainChkgdnState, isEdit: boolean) => {
@@ -391,3 +386,4 @@ export const rainChkgdnActionsExport: (set: any) => rainChkgdnActions = (
 
   };
 };
+
diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/excel.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/excel.tsx
index fe2d87bc3..6e1114781 100644
--- a/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/excel.tsx
+++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/excel.tsx
@@ -13,6 +13,11 @@ import {
 } from "../rainChkgdn/excel";
 import { codeToText, textToCode } from "@/components/lib/func/common";
 
+const normalizeExcelDateInput = (value: unknown) => {
+  if (value === undefined || value === null) return "";
+  return String(value).replace(/[.\-\/\s]/g, "");
+};
+
 export const rswtMakeExcelSample = (
   buildings: Buildingtype[],
   sidoCode: SelectDataType[],
@@ -142,7 +147,9 @@ export const excelToRswtGuideData = (
   const rswtChkgdData: rswtChkZodType[] = excelData
     .map((item: any) => {
       if (item["점검일"] !== undefined) {
-        const checkYmd = item["점검일"].replace(/\./g, "");
+        const checkYmd = normalizeExcelDateInput(item["점검일"]);
+        const operMngCd = textToCode(item["운영관리형태"], "rainRswtMng") ?? item["운영관리형태"];
+        const utztnUsgCd = textToCode(item["이용용도"], "dmdUszCd") ?? item["이용용도"];
 
         const makeGuidDetail = Array.from({ length: 12 }, (_, i) => {
           let month = `${i + 1}`;
@@ -150,26 +157,27 @@ export const excelToRswtGuideData = (
           const rswtData = parseRawValue(item[`중수_${month}월`]);
           if (month.length < 2) month = "0" + month;
           return {
+            utztnUsgCd: utztnUsgCd,
             ym: year + month,
             chckYmd: checkYmd,
             splyUswtrUtztnQnt: splyData !== "" ? splyData : 0,
             ruseFcltUtztnQnt: rswtData !== "" ? rswtData : 0,
+            flg: "RST",
           };
         });
-        if (checkYmd.length > 7) {
-          return {
-            bdstRuseFcltSn: Number(item["NO"]),
-            operMngCd: textToCode(item["운영관리형태"], "rainRswtMng") ??item["운영관리형태"],
-            anlOperCst: parseCommaRawValue(item["연간운영비(원/년)"]),
-            prcsCpct: parseRawValue(item[`처리용량(m³)`]),
-            spwtPositn: item["채수지점"],
-            chckYmd: checkYmd,
-            utztnUsgCd: textToCode(item["이용용도"], "dmdUszCd")??item["이용용도"],
-            guideDetails: makeGuidDetail,
-            rgtr: TEST_UUID,
-            mdfr: TEST_UUID,
-          };
-        }
+        return {
+          bdstRuseFcltSn: Number(item["NO"]),
+          flg: "RST",
+          operMngCd: operMngCd,
+          anlOperCst: parseCommaRawValue(item["연간운영비(원/년)"]),
+          prcsCpct: parseRawValue(item[`처리용량(m³)`]),
+          spwtPositn: item["채수지점"],
+          chckYmd: checkYmd,
+          utztnUsgCd: utztnUsgCd,
+          guideDetails: makeGuidDetail,
+          rgtr: TEST_UUID,
+          mdfr: TEST_UUID,
+        };
       }
     })
     .filter((el: any) => el !== undefined);
@@ -186,11 +194,13 @@ export const excelToRswtPolution = (excelData: any) => {
   const rswtChkgdData: rswtChkZodType[] = excelData
     .map((item: any) => {
       if (item["점검일"] !== undefined) {
-        const checkYmd = item["점검일"].replace(/\./g, "");
-        let vltnDt = item["과태료 부과일(위반일)"];
-        if (vltnDt !== undefined) {
-          vltnDt = vltnDt.replace(/\./g, "");
-        }
+        const checkYmd = normalizeExcelDateInput(item["점검일"]);
+        const vltnDt = normalizeExcelDateInput(item["과태료 부과일(위반일)"]);
+        const operMngCd =
+          textToCode(item["운영관리형태"], "rainRswtMng") ??
+          item["운영관리형태"];
+        const utztnUsgCd =
+          textToCode(item["이용용도"], "dmdUszCd") ?? item["이용용도"];
 
         const makePoluttion = Array.from({ length: 4 }, (_, i) => {
           const quarter = `${i + 1}`;
@@ -207,6 +217,7 @@ export const excelToRswtPolution = (excelData: any) => {
           const ph = String(item[`${quarter}분기_PH`]) ;
           const clIonQnt = parseRawValue(item[`${quarter}분기_염화물`]);
           return {
+            utztnUsgCd: utztnUsgCd,
             node: quarter,
             chckYmd: checkYmd,
             grssClfgUswtr: grssClfgUswtr,
@@ -226,9 +237,10 @@ export const excelToRswtPolution = (excelData: any) => {
 
         return {
           bdstRuseFcltSn: Number(item["NO"]),
+          flg: "RST",
           chckYmd: checkYmd,
-          utztnUsgCd: textToCode(item["이용용도"], "dmdUszCd")??item["이용용도"],
-          operMngCd: item["운영관리형태"],
+          utztnUsgCd: utztnUsgCd,
+          operMngCd: operMngCd,
           anlOperCst: parseCommaRawValue(item["연간운영비(원/년)"]),
           prcsCpct: parseRawValue(item["처리용량(m³)"]),
           spwtPositn: item["채수지점"],
@@ -237,7 +249,7 @@ export const excelToRswtPolution = (excelData: any) => {
           mdfr: TEST_UUID,
           rswtrDetails: [
             {
-              utztnUsgCd: textToCode(item["이용용도"], "dmdUszCd")??item["이용용도"],
+              utztnUsgCd: utztnUsgCd,
               vltnDt: vltnDt,
               vltnMttr: item["위반사항"],
               levyAmt: Number(item["과태료 부과금액(천원)"]) ?? 0,
@@ -257,6 +269,7 @@ export const rswtExcelDataCheck = (
   rswtChkgdData: rswtChkZodType[],
   issues: string[]
 ) => {
+  // const chkMngType = { "01": "위탁", "02": "자체" };
 
   rswtChkgdData.forEach((rswt: any) => {
     const defaultMessage = `*중수도 수질  [NO: ${rswt.bdstRuseFcltSn}, 점검일: ${rswt.chckYmd}, 이용용도: ${codeToText(rswt.utztnUsgCd ,"dmdUszCd")??rswt.utztnUsgCd}] 항목에서  `;
@@ -264,6 +277,17 @@ export const rswtExcelDataCheck = (
     if (rswt.chckYmd && isInvalidDate(rswt.chckYmd)) {
       issues.push(defaultMessage + `점검일: 날짜 형식 아님 (${rswt.chckYmd})`);
     }
+    // if (rswt.operMngCd?.length > 1 && !chkMngType[rswt.operMngCd]) {
+    //   issues.push(
+    //     defaultMessage +
+    //       `운영관리형태: 위탁 혹은 자체만 허용 (${rswt.operMngCd})`
+    //   );
+    // }
+    // if (rswt.utztnUsgCd?.length > 2 && !codeToText(rswt.utztnUsgCd, "dmdUszCd")) {
+    //   issues.push(
+    //     defaultMessage + `이용용도: 허용되지 않은 값 (${rswt.utztnUsgCd})`
+    //   );
+    // }
     if (rswt.anlOperCst.length > 2 && isInvalidNumber(rswt.anlOperCst)) {
 
       issues.push(
@@ -327,6 +351,11 @@ export const rswtExcelDataCheck = (
             defaultMessage + `${pol.node}분기_T-N: 숫자 형식 아님 (${pol.tn})`
           );
         }
+        if (pol.ph?.length > 1 && isInvalidNumber(pol.ph)) {
+          issues.push(
+            defaultMessage + `${pol.node}분기_PH: 숫자 형식 아님 (${pol.ph})`
+          );
+        }
 
           if (isInvalidNumber(pol.clIonQnt)) {
             issues.push(
diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/headList.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/headList.tsx
index 6e94ec4e6..9a8b65ced 100644
--- a/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/headList.tsx
+++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/headList.tsx
@@ -53,61 +53,63 @@ const buildingZod = z.object({
 });
 
 export const rswtrPolutionsZode = z.object({
-  utztnUsgCdText:z.string().nullish(),
-  chkgdnDtlFk: z.string().nullish(),
-  utztnUsgCd: z.string().nullish(),
-  node: z.string().nullish(),
-  grssClfgUswtr: z.number(),
-  combResdch: z.number(),
-  trbt: z.number(),
-  bod: z.number(),
-  smll: z.number(),
-  crmty: z.number(),
-  tph: z.number(),
-  tn: z.number(),
-  ph: z.number(),
-  clIonQnt: z.number(),
-  regDt: z.string().nullish(),
-  rgtr: z.string().nullish(),
-  mdfcnDt: z.string().nullish(),
-  mdfr: z.string().nullish(),
-  edit:z.boolean().nullish()
+  utztnUsgCdText:z.string().nullish(), // 이용용도 코드의 화면 표시용 한글명
+  chkgdnDtlFk: z.string().nullish(), // 지도점검 상세 PK와 연결되는 FK
+  utztnUsgCd: z.string().nullish(), // 이용용도 코드
+  node: z.string().nullish(), // 분기 구분값(1~4분기)
+  grssClfgUswtr: z.number(), // 총대장균군수
+  combResdch: z.number(), // 결합잔류염소
+  trbt: z.number(), // 탁도
+  bod: z.number(), // BOD
+  smll: z.string(), // 냄새
+  crmty: z.number(), // 색도
+  tph: z.number(), // 총인(T-P)
+  tn: z.number(), // 총질소(T-N)
+  ph: z.number(), // 수소이온농도(pH)
+  clIonQnt: z.number(), // 염화물
+  regDt: z.string().nullish(), // 등록일시
+  rgtr: z.string().nullish(), // 등록자
+  mdfcnDt: z.string().nullish(), // 수정일시
+  mdfr: z.string().nullish(), // 수정자
+  edit:z.boolean().nullish() // 화면에서 수정 가능 여부
 });
 
 export const rswtrDetailsZod = z.object({
-  chkgdnDtlPk: z.string().nullish(),
-      chkgdnSn: z.string().nullish(),
-      utztnUsgCd: z.string(),
-      vltnDt: z.string(),
-      vltnMttr: z.string(),
-      levyAmt: z.number(),
-      regDt: z.string().nullish(),
-      rgtr: z.string().nullish(),
-      mdfcnDt: z.string().nullish(),
-      mdfr: z.string().nullish(),
+  chkgdnDtlPk: z.string().nullish(), // 지도점검 상세 PK
+  chkgdnSn: z.string().nullish(), // 지도점검 일련번호
+  utztnUsgCd: z.string(), // 이용용도 코드
+  vltnDt: z.string(), // 위반일
+  vltnMttr: z.string(), // 위반사항
+  levyAmt: z.number(), // 부과금액
+  regDt: z.string().nullish(), // 등록일시
+  rgtr: z.string().nullish(), // 등록자
+  mdfcnDt: z.string().nullish(), // 수정일시
+  mdfr: z.string().nullish(), // 수정자
 })
 
+// 중수도 점검 데이터를 검증하는 Zod 스키마
 export const rswtChkgdZod = z.object({
-  chkgdnSn: z.number().nullish(),
-  bdstRuseFcltSn: z.number().nullish(),
-  chckYmd: z.string(),
-  prcsCpct: z.number(),
-  dtfcltCpct: z.number(),
-  spwtPositn: z.string(),
-  regDt: z.string().nullish(),
-  rgtr: z.string().nullish(),
-  mdfcnDt: z.string().nullish(),
-  mdfr: z.string().nullish(),
-  anlOperCst:z.number(),
-  oilqMeasMthd: z.string().nullish(),
-  utztnUsgCd: z.string(),
-  building: buildingZod,
-  guideDetails: z.array(guideDetail),
-  reuseBuilding: reuseBuildingZod,
+  chkgdnSn: z.number().nullish(), // 점검 일련번호
+  bdstRuseFcltSn: z.number().nullish(), // 재이용시설 일련번호
+  chckYmd: z.string(), // 점검일자
+  prcsCpct: z.number(), // 처리용량
+  dtfcltCpct: z.number(), // 빗물저류조용량
+  spwtPositn: z.string(), // 채수 지점
+  regDt: z.string().nullish(), // 등록일시
+  rgtr: z.string().nullish(), // 등록자
+  mdfcnDt: z.string().nullish(), // 수정일시
+  mdfr: z.string().nullish(), // 수정자
+  flg: z.string().nullable(), // 플래그
+  anlOperCst: z.number(), // 연간 운영비
+  oilqMeasMthd: z.string().nullish(), // 유량측정방법
+  utztnUsgCd: z.string(), // 이용용도 코드
+  building: buildingZod, // 건물 정보
+  guideDetails: z.array(guideDetail), // 가이드 점검 상세 목록
+  reuseBuilding: reuseBuildingZod, // 재이용 건물 정보
   rswtrDetails: z.array(
     rswtrDetailsZod
-  ),
-  rswtrPollutions: z.array(rswtrPolutionsZode),
+  ), // 점검 위반/내역 상세 배열
+  rswtrPollutions: z.array(rswtrPolutionsZode), // 수질 오염 항목 배열
 });
 
 
@@ -134,117 +136,45 @@ export const rswtHeadNmExport: chHeadType[] = [
 ];
 
 export const rswtChkHeadListExport: TableUpperProps[] = [
-  { id: "order", title: "순번", mergeCell: true },
-  { id: "checkBox", title: "선택", mergeCell: true },
-  { id: "cityText", title: "시도" ,mergeCell: true },
-  { id: "sggText", title: "시군구",mergeCell: true },
-  { id: "bdstNm", title: "시설명" ,mergeCell: true},
-  { id: "operMngCd", title: "운영관리형태" ,mergeCell: true},
-  { id: "anlOperCst", title: "연간운영비(원/년)" ,mergeCell: true},
-  { id: "prcsCpct", title: "처리용량(m³)" ,mergeCell: true},
-  { id: "spwtPositn", title: "채수지점" ,mergeCell: true},
-  { id: "chckYmd", title: "점검일" ,mergeCell: true},
-  { id: "utztnUsgCdText", title: "이용용도" },
-  { id: "splyUswtrUtztnQnt", title: "연간대체수이용량(m³)" ,type: "number"},
-  { id: "ruseFcltUtztnQnt", title: "연간중수도이용량(m³)",type: "number"},
-
-  {
-    id: "grssClfgUswtr",
-    title: "총대장균군수(개/mg)",
-    upName: "useQuilty",
-    upSequnce: 1,
-    type: "number"
-  },
-  {
-    id: "combResdch",
-    title: "결합잔류염소(mh/L)",
-    upName: "useQuilty",
-    upSequnce: 2,
-    type: "number"
-  },
-  { id: "trbt", title: "탁도(NTU)", upName: "useQuilty", upSequnce: 3 ,type: "number"},
-  { id: "bod", title: "BOD(mg/L)", upName: "useQuilty", upSequnce: 4 ,type: "number"},
-  { id: "smll", title: "냄새", upName: "useQuilty", upSequnce: 5 ,type: "text"},
-  { id: "crmty", title: "색도(도)", upName: "useQuilty", upSequnce: 6 ,type: "number"},
-  { id: "tn", title: "총질소(T-N)(mg/L)", upName: "useQuilty", upSequnce: 7 ,type: "number"},
-  { id: "tph", title: "총인(T-P)(mg/L)", upName: "useQuilty", upSequnce: 8 ,type: "number"},
-  { id: "ph", title: "수소이온농도(pH)", upName: "useQuilty", upSequnce: 9,type: "text" },
-  { id: "clIonQnt", title: "염화물(mg/L)", upName: "useQuilty", upSequnce: 10 ,type: "number"},
-
-  {
-    id: "vltnDt",
-    title: "부과일(위반일)",
-    upName: "feeHist",
-    upSequnce: 1,
-    type: "text",
-    edit:true
-  },
-  {
-    id: "vltnMttr",
-    title: "위반사항",
-    upName: "feeHist",
-    upSequnce: 2,
-    type: "text",
-    edit:true
-  },
-  {
-    id: "levyAmt",
-    title: "부과금액(천원)",
-    upName: "feeHist",
-    upSequnce: 3,
-    type: "number",
-    edit:true
-  }];
+  { id: "order", title: "순번", mergeCell: true, widthPercent: 4 },
+  { id: "checkBox", title: "선택", mergeCell: true, widthPercent: 4 },
+  { id: "cityText", title: "시도" ,mergeCell: true, widthPercent: 7 },
+  { id: "sggText", title: "시군구",mergeCell: true, widthPercent: 5 },
+  { id: "bdstNm", title: "시설명" ,mergeCell: true, widthPercent: 10 },
+  { id: "operMngCd", title: "운영관리형태" ,mergeCell: true, widthPercent: 6 },
+  { id: "anlOperCst", title: "연간운영비(원/년)" ,mergeCell: true, widthPercent: 7 },
+  { id: "prcsCpct", title: "처리용량(m³)" ,mergeCell: true, widthPercent: 6 },
+  { id: "spwtPositn", title: "채수지점" ,mergeCell: true, widthPercent: 6 },
+  { id: "chckYmd", title: "점검일" ,mergeCell: true, widthPercent: 7 },
+  { id: "utztnUsgCdText", title: "이용용도", widthPercent: 7 },
+  { id: "splyUswtrUtztnQnt", title: "연간대체수이용량(m³)" ,type: "number", widthPercent: 5 },
+  { id: "ruseFcltUtztnQnt", title: "연간중수도이용량(m³)",type: "number", widthPercent: 5 },
+  { id: "grssClfgUswtr", title: "총대장균군수(개/mg)", upName: "useQuilty", upSequnce: 1 ,type: "number", widthPercent: 6 },
+  { id: "combResdch", title: "결합잔류염소(mh/L)", upName: "useQuilty", upSequnce: 2 ,type: "number", widthPercent: 6 },
+  { id: "trbt", title: "탁도(NTU)", upName: "useQuilty", upSequnce: 3 ,type: "number", widthPercent: 4 },
+  { id: "bod", title: "BOD\n(mg/L)", upName: "useQuilty", upSequnce: 4 ,type: "number", widthPercent: 4 },
+  { id: "smll", title: "냄새", upName: "useQuilty", upSequnce: 5 ,type: "text", widthPercent: 4 },
+  { id: "crmty", title: "색도(도)", upName: "useQuilty", upSequnce: 6 ,type: "number", widthPercent: 4 },
+  { id: "tn", title: "총질소(T-N)(mg/L)", upName: "useQuilty", upSequnce: 7 ,type: "number", widthPercent: 5 },
+  { id: "tph", title: "총인(T-P)(mg/L)", upName: "useQuilty", upSequnce: 8 ,type: "number", widthPercent: 5 },
+  { id: "ph", title: "수소이온농도(pH)", upName: "useQuilty", upSequnce: 9,type: "text", widthPercent: 5 },
+  { id: "clIonQnt", title: "염화물(mg/L)", upName: "useQuilty", upSequnce: 10 ,type: "number", widthPercent: 5 },
+  { id: "vltnDt", title: "부과일(위반일)", upName: "feeHist", upSequnce: 1, type: "text", edit:true, widthPercent: 5 },
+  { id: "vltnMttr", title: "위반사항", upName: "feeHist", upSequnce: 2, type: "text", edit:true, widthPercent: 6 },
+  { id: "levyAmt", title: "부과금액(천원)", upName: "feeHist", upSequnce: 3, type: "number", edit:true, widthPercent: 5 }];
 
 
   export const rswtDetailHeadListExport: TableUpperProps[] = [
-    { id: "utztnUsgCdText", title: "이용용도" },
-  
-    {
-      id: "grssClfgUswtr",
-      title: "총대장균군수",
-      upName: "detailQulity",
-      upSequnce: 2,
-      edit: true,
-    },
-    {
-      id: "combResdch",
-      title: "결합잔류염소",
-      upName: "detailQulity",
-      upSequnce: 3,
-      edit: true,
-    },
-    {
-      id: "trbt",
-      title: "탁도",
-      upName: "detailQulity",
-      upSequnce: 4,
-      edit: true,
-    },
-    { id: "bod", title: "BOD", upName: "detailQulity", upSequnce: 5, edit: true },
-    {
-      id: "smll",
-      title: "냄새",
-      upName: "detailQulity",
-      upSequnce: 6,
-      edit: true,
-    },
-    {
-      id: "crmty",
-      title: "색도",
-      upName: "detailQulity",
-      upSequnce: 7,
-      edit: true,
-    },
-    { id: "tn", title: "T-N", upName: "detailQulity", upSequnce: 8, edit: true },
-    { id: "tph", title: "T-P", upName: "detailQulity", upSequnce: 9, edit: true },
-    { id: "ph", title: "pH", upName: "detailQulity", upSequnce: 10, edit: true },
-    {
-      id: "clIonQnt",
-      title: "염화물",
-      upName: "detailQulity",
-      upSequnce: 11,
-      edit: true,
-    },
+    { id: "utztnUsgCdText", title: "이용용도", widthPercent: 20 },
+    { id: "grssClfgUswtr", title: "총대장균군수", upName: "detailQulity", upSequnce: 2, edit: true, widthPercent: 8 },
+    { id: "combResdch", title: "결합잔류염소", upName: "detailQulity", upSequnce: 3, edit: true, widthPercent: 8 },
+    { id: "trbt", title: "탁도", upName: "detailQulity", upSequnce: 4, edit: true, widthPercent: 8 },
+    { id: "bod", title: "BOD", upName: "detailQulity", upSequnce: 5, edit: true, widthPercent: 8 },
+    { id: "smll", title: "냄새", upName: "detailQulity", upSequnce: 6, edit: true, widthPercent: 8 },
+    { id: "crmty", title: "색도", upName: "detailQulity", upSequnce: 7, edit: true, widthPercent: 8 },
+    { id: "tn", title: "T-N", upName: "detailQulity", upSequnce: 8, edit: true, widthPercent: 8 },
+    { id: "tph", title: "T-P", upName: "detailQulity", upSequnce: 9, edit: true, widthPercent: 8 },
+    { id: "ph", title: "pH", upName: "detailQulity", upSequnce: 10, edit: true, widthPercent: 8 },
+    { id: "clIonQnt", title: "염화물", upName: "detailQulity", upSequnce: 11, edit: true, widthPercent: 8 },
   ];
-  
\ No newline at end of file
+  
diff --git a/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/index.tsx b/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/index.tsx
index cf2eca339..3ce6cc2ff 100644
--- a/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/index.tsx
+++ b/apps/wr/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/index.tsx
@@ -1,4 +1,4 @@
-import { buildingType } from "@/app/store/common/code";
+import { buildingType } from "@/app/store/common/code";
 import type { TableUpperProps } from "@/app/store/common/type/header";
 import {
   TEST_UUID,
@@ -11,12 +11,10 @@ import {
   postFectch,
   putFectch,
 } from "@/components/lib/api";
-import { ToastFormUi } from "@/components/ui/toast/toastFromUi";
 import type {
   SelectDataType,
   SheetParameter,
 } from "@common/business_components";
-import toast from "react-hot-toast";
 import { z } from "zod";
 import { type chHeadType } from "../rainChkgdn/headList";
 import { rswtMakeExcelSample } from "./excel";
@@ -43,19 +41,19 @@ export type rswtChkZodType = z.infer<typeof rswtChkgdZod>;
 export type rswtrChkDetailsZodType = z.infer<typeof rswtrDetailsZod>;
 export type rswtChkgdnState = {
   rswtChkgdn: {
-    rswtChkHeadList: TableUpperProps[];
-    rswtDetailHeadList: TableUpperProps[];
-
-    rswtHeadNm: chHeadType[];
-    excelList: SheetParameter[];
-    rswtChkRes: rswtChkZodType[];
-    rswtChkPolGuide: rswtChkZodType[];
-    rswtSplHeadNm:chHeadType[]
-    rswtRuseHeadNm:chHeadType[]
-    isInit: boolean;
-    isSttn: boolean;
-    isLoading:boolean;
-    rswtChkCount: number;
+    rswtChkHeadList: TableUpperProps[]; // 중수도 지도점검 메인 목록 헤더
+    rswtDetailHeadList: TableUpperProps[]; // 중수도 지도점검 상세 목록 헤더
+ 
+    rswtHeadNm: chHeadType[]; // 메인 목록 다단 헤더명
+    excelList: SheetParameter[]; // 엑셀 다운로드용 시트 데이터
+    rswtChkRes: rswtChkZodType[]; // 중수도 지도점검 메인 목록 데이터
+    rswtChkPolGuide: rswtChkZodType[]; // 선택한 지도점검 1건의 수질/대체수 상세 데이터
+    rswtSplHeadNm:chHeadType[] // 공급량 관련 다단 헤더명
+    rswtRuseHeadNm:chHeadType[] // 재이용량 관련 다단 헤더명
+    isInit: boolean; // 초기 목록 조회 완료 여부
+    isSttn: boolean; // 테이블 선택/상세 상태 제어 플래그
+    isLoading:boolean; // 등록/업로드 등 비동기 처리 진행 여부
+    rswtChkCount: number; // 메인 목록 전체 건수
   };
 };
 
@@ -78,12 +76,12 @@ type rswtChkgdnActions = {
     sggCode: SelectDataType[],
     sggCd: string,
   ): Promise<void>;
-  rswtChkExceDataUpload: (excelData: rswtChkZodType[],laeSeCd:string) => void;
-  rswtChkDelete: (chkgdnSns: number[] ,year:string) => void;
-  rswtChkDetilsUpdate: (rswtChkDetails: rswtrChkDetailsZodType[] ,year:string) => void;
+  rswtChkExceDataUpload: (excelData: rswtChkZodType[],laeSeCd:string) => Promise<string>;
+  rswtChkDelete: (chkgdnSns: number[] ,year:string) => Promise<string>;
+  rswtChkDetilsUpdate: (rswtChkDetails: rswtrChkDetailsZodType[] ,year:string) => Promise<string>;
   rswtChkPolAndGuide: (chkgdnSn: number) => void;
   rswtChkPolInit: () => void;
-  rwstPolAndGuideUpdate: (rswtChk: rswtChkZodType[]) => void;
+  rwstPolAndGuideUpdate: (rswtChk: rswtChkZodType[]) => Promise<string>;
   rswtChkHeadChange: (rswtChkgdn: rswtChkgdnState, isEdit: boolean) => void;
   setRswtChkLoading:(status:boolean) =>void
 };
@@ -244,29 +242,32 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
         console.log(error);
       }
     },
+    // 중수도 지도점검결과 upload
     rswtChkExceDataUpload: async (excelData: rswtChkZodType[],laeSeCd:string) => {
+      const successMessage = "지도점검 등록이 완료되었습니다.";
+      const failMessage = "지도점검 등록이 실패되었습니다.";
+      console.log(excelData);
       try {
-   set((state: rswtChkgdnType) => (
-        { rswtChkgdn: { ...state.rswtChkgdn, isLoading: true } }));
+        set((state: rswtChkgdnType) => (
+          { rswtChkgdn: { ...state.rswtChkgdn, isLoading: true } }));
         const res = await postFectch("/reuseChk/reuseWater", excelData);
-        if (res.ok) {
-          ToastFormUi({
-            body: "지도점검 등록이 완료되었습니다.",
-            title: "지도점검 등록",
-          });
+        if (res.status === 200) {
+          const currentYear = new Date().getFullYear().toString();
+          const rswtChkRes = await initFetch(1, rswtPageSize, currentYear, laeSeCd);
+          set((state: rswtChkgdnState) => ({
+            ...state,
+            rswtChkgdn: {
+              ...state.rswtChkgdn,
+              rswtChkRes: rswtChkRes.data,
+              rswtChkCount: rswtChkRes.count,
+            },
+          }));
+          return successMessage;
         }
-        const currentYear = new Date().getFullYear().toString();
-        const rswtChkRes = await initFetch(1, rswtPageSize, currentYear, laeSeCd);
-        return set((state: rswtChkgdnState) => ({
-          ...state,
-          rswtChkgdn: {
-            ...state.rswtChkgdn,
-            rswtChkRes: rswtChkRes.data,
-            rswtChkCount: rswtChkRes.count,
-          },
-        }));
+        return failMessage;
       } catch (error) {
         console.log(error);
+        return failMessage;
       }finally{
         set((state: rswtChkgdnType) => (
           { rswtChkgdn: { ...state.rswtChkgdn, isLoading: false } }));
@@ -274,15 +275,17 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
 
     },
     rswtChkDetilsUpdate: async (rswtChk: rswtrChkDetailsZodType[] ,year:string) => {
+      const successMessage = "지도점검 과태료  수정이 완료되었습니다. ";
+      const failMessage = "지도점검 과태료  수정 오류입니다. ";
       try {
         const chData = await makeMdfrChk(rswtChk);
 
         const res = await putFectch("/reuseChk/reuseWater", chData);
-        if (res.ok) {
-          toast.success("지도점검 과태료  수정이 완료되었습니다. ",)
+        if (!res.ok) {
+          return failMessage;
         }
         const rswtChkRes = await initFetch(1, rswtPageSize, year, "0");
-        return set((state: rswtChkgdnState) => ({
+        set((state: rswtChkgdnState) => ({
           ...state,
           rswtChkgdn: {
             ...state.rswtChkgdn,
@@ -291,21 +294,24 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
 
           },
         }));
+        return successMessage;
       } catch (error) {
         console.log(error);
-        toast.error("지도점검 과태료  수정 오류입니다. ",)
+        return failMessage;
 
       }
     },
     rswtChkDelete: async (chkgdnSns: number[] ,year:string) => {
+      const successMessage = "삭제가 완료되었습니다.";
+      const failMessage = "삭제 오류입니다.";
       try {
         const res = await deleteFectch(`/reuseChk/reuseWater`, chkgdnSns);
 
-        if (res) {
-          toast.success("삭제가 완료되었습니다.") 
+        if (!res) {
+          return failMessage;
         }
         const rswtChkRes = await initFetch(1, rswtPageSize, year, "0");
-        return set((state: rswtChkgdnState) => ({
+        set((state: rswtChkgdnState) => ({
           ...state,
           rswtChkgdn: {
             ...state.rswtChkgdn,
@@ -313,9 +319,10 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
             rswtChkCount: rswtChkRes.count,
           },
         }));
+        return successMessage;
       } catch (error) {
-        toast.error("삭제 오류입니다.") 
         console.error(error);
+        return failMessage;
       }
     },
     rswtChkPolAndGuide: async (chkgdnSn: number) => {
@@ -350,18 +357,20 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
       }
     },
     rwstPolAndGuideUpdate: async (rswtChk: rswtChkZodType[]) => {
+      const successMessage = "지도점검 연간 수질 및 대체수/중수도 수정이 완료되었습니다.";
+      const failMessage = "지도점검 연간 수질 및 대체수/중수도 수정 오류입니다.";
       try {
         const chData = await makeMdfrChk(rswtChk);
         const res = await putFectch(
           `/reuseChk/reuseWater/${rswtChk[0]?.chkgdnSn}`,
           chData[0]
         );
-        if (res.ok) {
-          toast.success("지도점검 연간 수질 및 대체수/중수도 수정이 완료되었습니다.") 
+        if (!res.ok) {
+          return failMessage;
         }
         const currentYear = new Date().getFullYear().toString();
         const rswtChkRes = await initFetch(1, rswtPageSize, currentYear, "0");
-        return set((state: rswtChkgdnState) => ({
+        set((state: rswtChkgdnState) => ({
           ...state,
           rswtChkgdn: {
             ...state.rswtChkgdn,
@@ -369,10 +378,11 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
             rswtChkCount: rswtChkRes.count,
           },
         }));
+        return successMessage;
       } catch (error) {
         console.log(error);
 
-        toast.error("지도점검 연간 수질 및 대체수/중수도 수정 오류입니다.") 
+        return failMessage;
 
       }
     },
@@ -409,3 +419,4 @@ export const rswtChkgdnActionsExport: (set: any) => rswtChkgdnActions = (
 
   };
 };
+
diff --git a/apps/wr/app/store/prfmncReg/pbnstPrfmncReg/index.tsx b/apps/wr/app/store/prfmncReg/pbnstPrfmncReg/index.tsx
index 13429fbc7..83057114c 100644
--- a/apps/wr/app/store/prfmncReg/pbnstPrfmncReg/index.tsx
+++ b/apps/wr/app/store/prfmncReg/pbnstPrfmncReg/index.tsx
@@ -1,4 +1,4 @@
-/**
+/**
  * 재이용실적등록 > 하수재이용실적등록
  * 
  * 🔗 사용 API 
@@ -13,7 +13,6 @@ import { pbnstPrfmncHeadListExport, monthHeadListExport } from "./headList";
 import type { pubHasuType } from "../../ruseFcltMng/fcltReg/pbnstReg/type";
 import type { FcPrfType, PrfType } from "./type";
 import type { TableUpperProps } from "../../common/type/header";
-import toast from "react-hot-toast";
 
 const pbnstPrfmncHeadList = pbnstPrfmncHeadListExport;
 const monthHeadList = monthHeadListExport;
@@ -66,7 +65,7 @@ type pbnstPrfmncActions = {
     data: PrfType,
     year: string,
     prfPbnFclts: string[]
-  ) => void;
+  ) => Promise<string>;
   getPrfFmcRes: () => void;
 };
 
@@ -203,6 +202,7 @@ export const pbnstPrfmncActionsExport: (set: any) => pbnstPrfmncActions = (
       year: string,
       prfPbnFclts: string[]
     ) => {
+      const failMessage = "하수재이용 시설 실적 등록이 실패하였습니다.";
       try {
         const ressponse = await postFectch(
           "/reuseFc/pubFcPrf",
@@ -211,7 +211,6 @@ export const pbnstPrfmncActionsExport: (set: any) => pbnstPrfmncActions = (
         );
 
         if (ressponse.status === 200) {
-          toast.success("하수재이용 시설 실적 등록이 완료되었습니다.");
           const prfmncRes = await hasuListFetch(
             page,
             sggOrCity,
@@ -219,7 +218,7 @@ export const pbnstPrfmncActionsExport: (set: any) => pbnstPrfmncActions = (
             prfPbnFclts
           );
 
-          return set((state: pbnstPrfmncState) => ({
+          set((state: pbnstPrfmncState) => ({
             ...state,
             prfmnc: {
               ...state.prfmnc,
@@ -229,10 +228,12 @@ export const pbnstPrfmncActionsExport: (set: any) => pbnstPrfmncActions = (
               pageKey: state.prfmnc.pageKey + 1,
             },
           }));
+          return "하수재이용 시설 실적 등록이 완료되었습니다.";
         }
+        return failMessage;
       } catch (e) {
         console.log(e);
-        toast.error("하수재이용 시설 실적 등록이 실패하였습니다.");
+        return failMessage;
       }
     },
   };
diff --git a/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/headList.tsx b/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/headList.tsx
index 51b9634d3..c45a772e7 100644
--- a/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/headList.tsx
+++ b/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/headList.tsx
@@ -1,61 +1,25 @@
 import type { TableUpperProps } from "@/app/store/common/type/header";
 
 export const rainChkgdnHeadSttnExport: TableUpperProps[] = [
-  { id: 'order', title: "순번", mergeCell: true },
-  { id: "cityText", title: "시도", mergeCell: true },
-  { id: "sggText", title: "시군구", mergeCell: true },
-  { id: "bdstNm", title: "시설명", mergeCell: true },
-  { id: "operMngCdText", title: "운영관리형태", mergeCell: true },
-  { id: "oilqMeasMthdText", title: "유량측정방법", mergeCell: true },
-  { id: "anlOperCst", title: "연간운영비(원/년)", mergeCell: true },
-  { id: "dtfcltCpct", title: "빗물저류조용량(m³)", mergeCell: true },
-  { id: "chckYmd", title: "점검일", mergeCell: true },
-  { id: "utztnUsgCdText", title: "이용용도" },
-  { id: "totalSplyUswtrUtztnQnt", title: "연간대체수이용량(m³)" },
-  { id: "totalRuseFcltUtztnQnt", title: "연간빗물이용량(m³)" },
-  {
-    id: "ph",
-    title: "수소이온농도(pH)",
-    upName: "useQuilty",
-    upSequnce: 1,
-    type: "number",
-  },
-  {
-    id: "trbt",
-    title: "탁도(NTU)",
-    upName: "useQuilty",
-    upSequnce: 2,
-    type: "number",
-  },
-  {
-    id: "grssClfg",
-    title: "총대장균군수(개/mg)",
-    upName: "useQuilty",
-    upSequnce: 3,
-    type: "number",
-  },
+  { id: 'order', title: "순번", mergeCell: true, widthPercent: 4 },
+  { id: "cityText", title: "시도", mergeCell: true, widthPercent: 5 },
+  { id: "sggText", title: "시군구", mergeCell: true, widthPercent: 5 },
+  { id: "bdstNm", title: "시설명", mergeCell: true, widthPercent: 7 },
+  { id: "operMngCdText", title: "운영관리형태", mergeCell: true, widthPercent: 6 },
+  { id: "oilqMeasMthdText", title: "유량측정방법", mergeCell: true, widthPercent: 6 },
+  { id: "anlOperCst", title: "연간운영비(원/년)", mergeCell: true, widthPercent: 7 },
+  { id: "dtfcltCpct", title: "빗물저류조용량(m³)", mergeCell: true, widthPercent: 6 },
+  { id: "chckYmd", title: "점검일", mergeCell: true, widthPercent: 5 },
+  { id: "utztnUsgCdText", title: "이용용도", widthPercent: 5 },
+  { id: "totalSplyUswtrUtztnQnt", title: "연간대체수이용량(m³)", widthPercent: 7 },
+  { id: "totalRuseFcltUtztnQnt", title: "연간빗물이용량(m³)", widthPercent: 7 },
+  { id: "ph", title: "수소이온농도(pH)", upName: "useQuilty", upSequnce: 1, type: "number", widthPercent: 5 },
+  { id: "trbt", title: "탁도(NTU)", upName: "useQuilty", upSequnce: 2, type: "number", widthPercent: 4 },
+  { id: "grssClfg", title: "총대장균군수(개/mg)", upName: "useQuilty", upSequnce: 3, type: "number", widthPercent: 5 },
 
-  {
-    id: "vltnDt",
-    title: "부과일(위반일)",
-    upName: "feeHist",
-    upSequnce: 1,
-    type: "text",
-  },
-  {
-    id: "vltnMttr",
-    title: "위반사항",
-    upName: "feeHist",
-    upSequnce: 2,
-    type: "text",
-  },
-  {
-    id: "levyAmt",
-    title: "부과금액(천원)",
-    upName: "feeHist",
-    upSequnce: 3,
-    type: "number",
-  },
+  { id: "vltnDt", title: "부과일(위반일)", upName: "feeHist", upSequnce: 1, type: "text", widthPercent: 5 },
+  { id: "vltnMttr", title: "위반사항", upName: "feeHist", upSequnce: 2, type: "text", widthPercent: 6 },
+  { id: "levyAmt", title: "부과금액(천원)", upName: "feeHist", upSequnce: 3, type: "number", widthPercent: 5 },
 ];
 
 export const ruseSttnHeadListExport: TableUpperProps[] = [
@@ -87,77 +51,62 @@ export const splSttnHeadListExport: TableUpperProps[] = [
   { id: "spl07", title: "7월", upName: "splWater", upSequnce: 8  },
   { id: "spl08", title: "8월", upName: "splWater", upSequnce: 9  },
   { id: "spl09", title: "9월", upName: "splWater", upSequnce: 10 },
-  {
-    id: "spl10",
-    title: "10월",
-    upName: "splWater",
-    upSequnce: 11,
-  },
-  {
-    id: "spl11",
-    title: "11월",
-    upName: "splWater",
-    upSequnce: 12,
-  },
-  {
-    id: "spl12",
-    title: "12월",
-    upName: "splWater",
-    upSequnce: 13,
-  },
+  { id: "spl10", title: "10월", upName: "splWater", upSequnce: 11 },
+  { id: "spl11", title: "11월", upName: "splWater", upSequnce: 12 },
+  { id: "spl12", title: "12월", upName: "splWater", upSequnce: 13 },
 ];
 
-export const rswtDetailHeadListExport: TableUpperProps[] = [
-  { id: "utztnUsgCdText", title: "이용용도" },
+// export const rswtDetailHeadListExport: TableUpperProps[] = [
+//   { id: "utztnUsgCdText", title: "이용용도" },
 
-  {
-    id: "grssClfgUswtr",
-    title: "총대장균군수",
-    upName: "detailQulity",
-    upSequnce: 2,
-  },
-  {
-    id: "combResdch",
-    title: "결합잔류염소",
-    upName: "detailQulity",
-    upSequnce: 3,
-  },
-  {
-    id: "trbt",
-    title: "탁도",
-    upName: "detailQulity",
-    upSequnce: 4,
-  },
-  {
-    id: "bod",
-    title: "BOD",
-    upName: "detailQulity",
-    upSequnce: 5,
-  },
-  {
-    id: "smll",
-    title: "냄새",
-    upName: "detailQulity",
-    upSequnce: 6,
-  },
-  {
-    id: "crmty",
-    title: "색도",
-    upName: "detailQulity",
-    upSequnce: 7,
-  },
-  { id: "tn", title: "T-N", upName: "detailQulity", upSequnce: 8},
-  {
-    id: "tph",
-    title: "T-P",
-    upName: "detailQulity",
-    upSequnce: 9,
-  },
-  { id: "ph", title: "pH", upName: "detailQulity", upSequnce: 10 },
-  {
-    id: "clIonQnt",
-    title: "염화물",
-    upName: "detailQulity",
-    upSequnce: 11,
-  },
-];
+//   {
+//     id: "grssClfgUswtr",
+//     title: "총대장균군수",
+//     upName: "detailQulity",
+//     upSequnce: 2,
+//   },
+//   {
+//     id: "combResdch",
+//     title: "결합잔류염소",
+//     upName: "detailQulity",
+//     upSequnce: 3,
+//   },
+//   {
+//     id: "trbt",
+//     title: "탁도",
+//     upName: "detailQulity",
+//     upSequnce: 4,
+//   },
+//   {
+//     id: "bod",
+//     title: "BOD",
+//     upName: "detailQulity",
+//     upSequnce: 5,
+//   },
+//   {
+//     id: "smll",
+//     title: "냄새",
+//     upName: "detailQulity",
+//     upSequnce: 6,
+//   },
+//   {
+//     id: "crmty",
+//     title: "색도",
+//     upName: "detailQulity",
+//     upSequnce: 7,
+//   },
+//   { id: "tn", title: "T-N", upName: "detailQulity", upSequnce: 8},
+//   {
+//     id: "tph",
+//     title: "T-P",
+//     upName: "detailQulity",
+//     upSequnce: 9,
+//   },
+//   { id: "ph", title: "pH", upName: "detailQulity", upSequnce: 10 },
+//   {
+//     id: "clIonQnt",
+//     title: "염화물",
+//     upName: "detailQulity",
+//     upSequnce: 11,
+//   },
+// ];
diff --git a/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/index.tsx b/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/index.tsx
index e99bdb7a8..7eb4f5396 100644
--- a/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/index.tsx
+++ b/apps/wr/app/store/prfmncSttn/chkgdnSttn/rainChkgdnSttn/index.tsx
@@ -43,16 +43,16 @@ export type rainChkSttnType = rainChkSttnState & rainChkSttnActions;
 
 export const rainChkSttnStateExport: rainChkSttnState = {
   rainChkSttn: {
-    rainChkRes: [],
-    fcltDiv: fcltDiv,
-    rainChkgdnHeadList: rainChkgdnHeadList,
-    ruseHeadList: ruseHeadList,
-    splHeadList: splHeadList,
-    rainHeadNm: rainHeadNm,
-    isInit: false,
-    sttnExcelList: [],
-    isSttn: false,
-    rainChkCount: 1,
+    rainChkRes: [], // 빗물이용시설 지도점검 현황 메인 목록 데이터
+    fcltDiv: fcltDiv, // 시설 구분 RST 중수도시설, RNB 빗물이용시설
+    rainChkgdnHeadList: rainChkgdnHeadList, // 메인 목록 테이블 헤더 정의
+    ruseHeadList: ruseHeadList, // 연간 빗물이용량 상세 테이블 헤더 정의
+    splHeadList: splHeadList, // 연간 대체수이용량 상세 테이블 헤더 정의
+    rainHeadNm: rainHeadNm, // 메인 목록 다단 헤더명 정의
+    isInit: false, // 현황 화면 초기 조회 완료 여부
+    sttnExcelList: [], // 엑셀 다운로드용 가공 데이터
+    isSttn: false, // 등록/현황 화면 구분 및 읽기 전용 제어 플래그
+    rainChkCount: 1, // 메인 목록 전체 건수
   },
 };
 
diff --git a/apps/wr/app/store/prfmncSttn/chkgdnSttn/rswtChkgdnSttn/headList.tsx b/apps/wr/app/store/prfmncSttn/chkgdnSttn/rswtChkgdnSttn/headList.tsx
index 831266e36..21a78b07d 100644
--- a/apps/wr/app/store/prfmncSttn/chkgdnSttn/rswtChkgdnSttn/headList.tsx
+++ b/apps/wr/app/store/prfmncSttn/chkgdnSttn/rswtChkgdnSttn/headList.tsx
@@ -1,142 +1,45 @@
 import type { TableUpperProps } from "@/app/store/common/type/header";
 
 export const rswtChkSttnHeadListExport: TableUpperProps[] = [
-  { id: "order", title: "순번", mergeCell: true },
-  { id: "cityText", title: "시도", mergeCell: true },
-  { id: "sggText", title: "시군구", mergeCell: true },
-  { id: "bdstNm", title: "시설명", mergeCell: true },
-  { id: "operMngCd", title: "운영관리형태", mergeCell: true },
-  { id: "anlOperCst", title: "연간운영비(원/년)", mergeCell: true },
-  { id: "prcsCpct", title: "처리용량(m³)", mergeCell: true },
-  { id: "spwtPositn", title: "채수지점", mergeCell: true },
-  { id: "chckYmd", title: "점검일", mergeCell: true },
-  { id: "utztnUsgCdText", title: "이용용도" },
-  { id: "splyUswtrUtztnQnt", title: "연간보급수이용량(m³)", type: "number" },
-  { id: "ruseFcltUtztnQnt", title: "연간중수도이용량(m³)", type: "number" },
+  { id: "order", title: "순번", mergeCell: true, widthPercent: 4 },
+  { id: "cityText", title: "시도", mergeCell: true, widthPercent: 7 },
+  { id: "sggText", title: "시군구", mergeCell: true, widthPercent: 5 },
+  { id: "bdstNm", title: "시설명", mergeCell: true, widthPercent: 10 },
+  { id: "operMngCd", title: "운영관리형태", mergeCell: true, widthPercent: 6 },
+  { id: "anlOperCst", title: "연간운영비(원/년)", mergeCell: true, widthPercent: 7 },
+  { id: "prcsCpct", title: "처리용량(m³)", mergeCell: true, widthPercent: 6 },
+  { id: "spwtPositn", title: "채수지점", mergeCell: true, widthPercent: 6 },
+  { id: "chckYmd", title: "점검일", mergeCell: true, widthPercent: 7 },
+  { id: "utztnUsgCdText", title: "이용용도", widthPercent: 7 },
+  { id: "splyUswtrUtztnQnt", title: "연간보급수이용량(m³)", type: "number", widthPercent: 5 },
+  { id: "ruseFcltUtztnQnt", title: "연간중수도이용량(m³)", type: "number", widthPercent: 5 },
 
-  {
-    id: "grssClfgUswtr",
-    title: "총대장균군수(개/mg)",
-    upName: "useQuilty",
-    upSequnce: 1,
-    type: "number",
-  },
-  {
-    id: "combResdch",
-    title: "결합잔류염소(mh/L)",
-    upName: "useQuilty",
-    upSequnce: 2,
-    type: "number",
-  },
-  {
-    id: "trbt",
-    title: "탁도(NTU)",
-    upName: "useQuilty",
-    upSequnce: 3,
-    type: "number",
-  },
-  {
-    id: "bod",
-    title: "BOD(mg/L)",
-    upName: "useQuilty",
-    upSequnce: 4,
-    type: "number",
-  },
-  {
-    id: "smll",
-    title: "냄새",
-    upName: "useQuilty",
-    upSequnce: 5,
-    type: "text",
-  },
-  {
-    id: "crmty",
-    title: "색도(도)",
-    upName: "useQuilty",
-    upSequnce: 6,
-    type: "number",
-  },
-  { id: "tn", title: "총질소(T-N)(mg/L)", upName: "useQuilty", upSequnce: 7, type: "number" },
-  {
-    id: "tph",
-    title: "총인(T-P)(mg/L)",
-    upName: "useQuilty",
-    upSequnce: 8,
-    type: "number",
-  },
-  { id: "ph", title: "수소이온농도(pH)", upName: "useQuilty", upSequnce: 9, type: "text" },
-  {
-    id: "clIonQnt",
-    title: "염화물(mg/L)",
-    upName: "useQuilty",
-    upSequnce: 10,
-    type: "number",
-  },
+  { id: "grssClfgUswtr", title: "총대장균군수(개/mg)", upName: "useQuilty", upSequnce: 1, type: "number", widthPercent: 6 },
+  { id: "combResdch", title: "결합잔류염소(mh/L)", upName: "useQuilty", upSequnce: 2, type: "number", widthPercent: 6 },
+  { id: "trbt", title: "탁도(NTU)", upName: "useQuilty", upSequnce: 3, type: "number", widthPercent: 4 },
+  { id: "bod", title: "BOD (mg/L)", upName: "useQuilty", upSequnce: 4, type: "number", widthPercent: 4 },
+  { id: "smll", title: "냄새", upName: "useQuilty", upSequnce: 5, type: "text", widthPercent: 4 },
+  { id: "crmty", title: "색도(도)", upName: "useQuilty", upSequnce: 6, type: "number", widthPercent: 4 },
+  { id: "tn", title: "총질소(T-N)(mg/L)", upName: "useQuilty", upSequnce: 7, type: "number", widthPercent: 5 },
+  { id: "tph", title: "총인(T-P)(mg/L)", upName: "useQuilty", upSequnce: 8, type: "number", widthPercent: 5 },
+  { id: "ph", title: "수소이온농도(pH)", upName: "useQuilty", upSequnce: 9, type: "text", widthPercent: 5 },
+  { id: "clIonQnt", title: "염화물(mg/L)", upName: "useQuilty", upSequnce: 10, type: "number", widthPercent: 5 },
 
-  {
-    id: "vltnDt",
-    title: "부과일(위반일)",
-    upName: "feeHist",
-    upSequnce: 1,
-    type: "text",
-  },
-  {
-    id: "vltnMttr",
-    title: "위반사항",
-    upName: "feeHist",
-    upSequnce: 2,
-    type: "text",
-  },
-  {
-    id: "levyAmt",
-    title: "부과금액(천원)",
-    upName: "feeHist",
-    upSequnce: 3,
-    type: "number",
-  },
+  { id: "vltnDt", title: "부과일(위반일)", upName: "feeHist", upSequnce: 1, type: "text", widthPercent: 5 },
+  { id: "vltnMttr", title: "위반사항", upName: "feeHist", upSequnce: 2, type: "text", widthPercent: 6 },
+  { id: "levyAmt", title: "부과금액(천원)", upName: "feeHist", upSequnce: 3, type: "number", widthPercent: 5 },
 ];
 
 export const rswtDetailSttnHeadListExport: TableUpperProps[] = [
-  { id: "utztnUsgCd", title: "이용용도" },
-
-  {
-    id: "grssClfgUswtr",
-    title: "총대장균군수",
-    upName: "detailQulity",
-    upSequnce: 2,
-  },
-  {
-    id: "combResdch",
-    title: "결합잔류염소",
-    upName: "detailQulity",
-    upSequnce: 3,
-  },
-  {
-    id: "trbt",
-    title: "탁도",
-    upName: "detailQulity",
-    upSequnce: 4,
-  },
-  { id: "bod", title: "BOD", upName: "detailQulity", upSequnce: 5 },
-  {
-    id: "smll",
-    title: "냄새",
-    upName: "detailQulity",
-    upSequnce: 6,
-  },
-  {
-    id: "crmty",
-    title: "색도",
-    upName: "detailQulity",
-    upSequnce: 7,
-  },
-  { id: "tn", title: "T-N", upName: "detailQulity", upSequnce: 8},
-  { id: "tph", title: "T-P", upName: "detailQulity", upSequnce: 9 },
-  { id: "ph", title: "pH", upName: "detailQulity", upSequnce: 10 },
-  {
-    id: "clIonQnt",
-    title: "염화물",
-    upName: "detailQulity",
-    upSequnce: 11,
-  },
+  { id: "utztnUsgCd", title: "이용용도", widthPercent: 20 },
+  { id: "grssClfgUswtr", title: "총대장균군수", upName: "detailQulity", upSequnce: 2, widthPercent: 8 },
+  { id: "combResdch", title: "결합잔류염소", upName: "detailQulity", upSequnce: 3, widthPercent: 8 },
+  { id: "trbt", title: "탁도", upName: "detailQulity", upSequnce: 4, widthPercent: 8 },
+  { id: "bod", title: "BOD", upName: "detailQulity", upSequnce: 5, widthPercent: 8 },
+  { id: "smll", title: "냄새", upName: "detailQulity", upSequnce: 6, widthPercent: 8 },
+  { id: "crmty", title: "색도", upName: "detailQulity", upSequnce: 7, widthPercent: 8 },
+  { id: "tn", title: "T-N", upName: "detailQulity", upSequnce: 8, widthPercent: 8 },
+  { id: "tph", title: "T-P", upName: "detailQulity", upSequnce: 9, widthPercent: 8 },
+  { id: "ph", title: "pH", upName: "detailQulity", upSequnce: 10, widthPercent: 8 },
+  { id: "clIonQnt", title: "염화물", upName: "detailQulity", upSequnce: 11, widthPercent: 8 },
 ];
diff --git a/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/headList.tsx b/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/headList.tsx
index b6641a796..0df7ec37c 100644
--- a/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/headList.tsx
+++ b/apps/wr/app/store/prfmncSttn/pbnstPrfmncSttn/headList.tsx
@@ -5,31 +5,36 @@ export const pbnstPrfmncSttnHeadListExport: TableUpperProps[] = [
         id: "number",
         title: "No",
         rowSpan: 2,
-        row: 0
+        row: 0,
+        widthPercent: 4,
     },
     {
         id: "sido",
         title: "시도",
         rowSpan: 2,
-        row: 0
+        row: 0,
+        widthPercent: 6,
     },
     {
         id: "gugun",
         title: "시군구",
         rowSpan: 2,
-        row: 0
+        row: 0,
+        widthPercent: 6,
     },
     {
         id: "bscFctNm",
         title: "시설명",
         rowSpan: 2,
-        row: 0
+        row: 0,
+        widthPercent: 10,
     },
     {
         id: "ruseUtztnFcltNm",
         title: "재이용시설명",
         rowSpan: 2,
-        row: 0
+        row: 0,
+        widthPercent: 12,
     },
 
 ]
@@ -39,22 +44,26 @@ export const pbnstYearHeadListExport: TableUpperProps[] = [
         id: "year",
         title: "년도",
         colSpan: 3,
-        row: 0
+        row: 0,
+        widthPercent: 18,
     },
     {
         id: "total",
         title: "계(m³)",
-        row: 1
+        row: 1,
+        widthPercent: 6,
     },
     {
         id: "inUsage",
         title: "장내용수(m³)",
-        row: 1
+        row: 1,
+        widthPercent: 6,
     },
     {
         id: "outUsage",
         title: "장외용수(m³)",
-        row: 1
+        row: 1,
+        widthPercent: 6,
     },
 ]
 
@@ -78,4 +87,4 @@ export const monthSttnHeadListExport: TableUpperProps[] = [
   { id: "10월", title: "10"  },
   { id: "11월", title: "11월" },
   { id: "12월", title: "12월",  },
-];
\ No newline at end of file
+];
diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/htdflReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/htdflReg/index.tsx
index 0dc6e3f75..25ceaee65 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltReg/htdflReg/index.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltReg/htdflReg/index.tsx
@@ -1,7 +1,6 @@
-import { getFetchWithCount, postFectch, putFectch, deleteFectch } from "@/components/lib/api";
+import { getFetchWithCount, postFectch, putFectch, deleteFectch } from "@/components/lib/api";
 
 import type { TableUpperProps } from "@/app/store/common/type/header";
-import toast from "react-hot-toast";
 import { z } from "zod";
 import { makeMdfr, makeRstr } from "../bdstReg";
 import {
@@ -100,9 +99,9 @@ export type htdflFacState = {
 type htdflFacSActions = {
   initHtdflReg: (code: string) => void;
   htdflNmSearch: (code: string | number, fcltNm:string) => void;
-  htdflBdstUpdate: (data: customHtdflBdst, code: string | number,myUUID:string) => void;
-  htdflBdstReg: (data: customHtdflBdst, code: string | number,myUUID:string) => void;
-  htdflBdstDelete: (data: customHtdflBdst, code: string | number) => void;
+  htdflBdstUpdate: (data: customHtdflBdst, code: string | number,myUUID:string) => Promise<string>;
+  htdflBdstReg: (data: customHtdflBdst, code: string | number,myUUID:string) => Promise<string>;
+  htdflBdstDelete: (data: customHtdflBdst, code: string | number) => Promise<string>;
   getHtdflBdstData: (pageNation: number, code: string | number) => void;
   resetHtdflTableIndex:(index:number)=>void;
 };
@@ -172,11 +171,13 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
       }
     },
     htdflBdstUpdate: async (data: customHtdflBdst, code: string | number,myUUID:string) => {
+      const successMessage = "온배수 시설물 수정이 완료되었습니다.";
+      const failMessage = "온배수 시설물 수정 오류입니다..";
       try {
         const chData = await makeMdfr(data,myUUID);
         const res = await putFectch("/drain/facility", chData);
-        if (res.status) {
-          toast.success("온배수 시설물 수정이 완료되었습니다.");
+        if (!res.status) {
+          return failMessage;
         }
         const htdflRes = await getFetchWithCount(
           "wr",
@@ -191,20 +192,23 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
             isInit: false,
           },
         }));
+        return successMessage;
       } catch (errorUpdate) {
-        toast.error("온배수 시설물 수정 오류입니다..");
         console.log(errorUpdate);
+        return failMessage;
       }
     },
     htdflBdstReg: async (data: customHtdflBdst, code: string | number,myUUID:string) => {
+      const successMessage = "온배수 시설 등록이 완료되었습니다.";
+      const failMessage = "온배수 시설물 등록 오류입니다..";
       try {
         // data는 단일 객체이므로 .map을 사용할 수 없습니다.
         // 등록 시에는 건축물 변경 이력이 없으므로 chgBuilding을 빈 배열로 설정하고,
         // API가 배열을 기대하므로 단일 객체를 배열로 감싸줍니다.
         const chData = makeRstr(data,myUUID);
         const res = await postFectch("/drain/facility", chData);
-        if (res.status ===200) {
-            toast.success("온배수 시설 등록이 완료되었습니다.");
+        if (res.status !== 200) {
+          return failMessage;
         }
         const htdflRes = await initFetch(String(code));
         set((state: htdflFacState) => ({
@@ -216,17 +220,18 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
             isInit: false,
           },
         }));
+        return successMessage;
       } catch (errorReg) {
-        toast.error("온배수 시설물 등록 오류입니다..");
         console.log(errorReg);
-
+        return failMessage;
       }
     },
     // 온배수시설을 삭제한다.
     htdflBdstDelete: async (data: customHtdflBdst, code: string | number) => {
+      const successMessage = `${data.bdstNm} 시설이 삭제되었습니다.`;
+      const failMessage = "삭제 중 오류가 발생했습니다.";
       try {
         await deleteFectch(`/drain/facility/${data.reuseBuilding?.[0]?.bdstRuseFcltSn}`);
-        toast.success(`${data.bdstNm} 시설이 삭제되었습니다.`);
 
         const htdflRes = await initFetch(String(code));
         set((state: htdflFacState) => ({
@@ -237,10 +242,10 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
             htdflResCount: htdflRes.count,
           },
         }));
+        return successMessage;
       } catch (e) {
         console.log("e", e);
-        const errorMessage = e instanceof Error ? e.message : "삭제 중 오류가 발생했습니다.";
-        toast.error(errorMessage);
+        return e instanceof Error ? e.message : failMessage;
       } finally {
       }
     },
@@ -279,3 +284,4 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
 
   };
 };
+
diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx
index d595a0624..35458abd5 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx
@@ -1,4 +1,4 @@
-import { TEST_UUID } from "../rainReg";
+import { TEST_UUID } from "../rainReg";
 import {
   deleteFectch,
   fetchType,
@@ -24,7 +24,6 @@ import {
   fcOrgwtsHeadListExport,
 } from "./headList";
 import type { TableUpperProps } from "@/app/store/common/type/header";
-import toast from "react-hot-toast";
 
 /**
  *   하수재이용시설 등록 (스토어)
@@ -67,9 +66,10 @@ type pubFacActions = {
   pubHasuInit: (page: string, sggOrCity: string) => void;
   pbnstRegClick: (pubHasuRes: pubHasuType) => void;
   //pbnstReg: (txt: string | undefined) => void;
-  pbnstInsert(pbnstRes: customPbnst): Promise<void>;
+  pbnstInsert(pbnstRes: customPbnst): Promise<string>;
   fileDelete: (atflCd: string) => void;
   fileDownLoad: (atflCd: string) => void;
+  fileDownLoadName: (atflCd: string, fileName: string) => void;
   pbnstRuseFcltUpdate: (ruseRes: customPbnst[]) => void;
   pbnstRuseBizUpdate: (ruseRes: fcBizType[]) => void;
   pubHasuSearch: (page: string, sggOrCity: string, searchTxt: string) => void;
@@ -226,26 +226,28 @@ export const pubFacActionsExport: (set: any) => pubFacActions = (set: any) => {
     },
     // 하수재이용시설을 등록한다.
     pbnstInsert: async (pbnstRes: customPbnst) => {
+      const successMessage = `${pbnstRes.ruseUtztnFcltNm}  하수재이용 시설이 등록되었습니다.`;
+      const failMessage = "하수재이용 시설 등록 중 오류가 발생했습니다.";
       try {
         const response = await postFectch(`/reuseFc/pubFc`, pbnstRes);
-        if (response.status === 200) {
-          toast.success(
-            `${pbnstRes.ruseUtztnFcltNm}  하수재이용 시설이 등록되었습니다.`
-          );
+        if (response.status !== 200) {
+          return failMessage;
         }
 
         const newPbnstRes = await initFetch(
           pbnstRes.pbnstRuseFcltId.slice(0, 11)
         );
-        return set((state: pubFacState) => ({
+        set((state: pubFacState) => ({
           ...state,
           pbnst: {
             ...state.pbnst,
             pbnstRes: newPbnstRes,
           },
         }));
+        return successMessage;
       } catch (error) {
         console.error("Error updating pbnst:", error);
+        return failMessage;
       }
     },
     // 하수재이용시설을 업데이트한다.(사업제외) 다르게하는 이유는 객체가 너무커서 분활 처리하려고
@@ -296,6 +298,34 @@ export const pubFacActionsExport: (set: any) => pubFacActions = (set: any) => {
         throw new Error(`Error downloading file: ${error}`);
       }
     },
+    // 파일다운로드(원본 파일명 지정) : 화면에 보여지는 파일명으로 저장
+    fileDownLoadName: async (atflCd: string, fileName: string) => {
+      try {
+        const response = await fetch(
+          `/attach-service/api/v1/atflcd/download/${atflCd}`,
+          {
+            method: "GET",
+            headers: {
+              accept: "application/octet-stream",
+            },
+          }
+        );
+        if (!response.ok) {
+          throw new Error(`오류 발생: ${response.status}`);
+        }
+        console.log(response);
+        const blob = await response.blob();
+        const blobUrl = window.URL.createObjectURL(blob);
+        const a = document.createElement("a");
+        a.href = blobUrl;
+        a.download = fileName || "downloaded_file";
+        a.click();
+        window.URL.revokeObjectURL(blobUrl);
+      } catch (error) {
+        console.error("Error downloading file with name:", error);
+        throw new Error(`Error downloading file with name: ${error}`);
+      }
+    },
     //원수취수 팝업의 하수처리 시설 리스트 조회
     getFcOrgwts: async (fcltPkList: string[], size: number) => {
       const fcOrgwtsNmList = await postFectch(
@@ -314,3 +344,4 @@ export const pubFacActionsExport: (set: any) => pubFacActions = (set: any) => {
     },
   };
 };
+
diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx
index e95c4c48d..f6a5f520e 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx
@@ -1,4 +1,4 @@
-import type { TableUpperProps } from "@/app/store/common/type/header";
+import type { TableUpperProps } from "@/app/store/common/type/header";
 import {
   deleteFectch,
   fetchType,
@@ -6,7 +6,6 @@ import {
   postFectch,
   putFectch,
 } from "@/components/lib/api";
-import toast from "react-hot-toast";
 import { z } from "zod";
 import { makeMdfr, makeRstr } from "../bdstReg";
 import {
@@ -96,9 +95,9 @@ type rainFacSActions = {
   initRain: (code: string | number) => void;
   getRainData: (pageNation: number, code: string | number) => void;
   rainSearch: (txt: string, pageNation: number, code: string) => void;
-  rainBdstReg: (data: customRainBdst, code: string | number,myUUID:string) => void;
-  rainBdstUpdate: (data: customRainBdst, code: string | number,myUUID:string) => void;
-  rainBdstDelete: (data: customRainBdst, code: string | number) => void;
+  rainBdstReg: (data: customRainBdst, code: string | number,myUUID:string) => Promise<string>;
+  rainBdstUpdate: (data: customRainBdst, code: string | number,myUUID:string) => Promise<string>;
+  rainBdstDelete: (data: customRainBdst, code: string | number) => Promise<string>;
   resetRainTableIndex:(index:number)=>void;
 };
 
@@ -187,9 +186,13 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
     },
     // 빗물 이용시설을 등록한다.
     rainBdstReg: async (data: customRainBdst, code: string | number,myUUID:string) => {
+      const successMessage = "건축물 등록이 완료되었습니다.";
+      const failMessage = "등록시 오류가 발생하였습니다.";
+      const changeBuildingFailMessage = "건축물 증축/개축/재축 오류입니다.";
       try {
         const test = await makeRstr(data,myUUID);
         const res = await postFectch("/reuseFc/rainyInfo", test);
+        let message = failMessage;
         if (res.status === 200) {
           if (data.chgBuilding.length > 0) {
             const chPK = res?.data?.bdstInfoSn;
@@ -200,15 +203,13 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
             const chch = await postFectch("/reuseFc/chgBuilding", makeCh);
 
             if (chch.status === 200) {
-              toast.success("건축물 등록이 완료되었습니다.");
+              message = successMessage;
             } else {
-              toast.error("건축물 증축/개축/재축 오류입니다.");
+              message = changeBuildingFailMessage;
             }
           } else {
-            toast.success("건축물 등록이 완료되었습니다.");
+            message = successMessage;
           }
-        } else {
-          toast.error("건축물 등록이 완료되었습니다.");
         }
         const rainRes = await initFetch(code);
         set((state: rainFacState) => ({
@@ -219,17 +220,21 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
             rainResCount: rainRes.count,
           },
         }));
+        return message;
       } catch (e) {
         console.log("e", e);
-        toast.error("등록시 오류가 발생하였습니다.");
-      } finally {
+        return failMessage;
       }
     },
     // 빗물이용시설 시설에 대한 사항을 업데이트한다
     rainBdstUpdate: async (data: customRainBdst, code: string | number,myUUID:string) => {
+      const successMessage = "건축물 수정이 완료되었습니다.";
+      const failMessage = "수정시 오류가 발생하였습니다.";
+      const changeBuildingFailMessage = "건축물 증축/개축/재축 오류입니다.";
       try {
         const chData = await makeMdfr(data,myUUID);
         const res = await putFectch("/reuseFc/rainyInfo", chData);
+        let message = failMessage;
         if (res.status === 200) {
           if (data.chgBuilding.length > 0) {
             const chPK = data?.bdstInfoSn;
@@ -240,17 +245,14 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
             const chch = await postFectch("/reuseFc/chgBuilding", makeCh);
 
             if (chch.status === 200) {
-              toast.success("건축물 수정이 완료되었습니다.");
+              message = successMessage;
             } else {
-              toast.error("건축물 증축/개축/재축 오류입니다.");
+              message = changeBuildingFailMessage;
             }
           } else {
-
            await deleteFectch("/reuseFc/DeleteChgBuilding" , data.bdstInfoSn);
-            toast.success("건축물 수정이 완료되었습니다.");
+            message = successMessage;
           }
-        } else {
-          toast.error("건축물 수정이 완료되었습니다.");
         }
 
         const rainRes = await initFetch(code);
@@ -262,17 +264,18 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
             rainResCount: rainRes.count,
           },
         }));
+        return message;
       } catch (e) {
         console.log("e", e);
-        toast.error("수정시 오류가 발생하였습니다.");
-      } finally {
+        return failMessage;
       }
     },
     // 빗물 이용시설을 삭제한다.
     rainBdstDelete: async (data: customRainBdst, code: string | number) => {
+      const successMessage = `${data.bdstNm} 시설이 삭제되었습니다.`;
+      const failMessage = "삭제 중 오류가 발생했습니다.";
       try {
         await deleteFectch(`/reuseFc/rainyInfo/${data.reuseBuilding?.[0]?.bdstRuseFcltSn}`);
-        toast.success(`${data.bdstNm} 시설이 삭제되었습니다.`);
 
         const rainRes = await initFetch(code);
         set((state: rainFacState) => ({
@@ -283,10 +286,10 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
             rainResCount: rainRes.count,
           },
         }));
+        return successMessage;
       } catch (e) {
         console.log("e", e);
-        const errorMessage = e instanceof Error ? e.message : "삭제 중 오류가 발생했습니다.";
-        toast.error(errorMessage);
+        return e instanceof Error ? e.message : failMessage;
       } finally {
       }
     },
@@ -306,3 +309,4 @@ export const rainFacActionsExport: (set: any) => rainFacSActions = (
     },
   };
 };
+
diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/rswtReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/rswtReg/index.tsx
index f38636507..3ef1af2e5 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltReg/rswtReg/index.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltReg/rswtReg/index.tsx
@@ -1,8 +1,7 @@
-import { deleteFectch, getFetchWithCount, postFectch, putFectch } from "@/components/lib/api";
+import { deleteFectch, getFetchWithCount, postFectch, putFectch } from "@/components/lib/api";
 import { upHeadList, type chgBuilding } from "../rainReg";
 
 import type { TableUpperProps } from "@/app/store/common/type/header";
-import toast from "react-hot-toast";
 import { z } from "zod";
 import { makeMdfr, makeRstr } from "../bdstReg";
 import { baseReuseBuildingSchema, chgBuildingSchema, validationMessages } from "../rainReg/type";
@@ -67,15 +66,15 @@ export type rswtFacState = {
 };
 type rswtFacSActions = {
   initRswt: (code: string | number) => void;
-  rswtBdstUpdate: (data: customRswtBdst, code: string | number,myUUID:string) => void;
+  rswtBdstUpdate: (data: customRswtBdst, code: string | number,myUUID:string) => Promise<string>;
   getRswtBdstData: (pageNation: number, code: string | number) => void;
   rswtBdstSearch: (
     txt: string,
     pageNation: number,
     code: string | number
   ) => void;
-  rswtBdstReg: (data: customRswtBdst, code: string | number,myUUID:string) => void;
-  rswtBdstDelete: (data: customRswtBdst, code: string | number) => void;
+  rswtBdstReg: (data: customRswtBdst, code: string | number,myUUID:string) => Promise<string>;
+  rswtBdstDelete: (data: customRswtBdst, code: string | number) => Promise<string>;
   resetRswtTableIndex:(index:number)=>void;
 };
 
@@ -162,9 +161,13 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
     },
           // 중수도 시설에 대한 사항을 업데이트한다 
     rswtBdstUpdate: async (data: customRswtBdst, code: string | number,myUUID:string) => {
+      const successMessage = "중수도 건축물 수정이 완료되었습니다.";
+      const failMessage = "중수도 건축물 수정 오류입니다.";
+      const changeBuildingFailMessage = "중수도 건축물 증축/개축/재축 오류입니다.";
       try {
         const chData = await makeMdfr(data,myUUID);
         const res = await putFectch("/reuseFc/waterreuseFc", chData);
+        let message = failMessage;
         if (res.status === 200) {
           if (data.chgBuilding.length > 0) {
             const chPK = data?.bdstInfoSn;
@@ -177,16 +180,14 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
             const chch = await postFectch("/reuseFc/chgBuilding", makeCh);
 
             if (chch.status === 200) {
-              toast.success("중수도 건축물 수정이 완료되었습니다.");
+              message = successMessage;
             } else {
-              toast.error("중수도 건축물 증축/개축/재축 오류입니다.");
+              message = changeBuildingFailMessage;
             }
           } else {
             await deleteFectch("/reuseFc/DeleteChgBuilding" , data.bdstInfoSn);
-            toast.success("중수도 건축물 수정이 완료되었습니다.");
+            message = successMessage;
           }
-        } else {
-          toast.error("중수도 건축물 수정이 완료되었습니다.");
         }
         const rswtRes = await initFetch(code);
         set((state: rswtFacState) => ({
@@ -197,18 +198,23 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
             rswtResCount: rswtRes.count,
           },
         }));
+        return message;
 
       } catch (errorUpdate) {
-        toast.error("중수도 건축물 수정 오류입니다.");
         console.error(errorUpdate);
-      } finally {
+        return failMessage;
       }
     },
               // 중수도 시설을 등록한다.
     rswtBdstReg: async (data: customRswtBdst, code: string | number,myUUID:string) => {
+      const successMessage = "건축물(중수도) 등록이 완료되었습니다.";
+      const successWithChangeMessage = "건축물(중수도) 및  증축/개축/재축 등록이 완료되었습니다.";
+      const failMessage = "등록시 오류가 발생하였습니다.";
+      const changeBuildingFailMessage = "건축물(중수도) 증축/개축/재축 오류입니다.";
       try {
         const chData = await makeRstr(data,myUUID);
         const res = await postFectch("/reuseFc/waterreuseFc", chData);
+        let message = failMessage;
         if (res.status === 200) {
           if (data.chgBuilding.length > 0) {
 
@@ -223,15 +229,13 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
 
             if (chch.status === 200) {
 
-              toast.success("건축물(중수도) 및  증축/개축/재축 등록이 완료되었습니다.");
+              message = successWithChangeMessage;
             } else {
-              toast.error("건축물(중수도) 증축/개축/재축 오류입니다.");
+              message = changeBuildingFailMessage;
             }
           } else {
-            toast.success("건축물(중수도) 등록이 완료되었습니다.");
+            message = successMessage;
           }
-        } else {
-          toast.error("건축물(중수도) 등록이 완료하였습니다.");
         }
         const rswtRes = await initFetch(code);
         set((state: rswtFacState) => ({
@@ -242,17 +246,18 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
             rswtResCount: rswtRes.count,
           },
         }));
+        return message;
       } catch (e) {
         console.log("e", e);
-        toast.error("등록시 오류가 발생하였습니다.");
-      } finally {
+        return failMessage;
       }
     },
     // 중수도시설을 삭제한다.
     rswtBdstDelete: async (data: customRswtBdst, code: string | number) => {
+      const successMessage = `${data.bdstNm} 시설이 삭제되었습니다.`;
+      const failMessage = "삭제 중 오류가 발생했습니다.";
       try {
         await deleteFectch(`/reuseFc/waterreuseFc/${data.reuseBuilding?.[0]?.bdstRuseFcltSn}`);
-        toast.success(`${data.bdstNm} 시설이 삭제되었습니다.`);
 
         const rswtRes = await initFetch(code);
         set((state: rswtFacState) => ({
@@ -263,10 +268,10 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
             rswtResCount: rswtRes.count,
           },
         }));
+        return successMessage;
       } catch (e) {
         console.log("e", e);
-        const errorMessage = e instanceof Error ? e.message : "삭제 중 오류가 발생했습니다.";
-        toast.error(errorMessage);
+        return e instanceof Error ? e.message : failMessage;
       } finally {
       }
     },
@@ -286,3 +291,4 @@ export const rswtFacActionsExport: (set: any) => rswtFacSActions = (
         },
   };
 };
+
diff --git a/apps/wr/app/store/ruseFcltMng/fcltSttn/htdflSttn/headList.tsx b/apps/wr/app/store/ruseFcltMng/fcltSttn/htdflSttn/headList.tsx
index a37067775..76049d5c9 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltSttn/htdflSttn/headList.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltSttn/htdflSttn/headList.tsx
@@ -7,94 +7,112 @@ export const htdflSttHeadListExport: z.infer<typeof sttnHeadListType> = [
     id: "cityText",
     title: "시도",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "sggText",
     title: "시군구",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "bdstNm",
     title: "발전소명",
     visible: true,
+    widthPercent: 7,
   },
   {
     id: "daddr",
     title: "주소",
     visible: true,
+    widthPercent: 9,
   },
   {
     id: "frstArchPrmsnDt",
     title: "준공년월",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "etgtType",
     title: "발전유형",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "fclCpct",
     title: "설비용량(KW)",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "plwtYn",
     title: "담수화여부",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "orgwtWtritSpt",
     title: "원수취수지점",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "wtritEntrcTp",
     title: "취수구온도(℃)",
     visible: true,
+    widthPercent: 5,
   },
 
   {
     id: "orgwtOcrnProcs",
     title: "원수발생공정",
     visible: true,
+    widthPercent: 6,
   },
 
   {
     id: "amtgnr",
     title: "발생량",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "prcsProcsYn",
     title: "처리공정여부",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "prcsFcltCpct",
     title: "처리시설용량(m³)",
     visible: true,
+    widthPercent: 6,
   },
   {
     id: "fmYn",
     title: "유량계여부",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "utztnCpct",
     title: "이용량(m³)",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "utztnUsg",
     title: "이용용도",
     visible: true,
+    widthPercent: 4,
   },
 
   {
     id: "emsnExitTp",
     title: "배출구온도(℃)",
     visible: true,
+    widthPercent: 4,
   },
  
 ];
diff --git a/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/headList.tsx b/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/headList.tsx
index ac766b0b3..71c4c01d7 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/headList.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltSttn/pbnstSttn/headList.tsx
@@ -6,31 +6,31 @@ import type {
 import { z } from "zod";
 
 export const pbnSttHeadListExport: z.infer<typeof sttnHeadListType> = [
-  { id: "rvbsn", title: "권역", visible: true },
-  { id: "lgbsn", title: "단위유역", visible: true, },
-  { id: "mdmbsn", title: "중권역", visible: true, },
-  { id: "rgnNm", title: "환경청", visible: true },
-  { id: "sido", title: "시도", visible: true, },
-  { id: "gugun", title: "시군구", visible: true, },
-  { id: "bscFctNm", title: "시설명", visible: true },
-  { id: "efflWqltStndrdNm", title: "지역구분", visible: true },
+  { id: "rvbsn", title: "권역", visible: true, widthPercent: 4 },
+  { id: "lgbsn", title: "단위유역", visible: true, widthPercent: 4 },
+  { id: "mdmbsn", title: "중권역", visible: true, widthPercent: 4 },
+  { id: "rgnNm", title: "환경청", visible: true, widthPercent: 5 },
+  { id: "sido", title: "시도", visible: true, widthPercent: 4 },
+  { id: "gugun", title: "시군구", visible: true, widthPercent: 4 },
+  { id: "bscFctNm", title: "시설명", visible: true, widthPercent: 7 },
+  { id: "efflWqltStndrdNm", title: "지역구분", visible: true, widthPercent: 5 },
 
-  { id: "tel", title: "전화번호", visible: true },
-  { id: "fctCpc", title: "시설용량(톤/일)", visible: true },
-  { id: "ruseUtztnFcltNm", title: "재이용시설명", visible: true },
+  { id: "tel", title: "전화번호", visible: true, widthPercent: 6 },
+  { id: "fctCpc", title: "시설용량(톤/일)", visible: true, widthPercent: 5 },
+  { id: "ruseUtztnFcltNm", title: "재이용시설명", visible: true, widthPercent: 7 },
 
-  { id: "fcltCpct", title: "시설용량(m³/일)", visible: true, },
-  { id: "splyExtraCpct", title: "하수처리량(m³/일)", visible: true, },
-  { id: "ruseCpct", title: "재이용량(m³/일)", visible: true, },
+  { id: "fcltCpct", title: "시설용량(m³/일)", visible: true, widthPercent: 5 },
+  { id: "splyExtraCpct", title: "하수처리량(m³/일)", visible: true, widthPercent: 5 },
+  { id: "ruseCpct", title: "재이용량(m³/일)", visible: true, widthPercent: 5 },
 
-  { id: "usageTotal", title: "합계", visible: true, },
-  { id: "inUsage", title: "장내용수", visible: true, },
-  { id: "outUsage", title: "장외용수", visible: true, },
+  { id: "usageTotal", title: "합계", visible: true, widthPercent: 4 },
+  { id: "inUsage", title: "장내용수", visible: true, widthPercent: 4 },
+  { id: "outUsage", title: "장외용수", visible: true, widthPercent: 4 },
 
-  { id: "operMthd", title: "운영방식", visible: true, },
-  { id: "rprtvBzenty", title: "대행업체", visible: true, },
-  { id: "bgngDt", title: "시작일", visible: true, },
-  { id: "endDt", title: "종료일", visible: true, },
+  { id: "operMthd", title: "운영방식", visible: true, widthPercent: 4 },
+  { id: "rprtvBzenty", title: "대행업체", visible: true, widthPercent: 5 },
+  { id: "bgngDt", title: "시작일", visible: true, widthPercent: 4 },
+  { id: "endDt", title: "종료일", visible: true, widthPercent: 4 },
 ];
 
 // id는 다확인해야함
diff --git a/apps/wr/app/store/ruseFcltMng/fcltSttn/rainSttn/headList.tsx b/apps/wr/app/store/ruseFcltMng/fcltSttn/rainSttn/headList.tsx
index a461b3336..5eae0cbfc 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltSttn/rainSttn/headList.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltSttn/rainSttn/headList.tsx
@@ -6,41 +6,43 @@ export const sttnHeadListType = z.array(
     id: z.string(),
     title: z.string(),
     visible: z.boolean(),
+    widthPercent: z.number().optional(),
   })
 );
 
+// 빗물이용시설
 export const rainSttHeadListExport: z.infer<typeof sttnHeadListType> = [
-  { id: "cityText", title: "시도", visible: true, },
-  { id: "sggText", title: "시군구", visible: true, },
-  { id: "bdstNm", title: "건축물명", visible: true, },
-  { id: "daddr", title: "주소", visible: true, },
-  { id: "bdsgUsgText", title: "건축물용도", visible: true, },
-  { id: "frstArchPrmsnDt", title: "최초건축허가일시", visible: true, },
-  { id: "archArea", title: "건축면적", visible: true, },
-  { id: "chBuildingYn", title: "증축・개축・재축여부", visible: true, },
-  { id: "lawTrgtYn", title: "법적의무대상여부", visible: true, },
-  { id: "instlCmptnDt", title: "설치완료일시", visible: true, },
+  { id: "cityText", title: "시도", visible: true, widthPercent: 4 },
+  { id: "sggText", title: "시군구", visible: true, widthPercent: 4 },
+  { id: "bdstNm", title: "건축물명", visible: true, widthPercent: 6 },
+  { id: "daddr", title: "주소", visible: true, widthPercent: 8 },
+  { id: "bdsgUsgText", title: "건축물용도", visible: true, widthPercent: 5 },
+  { id: "frstArchPrmsnDt", title: "최초건축허가일시", visible: true, widthPercent: 6 },
+  { id: "archArea", title: "건축면적", visible: true, widthPercent: 4 },
+  { id: "chBuildingYn", title: "증축・개축・재축여부", visible: true, widthPercent: 4 },
+  { id: "lawTrgtYn", title: "법적의무대상여부", visible: true, widthPercent: 4 },
+  { id: "instlCmptnDt", title: "설치완료일시", visible: true, widthPercent: 5 },
 
-  { id: "instlCst", title: "설치비용", visible: true, },
+  { id: "instlCst", title: "설치비용", visible: true, widthPercent: 6 },
 
-  { id: "pntfColKnd", title: "집수지점종류", visible: true, },
-  { id: "pntfColArea", title: "집수지점면적", visible: true, },
+  { id: "pntfColKnd", title: "집수지점종류", visible: true, widthPercent: 3 },
+  { id: "pntfColArea", title: "집수지점면적", visible: true, widthPercent: 4 },
 
-  { id: "dtfcltCpct", title: "저류조용량", visible: true, },
-  { id: "filtrTrtmfctYn", title: "여과처리시설유무", visible: true, },
-  { id: "filtrTrtmfctCpct", title: "여과처리시설용량", visible: true, },
-  { id: "filtrTrtmfctPrs", title: "여과처리시설처리공정", visible: true, },
+  { id: "dtfcltCpct", title: "저류조용량", visible: true, widthPercent: 4 },
+  { id: "filtrTrtmfctYn", title: "여과처리시설유무", visible: true, widthPercent: 4 },
+  { id: "filtrTrtmfctCpct", title: "여과처리시설용량", visible: true, widthPercent: 5 },
+  { id: "filtrTrtmfctPrs", title: "여과처리시설처리공정", visible: true, widthPercent: 6 },
 
-  { id: "instlCstSprtYn", title: "설치지원비용여부", visible: true, },
-  { id: "instlCstSprtAmt", title: "설치지원비용", visible: true, },
+  { id: "instlCstSprtYn", title: "설치지원비용여부", visible: true, widthPercent: 4 },
+  { id: "instlCstSprtAmt", title: "설치지원비용", visible: true, widthPercent: 5 },
 
-  { id: "grntchBdstCertYn", title: "녹색건축물인증여부", visible: true, },
-  { id: "grntchBdstCertYr", title: "녹색건축물인증년도", visible: true, },
-  { id: "grntchBdstCertNo", title: "녹색건축물인증번호", visible: true, },
-  { id: "grntchBdstCertGrdText", title: "녹색건축물인증등급", visible: true, },
+  { id: "grntchBdstCertYn", title: "녹색건축물인증여부", visible: true, widthPercent: 3 },
+  { id: "grntchBdstCertYr", title: "녹색건축물인증년도", visible: true, widthPercent: 3 },
+  { id: "grntchBdstCertNo", title: "녹색건축물인증번호", visible: true, widthPercent: 4 },
+  { id: "grntchBdstCertGrdText", title: "녹색건축물인증등급", visible: true, widthPercent: 4 },
 ];
 
-// id는 다확인해야함
+// 
 export const rainSttNodeListExport: CommonTableProps[] = [
   { id: "bdnstInfo", title: "건축물정보", visible: true, row: 1, rowSpan: 1, colSpan: 10, },
   { id: "rainFcltInfo", title: "빗물이용시설정보", visible: true, row: 1, rowSpan: 1, colSpan: 7, },
diff --git a/apps/wr/app/store/ruseFcltMng/fcltSttn/rswtSttn/headList.tsx b/apps/wr/app/store/ruseFcltMng/fcltSttn/rswtSttn/headList.tsx
index 5c9dbd638..1702154e7 100644
--- a/apps/wr/app/store/ruseFcltMng/fcltSttn/rswtSttn/headList.tsx
+++ b/apps/wr/app/store/ruseFcltMng/fcltSttn/rswtSttn/headList.tsx
@@ -7,36 +7,43 @@ export const rswtSttHeadListExport: z.infer<typeof sttnHeadListType> = [
     id: "cityText",
     title: "시도",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "sggText",
     title: "시군구",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "bdstNm",
     title: "건축물명",
     visible: true,
+    widthPercent: 6,
   },
   {
     id: "daddr",
     title: "주소",
     visible: true,
+    widthPercent: 8,
   },
   {
     id: "bdsgUsgText",
     title: "건축물용도",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "frstArchPrmsnDt",
     title: "최초건축허가일시",
     visible: true,
+    widthPercent: 6,
   },
   {
     id: "archArea",
     title: "건축면적",
     visible: true,
+    widthPercent: 4,
   },
   // {
   //   id: "wtrUsqty",
@@ -47,12 +54,14 @@ export const rswtSttHeadListExport: z.infer<typeof sttnHeadListType> = [
     id: "chBuildingYn",
     title: "증축・개축・재축여부",
     visible: true,
+    widthPercent: 4,
   },
 
   {
     id: "lawTrgtYn",
     title: "법적의무대상여부",
     visible: true,
+    widthPercent: 4,
   },
   // {
   //   id: "oblgTrgtWtrUsqty",
@@ -63,65 +72,77 @@ export const rswtSttHeadListExport: z.infer<typeof sttnHeadListType> = [
     id: "instlCmptnDt",
     title: "설치완료일시",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "instlCst",
     title: "설치비용",
     visible: true,
+    widthPercent: 4,
   },
 
   {
     id: "orgwtKndCd",
     title: "원수종류",
     visible: true,
+    widthPercent: 4,
   },
 
   {
     id: "filtrTrtmfctCpct",
     title: "처리시설용량",
     visible: true,
+    widthPercent: 5,
   },
   {
     id: "filtrTrtmfctProcs",
     title: "주요처리공정",
     visible: true,
+    widthPercent: 6,
   },
   {
     id: "filtrTrtmfctUsgCd",
     title: "이용용도",
     visible: true,
+    widthPercent: 4,
   },
 
   {
     id: "instlCstSprtYn",
     title: "설치지원비용여부",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "instlCstSprtAmt",
     title: "설치지원비용",
     visible: true,
+    widthPercent: 5,
   },
 
   {
     id: "grntchBdstCertYn",
     title: "녹색건축물인증여부",
     visible: true,
+    widthPercent: 3,
   },
   {
     id: "grntchBdstCertYr",
     title: "녹색건축물인증년도",
     visible: true,
+    widthPercent: 3,
   },
   {
     id: "grntchBdstCertNo",
     title: "녹색건축물인증번호",
     visible: true,
+    widthPercent: 4,
   },
   {
     id: "grntchBdstCertGrdText",
     title: "녹색건축물인증등급",
     visible: true,
+    widthPercent: 5,
   },
 ];
 
diff --git a/apps/wr/components/lib/func/TableData.tsx b/apps/wr/components/lib/func/TableData.tsx
index 54c669b86..7dfe74919 100644
--- a/apps/wr/components/lib/func/TableData.tsx
+++ b/apps/wr/components/lib/func/TableData.tsx
@@ -2,18 +2,13 @@ import { numSize } from "@/app/store/common/code/basicCode";
 import type { TableUpperProps } from "@/app/store/common/type/header";
 import type { rainChkZodType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn";
 import type { rswtChkZodType } from "@/app/store/prfmncReg/chkgdnReg/rswrtChkgdn";
-import {
-  Checkbox,
-  Input,
-  TableCell,
-  TableRow,
-} from "@common/components/ui";
+import { Checkbox, Input, TableCell, TableRow } from "@common/components/ui";
 import moment from "moment";
 import {
   codeToText,
   formatCommaNumber,
   formatYyyymmdd,
-  handleCommaNumberChange
+  handleCommaNumberChange,
 } from "./common";
 
 export const rainChkTableData = (chkData: rainChkZodType[]) => {
@@ -73,10 +68,10 @@ export const rswtChkTableData = (chkData: rswtChkZodType[]) => {
       root.rswtrDetails.forEach((detail) => {
         let flatRswtChk = {};
         const findGuide = root.guideDetails.find(
-          (guide) => guide.utztnUsgCd === detail.utztnUsgCd
-        )
+          (guide) => guide.utztnUsgCd === detail.utztnUsgCd,
+        );
         const findPoluttion = root.rswtrPollutions.find(
-          (polution) => polution.utztnUsgCd === detail.utztnUsgCd
+          (polution) => polution.utztnUsgCd === detail.utztnUsgCd,
         );
         flatRswtChk = {
           ...root,
@@ -84,7 +79,7 @@ export const rswtChkTableData = (chkData: rswtChkZodType[]) => {
           ...findGuide,
           ...findPoluttion,
           ...flatRswtChk,
-          utztnUsgCdText:   codeToText(detail.utztnUsgCd, 'dmdUszCd'),        
+          utztnUsgCdText: codeToText(detail.utztnUsgCd, "dmdUszCd"),
         };
         makeRswtData.push(flatRswtChk);
       });
@@ -94,18 +89,19 @@ export const rswtChkTableData = (chkData: rswtChkZodType[]) => {
   return makeRswtData;
 };
 
+// 재이용시설등록 > 지도점검결과 등록 - table body
 export const chRowspanTable = (
   makeTableData: any[],
   headList: TableUpperProps[],
   handleChange: (
     rowIndex: number,
     field: keyof (typeof makeTableData)[0],
-    value: string | number
+    value: string | number,
   ) => void,
   toggleSelection: (pk: number, checked: boolean) => void,
   selectedIds: number[],
   handleCellClick: (index: number, headId: string) => void,
-  disable?: boolean
+  disable?: boolean,
 ) => {
   let order = 0;
   // rowspan된 셀 렌더링 여부 추적용
@@ -138,7 +134,12 @@ export const chRowspanTable = (
                   <TableCell
                     key={key}
                     rowSpan={rowspan}
-                    className="align-middle text-center whitespace-nowrap"
+                    className="align-middle text-center whitespace-normal break-words"
+                    style={{
+                      width: head.widthPercent
+                        ? `${head.widthPercent}%`
+                        : undefined,
+                    }}
                   >
                     {key === "checkBox" ? (
                       <Checkbox
@@ -151,16 +152,16 @@ export const chRowspanTable = (
                     ) : key === "order" ? (
                       ++order
                     ) : // value
-                      ["anlOperCst", "dtfcltCpct", "prcsCpct"].includes(
-                        head.id
+                    ["anlOperCst", "dtfcltCpct", "prcsCpct"].includes(
+                        //연간운영비, 저류조용량, 처리용량
+                        head.id,
                       ) ? (
-                        formatCommaNumber(value)
-                      ) : key === "chckYmd" ? (
-                        <>{formatYyyymmdd(value)}</>
-                      ) :
-                        (
-                          <>{value}</>
-                        )}
+                      formatCommaNumber(value)
+                    ) : key === "chckYmd" ? (
+                      <>{formatYyyymmdd(value)}</>
+                    ) : (
+                      <>{value}</>
+                    )}
                   </TableCell>
                 );
               }
@@ -169,8 +170,13 @@ export const chRowspanTable = (
               return (
                 <TableCell
                   key={key}
-                  className="text-center whitespace-nowrap"
+                  className="text-center whitespace-normal break-words"
                   onClick={() => handleCellClick(rowIndex, head.id)}
+                  style={{
+                    width: head.widthPercent
+                      ? `${head.widthPercent}%`
+                      : undefined,
+                  }}
                 >
                   {head.edit === true ? (
                     [
@@ -184,7 +190,7 @@ export const chRowspanTable = (
                         type={head.type}
                         onChange={(e) => {
                           handleCommaNumberChange(e, (val) =>
-                            handleChange(rowIndex, head.id, val)
+                            handleChange(rowIndex, head.id, val),
                           );
                         }}
                         value={formatCommaNumber(value) || ""}
@@ -192,7 +198,10 @@ export const chRowspanTable = (
                         maxLength={numSize}
                         onInput={(e: React.FormEvent<HTMLInputElement>) => {
                           const el = e.currentTarget;
-                          if (head.type === "number" && el.value.length > numSize) {
+                          if (
+                            head.type === "number" &&
+                            el.value.length > numSize
+                          ) {
                             el.value = el.value.slice(0, numSize);
                           }
                         }}
@@ -225,21 +234,24 @@ export const chRowspanTable = (
                         maxLength={numSize}
                         onInput={(e: React.FormEvent<HTMLInputElement>) => {
                           const el = e.currentTarget;
-                          if (head.type === "number" && el.value.length > numSize) {
+                          if (
+                            head.type === "number" &&
+                            el.value.length > numSize
+                          ) {
                             el.value = el.value.slice(0, numSize);
                           }
                         }}
                       />
                     )
-                  ) : ["smll", "ph"].includes(head.id) && head.type === "text" ? (
+                  ) : ["smll"].includes(head.id) && head.type === "text" ? (
                     <>-</>
                   ) : [
-                    "totalSplyUswtrUtztnQnt",
-                    "totalRuseFcltUtztnQnt",
-                    "splyUswtrUtztnQnt",
-                    "ruseFcltUtztnQnt",
-                    "levyAmt",
-                  ].includes(head.id) ? (
+                      "totalSplyUswtrUtztnQnt",
+                      "totalRuseFcltUtztnQnt",
+                      "splyUswtrUtztnQnt",
+                      "ruseFcltUtztnQnt",
+                      "levyAmt",
+                    ].includes(head.id) ? (
                     <span
                       className={
                         [
@@ -278,7 +290,7 @@ export const chRowspanTable = (
 
 export const headVisibleChange = (
   headList: TableUpperProps[],
-  isEdit: boolean
+  isEdit: boolean,
 ) => {
   return headList.forEach((head) => {
     if (head.edit !== undefined) head.edit = isEdit;
@@ -292,7 +304,7 @@ const handleChange = (
   rowIndex: number,
   field: any,
   value: string,
-  setInputData: (data: any) => void
+  setInputData: (data: any) => void,
 ) => {
   if (Number(value) < 0 || !Number(value)) {
     value = "0";
@@ -306,14 +318,174 @@ const handleChange = (
         };
       }
       return row;
-    })
+    }),
   );
 };
+
+// 재이용실적등록 > 지도점검결과 등록 - 상세 modal의 body
 export const InputTableBody = (
   chgRes: any[] | [],
   headList: TableUpperProps[],
   setInputData: (data: any[]) => void,
-  isEditable: boolean = true
+  isEditable: boolean = true,
+) => {
+  // mergeCell 처리용
+  const getRowSpan = (data: any[], key: string, rowIndex: number) => {
+    if (rowIndex > 0 && data[rowIndex][key] === data[rowIndex - 1][key]) {
+      return 0; // 이전과 같으면 셀을 그리지 않음
+    }
+    let span = 1;
+    for (let i = rowIndex + 1; i < data.length; i++) {
+      if (data[i][key] === data[rowIndex][key]) span++;
+      else break;
+    }
+    return span;
+  };
+  return (
+    <>
+      {chgRes.map((data, dataIndex) => {
+        // 소계/총합계 행 판별
+        const isSubTotal = data["용수명"] === "소계";
+        const isTotal = data["구분"] === 0;
+
+        const bgClass = isTotal
+          ? "bg-[#d5e1eb] font-bold"
+          : isSubTotal
+            ? "bg-[#e6eef5] font-semibold"
+            : "";
+
+        return (
+          <TableRow key={dataIndex + "row"}>
+            {headList.map((head, headIndex) => {
+              //냄새면 계산 못하게 - 로 수정
+              // if (["smll"].includes(head.id)) {
+              //   return (
+              //     <TableCell
+              //       key={head.id + headIndex}
+              //       className={`w-36 ${bgClass} text-center !text-xl`}
+              //     >
+              //       <span>-</span>
+              //     </TableCell>
+              //   );
+              // }
+              const isTextColumn =
+                head.id === "구분" || head.id === "utztnUsgCdText";
+              const textAlignClass = isTextColumn
+                ? "text-center"
+                : "text-right";
+
+              // 총합계 행이면 "구분"에서 colSpan=2로 병합
+              if (
+                (data["구분"] === 0 || data["용수명"] === 0) &&
+                head.id === "구분"
+              ) {
+                return (
+                  <TableCell
+                    key={head.id + headIndex}
+                    colSpan={2}
+                    className="font-bold text-center bg-[#d5e1eb]"
+                  >
+                    총합계
+                  </TableCell>
+                );
+              }
+              // 총합계(합계) 행이면 "용수명" 컬럼은 렌더링하지 않음
+              if (
+                (data["구분"] === 0 || data["용수명"] === 0) &&
+                head.id === "용수명"
+              ) {
+                return null;
+              }
+
+              // 총합계 행의 나머지 셀에도 색상 적용
+              if (data["구분"] === 0 || data["용수명"] === 0) {
+                return (
+                  <TableCell
+                    key={head.id + headIndex}
+                    className="bg-[#d5e1eb] font-bold text-right"
+                  >
+                    {Number(data[head.id])
+                      ? formatCommaNumber(data[head.id as keyof any])
+                      : (data[head.id as keyof any] ?? "")}
+                  </TableCell>
+                );
+              }
+              // mergeCell 처리
+              if (head.mergeCell) {
+                const rowSpan = getRowSpan(chgRes, head.id, dataIndex);
+                if (rowSpan === 0) return null;
+                return (
+                  <TableCell
+                    key={head.id + headIndex}
+                    rowSpan={rowSpan}
+                    className={`w-36 align-middle text-center whitespace-nowrap ${bgClass}`}
+                  >
+                    {Number(data[head.id])
+                      ? formatCommaNumber(data[head.id as keyof any])
+                      : (data[head.id as keyof any] ?? "")}
+                  </TableCell>
+                );
+              }
+              // 기본 셀
+              // return head.edit === true && data.edit !== false ? (
+              return isEditable && head.edit === true && data.edit !== false ? (
+                <TableCell
+                  key={head.id + headIndex}
+                  className={`w-36 ${bgClass}`}
+                >
+                  <Input
+                    // className={`${head.id !== "utztnUsgCd" ? "text-right" : "text-center"} !text-xl h-10 w-full`}
+                    className={`${textAlignClass} !text-xl h-10 w-full`}
+                    onChange={(e) =>
+                      handleCommaNumberChange(e, (val) =>
+                        handleChange(
+                          dataIndex,
+                          head.id,
+                          String(val),
+                          setInputData,
+                        ),
+                      )
+                    }
+                    value={formatCommaNumber(data[head.id as keyof any]) ?? ""}
+                    maxLength={numSize}
+                  />
+                </TableCell>
+              ) : (
+                <TableCell
+                  key={head.id + headIndex}
+                  className={`w-36 ${bgClass}`}
+                >
+                  <div className={`${textAlignClass} !text-xl w-full h-10`}>
+                    {Number(data[head.id])
+                      ? formatCommaNumber(data[head.id as keyof any])
+                      : (data[head.id as keyof any] ?? "")}
+                  </div>
+                </TableCell>
+              );
+            })}
+          </TableRow>
+        );
+      })}
+      {chgRes.length === 0 && (
+        <TableRow>
+          <TableCell
+            colSpan={headList.length}
+            className="h-24 text-center text-gray-500"
+          >
+            조회된 결과가 없습니다.
+          </TableCell>
+        </TableRow>
+      )}
+    </>
+  );
+};
+
+// 재이용실적등록 > 하수재이용실적등록 목록 body - 하수처리수재이용 실적(m³) 등록결과
+export const pbnstTableBody = (
+  chgRes: any[] | [],
+  headList: TableUpperProps[],
+  setInputData: (data: any[]) => void,
+  isEditable: boolean = true,
 ) => {
   // mergeCell 처리용
   const getRowSpan = (data: any[], key: string, rowIndex: number) => {
@@ -427,8 +599,8 @@ export const InputTableBody = (
                           dataIndex,
                           head.id,
                           String(val),
-                          setInputData
-                        )
+                          setInputData,
+                        ),
                       )
                     }
                     value={formatCommaNumber(data[head.id as keyof any]) ?? ""}
@@ -470,4 +642,3 @@ export const InputTableBody = (
     </>
   );
 };
-
diff --git a/apps/wr/components/lib/func/common.tsx b/apps/wr/components/lib/func/common.tsx
index e8a034b62..1d9d4a43e 100644
--- a/apps/wr/components/lib/func/common.tsx
+++ b/apps/wr/components/lib/func/common.tsx
@@ -94,6 +94,22 @@ export const excelDownload = (
     if (!response.ok) {
       throw Error(response.statusText);
     }
+
+    const isTemplateOnlyDownload =
+      excelList.length === 1 &&
+      Array.isArray(excelList[0]) &&
+      excelList[0].length === 0;
+
+    if (isTemplateOnlyDownload) {
+      const blob = await response.blob();
+      const link = document.createElement("a");
+      link.href = URL.createObjectURL(blob);
+      link.download = fileNm.endsWith(".xlsx") ? fileNm : `${fileNm}.xlsx`;
+      link.click();
+      URL.revokeObjectURL(link.href);
+      return;
+    }
+
     // 받은 파일 바인너리 처리
     const blobRet = await response.arrayBuffer();
     // 버퍼에 있는 엑셀데이터 전달 후 json으로 변환
@@ -406,4 +422,4 @@ export function handleLaeSeCdChange(
     isCityCd,
     isSggCd: [{ text: "전체", val: "0" }, ...sggOrdered],
   };
-}
\ No newline at end of file
+}
diff --git a/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx b/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
index 73b4c036f..932382709 100644
--- a/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
+++ b/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
@@ -22,11 +22,11 @@ import {
   FormUi,
   UiTable,
 } from "@common/business_components/ui";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import PopoverUi from "@common/business_components/ui/popover_ui";
 import { Button, Checkbox, Input, Label } from "@common/components/ui";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { type UseFormReturn } from "react-hook-form";
-import toast from "react-hot-toast";
 /**
  *   ConCostForm 
  * 호출: (with-layout)/matMng/coMat/coMatRvw 에서 호출
@@ -57,6 +57,7 @@ export default function ConCostForm({
     code,
   } = useWrStore((state) => state);
   const alert = useAlertStore((state) => state.setMessage);
+  const { confirm } = useConfirm();
 
   const ref = useRef<boolean>(false);
 
@@ -233,43 +234,16 @@ export default function ConCostForm({
         if(pk !==null){
 
           if (checkFinish) {
-            toast((t) => (
-              <span className="flex flex-col items-center text-2xl">
-                검토완료 변경시 공사비는 변경할수 없습니다.
-                <br />
-                진행하시겠습니까?
-                <div className="flex gap-2 mt-2">
-                  <Button
-                    size="sm"
-                    onClick={async () => {
-                      toast.dismiss(t.id);
-
-                      const message = await coMatRvwUpdate(
-                        pk,
-                        form.getValues("dmdInfoId"),
-                        data
-                      );
-                      alert(message);
-                    }}
-                  >
-                    확인
-                  </Button>
-                  <Button size="sm" onClick={() => toast.dismiss(t.id)}>
-                    취소
-                  </Button>
-                </div>
-              </span>
-            ));
+            if (await confirm("검토완료 변경시 공사비는 변경할수 없습니다.\n진행하시겠습니까?")) {
+              const message = await coMatRvwUpdate( pk, form.getValues("dmdInfoId"), data );
+              alert(message);
+            }
           } else {
-            const message = await coMatRvwUpdate(
-              pk,
-              form.getValues("dmdInfoId"),
-              data
-            );
+            const message = await coMatRvwUpdate( pk, form.getValues("dmdInfoId"), data );
             alert(message);
           }
         }else{
-          alert('후보지를 먼저 선택해주세요')
+          alert('후보지를 먼저 선택해주세요');
         }
       }
     } else if (type === "hist") {
@@ -277,7 +251,8 @@ export default function ConCostForm({
       delete value.ruseUtztnFcltNm;
       console.log("onSubmit data ", pk);
 
-      ruseRvwCalUpdate(value);
+      const message = await ruseRvwCalUpdate(value);
+      alert(message);
     }
   };
 
diff --git a/apps/wr/components/ui/form/fcltReg/htdflReg/htdflRegForm.tsx b/apps/wr/components/ui/form/fcltReg/htdflReg/htdflRegForm.tsx
index 55e01174c..0a147ac4b 100644
--- a/apps/wr/components/ui/form/fcltReg/htdflReg/htdflRegForm.tsx
+++ b/apps/wr/components/ui/form/fcltReg/htdflReg/htdflRegForm.tsx
@@ -9,11 +9,12 @@ import {
 import { selectClass } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
 import { formH1Class } from "@/components/lib/class/comClass";
 import {
-  confirmToast,
   formatCommaNumber,
   handleCommaNumberChange,
   handleOnlyNumberChange,
 } from "@/components/lib/func/common";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import { useAlertStore } from "@/src/shared/lib";
 import {
   Form,
   FormField,
@@ -24,7 +25,6 @@ import { Button, Input, Label, ScrollArea } from "@common/components/ui";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useCallback, useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
-import toast from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 import { z } from "zod";
 import BdstReg from "../bdstReg/bdstReg";
@@ -54,6 +54,8 @@ export default function HtdflRegForm({
     defaultValues: defaultValues,
   });
   const { laeSeCd } = auth;
+  const { confirm } = useConfirm();
+  const alert = useAlertStore((state) => state.setMessage);
 
   const [regCtpvCd, regSggcd] = form.watch(["ctpvCd", "sggCd"]);
 
@@ -65,33 +67,42 @@ export default function HtdflRegForm({
     const myUUID = await getMyUUID();
 
     if (!myUUID) {
-      toast.error(t('noUserInfoMsg'));
+      alert(t('noUserInfoMsg'));
       return;
     } 
     if (isModal) {
       const data = regCtpvCd ? regCtpvCd : regSggcd ? regSggcd : "noCd";
       if (data === "noCd") {
-        toast.error("시도/시군구 코드를 선택해야합니다.");
+        alert("시도/시군구 코드를 선택해야합니다.");
         return;
       }
       const handleConfirm = async () => {
-        htdflBdstReg(values, data,myUUID);
+        const message = await htdflBdstReg(values, data,myUUID);
+        alert(message);
         if (setIsModal) setIsModal(false);
       };
-      confirmToast(t("isInsertMsg"), handleConfirm);
+      if (await confirm(t("isInsertMsg"))) {
+        await handleConfirm();
+      }
     } else {
       const handleConfirm = async () => {
-        await htdflBdstUpdate(values, laeSeCd,myUUID);
+        const message = await htdflBdstUpdate(values, laeSeCd,myUUID);
+        alert(message);
         console.log(' htdflBdstUpdate ')
         resetHtdflTableIndex(0);
       };
-      confirmToast(t("isUpdateMsg"), handleConfirm);
+      if (await confirm(t("isUpdateMsg"))) {
+        await handleConfirm();
+      }
     }
   };
 
   const onDelete = async () => {
     const code = htdflForm.ctpvCd ? htdflForm.ctpvCd : htdflForm.sggCd ? htdflForm.sggCd : "noCd";
-    confirmToast(`정말 ${htdflForm.bdstNm} 시설을 삭제하시겠습니까?`, () => htdflBdstDelete(htdflForm, code));
+    if (await confirm(`정말 ${htdflForm.bdstNm} 시설을 삭제하시겠습니까?`)) {
+      const message = await htdflBdstDelete(htdflForm, code);
+      alert(message);
+    }
   }
 
   const cleanHtdflData = (raw: any): z.infer<typeof hdtflZod> => {
diff --git a/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm.tsx b/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm.tsx
index d2281cdd6..57f737a9d 100644
--- a/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm.tsx
+++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm.tsx
@@ -28,7 +28,6 @@ import { useCallback, useEffect, useRef, useState } from "react";
 import { useFieldArray, type UseFormReturn } from "react-hook-form";
 import MngRegFormDetail from "../mngReg/mngRegFormDetail/mngRegFormDetail";
 import {
-  //confirmToast,
   formatCommaNumber,
   handleCommaNumberChange,
   safeDate,
@@ -39,7 +38,6 @@ import type { DemandCompType } from "@common/business_components/ui/sdmInsertFor
 import RuseMngTableForm from "@/components/ui/table/pbnstReg/ruseMngTableForm/ruseMngTableForm";
 import type { SelectDataType } from "@common/business_components";
 import { BuseWaterQulity } from "./buseWaterQulity/buseWaterQulity";
-// import toast from "react-hot-toast";
 import { useTranslation } from "react-i18next";
 import { useAlertStore } from "@/src/shared/lib";
 //import { useTranslation } from "react-i18next";
diff --git a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx
index eef115a5c..85364f0d1 100644
--- a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx
+++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx
@@ -44,7 +44,7 @@ const diagramFileTypes = ".pdf,.jpg,.jpeg,.png,.bmp";
  * - with-layout 적용
  * - 하수처리시설에 하수재이용 시설 시설 정보를 등록한다.
  * - form으로 시설정보 및 차수별 정보의 컴포넌트 데이터를 관리한다
- * indexMng: 시설정보
+ * indexMng: 재이용시설정보
  * indexBiz: 차수별 정보
  * 로 하수재이용 시설에 등록된 시설 및 차수별 정보를 관리한다.
  *  */
@@ -61,7 +61,7 @@ export function PbnstMngForm({
   setIndexMng: (index: number) => void;
   readonly: boolean;
 }) {
-  const { code, pbnst, fileDelete, fileDownLoad } = useWrStore(
+  const { code, pbnst, fileDelete, fileDownLoadName } = useWrStore(
     (state) => state
   );
   const [planFiles, setPlanFiles] = useState<FilesType[] | null>(null);
@@ -150,10 +150,10 @@ export function PbnstMngForm({
       } else {
         fileList?.forEach((item, index) => {
           const idx = files?.indexOf(item.file);
-          if (idx < 0) {
-            setReFiles.splice(index);
-            fileDelete(item.atflCd as string);
-          }
+            if (idx < 0) {
+              setReFiles.splice(index, 1);
+              fileDelete(item.atflCd as string);
+            }
         });
       }
       // eslint-disable-next-line @typescript-eslint/no-unused-expressions
@@ -183,7 +183,7 @@ export function PbnstMngForm({
   useEffect(() => {
     setRelationFiles([]);
     setPlanFiles([]);
-    console.log("indexMng ", indexMng);
+    // console.log("indexMng ", indexMng);
 
     const currentItem = form.getValues(`items.${indexMng}`);
     const defaultFiles = currentItem?.fcFiles || [];
@@ -443,7 +443,7 @@ export function PbnstMngForm({
                           <span
                             key={index + "plan"}
                             className="text-2xl block cursor-pointer text-blue-600 hover:underline"
-                            onClick={() => fileDownLoad(item.atflCd)}
+                            onClick={() => fileDownLoadName(item.atflCd, item.file.name)}
                           >
                             {item.file.name}
                           </span>
@@ -462,11 +462,12 @@ export function PbnstMngForm({
                         }}
                         fileTypes={diagramFileTypes}
                         onFileClick={(index) => {
-                          fileDownLoad(
-                            relationfiles?.find(
-                              (item, fileIndex) => fileIndex === index
-                            )?.atflCd as string
+                          const target = relationfiles?.find(
+                            (item, fileIndex) => fileIndex === index
                           );
+                          if (target?.atflCd) {
+                            fileDownLoadName(target.atflCd, target.file.name);
+                          }
                         }}
                       ></FileUpload>
                     </FormUi>
@@ -481,7 +482,7 @@ export function PbnstMngForm({
                           <span
                             key={index + "plan"}
                             className="text-2xl block cursor-pointer text-blue-600 hover:underline"
-                            onClick={() => fileDownLoad(item.atflCd)}
+                            onClick={() => fileDownLoadName(item.atflCd, item.file.name)}
                           >
                             {item.file.name}
                           </span>
@@ -500,11 +501,12 @@ export function PbnstMngForm({
                         }}
                         fileTypes={diagramFileTypes}
                         onFileClick={(index) => {
-                          fileDownLoad(
-                            planFiles?.find(
-                              (item, fileIndex) => fileIndex === index
-                            )?.atflCd as string
+                          const target = planFiles?.find(
+                            (item, fileIndex) => fileIndex === index
                           );
+                          if (target?.atflCd) {
+                            fileDownLoadName(target.atflCd, target.file.name);
+                          }
                         }}
                       ></FileUpload>
                     </FormUi>
diff --git a/apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx b/apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx
index ab941f3b0..27033d0e2 100644
--- a/apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx
+++ b/apps/wr/components/ui/form/fcltReg/rainReg/rainRegForm.tsx
@@ -8,10 +8,11 @@ import {
 } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
 import { formH1Class, formH2Class } from "@/components/lib/class/comClass";
 import {
-  confirmToast,
   formatCommaNumber,
   handleMinusNumberChange,
 } from "@/components/lib/func/common";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import { useAlertStore } from "@/src/shared/lib";
 import { DatePicker, FormUi } from "@common/business_components";
 import { Form, FormField, SelectBox } from "@common/business_components/ui";
 import { Button,  Input } from "@common/components/ui";
@@ -20,7 +21,6 @@ import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
 import BdstReg from "../bdstReg/bdstReg";
-import toast from "react-hot-toast";
 import BdstAdd from "../bdstReg/bdstAdd";
 import { useTranslation } from "react-i18next";
 import { numSize, txtSize } from "@/app/store/common/code/basicCode";
@@ -48,6 +48,8 @@ export default function RainRegForm({
     // defaultValues: defaultValues,
   });
   const { t } = useTranslation('base');
+  const { confirm } = useConfirm();
+  const alert = useAlertStore((state) => state.setMessage);
 
   const [grntchBdstCertYn, instlCstSprtYn, filtrTrtmfctYn] = form.watch([
     "reuseBuilding.0.grntchBdstCertYn",
@@ -134,7 +136,7 @@ export default function RainRegForm({
     const myUUID = await getMyUUID();
 
     if (!myUUID) {
-      toast.error(t('noUserInfoMsg'));
+      alert(t('noUserInfoMsg'));
       return;
     } 
 
@@ -142,26 +144,35 @@ export default function RainRegForm({
       const data = regCtpvCd ? regCtpvCd : regSggcd ? regSggcd : "noCd";
   
       if (data === "noCd") {
-        toast.error("시도/시군구 코드를 선택해야합니다.");
+        alert("시도/시군구 코드를 선택해야합니다.");
         return;
       }
       const handleConfirm = async () => {
-        rainBdstReg(values, data,myUUID);
+        const message = await rainBdstReg(values, data,myUUID);
+        alert(message);
         if (setIsModal) setIsModal(false);
       };
-      confirmToast(t('isInsertMsg'), handleConfirm);
+      if (await confirm(t("isInsertMsg"))) {
+        await handleConfirm();
+      }
     } else {
       const handleConfirm = async () => {
-       await  rainBdstUpdate(values, laeSeCd,myUUID);
+       const message = await rainBdstUpdate(values, laeSeCd,myUUID);
+       alert(message);
        resetRainTableIndex(0)
       };
-      confirmToast(t('isUpdateMsg'), handleConfirm);
+      if (await confirm(t("isUpdateMsg"))) {
+        await handleConfirm();
+      }
     }
   };
 
   const onDelete = async () => {
     const code = rainForm.ctpvCd ? rainForm.ctpvCd : rainForm.sggCd ? rainForm.sggCd : "noCd";
-    confirmToast(`정말 ${rainForm.bdstNm} 시설을 삭제하시겠습니까?`, () => rainBdstDelete(rainForm, code));
+    if (await confirm(`정말 ${rainForm.bdstNm} 시설을 삭제하시겠습니까?`)) {
+      const message = await rainBdstDelete(rainForm, code);
+      alert(message);
+    }
   }
 
   useEffect(() => {
diff --git a/apps/wr/components/ui/form/fcltReg/rswtrReg/rswtrRegForm.tsx b/apps/wr/components/ui/form/fcltReg/rswtrReg/rswtrRegForm.tsx
index 6363474d4..61014d796 100644
--- a/apps/wr/components/ui/form/fcltReg/rswtrReg/rswtrRegForm.tsx
+++ b/apps/wr/components/ui/form/fcltReg/rswtrReg/rswtrRegForm.tsx
@@ -8,10 +8,10 @@ import {
 } from "@/app/store/ruseFcltMng/fcltReg/rswtReg";
 import { formH1Class, formH2Class } from "@/components/lib/class/comClass";
 import {
-  confirmToast,
   formatCommaNumber,
   handleMinusNumberChange,
 } from "@/components/lib/func/common";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import {
   DatePicker,
   Form,
@@ -28,7 +28,7 @@ import BdstAdd from "../bdstReg/bdstAdd";
 import BdstReg from "../bdstReg/bdstReg";
 import { useTranslation } from "react-i18next";
 import { numSize, txtSize } from "@/app/store/common/code/basicCode";
-import toast from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 
 export default function RswtrRegForm({
   rswtForm,
@@ -52,6 +52,8 @@ export default function RswtrRegForm({
   }, [isMap]);
   // const defaultValues: z.infer<typeof rswtZod> = rswtZod.parse({});
   const { t } = useTranslation("base");
+  const { confirm } = useConfirm();
+  const alert = useAlertStore((state) => state.setMessage);
 
   const form = useForm<z.infer<typeof rswtZod>>({
     resolver: zodResolver(rswtZod),
@@ -72,32 +74,41 @@ export default function RswtrRegForm({
       const myUUID = await getMyUUID();
   
       if (!myUUID) {
-        toast.error(t('noUserInfoMsg'));
+        alert(t('noUserInfoMsg'));
         return;
       } 
     if (isModal) {
       const data = regCtpvCd ? regCtpvCd : regSggcd ? regSggcd : "noCd";
       if (data === "noCd") {
-        toast.error("시도/시군구 코드를 선택해야합니다.");
+        alert("시도/시군구 코드를 선택해야합니다.");
         return;
       }
       const handleConfirm = async () => {
-        rswtBdstReg(values, data,myUUID);
+        const message = await rswtBdstReg(values, data,myUUID);
+        alert(message);
         if (setIsModal) setIsModal(false);
       };
-      confirmToast(t("isInsertMsg"), handleConfirm);
+      if (await confirm(t("isInsertMsg"))) {
+        await handleConfirm();
+      }
     } else {
       const handleConfirm = async () => {
-        rswtBdstUpdate(values, laeSeCd,myUUID);
+        const message = await rswtBdstUpdate(values, laeSeCd,myUUID);
+        alert(message);
         resetRswtTableIndex(0)
       };
-      confirmToast(t("isUpdateMsg"), handleConfirm);
+      if (await confirm(t("isUpdateMsg"))) {
+        await handleConfirm();
+      }
     }
   };
 
   const onDelete = async () => {
     const code = rswtForm.ctpvCd ? rswtForm.ctpvCd : rswtForm.sggCd ? rswtForm.sggCd : "noCd";
-    confirmToast(`정말 ${rswtForm.bdstNm} 시설을 삭제하시겠습니까?`, () => rswtBdstDelete(rswtForm, code));
+    if (await confirm(`정말 ${rswtForm.bdstNm} 시설을 삭제하시겠습니까?`)) {
+      const message = await rswtBdstDelete(rswtForm, code);
+      alert(message);
+    }
   }
 
   const cleanRswtData = (raw: any): z.infer<typeof rswtZod> => {
diff --git a/apps/wr/components/ui/map/LayerPopUp/HasuFacilty/HasuFacility.tsx b/apps/wr/components/ui/map/LayerPopUp/HasuFacilty/HasuFacility.tsx
index 067723ccf..beaf26b81 100644
--- a/apps/wr/components/ui/map/LayerPopUp/HasuFacilty/HasuFacility.tsx
+++ b/apps/wr/components/ui/map/LayerPopUp/HasuFacilty/HasuFacility.tsx
@@ -1,3 +1,6 @@
+/**
+ * map 시설물 layer > 하수처리시설 modal
+ */
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
 import { pbnMapTableSize } from "@/app/store/map/pbnstMap";
diff --git a/apps/wr/components/ui/map/LayerPopUp/HedfFacilty/HtdfFacilty.tsx b/apps/wr/components/ui/map/LayerPopUp/HedfFacilty/HtdfFacilty.tsx
index f10574148..86da242d7 100644
--- a/apps/wr/components/ui/map/LayerPopUp/HedfFacilty/HtdfFacilty.tsx
+++ b/apps/wr/components/ui/map/LayerPopUp/HedfFacilty/HtdfFacilty.tsx
@@ -1,3 +1,6 @@
+/**
+ * map 시설물 layer > 온배수시설 modal
+ */
 import { useWrStore } from "@/app/store";
 import { htdfMapSize } from "@/app/store/map/htdflMap";
 import { rainMapSize } from "@/app/store/map/rainMap";
diff --git a/apps/wr/components/ui/map/LayerPopUp/RainFacility/RainFacility.tsx b/apps/wr/components/ui/map/LayerPopUp/RainFacility/RainFacility.tsx
index a980712e9..74bf0aa55 100644
--- a/apps/wr/components/ui/map/LayerPopUp/RainFacility/RainFacility.tsx
+++ b/apps/wr/components/ui/map/LayerPopUp/RainFacility/RainFacility.tsx
@@ -1,3 +1,6 @@
+/**
+ * map 시설물 layer > 빗물이용시설 modal
+ */
 import { useWrStore } from "@/app/store";
 import { rainMapSize } from "@/app/store/map/rainMap";
 import type { customRainBdst } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
diff --git a/apps/wr/components/ui/map/LayerPopUp/RswtFacilty/RswtFacilty.tsx b/apps/wr/components/ui/map/LayerPopUp/RswtFacilty/RswtFacilty.tsx
index 6cad8f105..4fe818568 100644
--- a/apps/wr/components/ui/map/LayerPopUp/RswtFacilty/RswtFacilty.tsx
+++ b/apps/wr/components/ui/map/LayerPopUp/RswtFacilty/RswtFacilty.tsx
@@ -1,3 +1,6 @@
+/**
+ * map 시설물 layer > 중수도시설 modal
+ */
 import { useWrStore } from "@/app/store";
 import { rainMapSize } from "@/app/store/map/rainMap";
 import type { customRswtBdst } from "@/app/store/ruseFcltMng/fcltReg/rswtReg";
diff --git a/apps/wr/components/ui/map/LayerPopUp/RuseFacilty/RuseFacility.tsx b/apps/wr/components/ui/map/LayerPopUp/RuseFacilty/RuseFacility.tsx
index 59a8fcc57..8ed06293b 100644
--- a/apps/wr/components/ui/map/LayerPopUp/RuseFacilty/RuseFacility.tsx
+++ b/apps/wr/components/ui/map/LayerPopUp/RuseFacilty/RuseFacility.tsx
@@ -1,3 +1,6 @@
+/**
+ * map 시설물 layer > 하수재이용시설 modal
+ */
 import { useWrStore } from "@/app/store";
 import { btnClass } from "@/app/store/common/code";
 import { ruseMapSize } from "@/app/store/map/ruseMap";
diff --git a/apps/wr/components/ui/modal/chkgd/chkgdExcel/chkgdExcel.tsx b/apps/wr/components/ui/modal/chkgd/chkgdExcel/chkgdExcel.tsx
index ea0060a28..595cff55e 100644
--- a/apps/wr/components/ui/modal/chkgd/chkgdExcel/chkgdExcel.tsx
+++ b/apps/wr/components/ui/modal/chkgd/chkgdExcel/chkgdExcel.tsx
@@ -1,3 +1,6 @@
+/**
+ * 지도점검 결과등록 엑셀 업로드 모달
+ */
 import { useWrStore } from "@/app/store";
 import { type rainChkZodType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn";
 import { excelToRainChkData } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn/excel";
@@ -8,7 +11,7 @@ import {
   excelToRswtPolution,
   rswtExcelDataCheck,
 } from "@/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/excel";
-import { showConfirmToast } from "@/components/lib/func/common";
+import { useAlertStore } from "@/src/shared/lib";
 import {
   filePicked,
   filePickedArray,
@@ -23,7 +26,6 @@ import { Button, Input } from "@common/components/ui";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useEffect, useRef, useState } from "react";
 import { useForm } from "react-hook-form";
-import toast from "react-hot-toast";
 import type { z } from "zod";
 
 export default function ChkgdExcel({
@@ -46,6 +48,7 @@ export default function ChkgdExcel({
   } = useWrStore((state) => {
     return state;
   });
+  const alert = useAlertStore((state) => state.setMessage);
   const [excelData, setExcelData] = useState<
     rswtChkZodType[] | rainChkZodType[]
   >();
@@ -60,6 +63,8 @@ export default function ChkgdExcel({
   };
   const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const selectedFile = e.target.files?.[0];
+    setExcelData(undefined);
+    setExcelRswtData(undefined);
     if (selectedFile) {
       setFile(selectedFile);
     }
@@ -89,7 +94,7 @@ export default function ChkgdExcel({
   useEffect(() => {
     if (file) {
       if (form.getValues("chckYr").length < 1) {
-        toast.error("파일업로드 이전에 등록년도를 작성해주세요 ");
+        alert("파일업로드 이전에 등록년도를 작성해주세요 ");
         setFile(null);
         return;
       }
@@ -102,11 +107,17 @@ export default function ChkgdExcel({
                 res,
                 form.getValues("chckYr")
               );
+              if (excelData.message) {
+                alert(excelData.message);
+                setExcelData(undefined);
+              }
               if (excelData.issues && excelData.issues.length > 0) {
                 excelData.issues.some((err, index) => {
-                  showConfirmToast(err);
+                  // showConfirmToast(err);
+                  alert(err);
                   return index === 4; // true 반환 시 반복 종료
                 });
+                setExcelData(undefined);
                 clearFile();
               } else {
                 setExcelData(excelData.rainChkgdData);
@@ -119,6 +130,7 @@ export default function ChkgdExcel({
           setRswtChkLoading(true);
           filePickedArray(file, 0)
             .then((res) => {
+              setExcelRswtData(undefined);
               if (res && res?.length > 1) {
                 const guideData = excelToRswtGuideData(
                   res[0],
@@ -163,16 +175,24 @@ export default function ChkgdExcel({
 
                 if (issues && issues.length > 0) {
                   issues.some((err, index) => {
-                    showConfirmToast(err);
-                    return index === 6; // true 반환 시 반복 종료
+                    // showConfirmToast(err);
+                    alert(err);
+                    return index === 4; // true 반환 시 반복 종료
                   });
+                  console.log(issues.join("\n"));
+                  setExcelRswtData(undefined);
                   clearFile();
                 } else {
                   setExcelRswtData(listTotalData);
                 }
+              } else {
+                alert("중수도 엑셀은 2개 시트가 필요합니다. 양식을 확인해주세요.");
+                setExcelRswtData(undefined);
+                clearFile();
               }
             })
             .finally(() => setRswtChkLoading(false));
+          console.log("업로드파일 점검 완료");
         }
     }
   }, [file]);
@@ -190,33 +210,35 @@ export default function ChkgdExcel({
   //   );
   // }
 
-  const onSubmit = (values: z.infer<typeof chkgdRegExcel>) => {
+  const onSubmit = async (values: z.infer<typeof chkgdRegExcel>) => {
     if (values.chckYr === "") {
-      toast.error("등록년도를 작성해주세요");
+      alert("등록년도를 작성해주세요");
       return;
     }
 
     if (type === "RNB") {
       if (excelData === undefined || excelData?.length === 0) {
-        toast.error("빈 파일 및 파일 오류 입니다.");
+        alert("빈 파일 및 파일 오류 입니다.");
 
         return;
       } else {
-        rainChkExcelDataUPload(
+        const message = await rainChkExcelDataUPload(
           excelData as rainChkZodType[],
           form.getValues("chckYr"),
           laeSeCd
         );
+        alert(message);
         setIsRegExcel(false);
         setYearChange(form.getValues("chckYr"));
       }
     } else if (type === "RST") {
       if (excelRswtData === undefined || excelRswtData?.length === 0) {
-        toast.error("빈 파일 및 파일 오류 입니다.");
+        alert("빈 파일 및 파일 오류 입니다.");
 
         return;
       } else {
-        rswtChkExceDataUpload(excelRswtData as rswtChkZodType[], laeSeCd);
+        const message = await rswtChkExceDataUpload(excelRswtData as rswtChkZodType[], laeSeCd);
+        alert(message);
         setIsRegExcel(false);
         setYearChange(form.getValues("chckYr"));
       }
diff --git a/apps/wr/components/ui/modal/chkgd/chkgdModal/chkgdModal.tsx b/apps/wr/components/ui/modal/chkgd/chkgdModal/chkgdModal.tsx
index 4545100ab..c5ba35e17 100644
--- a/apps/wr/components/ui/modal/chkgd/chkgdModal/chkgdModal.tsx
+++ b/apps/wr/components/ui/modal/chkgd/chkgdModal/chkgdModal.tsx
@@ -1,19 +1,23 @@
+/**
+ * 지도점검 상세조회/상세수정용 모달
+ */
 import { useWrStore } from "@/app/store";
 import type { TableUpperProps } from "@/app/store/common/type/header";
 import type { splRuseWaterType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList";
 import type { rswtrPolutionsZode } from "@/app/store/prfmncReg/chkgdnReg/rswrtChkgdn/headList";
 import { codeToText } from "@/components/lib/func/common";
 import { GuideDetailsTable } from "@/components/ui/table/chkgdTable/guideDetailTable/guideDetailTable";
+import { useAlertStore } from "@/src/shared/lib";
 import { ScrollArea, Title } from "@common/business_components/ui";
 import { Button } from "@common/components/ui";
 import React, {  useEffect, useState } from "react";
 import type { z } from "zod";
 
 export default function ChkgdModal({
-  type,
-  obj,
-  setIsModal,
-  readonly,
+  type, // 시설 구분값. "RNB"이면 빗물, 그 외는 중수도 상세 모달로 처리
+  obj, // 목록에서 선택한 1건의 상세 데이터. 가이드/수질/과태료 정보 렌더링과 저장에 사용
+  setIsModal, // 모달 열림 상태를 제어하는 함수. 저장 완료 시 false로 닫는다
+  readonly, // 편집 가능 여부. true면 입력 가능, false면 조회 전용으로 렌더링
 }: {
   type: string;
   obj: any;
@@ -28,6 +32,7 @@ export default function ChkgdModal({
     rainChkGuidUpdate,
     rwstPolAndGuideUpdate,
   } = useWrStore((state) => state);
+  const alert = useAlertStore((state) => state.setMessage);
   const [guidData, setGuidData] = useState<splRuseWaterType[]>();
   const [headList, setHeadList] = useState<{
     splHeadList: TableUpperProps[];
@@ -55,7 +60,7 @@ export default function ChkgdModal({
     combResdch: 0,
     trbt: 0,
     bod: 0,
-    smll: 0,
+    smll: '-',
     crmty: 0,
     tph: 0,
     tn: 0,
@@ -67,7 +72,7 @@ export default function ChkgdModal({
   useEffect(() => {
     if (rainChkSttn.isSttn) {
       setHeadList({
-        splHeadList: rainChkSttn.splHeadList,
+        splHeadList: rainChkSttn.splHeadList, // 연간 대체수이용량 헤더 정의
         ruseHeadList: rainChkSttn.ruseHeadList,
         rswtDetailHeadList:
           type === "RNB" ? [] : rswtChkSttn.rswtDetailSttnHeadList,
@@ -80,9 +85,12 @@ export default function ChkgdModal({
       });
     }
   }, [
+    type,
     rainChkSttn.isSttn,
     rainChkgdn.splHeadList,
+    rainChkgdn.ruseHeadList,
     rainChkSttn.splHeadList,
+    rainChkSttn.ruseHeadList,
     rswtChkgdn.rswtDetailHeadList,
     rswtChkSttn.rswtDetailSttnHeadList,
   ]);
@@ -154,12 +162,13 @@ export default function ChkgdModal({
         if (onlyData.length === 0) return;
         const total = initStats();
 
+        // 분기별 원본 수질 데이터를 모두 더해 평균 계산의 분모/분자를 만든다.
         onlyData.forEach((item) => {
           total.grssClfgUswtr += item.grssClfgUswtr;
           total.combResdch += item.combResdch;
           total.trbt += item.trbt;
           total.bod += item.bod;
-          total.smll += item.smll;
+          // 냄새(smll)는 수치 평균 대상이 아니라 누적하지 않는다.
           total.crmty += item.crmty;
           total.tph += item.tph;
           total.tn += item.tn;
@@ -167,6 +176,7 @@ export default function ChkgdModal({
           total.clIonQnt += item.clIonQnt;
         });
 
+        // 누적 합계를 항목 개수로 나눠 화면에 표시할 평균 행을 만든다.
         const average = {
           utztnUsgCdText: "평균",
           edit: false,
@@ -174,7 +184,7 @@ export default function ChkgdModal({
           combResdch: (total.combResdch / onlyData.length).toFixed(1),
           trbt: (total.trbt / onlyData.length).toFixed(1),
           bod: (total.bod / onlyData.length).toFixed(1),
-          smll: (total.smll / onlyData.length).toFixed(1),
+          smll: '-',
           crmty: (total.crmty / onlyData.length).toFixed(1),
           tph: (total.tph / onlyData.length).toFixed(1),
           tn: (total.tn / onlyData.length).toFixed(1),
@@ -206,7 +216,7 @@ export default function ChkgdModal({
     }
   };
 
-  const allDataUpdate = () => {
+  const allDataUpdate = async () => {
     const realGuideDetail = obj.guideDetails;
 
     if (updateData === undefined || updateData.length === 0) return;
@@ -233,14 +243,16 @@ export default function ChkgdModal({
     });
     obj.guideDetails = realGuideDetail;
     if (type === "RNB") {
-      rainChkGuidUpdate(obj);
+      const message = await rainChkGuidUpdate(obj);
+      alert(message);
       setIsModal(false);
     } else {
       const polution = Object.values(upPolutionData)
         .flat()
         .filter((item) => item.utztnUsgCd !== "평균");
       obj.rswtrPollutions = polution;
-      rwstPolAndGuideUpdate([obj]);
+      const message = await rwstPolAndGuideUpdate([obj]);
+      alert(message);
       setIsModal(false);
     }
   };
diff --git a/apps/wr/components/ui/modal/chkgd/pbnPrfExcelModal/pbnPrfExcelModal.tsx b/apps/wr/components/ui/modal/chkgd/pbnPrfExcelModal/pbnPrfExcelModal.tsx
index 3881e5813..0857340e3 100644
--- a/apps/wr/components/ui/modal/chkgd/pbnPrfExcelModal/pbnPrfExcelModal.tsx
+++ b/apps/wr/components/ui/modal/chkgd/pbnPrfExcelModal/pbnPrfExcelModal.tsx
@@ -1,3 +1,6 @@
+/**
+ * 재이용실적등록> 하수재이용 실적등록 파일등록 modal
+ */
 import { excelToPbnPrfData } from "@/app/store/prfmncReg/pbnstPrfmncReg/excel";
 import { pbnPrfRegExcelZod } from "@/app/store/prfmncReg/pbnstPrfmncReg/headList";
 import type {
@@ -17,8 +20,9 @@ import { Button, Input } from "@common/components/ui";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
-import toast from "react-hot-toast";
+// import toast from "react-hot-toast";
 import type { z } from "zod";
+import { useAlertStore } from "@/src/shared/lib";
 
 export default function PbnPrfExcelModal({
   data,
@@ -29,6 +33,7 @@ export default function PbnPrfExcelModal({
   setIsExcelOPen: (open: boolean) => void;
   setModalExcelData: (excelData: PrfType) => void;
 }) {
+  const alert = useAlertStore((state) => state.setMessage);
   const [file, setFile] = useState<File | null>(null);
   const [excelData, setExcelData] = useState<PrfType[]>();
   const form = useForm<z.infer<typeof pbnPrfRegExcelZod>>({
@@ -65,7 +70,8 @@ export default function PbnPrfExcelModal({
     if (file) {
       const isFile = file;
       if (form.getValues("ym").length < 1) {
-        toast.error("파일업로드 이전에 등록년도를 작성해주세요 ");
+        // toast.error("파일업로드 이전에 등록년도를 작성해주세요 ");
+        alert("파일업로드 이전에 등록년도를 작성해주세요 ");
         setFile(null);
         return;
       }
diff --git a/apps/wr/components/ui/modal/coMat/ruseCaseMng/ruseCaseMngExcelModal.tsx b/apps/wr/components/ui/modal/coMat/ruseCaseMng/ruseCaseMngExcelModal.tsx
index bbcc9497b..8f0445cd6 100644
--- a/apps/wr/components/ui/modal/coMat/ruseCaseMng/ruseCaseMngExcelModal.tsx
+++ b/apps/wr/components/ui/modal/coMat/ruseCaseMng/ruseCaseMngExcelModal.tsx
@@ -12,13 +12,14 @@ import { useForm } from "react-hook-form";
 import type { z } from "zod";
 
 export default function RuseCaseMngExcel({setIsExcelOpen}:{setIsExcelOpen: (isOpen:boolean)=>void}) {
-  const { insertRuseCaseMng } = useWrStore((state) => state);
+  const { insertRuseCaseMng, code } = useWrStore((state) => state);
   const alert = useAlertStore((state) => state.setMessage);
   const form = useForm<z.infer<typeof coRegExcel>>({
     resolver: zodResolver(coRegExcel),
   });
 
   const [file, setFiles] = useState<File | undefined>();
+  const sewageOutUseCodeList = code.sewageOutFclttUse ?? [];
 
   const onSubmit = () => {
     if (file) {
@@ -125,7 +126,25 @@ export default function RuseCaseMngExcel({setIsExcelOpen}:{setIsExcelOpen: (isOp
 
 
             if(parsingExcel.ok&&parsingExcel.value){
-              newArray.push(parsingExcel.value);
+              const parsedValue = { ...parsingExcel.value };
+              const usageText = parsedValue.grnteWqUsg?.toString().trim();
+
+              if (usageText) {
+                const usageCode = sewageOutUseCodeList.find(
+                  (codeItem) => codeItem.text.trim() === usageText
+                )?.val;
+
+                if (!usageCode) {
+                  isError.push([
+                    `${parsedValue.ruseBizNm || "행"} => [보증수질_용도별] '${usageText}' 에 해당하는 WR018 코드가 없습니다.`,
+                  ]);
+                  return;
+                }
+
+                parsedValue.grnteWqUsg = usageCode;
+              }
+
+              newArray.push(parsedValue);
             }else if(parsingExcel.errors){
               isError.push(parsingExcel.errors);
             }
diff --git a/apps/wr/components/ui/modal/coReg/coRegExcel/coRegExcelModal.tsx b/apps/wr/components/ui/modal/coReg/coRegExcel/coRegExcelModal.tsx
index bfc958598..c1bfda0ff 100644
--- a/apps/wr/components/ui/modal/coReg/coRegExcel/coRegExcelModal.tsx
+++ b/apps/wr/components/ui/modal/coReg/coRegExcel/coRegExcelModal.tsx
@@ -8,9 +8,10 @@ import { Button, Input } from "@common/components/ui";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useState } from "react";
 import { useForm } from "react-hook-form";
-import toast from "react-hot-toast";
+// import toast from "react-hot-toast";
 import type { z } from "zod";
 import { useConfirm } from "@frontend-opensource/use-react-hooks";
+import { useAlertStore } from "@/src/shared/lib";
 
 export default function CoRegExcel({
   isModal,
@@ -18,6 +19,7 @@ export default function CoRegExcel({
   isModal: (open: boolean) => void;
 }) {
   const { confirm } = useConfirm();
+  const alert = useAlertStore((state) => state.setMessage);
   const { ldrmnt, loadingOpen } = useWrStore((state) => state);
   const { isLoading } = ldrmnt;
   const form = useForm<z.infer<typeof coRegExcel>>({
@@ -76,11 +78,12 @@ export default function CoRegExcel({
             await ldrmntRegData(array);
             isModal(false);
             loadingOpen(false);
-            toast.success(`잠재수요처 등록이 요청되었습니다.`);
-          } catch (e) {
+            // toast.success(`잠재수요처 등록이 요청되었습니다.`);
+            alert("잠재수요처 등록이 요청되었습니다.");
+          } catch (e: any) {
             console.log(e);
             loadingOpen(false);
-            alert(e);
+            // alert(e.message);
             return true;
           }
         })
@@ -90,7 +93,8 @@ export default function CoRegExcel({
         });
     } else {
       loadingOpen(false);
-      toast.error(`엑셀 파일을 선택해 주세요.`);
+      // toast.error(`엑셀 파일을 선택해 주세요.`);
+      alert("엑셀 파일을 선택해 주세요.");
     }
   };
 
diff --git a/apps/wr/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal.tsx b/apps/wr/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal.tsx
index 89584ad3d..236797711 100644
--- a/apps/wr/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal.tsx
+++ b/apps/wr/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal.tsx
@@ -18,7 +18,8 @@ import {
 } from "@common/business_components";
 import { Button, Input, Label } from "@common/components";
 import { useEffect, useState } from "react";
-import toast from "react-hot-toast";
+// import toast from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 
 export type objSearchType = {
   sgg: string | number;
@@ -47,7 +48,7 @@ export function BdstReg<T extends MoType>({
   const { code, bdst, auth, findBdst } = useWrStore((state) => {
     return state;
   });
-
+  const alert = useAlertStore((state) => state.setMessage);
   const { laeSeCd } = auth;
 
   const [bdstTable, setBdstTable] = useState<BdstTypeMap[T][]>();
@@ -73,7 +74,8 @@ export function BdstReg<T extends MoType>({
 
       findBdst(String(data), searchTxt || "", moType);
     }else{
-      toast.error("시도 또는 시군구를 선택하여 주십시오.");
+      // toast.error("시도 또는 시군구를 선택하여 주십시오.");
+      alert("시도 또는 시군구를 선택하여 주십시오.");
     }
   };
 
diff --git a/apps/wr/components/ui/modal/fcltReg/fcOrgwtsRegModal/fcOrgwtsRegModal.tsx b/apps/wr/components/ui/modal/fcltReg/fcOrgwtsRegModal/fcOrgwtsRegModal.tsx
index ac79d761a..3be1806f8 100644
--- a/apps/wr/components/ui/modal/fcltReg/fcOrgwtsRegModal/fcOrgwtsRegModal.tsx
+++ b/apps/wr/components/ui/modal/fcltReg/fcOrgwtsRegModal/fcOrgwtsRegModal.tsx
@@ -1,3 +1,6 @@
+/**
+ * 재이용시설등록 > 하수재이용시설등록 - 취수하수처리장 추가 modal
+ */
 "use client";
 import { useWrStore } from "@/app/store";
 import type {
@@ -12,7 +15,8 @@ import { Button } from "@common/business_components/ui/table/lib/button";
 import { Input } from "@common/components/ui";
 import { ArrowLeft, ArrowRight } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
-import toast from "react-hot-toast";
+// import toast from "react-hot-toast";
+import { useAlertStore } from "@/src/shared/lib";
 
 export default function FcOrgwtsRegModal({
   onRightSet,
@@ -23,6 +27,7 @@ export default function FcOrgwtsRegModal({
   closeModal?: (val: boolean) => void;
   initTableData?: any[];
 }) {
+  const alert = useAlertStore((state) => state.setMessage);
   const { code, pbnst, getSwtrmtFcltNm, searchFclts } = useWrStore(
     (state) => state
   );
@@ -53,7 +58,8 @@ export default function FcOrgwtsRegModal({
       closeModal?.(false)
     }
     else {
-      toast.error("취수하수처리장 목록을 선택해주세요.")
+      // toast.error("취수하수처리장 목록을 선택해주세요.");
+      alert("취수하수처리장 목록을 선택해주세요.");
     }
   }
 
diff --git a/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx b/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx
index d8a9a733e..fcb6fe392 100644
--- a/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx
+++ b/apps/wr/components/ui/modal/fcltReg/pbnstRegModal/pbnstRegModal.tsx
@@ -18,7 +18,7 @@ import { PbnstBuseForm } from "@/components/ui/form/fcltReg/pbnstReg/buseReg/bug
 import { type FieldErrors, type UseFormReturn } from "react-hook-form";
 import { writeRgtrAndMdfr } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg";
 import type { z } from "zod";
-import { confirmToast } from "@/components/lib/func/common";
+import { useConfirm } from "@frontend-opensource/use-react-hooks";
 import { useTranslation } from "react-i18next";
 
 export function PbnstRegModal({
@@ -35,6 +35,7 @@ export function PbnstRegModal({
   newIndexMng:number
 }) {
   const { t } = useTranslation("base");
+  const { confirm } = useConfirm();
 
   //TODO: 유즈 스테이트에 set만해도 되나?
   const [, setCurrentTab] = useState<string>("mng");
@@ -50,7 +51,9 @@ export function PbnstRegModal({
         setPbnstInsert(data[0]);
       }
     };
-    confirmToast(t("isInsertMsg"), handleConfirm);
+    if (await confirm(t("isInsertMsg"))) {
+      handleConfirm();
+    }
   };
 
   const handleTabChange = (value: string) => {
diff --git a/apps/wr/components/ui/modal/sttn/pbnstSttnModal/pbnstSttnModal.tsx b/apps/wr/components/ui/modal/sttn/pbnstSttnModal/pbnstSttnModal.tsx
index 4c06f5722..1a07720a7 100644
--- a/apps/wr/components/ui/modal/sttn/pbnstSttnModal/pbnstSttnModal.tsx
+++ b/apps/wr/components/ui/modal/sttn/pbnstSttnModal/pbnstSttnModal.tsx
@@ -15,7 +15,7 @@ import {
   type fcBizType,
 } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type";
 import { formH1Class } from "@/components/lib/class/comClass";
-import { InputTableBody } from "@/components/lib/func/TableData";
+import { pbnstTableBody } from "@/components/lib/func/TableData";
 import { PbnstMngForm } from "@/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm";
 import { ScrollArea, Title, UiTable } from "@common/business_components/ui";
 import ListDiv from "@common/business_components/ui/list_div";
@@ -341,7 +341,7 @@ export function PbnstSttnModal({ data, titleVisible,isMap}: { data: customPbnst;
                           {headMakeprfmnc(pbnstPrfmncSttn.monthSttnHeadList, [])}
                         </TableHeader>
                         <TableBody key={prfmnc.pageKey + 'pageKey'}>
-                          {InputTableBody(prfData[ruseTab as keyof typeof prfData] || [], pbnstPrfmncSttn.monthSttnHeadList, setPrfData as any)}
+                          {pbnstTableBody(prfData[ruseTab as keyof typeof prfData] || [], pbnstPrfmncSttn.monthSttnHeadList, setPrfData as any)}
                         </TableBody>
                       </Table>
                     {/* </ScrollArea> */}
diff --git a/apps/wr/components/ui/table/chkgdTable/guideDetailTable/guideDetailTable.tsx b/apps/wr/components/ui/table/chkgdTable/guideDetailTable/guideDetailTable.tsx
index 4ff4ab14e..35745077c 100644
--- a/apps/wr/components/ui/table/chkgdTable/guideDetailTable/guideDetailTable.tsx
+++ b/apps/wr/components/ui/table/chkgdTable/guideDetailTable/guideDetailTable.tsx
@@ -1,3 +1,6 @@
+/**
+ * 재이용실적등록 > 지도점검결과등록 - 연간대체수이용량, 연간중수도이용량 click시 상세 model의 table body
+ */
 "use client";
 import { headMakeprfmnc } from "@/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead";
 import type { TableUpperProps } from "@/app/store/common/type/header";
@@ -41,7 +44,17 @@ export function GuideDetailsTable({
   return (
     <>
       <div className={`card !m-[1.2rem] !p-0r `}>
-        <Table variant="secondary">
+        <Table variant="secondary" className="table-fixed">
+          <colgroup>
+            {headList
+              .filter((head) => head.visible !== false)
+              .map((head) => (
+                <col
+                  key={head.id}
+                  style={{ width: head.widthPercent ? `${head.widthPercent}%` : undefined }}
+                />
+              ))}
+          </colgroup>
           <TableHeader className="font-bold">{headMakeprfmnc(headList, upheadList)}</TableHeader>
           <TableBody >
             {InputTableBody(inputData ?? [], headList, setInputData, readonly)}
diff --git a/apps/wr/components/ui/table/chkgdTable/rainChkgd/rainChkgdTable.tsx b/apps/wr/components/ui/table/chkgdTable/rainChkgd/rainChkgdTable.tsx
index 9fb84e205..a8664063e 100644
--- a/apps/wr/components/ui/table/chkgdTable/rainChkgd/rainChkgdTable.tsx
+++ b/apps/wr/components/ui/table/chkgdTable/rainChkgd/rainChkgdTable.tsx
@@ -190,7 +190,21 @@ export default function RainChkgdTable({
 
   return (
     <>
-      <Table variant="secondary">
+      <Table variant="secondary" className="table-fixed">
+        <colgroup>
+          {headList.headList
+            .filter((head) => head.visible !== false)
+            .map((head) => (
+              <col
+                key={head.id}
+                style={{
+                  width: head.widthPercent
+                    ? `${head.widthPercent}%`
+                    : undefined,
+                }}
+              />
+            ))}
+        </colgroup>
         <TableHeader className="font-bold">
           {headMakeprfmnc(
             headList?.headList,
diff --git a/apps/wr/components/ui/table/chkgdTable/rswtChkgd/rswtChkgdTable.tsx b/apps/wr/components/ui/table/chkgdTable/rswtChkgd/rswtChkgdTable.tsx
index 080084f93..bac0e71a3 100644
--- a/apps/wr/components/ui/table/chkgdTable/rswtChkgd/rswtChkgdTable.tsx
+++ b/apps/wr/components/ui/table/chkgdTable/rswtChkgd/rswtChkgdTable.tsx
@@ -1,3 +1,6 @@
+/**
+ * 재이용실적등록 > 지도점검결과 등록 - 중수도 table 목록
+ */
 "use client";
 import { headMakeprfmnc } from "@/app/(with-layout)/ruseFcltMng/prfmncReg/chkgdnReg/TableHead";
 import { useWrStore } from "@/app/store";
@@ -145,7 +148,17 @@ export default function RswtChkgdTable({
 
   return (
     <>
-      <Table variant="secondary">
+      <Table variant="secondary" className="table-fixed">
+        <colgroup>
+          {headList.headList
+            .filter((head) => head.visible !== false)
+            .map((head) => (
+              <col
+                key={head.id}
+                style={{ width: head.widthPercent ? `${head.widthPercent}%` : undefined, }}
+              />
+            ))}
+        </colgroup>
         <TableHeader className="font-bold">
           {headMakeprfmnc(headList?.headList, headList?.upHeadList)}
         </TableHeader>
diff --git a/apps/wr/public/sample_ruseCaseMng.xlsx b/apps/wr/public/sample_ruseCaseMng.xlsx
index 3676b4f71..6c6abd4c0 100644
Binary files a/apps/wr/public/sample_ruseCaseMng.xlsx and b/apps/wr/public/sample_ruseCaseMng.xlsx differ
diff --git a/apps/wr/src/app/providers/app-provider.tsx b/apps/wr/src/app/providers/app-provider.tsx
index 0497e1f52..88a10e46e 100644
--- a/apps/wr/src/app/providers/app-provider.tsx
+++ b/apps/wr/src/app/providers/app-provider.tsx
@@ -14,6 +14,7 @@ import { ConfirmDialog } from "../../shared/ui/confirm-dialog";
 // import "./globals.css";
 import i18next from "i18next";
 import { I18nextProvider } from "react-i18next";
+import { Toaster } from "react-hot-toast";
 import koBase from "@/public/locales/ko/message.json";
 import { StoreProvider as WrStoreProvider } from "@/app/store";
 //import { LoginApi } from "@/src/entities/auth";
@@ -54,6 +55,7 @@ const AppProvider = ({ children }: Readonly<{ children: React.ReactNode }>) => {
               <AlertDialog />
               <PromptDialog />
               <ConfirmDialog />
+              <Toaster position="top-center" />
             </AuthWrapper>
           </ConfirmProvider>
         </PromptProvider>
diff --git a/apps/wr/src/entities/auth/api/login-service.ts b/apps/wr/src/entities/auth/api/login-service.ts
index 77d114004..9f2671c76 100644
--- a/apps/wr/src/entities/auth/api/login-service.ts
+++ b/apps/wr/src/entities/auth/api/login-service.ts
@@ -17,6 +17,7 @@ export class LoginApiService implements LoginService {
 
   public async login(payload: ILogin): Promise<void> {
     try {
+      tokenManager.clearAuthToken();
       const response = await fetch( PROXY_HOST+ ENDPOINT.USER_SERVICE.LOGIN, {
         method: "POST",
         body: JSON.stringify({
diff --git a/apps/wr/src/features/auth/login/ui/SignupModal.tsx b/apps/wr/src/features/auth/login/ui/SignupModal.tsx
index 00a244e13..2be88cce9 100644
--- a/apps/wr/src/features/auth/login/ui/SignupModal.tsx
+++ b/apps/wr/src/features/auth/login/ui/SignupModal.tsx
@@ -14,7 +14,9 @@ interface SignupModalProps {
 }
 
 function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
-  const [currentStep, setCurrentStep] = useState<'agreement' | 'signup'>('agreement');
+  const [currentStep, setCurrentStep] = useState<"agreement" | "signup">(
+    "agreement",
+  );
   const [agreed, setAgreed] = useState(false);
   const [formData, setFormData] = useState({
     userId: "",
@@ -47,7 +49,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
   // 모달이 닫힐 때 초기화
   useEffect(() => {
     if (!open) {
-      setCurrentStep('agreement');
+      setCurrentStep("agreement");
       setAgreed(false);
       setFormData({
         userId: "",
@@ -81,17 +83,19 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
   const handleNextStep = () => {
     if (agreed) {
-      setCurrentStep('signup');
+      setCurrentStep("signup");
     }
   };
 
-  const handleInputChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {
+  const handleInputChange = (
+    e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>,
+  ) => {
     const { name, value } = e.target;
-    setFormData(prev => ({ ...prev, [name]: value }));
-    
+    setFormData((prev) => ({ ...prev, [name]: value }));
+
     // 에러 초기화
     if (errors[name]) {
-      setErrors(prev => ({ ...prev, [name]: "" }));
+      setErrors((prev) => ({ ...prev, [name]: "" }));
     }
   };
 
@@ -102,20 +106,27 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
     if (!formData.userId) newErrors.userId = "아이디를 입력해주세요.";
     if (!formData.userName) newErrors.userName = "이름을 입력해주세요.";
     if (!formData.password) newErrors.password = "비밀번호를 입력해주세요.";
-    if (!formData.confirmPassword) newErrors.confirmPassword = "비밀번호 확인을 입력해주세요.";
+    if (!formData.confirmPassword)
+      newErrors.confirmPassword = "비밀번호 확인을 입력해주세요.";
     if (!formData.pswdHnt) newErrors.pswdHnt = "비밀번호 힌트를 입력해주세요.";
     if (!formData.laeSeCd) newErrors.laeSeCd = "법인구분을 선택해주세요.";
     if (!formData.ogdpSeCd) newErrors.ogdpSeCd = "기관구분을 선택해주세요.";
 
     // 비밀번호 확인
-    if (formData.password && formData.confirmPassword && formData.password !== formData.confirmPassword) {
+    if (
+      formData.password &&
+      formData.confirmPassword &&
+      formData.password !== formData.confirmPassword
+    ) {
       newErrors.confirmPassword = "비밀번호가 일치하지 않습니다.";
     }
 
     // 비밀번호 정규식 검증
-    const passwordRegex = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]).{8,20}$/;
+    const passwordRegex =
+      /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[!@#$%^&*()_+\-=[\]{};':"\\|,.<>/?]).{8,20}$/;
     if (formData.password && !passwordRegex.test(formData.password)) {
-      newErrors.password = "비밀번호는 8~20자, 영문/숫자/특수기호를 모두 포함해야 합니다.";
+      newErrors.password =
+        "비밀번호는 8~20자, 영문/숫자/특수기호를 모두 포함해야 합니다.";
     }
 
     // 이메일 형식 검증
@@ -124,8 +135,10 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
     }
 
     // 중복 체크 검증
-    if (idAvailable === false) newErrors.userId = "이미 사용 중인 아이디입니다.";
-    if (emailAvailable === false) newErrors.email = "이미 사용 중인 이메일입니다.";
+    if (idAvailable === false)
+      newErrors.userId = "이미 사용 중인 아이디입니다.";
+    if (emailAvailable === false)
+      newErrors.email = "이미 사용 중인 이메일입니다.";
 
     setErrors(newErrors);
     const isValid = Object.keys(newErrors).length === 0;
@@ -135,7 +148,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
   const checkUserIdDuplicate = async () => {
     if (!formData.userId) {
-      setErrors(prev => ({ ...prev, userId: "아이디를 입력해주세요." }));
+      setErrors((prev) => ({ ...prev, userId: "아이디를 입력해주세요." }));
       return;
     }
 
@@ -147,19 +160,25 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
       });
       const response = await signupClient.post<boolean>(
         `${ENDPOINT.USER_SERVICE.USERS}/existsUserId`,
-        { userId: formData.userId }
+        { userId: formData.userId },
       );
 
       const exists = response.data;
       setIdAvailable(!exists);
       if (exists) {
-        setErrors(prev => ({ ...prev, userId: "이미 사용 중인 아이디입니다." }));
+        setErrors((prev) => ({
+          ...prev,
+          userId: "이미 사용 중인 아이디입니다.",
+        }));
       } else {
-        setErrors(prev => ({ ...prev, userId: "" }));
+        setErrors((prev) => ({ ...prev, userId: "" }));
       }
     } catch (error) {
       console.error("아이디 중복 체크 오류:", error);
-      setErrors(prev => ({ ...prev, userId: "아이디 중복 체크 중 오류가 발생했습니다." }));
+      setErrors((prev) => ({
+        ...prev,
+        userId: "아이디 중복 체크 중 오류가 발생했습니다.",
+      }));
     } finally {
       setIsCheckingId(false);
     }
@@ -167,7 +186,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
   const checkEmailDuplicate = async () => {
     if (!formData.email) {
-      setErrors(prev => ({ ...prev, email: "이메일을 입력해주세요." }));
+      setErrors((prev) => ({ ...prev, email: "이메일을 입력해주세요." }));
       return;
     }
 
@@ -179,28 +198,34 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
       });
       const response = await signupClient.post<boolean>(
         `${ENDPOINT.USER_SERVICE.USERS}/exists`,
-        { email: formData.email }
+        { email: formData.email },
       );
 
       const exists = response.data;
       setEmailAvailable(!exists);
       if (exists) {
-        setErrors(prev => ({ ...prev, email: "이미 사용 중인 이메일입니다." }));
+        setErrors((prev) => ({
+          ...prev,
+          email: "이미 사용 중인 이메일입니다.",
+        }));
       } else {
-        setErrors(prev => ({ ...prev, email: "" }));
+        setErrors((prev) => ({ ...prev, email: "" }));
       }
     } catch (error) {
       console.error("이메일 중복 체크 오류:", error);
-      setErrors(prev => ({ ...prev, email: "이메일 중복 체크 중 오류가 발생했습니다." }));
+      setErrors((prev) => ({
+        ...prev,
+        email: "이메일 중복 체크 중 오류가 발생했습니다.",
+      }));
     } finally {
       setIsCheckingEmail(false);
     }
   };
 
-  const handleSubmit = async (e: React.FormEvent) => {
+  const handleSubmit = async (e: React.SubmitEvent) => {
     e.preventDefault();
     console.log("회원가입 버튼 클릭됨");
-    
+
     if (!validateForm()) {
       console.log("폼 검증 실패");
       return;
@@ -230,19 +255,19 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
 
       // SignupClient를 통해 익명사용자 회원가입 API 호출
       const signupClient = SignupClient.getInstance({
-        baseURL: BASE_URL
+        baseURL: BASE_URL,
       });
       const response = await signupClient.post(
         `${ENDPOINT.USER_SERVICE.USERS}/anonymouse/users/join`,
-        signupData
+        signupData,
       );
 
       console.log("회원가입 성공:", response.data);
-      
+
       // 성공 시 모달 닫기 및 콜백 호출
       onSuccess();
       onClose();
-      
+
       // 폼 초기화
       setFormData({
         userId: "",
@@ -267,13 +292,12 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
       setErrors({});
       setIdAvailable(null);
       setEmailAvailable(null);
-
     } catch (error: unknown) {
       console.error("회원가입 오류:", error);
       if (error instanceof Error) {
-        setErrors(prev => ({ ...prev, submit: error.message }));
+        setErrors((prev) => ({ ...prev, submit: error.message }));
       } else {
-        setErrors(prev => ({ ...prev, submit: "회원가입에 실패했습니다." }));
+        setErrors((prev) => ({ ...prev, submit: "회원가입에 실패했습니다." }));
       }
     } finally {
       setIsLoading(false);
@@ -286,36 +310,52 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
     <div className="modal-overlay" onClick={onClose}>
       <div className="modal-content" onClick={(e) => e.stopPropagation()}>
         <div className="modal-header">
-          <h2>{currentStep === 'agreement' ? '개인정보제공동의' : '회원가입'}</h2>
-          <button className="close-button" onClick={onClose}>×</button>
+          <h2>
+            {currentStep === "agreement" ? "개인정보제공동의" : "회원가입"}
+          </h2>
+          <button className="close-button" onClick={onClose}>
+            ×
+          </button>
         </div>
-        
-        {currentStep === 'agreement' ? (
+
+        {currentStep === "agreement" ? (
           <div className="agreement-content">
             <div className="agreement-text">
               <h3>개인정보 수집 및 이용 동의</h3>
               <p>회원가입을 위해 다음과 같이 개인정보를 수집 및 이용합니다.</p>
-              
+
               <h4>1. 수집하는 개인정보 항목</h4>
               <ul>
-                <li>필수항목: 아이디, 이름, 비밀번호, 비밀번호 힌트, 법인구분, 기관구분</li>
-                <li>선택항목: 이메일, 휴대폰번호, 전화번호, 주소, 기관코드, 상세기관코드, 사업자등록번호</li>
+                <li>
+                  필수항목: 아이디, 이름, 비밀번호, 비밀번호 힌트, 법인구분,
+                  기관구분
+                </li>
+                <li>
+                  선택항목: 이메일, 휴대폰번호, 전화번호, 주소, 기관코드,
+                  상세기관코드, 사업자등록번호
+                </li>
               </ul>
-              
+
               <h4>2. 개인정보의 수집 및 이용목적</h4>
               <ul>
                 <li>회원가입 및 관리</li>
                 <li>서비스 제공 및 운영</li>
                 <li>고객상담 및 문의응답</li>
               </ul>
-              
+
               <h4>3. 개인정보의 보유 및 이용기간</h4>
-              <p>회원탈퇴 시까지 (단, 관련 법령에 따라 보존이 필요한 경우 해당 기간까지)</p>
-              
+              <p>
+                회원탈퇴 시까지 (단, 관련 법령에 따라 보존이 필요한 경우 해당
+                기간까지)
+              </p>
+
               <h4>4. 동의 거부권 및 거부 시 불이익</h4>
-              <p>개인정보 수집 및 이용에 대한 동의를 거부할 수 있으며, 동의 거부 시 회원가입이 제한됩니다.</p>
+              <p>
+                개인정보 수집 및 이용에 대한 동의를 거부할 수 있으며, 동의 거부
+                시 회원가입이 제한됩니다.
+              </p>
             </div>
-            
+
             <div className="agreement-checkbox">
               <label>
                 <input
@@ -326,13 +366,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                 <span>개인정보 수집 및 이용에 동의합니다.</span>
               </label>
             </div>
-            
+
             <div className="agreement-actions">
-              <button
-                type="button"
-                onClick={onClose}
-                className="cancel-button"
-              >
+              <button type="button" onClick={onClose} className="cancel-button">
                 취소
               </button>
               <button
@@ -349,7 +385,7 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
           <form onSubmit={handleSubmit} className="signup-form">
             <div className="form-section">
               <h3>기본 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="userId">아이디 *</label>
@@ -373,8 +409,14 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                       {isCheckingId ? "확인중..." : "중복확인"}
                     </button>
                   </div>
-                  {idAvailable === true && <span className="success-message">사용 가능한 아이디입니다.</span>}
-                  {errors.userId && <span className="error-message">{errors.userId}</span>}
+                  {idAvailable === true && (
+                    <span className="success-message">
+                      사용 가능한 아이디입니다.
+                    </span>
+                  )}
+                  {errors.userId && (
+                    <span className="error-message">{errors.userId}</span>
+                  )}
                 </div>
               </div>
 
@@ -390,7 +432,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     placeholder="이름을 입력하세요"
                     disabled={isLoading}
                   />
-                  {errors.userName && <span className="error-message">{errors.userName}</span>}
+                  {errors.userName && (
+                    <span className="error-message">{errors.userName}</span>
+                  )}
                 </div>
               </div>
 
@@ -416,8 +460,14 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                       {isCheckingEmail ? "확인중..." : "중복확인"}
                     </button>
                   </div>
-                  {emailAvailable === true && <span className="success-message">사용 가능한 이메일입니다.</span>}
-                  {errors.email && <span className="error-message">{errors.email}</span>}
+                  {emailAvailable === true && (
+                    <span className="success-message">
+                      사용 가능한 이메일입니다.
+                    </span>
+                  )}
+                  {errors.email && (
+                    <span className="error-message">{errors.email}</span>
+                  )}
                 </div>
               </div>
 
@@ -434,7 +484,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={20}
                     disabled={isLoading}
                   />
-                  {errors.password && <span className="error-message">{errors.password}</span>}
+                  {errors.password && (
+                    <span className="error-message">{errors.password}</span>
+                  )}
                 </div>
               </div>
 
@@ -451,7 +503,11 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={20}
                     disabled={isLoading}
                   />
-                  {errors.confirmPassword && <span className="error-message">{errors.confirmPassword}</span>}
+                  {errors.confirmPassword && (
+                    <span className="error-message">
+                      {errors.confirmPassword}
+                    </span>
+                  )}
                 </div>
               </div>
 
@@ -468,7 +524,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={10}
                     disabled={isLoading}
                   />
-                  {errors.pswdHnt && <span className="error-message">{errors.pswdHnt}</span>}
+                  {errors.pswdHnt && (
+                    <span className="error-message">{errors.pswdHnt}</span>
+                  )}
                 </div>
               </div>
 
@@ -485,14 +543,16 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={100}
                     disabled={isLoading}
                   />
-                  {errors.pswdAns && <span className="error-message">{errors.pswdAns}</span>}
+                  {errors.pswdAns && (
+                    <span className="error-message">{errors.pswdAns}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             <div className="form-section">
               <h3>연락처 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="mphn">휴대폰 번호</label>
@@ -506,7 +566,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={11}
                     disabled={isLoading}
                   />
-                  {errors.mphn && <span className="error-message">{errors.mphn}</span>}
+                  {errors.mphn && (
+                    <span className="error-message">{errors.mphn}</span>
+                  )}
                 </div>
               </div>
 
@@ -523,14 +585,16 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={11}
                     disabled={isLoading}
                   />
-                  {errors.telno && <span className="error-message">{errors.telno}</span>}
+                  {errors.telno && (
+                    <span className="error-message">{errors.telno}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             <div className="form-section">
               <h3>주소 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="zip">우편번호</label>
@@ -544,7 +608,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={5}
                     disabled={isLoading}
                   />
-                  {errors.zip && <span className="error-message">{errors.zip}</span>}
+                  {errors.zip && (
+                    <span className="error-message">{errors.zip}</span>
+                  )}
                 </div>
               </div>
 
@@ -561,7 +627,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={200}
                     disabled={isLoading}
                   />
-                  {errors.addr && <span className="error-message">{errors.addr}</span>}
+                  {errors.addr && (
+                    <span className="error-message">{errors.addr}</span>
+                  )}
                 </div>
               </div>
 
@@ -578,14 +646,16 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={200}
                     disabled={isLoading}
                   />
-                  {errors.daddr && <span className="error-message">{errors.daddr}</span>}
+                  {errors.daddr && (
+                    <span className="error-message">{errors.daddr}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             <div className="form-section">
               <h3>기관 정보</h3>
-              
+
               <div className="form-row">
                 <div className="form-group">
                   <label htmlFor="laeSeCd">법인구분 *</label>
@@ -601,7 +671,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     <option value="02">민간기업</option>
                     <option value="03">개인</option>
                   </select>
-                  {errors.laeSeCd && <span className="error-message">{errors.laeSeCd}</span>}
+                  {errors.laeSeCd && (
+                    <span className="error-message">{errors.laeSeCd}</span>
+                  )}
                 </div>
               </div>
 
@@ -621,7 +693,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     <option value="03">공공기관</option>
                     <option value="04">민간기업</option>
                   </select>
-                  {errors.ogdpSeCd && <span className="error-message">{errors.ogdpSeCd}</span>}
+                  {errors.ogdpSeCd && (
+                    <span className="error-message">{errors.ogdpSeCd}</span>
+                  )}
                 </div>
               </div>
 
@@ -638,7 +712,9 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={10}
                     disabled={isLoading}
                   />
-                  {errors.instSeCd && <span className="error-message">{errors.instSeCd}</span>}
+                  {errors.instSeCd && (
+                    <span className="error-message">{errors.instSeCd}</span>
+                  )}
                 </div>
               </div>
 
@@ -655,21 +731,25 @@ function SignupModal({ open, onClose, onSuccess }: SignupModalProps) {
                     maxLength={10}
                     disabled={isLoading}
                   />
-                  {errors.dtlInstCd && <span className="error-message">{errors.dtlInstCd}</span>}
+                  {errors.dtlInstCd && (
+                    <span className="error-message">{errors.dtlInstCd}</span>
+                  )}
                 </div>
               </div>
             </div>
 
             {errors.submit && (
               <div className="form-row">
-                <div className="error-message submit-error">{errors.submit}</div>
+                <div className="error-message submit-error">
+                  {errors.submit}
+                </div>
               </div>
             )}
 
             <div className="form-actions">
               <button
                 type="button"
-                onClick={() => setCurrentStep('agreement')}
+                onClick={() => setCurrentStep("agreement")}
                 className="back-button"
                 disabled={isLoading}
               >
diff --git a/apps/wr/src/features/auth/login/ui/login-page.tsx b/apps/wr/src/features/auth/login/ui/login-page.tsx
index 955ddd24d..cfb902be8 100644
--- a/apps/wr/src/features/auth/login/ui/login-page.tsx
+++ b/apps/wr/src/features/auth/login/ui/login-page.tsx
@@ -7,8 +7,10 @@ import "./login.css";
 
 function LoginPage() {
   const hostname = window.location.hostname;
-  if (hostname.includes("hasuon.or.kr")) window.location.href = process.env.NEXT_PUBLIC_CM_LOGIN_PAGE_URL||'/auth/login';
-  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>) => {
+  if (hostname.includes("hasuon.or.kr"))
+    window.location.href =
+      process.env.NEXT_PUBLIC_CM_LOGIN_PAGE_URL || "/auth/login";
+  const handleSubmit = async (e: React.SubmitEvent<HTMLFormElement>) => {
     e.preventDefault();
 
     const formData = new FormData(e.target as HTMLFormElement);
@@ -129,4 +131,3 @@ function LoginPage() {
 }
 
 export { LoginPage };
-
diff --git a/docs/auth-service-refactoring-guide.md b/docs/auth-service-refactoring-guide.md
new file mode 100644
index 000000000..8f06974e8
--- /dev/null
+++ b/docs/auth-service-refactoring-guide.md
@@ -0,0 +1,177 @@
+# 서비스별 인증 처리 리팩토링 가이드
+
+## 1) 문서 목적
+
+여러 서비스 앱에서 중복 구현된 인증 로직을 공통 모듈(`@common/auth`) 기반으로 통일하기 위한 표준 가이드
+
+핵심 원칙:
+
+- 인증 정책은 공통 모듈에 모은다.
+- 서비스별 차이는 설정(`authConfig`)으로만 표현한다.
+- 토큰 갱신 타이머는 JWT `exp` 기준으로 계산한다.
+
+## 2) 공통 아키텍처
+
+인증 관련 책임을 아래처럼 분리한다.
+
+- `shared/config/env.ts`: 환경 변수 노출
+- `shared/config/auth.ts`: 서비스별 인증 키/도메인 설정
+- `entities/auth/lib/token-manager.ts`: 공통 토큰 매니저 생성/re-export
+- `entities/auth/api/*`: 로그인/토큰 갱신 API 오케스트레이션
+- 레이아웃: BaseLayout 컴포넌트에 `tokenManager` 주입
+
+## 3) 단계별 리팩토링 방법
+
+### 3-1. 환경 변수 정의 통일 (`shared/config/env.ts`)
+
+서비스마다 이름이 다른 인증 환경 변수를 한 곳에서 노출한다.
+
+예시 코드:
+
+```ts
+export const CLAIM_NAME =
+  process.env.NEXT_PUBLIC_CLAIM_NAME || "Authorization";
+export const AUTH_USER_ID =
+  process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id";
+export const ACCESS_TOKEN =
+  process.env.NEXT_PUBLIC_ACCESS_TOKEN || "access-token";
+export const REFRESH_TOKEN =
+  process.env.NEXT_PUBLIC_REFRESH_TOKEN || "refresh-token";
+export const COOKIE_DOMAIN = process.env.NEXT_PUBLIC_COOKIE_DOMAIN;
+```
+
+### 3-2. 서비스별 인증 설정 분리 (`shared/config/auth.ts`)
+
+하드코딩된 키명을 제거하고 `AuthConfig`로 매핑한다.
+
+예시 코드:
+
+```ts
+import type { AuthConfig } from "@common/auth";
+import {
+  ACCESS_TOKEN,
+  AUTH_USER_ID,
+  CLAIM_NAME,
+  COOKIE_DOMAIN,
+  REFRESH_TOKEN,
+} from "./env";
+
+export const authConfig: AuthConfig = {
+  authUserId: AUTH_USER_ID,
+  claimName: CLAIM_NAME,
+  cookieDomain: COOKIE_DOMAIN,
+  accessToken: ACCESS_TOKEN,
+  refreshToken: REFRESH_TOKEN,
+};
+```
+
+### 3-3. 토큰 매니저 공통화 (`entities/auth/lib/token-manager.ts`)
+
+서비스 고유 `TokenManager` 구현을 제거하고 `createTokenManager`를 사용한다.
+
+예시 코드:
+
+```ts
+import { authConfig } from "@/shared/config/auth";
+import { createTokenManager } from "@common/auth";
+
+export const tokenManager = createTokenManager(authConfig);
+
+export const {
+  getToken,
+  setToken,
+  removeToken,
+  setupRefreshTimer,
+  clearAuthToken,
+  getAccessToken,
+  getRefreshToken,
+  getUserId,
+} = tokenManager;
+```
+
+### 3-4. 로그인 성공 처리 표준화 (`entities/auth/api/login-service.ts`)
+
+로그인 성공 시 토큰 저장과 자동 갱신 타이머 설정을 한 흐름으로 고정한다.
+
+예시 코드:
+
+```ts
+import { getRemainingMs } from "@common/auth";
+import { setToken, setupRefreshTimer } from "../lib/token-manager";
+
+async function onLoginSuccess(params: {
+  accessToken: string;
+  tokenId: string;
+  refresh: () => Promise<void>;
+}) {
+  setToken(authConfig.claimName, params.accessToken);
+  setToken(authConfig.authUserId, params.tokenId);
+
+  const remainingMs = getRemainingMs(params.accessToken);
+  if (remainingMs <= 0) return;
+
+  setupRefreshTimer(params.refresh, remainingMs);
+}
+```
+
+### 3-5. 토큰 갱신 실패 처리 표준화
+
+토큰 갱신 실패 시 인증 토큰을 일괄 정리한다.
+
+예시 코드:
+
+```ts
+import { clearAuthToken } from "../lib/token-manager";
+
+async function silentRefresh() {
+  try {
+    ...
+  } catch (error) {
+    clearAuthToken();
+    throw error;
+  }
+}
+```
+
+### 3-6. 공통 레이아웃/쉘에 토큰 매니저 주입
+
+공통 컴포넌트가 인증 기능을 직접 사용할 수 있도록 주입한다.
+
+예시 코드:
+
+```tsx
+import { tokenManager } from "@/entities/auth";
+
+export function AppLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <BaseLayout
+      tokenManager={tokenManager}
+      ...
+    >
+      {children}
+    </BaseLayout>
+  );
+}
+```
+
+### 3-7. 배럴 파일 re-export 정리 (`entities/auth/index.ts`)
+
+외부에서 인증 엔티티를 일관된 경로로 사용하도록 re-export한다.
+
+예시 코드:
+
+```ts
+export { LoginApi } from "./api/login-service";
+export { AuthWrapper } from "./lib/auth-wrapper";
+export { tokenManager } from "./lib/token-manager";
+```
+
+## 4) 서비스별 적용 체크리스트
+
+각 서비스 담당자는 아래 항목을 모두 충족해야 한다.
+
+- `authConfig`에 서비스별 키명이 정확히 매핑되어 있다.
+- 서비스 내부 커스텀 TokenManager 클래스가 제거되었다.
+- 로그인/갱신 로직이 `getRemainingMs` 기반 타이머를 사용한다.
+- BaseLayout 컴포넌트에 `tokenManager`가 주입되어 있다.
+- 외부 참조 경로가 `entities/auth` 배럴 경로로 통일되어 있다.
diff --git a/package.json b/package.json
index fc236f021..c6d70dedf 100644
--- a/package.json
+++ b/package.json
@@ -18,14 +18,12 @@
     "build:wr": "turbo run build --filter=wr",
     "build:fo": "turbo run build --filter=fo",
     "build:dm": "turbo run build --filter=dm",
-    "build:dm_new": "turbo run build --filter=dm_new",
     "dev:cm": "turbo run dev --filter=cm",
     "dev:cs": "turbo run dev --filter=cs",
     "dev:sn": "turbo run dev --filter=sn",
     "dev:wr": "turbo run dev --filter=wr",
     "dev:fo": "turbo run dev --filter=fo",
     "dev:dm": "turbo run dev --filter=dm",
-    "dev:dm_new": "turbo run dev --filter=dm_new",
     "preview:components": "turbo run storybook --filter=@common/components",
     "preinstall": "npx only-allow pnpm",
     "prepare": "husky"
diff --git a/packages/common/auth/README.md b/packages/common/auth/README.md
new file mode 100644
index 000000000..5cd54d787
--- /dev/null
+++ b/packages/common/auth/README.md
@@ -0,0 +1,492 @@
+# @common/auth
+
+인증 관련 공통 기능을 제공하는 독립 패키지입니다. 의존성 주입 패턴을 통해 각 앱의 환경변수를 주입받아 재사용 가능한 토큰 관리 기능을 제공합니다.
+
+## 특징
+
+- **의존성 주입**: 환경변수를 직접 참조하지 않고 설정 객체를 주입받음
+- **재사용성**: 모든 앱에서 동일한 로직 사용 가능
+- **타입 안정성**: TypeScript 인터페이스로 계약 보장
+- **테스트 가능성**: Mock 설정 주입으로 단위 테스트 용이
+
+## 패키지 구조
+
+```
+packages/common/auth/
+├── package.json          # 패키지 정의
+├── tsconfig.json         # TypeScript 설정
+├── index.ts             # 진입점 (Public API)
+├── types.ts             # 타입 정의
+├── token-manager.ts     # 토큰 관리 로직
+├── cookie.ts           # 쿠키 유틸리티
+├── jwt-utils.ts        # JWT 유틸리티
+└── README.md           # 문서
+```
+
+## 설치
+
+각 앱의 `package.json`에 의존성을 추가합니다:
+
+```json
+{
+  "dependencies": {
+    "@common/auth": "workspace:*"
+  }
+}
+```
+
+## 사용 방법
+
+### 1. 설정 파일 생성
+
+각 앱에서 자신의 환경변수로 `AuthConfig` 객체를 생성합니다.
+
+```typescript
+// apps/cs/src/shared/config/auth.ts
+import type { AuthConfig } from "@common/auth/types";
+
+export const authConfig: AuthConfig = {
+  authUserId: process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id",
+  claimName: process.env.NEXT_PUBLIC_CLAIM_NAME || "Authorization",
+  cookieDomain: process.env.NEXT_PUBLIC_COOKIE_DOMAIN,
+  accessToken: process.env.NEXT_PUBLIC_ACCESS_TOKEN || "access-token",
+  refreshToken: process.env.NEXT_PUBLIC_REFRESH_TOKEN || "refresh-token",
+};
+```
+
+### 2. TokenManager 인스턴스 생성
+
+설정을 주입하여 토큰 매니저 인스턴스를 생성합니다.
+
+```typescript
+// apps/cs/src/entities/auth/lib/token-manager.ts
+import { createTokenManager } from "@common/auth";
+import { authConfig } from "@/shared/config/auth";
+
+export const tokenManager = createTokenManager(authConfig);
+
+// 편의를 위한 re-export
+export const {
+  getToken,
+  setToken,
+  removeToken,
+  setupRefreshTimer,
+  clearAuthToken,
+  getAccessToken,
+  getRefreshToken,
+  getUserId,
+} = tokenManager;
+```
+
+### 3. 컴포넌트에서 사용
+
+```typescript
+// apps/cs/src/features/auth/ui/LoginForm.tsx
+import { tokenManager } from "@/entities/auth/lib/token-manager";
+import { authConfig } from "@/shared/config/auth";
+
+export function LoginForm() {
+  const handleLogin = async (credentials: LoginCredentials) => {
+    const response = await loginApi(credentials);
+    
+    // 토큰 저장
+    tokenManager.setToken(authConfig.claimName, response.accessToken);
+    tokenManager.setToken(authConfig.refreshToken, response.refreshToken);
+    
+    // 또는 편의 메서드 사용
+    // tokenManager.getAccessToken();
+    // tokenManager.getRefreshToken();
+    // tokenManager.getUserId();
+  };
+
+  return (
+    // ... JSX
+  );
+}
+```
+
+## API 문서
+
+### `createTokenManager(config: AuthConfig): TokenManager`
+
+토큰 매니저 인스턴스를 생성하는 팩토리 함수입니다.
+
+**Parameters:**
+- `config: AuthConfig` - 인증 설정 객체
+
+**Returns:**
+- `TokenManager` - 토큰 관리 메서드를 포함한 객체
+
+### TokenManager 메서드
+
+#### `getToken(key: string): string | undefined`
+
+지정된 키의 쿠키 값을 가져옵니다.
+
+```typescript
+const token = tokenManager.getToken("access-token");
+```
+
+#### `setToken(key: string, value: string): void`
+
+토큰을 쿠키에 저장합니다. 자동으로 도메인, secure, sameSite 설정을 적용합니다.
+
+```typescript
+tokenManager.setToken("access-token", "eyJhbGc...");
+```
+
+#### `removeToken(key: string): void`
+
+지정된 키의 쿠키를 삭제합니다.
+
+```typescript
+tokenManager.removeToken("access-token");
+```
+
+#### `setupRefreshTimer(callback: () => Promise<void>, delayMs: number): void`
+
+토큰 갱신 타이머를 설정합니다.
+
+```typescript
+tokenManager.setupRefreshTimer(async () => {
+  await refreshAccessToken();
+}, 3600000); // 1시간 후
+```
+
+#### `clearAuthToken(): void`
+
+모든 인증 토큰을 삭제하고 타이머를 정리합니다.
+
+```typescript
+tokenManager.clearAuthToken();
+```
+
+#### `getAccessToken(): string | undefined`
+
+액세스 토큰을 가져오는 편의 메서드입니다.
+
+```typescript
+const accessToken = tokenManager.getAccessToken();
+```
+
+#### `getRefreshToken(): string | undefined`
+
+리프레시 토큰을 가져오는 편의 메서드입니다.
+
+```typescript
+const refreshToken = tokenManager.getRefreshToken();
+```
+
+#### `getUserId(): string | undefined`
+
+사용자 ID 토큰을 가져오는 편의 메서드입니다.
+
+```typescript
+const userId = tokenManager.getUserId();
+```
+
+### JWT 유틸리티
+
+#### `getJwtExpiry(token: string): number | null`
+
+JWT 토큰의 만료 시간(Unix timestamp, 초 단위)을 반환합니다.
+
+```typescript
+import { getJwtExpiry } from "@common/auth";
+
+const expiry = getJwtExpiry(token);
+if (expiry) {
+  console.log("Token expires at:", new Date(expiry * 1000));
+}
+```
+
+#### `getRemainingMs(token: string): number`
+
+토큰 만료 1분 전까지 남은 시간(밀리초)을 반환합니다.
+
+```typescript
+import { getRemainingMs } from "@common/auth";
+
+const remaining = getRemainingMs(token);
+if (remaining > 0) {
+  console.log("Token valid for:", remaining, "ms");
+}
+```
+
+### 쿠키 유틸리티
+
+#### `getCookie(name: string): string | undefined`
+
+쿠키 값을 가져옵니다.
+
+```typescript
+import { getCookie } from "@common/auth";
+
+const value = getCookie("my-cookie");
+```
+
+#### `setCookie(name: string, value: string, options?: CookieOptions): void`
+
+쿠키를 설정합니다.
+
+```typescript
+import { setCookie } from "@common/auth";
+
+setCookie("my-cookie", "value", {
+  secure: true,
+  sameSite: "lax",
+  path: "/",
+});
+```
+
+#### `removeCookie(name: string, options?: CookieOptions): void`
+
+쿠키를 삭제합니다.
+
+```typescript
+import { removeCookie } from "@common/auth";
+
+removeCookie("my-cookie", { path: "/" });
+```
+
+## 타입 정의
+
+### `AuthConfig`
+
+```typescript
+interface AuthConfig {
+  authUserId: string;        // 사용자 ID 토큰 키
+  claimName: string;         // 액세스 토큰 키
+  cookieDomain?: string;     // 쿠키 도메인 (선택)
+  accessToken?: string;      // 액세스 토큰 키 (선택)
+  refreshToken?: string;     // 리프레시 토큰 키 (선택)
+}
+```
+
+### `CookieOptions`
+
+```typescript
+interface CookieOptions {
+  secure?: boolean;
+  sameSite?: "strict" | "lax" | "none";
+  domain?: string;
+  path?: string;
+  expires?: number | Date;
+}
+```
+
+## 마이그레이션 가이드
+
+### 기존 앱에서 @common/auth로 마이그레이션
+
+#### 1. 의존성 추가
+
+```bash
+# 앱 디렉토리에서
+cd apps/your-app
+```
+
+`package.json`에 추가:
+```json
+{
+  "dependencies": {
+    "@common/auth": "workspace:*"
+  }
+}
+```
+
+```bash
+pnpm install
+```
+
+#### 2. 설정 파일 생성
+
+```typescript
+// apps/your-app/src/shared/config/auth.ts
+import type { AuthConfig } from "@common/auth/types";
+
+export const authConfig: AuthConfig = {
+  authUserId: process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id",
+  claimName: process.env.NEXT_PUBLIC_CLAIM_NAME || "Authorization",
+  cookieDomain: process.env.NEXT_PUBLIC_COOKIE_DOMAIN,
+  accessToken: process.env.NEXT_PUBLIC_ACCESS_TOKEN || "access-token",
+  refreshToken: process.env.NEXT_PUBLIC_REFRESH_TOKEN || "refresh-token",
+};
+```
+
+#### 3. TokenManager 수정
+
+**Before (기존 코드):**
+```typescript
+// apps/your-app/src/entities/auth/lib/token-manager.ts
+import { AUTH_USER_ID, CLAIM_NAME } from "@/shared/config";
+import { getCookie, setCookie, removeCookie } from "@/shared/lib";
+
+export function getToken(key: string): string | undefined {
+  return getCookie(key);
+}
+
+export function clearAuthToken(): void {
+  removeToken(CLAIM_NAME);
+  removeToken(AUTH_USER_ID);
+}
+```
+
+**After (@common/auth 사용):**
+```typescript
+// apps/your-app/src/entities/auth/lib/token-manager.ts
+import { createTokenManager } from "@common/auth";
+import { authConfig } from "@/shared/config/auth";
+
+export const tokenManager = createTokenManager(authConfig);
+
+// 기존 코드와의 호환성을 위한 re-export
+export const {
+  getToken,
+  setToken,
+  removeToken,
+  setupRefreshTimer,
+  clearAuthToken,
+  getAccessToken,
+  getRefreshToken,
+  getUserId,
+} = tokenManager;
+```
+
+#### 4. 사용처 업데이트
+
+**클래스 기반 (st, cm 앱):**
+```typescript
+// Before
+import { TokenManager } from "@/entities/auth/lib/token-manager";
+const tokenManager = TokenManager.getInstance();
+
+// After
+import { tokenManager } from "@/entities/auth/lib/token-manager";
+// 그대로 사용 가능
+```
+
+**함수형 (cs 앱):**
+```typescript
+// Before
+import { getToken, setToken, clearAuthToken } from "@/entities/auth/lib/token-manager";
+
+// After
+import { getToken, setToken, clearAuthToken } from "@/entities/auth/lib/token-manager";
+// 그대로 사용 가능 (re-export 덕분)
+```
+
+## 다른 앱에서 사용 예시
+
+### AS 앱
+
+```typescript
+// apps/as/src/shared/config/auth.ts
+import type { AuthConfig } from "@common/auth/types";
+
+export const authConfig: AuthConfig = {
+  authUserId: process.env.NEXT_PUBLIC_AS_AUTH_USER_ID || "as-token-id",
+  claimName: process.env.NEXT_PUBLIC_AS_CLAIM_NAME || "X-AS-Auth",
+  cookieDomain: process.env.NEXT_PUBLIC_AS_COOKIE_DOMAIN,
+  accessToken: process.env.NEXT_PUBLIC_AS_ACCESS_TOKEN || "as-access-token",
+  refreshToken: process.env.NEXT_PUBLIC_AS_REFRESH_TOKEN || "as-refresh-token",
+};
+```
+
+### ST 앱
+
+```typescript
+// apps/st/src/shared/config/auth.ts
+import type { AuthConfig } from "@common/auth/types";
+
+export const authConfig: AuthConfig = {
+  authUserId: process.env.NEXT_PUBLIC_AUTH_USER_ID || "token-id",
+  claimName: process.env.NEXT_PUBLIC_CLAIM_NAME || "Authorization",
+  cookieDomain: ".hasuon.or.kr", // 하드코딩된 도메인도 설정으로 이동
+  accessToken: process.env.NEXT_PUBLIC_ACCESS_TOKEN || "access-token",
+  refreshToken: process.env.NEXT_PUBLIC_REFRESH_TOKEN || "refresh-token",
+};
+```
+
+## 환경변수 설정
+
+각 앱의 `.env.local` 파일:
+
+```bash
+# CS 앱
+NEXT_PUBLIC_CLAIM_NAME=Authorization
+NEXT_PUBLIC_ACCESS_TOKEN=access-token
+NEXT_PUBLIC_REFRESH_TOKEN=refresh-token
+NEXT_PUBLIC_AUTH_USER_ID=token-id
+NEXT_PUBLIC_COOKIE_DOMAIN=.example.com
+
+# AS 앱 (다른 설정 사용 가능)
+NEXT_PUBLIC_AS_CLAIM_NAME=X-AS-Auth
+NEXT_PUBLIC_AS_ACCESS_TOKEN=as-access-token
+NEXT_PUBLIC_AS_REFRESH_TOKEN=as-refresh-token
+NEXT_PUBLIC_AS_AUTH_USER_ID=as-token-id
+NEXT_PUBLIC_AS_COOKIE_DOMAIN=.as.example.com
+```
+
+## 테스트 예시
+
+```typescript
+import { createTokenManager } from "@common/auth";
+import type { AuthConfig } from "@common/auth/types";
+
+describe("TokenManager", () => {
+  const mockConfig: AuthConfig = {
+    authUserId: "test-user-id",
+    claimName: "test-claim",
+    cookieDomain: ".test.com",
+    accessToken: "test-access",
+    refreshToken: "test-refresh",
+  };
+
+  it("should create token manager with config", () => {
+    const tokenManager = createTokenManager(mockConfig);
+    expect(tokenManager).toBeDefined();
+    expect(tokenManager.getToken).toBeDefined();
+  });
+
+  it("should use injected config", () => {
+    const tokenManager = createTokenManager(mockConfig);
+    // 테스트 로직...
+  });
+});
+```
+
+## 주의사항
+
+1. **환경변수는 빌드 타임에 주입됩니다**: `process.env.NEXT_PUBLIC_*` 값은 빌드 시점에 정적으로 치환됩니다.
+
+2. **쿠키 도메인 자동 감지**: `cookieDomain`을 설정하지 않으면 자동으로 현재 호스트명을 사용합니다.
+   - `localhost` / `127.0.0.1`: 도메인 설정 안 함
+   - 기타: 현재 호스트명 사용
+
+3. **HTTPS 자동 감지**: `secure` 옵션은 현재 프로토콜에 따라 자동 설정됩니다.
+
+4. **타이머 관리**: `setupRefreshTimer`는 이전 타이머를 자동으로 정리합니다.
+
+## 문제 해결
+
+### TypeScript 오류: "Cannot find module '@common/auth'"
+
+1. `pnpm install` 실행
+2. TypeScript 서버 재시작
+3. `tsconfig.json`의 `paths` 설정 확인
+
+### 쿠키가 저장되지 않음
+
+1. 브라우저 개발자 도구에서 쿠키 확인
+2. `cookieDomain` 설정 확인
+3. HTTPS 환경에서 `secure: true` 확인
+
+### 토큰이 다른 앱에서 공유되지 않음
+
+1. `cookieDomain` 설정이 공통 도메인(예: `.example.com`)인지 확인
+2. 각 앱의 토큰 키 이름이 다른지 확인 (충돌 방지)
+
+## 라이선스
+
+ISC
diff --git a/apps/dm_new/src/shared/lib/cookie.ts b/packages/common/auth/cookie.ts
similarity index 99%
rename from apps/dm_new/src/shared/lib/cookie.ts
rename to packages/common/auth/cookie.ts
index 48254bb18..8f5d0011b 100644
--- a/apps/dm_new/src/shared/lib/cookie.ts
+++ b/packages/common/auth/cookie.ts
@@ -1,6 +1,5 @@
 import Cookies from "js-cookie";
 
-
 export function getCookie(name: string): string | undefined {
   if (typeof window === "undefined") {
     return undefined;
diff --git a/packages/common/auth/index.ts b/packages/common/auth/index.ts
new file mode 100644
index 000000000..04fb01bb4
--- /dev/null
+++ b/packages/common/auth/index.ts
@@ -0,0 +1,7 @@
+export { createTokenManager } from "./token-manager";
+export type { TokenManager } from "./token-manager";
+
+export { getCookie, setCookie, removeCookie } from "./cookie";
+export { getJwtExpiry, getRemainingMs } from "./jwt-utils";
+
+export type { AuthConfig, CookieOptions } from "./types";
diff --git a/packages/common/auth/jwt-utils.ts b/packages/common/auth/jwt-utils.ts
new file mode 100644
index 000000000..05d2b0ff8
--- /dev/null
+++ b/packages/common/auth/jwt-utils.ts
@@ -0,0 +1,32 @@
+interface JwtPayload {
+  exp?: number;
+  [key: string]: unknown;
+}
+
+/**
+ * JWT 토큰의 exp 클레임(Unix timestamp, 초 단위)을 반환합니다.
+ * 파싱 실패 시 null을 반환합니다.
+ */
+export function getJwtExpiry(token: string): number | null {
+  try {
+    const base64Payload = token.split(".")[1];
+    if (!base64Payload) return null;
+
+    const payload = JSON.parse(atob(base64Payload)) as JwtPayload;
+    return typeof payload.exp === "number" ? payload.exp : null;
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * 토큰 만료 1분 전까지 남은 시간(ms)을 반환합니다.
+ * 이미 만료됐거나 파싱 실패 시 0을 반환합니다.
+ */
+export function getRemainingMs(token: string): number {
+  const exp = getJwtExpiry(token);
+  if (!exp) return 0;
+
+  const remainingMs = exp * 1000 - Date.now() - 60_000;
+  return Math.max(0, remainingMs);
+}
diff --git a/packages/common/auth/package.json b/packages/common/auth/package.json
new file mode 100644
index 000000000..4baa26d35
--- /dev/null
+++ b/packages/common/auth/package.json
@@ -0,0 +1,18 @@
+{
+  "name": "@common/auth",
+  "version": "1.0.0",
+  "private": true,
+  "main": "./index.ts",
+  "types": "./index.ts",
+  "exports": {
+    ".": "./index.ts"
+  },
+  "dependencies": {
+    "js-cookie": "^3.0.5"
+  },
+  "devDependencies": {
+    "@types/js-cookie": "^3.0.6",
+    "@types/node": "^22.13.1",
+    "typescript": "^5.7.2"
+  }
+}
diff --git a/packages/common/auth/token-manager.ts b/packages/common/auth/token-manager.ts
new file mode 100644
index 000000000..fed36c366
--- /dev/null
+++ b/packages/common/auth/token-manager.ts
@@ -0,0 +1,76 @@
+import { getCookie, removeCookie, setCookie } from "./cookie";
+import type { AuthConfig } from "./types";
+
+export function createTokenManager(config: AuthConfig) {
+  let refreshTimer: ReturnType<typeof setTimeout> | null = null;
+
+  const getCookieDomain = (): string | undefined => {
+    if (typeof window === "undefined") return undefined;
+
+    if (config.cookieDomain) return config.cookieDomain;
+
+    return undefined;
+  };
+
+  return {
+    getToken(key: string): string | undefined {
+      return getCookie(key);
+    },
+
+    setToken(key: string, value: string): void {
+      const domain = getCookieDomain();
+      const isHttps =
+        typeof window !== "undefined" && window.location.protocol === "https:";
+
+      setCookie(key, value, {
+        secure: isHttps,
+        sameSite: "lax",
+        domain,
+        path: "/",
+      });
+    },
+
+    removeToken(key: string): void {
+      const domain = getCookieDomain();
+      removeCookie(key, { domain, path: "/" });
+    },
+
+    setupRefreshTimer(callback: () => Promise<void>, delayMs: number): void {
+      if (refreshTimer) {
+        clearTimeout(refreshTimer);
+      }
+
+      refreshTimer = setTimeout(() => {
+        callback().catch((error) => {
+          console.error("Silent refresh timer callback failed:", error);
+        });
+      }, delayMs);
+    },
+
+    clearAuthToken(): void {
+      if (refreshTimer) {
+        clearTimeout(refreshTimer);
+        refreshTimer = null;
+      }
+
+      this.removeToken(config.claimName);
+      this.removeToken(config.authUserId);
+    },
+
+    getAccessToken(): string | undefined {
+      return this.getToken(config.claimName);
+    },
+
+    getRefreshToken(): string | undefined {
+      return config.refreshToken
+        ? this.getToken(config.refreshToken)
+        : undefined;
+    },
+
+    getUserId(): string | undefined {
+      return this.getToken(config.authUserId);
+    },
+  };
+}
+
+export type TokenManager = ReturnType<typeof createTokenManager>;
diff --git a/packages/common/auth/tsconfig.json b/packages/common/auth/tsconfig.json
new file mode 100644
index 000000000..04a0208c5
--- /dev/null
+++ b/packages/common/auth/tsconfig.json
@@ -0,0 +1,23 @@
+{
+  "$schema": "https://json.schemastore.org/tsconfig",
+  "extends": "../../../tsconfig.base.json",
+  "compilerOptions": {
+    "target": "ES2017",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "verbatimModuleSyntax": true,
+    "strictNullChecks": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true
+  },
+  "include": ["**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}
diff --git a/packages/common/auth/types.ts b/packages/common/auth/types.ts
new file mode 100644
index 000000000..077eb821f
--- /dev/null
+++ b/packages/common/auth/types.ts
@@ -0,0 +1,15 @@
+export interface AuthConfig {
+  authUserId: string;
+  claimName: string;
+  cookieDomain?: string;
+  accessToken?: string;
+  refreshToken?: string;
+}
+
+export interface CookieOptions {
+  secure?: boolean;
+  sameSite?: "strict" | "lax" | "none";
+  domain?: string;
+  path?: string;
+  expires?: number | Date;
+}
diff --git a/packages/common/business_components/src/ui/file-upload/index.tsx b/packages/common/business_components/src/ui/file-upload/index.tsx
index af63af7e7..6836691e2 100644
--- a/packages/common/business_components/src/ui/file-upload/index.tsx
+++ b/packages/common/business_components/src/ui/file-upload/index.tsx
@@ -1,6 +1,7 @@
 "use client";
 import { CloudUpload, Paperclip } from "lucide-react";
 import { FileInput, FileUploader, FileUploaderContent, FileUploaderItem } from "./lib/file_upload";
+
 const dropZoneConfig = {
     maxFiles: 5,
     maxSize: 1024 * 1024 * 100,
@@ -9,14 +10,19 @@ const dropZoneConfig = {
 
 
   interface FileUploadProps {
-    files: File[];             // 파일 배열
-    setFiles: (files: File[] | null) => void; // 파일 배열 세터
-    fileTypes?: string;        // 옵션 (파일 확장자 문자열)
-    onFileClick?:(index:number)=> void;
-    maxFiles?: number;          // 파일 클릭 핸들러
-    
+    files: File[]; // 화면에 표시할 현재 파일 목록
+    setFiles: (files: File[] | null) => void; // 추가/삭제 후 변경된 파일 목록을 부모에 전달
+    fileTypes?: string; // 허용할 확장자 문자열(ex: ".pdf,.jpg")
+    onFileClick?:(index:number)=> void; // 파일명 영역 클릭 시 현재 목록 기준 index 전달
+    maxFiles?: number; // 업로드 가능한 최대 파일 수
+     
   }
 
+/**
+ * 공통 파일 업로드 UI
+ * - 실제 파일 상태는 부모가 관리하고, 이 컴포넌트는 목록 표시/추가/삭제 이벤트만 위임한다.
+ * - 삭제 아이콘 클릭 시 FileUploader 내부에서 index 기준으로 파일을 제외한 배열을 만든 뒤 setFiles로 전달한다.
+ */
 export const FileUpload = 
 ({ files, setFiles, fileTypes ,onFileClick, maxFiles}: FileUploadProps) => {
     if(maxFiles){
@@ -51,6 +57,7 @@ export const FileUpload =
             {files&&
                 files.length > 0 &&
                 files.map((file:File, i:number) => (
+                // i는 현재 files 배열 순번이며, 삭제/클릭 이벤트에서 같은 순번값을 사용한다.
                 <FileUploaderItem key={i} index={i} onFileClick={onFileClick  }>
                     <Paperclip className="h-4 w-4 stroke-current" />
                     <span className="w-72 truncate">{file.name}</span>
@@ -59,4 +66,4 @@ export const FileUpload =
             </FileUploaderContent>
         </FileUploader>
     )
-}
\ No newline at end of file
+}
diff --git a/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx b/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx
index 030ddda95..9e47d296e 100644
--- a/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx
+++ b/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx
@@ -37,6 +37,7 @@ type FileUploaderContextType = {
 
 const FileUploaderContext = createContext<FileUploaderContextType | null>(null);
 
+// FileUploader 하위 컴포넌트들이 공통 상태와 핸들러를 사용할 수 있도록 context를 노출한다.
 export const useFileUpload = () => {
   const context = useContext(FileUploaderContext);
   if (!context) {
@@ -54,7 +55,10 @@ type FileUploaderProps = {
 };
 
 /**
- * File upload Docs: {@link: https://localhost:3000/docs/file-upload}
+ * 파일 업로드의 공통 동작을 담당하는 컨테이너 컴포넌트
+ * - 현재 파일 목록(value)을 기준으로 drag & drop / 선택 / 삭제를 처리한다.
+ * - 실제 파일 상태는 부모가 관리하며, 변경 결과는 onValueChange로만 전달한다.
+ * - FileInput, FileUploaderContent, FileUploaderItem은 이 context를 통해 같은 상태를 공유한다.
  */
 
 export const FileUploader = forwardRef<
@@ -80,7 +84,7 @@ export const FileUploader = forwardRef<
     const [isLOF, setIsLOF] = useState(false);
     const [activeIndex, setActiveIndex] = useState(-1);
 
-    // MIME 타입 매핑 함수 추가
+    // ".pdf,.jpg" 형태의 확장자 문자열을 react-dropzone accept 객체로 변환한다.
     const getAcceptObject = (fileTypes?: string): Record<string, string[]> => {
       if (!fileTypes) {
         return { "image/*": [".jpg", ".jpeg", ".png", ".gif"] };
@@ -131,6 +135,7 @@ export const FileUploader = forwardRef<
     const reSelectAll = maxFiles === 1 ? true : reSelect;
     const direction: DirectionOptions = dir === "rtl" ? "rtl" : "ltr";
 
+    // 현재 value 배열에서 index 위치 파일만 제외한 새 배열을 부모로 전달한다.
     const removeFileFromSet = useCallback(
       (i: number) => {
         if (!value) return;
@@ -140,6 +145,7 @@ export const FileUploader = forwardRef<
       [value, onValueChange],
     );
 
+    // 키보드로 파일 목록 탐색 및 삭제를 지원한다.
     const handleKeyDown = useCallback(
       (e: React.KeyboardEvent<HTMLDivElement>) => {
         e.preventDefault();
@@ -196,6 +202,7 @@ export const FileUploader = forwardRef<
       [value, activeIndex, removeFileFromSet],
     );
 
+    // 드롭/선택된 파일을 현재 목록과 합쳐서 부모 상태로 반영한다.
     const onDrop = useCallback(
       (acceptedFiles: File[], rejectedFiles: FileRejection[]) => {
         const files = acceptedFiles;
@@ -238,6 +245,7 @@ export const FileUploader = forwardRef<
       [reSelectAll, value],
     );
 
+    // 최대 파일 수에 도달하면 입력 영역을 비활성화한다.
     useEffect(() => {
       if (!value) return;
       if (value.length === maxFiles) {
@@ -247,6 +255,7 @@ export const FileUploader = forwardRef<
       setIsLOF(false);
     }, [value, maxFiles]);
 
+    // react-dropzone에 넘길 최종 옵션 구성
     const opts = dropzoneOptions
       ? { ...dropzoneOptions, accept: getAcceptObject(acceptName) }
       : { accept, maxFiles, maxSize, multiple };
@@ -311,7 +320,7 @@ export const FileUploaderContent = forwardRef<
         {...props}
         ref={ref}
         className={cn(
-          "w-full flex rounded-xl gap-1",
+          "w-full flex rounded-xl gap-0",
           orientation === "horizontal" ? "flex-raw flex-wrap" : "flex-col",
           className,
         )}
@@ -335,26 +344,31 @@ export const FileUploaderItem = forwardRef<
       ref={ref}
       className={cn(
         buttonVariants({ variant: "ghost" }),
-        "h-6 p-1 justify-between cursor-pointer relative w-full",
+        "h-9 justify-between cursor-pointer relative w-full",
         className,
         isSelected ? "bg-muted" : "",
       )}
       {...props}
    
     >
-      <div className="font-medium leading-none tracking-tight flex items-center gap-1.5 h-full !w-4/5 overflow-hidden "
+      <div className="font-medium leading-normal tracking-tight flex items-center gap-1.5 h-full !w-4/5 overflow-hidden "
          onClick={() =>{onFileClick?.(index)
              }}>
         {children}
       </div>
       <button
+        type="button"
         className={cn(
           "absolute",
           "!w-1/5 z-50",
-          direction === "rtl" ? "top-1 left-1" : "top-1 right-1",
+          direction === "rtl"
+            ? "left-1 top-1/2 -translate-y-1/2"
+            : "right-1 top-1/2 -translate-y-1/2",
           
         )}
-        onClick={() =>{
+        onClick={(e) =>{
+          e.preventDefault();
+          e.stopPropagation();
           removeFileFromSet(index)}}
       >
         <span className="sr-only">remove item {index}</span>
diff --git a/packages/common/components/package.json b/packages/common/components/package.json
index 3cef3b0f0..f3485aac2 100644
--- a/packages/common/components/package.json
+++ b/packages/common/components/package.json
@@ -13,7 +13,7 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.mjs",
+      "import": "./dist/index.js",
       "require": "./dist/index.js"
     },
     "./index.css": "./dist/index.css"
@@ -27,7 +27,9 @@
   },
   "dependencies": {
     "@common/assets": "workspace:*",
+    "@common/auth": "workspace:*",
     "@common/config": "workspace:*",
+    "@common/network": "workspace:*",
     "@frontend-opensource/use-react-hooks": "^1.1.4",
     "@minoru/react-dnd-treeview": "^3.5.0",
     "@radix-ui/react-accordion": "^1.2.3",
diff --git a/packages/common/components/src/ui/header/index.tsx b/packages/common/components/src/ui/header/index.tsx
index 69e2a7196..4f6c61c56 100644
--- a/packages/common/components/src/ui/header/index.tsx
+++ b/packages/common/components/src/ui/header/index.tsx
@@ -3,9 +3,10 @@ import "./header.css";
 import { useEffect, useCallback, useState, useRef } from "react";
 import { useQuery } from "@tanstack/react-query";
 import { images } from "@common/assets";
+import type { TokenManager } from "@common/auth";
 import { getConfig } from "@common/config";
 import { ENDPOINT } from "../../config";
-import { setCookie, getCookie, removeCookie } from "../../lib";
+import { setCookie, getCookie } from "../../lib";
 import {
   getPopupInfo,
   getUserPopupList,
@@ -28,7 +29,7 @@ const userId = getCookie(appConfig.AUTH_USER_ID ?? "");
 const siteId = getCookie("site-id-key") ?? "";
 const isLoggedIn = !!userId;
 
-export function Header({ viewOnly }: { viewOnly?: boolean }) {
+export function Header({ tokenManager, viewOnly }: { tokenManager?: TokenManager; viewOnly?: boolean }) {
   const [mounted, setMounted] = useState(false);
   const [logoWidth, setLogoWidth] = useState(0);
   const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
@@ -85,10 +86,10 @@ export function Header({ viewOnly }: { viewOnly?: boolean }) {
       clearClientCookies();
 
       // 3. 로컬/세션 스토리지 정리
-      if (typeof window !== "undefined") {
-        localStorage.clear();
-        sessionStorage.clear();
-      }
+      // if (typeof window !== "undefined") {
+      //   localStorage.clear();
+      //   sessionStorage.clear();
+      // }
 
       // 4. 로그인 페이지로 리다이렉트
       window.location.href = "/auth/login";
@@ -133,12 +134,8 @@ export function Header({ viewOnly }: { viewOnly?: boolean }) {
     cookiesToDelete.forEach((cookieName) => {
       if (!cookieName) return;
 
-      // 방법 1: removeCookie 함수 사용
-      if (domain === "localhost") {
-        removeCookie(cookieName, {});
-      } else {
-        removeCookie(cookieName, { domain });
-      }
+      // 방법 1: removeToken 함수 사용
+      tokenManager?.removeToken(cookieName);
 
       // 방법 2: 직접 document.cookie 설정 (도메인 포함)
       if (domain !== "localhost") {
diff --git a/packages/common/components/src/ui/input-date-picker/index.tsx b/packages/common/components/src/ui/input-date-picker/index.tsx
index 93d2caf7c..e5ec1eac3 100644
--- a/packages/common/components/src/ui/input-date-picker/index.tsx
+++ b/packages/common/components/src/ui/input-date-picker/index.tsx
@@ -12,7 +12,7 @@ import { Popover, PopoverContent, PopoverTrigger } from "../popover";
 import "./input-date-picker.css";
 
 export interface InputDatePickerProps {
-  value?: Date;
+  value?: Date | null;
   defaultValue?: Date;
   onChange?: (date: Date | undefined) => void;
   placeholder?: string;
@@ -34,7 +34,7 @@ export function InputDatePicker({
   const [internalDate, setInternalDate] = useState<Date | undefined>(
     defaultValue,
   );
-  const [month, setMonth] = useState<Date | undefined>(
+  const [month, setMonth] = useState<Date | null | undefined>(
     isControlled ? controlledValue : defaultValue,
   );
 
@@ -112,9 +112,9 @@ export function InputDatePicker({
           >
             <Calendar
               mode="single"
-              selected={date}
+              selected={date ?? undefined}
               captionLayout="dropdown"
-              month={month}
+              month={month ?? undefined}
               onMonthChange={setMonth}
               onSelect={(newDate) => {
                 handleDateChange(newDate);
diff --git a/packages/common/components/src/ui/layout/base.tsx b/packages/common/components/src/ui/layout/base.tsx
index e80a47533..d48b80196 100644
--- a/packages/common/components/src/ui/layout/base.tsx
+++ b/packages/common/components/src/ui/layout/base.tsx
@@ -1,3 +1,4 @@
+import type { TokenManager } from "@common/auth";
 import type { QueryClient } from "@tanstack/react-query";
 import { QueryProvider } from "../../provider/query-provider";
 import { PopupProvider } from "../../provider/popup-provider";
@@ -13,11 +14,13 @@ import "./common.css";
 export function BaseLayout({
   children,
   queryClient,
+  tokenManager,
   currentPath,
   handleMenuClick,
 }: {
   children: React.ReactNode;
   queryClient?: QueryClient;
+  tokenManager?: TokenManager;
   currentPath?: string;
   handleMenuClick?: (item: MenuItem) => void;
 }) {
@@ -28,7 +31,7 @@ export function BaseLayout({
           <HelpDialogProvider>
             <SidebarProvider>
             <div className="flex-1">
-              <Header />
+              <Header tokenManager={tokenManager} />
               <div className="flex">
                 <LNB
                   currentPath={currentPath}
diff --git a/packages/common/components/tsconfig.json b/packages/common/components/tsconfig.json
index 5db0dadbc..9fa9e88ee 100644
--- a/packages/common/components/tsconfig.json
+++ b/packages/common/components/tsconfig.json
@@ -14,9 +14,7 @@
     "strict": true,
     "baseUrl": ".",
     "paths": {
-      "@/*": ["src/*"],
-      "@common/config": ["../config/dist/"],
-      "@common/network": ["../network/"]
+      "@/*": ["src/*"]
     }
   },
   "exclude": ["**/node_modules", "**/.*/*", "dist"],
diff --git a/packages/rsone/package.json b/packages/rsone/package.json
index b5e7f6c3d..b7c5eab57 100644
--- a/packages/rsone/package.json
+++ b/packages/rsone/package.json
@@ -1,41 +1,41 @@
 {
-    "name": "@rsone/components",
-    "version": "1.0.0",
-    "private": true,
-    "sideEffects": false,
-    "type": "module",
-    "main": "./dist/index.js",
-    "module": "./dist/index.mjs",
-    "types": "./dist/index.d.ts",
-    "exports": {
-        ".": {
-            "types": "./dist/index.d.ts",
-            "import": "./dist/index.mjs",
-            "require": "./dist/index.js"
-        },
-        "./index.css": "./dist/index.css"
+  "name": "@rsone/components",
+  "version": "1.0.0",
+  "private": true,
+  "sideEffects": false,
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js"
     },
-    "files": [
-        "dist/**"
-    ],
-    "scripts": {
-        "build": "tsup",
-        "clean": "rm -rf dist"
-    },
-    "dependencies": {
-        "@common/components": "workspace:*",
-        "realgrid": "^2.9.5",
-        "realgrid-react": "^0.9.7",
-        "jszip": "^3.10.1",
-        "xlsx": "^0.18.5",
-        "zustand": "^5.0.3"
-    },
-    "peerDependencies": {
-        "react": "^19.2.1",
-        "react-dom": "^19.2.1"
-    },
-    "devDependencies": {
-        "tsup": "8.3.6",
-        "typescript": "~5.6.2"
-    }
-}
\ No newline at end of file
+    "./index.css": "./dist/index.css"
+  },
+  "files": [
+    "dist/**"
+  ],
+  "scripts": {
+    "build": "tsup",
+    "clean": "rm -rf dist"
+  },
+  "dependencies": {
+    "@common/components": "workspace:*",
+    "realgrid": "^2.9.5",
+    "realgrid-react": "^0.9.7",
+    "jszip": "^3.10.1",
+    "xlsx": "^0.18.5",
+    "zustand": "^5.0.3"
+  },
+  "peerDependencies": {
+    "react": "^19.2.1",
+    "react-dom": "^19.2.1"
+  },
+  "devDependencies": {
+    "tsup": "8.3.6",
+    "typescript": "~5.6.2"
+  }
+}