diff --git a/src/main/java/com/owrawww/domain/Careers.java b/src/main/java/com/owrawww/domain/Careers.java
index b91386d..32be231 100644
--- a/src/main/java/com/owrawww/domain/Careers.java
+++ b/src/main/java/com/owrawww/domain/Careers.java
@@ -49,5 +49,7 @@ public class Careers {
     private String fileName;   // 원본 파일명
     private String filePath;   // 저장 경로 (DB 기록용)
     private String fileType;   // MIME 타입 (예: application/pdf, image/jpeg 등)
+    private String telHash;    // SHA-256(솔트+tel) - 검색/중복체크용
+    private String emailHash;  // SHA-256(솔트+email) - 검색/중복체크용
 
 }
diff --git a/src/main/java/com/owrawww/service/CareersService.java b/src/main/java/com/owrawww/service/CareersService.java
index 43aeec1..d6ccd8f 100644
--- a/src/main/java/com/owrawww/service/CareersService.java
+++ b/src/main/java/com/owrawww/service/CareersService.java
@@ -32,7 +32,9 @@ public class CareersService {
         saved.setComment(careers.getContent());
         saved.setName(careers.getName());
         saved.setTel(aesUtil.encrypt(careers.getTel()));
+        saved.setTelHash(aesUtil.hash(careers.getTel()));
         saved.setEmail(aesUtil.encrypt(careers.getEmail()));
+        saved.setEmailHash(aesUtil.hash(careers.getEmail()));
         saved.setTopCode(2);
         saved.setLeftCode(1);
         saved.setSubGubun(1);
diff --git a/src/main/resources/mapper/CareersMapper.xml b/src/main/resources/mapper/CareersMapper.xml
index bc13e20..7b43c23 100644
--- a/src/main/resources/mapper/CareersMapper.xml
+++ b/src/main/resources/mapper/CareersMapper.xml
@@ -5,8 +5,8 @@
 <mapper namespace="com.owrawww.domain.mapper.CareersMapper">
 
     <insert id="insert" parameterType="com.owrawww.domain.Careers" useGeneratedKeys="true" keyProperty="id">
-        INSERT INTO application_table (code, title, name, type, phone, email, comment, depth, in_date, top_code, left_code, sub_gubun, solution_gubun, f_real_name, f_name, f_path, f_type)
-        VALUES (#{code}, #{title}, #{name}, #{dept}, #{tel}, #{email}, #{comment}, #{depth}, now(), #{topCode}, #{leftCode}, #{subGubun}, #{solutionGubun}, #{orgFileName}, #{fileName}, #{filePath}, #{fileType})
+        INSERT INTO application_table (code, title, name, type, phone, tel_hash, email, email_hash, comment, depth, in_date, top_code, left_code, sub_gubun, solution_gubun, f_real_name, f_name, f_path, f_type)
+        VALUES (#{code}, #{title}, #{name}, #{dept}, #{tel}, #{telHash}, #{email}, #{emailHash}, #{comment}, #{depth}, now(), #{topCode}, #{leftCode}, #{subGubun}, #{solutionGubun}, #{orgFileName}, #{fileName}, #{filePath}, #{fileType})
     </insert>
 
 </mapper>
diff --git a/src/main/resources/static/css/sub.css b/src/main/resources/static/css/sub.css
index 04490fb..9b89045 100644
--- a/src/main/resources/static/css/sub.css
+++ b/src/main/resources/static/css/sub.css
@@ -29,7 +29,7 @@
     background-repeat: no-repeat;
     background-position: center;
 }
-/* 페이지별 배경 이미지 */
+/* ?�이지�?배경 ?��?지 */
 .sub-bg.bg-company  { background: url('../img/sub/subtop_company.png')  center / cover no-repeat }
 .sub-bg.bg-vision   { background: url('../img/sub/subtop_vision.png') center / cover no-repeat }
 .sub-bg.bg-history  { background: url('../img/sub/subtop_history.png')       center / cover no-repeat }
@@ -266,7 +266,7 @@
 
 .sub_content .sub-h2 em { color: var(--primary); font-style: normal }
 
-/* 본문 설명 텍스트 */
+/* 본문 ?�명 ?�스??*/
 .sub_content .sub-desc-txt {
     font-size: clamp(1.6rem, calc(0.36vw + 1.23rem), 2rem);
     font-weight: 400;
@@ -282,9 +282,9 @@
 }
 .text-center { text-align: center }
 
-/* ══════════════════════════
-  텍스트 + 이미지 레이아웃 
-   ══════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+  ?�스??+ ?��?지 ?�이?�웃 
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .sub_content .sub-txt-img {
     display: flex;
     align-items: center;
@@ -308,9 +308,9 @@
     display: block;
 }
 
-/* ══════════════════════════
-   작은 타이틀 (dot_tit)
-   ══════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   ?��? ?�?��? (dot_tit)
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .dot-tit {
     display: inline-flex;
     align-items: center;
@@ -337,7 +337,7 @@
 }
 
 /* ==========================
- * 서브 사이드 레이아웃
+ * ?�브 ?�이???�이?�웃
  * ========================== */
 .sub-side-wrap {
     display: flex;
@@ -389,7 +389,7 @@
 }
 
 /* ==========================
- * 회사개요 — 마퀴
+ * ?�사개요 ??마�?
  * ========================== */
 .company-text { overflow: hidden; width: 100%; max-width: 100% }
 .company-text .marquee { --x: -3450px }
@@ -414,7 +414,7 @@
 }
 
 /* ==========================
- * 회사개요 — co-table
+ * ?�사개요 ??co-table
  * ========================== */
 .co-row { 
     display: flex; 
@@ -526,7 +526,7 @@
 }
 
 /* ==========================
- * 경영이념/비전 — 카드 그리드
+ * 경영?�념/비전 ??카드 그리??
  * ========================== */
 .vision-intro {
     text-align: center;
@@ -590,7 +590,7 @@
 }
 
 /* ==========================
- * 경영이념/비전 — 스크롤 슬라이드
+ * 경영?�념/비전 ???�크�??�라?�드
  * ========================== */
 .vision-scroll {
     position: relative;
@@ -698,7 +698,7 @@
 }
 
 /* ==========================
- * 회사 연혁
+ * ?�사 ?�혁
  * ========================== */
 
 .history-intro { padding: 0 0 clamp(20px, 7.5vw, 40px) }
@@ -809,7 +809,7 @@
     0%, 100% { transform: translateY(0) }
     50%       { transform: translateY(6px) }
 }
-/* 우측: 리스트 컬럼 */
+/* ?�측: 리스??컬럼 */
 .list-col {
     flex: 1;
     padding-top: 60px;
@@ -880,7 +880,7 @@
 }
 
 /* ==========================
- * 조직도
+ * 조직??
  * ========================== */
 .org-tree {
     display: flex;
@@ -960,7 +960,7 @@
 }
 .ceo-stem__top { width: 1px; height: 20px; background: var(--bd-color) }
 .ceo-stem__bot { width: 1px; height: 50px; background: var(--bd-color) }
-/* 경영지원 그룹 */
+/* 경영지??그룹 */
 .support-group {
     position: absolute;
     top: 30px;
@@ -986,7 +986,7 @@
     background: var(--bd-color);
     flex-shrink: 0;
 }
-/* 부서 컬럼 */
+/* 부??컬럼 */
 .depts-wrap {
     display: flex;
     align-items: flex-start;
@@ -1008,7 +1008,7 @@
 }
 .dept-col--center::before { width: 1px; background: var(--bd-color) }
 .dept-vdown { width: 1px; height: 50px; background: var(--bd-color); flex-shrink: 0 }
-/* 팀 컬럼 */
+/* ?� 컬럼 */
 .teams-wrap {
     position: relative;
     display: flex;
@@ -1061,9 +1061,9 @@
     .support-group::before { width: 18px }
 }
 /* ==========================
- * 찾아오는 길
+ * 찾아?�는 �?
  * ========================== */
-/* ── 본사주소 블록 ── */
+/* ?�?� 본사주소 블록 ?�?� */
 .loc-address {
     padding-top: clamp(50px, 6.25vw, 100px);
 }
@@ -1106,7 +1106,7 @@
     border-radius: 20px;
     overflow: hidden;
     border: 1px solid var(--bd-color);
-    line-height: 0; /* iframe 하단 여백 제거 */
+    line-height: 0; /* iframe ?�단 ?�백 ?�거 */
     height: clamp(260px, calc(15.63vw + 160px), 500px);
 }
 
@@ -1121,7 +1121,7 @@
     }
 }
 
-/* ── 하단 그리드: 교통 + 연락처 ── */
+/* ?�?� ?�단 그리?? 교통 + ?�락�??�?� */
 .loc-bottom-grid {
 	padding-top: clamp(25px, 6.25vw, 50px);
 	padding-bottom: clamp(50px, 6.25vw, 100px);
@@ -1130,7 +1130,7 @@
     gap: clamp(20px, 3.125vw, 50px);
     align-items: flex-start;
 }
-/* ── 대중교통 안내 ── */
+/* ?�?� ?�중교???�내 ?�?� */
 .loc-transport {
     display: flex;
     flex-direction: column;
@@ -1145,7 +1145,7 @@
 @media (hover: hover) {
     .transport-card:hover { border-color: var(--primary);}
 }
-/* 아이콘 영역 */
+/* ?�이�??�역 */
 .transport-icon {
     display: flex;
     flex-direction: column;
@@ -1167,7 +1167,7 @@
     font-weight: 700;
     color: var(--navy);
 }
-/* 노선 리스트 */
+/* ?�선 리스??*/
 .transport-routes {
     flex: 1;
     display: flex;
@@ -1181,7 +1181,7 @@
     gap: 12px;
     flex-wrap: nowrap;
 }
-/* 지하철 노선 뱃지 */
+/* 지?�철 ?�선 뱃�? */
 .subway-badge {
     flex-shrink: 0;
     display: inline-flex;
@@ -1196,7 +1196,7 @@
 }
 .subway-badge.line1 { background: #263C96; color: #fff; }
 .subway-badge.line7 { background: #697215; color: #fff; }
-/* 노선 설명 */
+/* ?�선 ?�명 */
 .route-desc {
     font-size: clamp(1.6rem, calc(0.27vw + 1.257rem), 1.7rem); /* 14px~17px */
     color: var(--cont1);
@@ -1209,7 +1209,7 @@
 .route-highlight2 {
     color: #697215;
 }
-/* ── 대표전화 ── */
+/* ?�?� ?�?�전???�?� */
 .loc-contact {
     display: flex;
     flex-direction: column;
@@ -1232,7 +1232,7 @@
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.04);
 }
-/* 전화번호 */
+/* ?�화번호 */
 .contact-tel-wrap {
     display: flex;
     align-items: center;
@@ -1253,14 +1253,14 @@
 @media (hover: hover) {
     .contact-tel-num:hover { color: var(--primary); }
 }
-/* 팩스 */
+/* ?�스 */
 .contact-fax {
     font-family: var(--e-font);
     font-size: clamp(1.5rem, calc(0.27vw + 1.457rem), 2rem);
 	color:var(--cont1);
 	padding-left:clamp(4rem, 1.875vw, 6rem); 
 }
-/* 운영시간 */
+/* ?�영?�간 */
 .contact-hours {
     display: flex;
     flex-direction: column;
@@ -1310,7 +1310,7 @@
     .btn-inquiry:hover .material-icons-round { transform: translateX(3px); }
 }
 
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1200px) {
     .loc-bottom-grid {
         grid-template-columns: 1fr 300px;
@@ -1359,7 +1359,7 @@
 }
  
 /* ==========================
- * 사업소개
+ * ?�업?�개
  * ========================== */
 .diagram-grid {
 	display: flex;
@@ -1441,16 +1441,16 @@
 }
 
 /* ==========================
- * 시스템 구성 공통
+ * ?�스??구성 공통
  * ========================== */
 
-/* 복수 행 쌓기 */
+/* 복수 ???�기 */
 .ib-rows {
   display: flex;
   flex-direction: column;
   gap: var(--row-gap);
 } 
-/* 열 그리드 */
+/* ??그리??*/
 .ib-grid--col1 { display: grid; grid-template-columns: 1fr;                      gap: var(--col-gap); align-items: stretch; }
 .ib-grid--col2 { display: grid; grid-template-columns: repeat(2,1fr);            gap: var(--col-gap); align-items: stretch; }
 .ib-grid--col3 { display: grid; grid-template-columns: repeat(3,1fr);            gap: var(--col-gap); align-items: stretch; }
@@ -1462,7 +1462,7 @@
 .ib-grid--col4 {
     margin-bottom:2rem;
 }
-/* 비율 그리드 */
+/* 비율 그리??*/
 .ib-grid--r2-1   { display: grid; grid-template-columns: 2fr 1fr;          gap: var(--col-gap); align-items: stretch; }
 .ib-grid--r1-2   { display: grid; grid-template-columns: 1fr 2fr;          gap: var(--col-gap); align-items: stretch; }
 .ib-grid--r3-1   { display: grid; grid-template-columns: 3fr 1fr;          gap: var(--col-gap); align-items: stretch; }
@@ -1480,20 +1480,20 @@
 .ib-grid--r1-2-1 {
     margin-bottom:2rem;
 }
- /* ════════════════════════════════════════
-   컬럼 래퍼  .ib-col
-   ─ 같은 열의 카드들을 세로로 쌓는 flex 컨테이너
-   ════════════════════════════════════════ */
+ /* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   컬럼 ?�퍼  .ib-col
+   ?� 같�? ?�의 카드?�을 ?�로�??�는 flex 컨테?�너
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ib-col {
   display: flex;
   flex-direction: column;
   gap: var(--card-gap);
 } 
-/* ════════════════════════════════════════
-   독립 카드  .ib-card
-   ─ 자체 border-radius, 자체 헤더
-   ─ flex-grow 로 높이 비율 제어
-   ════════════════════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   ?�립 카드  .ib-card
+   ?� ?�체 border-radius, ?�체 ?�더
+   ?� flex-grow �??�이 비율 ?�어
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ib-card {
   display: flex;
   flex-direction: column;
@@ -1502,12 +1502,12 @@
   overflow: hidden;
   min-height: 0;
 }
- /* grow 헬퍼 */
+ /* grow ?�퍼 */
 .ib-card--grow1 { flex-grow: 1; }
 .ib-card--grow2 { flex-grow: 2; }
 .ib-card--grow3 { flex-grow: 3; }
 .ib-card--grow4 { flex-grow: 4; }
- /* 카드 헤더 */
+ /* 카드 ?�더 */
 .ib-card__hd {
   background: var(--primary);
   color: #fff;
@@ -1531,7 +1531,7 @@
     gap: 5px;
     min-height: 0;
 }
- /* 카드 바디 내부 2열 */
+ /* 카드 바디 ?��? 2??*/
 .ib-card__bd--col2 {
   display: grid;
   grid-template-columns: 1fr 1fr;
@@ -1539,10 +1539,10 @@
   align-items: start;
 }
   
-/* ════════════════════════════════════════
-   서브카드  .ib-sub
-   ─ 카드 바디 안의 배경 박스
-   ════════════════════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   ?�브카드  .ib-sub
+   ?� 카드 바디 ?�의 배경 박스
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ib-sub {
   display: flex;
   flex-direction: column;
@@ -1570,9 +1570,9 @@
   gap: 4px;
 } 
  
-/* ════════════════════════════════════════
-   리스트
-   ════════════════════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   리스??
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ib-list {
     list-style: none;
     display: flex;
@@ -1599,7 +1599,7 @@
 	
 }
  
-/* 흰 박스 아이템 리스트 */
+/* ??박스 ?�이??리스??*/
 .ib-plain {
     list-style: none;
     display: flex;
@@ -1617,9 +1617,9 @@
     line-height: 1.4;
 } 
  
-/* ════════════════════════════════════════
-   반응형
-   ════════════════════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   반응??
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 @media (max-width: 1024px) {
     .ib-grid--col4,
     .ib-grid--r1-1-2,
@@ -1655,7 +1655,7 @@
 }
 
 /* ==========================
- * 시스템 구성 공통
+ * ?�스??구성 공통
  * ========================== */
  .mo-only { display: none; }
 
@@ -1695,13 +1695,13 @@
     white-space: nowrap;
     padding: 0 clamp(1rem, 2vw, 1rem);
 } 
-/* 활성화 */
+/* ?�성??*/
 .sub-tab__btn[aria-selected="true"],
 .sub-tab__btn.is-active {
     background: var(--navy);
     color: #fff;
 }
-/* 호버 */
+/* ?�버 */
 @media (hover: hover) {
     .sub-tab__btn:not([aria-selected="true"]):not(.is-active):hover {
         background: rgba(3, 43, 105, 0.07);
@@ -1709,9 +1709,9 @@
     }
 }
  
-/* ══════════════════════════
-   탭 패널 (이미지 + 텍스트)
-   ══════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   ???�널 (?��?지 + ?�스??
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .sub-tab__panels {
     margin-top: 5rem;
 } 
@@ -1753,9 +1753,9 @@
     min-width: 0;
 }
  
-/* ══════════════════════════
-   반응형
-   ══════════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   반응??
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 @media (max-width: 1200px) {
     .sub-tab__txt .sub-h2 {    
         white-space:inherit;
@@ -1803,9 +1803,9 @@
     }
 }
 
-/* ─────────────────────────────────────────
-   테이블 스크롤
-───────────────────────────────────────── */
+/* ?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�
+   ?�이�??�크�?
+?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?�?� */
 .tbl-scroll {
     width: 100%;
     overflow-x: auto;
@@ -1814,9 +1814,9 @@
 .tbl-scroll::-webkit-scrollbar { height: 5px }
 .tbl-scroll::-webkit-scrollbar-track { background: transparent }
 .tbl-scroll::-webkit-scrollbar-thumb { background: var(--bd-color); border-radius: 10px }
-/* ═══════════════════════════════════════════
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═??
    TABLE STYLE 1
-═══════════════════════════════════════════ */
+?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═??*/
 .tbl-gantt {
     width: 100%;
     min-width: 860px;
@@ -1882,9 +1882,9 @@
 .tbl-gantt tbody tr:hover td.td-label,
 .tbl-gantt tbody tr:hover td.td-dots { background-color: #f9f9f9; } 
  
-/* ═══════════════════════════════════════════
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═??
    TABLE STYLE 2
-═══════════════════════════════════════════ */
+?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═??*/
 .tbl-spec {
     width: 100%;
     min-width: 700px;
@@ -1943,9 +1943,9 @@
          padding:10px 15px;
      }
 }
-/* ═══════════════════════════════════════════
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═??
    Box List
-═══════════════════════════════════════════ */
+?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═??*/
 
 .split-list {
     display: grid;
@@ -2033,7 +2033,7 @@
     }
 }
 
-/* ===== SECTION: 인재상 ===== */
+/* ===== SECTION: ?�재??===== */
 .sec-talent {
     position: relative;
     width: 100%;
@@ -2042,7 +2042,7 @@
     background: url('../img/sub/bg-talent.png') center center / cover no-repeat;
 }
 
-/* 내부 wrap */
+/* ?��? wrap */
 .sec-talent .talent-inner {
   position: relative;
   z-index: 1;
@@ -2053,7 +2053,7 @@
   align-items: center;
 }
 
-/* ── 상단 장식 선 (스크롤다운 효과) ── */
+/* ?�?� ?�단 ?�식 ??(?�크롤다???�과) ?�?� */
 .talent-scroll-line {
   position: relative;
   width: 1px;
@@ -2078,7 +2078,7 @@
   100% { transform: translateY(80px);  opacity: 0 }
 }
 
-/* ── 타이틀 ── */
+/* ?�?� ?�?��? ?�?� */
 .talent-title {
   font-size: clamp(2.4rem, calc(1.25vw + 1.4rem), 3.4rem);
   font-weight: 700;
@@ -2092,20 +2092,20 @@
 .talent-title .point {
   color: var(--primary);
 }
-/* 中心 한자 강조 */
+/* �?�� ?�자 강조 */
 .talent-title .hanja {
   font-family: var(--e-font);
   color: var(--mint);
 }
 
-/* ── 카드 그리드 ── */
+/* ?�?� 카드 그리???�?� */
 .talent-cards {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 20px;
   width: 100%;
 }
-/* ── 개별 카드 ── */
+/* ?�?� 개별 카드 ?�?� */
 .talent-card {
   background: #fff;
   border-radius: 20px;
@@ -2125,7 +2125,7 @@
   }
 }
 
-/* 아이콘 영역 */
+/* ?�이�??�역 */
 .talent-card .card-icon {
   width: 105px;
   height: 105px;
@@ -2141,7 +2141,7 @@
   object-fit: contain;
 }
 
-/* 카드 제목 */
+/* 카드 ?�목 */
 .talent-card .card-title {
   font-size: clamp(1.8rem, calc(0.5vw + 1.35rem), 2.4rem);
   font-weight: 700;
@@ -2155,7 +2155,7 @@
 }
 
 
-/* 카드 설명 */
+/* 카드 ?�명 */
 .talent-card .card-desc {
   font-size: clamp(1.6rem, calc(0.25vw + 1.22rem), 1.8rem);
   font-weight: 400;
@@ -2164,7 +2164,7 @@
   word-break: keep-all;
 }
 
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1100px) {
   .talent-cards {
     grid-template-columns: repeat(2, 1fr);
@@ -2180,7 +2180,7 @@
 
 
 /* ==========================
- * 복리후생
+ * 복리?�생
  * ========================== */
 .welfare-wrap {
     border-top:    1px solid var(--bd-color);
@@ -2193,7 +2193,7 @@
 }
 .welfare-row--border {
     position: relative;
-    margin-bottom: 20px; /* 선 아래 → 다음 행 사이 간격 20px */
+    margin-bottom: 20px; /* ???�래 ???�음 ???�이 간격 20px */
 }
 .welfare-row--border::after {
     content: '';
@@ -2337,11 +2337,11 @@
     border-bottom:1px solid var(--bd-color);
 }
 
-/* 헤더 영역 */
+/* ?�더 ?�역 */
 .ri-head {
     flex-shrink: 0;
     width: clamp(100px, 15vw, 140px);
-    flex-direction: column;  /* 번호 위, 타이틀 아래 */
+    flex-direction: column;  /* 번호 ?? ?�?��? ?�래 */
     align-items: flex-start;
     gap: 0.6rem;
     border-bottom: none;
@@ -2359,7 +2359,7 @@
     letter-spacing: -0.02em;
 }
  
-/* 타이틀 */
+/* ?�?��? */
 .ri-title {
     font-size: clamp(1.8rem, calc(0.54vw + 1.5rem), 2.2rem);
     font-weight: 600;
@@ -2369,7 +2369,7 @@
     padding-top:10px;
 }
  
-/* 리스트 */
+/* 리스??*/
 .ri-list {
     margin-top:3rem;
     list-style: none;
@@ -2401,7 +2401,7 @@
     flex-shrink: 0;
 }
  
-/* 지원하기 버튼 */
+/* 지?�하�?버튼 */
 .ri-apply-wrap {
     margin-top: clamp(2rem, 2.5vw, 3.2rem);
 }
@@ -2438,7 +2438,7 @@
  
  
 /* ==============================
-   반응형
+   반응??
    ============================== */
 @media (max-width: 900px) {
     .recruit-info-grid {
@@ -2471,7 +2471,7 @@
     flex-wrap: nowrap;
 }
  
-/* 각 스텝 */
+/* �??�텝 */
 .rp-step {
     display: flex;
     flex-direction: column;
@@ -2481,7 +2481,7 @@
     min-width: 0;
 }
  
-/* 아이콘 카드 */
+/* ?�이�?카드 */
 .rp-card {
     width: clamp(16rem, calc(4.8vw + 58px), 16rem);
     height: clamp(16rem, calc(4.8vw + 58px), 16rem);
@@ -2505,7 +2505,7 @@
     justify-content: center;
 }
 
-/* 스텝 이름 */
+/* ?�텝 ?�름 */
 .rp-step-name {
     display: block;
     font-size: clamp(1.8rem, calc(0.36vw + 1.4rem), 2rem);
@@ -2516,7 +2516,7 @@
     word-break: keep-all;
 }
  
-/* 스텝 설명 */
+/* ?�텝 ?�명 */
 .rp-step-desc {
     font-size: clamp(1.5rem, calc(0.18vw + 1.2rem), 1.6rem);
     font-weight: 400;
@@ -2525,7 +2525,7 @@
     word-break: keep-all;
 }
  
-/* 화살표 */
+/* ?�살??*/
 .rp-arrow {
     flex-shrink: 0;
     display: flex;
@@ -2542,7 +2542,7 @@
 }
  
 /* ==============================
-   반응형
+   반응??
    ============================== */
 @media (max-width: 1024px) {
     .rp-flow {
@@ -2645,12 +2645,12 @@
     word-break: keep-all;
 }
 
-/* ── 폼 영역 ── */
+/* ?�?� ???�역 ?�?� */
 .inquiry-form {
     width: 100%;
 }
 
-/* ── 필드 그룹 ── */
+/* ?�?� ?�드 그룹 ?�?� */
 .form-row {
     display: grid;
     grid-template-columns: 1fr 1fr;
@@ -2668,7 +2668,7 @@
     gap: 10px;
 }
 
-/* ── 라벨 ── */
+/* ?�?� ?�벨 ?�?� */
 .form-label {
     font-size: 1.8rem;
     font-weight: 600;
@@ -2685,7 +2685,7 @@
     margin-top: -2px;
 }
 
-/* ── 입력 공통 ── */
+/* ?�?� ?�력 공통 ?�?� */
 .form-input,
 .form-select,
 .form-textarea {
@@ -2717,7 +2717,7 @@
     box-shadow: 0 0 0 3px rgba(19, 152, 248, 0.12);
 }
 
-/* ── 셀렉트 ── */
+/* ?�?� ?�?�트 ?�?� */
 .form-select-wrap {
     position: relative;
 }
@@ -2738,7 +2738,7 @@
     font-size: 2rem;
 }
 
-/* ── 파일 업로드 ── */
+/* ?�?� ?�일 ?�로???�?� */
 .form-file-wrap {
     position: relative;
     height: 54px;
@@ -2814,7 +2814,7 @@
     z-index: 2;
 }
 
-/* ── 텍스트에어리어 ── */
+/* ?�?� ?�스?�에?�리???�?� */
 .form-textarea {
     height: 180px;
     padding: 16px 18px;
@@ -2822,7 +2822,7 @@
     line-height: 1.7;
 }
 
-/* ── 개인정보 수집 이용 안내 ── */
+/* ?�?� 개인?�보 ?�집 ?�용 ?�내 ?�?� */
 .privacy-section {
     margin-top: 80px;
 }
@@ -2863,7 +2863,7 @@
     margin-bottom: 4px;
 }
 
-/* ── 동의 체크박스 ── */
+/* ?�?� ?�의 체크박스 ?�?� */
 .form-agree {
     display: flex;
     align-items: center;
@@ -2942,7 +2942,7 @@
     margin-left: 2px;
 }
 
-/* ── 제출 버튼 ── */
+/* ?�?� ?�출 버튼 ?�?� */
 .form-submit-wrap {
     margin-top: 50px;
     margin-bottom:200px;
@@ -2991,7 +2991,7 @@
     transform: translateX(4px);
 }
 
-/* ── 입력 오류 상태 ── */
+/* ?�?� ?�력 ?�류 ?�태 ?�?� */
 .form-input.is-error,
 .form-select.is-error,
 .form-textarea.is-error {
@@ -3009,7 +3009,7 @@
     display: block;
 }
 
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1024px) {
     .sec-recreuit .sub-h2 {
         padding-top:5rem;
@@ -3066,7 +3066,7 @@
 
  
 /* ==============================
-   PG등록
+   PG?�록
    ============================== */
 .evpg-sec-head {
     text-align: center;
@@ -3086,7 +3086,7 @@
     border-radius: 30px;
 }
  
-/* ── 요약 지표 카드 ── */
+/* ?�?� ?�약 지??카드 ?�?� */
 .evpg-summary {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
@@ -3121,7 +3121,7 @@
 .evpg-stat-label { font-size: 1.6rem; color: var(--cont2); margin-top: 8px; line-height: 1.5; word-break: keep-all }
 .evpg-stat-sub   { font-size: 1.4rem; color: var(--primary); font-weight: 600; margin-top: 6px }
  
-/* ── 체크 카드 ── */
+/* ?�?� 체크 카드 ?�?� */
 .evpg-check-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
@@ -3187,7 +3187,7 @@
     font-size: 1.2rem; font-weight: 600; color: var(--primary); margin-top: 14px;
 }
  
-/* ── 요건 박스 ── */
+/* ?�?� ?�건 박스 ?�?� */
 .evpg-req-grid {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
@@ -3228,7 +3228,7 @@
 }
 .evpg-note strong { color: var(--primary); font-weight: 700 }
  
-/* ── 장점 리스트 ── */
+/* ?�?� ?�점 리스???�?� */
 .evpg-adv-list { display: flex; flex-direction: column; gap: 16px }
 .evpg-adv-item {
     display: flex; align-items: flex-start; gap: 22px;
@@ -3253,7 +3253,7 @@
 }
 .evpg-adv-txt p { font-size: 1.5rem; color: var(--cont2); line-height: 1.7; word-break: keep-all }
  
-/* ── 레퍼런스 다크 섹션 ── */
+/* ?�?� ?�퍼?�스 ?�크 ?�션 ?�?� */
 .evpg-ref-wrap {
     background: var(--navy);
     padding: clamp(6rem,calc(6vw + 1rem),10rem) 0;
@@ -3293,7 +3293,7 @@
 .evpg-btn-outline svg,
 .btn-inquiry svg { width: 16px; height: 16px; flex-shrink: 0; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round }
  
-/* ── 문의 폼 ── */
+/* ?�?� 문의 ???�?� */
 .evpg-form-wrap { max-width: 860px; margin: 0 auto }
 .evpg-form-box {
     background: var(--bg); border: 1px solid var(--bd-color);
@@ -3333,7 +3333,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 .evpg-submit:hover { background: #0d7fd4; transform: translateY(-1px) }
 .evpg-submit:active { transform: translateY(0) }
  
-/* ── 스크롤 페이드업 ── */
+/* ?�?� ?�크�??�이?�업 ?�?� */
 .evpg-fade { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s ease }
 .evpg-fade.on { opacity: 1; transform: translateY(0) }
 .evpg-fade:nth-child(2) { transition-delay: .08s }
@@ -3342,7 +3342,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 .evpg-fade:nth-child(5) { transition-delay: .32s }
 .evpg-fade:nth-child(6) { transition-delay: .40s }
  
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1200px) {
     .split-box { flex-direction: column }
     .split-box__title { flex: none; padding: 28px 28px 0 }
@@ -3373,10 +3373,10 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 
 
 /* ==============================
-   other - 선정산서비스
+   other - ?�정?�서비스
    ============================== */
 
-/* ── 섹션 공통 헤더 ── */
+/* ?�?� ?�션 공통 ?�더 ?�?� */
 .ps-sec-head {
     text-align: center;
     margin-bottom: clamp(36px, 4.5vw, 60px);
@@ -3394,9 +3394,9 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-bottom: 14px;
 }
  
-/* ══════════════════════
-   SECTION 1 — 시스템 카드
-   ══════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   SECTION 1 ???�스??카드
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ps-sys-section {
     padding: clamp(6rem, calc(6vw + 1rem), 10rem) 0;
     background: #fff;
@@ -3486,9 +3486,9 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-top: 8px;
 }
  
-/* ══════════════════════
-   SECTION 2 — 이용 혜택
-   ══════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   SECTION 2 ???�용 ?�택
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ps-benefit-section {
     padding: clamp(6rem, calc(6vw + 1rem), 10rem) 0;
     background: var(--navy);
@@ -3549,9 +3549,9 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     word-break: keep-all;
 }
  
-/* ══════════════════════
-   SECTION 3 — 인터뷰
-   ══════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   SECTION 3 ???�터�?
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ps-review-section {
     padding: clamp(6rem, calc(6vw + 1rem), 10rem) 0;
     background: var(--bg);
@@ -3575,7 +3575,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     border-color: rgba(19,152,248,.25);
 }
  
-/* 말풍선 꼬리 */
+/* 말풍??꼬리 */
 .ps-review-card::after {
     content: '';
     position: absolute;
@@ -3631,7 +3631,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-top: 2px;
 }
  
-/* 인터뷰 섹션 헤더 intro */
+/* ?�터�??�션 ?�더 intro */
 .ps-review-intro {
     font-size: clamp(1.5rem, calc(.3vw + 1.3rem), 1.8rem);
     color: var(--cont2);
@@ -3641,9 +3641,9 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-top: clamp(10px, 1.2vw, 18px);
 }
  
-/* ══════════════════════
-   하단 버튼 4개
-   ══════════════════════ */
+/* ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═
+   ?�단 버튼 4�?
+   ?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═?�═ */
 .ps-cta-section {
     background: #fff;
     padding: clamp(5rem, calc(5vw + 1rem), 8rem) 0;
@@ -3701,7 +3701,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 }
 .ps-cta-btn:hover .ps-cta-label { color: #fff; }
  
-/* ── 스크롤 페이드업 ── */
+/* ?�?� ?�크�??�이?�업 ?�?� */
 .ps-fade { opacity: 0; transform: translateY(28px); transition: opacity .65s ease, transform .65s ease }
 .ps-fade.on { opacity: 1; transform: translateY(0) }
 .ps-fade:nth-child(2) { transition-delay: .08s }
@@ -3709,7 +3709,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 .ps-fade:nth-child(4) { transition-delay: .24s }
 .ps-fade:nth-child(5) { transition-delay: .32s }
  
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1200px) {
     .ps-sys-grid { grid-template-columns: repeat(2, 1fr); }
     .ps-benefit-grid { grid-template-columns: repeat(3, 1fr); }
@@ -3731,12 +3731,12 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 }
 
 
- /* ── 사이트맵  ── */
+ /* ?�?� ?�이?�맵  ?�?� */
 .smap-wrap {
     padding: clamp(60px, 8vw, 110px) 0 clamp(70px, 9vw, 120px);
 }
 
-/* 그리드: 4열 */
+/* 그리?? 4??*/
 .smap-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
@@ -3746,13 +3746,13 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     overflow: hidden;
 }
 
-/* 각 1depth 컬럼 */
+/* �?1depth 컬럼 */
 .smap-col {
     border-right: 1px solid var(--bd-color);
 }
 .smap-col:last-child { border-right: none }
 
-/* 1depth 헤더 */
+/* 1depth ?�더 */
 .smap-depth1 {
     display: flex;
     align-items: center;
@@ -3848,13 +3848,13 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     transform: translateX(3px);
 }
 
-/* 컬럼별 액센트 라인 */
+/* 컬럼�??�센???�인 */
 .smap-col:nth-child(1) .smap-depth1 { background: #032B69 }
 .smap-col:nth-child(2) .smap-depth1 { background: #053580 }
 .smap-col:nth-child(3) .smap-depth1 { background: #073f98 }
 .smap-col:nth-child(4) .smap-depth1 { background: #0949b0 }
 
-/* 하단 홈 링크 */
+/* ?�단 ??링크 */
 .smap-home-row {
     display: flex;
     align-items: center;
@@ -3888,7 +3888,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     transform: translateY(-2px);
 }
 
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1024px) {
     .smap-grid {
         grid-template-columns: repeat(2, 1fr);
@@ -3917,10 +3917,10 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
 }
 
 /* ==========================
- * 진행프로젝트 — 카드 그리드
+ * 진행?�로?�트 ??카드 그리??
  * ========================== */
  
-/* 패널 헤더 (제목 + 총 건수) */
+/* ?�널 ?�더 (?�목 + �?건수) */
 .pj-panel-head {
     display: flex;
     align-items: center;
@@ -3929,7 +3929,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-bottom: clamp(24px, 2.5vw, 36px);
     border-bottom: 1px solid var(--bd-color);
 }
-.pj-panel-head .dot-tit { padding-bottom: 0 } /* dot-tit 자체 padding 상쇄 */
+.pj-panel-head .dot-tit { padding-bottom: 0 } /* dot-tit ?�체 padding ?�쇄 */
 .pj-panel-count {
     font-size: 1.6rem;
     color: var(--cont2);
@@ -3943,7 +3943,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-right: 2px;
 }
  
-/* 카드 그리드 */
+/* 카드 그리??*/
 .pj-grid {
     display: grid;
     grid-template-columns: repeat(3, 1fr);
@@ -3984,7 +3984,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-bottom: 14px;
 }
 
-/* 상태 뱃지 */
+/* ?�태 뱃�? */
 .pj-badge {
     display: inline-flex;
     align-items: center;
@@ -4030,7 +4030,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     50%       { opacity: 0.2; }
 }
  
-/* 업체명 */
+/* ?�체�?*/
 .pj-card__company {
     font-size: clamp(1.6rem, calc(0.27vw + 1.35rem), 2rem);
     font-weight: 700;
@@ -4040,7 +4040,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     margin-bottom: 4px;
 }
  
-/* 업무 유형 */
+/* ?�무 ?�형 */
 .pj-card__type {
     font-size: 1.5rem;
     color: var(--cont2);
@@ -4050,7 +4050,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     word-break: keep-all;
 }
  
-/* 정보 목록 */
+/* ?�보 목록 */
 .pj-card__info {
     display: flex;
     flex-direction: column;
@@ -4059,7 +4059,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     padding: 0;
     margin: 0;
     margin-bottom:10px;
-    flex: 1; /* 카드 높이 균일하게 */
+    flex: 1; /* 카드 ?�이 균일?�게 */
 }
 .pj-card__info li {
     display: flex;
@@ -4082,7 +4082,7 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     white-space: nowrap;
 }
  
-/* 카드 하단 (날짜 + 링크) */
+/* 카드 ?�단 (?�짜 + 링크) */
 .pj-card__foot {
     display: flex;
     align-items: center;
@@ -4114,11 +4114,86 @@ textarea.evpg-ctrl { min-height: 130px; resize: vertical }
     flex-shrink: 0;
 }
  
-/* ── 반응형 ── */
+/* ?�?� 반응???�?� */
 @media (max-width: 1200px) {
     .pj-grid { grid-template-columns: repeat(2, 1fr); }
 }
 @media (max-width: 600px) {
     .pj-grid { grid-template-columns: 1fr; }
     .pj-panel-head { flex-direction: column; align-items: flex-start; gap: 8px; }
-}
\ No newline at end of file
+}
+/* =====================================================
+   ���� �Ϸ� ���
+   ===================================================== */
+#inquiryModal,
+#careersModal {
+    position: fixed;
+    inset: 0;
+    z-index: 9999;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.inquiry-modal__backdrop {
+    position: absolute;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.5);
+}
+
+.inquiry-modal__box {
+    position: relative;
+    z-index: 1;
+    background: #fff;
+    border-radius: 12px;
+    padding: 48px 40px 40px;
+    width: 100%;
+    max-width: 400px;
+    text-align: center;
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
+}
+
+.inquiry-modal__icon {
+    font-size: 56px;
+    color: #2e7d32;
+    display: block;
+    margin-bottom: 16px;
+}
+
+.inquiry-modal__title {
+    font-size: 22px;
+    font-weight: 700;
+    color: #111;
+    margin: 0 0 10px;
+}
+
+.inquiry-modal__desc {
+    font-size: 16px;
+    color: #555;
+    line-height: 1.7;
+    margin: 0 0 28px;
+}
+
+.inquiry-modal__close {
+    display: inline-block;
+    padding: 12px 40px;
+    background: #1a3c6e;
+    color: #fff;
+    border: none;
+    border-radius: 6px;
+    font-size: 16px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: background 0.2s;
+}
+
+.inquiry-modal__close:hover {
+    background: #14305a;
+}
+
+@media (max-width: 480px) {
+    .inquiry-modal__box {
+        margin: 0 16px;
+        padding: 36px 24px 28px;
+    }
+}
diff --git a/src/main/resources/templates/sub03_04.html b/src/main/resources/templates/sub03_04.html
index 414acaa..95b9bc7 100644
--- a/src/main/resources/templates/sub03_04.html
+++ b/src/main/resources/templates/sub03_04.html
@@ -313,8 +313,8 @@ $(document).ready(function () {
         const $err = $(rule.err);
         const val  = key === 'agree' ? '' : $el.val();
         const ok   = rule.check(val);
-        $el.toggleClass('is-invalid', !ok).toggleClass('is-valid', ok);
-        $err.toggleClass('visible', !ok);
+        $el.toggleClass('is-error', !ok);
+        $err.toggleClass('is-show', !ok);
         return ok;
     }
 
@@ -340,7 +340,7 @@ $(document).ready(function () {
         });
 
         if (!allOk) {
-            const $firstErr = $form.find('.is-invalid').first();
+            const $firstErr = $form.find('.is-error').first();
             if ($firstErr.length) {
                 $firstErr[0].focus();
                 $('html, body').animate({ scrollTop: $firstErr.offset().top - 120 }, 300);
@@ -405,7 +405,7 @@ $(document).ready(function () {
                 if (e.key === 'Escape' && $('#careersModal').is(':visible')) closeCareersModal();
             });
         }
-        $('#careersModal').fadeIn(200);
+        $('#careersModal').css('display', 'flex').hide().fadeIn(200);
         $('#careersModalClose').focus();
         $('body').css('overflow', 'hidden');
     }
@@ -414,8 +414,8 @@ $(document).ready(function () {
         $('#careersModal').fadeOut(200);
         $('body').css('overflow', '');
         $form[0].reset();
-        $form.find('.is-invalid, .is-valid').removeClass('is-invalid is-valid');
-        $form.find('.form-error-msg.visible').removeClass('visible');
+        $form.find('.is-error').removeClass('is-error');
+        $form.find('.form-error-msg.is-show').removeClass('is-show');
         if (fileName) {
             fileName.textContent = '파일을 선택해주세요. (이력서, 포트폴리오 등)';
             fileName.classList.remove('has-file');
diff --git a/src/main/resources/templates/sub04_02.html b/src/main/resources/templates/sub04_02.html
index 7afc0cc..257e810 100644
--- a/src/main/resources/templates/sub04_02.html
+++ b/src/main/resources/templates/sub04_02.html
@@ -247,8 +247,8 @@ $(document).ready(function () {
         const $err = $(rule.err);
         const val  = key === 'agree' ? '' : $el.val();
         const ok   = rule.check(val);
-        $el.toggleClass('is-invalid', !ok).toggleClass('is-valid', ok);
-        $err.toggleClass('visible', !ok);
+        $el.toggleClass('is-error', !ok);
+        $err.toggleClass('is-show', !ok);
         return ok;
     }
 
@@ -274,7 +274,7 @@ $(document).ready(function () {
         });
 
         if (!allOk) {
-            const $firstErr = $form.find('.is-invalid').first();
+            const $firstErr = $form.find('.is-error').first();
             if ($firstErr.length) {
                 $firstErr[0].focus();
                 $('html, body').animate({ scrollTop: $firstErr.offset().top - 120 }, 300);
@@ -327,7 +327,7 @@ $(document).ready(function () {
                 if (e.key === 'Escape' && $('#inquiryModal').is(':visible')) closeInquiryModal();
             });
         }
-        $('#inquiryModal').fadeIn(200);
+        $('#inquiryModal').css('display', 'flex').hide().fadeIn(200);
         $('#inquiryModalClose').focus();
         $('body').css('overflow', 'hidden');
     }
@@ -336,8 +336,8 @@ $(document).ready(function () {
         $('#inquiryModal').fadeOut(200);
         $('body').css('overflow', '');
         $form[0].reset();
-        $form.find('.is-invalid, .is-valid').removeClass('is-invalid is-valid');
-        $form.find('.form-error-msg.visible').removeClass('visible');
+        $form.find('.is-error').removeClass('is-error');
+        $form.find('.form-error-msg.is-show').removeClass('is-show');
     }
 
 });