정수빈 정수빈 03-17
문자고 디자인 변경
@afd070424ecbed17d16091813830125f1c358d84
src/main/webapp/WEB-INF/jsp/layout/include/defaultResource.jsp
--- src/main/webapp/WEB-INF/jsp/layout/include/defaultResource.jsp
+++ src/main/webapp/WEB-INF/jsp/layout/include/defaultResource.jsp
@@ -26,6 +26,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css?date=202301160002">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/WEB-INF/jsp/layout/popWebLayout.jsp
--- src/main/webapp/WEB-INF/jsp/layout/popWebLayout.jsp
+++ src/main/webapp/WEB-INF/jsp/layout/popWebLayout.jsp
@@ -9,12 +9,13 @@
 <head>
 	<meta charset="UTF-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <title>문자온</title>
+    <title>문자고</title>
 
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css?date=202301160001">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/WEB-INF/jsp/web/com/webCommonFooter.jsp
--- src/main/webapp/WEB-INF/jsp/web/com/webCommonFooter.jsp
+++ src/main/webapp/WEB-INF/jsp/web/com/webCommonFooter.jsp
@@ -36,20 +36,20 @@
     <div class="footer_body">
         <div class="inner table">
             <div class="table_cell">
-                <a href="/" class="footer_logo" rel="nosublink"><img src="/publish/images/CI_white.png" alt="문자온 CI"></a>
+                <a href="/" class="footer_logo" rel="nosublink"><img src="/publish/images/CI_gray.png" alt="문자고 CI"></a>
                 <div class="footer_info">
                     <p>주소 : (12248) 경기도 남양주시 다산순환로 20, A동 735호(다산동, 현대프리미어캠퍼스)  |  기업명 : 주식회사 아이티앤</p>
                     <p class="info_te">사업자번호 : 653-87-00858  |  대표 : 유인식  |  특수한 유형의 부가통신사업자 등록번호 : 제3-01-21-0054호  |  <br>통신판매등록번호 : 제2021-다산-0422호</p>
-                    <p>Copyright 2022 ⓒ MUNJAON co. Ltd, All rights reserved.</p>
+                    <p>Copyright 2026 ⓒ MUNJAGO co. Ltd, All rights reserved.</p>
                 </div>
                 <dl class="footer_service_center">
-                    <dt>고객센터</dt>
+                    <dt><img src="/publish/images/footer_serive_center.png" alt="" /></dt>
                     <dd>
                     	<p>1551-8011</p>
                     	<span>E-mail : help@iten.co.kr</span>
                     </dd>
                 </dl>
-                <img class="footer_mark" src="https://yeorcqadlpopsmgaoudu.supabase.co/storage/v1/object/public/certification/mark/6c10adc8-cf0c-474a-bcd9-5099a08612fd/61914a62-6ab1-4c4d-b2dd-88f0410234ed-2024-11-13T07:34:43.940Z" alt="대량문자 전송자격인증 마크" onclick="(function(){window.open('https://cleanspam.or.kr/ci/138','_blank','width=800, height=1151, toolbar=no, menubar=no, scrollbars=no, resizable=no')})()" />
+                <img class="footer_mark" src="/publish/images/footer_mark.png" alt="대량문자 전송자격인증 마크" onclick="(function(){window.open('https://cleanspam.or.kr/ci/138','_blank','width=800, height=1151, toolbar=no, menubar=no, scrollbars=no, resizable=no')})()" />
             </div>
         </div>
     </div>
src/main/webapp/WEB-INF/jsp/web/com/webCommonHeader.jsp
--- src/main/webapp/WEB-INF/jsp/web/com/webCommonHeader.jsp
+++ src/main/webapp/WEB-INF/jsp/web/com/webCommonHeader.jsp
@@ -1281,27 +1281,27 @@
                 </li>
                 -->
                 <li id="quickPayGuide">
-                    <a href="/web/mjon/custom/selectMsgCustomView.do" ><i class="quick4"></i><span>맞춤제작</span></a>
+                    <a href="/web/mjon/custom/selectMsgCustomView.do" ><i class="quick custom"></i><span>맞춤제작</span></a>
                     <div class="hover_cont">맞춤제작</div>
                 </li>
                 <li>
-                    <a href="/web/mjon/addr/selectAddrList.do" ><i class="quick10"></i><span>주소록 관리</span></a>
+                    <a href="/web/mjon/addr/selectAddrList.do" ><i class="quick address"></i><span>주소록 관리</span></a>
                     <div class="hover_cont">주소록 관리</div>
                 </li>
 				<li>
-                    <a href="/web/user/sendNumberManage.do"><i class="quick5"></i><span>발신번호 관리</span></a>
+                    <a href="/web/user/sendNumberManage.do"><i class="quick number"></i><span>발신번호 관리</span></a>
                     <div class="hover_cont">발신번호 관리</div>
                 </li>
                 <li>
-                    <a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do"><i class="quick6"></i><span>엑셀 대량전송</span></a>
+                    <a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do"><i class="quick excel"></i><span>엑셀 대량전송</span></a>
                     <div class="hover_cont">엑셀 대량전송</div>
                 </li>
                 <li>
-                    <a href="/web/api/intrdView.do" ><i class="quick7"></i><span>문자연동</span></a>
+                    <a href="/web/api/intrdView.do" ><i class="quick linkage"></i><span>문자연동</span></a>
                     <div class="hover_cont">문자연동</div>
                 </li>
                 <li>
-                    <a href="/web/member/pay/PayList.do" ><i class="quick8"></i><span>결제관리</span></a>
+                    <a href="/web/member/pay/PayList.do" ><i class="quick pay"></i><span>결제관리</span></a>
                     <div class="hover_cont">결제관리</div>
                 </li>
                 <!-- 
@@ -1311,11 +1311,11 @@
                 </li>
                  -->
                  <li>
-                    <a href="/web/member/pay/BillPub.do" ><i class="quick9"></i><span>세금계산서</span></a>
+                    <a href="/web/member/pay/BillPub.do" ><i class="quick tax"></i><span>세금계산서</span></a>
                     <div class="hover_cont">세금계산서</div>
                 </li>
                 <li class="cscenter">
-                    <a href="/web/cop/bbs/NoticeList.do" ><i class="quick11"></i><span>고객센터</span></a>
+                    <a href="/web/cop/bbs/NoticeList.do" ><i class="quick service_center"></i><span>고객센터</span></a>
                     <div class="hover_cont">
                     	<div class="title">고객센터</div>
                     	<div class="number">1551-8011</div>
@@ -1326,8 +1326,8 @@
                     		<li>· 토, 일요일 및 법정공휴일 휴무</li>
                     	</ul>
                     	<div class="cskakao">
-                    		<a href="http://pf.kakao.com/_PxoTtb/chat" class="kakao" target="_blank" >카톡 상담</a>
-                    		<a href="javascript:void(0);" class="remote" onclick="remotePop('https://939.co.kr/munjaon/');" >원격지원</a>
+                    		<a href="http://pf.kakao.com/_PxoTtb/chat" class="kakao" target="_blank" ><i class="circle kakao"></i>카톡 상담</a>
+                    		<a href="javascript:void(0);" class="remote" onclick="remotePop('https://939.co.kr/munjaon/');" ><i class="circle remote"></i>원격지원</a>
                     	</div>
                     </div>
                 </li>
@@ -1414,72 +1414,75 @@
         <!-- header body 영역 -->
         <div class="header_body">
             <div class="inner table">
-                <h1 class="logo"><a href="/web/main/mainPage.do" title="문자온 메인 바로가기">
-                <img src="/publish/images/CI.png" alt="단체문자 대량문자 발송 인터넷 웹문자 사이트 - 문자온">
+                <h1 class="logo"><a href="/web/main/mainPage.do" title="문자고 메인 바로가기">
+                <img src="/publish/images/CI.png" alt="단체문자 대량문자 발송 인터넷 웹문자 사이트 - 문자고">
 <!--                 ADVANCED 문자온 -->
-                </a></h1>
-                <ul class="gnbWrap table_cell">
-                	<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
-		           		<c:if test="${resultListOne.depth eq '1' }">
-						<c:choose>
-							<c:when test="${fn:contains(resultListOne.url, '/web/mjon/msgcampain/selectMsgDataView.do')}">
-								<c:if test="${userCandidateYn eq 'Y'}">
-									<li class="new">
-								</c:if>
-								<c:if test="${userCandidateYn eq 'N'}">
-									<%-- 후보자 정보가 없는 경우 메뉴를 보여주지 않는다. --%>
-									<li style="display:none;">
-								</c:if>
-							</c:when>																												
-							<c:otherwise>
-								<li>
-							</c:otherwise>
-						</c:choose>	                   			           		
+                </a>
+                </h1>
+                <div class="gnb_right">
+	                <ul class="gnbWrap table_cell">
+	                	<c:forEach var="resultListOne" items="${menuResultList}" varStatus="status">
+			           		<c:if test="${resultListOne.depth eq '1' }">
 							<c:choose>
 								<c:when test="${fn:contains(resultListOne.url, '/web/mjon/msgcampain/selectMsgDataView.do')}">
 									<c:if test="${userCandidateYn eq 'Y'}">
-										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+										<li class="new">
 									</c:if>
-								</c:when>
-								<c:when test="${fn:contains(resultListOne.url, '/web/mjon/alimtalk/kakaoAlimtalkMsgDataView.do')}">
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
-								</c:when>
-								<c:when test="${fn:contains(resultListOne.url, '/web/mjon/fax/faxDataView.do')}">
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
-								</c:when>																
-								<c:when test="${fn:contains(resultListOne.url, '/web/mjon/custom/selectMsgCustomView.do')}">
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
-								</c:when>
-								<c:when test="${fn:contains(resultListOne.url, '/web/mjon/addr/selectAddrList.do')}">
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
-								</c:when>
-								<c:when test="${fn:contains(resultListOne.url, '/web/mjon/reservmsg/selectReservMsgView.do')}">
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
-								</c:when>
-								<c:when test="${fn:contains(resultListOne.url, '/web/member/pay/PayList.do')}">
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
-								</c:when>
+									<c:if test="${userCandidateYn eq 'N'}">
+										<%-- 후보자 정보가 없는 경우 메뉴를 보여주지 않는다. --%>
+										<li style="display:none;">
+									</c:if>
+								</c:when>																												
 								<c:otherwise>
-									<a href="${empty resultListOne.url ? '#' : resultListOne.url }">${resultListOne.menuNm}</a>
+									<li>
 								</c:otherwise>
-							</c:choose>	                   	
-		           			<div class="depth2">
-		           				<ul class="subMenu">
-		           			<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status"> 
-								<c:if test="${resultListTwo.depth eq '2' && resultListOne.menuNo  eq resultListTwo.upperMenuId }">
-									<li><a href="${empty resultListTwo.url ? '#' : resultListTwo.url }" ${resultListTwo.menuType eq 'O' ? 'target="_blank"' : ""} >${resultListTwo.menuNm}<c:if test="${resultListTwo.menuType eq 'O' }"><i class="link"></i></c:if></a></li>
-								</c:if>
-							</c:forEach>	
-		           				</ul>
-		           			</div>
-		           		</li>	
-		           		</c:if>
-	           		</c:forEach>
-                </ul>
-                <div class="s_menu">
-                    <i class="allSearch_info"><span>문자검색</span></i>
-                    <button type="button" title="전체검색" class="allSearch" onclick="searchToggle();"><img src="/publish/images/search.png" alt="검색영역 열기" class="allMenu"></button>
-                    <button type="button" title="전체메뉴" class="allSitemap" onclick="sitemapToggle(this);"></button>
+							</c:choose>	                   			           		
+								<c:choose>
+									<c:when test="${fn:contains(resultListOne.url, '/web/mjon/msgcampain/selectMsgDataView.do')}">
+										<c:if test="${userCandidateYn eq 'Y'}">
+											<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+										</c:if>
+									</c:when>
+									<c:when test="${fn:contains(resultListOne.url, '/web/mjon/alimtalk/kakaoAlimtalkMsgDataView.do')}">
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+									</c:when>
+									<c:when test="${fn:contains(resultListOne.url, '/web/mjon/fax/faxDataView.do')}">
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+									</c:when>																
+									<c:when test="${fn:contains(resultListOne.url, '/web/mjon/custom/selectMsgCustomView.do')}">
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+									</c:when>
+									<c:when test="${fn:contains(resultListOne.url, '/web/mjon/addr/selectAddrList.do')}">
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+									</c:when>
+									<c:when test="${fn:contains(resultListOne.url, '/web/mjon/reservmsg/selectReservMsgView.do')}">
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+									</c:when>
+									<c:when test="${fn:contains(resultListOne.url, '/web/member/pay/PayList.do')}">
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }" >${resultListOne.menuNm}</a>
+									</c:when>
+									<c:otherwise>
+										<a href="${empty resultListOne.url ? '#' : resultListOne.url }">${resultListOne.menuNm}</a>
+									</c:otherwise>
+								</c:choose>	                   	
+			           			<div class="depth2">
+			           				<ul class="subMenu">
+			           			<c:forEach var="resultListTwo" items="${menuResultList}" varStatus="status"> 
+									<c:if test="${resultListTwo.depth eq '2' && resultListOne.menuNo  eq resultListTwo.upperMenuId }">
+										<li><a href="${empty resultListTwo.url ? '#' : resultListTwo.url }" ${resultListTwo.menuType eq 'O' ? 'target="_blank"' : ""} >${resultListTwo.menuNm}<c:if test="${resultListTwo.menuType eq 'O' }"><i class="link"></i></c:if></a></li>
+									</c:if>
+								</c:forEach>	
+			           				</ul>
+			           			</div>
+			           		</li>	
+			           		</c:if>
+		           		</c:forEach>
+	                </ul>
+	                <div class="s_menu">
+	                    <i class="allSearch_info"><span>문자검색</span></i>
+	                    <button type="button" title="전체검색" class="allSearch" onclick="searchToggle();"><img src="/publish/images/search.png" alt="검색영역 열기" class="allMenu"></button>
+	                    <button type="button" title="전체메뉴" class="allSitemap" onclick="sitemapToggle(this);"></button>
+	                </div>
                 </div>
             </div>
             <!-- search popup 영역 -->
@@ -1720,7 +1723,7 @@
 <!-- 		                        <input type="password" placeholder="비밀번호를 입력해주세요"   id="password_text" class="password_text" maxlength="30"size="18" onkeypress="if(event.keyCode==13) {actionLogin(); return false;}" onclick="actionLogin();"> -->
 		                        <input type="password" placeholder="비밀번호를 입력해주세요"   id="password_text" class="password_text" maxlength="30"size="18" onkeypress="if(event.keyCode==13) {actionLogin(); return false;}">
 		                        <label for="login_button" class="label"></label>
-		                        <button type="button" id="login_button" class="btnType btnType1" class="login_button" onclick="actionLogin();">로그인</button>
+		                        <button type="button" id="login_button" class="btnType btnType2 login_button" onclick="actionLogin();">로그인</button>
 		                    </div>
 		                    <div class="login_save">
 		                        <input type="checkbox" id="save_id" name="checkId">
@@ -1732,13 +1735,13 @@
 		                        <a href="<c:url value='/web/user/rePassword.do'/>" >비밀번호 재설정</a>
 		                    </div>
 		                    <div>
-		                        <button type="button" class="btnType btnType2" onclick="location.href='/web/user/login/selectUserDept.do'">회원가입</button>
+		                        <button type="button" class="btnType btnType1" onclick="location.href='/web/user/login/selectUserDept.do'">회원가입</button>
 <!-- 		                        <button type="button" class="btnType btnType3">둘러보기</button> -->
 		                    </div>
 		                </div>
 		                <div class="login_right">
-		                    <span><i></i>이달의 이벤트</span>
-		                    <button type="button" class="btnType btnType2" onclick="location.href='/web/cop/bbs/EventList.do'">GO</button>
+		                    <!-- <span><i></i>이달의 이벤트</span>
+		                    <button type="button" class="btnType btnType2" onclick="location.href='/web/cop/bbs/EventList.do'">GO</button> -->
 		                </div>
 		            </div>
 		        </div><!--// login 영역 -->
@@ -1753,7 +1756,6 @@
 		                    	<input type="hidden" id="loginId" name="loginId" value="${LoginVO.id}">
 								<!-- <i><img src="/publish/images/mypageIcon2.png" id="commonHeaderGradeIcon" /></i> -->
 								<div class="login2_name" onclick="location.href='/web/user/mberInfoChange.do'" style="cursor:pointer;">
-									<i class="icon_user"></i>
 		                        	<p><c:out value="${LoginVO.name}"/></p>
 		                        	<c:choose>
 		                        		<c:when test="${LoginVO.dept == 'p'}">
@@ -1774,7 +1776,7 @@
 									</a>	 -->
 		                        </div>
 		                        <!-- <button type="button" class="btnType btnType3" onclick="location.href='/web/user/mberInfoIndex.do'">마이페이지</button> -->
-		                        <button type="button" class="btnType btn_36 fill_gray" onclick="location.href='/web/uat/uia/actionLogout.do'">로그아웃</button>
+		                        <button type="button" class="btnType btnType1" onclick="location.href='/web/uat/uia/actionLogout.do'">로그아웃</button>
 		                        
 								
 								<div class="security_box">
@@ -1787,7 +1789,6 @@
 		                    <div class="login_pay">
 			                    <div class="check_money">
 									<div class="holdingsum_box">
-										<i></i>
 										<div class="user_money_wrap">
 											보유잔액
 											<div class="hover_content_wrap">
@@ -1857,22 +1858,26 @@
 												</div>
 											</div>
 										<fmt:formatNumber type="number" maxFractionDigits="3" value="${userMoney}" var="commaPrice" />
-										<span class="fwMd" id="hdUserMoney"><c:out value="${commaPrice}"/></span>원
+										<span class="sub_font" id="hdUserMoney"><c:out value="${commaPrice}"/></span>원
 									</	>
 									</div>
-			                        <button type="button" class="btnType btnType3" onclick="location.href='/web/member/pay/PayView.do'">충전</button>
+			                        <button type="button" class="btnType btnType1" onclick="location.href='/web/member/pay/PayView.do'">충전</button>
 			                    </div>
 		                    </div>
-		                    <div class="point">
+		                    
+		                    
+		                    <%-- <div class="point">
 								<i></i>
 								<fmt:formatNumber type="number" maxFractionDigits="3" value="${userPoint}" var="commaPoint" />
 		                        <p><!-- <em>적립</em> -->포인트 <span class="fwMd"><c:out value="${commaPoint}"/></span>원</p>
 		                        <button type="button" data-tooltip="popup04" class="btnType btnType3">교환</button>
-		                    </div>
+		                    </div> --%>
 		                  <!--   <div class="event">
 		                	    <span><i></i>이달의 이벤트</span>
 	                    		<button type="button" class="btnType btnType2" onclick="location.href='/web/cop/bbs/EventList.do'">GO</button>
 		                    </div> -->
+		                    
+		                    
 		                </div>
 		                <!-- <div class="login_right">
 		                    <button type="button" data-tooltip="popupJunk" class="btnType btnType14 tab1"><i></i>통신사 스팸규격안내</button>
src/main/webapp/WEB-INF/jsp/web/com/webLayout.jsp
--- src/main/webapp/WEB-INF/jsp/web/com/webLayout.jsp
+++ src/main/webapp/WEB-INF/jsp/web/com/webLayout.jsp
@@ -9,11 +9,11 @@
 	    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 	    
 <c:if test="${empty metaTagVo }">
-            <title>문자온 인터넷 웹문자 단체문자 대량문자발송 사이트</title>
+            <title>문자고 인터넷 웹문자 단체문자 대량문자발송 사이트</title>
             <meta name="Keywords" content="문자사이트, 대량문자, 단체문자, 문자발송, 문자전송, 인터넷문자, 단체문자사이트, 대량문자발송, 문자보내기, 단체문자발송">
             <meta name="description" content="LMS문자,MMS문자,WEB발신,인터넷,컴퓨터로 문자메세지보내기,웹발신문자,문자서비스,대량문자전송,단체문자보내기">
             <meta property="og:type" content="website">
-            <meta property="og:title" content="문자온">
+            <meta property="og:title" content="문자고">
             <meta property="og:description" content="LMS문자,MMS문자,WEB발신,인터넷,컴퓨터로 문자메세지보내기,웹발신문자,문자서비스,대량문자전송,단체문자보내기">
 </c:if>
 <c:if test="${!empty metaTagVo }">
src/main/webapp/WEB-INF/jsp/web/cop/bbs/SuggestList.jsp
--- src/main/webapp/WEB-INF/jsp/web/cop/bbs/SuggestList.jsp
+++ src/main/webapp/WEB-INF/jsp/web/cop/bbs/SuggestList.jsp
@@ -133,7 +133,7 @@
                         <h2>불편신고</h2>
                     </div>
                     <div class="titBox">
-						<p>- 문자온 서비스 이용 관련 불편사항이나 기능 개선사항, 기타 건의사항 등을 올려주시면 신속하게 개선 및 보완하겠습니다.</p>
+						<p>- 문자고 서비스 이용 관련 불편사항이나 기능 개선사항, 기타 건의사항 등을 올려주시면 신속하게 개선 및 보완하겠습니다.</p>
 					</div>
                     <div>
                     <form name="searchForm" id="searchForm">
src/main/webapp/WEB-INF/jsp/web/custom/MsgCustomVeiwPopupAjax.jsp
--- src/main/webapp/WEB-INF/jsp/web/custom/MsgCustomVeiwPopupAjax.jsp
+++ src/main/webapp/WEB-INF/jsp/web/custom/MsgCustomVeiwPopupAjax.jsp
@@ -93,7 +93,7 @@
 				
 				// 제작형태
 				if(customList[i].customType == "01"){
-					htmlTemp2 = "문자온 샘플 수정(글자, 색상, 폰트 등)";
+					htmlTemp2 = "문자고 샘플 수정(글자, 색상, 폰트 등)";
 				}else if(customList[i].customType == "02"){
 					htmlTemp2 = "이미지 편집(첨부 이미지 1장)";
 				}else if(customList[i].customType == "03"){
src/main/webapp/WEB-INF/jsp/web/custom/MsgCustomView.jsp
--- src/main/webapp/WEB-INF/jsp/web/custom/MsgCustomView.jsp
+++ src/main/webapp/WEB-INF/jsp/web/custom/MsgCustomView.jsp
@@ -354,7 +354,7 @@
 						</thead>
 						<tbody>
 							<tr>
-								<td>문자온 샘플 수정(글자, 색상, 폰트 등)</td>
+								<td>문자고 샘플 수정(글자, 색상, 폰트 등)</td>
 								<td>문자/카톡</td>
 								<td>${customSamplePrice}원</td>
 								<td>내보관함/카톡/이메일</td>
@@ -409,7 +409,7 @@
 						<ol>
 							<li>
 								<div class="step">STEP <strong>01</strong></div>
-								<div class="text">문자온 문자 샘플 목록에서<br><strong>원하는 이미지 선택</strong></div>
+								<div class="text">문자고 문자 샘플 목록에서<br><strong>원하는 이미지 선택</strong></div>
 							</li>
 							<li>
 								<div class="step">STEP <strong>02</strong></div>
src/main/webapp/WEB-INF/jsp/web/custom/MsgMyCustomListAjax.jsp
--- src/main/webapp/WEB-INF/jsp/web/custom/MsgMyCustomListAjax.jsp
+++ src/main/webapp/WEB-INF/jsp/web/custom/MsgMyCustomListAjax.jsp
@@ -79,32 +79,33 @@
 						<c:set var="strImgPath" value="${customList.fileStreCours}/${customList.streFileNm}.${customList.fileExtsn}"/>
 						<div class="photo_preview">
 							<div class="tit_text_wrap">
-								<input type="checkbox" name="myImgCheck" value="${customList.attachFileId}|${customList.fileSn}">
-								<c:choose>
-									<c:when test="${customList.customType eq '01'}">문자온 샘플 수정</c:when>
-									<c:when test="${customList.customType eq '02'}">이미지 편집</c:when>
-									<c:when test="${customList.customType eq '03'}">이미지 편집</c:when>
-									<c:when test="${customList.customType eq '04'}">텍스트 단순수정</c:when>
-								</c:choose>
-								
+								<div class="title">
+									<input type="checkbox" name="myImgCheck" value="${customList.attachFileId}|${customList.fileSn}">
+									<c:choose>
+										<c:when test="${customList.customType eq '01'}">문자고 샘플 수정</c:when>
+										<c:when test="${customList.customType eq '02'}">이미지 편집</c:when>
+										<c:when test="${customList.customType eq '03'}">이미지 편집</c:when>
+										<c:when test="${customList.customType eq '04'}">텍스트 단순수정</c:when>
+									</c:choose>
+								</div>
 								<c:choose>
 									<c:when test="${customList.customPaymentYn eq '01'}">
-										<span class="step1">제작대기중</span>
+										<span class="status fill primary">제작대기중</span>
 									</c:when>
 									<c:when test="${customList.customPaymentYn eq '02'}">
-										<span class="step2">제작중</span>
+										<span class="status line primary">제작중</span>
 									</c:when>
 									<c:when test="${customList.customPaymentYn eq '03'}">
-										<span class="step1">수정요청</span>
+										<span class="status fill secondary">수정요청</span>
 									</c:when>
 									<c:when test="${customList.customPaymentYn eq '04'}">
-										<span class="step2">수정중</span>
+										<span class="status line primary">수정중</span>
 									</c:when>
 									<c:when test="${customList.customPaymentYn eq '05'}">
-										<span class="step3">제작완료</span>
+										<span class="status fill gray">제작완료</span>
 									</c:when>
 									<c:when test="${customList.customPaymentYn eq '06'}">
-										<span class="step3">제작취소</span>
+										<span class="status fill gray">제작취소</span>
 									</c:when>
 								</c:choose>
 							</div>
@@ -143,27 +144,33 @@
 								</c:otherwise>
 							</c:choose>
 						</div>
-						<div class="myphoto_info">
-							<p>등록일 : <span><c:out value="${customList.frstRegistPnttm}"/></span></p>
-							<p>이미지 코드 : <span>custom_${status.index}</span></p>
+						<div class="myphoto_info form_wrap">
+							<div class="left form_wrap column">
+								<p>등록일 : <span><c:out value="${customList.frstRegistPnttm}"/></span></p>
+								<p>이미지 코드 : <span>custom_${status.index}</span></p>
+							</div>
+							<div class="right form_wrap column">
+								<c:choose>
+									<c:when test="${customList.customPaymentYn eq '01' || customList.customPaymentYn eq '02'}">
+										<button type="button" class="modify_btn w100" onclick='selectMyCustomImg("${customList.customGroupId}","${customList.customChoiceImg}","${customList.customChoiceImgFileSn}");'>수정</button>
+									</c:when>
+									<c:when test="${customList.customPaymentYn eq '03' || customList.customPaymentYn eq '04'}">
+										<button type="button" class="modify_btn w100" onclick='selectMyCustomImg("${customList.customGroupId}","${customList.customChoiceImg}","${customList.customChoiceImgFileSn}");'>수정</button>
+									</c:when>
+									<c:otherwise>
+										<button type="button" class="modify_btn w100" onclick='selectMyCustomImg("${customList.customGroupId}","${customList.customResultImg}","0");'>수정</button>
+									</c:otherwise>
+								</c:choose>
+								
+								<button type="button" class="detail_btn w100" onclick='selectMyCustomDetail("${customList.customGroupId}");'>상세보기</button>
+								<input type="hidden" id="${status.index}_imgPath"  value="${strImgPath}">
+								<input type="hidden" id="${status.index}_fileId"  value="${customList.attachFileId}">
+								<input type="hidden" id="${status.index}_fileSn"  value="${customList.fileSn}">
+								<input type="hidden" id="customPopupDetailOpen" data-tooltip="customVeiw01" style="position: absolute;overflow: hidden;left: 0;top: 0;width: 0;height: 0;margin: 0;padding: 0;text-indent: -99999px;">
+							</div>
 							
-							<c:choose>
-								<c:when test="${customList.customPaymentYn eq '01' || customList.customPaymentYn eq '02'}">
-									<button type="button" class="modify_btn" onclick='selectMyCustomImg("${customList.customGroupId}","${customList.customChoiceImg}","${customList.customChoiceImgFileSn}");'>수정</button>
-								</c:when>
-								<c:when test="${customList.customPaymentYn eq '03' || customList.customPaymentYn eq '04'}">
-									<button type="button" class="modify_btn" onclick='selectMyCustomImg("${customList.customGroupId}","${customList.customChoiceImg}","${customList.customChoiceImgFileSn}");'>수정</button>
-								</c:when>
-								<c:otherwise>
-									<button type="button" class="modify_btn" onclick='selectMyCustomImg("${customList.customGroupId}","${customList.customResultImg}","0");'>수정</button>
-								</c:otherwise>
-							</c:choose>
 							
-							<button type="button" class="detail_btn" onclick='selectMyCustomDetail("${customList.customGroupId}");'>상세보기</button>
-							<input type="hidden" id="${status.index}_imgPath"  value="${strImgPath}">
-							<input type="hidden" id="${status.index}_fileId"  value="${customList.attachFileId}">
-							<input type="hidden" id="${status.index}_fileSn"  value="${customList.fileSn}">
-							<input type="hidden" id="customPopupDetailOpen" data-tooltip="customVeiw01" style="position: absolute;overflow: hidden;left: 0;top: 0;width: 0;height: 0;margin: 0;padding: 0;text-indent: -99999px;">
+							
 						</div>
 					</li>
 				</c:forEach>
src/main/webapp/WEB-INF/jsp/web/fax/faxSendList.jsp
--- src/main/webapp/WEB-INF/jsp/web/fax/faxSendList.jsp
+++ src/main/webapp/WEB-INF/jsp/web/fax/faxSendList.jsp
@@ -305,7 +305,7 @@
 								<th>성공</th>
 								<th>대기</th>
 								<th>실패</th>
-								<th style="border-right: 1px solid #d5d5d5;">기타</th>
+								<th>기타</th>
 							</tr>
 						</thead>
 						<tbody>
src/main/webapp/WEB-INF/jsp/web/kakao/intrd/KakaotalkIntro.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/intrd/KakaotalkIntro.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/intrd/KakaotalkIntro.jsp
@@ -26,259 +26,226 @@
 	
 			<ul class="tabType1">
 				<li class="tab active"><button type="button" onclick="contentTab(this,'1');">알림톡</button></li>
-				<li class="tab"><button type="button" onclick="contentTab(this,'2');">친구톡</button></li>
+				<li class="tab"><button type="button" onclick="contentTab(this,'2');">브랜드메시지</button></li>
 			</ul>
 			
 			<!-- 알림톡 소개 -->
 			<div class="tab_content current" id="tab_content_1">
 				<div class="kakao_intro">
-					<div class="title">
-						<h3>알림톡이란?</h3>
-					</div>
-		
-					<div class="title-line">
-						<div class="left-line"></div>
-						<div class="right-line"></div>
-					</div>
-		
-					<div class="con">
-						<!--설명-->
-						<div class="intro">
+				
+					<div class="box fill intro">
+						<div class="title">
+							<i class="icon kakao_intro_title"></i>
+							<h3>알림톡<span class="summary">카카오톡 전용 기업 메시지 서비스</span></h3>
+						</div>
+						
+						<div class="contents">
 							<img class="phone" src="/publish/images/kakao_intro_cont/phone.png" alt="핸드폰">
 							<ul class="list">
 								<li>
-									<img src="/publish/images/kakao_intro_cont/text.png" alt="카카오톡 전용 기업 메시지 서비스  “알림톡”">
-								</li>
-								<li>
 									<p>1</p>
-									<p>1,000자 이내 <span>텍스트 및 이미지 전송 가능</span></p>
+									<p><b>1,000자 이내</b> 텍스트 및 이미지 전송 가능</p>
 								</li>
 								<li>
 									<p>2</p>
-									<p><span>문자 메시지 대비</span> 65% 이상 저렴</p>
+									<p>문자 메시지 대비 <b>65% 이상 저렴</b></p>
 								</li>
 								<li>
 									<p>3</p>
-									<p>
-										<span>카톡 채널아이디를 추가하지 않은 이용자에게도</span>
-										<br>전화번호만 있으면 메시지 전송 가능
-									</p>
+									<p>카톡 채널아이디를 추가하지 않은 이용자에게도 <b>전화번호만 <br />있으면 메시지 전송 가능</b></p>
 								</li>
 								<li>
 									<p>4</p>
-									<p><span>발송실패 시</span> 자동으로 문자 대체 발송</p>
+									<p>발송실패 시 <b>자동으로 문자 대체 발송</b></p>
 								</li>
 								<li>
 									<p>5</p>
-									<p><span>카카오 인증마크를 통해</span> 신뢰도 높은 메시지 발송</p>
+									<p>카카오 인증마크를 통해 <b>신뢰도 높은 메시지 발송</b></p>
 								</li>
 								<li>
 									<p>6</p>
-									<p><span>발신자 브랜드의 이미지 및 </span>신뢰도 상승 효과 달성</p>
+									<p>발신자 브랜드의 이미지 및 <b>신뢰도 상승 효과 달성</b></p>
 								</li>
 							</ul>
 						</div>
-		
-						<!--문자vs알림톡-->
-						<div class="fight">
-							<div class="line"></div>
-							<div class="fight-title">
-								<h4>문자 <span>VS</span> 알림톡</h4>
-								<div class="circle"></div>
-							</div>
-							<div class="wrap">
-								<div class="box box-01">
-									<div class="fight-img">
-										<p class="name">문자</p>
-										<div class="icon">
-											<img src="/publish/images/kakao_intro_cont/message.jpg.jpg" alt="문자">
-											<p class="price">18원</p>
-										</div>
+					</div>
+					
+					<div class="box fill vs">
+						<div class="title">
+							<h4>문자 vs 알림톡</h4>
+						</div>
+						<div class="contents">
+							<ul>
+								<li>
+									<p class="summary">문자대비&nbsp;<b>65% 저렴</b></p>
+									<div class="bottom">
+										<dl class="box gray">
+											<dt>문자</dt>
+											<dd><i class="icon msg"></i>18원</dd>
+										</dl>
+										<span>VS</span>
+										<dl class="box yellow">
+											<dt>알림톡</dt>
+											<dd><i class="icon kakao"></i>6.5원</dd>
+										</dl>
 									</div>
-									<p class="vs">VS</p>
-									<div class="fight-img kakao">
-										<p class="name">알림톡</p>
-										<div class="icon">
-											<img src="/publish/images/kakao_intro_cont/kakao.jpg.jpg" alt="카카오">
-											<p class="price">6.9원</p>
-										</div>
+								</li>
+								
+								<li>
+									<p class="summary">바이트(byte)에 관계없이&nbsp;<b>무조건 1,000자(한/영) 발송</b></p>
+									<div class="bottom">
+										<dl class="box gray">
+											<dt>문자</dt>
+											<dd><i class="icon msg"></i>90byte</dd>
+										</dl>
+										<span>VS</span>
+										<dl class="box yellow">
+											<dt>알림톡</dt>
+											<dd><i class="icon kakao"></i>1,000글자</dd>
+										</dl>
+									</div>
+								</li>
+							</ul>
+						</div>
+					</div>
+					
+					<div class="box fill use">
+						<div class="title">
+							<h4>알림톡 활용 방법</h4>
+						</div>
+						<div class="contents">
+							<div class="tab-wrap">
+								<ul class="tabs">
+									<li class="tab-link current" data-tab="tab-1">금융/보험</li>
+									<li class="tab-link" data-tab="tab-2">기관/단체</li>
+									<li class="tab-link" data-tab="tab-3">여행</li>
+									<li class="tab-link" data-tab="tab-4">예약/예매</li>
+									<li class="tab-link" data-tab="tab-5">배송/배달</li>
+									<li class="tab-link" data-tab="tab-6">안내/이벤트</li>
+								</ul>
+								<div id="tab-1" class="tab-content current">
+									<img src="/publish/images/kakao_intro_cont/bank.png" alt="금융,보험">
+								</div>
+								<div id="tab-2" class="tab-content">
+									<img src="/publish/images/kakao_intro_cont/organization.png" alt="기관,단체">
+								</div>
+								<div id="tab-3" class="tab-content">
+									<img src="/publish/images/kakao_intro_cont/travel.png" alt="여행">
+								</div>
+								<div id="tab-4" class="tab-content">
+									<img src="/publish/images/kakao_intro_cont/reservation.png" alt="예약,예약">
+								</div>
+								<div id="tab-5" class="tab-content">
+									<img src="/publish/images/kakao_intro_cont/delivery.png" alt="배송,배달">
+								</div>
+								<div id="tab-6" class="tab-content">
+									<img src="/publish/images/kakao_intro_cont/event.png" alt="안내,이벤트">
+								</div>
+							</div>
+						</div>
+					</div>
+					
+					<div class="box fill service">
+						<div class="title">
+							<h4>서비스 이용 방법</h4>
+						</div>
+						
+						<div class="contents">
+							<div class="con first-line">
+								<div class="service-01 common">
+									<div class="step">
+										<p>STEP <span>01</span></p>
 									</div>
 									<div class="text">
-										<p>문자 대비&nbsp;<span>65% 저렴</span></p>
+										<div class="btn">
+											<a href="https://center-pf.kakao.com/" target="_blank">카카오톡 채널 가입하러 가기<img src="/publish/images/kakao_intro_cont/arrow.png" alt="화살표"></a>
+										</div>
+										<div class="type">
+											<p>
+												카카오톡 채널을 먼저 가입해주신 다음 <br>
+												비즈니스 채널 전환 신청을 해주세요.
+											</p>
+											<p>
+												※ 가입 후 카카오톡 채널 설정에서 <br>
+												공개, 검색허용 설정을 하셔야 합니다.
+											</p>
+										</div>
+										<div class="icon">
+											<img src="/publish/images/kakao_intro_cont/service_01.jpg" alt="카카오톡 채널 가입하러 가기 아이콘">
+										</div>
 									</div>
 								</div>
-								<div class="fight-line"></div>
-								<div class="box box-02">
-									<div class="fight-img">
-										<p class="name">문자</p>
-										<div class="icon">
-											<img src="/publish/images/kakao_intro_cont/message.jpg.jpg" alt="문자">
-											<p class="price">90Byte</p>
-										</div>
-									</div>
-									<p class="vs">VS</p>
-									<div class="fight-img kakao">
-										<p class="name">알림톡</p>
-										<div class="icon">
-											<img src="/publish/images/kakao_intro_cont/kakao.jpg.jpg" alt="카카오">
-											<p class="price">1,000글자</p>
-										</div>
+								<div class="service-02 common">
+									<div class="step">
+										<p>STEP <span>02</span></p>
 									</div>
 									<div class="text">
-										<p>바이트(byte)에 관계없이&nbsp;<span>무조건 1,000자(한/영) 발송</span></p>
+										<div class="btn">
+			<%-- 								<a href="<c:url value='/web/mjon/kakao/profile/selectKaKaoProfileList.do'/>">채널 ID 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a> --%>
+											<a href="javascript:cntntBtnInfo('step02');">채널 ID 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.png" alt="화살표"></a>
+										</div>
+										<div class="type">
+											<p>
+												가입하신 카카오톡 채널의 채널ID(채널이름)를 <br>
+												채널ID 등록 메뉴에 등록해주세요.
+											</p>
+										</div>
+										<div class="icon">
+											<img src="/publish/images/kakao_intro_cont/service_02.jpg" alt="채널 ID 등록하러 가기 아이콘">
+										</div>
+									</div>
+								</div>
+								<div class="service-03 common">
+									<div class="step">
+										<p>STEP <span>03</span></p>
+									</div>
+									<div class="text">
+										<div class="btn">
+			<%-- 								<a href="<c:url value='/web/mjon/kakao/template/selectKaKaoTemplateList.do'/>">알림톡 템플릿 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a> --%>
+											<a href="javascript:cntntBtnInfo('step03');">알림톡 템플릿 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.png" alt="화살표"></a>
+										</div>
+										<div class="type">
+											<p>
+												알림톡 발송을 위해서는 사용하실 템플릿(메시지 내용)에
+												대한 카카오의 승인이 반드시 필요합니다.
+												템플릿을 작성하신 후 심사요청을 진행해주세요.
+											</p>
+											<p>
+												※ 템플릿 승인까지 최대 3일 소요
+											</p>
+										</div>
+										<div class="icon">
+											<img src="/publish/images/kakao_intro_cont/service_03.jpg" alt="알림톡 템플릿 등록하러 가기 아이콘">
+										</div>
+									</div>
+								</div>
+								<div class="service-04 common">
+									<div class="step">
+										<p>STEP <span>04</span></p>
+									</div>
+									<div class="text">
+										<div class="btn">
+											<a href="<c:url value='/web/mjon/alimtalk/kakaoAlimtalkMsgDataView.do'/>">알림톡 전송하기<img src="/publish/images/kakao_intro_cont/arrow.png" alt="화살표"></a>
+										</div>
+										<div class="type">
+											<p>
+												템플릿이 승인되셨다면 문자고 알림톡을 <br>
+												통해 메시지를 발송하실 수 있습니다.
+											</p>
+										</div>
+										<div class="icon">
+											<img src="/publish/images/kakao_intro_cont/service_04.jpg" alt="알림톡 전송하기 아이콘">
+										</div>
 									</div>
 								</div>
 							</div>
+							<!--이용가이드 버튼-->
+							<div class="guide">
+								<a href="https://kakaobusiness.gitbook.io/main/ad/bizmessage/notice-friend" target="_blank">알림톡 이용가이드 보기 </a>
+							</div>
 						</div>
 					</div>
-				</div>
 		
-				<!--알림톡 활용 방법-->
-				<div class="use">
-					<div class="title">
-						<h3>알림톡 활용 방법</h3>
-					</div>
-					<div class="title-line">
-						<div class="left-line"></div>
-						<div class="right-line"></div>
-					</div>
-					<div class="tab-wrap">
-						<ul class="tabs">
-							<li class="tab-link current" data-tab="tab-1">금융/보험</li>
-							<li class="tab-link" data-tab="tab-2">기관/단체</li>
-							<li class="tab-link" data-tab="tab-3">여행</li>
-							<li class="tab-link" data-tab="tab-4">예약/예매</li>
-							<li class="tab-link" data-tab="tab-5">배송/배달</li>
-							<li class="tab-link" data-tab="tab-6">안내/이벤트</li>
-						</ul>
-						<div id="tab-1" class="tab-content current">
-							<img src="/publish/images/kakao_intro_cont/bank.png" alt="금융,보험">
-						</div>
-						<div id="tab-2" class="tab-content">
-							<img src="/publish/images/kakao_intro_cont/organization.png" alt="기관,단체">
-						</div>
-						<div id="tab-3" class="tab-content">
-							<img src="/publish/images/kakao_intro_cont/travel.png" alt="여행">
-						</div>
-						<div id="tab-4" class="tab-content">
-							<img src="/publish/images/kakao_intro_cont/reservation.png" alt="예약,예약">
-						</div>
-						<div id="tab-5" class="tab-content">
-							<img src="/publish/images/kakao_intro_cont/delivery.png" alt="배송,배달">
-						</div>
-						<div id="tab-6" class="tab-content">
-							<img src="/publish/images/kakao_intro_cont/event.png" alt="안내,이벤트">
-						</div>
-					</div>
-				</div>
-				
-				<!--서비스이용방법-->
-				<div class="service">
-					<div class="title">
-						<h3>서비스 이용 방법</h3>
-					</div>
-					<div class="title-line">
-						<div class="left-line"></div>
-						<div class="right-line"></div>
-					</div>
-					<div class="con first-line">
-						<div class="service-01 common">
-							<div class="step">
-								<p>STEP <span>01</span></p>
-							</div>
-							<div class="text">
-								<div class="btn">
-									<a href="https://center-pf.kakao.com/" target="_blank">카카오톡 채널 가입하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a>
-								</div>
-								<div class="text-line"></div>
-								<div class="type">
-									<p>
-										카카오톡 채널을 먼저 가입해주신 다음 <br>
-										비즈니스 채널 전환 신청을 해주세요.
-									</p>
-									<p>
-										※ 가입 후 카카오톡 채널 설정에서 <br>
-										공개, 검색허용 설정을 하셔야 합니다.
-									</p>
-								</div>
-								<div class="icon">
-									<img src="/publish/images/kakao_intro_cont/service_01.jpg" alt="카카오톡 채널 가입하러 가기 아이콘">
-								</div>
-							</div>
-						</div>
-						<div class="service-02 common">
-							<div class="step">
-								<p>STEP <span>02</span></p>
-							</div>
-							<div class="text">
-								<div class="btn">
-	<%-- 								<a href="<c:url value='/web/mjon/kakao/profile/selectKaKaoProfileList.do'/>">채널 ID 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a> --%>
-									<a href="javascript:cntntBtnInfo('step02');">채널 ID 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a>
-								</div>
-								<div class="text-line"></div>
-								<div class="type">
-									<p>
-										가입하신 카카오톡 채널의 채널ID(채널이름)를 <br>
-										채널ID 등록 메뉴에 등록해주세요.
-									</p>
-								</div>
-								<div class="icon">
-									<img src="/publish/images/kakao_intro_cont/service_02.jpg" alt="채널 ID 등록하러 가기 아이콘">
-								</div>
-							</div>
-						</div>
-					</div>
-					<div class="con second-line">
-						<div class="service-03 common">
-							<div class="step">
-								<p>STEP <span>03</span></p>
-							</div>
-							<div class="text">
-								<div class="btn">
-	<%-- 								<a href="<c:url value='/web/mjon/kakao/template/selectKaKaoTemplateList.do'/>">알림톡 템플릿 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a> --%>
-									<a href="javascript:cntntBtnInfo('step03');">알림톡 템플릿 등록하러 가기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a>
-								</div>
-								<div class="text-line"></div>
-								<div class="type">
-									<p>
-										알림톡 발송을 위해서는 사용하실 템플릿(메시지 내용)에
-										대한 카카오의 승인이 반드시 필요합니다.
-										템플릿을 작성하신 후 심사요청을 진행해주세요.
-									</p>
-									<p>
-										※ 템플릿 승인까지 최대 3일 소요
-									</p>
-								</div>
-								<div class="icon">
-									<img src="/publish/images/kakao_intro_cont/service_03.jpg" alt="알림톡 템플릿 등록하러 가기 아이콘">
-								</div>
-							</div>
-						</div>
-						<div class="service-04 common">
-							<div class="step">
-								<p>STEP <span>04</span></p>
-							</div>
-							<div class="text">
-								<div class="btn">
-									<a href="<c:url value='/web/mjon/alimtalk/kakaoAlimtalkMsgDataView.do'/>">알림톡 전송하기<img src="/publish/images/kakao_intro_cont/arrow.jpg" alt="화살표"></a>
-								</div>
-								<div class="text-line"></div>
-								<div class="type">
-									<p>
-										템플릿이 승인되셨다면 문자온 알림톡을 <br>
-										통해 메시지를 발송하실 수 있습니다.
-									</p>
-								</div>
-								<div class="icon">
-									<img src="/publish/images/kakao_intro_cont/service_04.jpg" alt="알림톡 전송하기 아이콘">
-								</div>
-							</div>
-						</div>
-					</div>
-					<!--이용가이드 버튼-->
-					<div class="guide">
-						<a href="https://kakaobusiness.gitbook.io/main/ad/bizmessage/notice-friend" target="_blank">알림톡 이용가이드 보기 <img src="/publish/images/kakao_intro_cont/guide_arrow.png" alt="알림톡 이용가이드 화살표"></a>
-					</div>
 				</div>
 		
 				<!--유의사항-->
@@ -304,202 +271,199 @@
 			</div>
 			<!-- // 알림톡 소개 -->
 		
-			<!-- 친구톡 소개 -->
-			<div class="tab_content friendtalk" id="tab_content_2">
+			<!-- 브랜드메시지 소개 -->
+			<div class="tab_content brandMsg" id="tab_content_2">
 				<div class="kakao_intro">
-					<div class="title">
-						<h3>친구톡이란?</h3>
-					</div>
-			
-					<div class="title-line">
-						<div class="left-line"></div>
-						<div class="right-line"></div>
-					</div>
-			
-					<div class="con">
-						<!--설명-->
-						<div class="intro">
-							<img class="phone" src="/publish/images/kakao_intro_cont/phone_friendtalk.png" alt="핸드폰">
-			
+				
+					<div class="box fill intro">
+						<div class="title">
+							<i class="icon kakao_intro_title"></i>
+							<h3>브랜드메시지<span class="summary">카카오톡 전용 기업 메시지 서비스</span></h3>
+						</div>
+						
+						<div class="contents">
+							<img class="phone" src="/publish/images/kakao_intro_cont/phone_brandMsg.png" alt="핸드폰">
 							<ul class="list">
 								<li>
-									<img src="/publish/images/kakao_intro_cont/text_friendtalk.png" alt="카카오톡 전용 기업 메시지 서비스  “알림톡”">
-								</li>
-								<li>
 									<p>1</p>
-									<p><span>광고성 메시지</span> 발송 가능(광고 표기 및 수신거부 안내 포함)</p>
+									<p><b>광고성 메시지</b> 발송 가능(광고 표기 및 수신거부 안내 포함)</p>
 								</li>
 								<li>
 									<p>2</p>
-									<p>채널 친구 추가된 사용자라면 <span>누구에게나</span> 발송 가능</p>
+									<p>채널 친구 추가된 사용자라면  <b>누구에게나</b>발송 가능 <span>(타깃 설정 미지원)</span></p>
 								</li>
 								<li>
 									<p>3</p>
-									<p><span>1,000자 이내</span> 텍스트 및 <span>이미지</span> 전송 가능</p>
+									<p><b>1,000자 이내</b> 텍스트 및 <b>이미지</b> 전송 가능</p>
 								</li>
 								<li>
 									<p>4</p>
-									<p><span>맞춤형 메시지 및 쿠폰, 링크</span> 버튼 제공 가능</p>
+									<p><b>맞춤형 메시지 및 쿠폰, 링크</b> 버튼 제공 가능</p>
 								</li>
 								<li>
 									<p>5</p>
-									<p>문자 메시지 대비 <span>저렴한</span> 단가</p>
+									<p>문자 메시지 대비 <b>저렴한</b> 단가</p>
 								</li>
 								<li>
 									<p>6</p>
-									<p>발송실패 시 <span>대체문자 발송</span> 기능 지원</p>
+									<p>발송실패 시 <b>대체문자 발송</b> 기능 지원</p>
 								</li>
 								<li>
 									<p>7</p>
-									<p>클릭률/도달률 분석을 통한 <span>마케팅 효율 강화</span></p>
+									<p>클릭률/도달률 분석을 통한 <b>마케팅 효율 강화</b></p>
 								</li>
 								<li>
 									<p>8</p>
-									<p>브랜드 친화적인 <span>이미지 커스터마이징</span> 가능</p>
+									<p>브랜드 친화적인 <b>이미지 커스터마이징</b> 가능</p>
 								</li>
 							</ul>
 						</div>
-			
-						<!--문자vs알림톡-->
-						<div class="fight">
-							<div class="line"></div>
-							<div class="fight-title">
-								<h4>알림톡 <span>VS</span> 친구톡</h4>
-								<div class="circle"></div>
-							</div>
-			
-							<div class="wrap">
-								<div class="vs allimtalk_vs">
-									<div class="title">알림톡</div>
-									<div class="box">
-										<ul>
-											<li>전화번호 보유자</li>
-											<li>정보성 <span>(예 : 주문, 예약, 안내 등)</span></li>
-											<li>텍스트, 이미지 등</li>
-											<li>최대 5개</li>
-											<li>사전 승인 필요</li>
-											<li>6.9원</li>
-											<li>1,000자</li>
-											<li>로고, 아이콘 형식만 가능</li>
-										</ul>
-									</div>
-								</div>
-			
-								<div class="vs vs_title">
-									<div class="title">VS</div>
-									<ul>
-										<li>전송대상</li>
-										<li>발송목적</li>
-										<li>메세지 형태</li>
-										<li>버튼 사용</li>
-										<li>템플릿 승인</li>
-										<li>비용</li>
-										<li>길이제한</li>
-										<li>이미지</li>
-									</ul>
-								</div>
-			
-								<div class="vs friendtalk_vs">
-									<div class="title">친구톡</div>
-									<div class="box">
-										<ul>
-											<li>채널 친구</li>
-											<li>광고 및 마케팅성<span>(예 : 이벤트, 쿠폰 등)</span></li>
-											<li>텍스트, 기본이미지, 와이드 이미지형 등</li>
-											<li>최대 5개</li>
-											<li>별도 승인 없음 <span>야간 발송 제한(20:50 ~ 익일 08:00)</span></li>
-											<li>13.8원 ~ 22.9원</li>
-											<li>1,000자</li>
-											<li>가능</li>
-										</ul>
-									</div>
-								</div>
+					</div>
+					
+					<div class="box fill vs">
+						<div class="title">
+							<h4>알림톡 vs 브랜드메시지</h4>
+						</div>
+						
+						<div class="contents">
+							<div class="vs_table">
+								<table>
+									<colgroup>
+										<col style="width:calc((100% - 175px)/2);"/>
+										<col style="width:175px;"/>
+										<col style="width:calc((100% - 175px)/2);"/>
+									</colgroup>
+									<thead>
+										<tr>
+											<th><p class="type_text gray">알림톡</p></th>
+											<th>VS</th>
+											<th><p class="type_text yellow">브랜드메시지</p></th>
+										</tr>
+									</thead>
+									<tbody>
+										<tr>
+											<td>전화번호 보유자</td>
+											<td>전송대상</td>
+											<td>채널 친구<br /><span>(타깃 설정 미지원)</span></td>
+										</tr>
+										<tr>
+											<td>정보성<br /><span>(예 : 주문, 예약, 안내 등)</span></td>
+											<td>발송목적</td>
+											<td>광고 및 마케팅성 <br /><span>(예 : 이벤트, 쿠폰 등)</span></td>
+										</tr>
+										<tr>
+											<td>텍스트, 이미지 등</td>
+											<td>메세지 형태</td>
+											<td>텍스트, 기본이미지, 와이드 이미지형 등</td>
+										</tr>
+										<tr>
+											<td>최대 5개</td>
+											<td>버튼 사용</td>
+											<td>최대 5개</td>
+										</tr>
+										<tr>
+											<td>사전 승인 필요</td>
+											<td>템플릿 승인</td>
+											<td>별도 승인 없음<br /><span>야간 발송 제한(20:50 ~ 익일 08:00)</span></td>
+										</tr>
+										<tr>
+											<td>6.9원</td>
+											<td>비용</td>
+											<td>20원</td>
+										</tr>
+										<tr>
+											<td>1,000자</td>
+											<td>길이제한</td>
+											<td>1,000자</td>
+										</tr>
+										<tr>
+											<td>로고, 아이콘 형식만 가능</td>
+											<td>이미지</td>
+											<td>가능</td>
+										</tr>
+									</tbody>
+								</table>
 							</div>
 						</div>
 					</div>
+					
+					<div class="box fill use">
+						<div class="title">
+							<h4>브랜드메시지 유형</h4>
+						</div>
+						
+						<div class="contents">
+							<ul class="brand_use">
+								<li>
+									<div class="title">텍스트형</div>
+									<img src="/publish/images/kakao_intro_cont/brandMsg_use1.png" alt="">
+									<p class="explan_text">한/영 구분없이&nbsp;<span>1,000자</span>&nbsp;+ 버튼&nbsp;<span>최대 5개</span></p>
+								</li>
+								<li>
+									<div class="title">기본 이미지형</div>
+									<img src="/publish/images/kakao_intro_cont/brandMsg_use2.png" alt="">
+									<p class="explan_text">한/영 구분없이 <span>400자</span> + 이미지 <span>1</span>장 + 버튼 <span>최대 5개</span></p>
+								</li>
+								<li>
+									<div class="title">와이드 이미지형</div>
+									<img src="/publish/images/kakao_intro_cont/brandMsg_use3.png" alt="">
+									<p class="explan_text">한/영 구분없이 <span>76자</span> + 이미지 <span>1</span>장 + 버튼 <span>최대 1개</span></p>
+								</li>
+							</ul>
+						</div>
+						
+					</div>
+					
+					<div class="box fill service">
+						<div class="title">
+							<h4>서비스 이용 방법</h4>
+						</div>
+				
+						<ul class="kakao_use_guide">
+							<li class="guide_01">
+								<i></i>
+								<div class="title">STEP <span>01</span></div>
+								<p class="guide_title">카카오톡 채널 가입</p>
+								<span class="guide_info">카카오톡 채널 생성을 위한 <br> 계정이 없으시다면, 카카오에서 <br> 카카오톡 비즈니스 회원가입을<br> 먼저 진행해주세요.</span>
+							</li>
+							<li class="guide_02">
+								<i></i>
+								<div class="title">STEP <span>02</span></div>
+								<p class="guide_title">채널 ID 등록하러 가기</p>
+								<span class="guide_info">가입하신 카카오톡 채널의 채널 ID(채널이름)를 채널 ID 등록  메뉴에 등록해주세요.</span>
+							</li>
+							<li class="guide_03">
+								<i></i>
+								<div class="title">STEP <span>03</span></div>
+								<p class="guide_title">브랜드메시지 전송</p>
+								<span class="guide_info">브랜드메시지는 별도의 템플릿 심사 절차 없이, 즉시 발송 가능합니다.</span>
+							</li>
+						</ul>
+				
+						<!--이용가이드 버튼-->
+						<div class="guide">
+							<a href="https://kakaobusiness.gitbook.io/main/ad/brandmessage" target="_blank">브랜드메시지 이용가이드 보기</a>
+						</div>
+					</div>
+					
+					<!--유의사항-->
+					<div class="note">
+						<div class="note-title">
+							<p><span><img src="/publish/images/kakao_intro_cont/note_icon.png" alt="유의사항 아이콘"></span>유의사항</p>
+						</div>
+						<ul>
+							<li>- 브랜드메시지에는 ”(광고) 문구 및 수신거부 방식”이 자동으로 표시되며, 대체 문자 발송 시에는 “(광고) 문구 및 080 무료수신거부 번호”가 자동으로 적용됩니다.</li>
+							<li>- 광고성 메시지의 발송 가능 시간은 08:00 ~ 20:50(한국시간) 입니다.</li>
+							<li>- 브랜드메시지 발송 실패에 따른 대체문자 발송 시 문자요금(단문, 장문, 그림)이 보유 캐시에서 차감됩니다.</b></li>
+							<li>- 카카오정책 및 심의기준을 반드시 준수하여야 합니다.</li>
+						</ul>
+					</div>
+			
 				</div>
+				
+				
 			
-				<!-- 친구톡 유형 -->
-				<div class="use">
-					<div class="title">
-						<h3>친구톡 유형</h3>
-					</div>
-			
-					<div class="title-line">
-						<div class="left-line"></div>
-						<div class="right-line"></div>
-					</div>
-			
-					<ul class="friendtalk_use">
-						<li>
-							<div class="title">텍스트형</div>
-							<img src="/publish/images/kakao_intro_cont/friendtalk_use1.png" alt="">
-							<p class="explan_text">한/영 구분없이&nbsp;<span>1,000자</span>&nbsp;+ 버튼&nbsp;<span>최대 5개</span></p>
-						</li>
-						<li>
-							<div class="title">기본 이미지형</div>
-							<img src="/publish/images/kakao_intro_cont/friendtalk_use2.png" alt="">
-							<p class="explan_text">한/영 구분없이 <span>400자</span> + 이미지 <span>1</span>장 + 버튼 <span>최대 5개</span></p>
-						</li>
-						<li>
-							<div class="title">와이드 이미지형</div>
-							<img src="/publish/images/kakao_intro_cont/friendtalk_use3.png" alt="">
-							<p class="explan_text">한/영 구분없이 <span>76자</span> + 이미지 <span>1</span>장 + 버튼 <span>최대 1개</span></p>
-						</li>
-					</ul>
-				</div>
-			
-				<!--서비스이용방법-->
-				<div class="service">
-					<div class="title">
-						<h3>서비스 이용 방법</h3>
-					</div>
-			
-					<div class="title-line">
-						<div class="left-line"></div>
-						<div class="right-line"></div>
-					</div>
-			
-					<ul class="kakao_use_guide">
-						<li class="guide_01">
-							<div class="title">STEP <span>01</span></div>
-							<i></i>
-							<p class="guide_title">카카오톡 채널 가입</p>
-							<span class="guide_info">카카오톡 채널 생성을 위한 <br> 계정이 없으시다면, 카카오에서 <br> 카카오톡 비즈니스 회원가입을<br> 먼저 진행해주세요.</span>
-						</li>
-						<li class="guide_02">
-							<div class="title">STEP <span>02</span></div>
-							<i></i>
-							<p class="guide_title">채널 ID 등록하러 가기</p>
-							<span class="guide_info">가입하신 카카오톡 채널의 채널 ID(채널이름)를 채널 ID 등록  메뉴에 등록해주세요.</span>
-						</li>
-						<li class="guide_03">
-							<div class="title">STEP <span>03</span></div>
-							<i></i>
-							<p class="guide_title">친구톡 전송</p>
-							<span class="guide_info">친구톡은 별도의 템플릿 심사 절차 없이, 즉시 발송 가능합니다.</span>
-						</li>
-					</ul>
-			
-					<!--이용가이드 버튼-->
-					<div class="guide">
-						<a href="https://kakaobusiness.gitbook.io/main/ad/brandmessage" target="_blank">친구톡 이용가이드 보기 <img src="/publish/images/kakao_intro_cont/guide_arrow.png" alt="알림톡 이용가이드 화살표"></a>
-					</div>
-				</div>
-			
-				<!--유의사항-->
-				<div class="note">
-					<div class="note-title">
-						<p><span><img src="/publish/images/kakao_intro_cont/note_icon.png" alt="유의사항 아이콘"></span>유의사항</p>
-					</div>
-					<ul>
-						<li>- (광고) 표기 여부는 선택 가능하나 , (광고)표기 해제에 따른 법령상 의무사항을 미 준수시에는 메시지 발송이 중단될 수 있습니다.</li>
-						<li>- 광고성 친구톡 메시지에는 “(광고) 표시 및 수신거부 방식”이 표시되며, 대체 문자의 경우에는 “(광고) 문구 및 080 무료수신거부 번호”가 자동으로 포함됩니다.</li>
-						<li><b>- 광고성 메시지의 발송 가능 시간은 08:00 ~ 20:50(한국시간) 입니다.</b></li>
-						<li>- 친구톡 발송 실패에 따른 대체문자 발송 시 문자요금(단문, 장문, 그림)이 보유 캐시에서 차감됩니다.</li>
-						<li>- 카카오정책 및 심의기준을 반드시 준수하여야 합니다.</li>
-					</ul>
-				</div>
+				
 			</div>
 			<!-- // 친구톡 소개 -->
 
src/main/webapp/WEB-INF/jsp/web/kakao/msgdata/at/KakaoAlimtalkMsgDataView.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/msgdata/at/KakaoAlimtalkMsgDataView.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/msgdata/at/KakaoAlimtalkMsgDataView.jsp
@@ -1476,12 +1476,14 @@
 									<tr>
 										<th>템플릿</th>
 										<td>
-											<select class="select_gray_type" id="selectTemplateList" name="selectTemplateList">
-<!--                                             <select name="" id="" class="select_gray_type"> -->
-												<option value="">알림톡 템플릿 선택</option>
-											</select>
-<!--                                             <button type="button" class="btnType btnType6" onclick="window.open('popup_allimtalk_template_choice.html','_blank','width=930, height=860, top=100, left=100, fullscreen=no, menubar=no, status=no, toolbar=no, titlebar=yes, location=no, scrollbars=yes')">템플릿 선택</button> -->
-											<button type="button" class="btnType btnType6"  onclick="javascript:fnTemplateReg(); return false;">템플릿 등록</button>
+											<div class="form_wrap left">
+												<select class="select_gray_type" id="selectTemplateList" name="selectTemplateList">
+	<!--                                             <select name="" id="" class="select_gray_type"> -->
+													<option value="">알림톡 템플릿 선택</option>
+												</select>
+	<!--                                             <button type="button" class="btnType btnType6" onclick="window.open('popup_allimtalk_template_choice.html','_blank','width=930, height=860, top=100, left=100, fullscreen=no, menubar=no, status=no, toolbar=no, titlebar=yes, location=no, scrollbars=yes')">템플릿 선택</button> -->
+												<button type="button" class="btnType btnType6"  onclick="javascript:fnTemplateReg(); return false;">템플릿 등록</button>
+											</div>
 											<div class="variable_wrap">
 												<ul>
 													<li>* 변수명 설정파일을 다운로드 받으신 후 전송대상과 변수를 입력 후 업로드해주세요.</li>
@@ -1498,9 +1500,11 @@
 										<td class="putText">
 											<div class="clearfix receipt_num receiver_wrap01">
 												<div class="receipt_num_top">
-													<label for="callTo" class="label">받는 번호입력</label>
-													<input type="text" id="callTo" name="callTo" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');"  placeholder="번호를 입력하세요" onfocus="this.placeholder=''" onblur="this.placeholder='번호를 입력하세요'" style="width:340px;">
-													<button type="button" class="btnType btnType6 addCallToF">번호추가</button>
+													<div class="form_wrap">
+														<label for="callTo" class="label">받는 번호입력</label>
+														<input type="text" id="callTo" name="callTo" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*)\./g, '$1');"  placeholder="번호를 입력하세요" onfocus="this.placeholder=''" onblur="this.placeholder='번호를 입력하세요'" style="width:340px;">
+														<button type="button" class="btnType btnType6 addCallToF">번호추가</button>
+													</div>
 													</br>
 													<span>
 														<span class="vMiddle">*</span> 중복번호는 한번만 발송됩니다.
@@ -1553,7 +1557,7 @@
 														</div> -->
 													</div>
 												</div>
-												<div class="list_bottom clearfix">
+												<div class="list_bottom">
 													<div class="remove_btnWrap">
 														<button type="button" class="btnType15" id="all_del"><i class="remove_img"></i>전체삭제</button>
 														<button type="button" class="btnType15" id="select_del"><i class="remove_img"></i>선택삭제</button>
@@ -1603,7 +1607,7 @@
 													<div>
 														<input type="radio" id="radio_bill_1" name="radio_bill" checked="checked">
 														<label for="radio_bill_1">보유잔액</label>
-														<label for="userMoney" class="la bel">보유잔액</label>
+														<label for="userMoney" class="label">보유잔액</label>
 														<input type="text" id="userMoney" name="userMoney" value="<c:out value='${commaPrice}'/>" readonly>
 														<span class="won">원</span>
 														<button type="button" class="btnType btnType21" onclick="location.href='/web/member/pay/PayView.do'">충전</button>
src/main/webapp/WEB-INF/jsp/web/kakao/msgdata/include/atDataIncludeExcel.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/msgdata/include/atDataIncludeExcel.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/msgdata/include/atDataIncludeExcel.jsp
@@ -727,7 +727,7 @@
 							<p>- 이름 200byte, [*1*]~[*4*] 200byte, 메모 250byte까지 입력 가능합니다.</p>
 							<p>- 주소록 등록이 어려우신 경우에는 <a href="<c:url value='/web/mjon/addragency/selectAddrAgencyList.do'/>" style="font-weight: bold; color: blue;">주소록 입력대행</a> 메뉴를 이용하실 수 있습니다. </p>
 						</div>
-						<div class="pop_more_wrap">
+						<div class="pop_more_wrap" style="margin:-15px 0 30px 0;">
 								<button type="button" class="pop_more" onclick="popMore(this);">더보기<i></i></button>
 						</div>
 					</div><!--// 엑셀입력 -->
src/main/webapp/WEB-INF/jsp/web/kakao/profile/KakaoProfileList.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/profile/KakaoProfileList.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/profile/KakaoProfileList.jsp
@@ -380,7 +380,7 @@
                                     <p class="kakaotalk_tag">@</p>
                                     <input type="text" class="kakaotalk_input" name="inputyellowId" id="inputyellowId"  value="">
                                 </div>
-                                <p class="cf_text">카카오톡 채널을 입력해주세요.  ex) @문자온</p>
+                                <p class="cf_text">카카오톡 채널을 입력해주세요.  ex) @문자고</p>
                             </td>
                         </tr>
                         <tr>
src/main/webapp/WEB-INF/jsp/web/kakao/template/at/KakaoAlimtalkTemplateList.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/template/at/KakaoAlimtalkTemplateList.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/template/at/KakaoAlimtalkTemplateList.jsp
@@ -372,8 +372,8 @@
             <div class="tab_content template_content_wrap current" id="tab_content_1">
                 <!-- 검색조건 -->
             <div class="excel_middle">
-                <div class="select_btnWrap clearfix">
-                    <div class="btn_left">
+                <div class="select_btnWrap form_wrap w100">
+                    <div class="btn_left w100">
                         <!-- <span class="cal_label">등록일</span>
                         <div class="calendar_wrap">
                             <input type="text" class="startDate inp calendar picker__input" title="검색 시작일" id="startDate" name="startDate" value="" data-datecontrol="true" readonly="" aria-haspopup="true" aria-expanded="false" aria-readonly="false" aria-owns="startDate_root"><div class="picker" id="startDate_root" aria-hidden="true"><div class="picker__holder" tabindex="-1"><div class="picker__frame"><div class="picker__wrap"><div class="picker__box"><div class="picker__header"><div class="picker__month">2월</div><div class="picker__year">2023</div><div class="picker__nav--prev" data-nav="-1" role="button" aria-controls="startDate_table" title="이전 달 보기"> </div><div class="picker__nav--next" data-nav="1" role="button" aria-controls="startDate_table" title="다음 달 보기"> </div></div><table class="picker__table" id="startDate_table" role="grid" aria-controls="startDate" aria-readonly="true"><thead><tr><th class="picker__weekday" scope="col" title="월요일">월</th><th class="picker__weekday" scope="col" title="화요일">화</th><th class="picker__weekday" scope="col" title="수요일">수</th><th class="picker__weekday" scope="col" title="목요일">목</th><th class="picker__weekday" scope="col" title="금요일">금</th><th class="picker__weekday" scope="col" title="토요일">토</th><th class="picker__weekday" scope="col" title="일요일">일</th></tr></thead><tbody><tr><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1675004400000" role="gridcell" aria-label="2023/01/30">30</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1675090800000" role="gridcell" aria-label="2023/01/31">31</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675177200000" role="gridcell" aria-label="2023/02/01">1</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675263600000" role="gridcell" aria-label="2023/02/02">2</div></td><td role="presentation"><div class="picker__day picker__day--infocus picker__day--today picker__day--highlighted" data-pick="1675350000000" role="gridcell" aria-label="2023/02/03" aria-activedescendant="true">3</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675436400000" role="gridcell" aria-label="2023/02/04">4</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675522800000" role="gridcell" aria-label="2023/02/05">5</div></td></tr><tr><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675609200000" role="gridcell" aria-label="2023/02/06">6</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675695600000" role="gridcell" aria-label="2023/02/07">7</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675782000000" role="gridcell" aria-label="2023/02/08">8</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675868400000" role="gridcell" aria-label="2023/02/09">9</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1675954800000" role="gridcell" aria-label="2023/02/10">10</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676041200000" role="gridcell" aria-label="2023/02/11">11</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676127600000" role="gridcell" aria-label="2023/02/12">12</div></td></tr><tr><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676214000000" role="gridcell" aria-label="2023/02/13">13</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676300400000" role="gridcell" aria-label="2023/02/14">14</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676386800000" role="gridcell" aria-label="2023/02/15">15</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676473200000" role="gridcell" aria-label="2023/02/16">16</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676559600000" role="gridcell" aria-label="2023/02/17">17</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676646000000" role="gridcell" aria-label="2023/02/18">18</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676732400000" role="gridcell" aria-label="2023/02/19">19</div></td></tr><tr><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676818800000" role="gridcell" aria-label="2023/02/20">20</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676905200000" role="gridcell" aria-label="2023/02/21">21</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1676991600000" role="gridcell" aria-label="2023/02/22">22</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1677078000000" role="gridcell" aria-label="2023/02/23">23</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1677164400000" role="gridcell" aria-label="2023/02/24">24</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1677250800000" role="gridcell" aria-label="2023/02/25">25</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1677337200000" role="gridcell" aria-label="2023/02/26">26</div></td></tr><tr><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1677423600000" role="gridcell" aria-label="2023/02/27">27</div></td><td role="presentation"><div class="picker__day picker__day--infocus" data-pick="1677510000000" role="gridcell" aria-label="2023/02/28">28</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1677596400000" role="gridcell" aria-label="2023/03/01">1</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1677682800000" role="gridcell" aria-label="2023/03/02">2</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1677769200000" role="gridcell" aria-label="2023/03/03">3</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1677855600000" role="gridcell" aria-label="2023/03/04">4</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1677942000000" role="gridcell" aria-label="2023/03/05">5</div></td></tr><tr><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678028400000" role="gridcell" aria-label="2023/03/06">6</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678114800000" role="gridcell" aria-label="2023/03/07">7</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678201200000" role="gridcell" aria-label="2023/03/08">8</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678287600000" role="gridcell" aria-label="2023/03/09">9</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678374000000" role="gridcell" aria-label="2023/03/10">10</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678460400000" role="gridcell" aria-label="2023/03/11">11</div></td><td role="presentation"><div class="picker__day picker__day--outfocus" data-pick="1678546800000" role="gridcell" aria-label="2023/03/12">12</div></td></tr></tbody></table><div class="picker__footer"><button class="picker__button--today" type="button" data-pick="1675350000000" disabled="" aria-controls="startDate">오늘</button><button class="picker__button--clear" type="button" data-clear="1" disabled="" aria-controls="startDate">초기화</button><button class="picker__button--close" type="button" data-close="true" disabled="" aria-controls="startDate">닫기</button></div></div></div></div></div></div><input type="hidden" name="startDate_submit">
@@ -399,7 +399,7 @@
 							<option value="DMT" <c:if test="${profileSts eq 'DMT'}">selected="selected"</c:if>>휴면</option>
 							<option value="BLK" <c:if test="${profileSts eq 'BLK'}">selected="selected"</c:if>>차단</option>
                         </select>
-                        <div class="search">
+                        <div class="search form_wrap">
                             <label for="id" class="label"></label>
                             <input type="text" class="search_input" id="inputSearchKeyword" name="inputSearchKeyword" value="" placeholder="템플릿명을 입력하세요." onfocus="this.placeholder=''" onblur="this.placeholder='검색어를 입력하세요.'">
                             <button type="button" class="btnType btnType2" onclick="selectTemplateListLoad('1');">검색</button>
src/main/webapp/WEB-INF/jsp/web/kakao/template/at/KakaoAlimtalkTemplateRegist.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/template/at/KakaoAlimtalkTemplateRegist.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/template/at/KakaoAlimtalkTemplateRegist.jsp
@@ -955,8 +955,8 @@
 	                        <p class="addText">※ 단말기 설정에 따라 다르게 보일 수 있습니다<p>
 	                        <div class="phone_bottom">
 	                            <div class="send_btn">
-	                                <button type="button" class="btnType btnType10" onclick="javascript:addTemplate();">등록하기</button>
-	                                <button type="button" class="btnType btnType11" onclick="location.href='/web/mjon/kakao/template/selectKaKaoTemplateList.do';">취소</button>
+	                                <button type="button" class="btnType btnType11" onclick="javascript:addTemplate();">등록하기</button>
+	                                <button type="button" class="btnType btnType10" onclick="location.href='/web/mjon/kakao/template/selectKaKaoTemplateList.do';">취소</button>
 	                            </div>
 	                        </div>
 	                    </div>
src/main/webapp/WEB-INF/jsp/web/kakao/template/at/sample/KakaoAlimtalkSampleTemplateList.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/template/at/sample/KakaoAlimtalkSampleTemplateList.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/template/at/sample/KakaoAlimtalkSampleTemplateList.jsp
@@ -104,7 +104,7 @@
 	                <!-- 검색조건 -->
 		            <div class="excel_middle">
 		                <div class="select_btnWrap clearfix">
-		                    <div class="btn_left">
+		                    <div class="btn_left form_wrap">
 		                        <span class="cal_label">템플릿명</span>
 		                        <!-- <select name="searchCondition" id="searchCondition" class="selType2">
 		                            <option value="2">등록상태</option>
src/main/webapp/WEB-INF/jsp/web/kakao/template/ft/KakaoFriendstalkTemplateListPopupAjax.jsp
--- src/main/webapp/WEB-INF/jsp/web/kakao/template/ft/KakaoFriendstalkTemplateListPopupAjax.jsp
+++ src/main/webapp/WEB-INF/jsp/web/kakao/template/ft/KakaoFriendstalkTemplateListPopupAjax.jsp
@@ -18,6 +18,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css?date=202301160001">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/WEB-INF/jsp/web/login/EgovLoginGnrlUsr.jsp
--- src/main/webapp/WEB-INF/jsp/web/login/EgovLoginGnrlUsr.jsp
+++ src/main/webapp/WEB-INF/jsp/web/login/EgovLoginGnrlUsr.jsp
@@ -339,7 +339,7 @@
 			<div class="mem_cont_in widthS login_wrap">
 				<div class="input_list">
 					<p class="welcome">
-						<span>문자온</span>에 오신것을 환영합니다.<br>
+						<span>문자고</span>에 오신것을 환영합니다.<br>
 						<span class="c_222 fwMd">로그인</span>해주세요.
 					</p>
 					<div class="input_list_item" id="input_list_item_1">
src/main/webapp/WEB-INF/jsp/web/login/usrCheckTerms.jsp
--- src/main/webapp/WEB-INF/jsp/web/login/usrCheckTerms.jsp
+++ src/main/webapp/WEB-INF/jsp/web/login/usrCheckTerms.jsp
@@ -417,7 +417,7 @@
                 <!-- 회원가입 약관동의 -->
                 <div class="mem_cont join2">
                     <!-- step -->
-                    <p class="welcome"><span>문자온</span>에 오신것을 환영합니다.</p>
+                    <p class="welcome"><span>문자고</span>에 오신것을 환영합니다.</p>
                     <ul class="mem_nav">
                         <li class="on">
                             <i></i>
@@ -630,7 +630,7 @@
     	<input type="hidden" id="idx" name="idx" value="" />
     	<input type="hidden" name="blineCode"  value="" />
 </form>
-<<form name="reqKMCISForm" method="post" action="#">
+<form name="reqKMCISForm" method="post" action="#">
     <input type="hidden" name="tr_cert" id="tr_cert"    value = "${tr_cert}">
     <input type="hidden" name="tr_url"   id="tr_url"   value = "${tr_url}">
     <input type="hidden" name="tr_add"  id="tr_add"     value = "${tr_add}">	
src/main/webapp/WEB-INF/jsp/web/login/usrInserCompl.jsp
--- src/main/webapp/WEB-INF/jsp/web/login/usrInserCompl.jsp
+++ src/main/webapp/WEB-INF/jsp/web/login/usrInserCompl.jsp
@@ -27,7 +27,7 @@
                <!-- 회원가입 가입완료 -->
                <div class="mem_cont join4">
                    <!-- step -->
-                   <p class="welcome"><span>문자온</span>에 오신것을 환영합니다.</p>
+                   <p class="welcome"><span>문자고</span>에 오신것을 환영합니다.</p>
                    <ul class="mem_nav">
                        <li>
                            <i></i>
src/main/webapp/WEB-INF/jsp/web/login/usrInsertView.jsp
--- src/main/webapp/WEB-INF/jsp/web/login/usrInsertView.jsp
+++ src/main/webapp/WEB-INF/jsp/web/login/usrInsertView.jsp
@@ -757,7 +757,7 @@
 				<div class="mem_cont join3">
 					<!-- step -->
 					<p class="welcome">
-						<span>문자온</span>에 오신것을 환영합니다.
+						<span>문자고</span>에 오신것을 환영합니다.
 					</p>
 					<ul class="mem_nav">
 						<li><i></i>
src/main/webapp/WEB-INF/jsp/web/login/usrSelectDept.jsp
--- src/main/webapp/WEB-INF/jsp/web/login/usrSelectDept.jsp
+++ src/main/webapp/WEB-INF/jsp/web/login/usrSelectDept.jsp
@@ -38,7 +38,7 @@
 	                </div>
 	                <!-- 회원가입 가입안내 -->
 	                <div class="mem_cont join1">
-	                    <p class="welcome"><span>문자온</span>에 오신것을 환영합니다.</p>
+	                    <p class="welcome"><span>문자고</span>에 오신것을 환영합니다.</p>
 	                    <ul>
 	                        <li>
 	                            <a href="javascript:goCheckTerms('p');">
src/main/webapp/WEB-INF/jsp/web/main/mainPage.jsp
--- src/main/webapp/WEB-INF/jsp/web/main/mainPage.jsp
+++ src/main/webapp/WEB-INF/jsp/web/main/mainPage.jsp
@@ -671,7 +671,9 @@
 		}
 		var msgPhotoSwiper = new Swiper('.msg_photo', {
 			slidesPerView: 5,
-			spaceBetween: 0,
+			slidesOffsetAfter:0,
+			slidesOffsetBefore:0,
+			spaceBetween: 20,
 			speed : 400,
 			loop: loopChk,
 			navigation: {
@@ -681,6 +683,8 @@
 			breakpoints: {
 				1500:{
 					slidesPerView:4,
+					slidesOffsetAfter:0,
+					slidesOffsetBefore:0
 				}
 			}
 		});
@@ -709,7 +713,9 @@
 		}
 		var msgLetterSwiper = new Swiper('.msg_text', {
 			slidesPerView: 5,
-			spaceBetween: 0,
+			slidesOffsetAfter:0,
+			slidesOffsetBefore:0,
+			spaceBetween: 20,
 			speed : 400,
 			loop: loopChk,
 			navigation: {
@@ -1300,114 +1306,102 @@
 <!--// visual 영역 -->
 
 <!-- new_content1 //-->
-<div class="banner_w">
-	<div class="sw_wrap">
+<div class="banner_slide">
+	<div class="banner_wrap">
 		<div class="swiper-container swiper2">
 			<div class="swiper-wrapper">
 			
-            <!-- 배너수정 250224 -->       
 			<c:choose>
 				<c:when test="${not empty subMainzoneList}">
 					<c:forEach var="sub" items="${subMainzoneList}" varStatus="status">
 						<div class="swiper-slide">
-							<div class="contWrap">
-								<c:if test="${not empty sub.mlink }">
-									<a href="<c:out value='${sub.mlink}'/>" title="페이지 이동">
-								</c:if>
-									<ul class="slide_cont1 table_cell1">
-										<li class="cont1_title"><c:out value="${sub.topTxt }" /></li>
-										<li class="cont_ex">
-												<p class="txt"><c:out value="${sub.lowTxt }" /></p>
-												<p class="bg_icon">
-									<img src="/cmm/fms/getImage.do?atchFileId=<c:out value='${sub.mainzoneImageFile}'/>" alt="<c:out value='${mainzone.content}'/>">
-												</p>
-										</li>
-										<c:if test="${not empty sub.mlink }">
-										<li class="more">자세히보기</li>
-										</c:if>
-									</ul>
-								<c:if test="${not empty sub.mlink }">
-									</a>
-								</c:if>
-							</div>
+							<c:if test="${not empty sub.mlink }">
+								<a href="<c:out value='${sub.mlink}'/>" title="페이지 이동">
+							</c:if>
+							<img src="/cmm/fms/getImage.do?atchFileId=<c:out value='${sub.mainzoneImageFile}'/>" alt="<c:out value='${mainzone.content}'/>">
+							<b class="title"><c:out value="${sub.topTxt }" /></b>
+							<span class="summary"><c:out value="${sub.lowTxt }" /></span>
+							<c:if test="${not empty sub.mlink }">
+								</a>
+							</c:if>
 						</div>
 					</c:forEach>
 				</c:when>
 				<c:otherwise>
 				
 					<div class="swiper-slide">
-						<div class="contWrap">
-							<a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do" title="페이지 이동">
-								<ul class="slide_cont1 table_cell1">
-									<li class="cont1_title">대량문자·단체문자 전송</li>
-									<li class="cont_ex">
-											<p class="txt">별도의 프로그램 설치 없이 컴퓨터로 단체·대량문자 발송 가능</p>
-											<p class="bg_icon"><img src="/publish/images/main/cont1_1.png" alt="대량문자·단체문자 전송 아이콘"></p>
-									</li>
-									<li class="more">자세히보기</li>
-								</ul>
-							</a>
-						</div>
+						<a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do" title="페이지 이동">
+							<img src="/publish/images/main/mb_massage.png" alt="대량문자·단체문자 전송 아이콘">
+							<b class="title">대량문자·단체문자 전송</b>
+							<span class="summary">한번에 최대 30만건 까지</span>
+						</a>
 					</div>
 
 					<div class="swiper-slide">
-						<div class="contWrap">
-							<a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do" title="페이지 이동" rel="nosublink">
-								<ul class="slide_cont1 table_cell1">
-									<li class="cont1_title">문자연동(API) 서비스 제공</li>
-									<li class="cont_ex">
-										<p class="txt">별도의 프로그램 설치 없이 컴퓨터로 단체·대량문자 발송 가능</p>
-										<p class="bg_icon"><img src="/publish/images/main/cont1_9.png" alt="문자연동(API) 서비스 제공 아이콘"></p>
-									</li>
-									<li class="more">자세히보기</li>
-								</ul>
-							</a>
-						</div>
+						<a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_api.png" alt="문자연동(API) 아이콘">
+							<b class="title">문자연동(API) 제공</b>
+							<span class="summary">모듈 설치없이 간단한게 문자발송</span>
+						</a>
 					</div>
 					<div class="swiper-slide">
-						<div class="contWrap">
-							<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
-								<ul class="slide_cont1 table_cell1">
-									<li class="cont1_title">그림문자 맞춤제작</li>
-									<li class="cont_ex">
-											<p class="txt">나만의 그림문자 이미지 맞춤제작으로 홍보효과 극대화</p>
-											<p class="bg_icon"><img src="/publish/images/main/cont1_2.png" alt="그림문자 맞춤제작 아이콘"></p>
-										</li>
-									<li class="more">자세히보기</li>
-								</ul>
-							</a>
-						</div>
+						<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_customize2.png" alt="그림문자 맞춤제작 아이콘">
+							<b class="title">그림문자 맞춤제작</b>
+							<span class="summary">나만의 그림문자로 홍보 극대화</span>
+						</a>
 					</div>
 					<div class="swiper-slide">
-						<div class="contWrap">      
-							<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
-									<ul class="slide_cont1 table_cell1">
-											<li class="cont1_title">주소록 등록 무료대행</li>
-											<li class="cont_ex">
-													<p class="txt">주소록 직접 등록이 어려운 고객을 위해 엑셀, TXT 파일 등 주소록 등록 무료대행</p>
-													<p class="bg_icon"><img src="/publish/images/main/cont1_3.png" alt="주소록 등록 무료대행 아이콘"></p>
-											</li>
-											<li class="more">자세히보기</li>
-									</ul>
-							</a>    
-						</div>
+						<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_080.png" alt="080수신거부 무료제공 아이콘">
+							<b class="title">080수신거부 무료제공</b>
+							<span class="summary">광고, 선거문자등 필수 무료서비스</span>
+						</a>    
+					</div>
+					<div class="swiper-slide">
+						<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_conversion.png" alt="특정문구 일괄변환 기능 아이콘">
+							<b class="title">특정문구 일괄변환 기능</b>
+							<span class="summary">수신자마다 다르게 일괄변환 </span>
+						</a>    
+					</div>
+					<div class="swiper-slide">
+						<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_photoeditor.png" alt="문자 포토에디터 무료 제공 아이콘">
+							<b class="title">문자 포토에디터 무료 제공</b>
+							<span class="summary">자사 기술의 문자 포토에디터</span>
+						</a>    
+					</div>
+					<div class="swiper-slide">
+						<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_map.png" alt="문자 제목 및 약도 추가 아이콘">
+							<b class="title">문자 제목 및 약도 추가</b>
+							<span class="summary">메시지 내 제목 및 약도 추가서비스</span>
+						</a>    
+					</div>
+					<div class="swiper-slide">
+						<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동" rel="nosublink">
+							<img src="/publish/images/main/mb_automation.png" alt="자동화 기반 비용처리 아이콘">
+							<b class="title">자동화 기반 비용처리</b>
+							<span class="summary">세금계산서, 현금영수증 등</span>
+						</a>    
 					</div>
 				</c:otherwise>
 			</c:choose>
-            <!--// 배너수정 250224 -->   
 			</div>
-			<!-- 버튼 -->
-			<div class="swiper-button-next">
-				<img src="/publish/images/main/cont1_next.png" alt="다음" />
-			</div>
-			<div class="swiper-button-prev">
-				<img src="/publish/images/main/cont1_prev.png" alt="이전" />
-			</div>
-			<!-- 페이징 -->
-			<div class="swiper-pagination"></div>
+		</div>
+	</div>
+	<div class="slide_btns">
+		<div class="swiper-button-prev">
+			<img src="/publish/images/main/cont1_prev.png" alt="이전" />
+		</div>
+		<div class="swiper-pagination"></div>
+		<div class="swiper-button-next">
+			<img src="/publish/images/main/cont1_next.png" alt="다음" />
 		</div>
 	</div>
 </div>
+
 <form id="mainImgSendForm" name="mainImgSendForm" method="post">
 	<input type="hidden" id="atchFileId1" name="atchFileId1" value=""/>
 	<input type="hidden" id="fileSn" name="fileSn" value=""/>
@@ -1431,9 +1425,9 @@
 
 	<div class="main_cont2">
 		<div class="inner">
-			<!-- <p class="tit_text">이런 문자 어때요?</p> -->
-			<p class="tit_text">이런 단체문자, 대량문자 샘플 어때요?</p>
-			<!-- <p class="sub_text">단체문자, 대량문자, 경조문자, 부고문자, 광고문자, 홍보문자, 조문문자, 결혼문자, 예약문자, 사진문자, 그림문자, SMS, LMS, MMS, 병원문자, 위로문자, 응원문자, 행사문자, 기념일문자, 웹문자, 인터넷문자, 문자사이트, 답례문자, 그룹문자 등 다양한 샘플 무료 제공</p> -->
+			<div class="contents_title">
+				<b class="title">이달의 인기문자</b>
+			</div>
 			<div class="tabs">
 				<!-- Default tab_depth1 - 전체 / tab_depth2 - 인기그림문자 / tab_depth3 - BEST -->
 				<!-- <div class="tab_depth1 tDep2_mType">
@@ -1449,10 +1443,9 @@
 					<a href="#none" value="C" class="tab_custom" rel="nosublink">인기 맞춤제작</a>
 				</div>
 				<button class="btn_custom" onclick="javascript:goCustomUrl(); return false;">
-					<img src="/publish/images/main/btn_imgicon.png" alt="맞춤제작아이콘">
 					맞춤제작요청
 				</button>
-				<div class="tab_depth3 tab_basic tDep2_cateCode">
+				<%-- <div class="tab_depth3 tab_basic tDep2_cateCode">
 					<a href="#none" value="best" class="on" rel="nosublink">BEST</a>
 					<c:forEach var="cateList" items="${cateCodeList}" varStatus="status">
 						<a href="#none" value="<c:out value='${cateList.cateCode}'/>" rel="nosublink">
@@ -1467,16 +1460,16 @@
 							<c:out value="${cateConfCustomList.cateNm}"/>
 						</a>
 					</c:forEach>
-				</div>
+				</div> --%>
 			</div>
 			<div class="tab_contwrap">
 			
-				<div id="photoLoad" style="height:490px;"></div>
+				<div id="photoLoad"></div>
 				
-				<div id="letterLoad" style="height:441px;"></div>
+				<div id="letterLoad"></div>
 				
 			</div>
-			<button type="button" class="btn_more" onclick="javascript:fnMoreSampleView(); return false;">더 많은 샘플보기</button>
+			<button type="button" class="btn_more" onclick="javascript:fnMoreSampleView(); return false;">샘플 더보기 <i class="icon more"></i></button>
 		</div>
 	</div>
 </form>
@@ -1484,60 +1477,66 @@
 <div class="main_cont3">
 	<div class="inner">
 		<div class="main_service">
-			<div class="title">
-				<span class="text_deco"></span>자주찾는 서비스
+			<div class="contents_title">
+				<b class="title">자주찾는 서비스</b>
 			</div>
 			<ul>
 				<li><a href="/web/pay/PayGuide.do" rel="nosublink"><i></i><span>요금안내</span></a></li>
 				<li><a href="/web/pay/PayGuide.do?tabType=2" rel="nosublink"><i></i><span>견적내기</span></a></li>
 				<li><a href="/web/member/pay/PayView.do" rel="nosublink"><i></i><span>충전하기</span></a></li>
-				<li><a href="#" data-tooltip="popup04" rel="nosublink"><i></i><span>포인트교환</span></a></li>
+				<li><a href="/web/mjon/addr/selectAddrList.do" rel="nosublink"><i></i><span>주소록관리</span></a></li>
 				<li><a href="/web/user/sendNumberManage.do" rel="nosublink"><i></i><span>발신번호 등록</span></a></li>
 				<!-- <li><a href="/web/member/pay/BillPub.do" rel="nosublink"><i></i><span>계산서/영수증</span></a></li> -->
 				<li><a href="/web/member/pay/BillPub.do" rel="nosublink"><i></i><span>세금계산서</span></a></li>
 			</ul>
 		</div>
 		<div class="main_notice">
-			<div class="title">
-				<span class="text_deco"></span>공지사항
+			<div class="contents_title between">
+				<b class="title">공지사항</b>
+				<button class="plus_btn" onclick="location.href='/web/cop/bbs/NoticeList.do'"></button>
 			</div>
-			<button class="plus_btn" onclick="location.href='/web/cop/bbs/NoticeList.do'">
-			</button>
+			
 			<ul>
 				<c:forEach var="result" items="${noticeList}" varStatus="status">
 					<li>
-						<a href="#" onclick="fn_egov_inqire_notice('${result.bbsId}', '${result.nttId}'); return false;" title="페이지 이동" rel="nosublink"> <span class="text_deco2"></span> <c:out value="${result.nttSj}" />
+						<a href="#" onclick="fn_egov_inqire_notice('${result.bbsId}', '${result.nttId}'); return false;" title="페이지 이동" rel="nosublink"><c:out value="${result.nttSj}" />
 						</a>
 					</li>
 				</c:forEach>
 			</ul>
 		</div>
 		<div class="service_center">
-			<div class="title">
-				<span class="text_deco"></span>고객센터
+			<div class="contents_title">
+				<b class="title">고객센터</b>
 			</div>
-			<div class="tablet table">
-				<div class="table_cell">
-					<div class="service_center_title">
-						<p>1551-8011</p>
-						<span>E-mail : help@iten.co.kr</span>
+			
+			<div class="box">
+				<div class="service_title">
+					<i class="icon service"></i>
+					<div class="info">
+						<b>1551-0811</b>
+						<span class="email">help@munjago.co.kr</span>
 					</div>
-					<div class="serive_info">
-						<p>월~금 : 09:30 ~ 18:30 / 점심시간 : 13:00 ~ 14:00<br>토, 일요일 및 법정공휴일 휴무</p>
-					</div>
-					<ul class="serive_btn">
-						<li class="kakao"><a href="http://pf.kakao.com/_PxoTtb/chat" target="_blank" rel="nosublink">카톡 상담</a></li>
-						<li class="remote"><a href="javascript:void(0);" onclick="remotePop('https://939.co.kr/munjaon/');" rel="nosublink">원격지원</a></li>
-						<li class="qnabtn"><a href="/web/cop/bbs/QnaList.do" rel="nosublink">1:1 문의</a></li>
-					</ul>
 				</div>
+				
+				<div class="service_time_info">
+					<p>월~금 : 09:30 ~ 18:30 / 점심시간 : 13:00 ~ 14:00<br>토, 일요일 및 법정공휴일 휴무</p>
+				</div>
+				
+				<ul class="service_btn">
+					<li><a href="http://pf.kakao.com/_PxoTtb/chat" target="_blank" rel="nosublink"><i class="circle kakao"></i>카톡상담</a></li>
+					<li><a href="javascript:void(0);" onclick="remotePop('https://939.co.kr/munjaon/');" rel="nosublink"><i class="circle remote"></i>원격상담</a></li>
+					<li><a href="/web/cop/bbs/QnaList.do" rel="nosublink"><i class="circle qnabtn"></i>1:1문의</a></li>
+				</ul>
+			
 			</div>
+			
 		</div>
 	</div>
 </div>
 
  
-<div class="main_cont5 keyword_wrap">
+<%-- <div class="main_cont5 keyword_wrap">
 	<div class="inner">
 		<p class="tit_text">이런 키워드는 어때요?</p>
 		<ul class="link_box">
@@ -1546,7 +1545,7 @@
        	</c:forEach>
 		</ul>
 	</div>
-</div>
+</div> --%>
 
  
     <div class="main_cont4 adv_wrap">
src/main/webapp/WEB-INF/jsp/web/msgdata/MainPhotoListAjax.jsp
--- src/main/webapp/WEB-INF/jsp/web/msgdata/MainPhotoListAjax.jsp
+++ src/main/webapp/WEB-INF/jsp/web/msgdata/MainPhotoListAjax.jsp
@@ -63,7 +63,7 @@
 						<div class="swiper-slide" onClick="javascript:fnMainImgSendMsg('${photoList.attachFileId}', '${photoList.fileSn}', '${photoList.fileStreCours}/${photoList.streFileNm}.${photoList.fileExtsn}'); return false;">
 							<div class="slide_area">
 								<div class="mask"></div>
-								<div class="btn_more"><img src="/publish/images/main/btn_more01.png" alt="" /></div>
+								<div class="btn_more"><i class="more"></i></div>
 								<div class="area_img">
 									<%-- <img src="${strImgPath}" alt="" onerror="this.src='/publish/images/main/template02.jpg';"> --%>
 									<c:set var="imgAlt" value="${photoList.letterAlt}"/>
src/main/webapp/WEB-INF/jsp/web/msgdata/MsgDataSMLView.jsp
--- src/main/webapp/WEB-INF/jsp/web/msgdata/MsgDataSMLView.jsp
+++ src/main/webapp/WEB-INF/jsp/web/msgdata/MsgDataSMLView.jsp
@@ -3973,7 +3973,7 @@
 					</c:when>
 					<c:otherwise>
 						대량문자(광고문자)
-						<button type="button" class="button info ad_btn" onclick="infoPop('adrvertisement1');" style="right: 128px;"><i></i>광고규정</button>
+						<button type="button" class="button info ad_btn" onclick="infoPop('adrvertisement1');" style="right: 100px;"><i></i>광고규정</button>
 					</c:otherwise>
 				</c:choose>
 			</h2>
@@ -4012,20 +4012,22 @@
 	                    <tr>
                             <th scope="row">발신번호</th>
                             <td class="put_num">
-                                <label for="callFrom" class="label"></label>
-                                <select id="callFromList" name="callFromList" class="sel_number">
-                                	<c:choose>
-                                		<c:when test="${not empty resultPhonList}">
-                                			<c:forEach var="phonList" items="${resultPhonList}" varStatus="status">
-												<option value="${phonList}">${phonList}</option>
-											</c:forEach>
-                                		</c:when>
-                                		<c:otherwise>
-                                			<option value="">등록된 발신 번호가 없습니다.</option>
-                                		</c:otherwise>
-                                	</c:choose>
-								</select>
-                                <button type="button" class="btnType btnType6" onclick="location.href='/web/user/sendNumberManage.do'">번호등록</button>
+                            	<div class="form_wrap left">
+	                                <label for="callFrom" class="label"></label>
+	                                <select id="callFromList" name="callFromList" class="sel_number">
+	                                	<c:choose>
+	                                		<c:when test="${not empty resultPhonList}">
+	                                			<c:forEach var="phonList" items="${resultPhonList}" varStatus="status">
+													<option value="${phonList}">${phonList}</option>
+												</c:forEach>
+	                                		</c:when>
+	                                		<c:otherwise>
+	                                			<option value="">등록된 발신 번호가 없습니다.</option>
+	                                		</c:otherwise>
+	                                	</c:choose>
+									</select>
+	                                <button type="button" class="btnType btnType6" onclick="location.href='/web/user/sendNumberManage.do'">번호등록</button>
+                                </div>
                             </td>
                         </tr>
 						<tr class="msg_title">
@@ -4278,7 +4280,7 @@
 											</div> -->
 										</div>
 									</div>
-									<div class="list_bottom clearfix">
+									<div class="list_bottom">
 										<div class="remove_btnWrap">
 											<button type="button" class="btnType15 all_del"><i class="remove_img"></i>전체삭제</button>
 											<button type="button" class="btnType15 select_del"><i class="remove_img"></i>선택삭제</button>
@@ -4382,7 +4384,7 @@
                 <div class="phone">
                    	<div class="phoneIn">
 						<div>
-							<p><img src="/publish/images/search.png">미리보기</p>
+							<p class="phone_top"><img src="/publish/images/search.png">미리보기</p>
 							<div class="text_length2 clearfix preShort">
 								<span class="msg_com msg_short">단문</span>
 								<div>
src/main/webapp/WEB-INF/jsp/web/msgdata/imageEditorPopup.jsp
--- src/main/webapp/WEB-INF/jsp/web/msgdata/imageEditorPopup.jsp
+++ src/main/webapp/WEB-INF/jsp/web/msgdata/imageEditorPopup.jsp
@@ -14,6 +14,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/popup.css">
src/main/webapp/WEB-INF/jsp/web/pay/PayGuide.jsp
--- src/main/webapp/WEB-INF/jsp/web/pay/PayGuide.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pay/PayGuide.jsp
@@ -614,7 +614,7 @@
 							</thead>
 							<tbody>
 								<tr>
-									<th>문자온 샘플 수정(글자, 색상, 폰트 등)</th>
+									<th>문자고 샘플 수정(글자, 색상, 폰트 등)</th>
 									<td><span>${customSamplePrice}</span>원</td>
 								</tr>
 								<tr>
@@ -638,7 +638,7 @@
 							<ul>
 								<li><img src="/publish/images/content/banner_call01.png" alt=""><p>전화 <strong>1551-8011</strong><p></li>
 								<li><img src="/publish/images/content/banner_email01.png" alt=""><p>이메일<span>help@iten.co.kr</span> <button type="button" onclick="location.href='mailto:help@iten.co.kr'">상담하기</button></li>
-								<li><img src="/publish/images/content/banner_kakao01.png" alt=""><p>카카오톡<span>munjaon</span><a href="http://pf.kakao.com/_PxoTtb/chat" target="_blank">상담하기</a><p></li>
+								<li><img src="/publish/images/content/banner_kakao01.png" alt=""><p>카카오톡<span>munjago</span><a href="http://pf.kakao.com/_PxoTtb/chat" target="_blank">상담하기</a><p></li>
 							</ul>
 						</div>
 					</div>
@@ -697,7 +697,7 @@
 										</tr>
 										<tr>
 											<td>맞춤제작</td>
-											<td>문자온 샘플 수정(글자, 색상, 폰트 등)</td>
+											<td>문자고 샘플 수정(글자, 색상, 폰트 등)</td>
 											<td><span>${customSamplePrice}</span>원</td>
 										</tr>
 										<tr>
src/main/webapp/WEB-INF/jsp/web/pay/PayListPointAjax.jsp
--- src/main/webapp/WEB-INF/jsp/web/pay/PayListPointAjax.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pay/PayListPointAjax.jsp
@@ -335,7 +335,7 @@
 			</tbody>
 		</table>
 		<div class="excel_middle">
-			<div class="select_btnWrap clearfix">
+			<div class="select_btnWrap">
 				<div class="add_text2">※ 포인트 교환내역은 교환일을 기준으로 최대 6개월까지만 조회 가능합니다.</div>
 				<div>
 					<button type="button" class="excel_btn" onclick="javascript:pointExcelDownload();">
src/main/webapp/WEB-INF/jsp/web/pay/PayListRefundAjax.jsp
--- src/main/webapp/WEB-INF/jsp/web/pay/PayListRefundAjax.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pay/PayListRefundAjax.jsp
@@ -461,7 +461,7 @@
 			<p>- 모든 결제는 부분취소가 불가하며, 사용금액(차액) 결제 후 전액취소를 원칙으로 합니다.</p>
 			<p>&nbsp;(예) 휴대폰 3만원 결제 후 3천원 사용한 경우, 3,300원(부가세포함)송금 또는 3천원 휴대폰 결제 후 3만원 전액취소</p>
 			<p><span>- 환불업무는 매주 수요일에 순차적으로 처리됩니다.</span></p> -->
-			<p>- 포인트는 환불되지 않습니다.</p>
+			<!-- <p>- 포인트는 환불되지 않습니다.</p> -->
 			<p>- 결제 방식에 따라 환불 수수료는 다르게 적용될 수 있습니다.</p>
 			<p>- 취소 처리기간 경과시에 증빙서류를 첨부해야 환불가능합니다.</p>
 			<p>- 모든 결제는 부분취소가 불가하여, 사용금액(차액) 결제 후 전액취소를 원칙으로 합니다.</p>
@@ -674,7 +674,7 @@
 					<th scope="row">비밀번호</th>
 					<td>
 						<label for="mberPw" class="label">비밀번호 입력</label>
-						<input type="password" name="mberPw" id="mberPw" placeholder="문자온 로그인 비밀번호를 입력해주세요." onfocus="this.placeholder=''" onblur="this.placeholder='문자온 로그인 비밀번호를 입력해주세요.'" size="36">
+						<input type="password" name="mberPw" id="mberPw" placeholder="문자고 로그인 비밀번호를 입력해주세요." onfocus="this.placeholder=''" onblur="this.placeholder='문자고 로그인 비밀번호를 입력해주세요.'" size="36">
 					</td>
 				</tr>
 				<tr>
src/main/webapp/WEB-INF/jsp/web/pay/PayView.jsp
--- src/main/webapp/WEB-INF/jsp/web/pay/PayView.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pay/PayView.jsp
@@ -1223,7 +1223,7 @@
 												<p>- 결제사별 정책상 충전금액 제한이 있을 수 있습니다.</p>
 												<p>- 간편결제 시 세금계산서 및 간이영수증은 제공되지 않습니다.</p>
 												<p>- 네이버페이 카드 결제 영수증은 네이버페이를 통해서 발급받으실 수 있습니다.</p>
-												<p>- 네이버페이 포인트 사용에 따른 현금영수증 발행은 문자온 캐시 결제과정에서 결제자가 직접 선택하여야만 요청할 수 있습니다.(결제 완료 이후 문자온에서 현금영수증 처리 불가)</p>
+												<p>- 네이버페이 포인트 사용에 따른 현금영수증 발행은 문자고 캐시 결제과정에서 결제자가 직접 선택하여야만 요청할 수 있습니다.(결제 완료 이후 문자고에서 현금영수증 처리 불가)</p>
 											</div>
 										</td>
 									</tr>
src/main/webapp/WEB-INF/jsp/web/pop/infoListPop.jsp
--- src/main/webapp/WEB-INF/jsp/web/pop/infoListPop.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pop/infoListPop.jsp
@@ -74,7 +74,7 @@
 		        </ul>
 		        <div class="info_guide_sub">
 		        	<p>※ 발송 불가 번호는 전송 시 <span>수신오류(발송실패)</span> 처리됩니다.</p>
-		        	<p>※ 보다 상세한 사항은 문자온 고객센터로 문의해 주시기 바랍니다.</p>
+		        	<p>※ 보다 상세한 사항은 문자고 고객센터로 문의해 주시기 바랍니다.</p>
 		        </div>
 		    </div>
 		</div>
@@ -251,7 +251,7 @@
 					</div>
 					<div class="adpop2_middle">
 						<p>- 규정 위반 시 공직선거법 제255조제4항에 의거 법적 제재(1년 이하의 징역 또는 100만원 이하의 벌금)를 받을 수 있습니다.</p>
-						<p>- 문자온에서는 선거문자 전송 시 선관위 규정을 최대한 준수하여 서비스를 제공하고 있으나 미미한 점이 있을 수 있습니다.<br>
+						<p>- 문자고에서는 선거문자 전송 시 선관위 규정을 최대한 준수하여 서비스를 제공하고 있으나 미미한 점이 있을 수 있습니다.<br>
 						&nbsp;선거문자 전송 시 선관위 규정을 사전에 반드시 확인하시기 바라며, 미확인으로 인한 법적책임은 전송자 본인에게 있음을<br>&nbsp;알려드립니다.</p>
 					</div>
 					<div class="adpop2_bottom">
@@ -373,7 +373,7 @@
 				</div>
 				<ul class="info_list adpop_cont current" id="listTab2_1">
 		    		<li>080 자동 수신거부 및 직접등록을 통해 등록된 번호는 광고 또는 선거문자 발송 시 자동으로 차단됩니다.</li>
-		    		<li>080 자동 수신거부 목록에 등록된 거부번호를 삭제하는 경우 정보통신망법 제76조제1항제7호에 의거 과태료가 부과될 수 있으며, 문자온은 이에 대한 어떠한 민‧형사상 책임도 지지 않습니다.</li>
+		    		<li>080 자동 수신거부 목록에 등록된 거부번호를 삭제하는 경우 정보통신망법 제76조제1항제7호에 의거 과태료가 부과될 수 있으며, 문자고는 이에 대한 어떠한 민‧형사상 책임도 지지 않습니다.</li>
 		    		<li>근거 : 정보통신망에 관한 법률‘ 제50조제7항및제62조의2(영리목적의 광고성 정보를 전송하려는 사업자는 수신거부를 표시한 날로부터 14일 이내에 수신거부 결과를 알려야 함)</li>
 		    		<li>원활한 서비스 이용을 위해 수신거부 번호는 주소록에서도 완전히 삭제하신 후 이용하시기를 권장드립니다.</li>
 		    		<li>수신거부 처리된 번호를 주소록에서 삭제하시려면 하단의 “주소록에서 삭제” 버튼을 클릭하시면 됩니다.</li>
@@ -383,7 +383,7 @@
 		    	</ul>
 				<ul class="info_list adpop_cont" id="listTab2_2">
 		    		<li>080 자동 수신거부에 등록된 번호는 광고 또는 선거문자 발송 시 자동으로 차단됩니다.</li>
-		    		<li>080 자동 수신거부 목록에 등록된 거부번호를 삭제하는 경우 정보통신망법 제76조제1항제7호에 의거 과태료가 부과될 수 있으며, 문자온은 이에 대한 어떠한 민‧형사상 책임도 지지 않습니다.</li>
+		    		<li>080 자동 수신거부 목록에 등록된 거부번호를 삭제하는 경우 정보통신망법 제76조제1항제7호에 의거 과태료가 부과될 수 있으며, 문자고는 이에 대한 어떠한 민‧형사상 책임도 지지 않습니다.</li>
 		    		<li>근거 : 정보통신망에 관한 법률‘ 제50조제7항및제62조의2(영리목적의 광고성 정보를 전송하려는 사업자는 수신거부를 표시한 날로부터 14일 이내에 수신거부 결과를 알려야 함)</li>
 		    		<li>원활한 서비스 이용을 위해 080 자동 수신거부 번호는 주소록에서도 완전히 삭제하신 후 이용하시기를 권장드립니다.</li>
 		    		<li>080 자동 수신거부 처리된 번호를 주소록에서 삭제하시려면 하단의 “주소록에서 삭제” 버튼을 클릭하시면 됩니다.</li>
@@ -439,7 +439,7 @@
 				</c:when>
 				<c:when test="${pageType == 'PayView'}">
 					<ul class="info_list">
-						<li>문자온 서비스 이용을 위해서 반드시 충전이 필수 입니다.</li>
+						<li>문자고 서비스 이용을 위해서 반드시 충전이 필수 입니다.</li>
 						<li>충전 자체로 매출 인식이 되지 않는 서비스 특성상, 부가세 신고는 전자 세금계산서로만 가능합니다.</li>
 						<li>모든 요금은 VAT별도 금액입니다.</li>
 			    	</ul>
@@ -457,7 +457,7 @@
 						<li>세금계산서는 결제일로부터 영업일 기준 3일 소요되며, 업체 등록한 담당자 이메일로 자동 발행됩니다(결제일로부터 다음달 9일까지 신청가능)</li>
 						<li>신청기간이 지난 세금계산서 결제내역은 자동발행이 되지 않습니다.</li>
 						<li>카드전표 또는 현금영수증을 발행한 건의 경우에는 세금계산서 발행이 불가합니다.</li>
-						<li>전자세금계산서는 발행과 동시에 국세청에 전송되기 때문에 폐기 및 정정이 불가하며, 수정이 필요한 경우 문자온 담당자에게 별도로 수정 세금계산서 발행을 요청(전화 또는 이메일)하셔야 합니다.</li>
+						<li>전자세금계산서는 발행과 동시에 국세청에 전송되기 때문에 폐기 및 정정이 불가하며, 수정이 필요한 경우 문자고 담당자에게 별도로 수정 세금계산서 발행을 요청(전화 또는 이메일)하셔야 합니다.</li>
 						<li>  또한, 기존 세금계산서와 수정 세금계산서 모두를 부가세 신고하여야 합니다.</li>
 						<!-- <li>세금계산서 자동발행 등록 시 현금영수증 발행화면은 비활성화 됩니다.</li> -->
 						<li>무통장, 전용계좌는 송금액에서 공급가액이 충전됩니다(VAT 별도)</li>
src/main/webapp/WEB-INF/jsp/web/pop/kakaoAtPop.jsp
--- src/main/webapp/WEB-INF/jsp/web/pop/kakaoAtPop.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pop/kakaoAtPop.jsp
@@ -14,7 +14,7 @@
 	<div class="layer_in">
 		<ul class="info_list">
 			<li>승인된 템플릿만 알림톡 발송이 가능합니다. (카카오 운영자가 검수 후 승인, 영업일 기준 2~3일 소요)</li>
-			<li>문자온이 제공하지 않는 이모티콘, 이모지가 포함될 경우 템플릿이 승인되어도 알림톡 발송이 불가합니다.</li>
+			<li>문자고에서 제공하지 않는 이모티콘, 이모지가 포함될 경우 템플릿이 승인되어도 알림톡 발송이 불가합니다.</li>
 			<li>템플릿 등록 후, 템플릿 심사요청을 진행해야 카카오  검수요청이 진행됩니다.</li>
 			<li>승인된 템플릿은 수정/삭제가 불가합니다.</li>
 		</ul>
src/main/webapp/WEB-INF/jsp/web/pop/kakaoFtPop.jsp
--- src/main/webapp/WEB-INF/jsp/web/pop/kakaoFtPop.jsp
+++ src/main/webapp/WEB-INF/jsp/web/pop/kakaoFtPop.jsp
@@ -21,9 +21,9 @@
         <li>(광고) 표기 사용 여부는 선택 가능하나, (광고) 표기 해제에 따른 법규 의무사항 미준수 시, 메시지 발송이 중단될 수 있습니다.</li>
         <li>예약 메시지는 수정 가능하며, 예약 발송시간 5분전까지만 취소·삭제 가능합니다.</li>
          -->
-        <li>친구톡은 알림톡과 달리 별도의 템플릿 심사가 필요하지 않습니다.</li> 
+        <li>- 브랜드메시지는 알림톡과 달리 별도의 템플릿 심사가 필요하지 않습니다.</li> 
 		<li>등록된 템플릿은 자유롭게 삭제가 가능합니다.</li>
-		<li>문자온이 제공하지 않는 이모티콘, 이모지를 포함하여 템플릿을 등록할 경우, 친구톡 발송이 불가합니다.</li>
+		<li>문자고에서 제공하지 않는 이모티콘, 이모지를 포함하여 템플릿을 등록할 경우, 친구톡 발송이 불가합니다.</li>
       </ul>
     </div>
   </div>
src/main/webapp/WEB-INF/jsp/web/user/sendNumberManage.jsp
--- src/main/webapp/WEB-INF/jsp/web/user/sendNumberManage.jsp
+++ src/main/webapp/WEB-INF/jsp/web/user/sendNumberManage.jsp
@@ -274,7 +274,7 @@
 					<!-- 발신번호 관리 수정 -->
 					<div class="call_number_pop">
 						<ul class="call_numbber_list">
-					    	<li>- 타인/타사의 휴대전화(또는 일반전화)를 발신번호로 등록하기 위해서는  대리인(문자온 가입자)의 신분증 사본을 제출하여야 합니다.</li>
+					    	<li>- 타인/타사의 휴대전화(또는 일반전화)를 발신번호로 등록하기 위해서는  대리인(문자고 가입자)의 신분증 사본을 제출하여야 합니다.</li>
 					    	<li>- 개인회원 : <strong>타인 휴대전화(or 일반전화)</strong> 발신번호 등록 시 제출</li>
 					    	<li>- 기업회원 : <strong>타사 휴대전화(or 일반전화)</strong> 발신번호 등록 시 제출</li>
 						</ul>
@@ -283,7 +283,7 @@
 							<ul class="call_numbber_list">
 								<li>· 신분증 사본 제출 시 주민번호 뒷자리는 마스킹 처리(개인정보 보호)</li>
 								<li>· 제출 가능한 신분증 : 주민등록증, 운전면허증, 여권</li>
-								<li>· 대리인 = <strong>문자온 가입자(O)</strong> 발신번호 명의자(X)</li>
+								<li>· 대리인 = <strong>문자고 가입자(O)</strong> 발신번호 명의자(X)</li>
 							</ul>
 						</div>
 					</div>
@@ -311,12 +311,12 @@
 				<div class="layer_in pro_layer_in">
 					<!-- 발신번호 관리 수정 -->
 					<div class="pro_btn_wrap">
-						<button type="button" class="button attorney btn" onclick="location.href='/download/number/문자온_발신번호_등록_위임장_양식.zip'">위임장 다운로드</button>
+						<button type="button" class="button attorney btn" onclick="location.href='/download/number/문자고_발신번호_등록_위임장_양식.zip'">위임장 다운로드</button>
 					</div>
 					<div class="call_number_pop">
 						<p class="pro_tit">타인 또는 타사의 휴대전화 및 일반전화 발신번호 등록을 위해서는 <br><span>위임장 제출이 필수</span>입니다.</p>
 						<ul class="call_numbber_list">
-					    	<li>- 위임자(발신번호 명의자)와 수임자(문자온 가입자)를 구분하여 작성</li>
+					    	<li>- 위임자(발신번호 명의자)와 수임자(문자고 가입자)를 구분하여 작성</li>
 					    	<li>- 개인정보 수집 이용 동의 체크</li>
 					    	<li>- 위임자가 법인일 경우 도장 날인, 개인일경우 자필 서명</li>
 						</ul>
src/main/webapp/WEB-INF/jsp/web/user/sendNumberManageRegister.jsp
--- src/main/webapp/WEB-INF/jsp/web/user/sendNumberManageRegister.jsp
+++ src/main/webapp/WEB-INF/jsp/web/user/sendNumberManageRegister.jsp
@@ -1245,7 +1245,7 @@
 					<!-- 발신번호 관리 수정 -->
 					<div class="call_number_pop">
 						<ul class="call_numbber_list">
-					    	<li>- 타인/타사의 휴대전화(또는 일반전화)를 발신번호로 등록하기 위해서는  대리인(문자온 가입자)의 신분증 사본을 제출하여야 합니다.</li>
+					    	<li>- 타인/타사의 휴대전화(또는 일반전화)를 발신번호로 등록하기 위해서는  대리인(문자고 가입자)의 신분증 사본을 제출하여야 합니다.</li>
 					    	<li>- 개인회원 : <strong>타인 휴대전화(or 일반전화)</strong> 발신번호 등록 시 제출</li>
 					    	<li>- 기업회원 : <strong>타사 휴대전화(or 일반전화)</strong> 발신번호 등록 시 제출</li>
 						</ul>
@@ -1254,7 +1254,7 @@
 							<ul class="call_numbber_list">
 								<li>· 신분증 사본 제출 시 주민번호 뒷자리는 마스킹 처리(개인정보 보호)</li>
 								<li>· 제출 가능한 신분증 : 주민등록증, 운전면허증, 여권</li>
-								<li>· 대리인 = <strong>문자온 가입자(O)</strong> 발신번호 명의자(X)</li>
+								<li>· 대리인 = <strong>문자고 가입자(O)</strong> 발신번호 명의자(X)</li>
 							</ul>
 						</div>
 					</div>
src/main/webapp/download/number/문자고_발신번호_등록_위임장_양식.zip (Binary) (Renamed from src/main/webapp/download/number/문자온_발신번호_등록_위임장_양식.zip (Binary))
--- src/main/webapp/download/number/문자온_발신번호_등록_위임장_양식.zip
+++ src/main/webapp/download/number/문자고_발신번호_등록_위임장_양식.zip
Binary file is not shown
src/main/webapp/publish/adrEnroll.html
--- src/main/webapp/publish/adrEnroll.html
+++ src/main/webapp/publish/adrEnroll.html
@@ -7,23 +7,24 @@
     <title>문자온</title>
 
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
-    <link rel="stylesheet" href="css/reset.css">
-    <link rel="stylesheet" href="css/jquery.mCustomScrollbar.css">
-    <link rel="stylesheet" href="css/common.css">
-    <link rel="stylesheet" href="css/button.css">
-    <link rel="stylesheet" href="css/content.css">
-    <link rel="stylesheet" href="css/mem.css">
-    <link rel="stylesheet" href="css/font.css">
-    <link rel="stylesheet" href="css/popupLayer.css">
-    <link rel="stylesheet" href="css/adrbook.css">
+    <link rel="stylesheet" href="/publish/css/reset.css">
+    <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
+    <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
+    <link rel="stylesheet" href="/publish/css/button.css">
+    <link rel="stylesheet" href="/publish/css/content.css">
+    <link rel="stylesheet" href="/publish/css/mem.css">
+    <link rel="stylesheet" href="/publish/css/font.css">
+    <link rel="stylesheet" href="/publish/css/popupLayer.css">
+    <link rel="stylesheet" href="/publish/css/adrbook.css">
     
     
-    <script src="js/jquery-3.5.0.js"></script>
-    <script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
-    <script src="js/common.js"></script>
-    <script src="js/content.js"></script>
-    <script src="js/calendar.js"></script>
-	<script src="js/popupLayer.js"></script>
+    <script src="/publish/js/jquery-3.5.0.js"></script>
+    <script src="/publish/js/jquery.mCustomScrollbar.concat.min.js"></script>
+    <script src="/publish/js/common.js"></script>
+    <script src="/publish/js/content.js"></script>
+    <script src="/publish/js/calendar.js"></script>
+	<script src="/publish/js/popupLayer.js"></script>
 
 
 </head>
src/main/webapp/publish/adrbook1.html
--- src/main/webapp/publish/adrbook1.html
+++ src/main/webapp/publish/adrbook1.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/adrbook2.html
--- src/main/webapp/publish/adrbook2.html
+++ src/main/webapp/publish/adrbook2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/adrbook3.html
--- src/main/webapp/publish/adrbook3.html
+++ src/main/webapp/publish/adrbook3.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/adrbook_fax.html
--- src/main/webapp/publish/adrbook_fax.html
+++ src/main/webapp/publish/adrbook_fax.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/api_admin1.html
--- src/main/webapp/publish/api_admin1.html
+++ src/main/webapp/publish/api_admin1.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/api_admin2.html
--- src/main/webapp/publish/api_admin2.html
+++ src/main/webapp/publish/api_admin2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/api_admin3.html
--- src/main/webapp/publish/api_admin3.html
+++ src/main/webapp/publish/api_admin3.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/api_admin4.html
--- src/main/webapp/publish/api_admin4.html
+++ src/main/webapp/publish/api_admin4.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/api_download.html
--- src/main/webapp/publish/api_download.html
+++ src/main/webapp/publish/api_download.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/api_guide.html
--- src/main/webapp/publish/api_guide.html
+++ src/main/webapp/publish/api_guide.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/api_intro.html
--- src/main/webapp/publish/api_intro.html
+++ src/main/webapp/publish/api_intro.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/css/adrbook.css
--- src/main/webapp/publish/css/adrbook.css
+++ src/main/webapp/publish/css/adrbook.css
@@ -24,7 +24,7 @@
 .check_group_all.adr_cb_wrap img{display:none;}
 .check_group_all.adr_cb_wrap>p {padding:0 0 0 5px;}
 .adr_cb_wrap p input[type="text"] {width: 100%; height: 28px; border: 1px solid #ccc;}
-.adr_cb_wrap span span {color: #002c9a; font-weight: 500;}
+.adr_cb_wrap span span {color: var(--primary-color); font-weight: 500;}
 
 .adr1_exprot {margin-top: 15px;}
 .adr1_exprot p {float: left; font-size: 16px; font-weight: 500;}
@@ -46,7 +46,7 @@
 
 .search_group_bottom {display: flex; justify-content: space-between; margin-top: 10px;}
 .search_group_bottom input[type="text"] {  background-color: #fff; width: calc(100% - 75px); height: 40px; border-radius: 5px;}
-.search_group_bottom button {width: 70px; height: 40px; background-color: #fff; color: #002c9a; border-radius: 5px; border: 1px solid #002c9a;}
+.search_group_bottom button {width: 70px; height: 40px; background-color: #fff; color: var(--primary-color); border-radius: 5px; border: 1px solid var(--primary-color);}
 .qmMark {background-image: url(/publish/images/content/qmIcon_xs.png); width: 15px; height: 15px; margin: 0 0 2px 4px;}
 
 
@@ -84,17 +84,17 @@
 .search_group_bottom2 .btnWrap2::before {content: ""; position: absolute; width: 1px; height: 20px; background-color: #ccc; right: -6%; top: 50%; transform: translateY(-50%);}
 .search_group_bottom2 .btnWrap2 .selType2 {width: 150px;}
 .search_group_bottom2 .btnWrap3 .selType2 {width: 105px;}
-.search_group_bottom2 .btnWrap3 .btnType {background-color: #002c9a; color: #fff; border: 1px solid transparent; padding: 0 10px; }
-.search_group_bottom2 .btnWrap3 .btnType:last-child {color:#002c9a;border-color:#002c9a;background:#fff;}
+.search_group_bottom2 .btnWrap3 .btnType {background-color: var(--primary-color); color: #fff; border: 1px solid transparent; padding: 0 10px; }
+.search_group_bottom2 .btnWrap3 .btnType:last-child {color:var(--primary-color);border-color:var(--primary-color);background:#fff;}
 
 /* 주소록 등록 ㄱ~ㅎ 탭 */
 .tabType7 {width: calc(100% - 80px);border-radius:10px 10px 0 0; border: 1px solid #e5e5e5; display: flex;text-align: center;margin-bottom: 20px;position: relative;background-color: #fff;}
-.tabType7::after {position: absolute;height: 2px;background-color: #000;width: calc(100% + 80px); content: "";bottom: 0;left: 0; z-index: 1;}
+.tabType7::after {position: absolute;height: 2px;background-color: #1E3862;width: calc(100% + 80px); content: "";bottom: 0;left: 0; z-index: 1;}
 .tabType7 li {width: calc(100% /17);}
 .tabType7 li button {width: 100%; height: 45px; padding: 10px 0; border-radius: 10px 0 0 0; font-size: 17px;border-right: 1px solid #e5e5e5;background-color: #fff; font-weight: 300;}
 .tabType7 li:first-child {width: 80px !important; border-right: 0;border-radius: 10px 0 0 0; z-index: 1;}
 .tabType7 li:last-child button {border-radius: 0 10px 0 0; border-right: 0;}
-.tabType7 li.active button {background-color: #46484a; height: 45px; border-radius:10px 10px 0 0;color: #fff;border-left: 1px solid transparent;}
+.tabType7 li.active button {background-color: #1E3862; height: 45px; border-radius:10px 10px 0 0;color: #fff;border-left: 1px solid transparent;}
 
 /* 주소록관리 리스트 */
 .adr_list.tb_wrap{min-height: 428px; margin-top: 10px;}
@@ -119,7 +119,7 @@
 .adr_cont .tType4 tbody td {position: relative;}
 .adr_2 input[type="text"]{width: calc(100% - 35px);}
 .adr_2 .tType4 .btnType20{width: auto;padding: 0 8px;}
-.adr_2 .tType4 .btnType20 span{ margin-left: 0px; background-color: #002c9a; color: #fff; width: 18px; height: 18px; display: inline-block; border-radius: 100%; vertical-align: middle; line-height: 1.2; text-align: center; margin-top: -2px;}
+.adr_2 .tType4 .btnType20 span{ margin-left: 0px; background-color: var(--primary-color); color: #fff; width: 18px; height: 18px; display: inline-block; border-radius: 100%; vertical-align: middle; line-height: 1.2; text-align: center; margin-top: -2px;}
 
 .adr2_hover_cont {position: absolute; background-color: #fff; width: 200px; padding: 15px; border-radius: 5px; box-sizing: border-box ;box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.15); top: 35px; right: 15px; z-index: 9; text-align: left;font-size: 14px; color: #222; display: none;}
 .adr2_hover_cont p { font-weight: 500; padding-bottom: 5px;}
@@ -162,12 +162,12 @@
 .adr_depth3 li::before {content: "";position: absolute;top: 47%;right: 15px; width: 1px;height: 15px;background: #d5d5d5;transform: translateY(-50%);}
 .adr_depth3 li:last-child::before {content: none;}
 .adr_depth3 li button { font-size: 18px; color: #666; font-weight: 300;}
-.adr_depth3 li.active button { color: #002c9a; font-weight: 500; position: relative; }
+.adr_depth3 li.active button { color: var(--primary-color); font-weight: 500; position: relative; }
 .adr_depth3 li.active button::after {content: ""; position: absolute; width: 90%; height: 9px; background-color: rgba(0,44,154,0.15);bottom: -1px; left: 50%; transform: translateX(-50%);}
 
 .addWrap {width:100%;padding:40px 10px 40px 40px;box-sizing: border-box;border-radius: 10px;box-shadow:0px 0px 10px 5px rgb(0 0 0 / 9%);}
 .add_and {width:100%;display: flex;flex-flow: wrap;justify-content: flex-start;align-items: flex-start;flex-direction: row;}
-.add_and li {position:relative;width: calc(89%/4);background-color:#eaeaea;border-radius: 15px;margin: 25px 0;margin-right: 32px;padding: 45px 0 15px 0;text-align:center;font-size:18px;color:#222;line-height: 30px;letter-spacing: -1px;}
+.add_and li {position:relative;width: calc(89%/4);background-color:#eaeaea;border-radius: 15px;margin: 25px 0;margin-right: 32px;padding: 45px 0 15px 0;text-align:center;font-size:18px;color:#222;line-height: 30px;letter-spacing: -1px;align-self:normal;}
 .add_and li strong {font-weight:500;}
 .addWrap.android .add_and li:last-child {width:calc(100%);}
 .add_and li:nth-child(4), .add_and li:nth-child(8) {margin-right:0;}
@@ -180,25 +180,16 @@
 .add_and .number {position:absolute;top:-25px;left:50%;transform:translate(-50%, 0);background:url('/publish/images/content/btn_addBg.png') no-repeat 0 0;width:61px;height:61px;background-size: 100%;color:#fff;font-size:16px;text-align: center;line-height:60px;letter-spacing: 0;}
 .addWrap.iphone .add_and li:last-child {width: calc(72.5%);margin-right: 0 !important;padding-bottom: 20px;}
 .addWrap.vcf {margin-top:40px;}
-.addWrap.galaxy {margin-top:40px;}
-.addWrap.iphone.vCard{display:none;}
 .addWrap .btnWrap {text-align:center;margin: 20px 0;}
 .addWrap .btnWrap button {width:220px;height:60px;font-size:20px;border-radius: 5px;transition: 0.3s ease;}
 .addWrap .btnWrap button:hover {box-shadow:0px 0px 5px 4px rgb(0 44 154 / 15%);transition: 0.3s ease;}
-.addWrap .btnWrap button:nth-child(1) {background-color:#002c9a;color:#fff;margin-right:5px;}
-.addWrap .btnWrap button:nth-child(2) {background-color:#fff;color:#002c9a;border:1px solid #002c9a;}
+.addWrap .btnWrap button:nth-child(1) {background-color:var(--primary-color);color:#fff;margin-right:5px;}
+.addWrap .btnWrap button:nth-child(2) {background-color:#fff;color:var(--primary-color);border:1px solid var(--primary-color);}
 
-
-.addWrap.iphone.vCard li{position:relative;width:calc((100%/4) - 32px);height:480px;}
-.addWrap.iphone.vCard li:nth-child(n+4){height:440px;}
-.addWrap.iphone.vCard img{position:absolute;width:100%;bottom:0;left:0;}
-.addWrap.iphone.vCard li:nth-child(2){width:47%;}
-.addWrap.iphone.vCard li:nth-child(3)::after{display:none;}
-.addWrap.iphone.vCard li:nth-child(4){margin:25px 32px 25px 0;}
-.addWrap.iphone.vCard .add_and li:nth-child(4)::after{display:block;background: url(/publish/images/content/icon_arrR.png) no-repeat 0 0;}
-.addWrap.iphone.vCard .add_and li:last-child{width:calc((100%/4) - 32px);}
+.addWrap.iphone .add_and li:nth-child(6) img{width:auto;}
 
 /* 주소록 등록_수정 */
+.adr_cont .tabType1 li button{height:53px;font-size:16px;}
 .eleType_cont.current.address{margin:40px 0 0 0;}
 .addWrap.android .add_and .nine {width:calc(100%);}
 .addWrap.android .add_and .nine::after {content:'';background:none;}
@@ -238,16 +229,6 @@
     .search_group_bottom2 .btnWrap2::after {display:none;}
     .search_group_bottom2 .btnWrap2::before {display:none;}
     .search_group_bottom2 .btnWrap2 .selType2 {width:125px;}
-    
-    /* 폰주소록 등록 */
-    .addWrap.iphone.vCard li{width:calc((100%/3) - 32px);height:550px}
-    .addWrap.iphone.vCard li:nth-child(n+4){height:550px;}
-    .addWrap.iphone.vCard li:nth-child(2){width:63%;}
-    .addWrap.iphone.vCard li:nth-child(2)::after,.addWrap.iphone.vCard li:nth-child(5)::after{display:none;}
-    .addWrap.iphone.vCard li:nth-child(3)::after{display:block;}
-    .addWrap.iphone.vCard li:nth-child(4){margin:25px 32px 25px 0;}
-    .addWrap.iphone.vCard .add_and li:nth-child(4)::after{display:block;background: url(/publish/images/content/icon_arrR.png) no-repeat 0 0;}
-    .addWrap.iphone.vCard .add_and li:last-child{width:calc((100%/3) - 32px);}
 
 }
 
src/main/webapp/publish/css/button.css
--- src/main/webapp/publish/css/button.css
+++ src/main/webapp/publish/css/button.css
@@ -1,103 +1,126 @@
-/* 버튼 및 인풋 타입 */
-select {border: 1px solid #e5e5e5;vertical-align: middle;font-weight: 300;font-size: 16px;font-family: 'Noto Sans KR', sans-serif;}
-select.selType1 {height: 34px;padding:0 25px 0 10px;border: 1px solid #d5d5d5;border-radius: 3px;background-image: url(/publish/images/select_search2.png);background-repeat: no-repeat;background-position: right 5px top 50%;color: #777;}
-/* .area_tabs */
-select.selType2 {height: 36px; align-self: center; width: 125px; color: #666; background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 92% center; padding-left: 12px; box-sizing: border-box; border-radius: 3px; border: 1px solid #ccc;margin-left: 2px;  font-size: 16px;}
-.list_selType1:focus {outline: none;}
-select.list_selType1 {background-color: transparent; border: none; width: 100%; padding: 0 15px; background-image: url(/publish/images/mem/list_select.png);background-repeat: no-repeat;background-position: right 0 top 50%; font-size: 18px; color: #222; font-family: 'Noto Sans KR', sans-serif; cursor: pointer;}
+/* Input, Textarea 등 form 관련 레이아웃 */
+.form_wrap{display:flex;justify-content:space-between;align-items:center;gap:8px;}
+.form_wrap.column{flex-direction:column;gap:4px;}
 
-input {border: 0;vertical-align: middle;box-sizing: border-box; font-family: 'Noto Sans KR', sans-serif; }
-input:focus {outline: none;}
-input::placeholder {font-family: 'Noto Sans KR', sans-serif; font-weight: 300;color: #a6a6a6 !important;}
-input:-ms-input-placeholder {font-family: 'Noto Sans KR', sans-serif; font-weight: 300;color: #a6a6a6 !important;}
-input[type="text"] {padding: 0 10px; border-radius: 3px;font-size: 16px;}
-input[type="text"].readonly::placeholder {color: #222 !important;}
-input[type="text"].readonly:-ms-input-placeholder {color: #222 !important;}
-input[type="text"].inputLight::placeholder {color: #a6a6a6 !important;}
-input[type="text"].inputLight:-ms-input-placeholder {color: #a6a6a6 !important;}
-input[type="password"] {padding: 0 10px; border-radius: 3px;font-size: 16px;}
-input[type="password"].inputLight::placeholder {color: #a6a6a6 !important;}
-input[type="password"].inputLight:-ms-input-placeholder {color: #a6a6a6 !important;}
+.form_wrap>div{display:flex;flex:1;gap:8px;}
+.form_wrap.left, .form_wrap .left{justify-content:flex-start;}
+.form_wrap.center,.form_wrap .center{justify-content:center;}
+.form_wrap.right,.form_wrap .right{justify-content:flex-end;}
 
-input.input_text{border:1px solid #d5d5d5;}
- /* 비밀번호 css 변경 */
 
-input[type="checkbox"] {width: 16px; height: 16px; border: 1px solid #d6d8da;}
-input[type="radio"] {margin-top: 2px; margin-right: 3px;}
-input[type="radio"]+label {margin-right: 18px;font-size:16px;vertical-align: middle;}
-input[type="radio"].radio_big {margin:0;width:16px;height:16px;}
-/* input[type="radio"]+label, input[type="checkbox"]+label {vertical-align: middle;}  */
-textarea {width: 100%;font-size: 16px;padding: 15px; box-sizing: border-box;color: #666;font-weight: 300;font-family: 'Noto Sans KR', sans-serif;}
-textarea::-webkit-scrollbar {width:7px;}
-textarea::-webkit-scrollbar-thumb {background: #c3c6c7; border-radius: 3px;}
-textarea::-webkit-scrollbar-thumb:active {background: 6#808080;}
-textarea::placeholder {font-family: 'Noto Sans KR', sans-serif; font-weight: 300;color: #a6a6a6 !important;}
-textarea:-ms-input-placeholder {font-family: 'Noto Sans KR', sans-serif; font-weight: 300;color: #a6a6a6 !important;}
+/* 버튼 레이아웃 */
+.btn_wrap{display:flex;justify-content:space-between;gap:8px;}
+.btn_wrap.column{flex-direction:column;gap:4px;}
+
+.btn_wrap>div{display:flex;flex:1;gap:8px}
+.btn_wrap.left, .btn_wrap .left{justify-content:flex-start;}
+.btn_wrap.center,.btn_wrap .center{justify-content:center;}
+.btn_wrap.right,.btn_wrap .right{justify-content:flex-end;}
 
 .center_btn_wrap {margin:30px 0 0;text-align:center;}
 
+/* 버튼 스타일 */
+.btn{border-radius: 5px;}
+.btn:hover{box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);transition: all 0.3s ease;}
+
+.btn.only_text{padding:0 !important;}
+.btn.only_icon{padding:0 !important;}
+.btn.mix{display:flex;align-items:center;}
+.btn.mix .icon{height:100%;background-size:contain;}
+
+.btn.xssmall{height: 28px;}
+.btn.ssmall{height: 30px;}
+.btn.small{height: 32px;}
+.btn.medium{height: 34px;}
+.btn.large{height: 36px;}
+.btn.xlarge{height: 38px;}
+
+.btn.fill.primary{background-color: var(--primary-color);color: #fff;}
+.btn.fill.primary:hover{background-color: var(--primary-color-hover);color: #fff;}
+.btn.fill.primary_light{background-color: var(--primary-light-color);border: 1px solid var(--primary-light-border);color:#222;}
+.btn.fill.primary_light:hover{background-color: var(--primary-light-color-hover);}
+.btn.fill.secondary{background-color: var(--secondary-color);color: #222;}
+.btn.fill.secondary:hover{background-color: var(--secondary-color-hover);color: #222;}
+.btn.fill.red{background-color: var(--red-color);color: #fff;}
+.btn.fill.red:hover{background-color: var(--red-color-hover);}
+.btn.fill.green{background-color: var(--green-color);color: #fff;}
+.btn.fill.green:hover{background-color: var(--green-color-hover);}
+
+.btn.line.primary{border: 1px solid var(--primary-color);color: var(--primary-color);}
+.btn.line.primary:hover{border: var(--primary-color-hover);color: var(--primary-color-hover);}
+.btn.line.secondary{border: 1px solid var(--secondary-color);color: #222;}
+.btn.line.secondary:hover{border: 1px solid var(--secondary-color-hover);}
+.btn.line.red{border: 1px solid var(--red-color);color: var(--red-color);}
+.btn.line.red:hover{border: var(--red-color-hover);color: var(--red-color-hover);}
+.btn.line.green{border: 1px solid var(--green-color);color: var(--green-color);}
+.btn.line.green:hover{background-color: var(--green-color-hover);}
+
+.btn.fill.disabled,.btn.fill.readonly,.btn.fill:disabled{background:var(--disable-fill-bg-color) !important; color:var(--disable-fill-text-color) !important; pointer-events:none;}
+.btn.line.disabled,.btn.line.readonly,.btn.line:disabled{background:var(--disable-line-bg-color) !important;border:1px solid var(--disable-line-border-color);color:var(--disable-line-text-color) !important;pointer-events:none;}
+
+
 /* button type */
-.btnType {text-align: center;font-size: 16px;border-radius: 5px;}
-.btnType:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.btnType1 {background-color: #eea301;color: #fff;height: 36px;padding: 0 14px;}
-.btnType1:hover {background-color:#f8bd0e ;}
-.btnType2 {background-color: #002c9a !important; color: #fff !important; height: 36px; padding: 0 6px;}
-.btnType2:hover {background-color:#002788;}
-.btnType3 {background-color: #fff; color: #002c9a;height: 36px;padding: 0 6px;border: 1px solid #002c9a;}
-.btnType3:hover {border: 1px solid #002788;color: #002788;}
-.btnType4 {background-color: #8e8e8e; color: #fff;width: 90px; height: 26px;padding-right: 10px; border-radius: 13px;font-size: 14px;background-image: url(/publish/images/arrow1.png);background-repeat: no-repeat;background-position:86% center;vertical-align: inherit;}
-.btnType4:hover {background-color:#a3a3a3;}
-.btnType5 {background-color: #fff; color: #002c9a;height: 28px;padding: 0 7px;border: 1px solid #002c9a;}
-.btnType5:hover {border: 1px solid #002788;color: #002788;}
-.btnType6 {background-color: #e8f0ff !important;height: 40px;padding: 0 16px;border: 1px solid #b1c6ee !important; font-weight: 400;}
-.btnType6:hover {border: 1px solid #97b1e1;}
-.btnType7 {background-color: #fff;width: 100%; max-width: 190px; height: 40px;border: 1px solid #b1b1b1;font-weight: 300;}
-.btnType7:hover {border: 1px solid #a3a3a3;}
-.btnType8 {background-color: #fbc72b;max-width: 190px;height: 40px;font-weight: 300;}
-.btnType8:hover {background-color:#f8bd0e;}
-.btnType9 {background-color: #6a6c72 !important;max-width: 93px;height: 40px;font-weight: 300;color: #fff !important;}
-.btnType9:hover {background-color:#56585e ;}
-.btnType10 {background-color: #fff;height: 50px;border: 1px solid #002c9a; color: #002c9a;font-size: 20px;}
-.btnType10:hover {border: 1px solid #002788;color: #002788;}
-.btnType11 {background-color: #002c9a;height:50px;color: #fff;font-size: 20px;}
-.btnType11:hover {background-color: #002788;color: #fff;}
-.btnType12 {background-color: #fff; height: 32px;border: 1px solid #b1b1b1;font-weight: 300;font-size: 14px;}
-.btnType12:hover {border: 1px solid #a3a3a3;}
-.btnType13 {color: #fff;height: 32px;font-weight: 300;font-size: 14px;}
-.btnType13.c1 {background-color: #2a57c8;border: 1px solid #2a57c8;}
-.btnType13.c2 {background-color: #0b96d0;border: 1px solid #0b96d0;}
-.btnType13.c3 {background-color: #129738;border: 1px solid #129738;}
-.btnType14 {background-color: #fff; height: 36px; padding: 0 10px; border: 1px solid #b9b9b9;border-radius: 5px;font-size: 14px;font-weight: 400;color: #555;letter-spacing: -1px;}
-.btnType14:hover {border: 1px solid #b1b1b1;}
-.btnType15{border: 1px solid #d5d5d5;border-radius: 5px; background-color: #fff;height: 32px;width: 80px;margin-right: 2px;}
-.btnType15:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.btnType16 {background-color: #002c9a; height: 50px; padding: 0 39px; color: #fff;font-size: 18px;}
-.btnType17 {background-color: #999 !important; width: 144px; height: 50px;color: #fff !important;font-size: 18px; }
-.btnType18 {background-color: #fff; color: #002c9a; width: 145px; height: 50px; border: 1px solid #002c9a; font-size: 18px;}
-.btnType18:hover {border: 1px solid #002788;color: #002788;}
-.btnType19{border: 1px solid #d5d5d5;border-radius: 5px; background-color: #fff;height: 50px;padding: 0 16px; margin-right: 2px;}
-.btnType20{border: 1px solid #d5d5d5; height: 28px; width: 70px; font-size: 14px; font-weight: 400; color: #555; line-height: 1.5; margin:3px 0 0 0;}
-.btnType21 {height:36px;padding:0 14px;color:#222;background-color:#f8bd0e;}
-.btnType21:hover {background-color:#eea301;}
-.btnType22 {height:28px;padding:0 12px;font-size:14px;color:#222;background-color:#f8bd0e; font-weight:500;}
-.btnType22:hover {background-color:#eea301;}
-.btnType23 {background:#6a6c72; color:#fff; border-radius: 5px; font-size:14px; font-weight: 400; padding:4px 13px; margin:0 3px;} /*api에 사용*/
-.btnType24 {background:#fff; border: 1px solid #8697c2; color: #002c9a; height: 28px; width: 70px; font-size: 14px; font-weight: 400; line-height: 1.5; margin:3px 0;} /*재사용 버튼 추가*/
-.btnType25 {background:#999; color:#fff; font-size:14px; width:76px; height:26px;line-height: 1.5;}
+.btnType,[class^="btnType"]{font-size:16px;font-weight:400;border-radius:3px;text-align:center;}
+.btnType:hover{box-shadow:0px 0px 10px 0 rgba(0,0,0,0.12);}
+
+.btnType1{padding:0 14px;height:36px;background:#f2f2f2;border:1px solid #d5d5d5;color:var(--primary-color-hover);}
+.btnType2{padding:0 6px;height:36px;background-color:var(--primary-color)!important;color:#fff!important;}
+.btnType3{padding:0 6px;height:36px;background-color:#fff;border:1px solid var(--primary-color);color:var(--primary-color);}
+.btnType4{padding-right:10px;width:90px;height:26px;font-size:14px;background-color:#8e8e8e;background-image:url(/publish/images/arrow1.png);background-repeat:no-repeat;background-position:86% center;color:#fff;vertical-align:inherit;}
+.btnType5{padding:0 7px;height:28px;background-color:#fff;border:1px solid var(--primary-color);color:var(--primary-color);}
+.btnType6{padding:0 16px;height:40px;font-weight:400;background-color:var(--lightgray-bg)!important;border:1px solid #d5d5d5!important;}
+.btnType7{width:100%;max-width:190px;height:40px;font-weight:300;background-color:#fff;border:1px solid var(--gray-border);}
+.btnType8{max-width:190px;height:40px;font-weight:300;background-color:var(--secondary-light-color);border:1px solid var(--secondary-light-color-hover);}
+.btnType9{max-width:93px;height:40px;font-weight:300;background-color:var(--gray-color)!important;color:#fff!important;}
+.btnType10{height:50px;font-size:20px;background-color:#fff;border:1px solid var(--primary-color);color:var(--primary-color);}
+.btnType11{height:50px;font-size:20px;background-color:var(--primary-color);color:#fff;}
+.btnType12{height:32px;font-size:14px;font-weight:300;background-color:#fff;border:1px solid #b1b1b1;}
+.btnType13{height:32px;font-size:14px;font-weight:300;color:#fff;}
+.btnType13.c1{background-color:#2a57c8;border:1px solid #2a57c8;}
+.btnType13.c2{background-color:#0b96d0;border:1px solid #0b96d0;}
+.btnType13.c3{background-color:#129738;border:1px solid #129738;}
+.btnType14{padding:0 10px;height:36px;font-size:14px;font-weight:400;letter-spacing:-1px;background-color:#fff;border:1px solid var(--gray-border);color:#6d6d6d;}
+.btnType15{margin-right:2px;width:80px;height:32px;font-size:14px;background-color:#fff;border:1px solid #d5d5d5;}
+.btnType16{padding:0 39px;height:50px;font-size:18px;background-color:var(--primary-color);color:#fff;}
+.btnType17{width:144px;height:50px;font-size:18px;background-color:var(--gray-color)!important;color:#fff!important;}
+.btnType18{width:145px;height:50px;font-size:18px;background-color:#fff;border:1px solid var(--primary-color);color:var(--primary-color);}
+.btnType19{padding:0 16px;margin-right:2px;height:50px;background-color:#fff;border:1px solid var(--gray-border);color:#222;}
+.btnType20{margin:3px 0 0 0;width:70px;height:28px;font-size:14px;font-weight:400;line-height:1.5;background-color:#fff;border:1px solid var(--gray-border);color:#555;}
+.btnType21{padding:0 14px;height:36px;background-color:var(--secondary-color);color:#fff;}
+.btnType22{padding:0 12px;height:28px;font-size:14px;font-weight:500;background-color:var(--secondary-color);color:#fff;}
+.btnType23{padding:4px 13px;margin:0 3px;font-size:14px;font-weight:400;background:var(--gray-color);color:#fff;} /*api에 사용*/
+.btnType24{margin:3px 0;width:70px;height:28px;font-size:14px;font-weight:400;line-height:1.5;background:#fff;border:1px solid #8697c2;color:var(--primary-color);} /*재사용 버튼 추가*/
+.btnType25{width:76px;height:26px;font-size:14px;line-height:1.5;background:#999;color:#fff;}
+
+
+.btn_text{padding:0 7px;}
+
+.btn_28{height:28px;}
+.btn_30{height:30px;}
+.btn_32{height:32px;}
+.btn_34{height:34px;}
+.btn_36{height:36px;}
+.btn_38{height:38px;}
+
+.btn_blue.fill{background:var(--primary-color);color:#fff;}
+.btn_lightgray.fill{background:var(--lightgray-color);color:#fff;}
+.btn_gray.fill{background:var(--gray-color);color:#fff;}
+.btn_yellow.fill{background:var(--secondary-light-color);color:#222;}
+
+.btn_blue.border{border:1px solid var(--primary-color);color:var(--primary-color);}
+.btn_gray.border{border:1px solid #6a6c72;color:#666;}
 
 .btnType.fill_gray{background:#6a6c72;color:#fff;}
 .btnType.fill_lightgray{background:#8e8e8e;color:#fff;}
-.btnType.fill_blue{background:#002c9a;color:#fff;}
+.btnType.fill_blue{background:var(--primary-color);color:#fff;}
 .btnType.fill_lightblue{background:#b1c6ee;color:#222;}
-.btnType.fill_yellow{background:#eea301;color:#222;}
+.btnType.fill_yellow{background:var(--secondary-color);color:#222;}
 
 .btnType.border_gray{border:1px solid #b1b1b1;color:#222;}
 .btnType.border_lightgray{border:1px solid #d5d5d5;color:#555;}
-.btnType.border_blue{border:1px solid #002c9a;color:#002c9a;}
+.btnType.border_blue{border:1px solid var(--primary-color);color:var(--primary-color);}
 .btnType.border_lightblue{border:1px solid #b1c6ee;color:#222;}
 
-
-/* 기타 반복 사용 */
 
 /* 기타 버튼 타입 */
 button.excel_btn {border: 1px solid #129738 !important; color: #129738;}
@@ -111,7 +134,7 @@
 button, html [type="button"] {-webkit-appearance: none;}*/
 
 /* 기타 버튼 타입 아이콘 */
-i.remove_img {background-image: url(/publish/images/content/remove_icon.png);width: 10px;height: 2px;margin: 0 3px 1px 0;}
+i.remove_img {background-image: url(/publish/images/content/remove_icon.png);width: 10px;height: 10px;margin: 0 3px 1px 0;}
 i.add_img {background-image: url(/publish/images/content/add_icon.png);width: 10px;height: 10px;margin: 0 3px 1px 0;}
 i.print_img {background-image: url(/publish/images/content/print_icon.png);width: 15px;height: 15px;margin: 0 3px 1px 0;}
 i.pdf_img {background-image: url(/publish/images/content/pdf_icon.png);width: 18px;height:20px;margin: 0 3px 1px 0;}
src/main/webapp/publish/css/chatbot_style.css
--- src/main/webapp/publish/css/chatbot_style.css
+++ src/main/webapp/publish/css/chatbot_style.css
@@ -26,7 +26,7 @@
 .chat_01 .btn_wrap{display: flex; margin: 0 auto 70px auto; text-align: center; width: 55%; justify-content: space-between;}
 .chat_01 .btn_wrap li{position: relative;}
 .chat_01 .btn_wrap button{width: 50px; height: 50px; background-repeat: no-repeat; background-color: #eceff4; background-position: center; border-radius: 100%;}
-.chat_01 .btn_wrap button:hover{background-color: #ffe600;}
+.chat_01 .btn_wrap button:hover{background-color: var(--secondary-light-color);}
 .chat_01 .btn_kakao{background-image: url(/publish/images/chatbot/btn_kakao.png);}
 .chat_01 .btn_kakao:hover{background-image: url(/publish/images/chatbot/btn_kakao_hover.png);}
 .chat_01 .btn_copy{background-image: url(/publish/images/chatbot/btn_clip.png);}
src/main/webapp/publish/css/common.css
--- src/main/webapp/publish/css/common.css
+++ src/main/webapp/publish/css/common.css
@@ -1,62 +1,55 @@
-body {width: 100%;/* letter-spacing: -0.25px; */position: relative;font-family: 'Noto Sans KR', sans-serif;overflow-x:hidden !important;}
-/* 공통요소 */
-caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border: none;clip: rect(0,0,0,0);overflow: hidden;}
-.clearfix::after{display:block;content:"";clear:both;} 
-/* layout */
-.main .inner {max-width: 1400px;}
-.inner {width:100%;max-width:1300px;height: 100%; margin: 0 auto;position: relative;}
-.cont {padding-top: 177px;}
-.cont.sub .inner {padding: 20px 0 70px 0;min-width: 1240px;}
-/* //공통요소 */
+body{position:relative;width:100%;font-family:'Pretendard';font-weight:400;overflow-x:hidden !important;font-synthesis: none;}
+.skip_menu a {position: absolute;background: rgba(255,255,255,0.95);width: 100%;height: 40px;text-align: center;color: #000;z-index: 100;line-height: 40px; top: -40px;font-weight: 600;opacity: 0;}
 
-/* //관리자 화면에서 사용자 코드 사용하기   */
+/* 공통요소 */
+caption, .label{position:absolute;width:1px;height:1px;margin:-1px;border:none;clip:rect(0,0,0,0);overflow:hidden;}
+.clearfix::after{display:block;content:"";clear:both;}
+ 
+/* 관리자 화면에서 사용자 코드 사용하기   */
 .admCont {padding-top: 30px;}
 .admCont.sub .inner {padding: 20px 0 70px 0;min-width: 1240px;}
 
-/* 바로가기 */
-.skip_menu a {position: absolute;background: rgba(255,255,255,0.95);width: 100%;height: 40px;text-align: center;color: #000;z-index: 100;line-height: 40px; top: -40px;font-weight: 600;opacity: 0;}
-/* //바로가기 */
+/* =============================================
+   layout
+============================================= */
+.inner {width:100%;max-width:1300px;height: 100%; margin: 0 auto;position: relative;}
+.main .inner {max-width: 1400px;}
+.cont {padding-top: 177px;min-width:1280px;}
+.cont.sub .inner {padding: 20px 0 70px 0;min-width: 1240px;}
 
 /* header */
-.header {position: fixed;top: 0;left: 0;width: 100%;min-width: 1240px; z-index: 10;box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.1);}
-/* header top */
-.header .header_top {background-color: #393939;color: #d1d1d1;height: 40px;font-weight: 300;font-size: 14px;font-weight: 300;transition: all 0.2s ease-in-out;}
-/* .header .header_top .menu_left {left: 0;position: absolute;top: 50%;transform: translateY(-50%); display: flex;} */
+.header{position:fixed;width:100%;min-width:1280px;top:0;left:0;z-index:10;box-shadow:0px 0px 10px 4px rgba(0,0,0,0.1);}
+
+.header .header_top{height:40px;font-size:14px;font-weight:300;color:#555;background:#f2f2f2;transition:all 0.2s ease-in-out;}
+.header .header_top .inner{display:flex;justify-content:space-between;align-items:center;}
 .header .header_top .menu_left{display:flex;height:100%;align-items:center;gap:20px;}
-.header .header_top .menu_left li {}
-.header .header_top .menu_left li:hover {color: #fff;text-decoration: underline;}
-.header .header_top .menu_left i {padding-right: 7px;vertical-align:bottom;}
+.header .header_top .menu_left a{display:flex;font-size:14px;font-weight:400;color:#555;align-items:center;gap:8px;}
 .header .header_top .menu_left .hdTop_fav {background-image: url(/publish/images/hdTop_FavStar.png);width: 15px;height: 15px;}
-.header .header_top .menu_left .hdTop_mypage {background-image: url(/publish/images/hdTop_center.png);width: 13px;height: 13px;}
-.header .header_top .menu_left .hdTop_center {background-image: url(/publish/images/hdTop_mypage.png);width: 13px;height: 13px;}
-.header .header_top .menu_right {right: 0;position: absolute;top: 50%;transform: translateY(-50%);background-color: #2c2c2c;height: 100%;line-height: 40px; display: flex;}
-.header .header_top .menu_right li {padding: 0 20px;}
-.header .header_top .menu_right li:hover {background-color: #1c1c1c;color: #fff;text-decoration: underline;}
-/* header body */
-.header .header_body {background-color: #fff;height: 75px;border-bottom: 1px solid #dcdee0; }
-.header .header_body .logo {position: absolute;top: 50%;left: 0;transform: translateY(-50%);}
-.header .header_body .gnbWrap {width: 100%;margin: 0 auto;text-align: center;font-size: 18px;color: #222;font-weight: 500;}
-/* header body _ gnb */
-.header .header_body .gnbWrap li {display: inline-block;margin: 0 20px;}
-.header .header_body .gnbWrap li:first-child{margin: 0 22px 0 -32px;}
-.header .header_body .gnbWrap li:last-child{margin: 0 0 0 22px;}
-.header .header_body .gnbWrap li a {position: relative;width: 100%;}
+.header .header_top .menu_left .hdTop_mypage {background-image: url(/publish/images/hdTop_center.png);width: 15px;height: 15px;}
+.header .header_top .menu_left .hdTop_center {background-image: url(/publish/images/hdTop_mypage.png);width: 15px;height: 15px;}
+.header .header_top .menu_right {display:flex;height:100%;}
+.header .header_top .menu_right li {display:flex;font-size:14px;font-weight:400;color:#555;padding:0 20px;align-items:center;}
+.header .header_top li:hover{font-weight:500;text-decoration:underline;}
+
+.header .header_body{height:75px;background:#fff;border-bottom:1px solid #e7e7e7;} 
+.header .header_body .inner{display:flex;align-items:center;}
+.header .header_body .gnb_right{display:flex;width:calc(100% - 130px);align-items:center;justify-content:flex-end;gap:48px;}
+.header .header_body .gnbWrap {display:flex;align-items:center;gap:35px;}
+.header .header_body .gnbWrap li a {position:relative;display:inline-block;font-size:18px;font-weight:500;color:#222;}
 .header .header_body .gnbWrap li a::before {left: 50%}
 .header .header_body .gnbWrap li a::after {right: 50%}
-.header .header_body .gnbWrap li a::before, .header .header_body .gnbWrap li a::after {content: '';position: absolute;bottom: -10px;width:0;height: 2px;background-color: #002c9a;transition: all 0.2s ease-in-out;}
-.header .header_body .gnbWrap li.new{position: relative;}
-.header .header_body .gnbWrap li.new::after{position: absolute; content: " "; width:100%; height: 47px; background: no-repeat url(/publish/images/content/new.gif); left: 67%; top: -39px; transform: translateX(-50%);}
-/* header gnb 오버시 */
-.header .gnbWrap li.over {color: #002c9a;}
+.header .header_body .gnbWrap li a::before, .header .header_body .gnbWrap li a::after {content: '';position: absolute;bottom: -10px;width:0;height: 2px;background-color: var(--primary-color);transition: all 0.2s ease-in-out;}
+.header .header_body .gnbWrap li.over a{color: var(--primary-color);}
 .header .header_body .gnbWrap li.over a::before {left: 0;}
 .header .header_body .gnbWrap li.over a::after {right: 0;}
 .header .header_body .gnbWrap li.over a::before, .header .header_body .gnbWrap li.over a::after{width: 51%;transition: all 0.2s ease-in-out;}
-.header .header_body .s_menu {position: absolute;top: 50%;right: 0;transform: translateY(-50%);}
-.header .header_body .s_menu button {margin-left: 32px;}
+.header .header_body .gnbWrap li.new{position: relative;}
+.header .header_body .gnbWrap li.new::after{position: absolute; content: " "; width:100%; height: 47px; background: no-repeat url(/publish/images/content/new.gif); left: 67%; top: -39px; transform: translateX(-50%);}
+
+.header .header_body .s_menu{display:flex;gap:12px;}
 .header .header_body .s_menu .allSitemap {width:29px;height:24px;background:url(/publish/images/all_menu.png) no-repeat center center;}
 .header .header_body .s_menu .allSitemap.active {background-image:url(/publish/images/btn_searchclose.png);background-size:auto auto;}
-.header .header_body .s_menu .allSearch_info {position: absolute;content: "";width: 65px;height: 23px;top:-16px;left:-38px;background-image: url(/publish/images/searchInfo.png);}
-.header .header_body .s_menu .allSearch_info span {font-size: 14px;margin-left: 4px;color: #fff;}
+.header .header_body .s_menu .allSearch_info{display:none;}
 
 /* IE미지원 탑배너 */
 .header .topbanner {display:none;height:45px;background:url(/publish/images/main/banner_ie_top01.jpg) no-repeat center top;}
@@ -65,107 +58,52 @@
 .header .topbanner .inner .today_close input[type=checkbox] {vertical-align:top;}
 .header .topbanner .inner .today_close input[type=checkbox] + label {padding:0 0 0 8px;font-size:15px;line-height:16px;vertical-align:top;color:#000;opacity:0.8;filter:opacity(80);}
 .header .topbanner .inner .today_close button {display:inline-block;width:16px;height:40px;margin:0 0 0 30px;font-size:0;text-indent:-9999em;background:url(/publish/images/main/icon_topbanner_close01.png) no-repeat left top;}
-/* login - 로그인 전 */
-.login {background-color: #eaecee;width: 100%; height: 60px;}
+
+/* 로그인 */
+.login{width:100%;height:60px;background:#fff;}
 .login .inner {display:flex;justify-content:space-between;align-items:center;}
-.login .login_left {display:flex;align-items:center;}
+
+.login .login_left {display:flex;align-items:center;gap:10px;}
+.login .login_left .login_put{display:flex;align-items:center;gap:8px;}
 .login .login_left .login_put>div {position: relative; display: inline-block;}
-.login .login_left .login_put input {width: 200px; height: 36px;border-radius: 3px; border: 1px solid #c6c9cb; font-size: 15px;}
-.login .login_left .login_put input:focus {border: 2px solid #002c9a;outline:none;}
-.login .login_left .login_put input::placeholder {color: #999; font-weight: 300; font-size: 15px;}
-.login .login_left .login_put input:-ms-input-placeholder {color: #999; font-weight: 300; font-size: 15px;}
-.login .login_left .login_put .password_text {padding: 0 10px; margin: 0 5px 0 2px;}
-.login .login_left .login_save {color: #555;margin: 0 30px 0 10px;}
-.login .login_left .login_save input+label {margin-left: 3px;}
-.login .login_left .login_find {color: #555;margin-right: 18px;position: relative;}
-.login .login_left .login_find::before {content: "";position: absolute;top: 50%;left: -18px; width: 1px;height: 19px;background: #d2d4d7;transform: translateY(-50%);}
-.login .login_left .login_find a {display: inline-block;}
-.login .login_left div:last-child button:last-child {margin-left: 2px;}
+.login .login_left .login_put input {width:200px;height:36px;font-size:15px;background:#fff;border-radius:3px;border:1px solid #d5d5d5;}
+.login .login_left .login_put input:focus {border: 2px solid var(--primary-color);outline:none;}
+.login .login_left .login_put input::placeholder,
+.login .login_left .login_put input:-ms-input-placeholder{color:#999;font-weight:300;font-size:15px;}
+.login .login_left .login_put .password_text {padding:0 10px;}
+.login .login_left .login_save,
+.login .login_left .login_find{position:relative;display:flex;font-size:16px;color:#555;align-items:center;gap:6px;}
+.login .login_left .login_find{margin:0 0 0 20px;}
+.login .login_left .login_find::before{position:absolute;content:"";width:1px;height:12px;background:#888;top:46%;left:-15px;transform:translateY(-50%);}
+.login .login_left .login_button{width:72px;}
+
 .login_right {vertical-align: middle; text-align: right;}
 .login .login_right span {color: #222;font-weight: 500;margin-right: 8px;font-size:16px;}
 .login .login_right span i {position: relative; background-image: url(/publish/images/login_gift.png);width: 25px;height: 25px; margin-bottom: 5px;margin-right: 4px;}
 .login .login_right span i::after{position: absolute; content: " "; width: 20px; height: 20px; background-image: url(/publish/images/event.gif); left: -12px; top: -5px;}
 .login .login_right .btnType {width:26px;height:26px;margin:-2px 0 0;padding:0;font-size:12px;line-height:24px;}
-/* header , login 스크롤 내릴 시 */
+
+/* header, login 스크롤 내릴 시 */
 .header.scroll .header_top {height: 0;transition: all 0.2s ease-in-out;}
 .header.scroll .header_top .menu_left,.header.scroll .header_top .menu_right {display: none;}
-/* login2 - 로그인 후 */
-.login2 {background-color: #eaecee;width: 100%; height: 60px;border-bottom: 1px solid #d4d5d7;color: #222;}
+
+/* 로그인 후 */
+.login2 {width:100%;height:60px;background:#fff;border-bottom:1px solid #d4d5d7;color:#222;}
 .login2 .inner {display:flex;justify-content:space-between;align-items:center;}
 .login2 .login_left {display:flex;width:100%;justify-content:space-between;align-items:center;}
 .login2 .login_info {position: relative;vertical-align: middle;}
-/*.login2 .login_info::after {content: "";position: absolute;width: 1px;height: 30px;background-color: #d3d3d3;top: 50%;right: -15px;transform: translateY(-50%);}*/
 .login2 .login_info p {display: inline-block;vertical-align: middle; max-width: 180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.login2 .login_info button {padding:0 14px;font-weight:500;}
 .login2 .login_info .login2_name {display: inline-flex; min-width: 110px;  position: relative; vertical-align: middle;align-items:center; cursor:pointer;}
-.login2 .login_info .login2_name p {color: #002c9a; font-weight: 600; vertical-align: top; height: 16px; white-space:nowrap;}
-.login2 .login_info .login2_name span {width: 61px;padding:0 10px 0 0;margin:0 0 0 0;}
+.login2 .login_info .login2_name p {color: #222; font-weight: 600; vertical-align: top; height: 16px; white-space:nowrap;}
+.login2 .login_info .login2_name span {width: 61px; color:#666;padding:0 10px 0 0;margin:0 0 0 0;}
 .login2 .login_info .icon_user{background-image: url(/publish/images/icon_header_user.png);width: 28px;height: 28px;}
-/*등급별 아이콘*/
-.login2 .login_info i.vvip{background-image: url(/publish/images/level/level_icon/vvip_icon.png);}
-.login2 .login_info i.vip{background-image: url(/publish/images/level/level_icon/vip_icon.png);}
-.login2 .login_info i.gold{background-image: url(/publish/images/level/level_icon/gold_icon.png);}
-.login2 .login_info i.sliver{background-image: url(/publish/images/level/level_icon/sliver_icon.png);}
-.login2 .login_info i.black{background-image: url(/publish/images/level/level_icon/black_icon.png);}
-.login2 .login_info i.red{background-image: url(/publish/images/level/level_icon/red_icon.png);}
-.login2 .login_info i.purple{background-image: url(/publish/images/level/level_icon/purple_icon.png);}
-.login2 .login_info i.blue{background-image: url(/publish/images/level/level_icon/blue_icon.png);}
-.login2 .login_info i.orange{background-image: url(/publish/images/level/level_icon/orange_icon.png);}
-.login2 .login_info i.green{background-image: url(/publish/images/level/level_icon/green_icon.png);}
-.login2 .login_info i.yellow{background-image: url(/publish/images/level/level_icon/yellow_icon.png);}
-.login2 .login_info i.white{background-image: url(/publish/images/level/level_icon/white_icon.png);}
-/*등급별 아이콘 끝*/
-.login2 .login_info button {padding:0 14px;}
-.login2 .login_pay {display:flex;}
-.login2 .check_money p span, .login2 .point p span {padding-left: 4px;}
-.login2 .check_money {margin-right: 20px; display: inline-flex;}
-.login2 .check_money p {padding-right: 6px;display: inline-block;vertical-align: middle;}
-.login2 .check_money>.holdingsum_box>i {background-image: url(/publish/images/check_money2.png);width: 29px;height: 30px;margin-right: 3px;}
-.login2 .check_money button {margin-right: 2px;}
-.login2 .check_money .account_box {position:relative;display:inline-block;}
-.login2 .check_money .account_box dl {display:none;position:absolute;left:50%;top:41px;padding:12px 24px 14px 14px;border:2px solid #002c9a;background:#fff;border-radius:10px;box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.5);transform:translateX(-50%);}
-.login2 .check_money .account_box dl:after {content:'';position:absolute;left:50%;top:-10px;width:16px;height:10px;margin:0 0 0 -8px;background:url(/publish/images/content/icon_account_arrow.png) no-repeat left top;}
-.login2 .check_money .account_box dl dt {font-size:16px;line-height:18px;}
-.login2 .check_money .account_box dl dt:before {content:'';display:inline-block;width:22px;height:20px;margin:0 5px 0 0;vertical-align:top;background:url(/publish/images/content/icon_account_layer.png) no-repeat left top;}
-.login2 .check_money .account_box dl dd {margin:7px 0 0;font-size:15px;font-weight:500;white-space:nowrap;}
-.login2 .check_money .account_box:hover dl {display:block;}
 
-.login2 .check_money .user_money_wrap{display:flex;align-items:center;gap:4px;margin:0 6px 0 0;}
-.login2 .check_money .hover_content_wrap{display:inline-block;position:relative;}
-.login2 .check_money .hover_content_wrap .qmMark{width:17px;height:17px;margin:0 4px 0 0;background:#6a6c72;border-radius:100%;color:#fff;text-align:center;}
-.login2 .check_money .hover_content_wrap .qmMark:hover+.hover_content{display:block;}
-.login2 .check_money .hover_content{display:none;position:absolute;padding:12px 12px 8px 12px;border:2px solid #002c9a;background:#fff;box-shadow: 0 3px 10px 0 rgba(0,0,0,0.5);transform:translateX(-50%);border-radius:5px;top:34px;left:8px;}
-.login2 .check_money .hover_content::after{content:'';position:absolute;left:50%;top:-10px;width:16px;height:10px;margin:0 0 0 -8px;background:url(../images/content/icon_account_arrow.png) no-repeat left top;}
-.login2 .check_money .hover_content .hover_content_title{font-size:14px;font-weight:600;margin:0 0 10px 0;}
-.login2 .check_money .hover_content .hover_content_title span{padding:0;font-size:13px;font-weight:400;}
-.login2 .check_money .hover_content .hover_content_title img{width:16px;margin:-4px 0 0 0;}
-.login2 .check_money .hover_content .send_available_number{display:flex;flex-direction:column;gap:7px;}
-.login2 .check_money .hover_content .send_available_number li{display:flex;justify-content:space-between;font-size:13px;}
-.login2 .check_money .hover_content .title{min-width:70px;}
-.login2 .check_money .hover_content .number{text-align:right;padding:0;}
-.login2 .check_money .hover_content .event_term{display:flex;width:100%;padding:4px 5px 4px 7px;margin:8px 0 0 0;background:#FFE5E5;font-size:13px;color:#e40000;text-align:center;border-radius:25px;justify-content:space-between;box-sizing:border-box;}
-.login2 .check_money .hover_content .event_term p:last-child{color:#222;}
-.login2 .check_money .hover_content .event_term p:last-child span{color:#e40000;}
-
-/*후불 회원에게만 노출되는 안내레이어*/
-.login2 .check_money .holdingsum_box {position: relative; display:flex; align-items: center;}
-.login2 .check_money .holdingsum_box dl {display:none;position:absolute;left:50%;top:41px;padding:12px;border:2px solid #002c9a;background:#fff;border-radius:10px;box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.5);transform:translateX(-50%);}
-.login2 .check_money .holdingsum_box dl:after {content:'';position:absolute;left:50%;top:-10px;width:16px;height:10px;margin:0 0 0 -8px;background:url(../images/content/icon_account_arrow.png) no-repeat left top;}
-.login2 .check_money .holdingsum_box dl dd {margin:3px;font-size:15px;font-weight:500;white-space:nowrap; line-height:20px;}
-.login2 .check_money .holdingsum_box:hover dl {display:block;}
-	
-.login2 .point p {padding-right: 6px;display: inline-block; vertical-align: middle;}
-.login2 .point i {background-image: url(/publish/images/pointIcon2.png);width: 30px;height: 28px;margin-right: 3px;margin-top: -2px;}
-.login2 .login_right button i {background-image: url(/publish/images/login_introIcon.png);width: 20px;height: 18px;margin: 0 6px 3px 0;}
 /* 로그인 세션 */
-.login2 .session {display: inline-block; width: 95px; height: 36px; border: 1px solid #bdc2c9; border-radius: 5px; margin-right: 10px; background-color:#d9dfeb; box-sizing: border-box; vertical-align: middle;}
-.login2 .session span {font-size: 16px; float: left; line-height: 32px; color: #002c9a; text-align: center; padding: 0 6px;}
-.login2 .session button {padding: 0 4.5px; height: 100%; font-size: 16px; color: #0f2866; background-color: #cfd6e6; float: right; border-left: 1px solid #bdc2c9; margin-right: 0;}
-.login2 .event {padding:5px 0 0 20px;}
-.login2 .event span {color: #222;font-weight: 500;margin-right: 3px;font-size:16px;}
-.login2 .event span i {position: relative; background-image: url(/publish/images/login_gift.png);width: 25px;height: 25px; margin-bottom: 5px;margin-right: 4px;}
-.login2 .event span i::after{position: absolute; content: " "; width: 20px; height: 20px; background-image: url(/publish/images/event.gif); left: -12px; top: -5px;}
-.login2 .event .btnType {width:26px;height:26px;margin:-2px 0 0;padding:0;font-size:12px;line-height:24px;}
-
+.login2 .login_info{display:flex;align-items:center;gap:10px;}
+.login2 .session{display:flex;width:110px;height:34px;border:1px solid #d5d5d5;border-radius:5px;background:#fff;overflow:hidden;}
+.login2 .session div{display:flex;width:calc(100% - 48px);height:100%;padding:0 10px;align-items:center;justify-content:center;}
+.login2 .session button{width:48px;padding:0 10px;font-size:16px;color:#5d5d5d;background:#f2f2f2;border-left:1px solid #d5d5d5;}
 .login2 .login_info,
 .login2 .check_money,
 .login2 .point,
@@ -180,75 +118,116 @@
 .security_box .state.on{background:#18bb59;color:#fff;}
 .security_box .state.off{background:#e62c2c;color:#fff;}
 
-/* //header */
+.login2 .login_pay {display:flex;}
+.login2 .check_money button {margin:0 0 0 8px;font-weight:500;}
+.login2 .check_money .account_box {position:relative;display:inline-block;}
+.login2 .check_money .account_box dl {display:none;position:absolute;left:50%;top:41px;padding:12px 24px 14px 14px;border:2px solid var(--primary-color);background:#fff;border-radius:10px;box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.5);transform:translateX(-50%);}
+.login2 .check_money .account_box dl:after {content:'';position:absolute;left:50%;top:-10px;width:16px;height:10px;margin:0 0 0 -8px;background:url(/publish/images/content/icon_account_arrow.png) no-repeat left top;}
+.login2 .check_money .account_box dl dt {font-size:16px;line-height:18px;}
+.login2 .check_money .account_box dl dt:before {content:'';display:inline-block;width:22px;height:20px;margin:0 5px 0 0;vertical-align:top;background:url(/publish/images/content/icon_account_layer.png) no-repeat left top;}
+.login2 .check_money .account_box dl dd {margin:7px 0 0;font-size:15px;font-weight:500;white-space:nowrap;}
+.login2 .check_money .account_box:hover dl {display:block;}
+
+.login2 .check_money .user_money_wrap{position:relative;display:flex;align-items:center;gap:4px;margin:0 6px 0 0;}
+.login2 .check_money .user_money_wrap::before{position:absolute;content:"";width:4px;height:4px;background:#d5d5d5;border-radius:100%;left:-10px;}
+.login2 .check_money .hover_content_wrap{display:inline-block;position:relative;}
+.login2 .check_money .hover_content_wrap .qmMark{display:flex;width:14px;height:14px;margin:-1px 4px 0 0;background:#888;border-radius:2px;font-size:12px;color:#fff;text-align:center;justify-content:center;align-items:center;}
+.login2 .check_money .hover_content_wrap .qmMark:hover+.hover_content{display:block;}
+.login2 .check_money .hover_content{display:none;position:absolute;padding:12px 12px 8px 12px;border:2px solid #555;background:#fff;box-shadow: 0 3px 10px 0 rgba(0,0,0,0.5);transform:translateX(-50%);border-radius:5px;top:34px;left:8px;}
+.login2 .check_money .hover_content::after{content:'';position:absolute;left:50%;top:-24px;width:45px;height:30px;margin:0 0 0 -21px;background:url(../images/content/icon_account_arrow.png) no-repeat left top;}
+.login2 .check_money .hover_content .hover_content_title{font-size:14px;font-weight:600;margin:0 0 10px 0;}
+.login2 .check_money .hover_content .hover_content_title span{padding:0;font-size:13px;font-weight:400;}
+.login2 .check_money .hover_content .hover_content_title img{width:16px;margin:-4px 0 0 0;}
+.login2 .check_money .hover_content .send_available_number{display:flex;flex-direction:column;gap:7px;}
+.login2 .check_money .hover_content .send_available_number li{display:flex;justify-content:space-between;font-size:13px;}
+.login2 .check_money .hover_content .title{min-width:70px;}
+.login2 .check_money .hover_content .number{text-align:right;padding:0;}
+.login2 .check_money .hover_content .event_term{display:flex;width:100%;padding:4px 5px 4px 7px;margin:8px 0 0 0;background:#FFE5E5;font-size:13px;color:#e40000;text-align:center;border-radius:25px;justify-content:space-between;box-sizing:border-box;}
+.login2 .check_money .hover_content .event_term p:last-child{color:#222;}
+.login2 .check_money .hover_content .event_term p:last-child span{color:#e40000;}
+
+/*후불 회원에게만 노출되는 안내레이어*/
+.login2 .check_money .holdingsum_box {position: relative; display:flex; align-items: center;}
+.login2 .check_money .holdingsum_box dl {display:none;position:absolute;left:50%;top:41px;padding:12px;border:2px solid var(--primary-color);background:#fff;border-radius:10px;box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.5);transform:translateX(-50%);}
+.login2 .check_money .holdingsum_box dl:after {content:'';position:absolute;left:50%;top:-10px;width:16px;height:10px;margin:0 0 0 -8px;background:url(../images/content/icon_account_arrow.png) no-repeat left top;}
+.login2 .check_money .holdingsum_box dl dd {margin:3px;font-size:15px;font-weight:500;white-space:nowrap; line-height:20px;}
+.login2 .check_money .holdingsum_box:hover dl {display:block;}
+	
+.login2 .point p {padding-right: 6px;display: inline-block; vertical-align: middle;}
+.login2 .point i {background-image: url(/publish/images/pointIcon2.png);width: 30px;height: 28px;margin-right: 3px;margin-top: -2px;}
+.login2 .login_right button i {background-image: url(/publish/images/login_introIcon.png);width: 20px;height: 18px;margin: 0 6px 3px 0;}
+
+
+/*등급별 아이콘*/
+.login2 .login_info i.vvip{background-image: url(/publish/images/level/level_icon/vvip_icon.png);}
+.login2 .login_info i.vip{background-image: url(/publish/images/level/level_icon/vip_icon.png);}
+.login2 .login_info i.gold{background-image: url(/publish/images/level/level_icon/gold_icon.png);}
+.login2 .login_info i.sliver{background-image: url(/publish/images/level/level_icon/sliver_icon.png);}
+.login2 .login_info i.black{background-image: url(/publish/images/level/level_icon/black_icon.png);}
+.login2 .login_info i.red{background-image: url(/publish/images/level/level_icon/red_icon.png);}
+.login2 .login_info i.purple{background-image: url(/publish/images/level/level_icon/purple_icon.png);}
+.login2 .login_info i.blue{background-image: url(/publish/images/level/level_icon/blue_icon.png);}
+.login2 .login_info i.orange{background-image: url(/publish/images/level/level_icon/orange_icon.png);}
+.login2 .login_info i.green{background-image: url(/publish/images/level/level_icon/green_icon.png);}
+.login2 .login_info i.yellow{background-image: url(/publish/images/level/level_icon/yellow_icon.png);}
+.login2 .login_info i.white{background-image: url(/publish/images/level/level_icon/white_icon.png);}
+/*등급별 아이콘 끝*/
 
 
 /* 검색 */
 .pop_search{display: block; width: 100%;background-color: #Fff; border-top: 1px solid #d5d5d5; position: relative; height: 0; overflow: hidden;}
-.pop_search .inner {padding: 55px 0;}
+.pop_search .inner form{display:flex;width:100%;padding: 55px 0;justify-content:center;flex-wrap:wrap;}
 .pop_search.on{z-index: 10;height: auto; overflow: visible;box-shadow:0px 40px 45px -30px rgb(0 0 0 / 30%);}
 .header+.mask2.on{width: 100%;min-width: 1240px; height: 100%; background-color: rgba(0,0,0,0.7); display: block; position: absolute; z-index: 9;}
-.area_search{max-width: 570px; margin: 0 auto;position: relative;}
-.area_search select{width: 170px; height: 50px; padding-left: 15px;border: 1px solid #000; border-radius: 5px;margin-right: 1px; font-size: 18px; background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 85% center; position: relative;color: #555;}
-.area_search input[type="text"]{width: calc(100% - 180px);height: 50px;padding-left: 20px;border: 1px solid #000; border-radius: 5px; box-sizing: border-box;font-size: 18px; font-weight: 300;box-sizing: border-box;}
-.area_search button {position: absolute;right: 0;width: 55px;height: 50px;border: 1px solid #000; border-radius: 0 5px 5px 0; background-color: #ffcc33;}
+.area_search{max-width:100%;width:50%; margin: 0 auto;position: relative;}
+.area_search select{width: 170px; height: 50px; padding-left: 15px;border: 1px solid #555; border-radius: 5px;margin-right: 1px; font-size: 18px; background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 85% center; position: relative;color: #555;}
+.area_search input[type="text"]{width: calc(100% - 180px);height: 50px;padding-left: 20px;border: 1px solid #555; border-radius: 5px; box-sizing: border-box;font-size: 18px; font-weight: 300;box-sizing: border-box;}
+.area_search button {position: absolute;right: 0;width: 55px;height: 50px;border: 1px solid #555; border-radius: 0 5px 5px 0; background-color: var(--secondary-light-color);}
 .area_search button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.area_popular{max-width: 1400px; margin: 20px auto 0; display: flex; justify-content: center;}
+.area_popular{max-width: 1400px;width:100%; margin: 20px auto 0; display: flex; justify-content: center;}
 .area_popular p{font-size: 16px; color: #000; font-weight: 500;width: 95px; margin-right: 32px; line-height: 2.2;position: relative;}
-.area_popular p::after {width: 95px; content: "";position: absolute;width: 2px;height: 15px;background-color: #ffcc33;top: 50%;transform: translateY(-50%);right: -17px;}
+.area_popular p::after {width: 95px; content: "";position: absolute;width: 2px;height: 15px;background-color: var(--secondary-light-color);top: 50%;transform: translateY(-50%);right: -17px;}
 .area_popular p i {background-image: url(/publish/images/search_popular.png);width: 16px;height: 16px;margin-right: 5px;margin-bottom: 3px;}
 .area_popular ul{display: flex;}
 .area_popular ul li{margin: 2px 3px 0 3px;}
-.area_popular ul li a{color: #999; font-size: 16px; padding: 7px 15px; border-radius: 20px; border: 1px solid #bbbbbb; font-weight: 300;}
-.area_popular ul li:hover a{border: 1px solid #000;background-color: #ffcc33; color: #000;}
+.area_popular ul li a{color: #888; font-size: 16px; padding: 7px 15px; border-radius: 20px; border: 1px solid #b0b0b0; font-weight: 300;}
+.area_popular ul li:hover a{border: 1px solid var(--primary-color);background-color: var(--secondary-light-color); color: #222;font-weight:500;}
 .pop_search .btn_close{position: absolute; top: 24px;right: 14px;}
-/* //검색 */
 
 /* 사이트맵 */
-.layer_sitemap {overflow:hidden;position:relative;display:block;width:100%;height:0;border-bottom:1px solid #d5d5d5;background:#fff;z-index:16;/*transition:height 0.4s;*/}
-.layer_sitemap.active {height:670px;box-shadow:0px 20px 30px 0px rgba(0, 0, 0, 0.1);}
+.layer_sitemap {overflow:hidden;position:relative;display:block;width:100%;height:0;background:#fff;z-index:16;/*transition:height 0.4s;*/}
+.layer_sitemap.active {height:670px;border-bottom:1px solid #d5d5d5;box-shadow:0px 20px 30px 0px rgba(0, 0, 0, 0.1);}
 .layer_sitemap .inner {padding:0;letter-spacing:-0.025em;}
-.layer_sitemap .menu {display:flex;justify-content:space-between;}
-/*.layer_sitemap .menu > li {width:calc(100%/7);}*/
+.layer_sitemap .menu {display:flex;width:100%;justify-content:space-between;}
 .layer_sitemap .menu dl dt {margin:54px 0 0;}
 .layer_sitemap .menu dl dt a {position:relative;display:inline-block;font-family:'GmarketSansMedium';font-size:22px;}
-.layer_sitemap .menu dl dt a:hover:after {content:'';position:absolute;left:0;bottom:2px;width:100%;height:7px;background:#002c9a;opacity:0.2;filter:opacity(20);}
+.layer_sitemap .menu dl dt a:hover:after {content:'';position:absolute;left:0;bottom:2px;width:100%;height:7px;background:var(--primary-color);opacity:0.2;filter:opacity(20);}
 .layer_sitemap .menu dl dd {margin:18px 0 0;}
 .layer_sitemap .menu dl dd li {line-height:40px;}
 .layer_sitemap .menu dl dd li a {display:inline-block;font-size:18px;font-weight:300;white-space:nowrap;color:#444;}
-.layer_sitemap .menu dl dd li a:hover {font-weight:400;color:#002c9a;}
-/* //사이트맵 */
+.layer_sitemap .menu dl dd li a:hover {font-weight:400;color:var(--primary-color);}
+
 
 
 /* footer */
-.footer {font-weight: 300;min-width: 1240px;height:206px;}
-.footer .footer_top {background-color: #323232;height: 56px;}
-.footer .footer_top ul li {display: inline-block;padding: 0 25px;color: #adadad;}
+.footer {background:#fff;min-width:1240px;height:206px;}
+.footer .footer_top {height:56px;border-bottom:1px solid #e7e7e7;border-top:1px solid #b0b0b0;}
+.footer .footer_top ul li {display:inline-block;padding:0 25px;color:#666;}
 .footer .footer_top ul li:first-child {padding: 0 25px 0 0;}
-.footer .footer_top ul li:hover {color: #fff;text-decoration: underline;}
+.footer .footer_top ul li:hover {text-decoration: underline;}
 .footer .footer_top ul li a {font-size:16px;}
-.footer .footer_top ul li.about a {padding-left:34px;line-height:22px;background:url(/publish/images/icon_footer_about.png) no-repeat left center;}
-.footer .footer_body {background-color: #3f3f3f;height: 150px;color: #919191;}
-.footer .footer_body .inner {height:150px;}
-.footer .footer_body .inner .table_cell {height:150px;}
+.footer .footer_body {height: 200px;color: #666;}
+.footer .footer_body .inner {height:200px;}
+.footer .footer_body .inner .table_cell {height:200px;}
 .footer .footer_body .footer_logo {display: inline-block;}
 .footer .footer_body .footer_info {display: inline-block;vertical-align: middle;}
-.footer .footer_body .footer_info p {padding: 5px 0 5px 25px; font-size: 15px; letter-spacing: -0.05em;}
+.footer .footer_body .footer_info p {padding: 5px 0 5px 25px; font-size: 15px; line-height:1.4;}
 
 /* footer 고객센터 */
-.footer .footer_body .footer_service_center {overflow:hidden;position:absolute;right:0;top:50%;display:flex;height:90px;background:#fff;border-radius:10px;transform:translateY(-50%);}
-.footer .footer_body .footer_service_center dt {width:65px;padding:55px 0 0;font-size:14px;font-weight:500;text-align:center;color:#222;background:url(/publish/images/footer_serive_center.png) #ffcc33 no-repeat center 12px;}
-.footer .footer_body .footer_service_center dd {padding:22px 10px 0 13px;}
-.footer .footer_body .footer_service_center dd p {font-size:21px;font-weight:700;line-height:24px;letter-spacing:-0.01em;color:#304b8f;}
-.footer .footer_body .footer_service_center dd span {font-size:13px;color:#666;letter-spacing:-0.02em;}
-
-/* footer 대량문자 전송자격 인증마크_241202 */
-.footer .footer_body .footer_info p{padding: 3px 0 3px 25px;}
-.footer .footer_body .footer_info .info_te{line-height: 1.4;}
-.footer .footer_body .footer_service_center{right: 10%; height: 80px;}
-.footer .footer_body .footer_service_center dt{padding: 48px 0 0; background: url(/publish/images/footer_serive_center.png) #ffcc33 no-repeat center 6px;}
-.footer .footer_body .footer_service_center dd{padding: 18px 10px 0 13px;}
-.footer .footer_body .footer_mark{position: absolute; top: 18%; right: 0; cursor: pointer; width: 95px; height: 95px;}
+.footer .footer_body .footer_service_center {position:absolute;display:flex;padding:15px;right:123px;top:50%;background:#fff;border:1px solid #d5d5d5;border-radius:5px;transform:translateY(-50%);align-items:center;overflow:hidden;gap:10px;}
+.footer .footer_body .footer_service_center p{font-family:'GmarketSansBold';font-size:16px;font-weight:bold;color:#1A4B8E;}
+.footer .footer_body .footer_service_center span{font-family: 'GmarketSansMedium';font-size:12px;font-weight:400;color:#454545;}
+.footer .footer_body .footer_mark{position: absolute; top: 50%; right: 0; cursor: pointer; width: 95px; height: 95px; transform:translateY(-50%);}
 
 /* //footer */
 
@@ -258,77 +237,84 @@
 .quickMenu.quickSub.active {top:150px;}
 .quickMenu>div {width: 90px;}
 .quickMenu.main {right: 20px;top:150px;}
-.quickMenu .quick_title {padding: 10px 0px; font-size: 13px;color: #fff;background-color: #424463;border-radius: 8px 8px 0 0;line-height: 1.3;}
-.quickMenu .quick_title2 {padding: 10px 0px; font-size: 13px;color: #fff;background-color: #424463;border-radius: 8px 8px 0 0;line-height: 1.3;display: none;}
+.quickMenu .quick_title {padding: 12px 0px 6px 0; font-family: 'GmarketSansMedium'; font-size: 13px;color: #fff;background-color: #b0b0b0;border-radius: 8px 8px 0 0;line-height: 1.3;}
+.quickMenu .quick_title2 {padding: 10px 0px; font-size: 13px;color: #fff;background-color: #b0b0b0;border-radius: 8px 8px 0 0;line-height: 1.3;display: none;}
 .quickMenu .quickMenuIn {background-color: #fff;}
-.quickMenu .quickMenuIn > li {height: 55px;position: relative;}
-.quickMenu .quickMenuIn > li::before {content: "";background-color: #e5e5e5;width: 70px;height: 1px;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);}
+.quickMenu .quickMenuIn > li {position:relative;display:flex;height:55px;justify-content:center;align-items:center;}
+/* .quickMenu .quickMenuIn > li::before {content: "";background-color: #e5e5e5;width: 70px;height: 1px;position: absolute;bottom: 0;left: 50%;transform: translateX(-50%);} */
 .quickMenu .quickMenuIn > li:last-child:before {display: none;}
 .quickMenu .quickMenuIn > li a {padding-top: 5px; display: block;}
-.quickMenu .quickMenuIn li i {display: inline-block;}
-.quickMenu .quickMenuIn li i.quick1 {background-image: url(/publish/images/quick1.png);width: 20px; height:18px;}
-.quickMenu .quickMenuIn li i.quick2 {background-image: url(/publish/images/quick2.png);width: 20px; height:18px;}
-.quickMenu .quickMenuIn li i.quick3 {background-image: url(/publish/images/quick3.png);width: 28px; height:24px;}
-.quickMenu .quickMenuIn li i.quick4 {background-image: url(/publish/images/quick4.png);width: 24px; height:22px;}
-.quickMenu .quickMenuIn li i.quick5 {background-image: url(/publish/images/quick5.png);width: 14px; height:24px;}
-.quickMenu .quickMenuIn li i.quick6 {background-image: url(/publish/images/quick6.png);width: 24px; height:16px;}
-.quickMenu .quickMenuIn li i.quick7 {background-image: url(/publish/images/quick7.png);width: 34px; height:16px;}
-.quickMenu .quickMenuIn li i.quick8 {background-image: url(/publish/images/quick8.png);width: 22px; height:16px;}
-.quickMenu .quickMenuIn li i.quick9 {background-image: url(/publish/images/quick9.png);width: 24px; height:20px;}
-.quickMenu .quickMenuIn li i.quick10 {background-image: url(/publish/images/quick10.png);width: 21px; height:20px;}
-.quickMenu .quickMenuIn li i.quick11 {background-image: url(/publish/images/quick11.png);width: 20px; height:20px;}
-.quickMenu .quickMenuIn li i.quick12 {background-image: url(/publish/images/level/quick12.png);width: 20px; height:20px;}
+
+.quickMenu .quickMenuIn li i {display:inline-block;width:20px;height:20px;transition:all .1s ease-in-out;}
+
+.quickMenu .quickMenuIn li .custom{background:url(/publish/images/quick1.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .custom{background:url(/publish/images/quick1_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .address{background:url(/publish/images/quick2.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .address{background:url(/publish/images/quick2_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .number{background:url(/publish/images/quick3.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .number{background:url(/publish/images/quick3_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .excel{background:url(/publish/images/quick4.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .excel{background:url(/publish/images/quick4_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .linkage{background:url(/publish/images/quick5.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .linkage{background:url(/publish/images/quick5_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .pay{background:url(/publish/images/quick6.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .pay{background:url(/publish/images/quick6_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .tax{background:url(/publish/images/quick7.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .tax{background:url(/publish/images/quick7_hover.png) no-repeat center;}
+
+.quickMenu .quickMenuIn li .service_center{background:url(/publish/images/quick8.png) no-repeat center;}
+.quickMenu .quickMenuIn li a:hover .service_center{background:url(/publish/images/quick8_hover.png) no-repeat center;}
+
 .quickMenu .quickMenuIn li span {display: block;font-size: 12px;color: #555;padding-top: 8px;}
-.quickMenu .goTop {background-color: #929599;color: #fff;width: 90px;padding: 10px 0;border-radius: 0 0 8px 8px;font-size: 20px;}
-.quickMenu .goTop i {background-image: url(/publish/images/goTop.png);width: 12px;height: 10px;margin-left: 5px;margin-bottom: 5px;}
-.quickMenu .quickMenuIn li:hover i.quick1 {background-image: url(/publish/images/quick1_hover.png);width: 20px; height:18px;}
-.quickMenu .quickMenuIn li:hover i.quick2 {background-image: url(/publish/images/quick2_hover.png);width: 20px; height:18px;}
-.quickMenu .quickMenuIn li:hover i.quick3 {background-image: url(/publish/images/quick3_hover.png);width: 28px; height:24px;}
-.quickMenu .quickMenuIn li:hover i.quick4 {background-image: url(/publish/images/quick4_hover.png);width: 24px; height:22px;}
-.quickMenu .quickMenuIn li:hover i.quick5 {background-image: url(/publish/images/quick5_hover.png);width: 14px; height:24px;}
-.quickMenu .quickMenuIn li:hover i.quick6 {background-image: url(/publish/images/quick6_hover.png);width: 24px; height:16px;}
-.quickMenu .quickMenuIn li:hover i.quick7 {background-image: url(/publish/images/quick7_hover.png);width: 34px; height:16px;}
-.quickMenu .quickMenuIn li:hover i.quick8 {background-image: url(/publish/images/quick8_hover.png);width: 22px; height:16px;}
-.quickMenu .quickMenuIn li:hover i.quick9 {background-image: url(/publish/images/quick9_hover.png);width: 24px; height:20px;}
-.quickMenu .quickMenuIn li:hover i.quick10 {background-image: url(/publish/images/quick10_hover.png);width: 21px; height:20px;}
-.quickMenu .quickMenuIn li:hover i.quick11 {background-image: url(/publish/images/quick11_hover.png);width: 20px; height:20px;}
-.quickMenu .quickMenuIn li:hover i.quick12 {background-image: url(/publish/images/level/quick12_hover.png);width: 20px; height:20px;}
-.quickMenu .quickMenuIn li:hover span {color: #002c9a;font-weight: 500;}
-.quickMenu .quick_kakaobtn {position:absolute;right:0;bottom:-100px;width:90px;height:90px;font-size:0;text-indent:-9999em;background:url(/publish/images/content/icon_quick_kakao.png) no-repeat left top;z-index:15;}
+.quickMenu .quickMenuIn li:hover span {color:var(--primary-color);font-weight: 500;}
+
+.quickMenu .goTop {display:flex;font-family: 'GmarketSansMedium';font-size:13px;color:#fff;background:#b0b0b0;width:90px;padding:10px 0;border-radius:0 0 8px 8px;justify-content:center;align-items:center;gap:4px;}
+.quickMenu .goTop i {background:url(/publish/images/goTop.png);width:15px;height:10px;margin:0 0 3px 0;}
+
+.quickMenu .quick_kakaobtn {position:absolute;right:0;bottom:-180px;width:90px;height:90px;font-size:0;text-indent:-9999em;background:url(/publish/images/content/icon_quick_kakao.png) no-repeat left top;z-index:15;}
+.quickMenu.quickSub .quick_kakaobtn{bottom:-100px;}
 .quickMenu .quick_kakaobtn a {display:block;width:100%;height:100%;}
 /* 퀵메뉴 세로 스크롤 시 */
 .quickMenu.main.scroll {transition: all 0.3s ease-in-out;right:-100px;} 
 /* 퀵메뉴 1440px부터 메뉴 호버 시 말풍선 */
 .quickMenu .hover_cont {width: 80px;position: absolute;height: auto;background-color: #fff;box-shadow: 0px 0px 10px 4px rgba(0,0,0,0.1);padding: 8px;border: 1px solid #d5d5d5; border-radius: 5px; font-size: 14px;top:18px; right: 45px;z-index: 1;line-height: 1.3;display: none;}
-.quickMenu .cscenter .hover_cont {display:none;top:inherit;bottom:-49px;right:90px;width:220px;height:auto;padding:19px 0 19px 15px;letter-spacing:-0.05em;text-align:left;border:1px solid #e5e5e5;background:#fff;border-radius:5px;box-sizing:border-box;box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.2);}
-.quickMenu .cscenter .hover_cont .title {height:26px;padding:0 0 0 35px;font-size:16px;font-weight:500;line-height:24px;background:url(/publish/images/icon_qucik_cscenter.png) no-repeat left top;}
-.quickMenu .cscenter .hover_cont .number {margin:2px 0 0;font-size:30px;font-weight:700;color:#002c9a;}
-.quickMenu .cscenter .hover_cont .email {margin:2px 0;font-size:14px;font-weight:300;color:#666;}
-.quickMenu .cscenter .hover_cont ul {margin:7px 15px 0 0;padding:6px 0 12px 9px;background:#f5f5f5;border-radius:5px;}
-.quickMenu .cscenter .hover_cont ul li {font-size:14px;line-height:22px;color:#444;}
-.quickMenu .cscenter .hover_cont .cskakao {padding:10px 19px 0 0;}
-.quickMenu .cscenter .hover_cont .cskakao a {position:relative;display:block;float:left;width:50%;height:36px;padding:0;font-size:14px;line-height:34px;text-align:center;color:#333;border:1px solid #d5d5d5;box-sizing:border-box;border-radius:5px 0 0 5px;}
-.quickMenu .cscenter .hover_cont .cskakao a.kakao {border-right:0;}
-.quickMenu .cscenter .hover_cont .cskakao a.remote {border-radius:0 5px 5px 0;}
-.quickMenu .cscenter .hover_cont .cskakao a.kakao:before {content:'';display:inline-block;width:20px;height:34px;margin:0 5px 0 0;vertical-align:top;background:url(/publish/images/icon_cscenter_kakao.png) no-repeat left top;}
-.quickMenu .cscenter .hover_cont .cskakao a.remote:before {content:'';display:inline-block;width:17px;height:34px;margin:0 5px 0 0;vertical-align:top;background:url(/publish/images/icon_cscenter_remote.png) no-repeat left top;}
-.quickMenu .cscenter .hover_cont .cskakao a:hover:after {content:'';position:absolute;left:-1px;top:-2px;width:100%;height:100%;border:2px solid #fbc72b;box-shadow:2px 2px 6px 2px rgba(0 0 0 / 0.15);z-index:1;}
-.quickMenu .cscenter .hover_cont .cskakao a.kakao:hover:after {border-radius:5px 0 0 5px;}
-.quickMenu .cscenter .hover_cont .cskakao a.remote:hover:after {border-radius:0 5px 5px 0;}
 .quickMenu .cscenter:hover .hover_cont {display:block;}
+.quickMenu .cscenter .hover_cont {display:none;top:inherit;bottom:-49px;right:90px;width:240px;height:auto;padding:23px 25px;text-align:left;background:#fff;border-radius:5px;box-sizing:border-box;box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.2);}
+.quickMenu .cscenter .hover_cont .title {display:flex;height:26px;padding:0 0 0 35px;font-size:17px;font-weight:500;color:#888;background:url(/publish/images/icon_qucik_cscenter.png) no-repeat left top;align-items:center;}
+.quickMenu .cscenter .hover_cont .number {margin:2px 0 0;font-size:30px;font-weight:700;color:var(--primary-dark-color-hover);background:none;}
+.quickMenu .cscenter .hover_cont .email {margin:2px 0;font-size:14px;font-weight:300;color:#666;}
+.quickMenu .cscenter .hover_cont ul li {font-size:14px;color:#555;line-height:1.5;}
+.quickMenu .cscenter .hover_cont .cskakao {display:flex;margin:12px 0 0 0;gap:5px;}
+.quickMenu .cscenter .hover_cont .cskakao a{display:flex;width:50%;height:36px;padding:0;font-size:14px;font-weight:400;color:#222;background:#f0f0f0;border-radius:3px;gap:8px;justify-content:center;align-items:center;}
+.quickMenu .cscenter .hover_cont .cskakao .circle{display:inline-block;width:10px;height:10px;border-radius:100%;}
+.quickMenu .cscenter .hover_cont .cskakao i.kakao{background:#564742;}
+.quickMenu .cscenter .hover_cont .cskakao i.remote{background:#4673B7;}
+
+
+
 /* //quick Menu */
 
 /* pagenation */
 .pagination{width: 40%; margin: 0 auto 40px auto; display: flex; justify-content: center;}
-.pagination li button{width: 32px; height: 34px; margin: 0 2px; letter-spacing: -0.5px; border: 1px solid #d5d5d5; border-radius: 3px; text-align: center; color: #666; background-color: #fff;}
-.pagination li.on button{background-color: #002c9a; border: 1px solid #002c9a; color: #fff; font-weight: 500;}
-.pagination li button:hover {box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.1);}
-.pagination li.page_first button,.pagination li.page_prev button,.pagination li.page_next button,.pagination li.page_last button{background-color: #f5f5f5; line-height: 1; font-size: 13px;}
+.pagination li button{display:flex;width: 32px; height: 34px; margin: 0 2px; letter-spacing: -0.5px; border:0; border-radius: 3px; text-align: center; color: #666; background-color: #fff;justify-content:center;align-items:center;}
+.pagination li.on button{background-color: var(--primary-color); border: 1px solid var(--primary-color); color: #fff; font-weight: 500;}
+.pagination li button:hover {box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.05);}
+.pagination li.page_first button,.pagination li.page_prev button,.pagination li.page_next button,.pagination li.page_last button{background-color: #f2f2f2; line-height: 1; font-size: 13px;}
 .pagination li.page_prev button {margin-right: 5px;}
 .pagination li.page_next button {margin-left: 5px;}
 .pagination li.page_first button img,.area_page li.page_prev button img{margin-left: -2px;}
 .pagination li.page_next button img,.area_page li.page_last button img{margin-right: -2px;}
 /* //pagenation */
+
+/* 테이블별 페이지 */
+.tb_wrap+.pagination{margin:20px auto 0 auto;}
+/* //테이블별 페이지 */
 
 /* 광고배너 */
 .main_cont4{min-width: 1200px; background-color: #f5f5f5; padding: 30px 0;}
@@ -353,8 +339,8 @@
 	.header .header_top .menu_right {right:30px;}
 	.header .header_body .logo {left:30px;}
 	.header .header_body .s_menu {right:30px;}
-	.header .header_body .gnbWrap li {margin: 0 13px;}
-    .header .header_body .gnbWrap li:first-child{margin: 0 17px 0 -33px;}
+	
+    
     .header .header_body .gnbWrap li:last-child{margin: 0 0 0 10px;}
 	.pop_search .inner {padding:40px 0;}
 }
@@ -362,14 +348,16 @@
 /* media queries */
 @media only screen and (max-width:1480px){
     /* header */
+    .header .header_body .gnb_right{gap:20px;}
 	.header .inner {padding:0 70px;box-sizing:border-box;}
 	.header .login .inner {padding:0 46px 0 48px;}
     .header .header_top .menu_left {left:70px;}
 	.header .header_top .menu_right {right:70px;}
     .header .header_body .logo {left:70px;}
+    .header .header_body .gnbWrap{gap:28px;}
     .header .header_body .s_menu {right:70px;}
     .header .header_body .s_menu button {margin-left: 20px;}
-    .header .header_body .gnbWrap li:first-child{margin: 0 17px 0 -18px;}
+    
 	.pop_search .inner {padding:30px 0;}
     /* login */
     .login_right {margin-right: 20px; text-align: inherit;}
@@ -396,8 +384,9 @@
     .quickMenu .quickMenuIn li span {display: none;}
     .quickMenu .quickMenuIn li.cscenter .hover_cont {bottom:-35px;right:60px;}
     .quickMenu .quickMenuIn li.cscenter .hover_cont .info li {height:auto;}
-    .quickMenu .quick_kakaobtn {bottom:-70px;width:60px;height:60px;background-size:100%;}
-    .quickMenu .goTop {border-radius: 0 0 0 8px;font-size: 16px;width: 60px; padding:5px 0;}
+    .quickMenu .quick_kakaobtn {bottom:-160px;width:60px;height:60px;background-size:100%;}
+    .quickMenu.quickSub .quick_kakaobtn{top:auto;bottom:-80px;}
+    .quickMenu .goTop {border-radius: 0 0 0 8px;font-size: 16px;width: 60px; padding:5px 0;font-size:13px; text-indent:-9999px;}
     .quickMenu .goTop i {margin-left: 3px;}
     /* footer */
     .footer .footer_top {padding: 0 20px;}
@@ -424,8 +413,8 @@
      .login2 .login_right button {padding: 0 5px; margin-right: 0;}
      .login2 .session {margin-right: 5px;}
      
-     .header .header_body .gnbWrap{letter-spacing: -1px;}
-     .header .header_body .gnbWrap li{margin: 0 9px;}
+     .header .header_body .gnbWrap{letter-spacing: -.5px;}
+     
      
      /* footer */
      .footer .footer_body .footer_info p {padding: 5px 0 5px 15px; letter-spacing: -0.08em;}
src/main/webapp/publish/css/content.css
--- src/main/webapp/publish/css/content.css
+++ src/main/webapp/publish/css/content.css
@@ -1,91 +1,34 @@
-/* 폰트 */
-.fwLg{font-weight: 300 !important}
-.fwRg{font-weight: 400 !important}
-.fwMd{font-weight: 500 !important}
-.fwBold{font-weight: 700 !important}
-.c_white {color: #fff !important;}
-.c_002c9a {color: #002c9a !important;}
-.c_e40000 {color: #e40000 !important;}
-.c_999999 {color: #999 !important;}
-.c_ffa200 {color: #ffa200 !important;}
-.c_19b32b{color: #19b32b !important;}
-.c_000 {color: #000 !important;}
-.c_222 {color: #222 !important;}
-.c_666 {color: #666 !important;}
-/* 발송결과 화면개선 */
-.c_666_g {color: #666 !important; font-size: 26px; font-family: 'GmarketSansBold'; padding:0 4px 0 0;}
-.c_002c9a_g {color: #002c9a !important; font-size: 26px; font-family: 'GmarketSansBold'; padding:0 4px 0 0;}
-.c_e40000_g {color: #e40000 !important; font-size: 26px; font-family: 'GmarketSansBold'; padding:0 4px 0 0;}
-.c_222_g {color: #222 !important; font-size: 26px; font-family: 'GmarketSansBold'; padding:0 4px 0 0;}
-/*// 발송결과 화면개선 */
-.table {display: table;width: 100%;}
-.table_cell {display: table-cell;vertical-align: middle;}
-.table_cell1 {display: table-cell;vertical-align: top; position: relative;/*  top: 25px; */}
-.vMiddle {vertical-align: middle;}
-.tRight {text-align: right !important;}
-.tLeft {text-align: left !important;}
-
-.btn_text{padding:0 7px;}
-
-.btn_28{height:28px;}
-.btn_30{height:30px;}
-.btn_32{height:32px;}
-.btn_34{height:34px;}
-.btn_36{height:36px;}
-.btn_38{height:38px;}
-
-.btn_blue.fill{background:#002c9a;color:#fff;}
-.btn_lightgray.fill{background:#a5a5a5;color:#fff;}
-.btn_gray.fill{background:#6a6c72;color:#fff;}
-.btn_yellow.fill{background:#fbc72b;color:#222;}
-
-.btn_blue.border{border:1px solid #002c9a;color:#002c9a;}
-.btn_gray.border{border:1px solid #6a6c72;color:#666;}
-
-.w100 {width: 100%;}
-.h100 {height: 100%;}
-
-input[type=text]::-ms-celar, input[type=password]::-ms-clear, input[type=email]::-ms-clear, input[type=number]::-ms-clear, input[type=tel]::-ms-clear {display:none;width:0;height:0;}
-input[type=text]::-ms-reveal, input[type=password]::-ms-reveal, input[type=email]::-ms-reveal, input[type=number]::-ms-reveal, input[type=tel]::-ms-reveal {display:none;width:0;height:0;}
-
-.select_gray_type{width: 340px;height: 40px;padding: 0 20px;background-color: #f2f2f2;border-radius: 5px;border: 0;color: #222;font-weight: 400;font-size: 16px;background-image: url(/publish/images/select_search.png);background-repeat: no-repeat;background-position: 94% center;}
-.textarea_gray_type{padding: 24px 20px; border-radius: 5px; background-color: #f2f2f2; border: none;}
-
-/* 기타 반복 사용 */
-.SortLine {position: relative;}
-.SortLine::before {content: "";position: absolute;top: 50%;left: 0; width: 1px;height: 12px;background: #565656;transform: translateY(-50%);}
-.text_deco {position: relative;padding-right: 40px;}
-.text_deco::after {position: absolute;content: "";width: 20px;height: 20px;border: 5px solid #ffcc33;border-radius: 50%;background-color: #fff;top: 50%;left: 0;transform: translateY(-50%);}
-.text_deco2 {position: relative;padding-right: 16px;}
-.text_deco2::after {position: absolute;content: "";width: 4px;height: 4px;border-radius: 50%;background-color: #23428b;top: 50%;left: 0;transform: translateY(-50%);}
-.text_deco3 {position: relative;padding-right: 16px;}
-.text_deco3::after {position: absolute;content: "";width: 5px;height: 17px;border-radius: 2.5px;background-color: #fbc72b;top: 50%;left: 0;transform: translateY(-50%);}
-.font_ellipsis>p { text-overflow: ellipsis; overflow: hidden;display: -webkit-inline-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; font-weight: 300; line-break: anywhere; text-align: left;}
-.font_ellipsis>a>p { text-overflow: ellipsis; overflow: hidden;display: -webkit-inline-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical; font-weight: 400; line-break: anywhere; text-align: left;}
-
-/* sub page 공통 */
-.sub {background-color: #eee;color: #222; min-width: 1280px;}
-.sub .heading {position:relative;margin:0 0 25px;padding-bottom:23px;justify-items:center;}
-.sub .heading::after {content: "";width: calc(100% + 80px);height: 1px; position: absolute;background-color: #e5e5e5;left: -40px;bottom: 0;}
+/* =============================================
+   Sub Page 공통 레이아웃
+============================================= */
+.sub{background-color:#f2f2f2;color:#222;min-width:1280px;}
+.sub .heading{position:relative;margin:0 0 25px;padding-bottom:23px;justify-items:center;}
+.sub .heading::after{content:"";width:calc(100% + 80px);height:1px;position:absolute;background-color:#e5e5e5;left:-40px;bottom:0;}
 .sub .heading h1,
-.sub .heading h2 {font-size: 32px;display: inline-block;vertical-align: middle; margin-top: 5px; font-family: 'GmarketSansBold';}
-.sub .heading .button {position:absolute;right:0;top:-9px;padding:0 17px;font-size:16px;line-height:46px;text-align:center;border:1px solid #d5d5d5;border-radius:5px;}
-.sub .heading .button:hover {box-shadow:0px 0px 5px 3px rgba(0,0,0,0.12);}
-.sub .heading .button.attorney {border-color:#ffcc33;background-color:#ffcc33;}
-.sub .heading .button.attorney:before {content:'';display:inline-block;width:15px;height:19px;margin:14px 8px 0 0;vertical-align:top;background:url(/publish/images/content/icon_button_attorney.png) no-repeat left top;}
-.sub .heading .button.info:before {content:'';display:inline-block;width:18px;height:20px;margin:14px 8px 0 0;vertical-align:top;background:url(/publish/images/content/titBoxIcon.png) no-repeat left top;}
-.sub .heading .button.junk {right:130px;}
-.sub .heading .button.junk:before {content:'';display:inline-block;width:20px;height:18px;margin:15px 8px 0 0;vertical-align:top;background:url(/publish/images/login_introIcon.png) no-repeat left top;}
-.sub .heading .button.certificate {right:175px;}
-.sub .heading .button.certificate:before {content:'';display:inline-block;width:20px;height:18px;margin:15px 8px 0 0;vertical-align:top;background:url(/publish/images/content/titBoxIcon.png) no-repeat left top;}
-.sub .heading .button2 {padding:0 17px;font-size:16px;line-height:46px;text-align:center;border:1px solid #d5d5d5;border-radius:5px;}
-.sub .heading .button2:hover {box-shadow:0px 0px 5px 3px rgba(0,0,0,0.12);}
-.sub .heading .button2.info:before {content:'';display:inline-block;width:18px;height:20px;margin:14px 8px 0 0;vertical-align:top;background:url(/publish/images/content/titBoxIcon.png) no-repeat left top;}
+.sub .heading h2{font-size:32px;display:inline-block;vertical-align:middle;margin-top:5px;font-family:'GmarketSansBold';}
 
+.sub .heading .button{position:absolute;right:0;top:-9px;padding:0 17px;font-size:16px;line-height:46px;text-align:center;border:1px solid #d5d5d5;border-radius:5px;}
+.sub .heading .button:hover{box-shadow:0 0 5px 3px rgba(0,0,0,0.12);}
+.sub .heading .button.attorney{border-color:var(--secondary-light-color);background-color:var(--secondary-light-color);}
+.sub .heading .button.attorney:before{content:"";display:inline-block;width:15px;height:19px;margin:14px 8px 0 0;vertical-align:top;background:url(/publish/images/content/icon_button_attorney.png) no-repeat;}
+
+/* .sub .heading .button.info:before{content:"";display:inline-block;width:18px;height:20px;margin:14px 8px 0 0;vertical-align:top;background:url(/publish/images/content/titBoxIcon.png) no-repeat;} */
+.sub .heading .button.junk{right:100px;}
+/* .sub .heading .button.junk:before{content:"";display:inline-block;width:20px;height:18px;margin:15px 8px 0 0;vertical-align:top;background:url(/publish/images/login_introIcon.png) no-repeat;} */
+
+.sub .heading .button.certificate{right:175px;}
+.sub .heading .button.certificate:before{content:"";display:inline-block;width:20px;height:18px;margin:15px 8px 0 0;vertical-align:top;background:url(/publish/images/content/titBoxIcon.png) no-repeat;}
+
+.sub .heading .button2{padding:0 17px;font-size:16px;line-height:46px;text-align:center;border:1px solid #d5d5d5;border-radius:5px;}
+.sub .heading .button2:hover{box-shadow:0 0 5px 3px rgba(0,0,0,0.12);}
+.sub .heading .button2.info:before{content:"";display:inline-block;width:18px;height:20px;margin:14px 8px 0 0;vertical-align:top;background:url(/publish/images/content/titBoxIcon.png) no-repeat;}
+
+
+/* titBox */
 .titBox {padding: 8px 20px;border: 2px solid #dddddd;border-radius: 5px;margin:15px 0;position: relative;}
 .titBox a {display: inline-block;}
 .titBox p {color: #666;font-weight: 300;padding: 2px 0; font-size: 14px; line-height: 1.2;}
-.titBox p span {color: #e40000;font-weight: 500;}
+.titBox p span {color: #f43131;font-weight: 500;}
 .titBox.type1 p {width: 80%;}
 .titBox>button {position: absolute;right: 25px;top: 50%;transform: translateY(-50%);height: 42px; padding: 0 15px; border: 1px solid #d5d5d5;border-radius: 5px;font-size: 16px;}
 .titBox button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12); border: 1px solid #b1b1b1;}
@@ -102,108 +45,19 @@
 .titBox .btnWrap.type1 button {width: 250px;}
 .titBox .btnWrap.type2 {width: 180px;}
 .titBox .btnWrap.type2 button {width: 180px;}
-.titBox .btnWrap.type2 button:first-child:hover {border: 1px solid #129738 !important;}
+.titBox .btnWrap.type2 button:first-child:hover {border: 1px solid #15983a !important;}
 .titBox .btnWrap.type2 button:last-child:hover {border: 1px solid #53a6da !important;}
 /*발송결과 개선 : 화면 상단 박스*/
 .titBox_result {padding: 17px 25px;border: 3px solid #dddddd;border-radius: 5px;margin:15px 0 25px 0;position: relative;}
 .titBox_result p {color: #666;font-weight: 300;padding: 2px 0; font-size: 16px; line-height: 1.2;}
 
 .msg_com {background-color: #fff; border-radius: 5px;height: 26px;padding: 0 10px;font-weight: 600;display: inline-block;line-height: 25px;}
-.msg_com.msg_short {border: 1px solid #002c9a;color: #002c9a;}
+.msg_com.msg_short {border: 1px solid var(--primary-color);color: var(--primary-color);}
 .msg_com.msg_long {border: 1px solid #12bec9;color: #008d96;}
 .msg_com.msg_photo {border: 1px solid #e26ba9;color: #cf468d;}
-.msg_com.msg_allimtalk {border: 1px solid #fbc72b;color: #222;}
+.msg_com.msg_allimtalk {border: 1px solid #FBC72B;color: #222;}
 
-/* sub tab */
-/* tabTpye1 */
-.tabType1 {background-color: #fff;width: 100%;border-radius: 10px; display: flex;text-align: center;margin-bottom: 20px;border:2px solid #46484a;}
-.tabType1 li {flex-basis: calc(100%/2); position: relative;}
-.tabType1 li button {width: 100%;padding: 13px 0;font-size: 16px;position:relative;z-index:1;}
-.tabType1 li.active {background-color: #46484a;}
-.tabType1 li.active:after {content:'';position:absolute;left:-1px;top:-1px;width:100%;height:100%;border:1px solid #46484a;}
-.tabType1 li.active button {color: #fff;border:1px solid #46484a;background-color: #46484a;}
-.tabType1 li.active button:before {content:'';position:absolute;left:-1px;top:-1px;width:100%;height:100%;border:2px solid #46484a;box-sizing:border-box;}
-.tabType1 li.active button:after {content:'';position:absolute;left:-5px;top:-5px;width:100%;height:100%;border:5px solid #46484a;border-radius:10px;}
-.top_content {display: none;}
-.top_content.current {display: block;}
-/* tabTpye1 - 마이페이지 - 알림설정 */
-.alarm_cont {display: none;}
-.alarm_cont.current {display: block;}
-.mypage_content .tabType1 {background-color: #f4f4f5; color: #222; margin-top: 40px;}
-.mypage_content .tabType1 li.active button {background-color: #fbc72b; color: #222;}
-/* tabTpye1 - 결제내역 - 요금결제내역 */
-.pay_cont {display: none;}
-.pay_cont.current {display: block;}
-.pay_tab_wrap .tabType1 {background-color: #f4f4f5; color: #222; margin: 30px 0 ;border:0 none;border-radius:5px;}
-.pay_tab_wrap .tabType1 li::after {content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 30px; background-color: #d5d5d5;}
-.pay_tab_wrap .tabType1 li:last-child::after {content: none;}
-.pay_tab_wrap .tabType1 li:first-child button {border-radius:5px 0 0 5px;}
-.pay_tab_wrap .tabType1 li:last-child button {border-radius:0 5px 5px 0;}
-.pay_tab_wrap .tabType1 li.active {background-color:transparent;}
-.pay_tab_wrap .tabType1 li.active::after {content: none;}
-.pay_tab_wrap .tabType1 li.active button {background-color: #fbc72b; color: #222;border-radius:5px;line-height: 25px;}
-.pay_tab_wrap .tabType1 li.active button:before {display:none;}
-.pay_tab_wrap .tabType1 li.active button:after {display:none;}
-/* tabTpye1 - 충전하기 - 요금안내/견적내기 */
-.fee_cont {display: none;}
-.fee_cont.current {display: block;}
 
-/* tabTpye2 */
-.tabType2 {width: calc(100% - 600px); border-radius:10px 10px 0 0; display: flex;text-align: center;margin-bottom: 20px;position: relative;background-color: #fff;}
-.tabType2::after {position: absolute;height: 2px;background-color: #000;width: calc(100% + 600px);content: "";bottom: 0;left: 0;}
-.tabType2 li {flex-basis: calc(100% /4);min-width: 200px;}
-.tabType2 li button {width: 100%;padding: 13px 0;font-size: 20px;border-left: 1px solid #e5e5e5;background-color: #fff;}
-.tabType2 li:nth-child(3) button {border-left: 0;}
-.tabType2 li:first-child button {border-left: 0;border-radius: 10px 0 0 0;}
-.tabType2 li:last-child button {border-radius: 0 10px 0 0;}
-.tabType2 li.active button {background-color: #46484a;border-radius:10px 10px 0 0;color: #fff;border-left: 1px solid transparent;}
-.bottom_content {display: none;}
-.bottom_content.current {display: block;}
-
-/* tabTpye4 */
-.custom_content {display: none;}
-.custom_content.current {display: block;}
-.tabType4 {background-color: #fff;width: 100%;border-radius: 10px; display: flex;text-align: center;margin-bottom: 20px;border:2px solid #46484a;}
-.tabType4 li {flex-basis: calc(100%/3); position: relative;}
-.tabType4 li::after {content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 34px; background-color: #ccc;}
-.tabType4 li:last-child::after {content: none;}
-.tabType4 li.active::after {content: none;}
-.tabType4 li button {position:relative;width: 100%; height: 50px; padding: 12px 0;font-size: 18px; letter-spacing: -0.5px;}
-.tabType4 li.active button {color:#fff;border:1px solid #46484a;background-color:#46484a;}
-.tabType4 li.active button:before {content:'';position:absolute;left:-1px;top:-1px;width:100%;height:100%;border:2px solid #46484a;box-sizing:border-box;}
-.tabType4 li.active button:after {content:'';position:absolute;left:-5px;top:-5px;width:100%;height:100%;border:5px solid #46484a;border-radius:10px;}
-.tabType4.tabTwo li {flex-basis: calc(100%/2);}
-
-/* tabTpye5 */
-.popup_cont {display: none;}
-.popup_cont.current {display: block;}
-.tabType5 {background-color: #fff;width: 100%; border: 1px solid #dfdfdf; border-bottom: 1px solid #46484a; border-radius: 5px 5px 0 0; display: flex;text-align: center;}
-.tabType5 li {flex-basis: calc(100%/3); position: relative;}
-.tabType5 li::after {content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 100%; background-color: #c7c8c8;}
-.tabType5 li:last-child::after {content: none;}
-.tabType5 li.active::after {content: none;}
-.tabType5 li button {width: 100%;height: 45px; font-size: 18px;}
-.tabType5 li.active button {background-color: #46484a;border-radius: 5px 5px 0 0;color: #fff; font-weight: 300;}
-
-/* tabTpye6 */
-.history_cont {display: none;}
-.history_cont.current {display: block;}
-.tabType6 {background-color: #fff;width: 100%;border-bottom: 1px solid #e5e5e5;  display: flex;text-align: center;}
-.tabType6 li {flex-basis: calc(100%/2);}
-.tabType6 li button {width: 100%;height: 35px; font-size: 16px;border: 1px solid #dfdfdf; border-bottom: 1px solid #e5e5e5; border-radius: 5px 5px 0 0;}
-.tabType6 li.active button {background-color: #c8c8c8;border-radius: 5px 5px 0 0; border: 1px solid #c8c8c8;}
-.pay_refund_cont .pay_tType1 {margin-top:-20px;}
-.pay_refund_cont .pay_tType1 tbody tr:first-child {border-top:0 none;}
-/*// sub tab */
-
-/* calendar */
-.calendar_wrap {position:relative;display: inline-block;}
-.calendar_wrap>span {font-weight: 500;}
-.calendar_wrap>input[type="text"] {height: 36px;line-height: 36px;width: 140px;border: 1px solid #d5d5d5;font-size: 16px;font-weight: 300;padding: 0 5px;color: #777;background: url(/publish/images/calendar/calendarIcon2.png) #fff no-repeat right 7px center;}
-.calendar_in {position: relative;display: inline;}
-.calendar_in>button {  border: 1px solid transparent !important; height: 26px; margin: 1px 0 0 0; padding: 0; text-indent: -9999em; width: 26px; vertical-align: middle; position: absolute; right: 8px;top: 57%; transform: translateY(-50%);}
-.calendar_in .calendar-frame {border: 0;height: 290px;width: 320px;}
-.calendar_in .calendarPop {display: none;position: absolute;z-index: 10;top: 32px;left: -204px; border-radius: 10px 10px 0 0;box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12); background-color: #fff;}
 /* 요금결제 결제내역 */
 .pay_cont .calendar_in .calendarPop {top: 40px; left: -162px;}
 /* 요금결제 사용내역 */
@@ -216,8 +70,8 @@
 .tType1 {width: 100%;text-align: left;table-layout: fixed;}
 .tType1 tbody tr {border-bottom: 1px solid #e5e5e5;}
 .tType1 tbody tr:first-child{border-top: 2px solid #000;}
-.tType1 tbody tr th {min-width: 75px; height: 55px; vertical-align: middle;font-size: 17px; text-align: left;}
-.tType1 tbody tr th .essential {display:inline-block;margin:4px 2px 0 0;vertical-align:top;color:#e40000;}
+.tType1 tbody tr th {min-width: 75px; height: 55px; vertical-align: middle;font-size: 17px; font-weight: 500; text-align: left;}
+.tType1 tbody tr th .essential {display:inline-block;margin:4px 2px 0 0;vertical-align:top;color:#f43131;}
 .tType1 tbody tr th.vTop {vertical-align: top; padding-top: 20px; line-height: 1.2;}
 .tType1 tbody tr td {vertical-align: middle;font-weight: 300;line-height: 1.3; padding: 10px 0;}
 .tType1 tbody tr td p {line-height: 1.4;}
@@ -236,14 +90,14 @@
 .tType1 tbody tr td.putText .put_right { width: 26%; max-width: 200px; position: relative;}
 .tType1 tbody tr td.putText .put_right>button {width: calc(100% - 10px); margin-left: 10px;margin-bottom: 5px;}
 .tType1 tbody tr td.putText .put_right .btn_popup_wrap button:not(.btn_close) {width: calc(100% - 10px); margin-left: 10px;margin-bottom: 5px;}
-.tType1 tbody tr td.putText button .qmMark {background-image: url(/publish/images/content/qmIcon_s.png); width: 19px; height: 19px; margin-left: 5px; margin-top: -2px;}
+.tType1 tbody tr td.putText button .qmMark {background-image: url(/publish/images/content/qmIcon_s.png); width: 19px; height: 19px; margin:0 0 0 5px;}
 .tType1 tbody tr td.putText .put_right .send_btnWrap {position: absolute;bottom: 0;right:0;width: calc(100% - 10px);}
 .tType1 tbody tr td.putText .put_right .send_btnWrap button {width: 48.5%;}
 .tType1 tbody tr td.putText textarea {height: 160px; border: none;margin: 0;padding:0 15px;border-radius: 5px 5px 0 0;outline: 0;background-color: transparent; font-size: 15px;}
 /* 단문 */
 .tType1 tbody tr td.putText .put_left.short textarea {height: 190px;margin:10px 0;padding:0 5px;}
 .tType1 tbody tr td.putText .put_left.short textarea::placeholder {color: #b5b5b5;}
-.tType1 tbody tr td.putText .put_left.short.on {border: 1px solid #002c9a;border-radius: 5px;background-color: #eef2f9 !important;}
+.tType1 tbody tr td.putText .put_left.short.on {border: 1px solid var(--primary-color);border-radius: 5px;background-color: #EEF2F9 !important;}
 /* 장문 */
 .tType1 tbody tr td.putText .put_left.long textarea {height: 380px;}
 .tType1 tbody tr td.putText .put_left.long.on {border: 1px solid #12bec9;border-radius: 5px;background-color: #eef5f9 !important;}
@@ -256,15 +110,6 @@
 .tType1 tbody tr.msg_title td .title_wrap .textbox {display:none;margin:10px 0 0;}
 .tType1 tbody tr.msg_title td .title_wrap .textbox.active {display:block;}
 /*// tType1 기본 */
-
-.sort_wrap {display:inline-block;} 
-.sort_wrap button:nth-child(1) img {margin-left: 3px;}
-.sort_wrap button:nth-child(2) img {margin-left: -5px;}
-.sort_wrap button img {margin-bottom: 5px;}
-
-.sortBtn {background-image: url(/publish/images/sortUp.png);border: none;background-color: transparent;background-repeat: no-repeat;background-position: center center;height: 14px;cursor: pointer; margin: -3px 0 0 0;}
-.sortBtnDesc {background-image: url(/publish/images/sortDown.png);border: none;background-color: transparent;background-repeat: no-repeat;background-position: center center;height: 14px;cursor: pointer;margin: -2px 0 0 0;}
-.sortBtnAsc {background-image: url(/publish/images/sortUp.png);border: none;background-color: transparent;background-repeat: no-repeat;background-position: center center;height: 14px;cursor: pointer;}
 
 /* tType3 - table 모양이지만 div형태 */
 .tType3 {width: 100%; border-radius: 3px; border: 1px solid #ccc; box-sizing: border-box;}
@@ -285,13 +130,9 @@
 .table_cont.current {display: block;}
 
 /* thead */
-.tType3 .tType3_hd { display: flex; height: 36px; line-height: 34px; font-size: 15px; box-sizing: border-box; position: relative; z-index: 0; background-color: #ededed; text-align: center; border-radius: 3px 3px 0 0;}
-.tType3 .tType3_hd::after {content: ""; background-color: #e9e9e9; width: 100%; height: 18px; position: absolute; bottom: 0; left: 0;z-index: -1;}
-.tType3 .tType3_hd>div {border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; box-sizing: border-box;}
-.tType3 .tType3_hd>div:first-child {border-left: 0; } 
 .tType3 .font_ellipsis {position: relative;}
 /* 이용내역 호버 컨텐츠(이미지, 글 모두 보여줌) */
-.history_hover {position: absolute; width: 300px; height: 250px; padding: 25px; overflow: hidden; box-shadow: 0 0 8px rgba(0,0,0,0.5); background-color: #f4f6fa; border: 1px solid #002c9a; border-radius: 5px; z-index: 10; box-sizing: border-box; display: none;}
+.history_hover {position: absolute; width: 300px; height: 250px; padding: 25px; overflow: hidden; box-shadow: 0 0 8px rgba(0,0,0,0.5); background-color: #f4f6fa; border: 1px solid var(--primary-color); border-radius: 5px; z-index: 10; box-sizing: border-box; display: none;}
 .history_hover ul {display: flex; margin-bottom: 15px;}
 .history_hover ul li {width: calc(100%/3); height: 124px; margin-left: 5px; border-radius: 3px; overflow: hidden; background-color: #fff;}
 .history_hover ul li:first-child {margin-left: 0;}
@@ -313,7 +154,7 @@
 .history_hover .allimtalk_content button{margin: 0 0 8px 10px;}
 .history_hover .allimtalk_content button:last-child{margin-bottom: 0;}
 .history_hover .allimtalk_content .template_text+.btn_kakao_type{margin-top: 8px;}
-.history_hover .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ffea00;}
+.history_hover .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: var(--secondary-light-color);}
 .history_hover .allimtalk_content .btn_kakao_type{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ededed;}
 
 /* tbody */
@@ -331,32 +172,6 @@
 .tType3 .tType3_bd input[type="radio"] {margin-top: 0; margin-right: 0; vertical-align: revert;}
 
 
-.tb_wrap{position:relative;width: 100%; min-height: 430px; border: 1px solid #ccc; border-radius: 5px; margin-bottom: 10px; box-sizing: border-box;border-bottom:0 none;}
-.tb_wrap:after {content:'';position:absolute;left:2px;bottom:0;width:calc(100% - 4px);height:1px;background:#ccc;}
-.tType4{table-layout: fixed; width: 100%;}
-.tType4 thead{background-color: #ededed; position: relative; z-index: 0;}
-.tType4 thead tr:only-child th{height: 36px;}
-.tType4 thead th{border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: 15px; font-weight: 400; position: relative; z-index: 1; line-height: 25px; vertical-align: middle;}
-.tType4 thead th::after{position: absolute; content: " "; width: 100%; height: 18px; background-color: #e5e5e5; bottom: 0; left: 0; z-index: -1;}
-.tType4 thead th:last-child{border-right: 0;}
-.tType4 .sort_wrap{display: inline-block;}
-.tType4 tbody td{text-align: center; font-size: 15px; color: #666; font-weight: 400; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; height: 38px; vertical-align: middle; padding: 0 10px; box-sizing: border-box;}
-.tType4 tbody td.tb_tit{text-align: left; position: relative;}
-.tType4 tbody td.input_wrap2 input[type="text"] {text-align: center;background-color: #f2f2f2;width: calc(100% - 20px);height: 32px;border-radius: 5px;border: 1px solid #f2f2f2;margin-right: 0;color: #555;}
-.tType4 tbody tr:only-child:last-child td{border-bottom: 1px solid #ccc;}
-/* .tType4 tbody tr:nth-child(10n) td{border-bottom: 0;} */
-.tType4 tbody td:last-child{border-right: 0;}
-.tType4 tbody td>p{width: 100%; line-height: 38px; white-space: nowrap; text-overflow: ellipsis; letter-spacing: -0.5px; overflow: hidden;margin: 0 auto;}
-.tType4 tbody td span {font-weight: 400;}
-.tType4 td input[type="text"]{height: 28px; display: inline-block; border: 1px solid #e5e5e5; margin-right: 5px;}
-.tType4 tbody .btnType14 {height: 28px;}
-.tType4 .memo_text {width: calc(100% - 35px); margin-right: 5px; display: inline-block; text-align: left; vertical-align: inherit;}
-.tType4 tbody td span.textReject {line-height:28px;}
-.tType4 tbody td .btnTypeReject {margin:0 0 0 3px;line-height:26px;letter-spacing:0;text-align:center;vertical-align:top;}
-/* 발송결과 개선 : 테이블 내용 수정 */
-.tType4 tbody td.result_cont a {text-align: left!important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
-.tType4 tbody td.result_cont .result_tit { }
-.tType4 tbody td .cancel_date {font-size:14px; color:#666; display: block;}
 
 /* .thumb_wrap {position: absolute; margin-left: 20px; top: 20px; left: 0;} */
 .thumb_wrap {margin: 15px 0 0 10px;}
@@ -364,7 +179,7 @@
 .thumb_wrap li {margin: 0 2px; display: inline-block; position: relative;}
 .thumb_wrap li>div {width: 80px; height: 80px; border-radius: 5px; overflow: hidden; box-sizing: border-box;}
 .thumb_wrap li>div img {width: 80px;height:100%;object-fit:cover;}
-.thumb_wrap li.on>div {border: 2px solid #fbc72b;}
+.thumb_wrap li.on>div {border: 2px solid var(--secondary-light-color);}
 .thumb_wrap li button.file_close {position: absolute; top: 5px; right:5px; width: 20px; height: 20px; border: 1px solid #dbdbdb; border-radius: 50%; background-color: rgba(0,0,0,0.25); }
 .thumb_wrap li button.file_close_on {display: none;}
 .thumb_wrap li.on button.file_close {display: none;}
@@ -379,18 +194,18 @@
 /* 문자 보내기 - 받는사람 리스트 */
 .receipt_num {display: block !important;}
 .receipt_num_top{display:flex;}
-.receipt_num_top span {font-size: 14px; color: #e40000; font-weight: 400;white-space:nowrap;}
+.receipt_num_top span {font-size: 14px; color: #f43131; font-weight: 400;white-space:nowrap;}
 .receipt_num_midde {display: flex; width: 100%; margin-top: 10px;}
 .receipt_num_midde .tabulator .tabulator-header {margin-left:0 !important;}
 .receipt_num_midde .tabulator .tabulator-tableHolder .tabulator-placeholder[tabulator-render-mode=virtual] {width:100% !important;}
 .btn_popup_wrap.check_validity_wrap {position: absolute; bottom: 0; width: 100%;}
-.btn_popup_wrap.check_validity_wrap button {border: 1px solid #002c9a; color: #002c9a; margin-bottom: 0 !important; position: relative;}
+.btn_popup_wrap.check_validity_wrap button {border: 1px solid var(--primary-color); color: var(--primary-color); margin-bottom: 0 !important; position: relative;}
 .tType1 tbody tr td.putText textarea.receipt_num{height: 70px;padding: 10px 15px;background-color: #f2f2f2;border-radius: 5px;line-height: 1.4;}
 .receipt_num_top .btn_popup_wrap{display:inline-block;margin:0 0 0 10px;}
     
 
 .tType1_title {font-size: 20px; font-weight: 600; position: relative; height: 40px;}
-.tType1_title button {position: absolute;top: 22%; right: 0; transform: translateY(-50%); background-color: #002c9a; height: 40px; padding: 0 15px; color: #fff;}
+.tType1_title button {position: absolute;top: 22%; right: 0; transform: translateY(-50%); background-color: var(--primary-color); height: 40px; padding: 0 15px; color: #fff;}
 .tType1_title>span {font-size: 16px; font-weight: 300; color: #666;}
 .tType1 tbody tr td.send_list {position: relative;display: flex; justify-content: space-between;}
 .tType1 tbody tr td.send_list .list_left, .tType1 tbody tr td.send_list .list_right {width: calc(100%/2 - 25px);min-width: 290px;}
@@ -398,12 +213,8 @@
 .tType1 tbody tr td.send_list .list_left .add_num {height: 90px;}
 .tType1 tbody tr td.send_list .list_left .add_num input[type="text"] {width: calc(100% - 97px);min-width: 200px;}
 .tType1 tbody tr td.send_list .list_left .add_num input[type="text"]::placeholder {color: #a6a6a6; font-weight: 300;}
-.tType1 tbody tr td.send_list .list_left .add_num>span {color: #e40000;font-size: 13px;font-weight: 400;line-height: 39px;}
+.tType1 tbody tr td.send_list .list_left .add_num>span {color: #f43131;font-size: 13px;font-weight: 400;line-height: 39px;}
 .tType1 tbody tr td .text_req {display: inline-block; color: #999; font-size: 17px; font-weight: 300; vertical-align: middle;}
-.numOfCase {position: absolute;right: 0;top: 57px;}
-.numOfCase p {display: inline-block;font-size: 13px;}
-.numOfCase p:first-child span {color: #e40000;font-weight: 500;}
-.numOfCase p:last-child span {color: #002c9a;font-weight: 500;}
 
 .tType1 tbody tr td.send_list .list_right {right: 0;}
 .tType1 tbody tr td.send_list .list_right .list_btnWrap {display: flex;flex-flow: wrap;justify-content: space-between;}
@@ -426,18 +237,16 @@
 .drag_drop {height: calc(100% - 37px); padding: 100px 0; box-sizing: border-box; text-align: center;}
 .drag_drop_in {background-color: #fff; width: 600px;  height: 100%; padding: 50px 0; border-radius: 5px; border: 2px solid #d5d5d5; border-style: dashed; margin: 0 auto; font-size: 16px; box-sizing: border-box;}
 .drag_drop_in .drag_top i {background-image: url(/publish/images/content/drag&drop2.png); width: 100px; height: 74px; margin-bottom: 10px;}
-.drag_drop_in p {color: #002c9a; font-weight: 600; padding: 20px 0 10px 0; font-size: 20px;}
+.drag_drop_in p {color: var(--primary-color); font-weight: 600; padding: 20px 0 10px 0; font-size: 20px;}
 .drag_drop_in span {color: #666; font-weight: 300;}
 .drag_drop_in .drag_txt span {position: relative; display: block; padding: 3px; font-size: 20px;}
 .drag_drop_in .drag_txt span::after {position: absolute; content: ""; background-color: #d5d5d5;width: 96px; height: 1px; top:54%; left: 175px; transform: translateY(-50%);}
 .drag_drop_in .drag_txt span::before {position: absolute; content: ""; background-color: #d5d5d5;width: 96px; height: 1px; top:54%; right: 175px; transform: translateY(-50%);}
 
-.list_bottom {position: relative;margin-top: 10px;width: calc(100% - 190px); min-width: 420px;}
-.list_bottom .remove_btnWrap {float: left;}
-.list_bottom .list_bottom_right {float: right; font-size: 16px; display: flex;}
-.list_bottom .list_bottom_right p {line-height: 36px;}
+.list_bottom {position: relative;display:flex;margin-top: 10px;width: calc(100% - 190px); min-width: 420px;justify-content:space-between;align-items:center;}
+.list_bottom .list_bottom_right{display:flex;font-size:16px;align-items:center;}
 .list_bottom .list_bottom_right span {font-size: 20px; font-weight: 600 !important;}
-.list_bottom .list_bottom_right .address_reg2 {height: 36px; padding: 0 10px; border-radius: 5px;font-weight: 400; background-color: #6a6c72; color: #fff; margin-left: 10px;}
+.list_bottom .list_bottom_right .address_reg2 {height: 36px; padding: 0 10px; border-radius: 3px; font-size:14px;font-weight: 400; background-color: #888; color: #fff; margin-left: 10px;}
 
 .list_bottom .remove_btnWrap .address_reg2 {width: calc(100% - 246px); background-color: #6a6c72; color: #fff; border-radius: 5px; font-weight: 300;}
 .list_bottom .remove_btnWrap .check_validity {height: 32px; position: absolute; right: 0;}
@@ -454,13 +263,13 @@
 .tType1 tbody tr th.billingAmount>div .final_pay {position: relative; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;}
 .tType1 tbody tr th.billingAmount>div p:first-child {font-size: 20px;font-weight: 500;}
 .tType1 tbody tr th.billingAmount>div p:last-child {font-size: 20px;}
-.tType1 tbody tr th.billingAmount>div p span#totalPriceTxt {font-size: 24px;color: #e40000;font-weight: 500;}
+.tType1 tbody tr th.billingAmount>div p span#totalPriceTxt {font-size: 24px;color: #f43131;font-weight: 500;}
 .tType1 tbody tr th.billingAmount>div p span:last-child {font-size: 16px;color: #888;font-weight: 300;}
 .tType1 tbody tr th.billingAmount .pay_info_list p {float:left;line-height:35px;}
 .tType1 tbody tr th.billingAmount .pay_info_list .info {float:left;margin:0 0 0 15px;padding:8px 15px 10px;font-size:16px;font-weight:300;color:#555;background:#e5e5e5;border-radius:5px;box-sizing:border-box;}
-.tType1 tbody tr th.billingAmount .pay_info_list .info strong {font-size:18px;font-weight:700;color:#002c9a;}
+.tType1 tbody tr th.billingAmount .pay_info_list .info strong {font-size:18px;font-weight:700;color:var(--primary-color);}
 .tType1 tbody tr th.billingAmount .pay_info_list .info span {margin:0 8px 0 7px;} 
-.tType1 tbody tr th.billingAmount button.cal_btn {position: absolute;right: 0; top: 50%;transform: translateY(-50%);background-color: #fbc72b;width: 88px;height: 32px;border-radius: 5px;}
+.tType1 tbody tr th.billingAmount button.cal_btn {position: absolute;right: 0; top: 50%;transform: translateY(-50%);background-color: var(--secondary-light-color);width: 88px;height: 32px;border-radius: 5px;}
 .tType1 tbody tr th.billingAmount button.cal_btn:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
 .tType1 tbody tr th.billingAmount button.cal_btn i {background-image: url(/publish/images/content/calIcon.png);width: 12px;height: 16px;margin: 0 3px 2px 0;}
 .tType1 tbody tr th.billingAmount .pay_type {background-color: #fff; border-radius: 5px 5px 0 0; height: 60px; padding: 12px 13px; box-sizing: border-box;}
@@ -480,7 +289,7 @@
 .tType1 tbody tr td.check_num>div button {height: 40px; padding: 0 5px;}
 .tType1 tbody input[type="text"] {height: 40px; padding: 0 15px; background-color: #f2f2f2;border-radius: 5px;line-height:38px;}
 .tType1 tbody input[type="password"] {height: 50px; padding: 0 15px; background-color: #f2f2f2;border-radius: 5px; font-size: 16px;}
-.tType1 tbody select.sel_number {width: 340px; height: 40px; padding: 0 20px; background-color: #f2f2f2;border-radius: 5px; border: 0;color: #002c9a;font-weight: 400;font-size: 16px;background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 94% center;}
+.tType1 tbody select.sel_number {width: 340px; height: 40px; padding: 0 20px; background-color: #f2f2f2;border-radius: 5px; border: 0;color: var(--primary-color);font-weight: 400;font-size: 16px;background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 94% center;}
 .tType1 tbody input[type="text"]::placeholder {color: #a6a6a6;}
 .tType1 tbody input:disabled {background-color: #dedede;}
 
@@ -493,9 +302,9 @@
 .my_price_wrap .title{font-size: 17px; font-weight: 400; color: #222; margin-top: 1px;}
 .my_price_wrap .title span{font-size: 15px;}
 .my_price_wrap .title img{margin: 0 8px 0 0; vertical-align: top;}
-.my_price_wrap .type{border: 1px solid #46484a; border-radius: 3px; margin-right: 3px; color: #46484a; padding: 0 4px 1px 4px;}
-.my_price_wrap .type, .price_line{font-size: 16px; font-weight: 400; color: #555;}
-.my_price_wrap .price{color: #e40000; font-size: 18px; font-weight: 700;}
+.my_price_wrap .type{min-width:36px;height:26px;border:1px solid #d5d5d5;border-radius:3px;margin:0 3px 0 0;color:#6d6d6d;padding:0 4px 1px 4px;}
+.my_price_wrap .type, .price_line{font-size: 16px; font-weight: 400; color: #6d6d6d;}
+.my_price_wrap .price{color: #f43131; font-size: 18px; font-weight: 700;}
 .my_price_wrap .line{font-size: 14px; color: #ababab;}
 
 /*// tType1 */
@@ -504,16 +313,16 @@
 /* sub1 문자전송 */
 /* send_top */ 
 .send_top .top_content {background-color: #fff;padding: 30px 40px;border-radius: 10px;}
-.send_top .top_content .ad_text{display:inline-flex;height:40px;margin:-2px 0 0 8px;padding:0 20px;font-size:15px;font-weight:400;border:1px solid #afa2e9;border-radius:5px;background:#f0eefa;justify-content:center;align-items:center;vertical-align:middle;}
-.send_top .top_content .ad_text i{width:20px;height:20px;margin:0 8px 0 0;font-size:15px;font-weight:bold;color:#fff;text-align:center;border-radius:100%;background:#e40000;line-height:20px;}
-.send_top .top_content .ad_text a{color:#e40000;font-weight:bold;}
+.send_top .top_content .ad_text{display:inline-flex;height:40px;margin:-2px 0 0 8px;padding:0 20px;font-size:15px;font-weight:400;border:1px solid #e7e7e7;border-radius:5px;background:#fff;justify-content:center;align-items:center;vertical-align:middle;}
+.send_top .top_content .ad_text i{width:20px;height:20px;margin:0 8px 0 0;font-size:15px;font-weight:bold;color:#fff;text-align:center;border-radius:100%;background:#888;line-height:20px;}
+.send_top .top_content .ad_text a{color:#f43131;font-weight:bold;text-decoration: underline;}
 .send_top .send_price {display: inline-block;position: relative;margin-left:50px;vertical-align: middle;line-height: 25px;height: 27.5px;}
-.send_top .send_price::after {content: "";position: absolute;background-color: #002c9a;width: 3px;height: 20px;border-radius: 2px; top: 50%;transform: translateY(-50%);left: -30px;}
+.send_top .send_price::after {content: "";position: absolute;background-color: var(--primary-color);width: 3px;height: 20px;border-radius: 2px; top: 50%;transform: translateY(-50%);left: -30px;}
 .send_top .send_price li {display: inline-block;color: #555;padding-right: 7px;margin-right: 5px;position: relative; font-size: 15px; letter-spacing: -0.5px;}
 .send_top .heading .send_price li:first-child {margin-right:28px;}
 .send_top .send_price .price_line::after {content: "/";position: absolute;top: 50%;transform: translateY(-50%);right: 0;color: #ababab;font-size: 14px;}
 .send_top .send_price li .type {border: 1px solid #46484a;border-radius: 3px;margin-right: 8px; color: #46484a;padding: 0 4px;}
-.send_top .send_price li .price {color: #e40000;font-size: 16px;font-weight: 700;}
+.send_top .send_price li .price {color: #f43131;font-size: 16px;font-weight: 700;}
 .send_top .send_general {width: 100%;display: flex;display: -ms-flexbox; justify-content: space-between; position: relative;}
 /* left area 내용 입력 */
 .send_top .send_left {max-width: 870px;flex-basis: 68%;}
@@ -525,7 +334,7 @@
 .send_top .send_left .myprice_view dd ul li:after {content:'/';position:absolute;left:-17px;top:0;font-size:14px;line-height:24px;color:#ababab;}
 .send_top .send_left .myprice_view dd ul li:first-child:after {display:none;}
 .send_top .send_left .myprice_view dd ul li .type {display:inline-block;width:40px;height:24px;margin:0 9px 0 0;font-size:16px;line-height:22px;text-align:center;vertical-align:top;color:#555;border:1px solid #555;background:#fff;border-radius:3px;box-sizing:border-box;}
-.send_top .send_left .myprice_view dd ul li .price {display:inline-block;font-size:18px;font-weight:700;line-height:24px;vertical-align:top;color:#002c9a;}
+.send_top .send_left .myprice_view dd ul li .price {display:inline-block;font-size:18px;font-weight:700;line-height:24px;vertical-align:top;color:var(--primary-color);}
 .send_top .send_left .myprice_view dd ul li .count {font-size:13px;}
 /* right area 문자 미리보기 */
 .send_top .send_right {flex-basis: calc(100% - 68% - 80px); position: relative;min-height:630px;}
@@ -534,11 +343,12 @@
 .send_top .send_right .phone {width: 320px; position: absolute; right: -2px; top: 0; transition: top 0.1s linear;}
 .send_top .send_right .phone .phoneIn {background-image: url(/publish/images/content/phoneBg.png); height: 600px; background-size: 100% auto; background-repeat: no-repeat; }
 .send_top .send_right .phone .phoneIn>div {padding: 45px 25px 0 25px; position: relative; height: 96%; box-sizing: border-box;}
+.send_top .send_right .phone .phoneIn .phone_top{display:flex;font-size:16px;font-weight:500;gap:8px;align-items:center;flex-wrap:wrap;}
 .send_top .send_right .phone .prev_p {font-size: 20px;font-weight: 500;padding-bottom: 12px;border-bottom: 1px solid #e5e5e5;}
 .send_top .send_right .phone .text_length2 {padding: 12px 0;}
 .send_top .send_right .phone .text_length2>span {float: left;line-height: 27px;}
 .send_top .send_right .phone .text_length2>div {float: right;margin-top: 3px;}
-.send_top .send_right .phone .text_length2>div span {color: #002c9a;font-size: 15px;padding-right: 2px;}
+.send_top .send_right .phone .text_length2>div span {color:#888;font-size:15px;padding-right:2px;}
 .send_top .send_right .phone .text_length2>div button {width: 24px;height: 24px; border: 1px solid #ccc;border-radius: 3px;}
 .send_top .send_right .phone .text_length2>div button:hover {border: 1px solid #a3a3a3;}
 .send_top .send_right .phone .text_length2>div button img {margin-bottom: 2px;}
@@ -552,7 +362,7 @@
 .preview_auto p {word-break: break-all;}
 .preview_auto .none_txt {color: #999; font-weight: 300;}
 /* 핸드폰 안에 내용 길어져서 스크롤 생길 때 */
-.send_top .send_right .phone .addText {color: #002c9a;text-align: center; font-size: 14px; padding-top: 10px; margin:0 0 10px 0;}
+.send_top .send_right .phone .addText {color: var(--primary-color);text-align: center; font-size: 14px; padding-top: 10px; margin:0 0 10px 0;}
 .send_top .send_right .preview_util{display:flex;align-items:center;justify-content:center;border-bottom:1px solid #d5d5d5;margin:20px 0 0 0;padding:0 0 20px 0;}
 .send_top .send_right .preview_util>*{margin:0 2px;}
 .send_top .send_right .preview_util button{width:32px;height:32px;border-radius:5px;border:1px solid #d5d5d5;background:#F5f5f5;}
@@ -597,7 +407,7 @@
 
 /* sub1 엑셀 문자(대량 전송) */
 .send_top .get_excel .button.ad_btn i{position:absolute;display:inline-block;width:47px;height:36px;background:url(/publish/images/required_read.gif) no-repeat center;left:-23px;top:-21px;}
-.send_top .get_excel .tType1 tbody tr td.putText .put_left{background:#f0eefa;}
+.send_top .get_excel .tType1 tbody tr td.putText .put_left{background:#F0F6F9;}
 .send_top .get_excel .send_right .phone {height: 93%; position: absolute; top: 0; right: 0;}
 .send_general.sec .tType1 tbody tr:first-child {border-top: 0;}
 .send_top .excelWrap {padding: 20px 0;}
@@ -605,7 +415,7 @@
 .excel_middle .select_btnWrap div{gap:6px;}
 .send_top .excelWrap .excel_selBox {margin-bottom: 10px; display: flex; justify-content: space-between;}
 .send_top .excelWrap .excel_selBox select.selType1 {padding: 0 80px 0 10px;}
-.send_top .excelWrap .excel_selBox span {color: #e40000; font-size: 14px; padding-left: 5px;}
+.send_top .excelWrap .excel_selBox span {color: #f43131; font-size: 14px; padding-left: 5px;}
 .send_top .excelWrap .excel_selBox button {height: 36px; padding: 0 12px; border-radius: 5px; font-size: 14px; letter-spacing: 0;}
 .send_top .excelWrap .excel_selBox button.btnType14 i {background-image: url(/publish/images/content/excel_put_number.png); width: 21px; height: 16px;margin: 0 6px 4px 0;}
 .send_top .excelWrap .file_add {margin-bottom: 20px}
@@ -617,13 +427,13 @@
 .select_btnWrap>div button {height: 32px; padding: 0 10px; border-radius: 5px;  background-color: #fff; font-size: 14px;line-height:30px;}
 .select_btnWrap>div:first-child button {border: 1px solid #d5d5d5; color: #555}
 .select_btnWrap>div button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-/* .select_btnWrap>div:first-child button:hover {border: 1px solid #e40000;color: #e40000;} */
+/* .select_btnWrap>div:first-child button:hover {border: 1px solid #f43131;color: #f43131;} */
 /* .select_btnWrap>div:first-child button:nth-child(1) i {background-image: url(/publish/images/content/add_icon.png);width: 10px;height: 10px;margin-right: 3px;}
 .select_btnWrap>div:first-child button:nth-child(2) i {background-image: url(/publish/images/content/remove_icon.png);width: 10px;height: 2px;margin-right: 3px;} */
-button.check_validity {padding: 0 10px; border-radius: 5px; border:1px solid #b1b1b1; color: #555; }
-button.check_validity i {background-image: url(/publish/images/content/qmIcon_s.png); width: 18px; height: 18px; margin: 0 0 2px 5px;}
+button.check_validity {display:flex;padding: 0 10px; border-radius: 5px; border:1px solid #b1b1b1; color: #555; justify-content:center;align-items:center;gap:4px;}
+button.check_validity i {background-image: url(/publish/images/content/qmIcon_s.png); width: 20px; height: 20px; margin:0;}
 button.check_validity:hover  {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.select_btnWrap>div:last-child button.address_reg {border:1px solid #002c9a; color: #002c9a;}
+.select_btnWrap>div:last-child button.address_reg {border:1px solid var(--primary-color); color: var(--primary-color);}
 .select_btnWrap>div:last-child button.address_reg:hover  {border: 1px solid #002788;color: #002788;}
 .send_top .get_excel .send_right .send_rev {margin: 20px 0 0;}
 
@@ -631,7 +441,7 @@
 .sub .election .heading {position:relative;padding-bottom: 13px;}
 .sub .election .heading>div:first-child {margin-top: 2px;}
 .sub .election .heading .election_btnWrap {position:absolute;right:0;top:0;}
-.sub .election .heading button {height: 42px; padding: 0 12px; border: 1px solid #002c9a; border-radius: 5px; margin-left: 2px; font-size: 15px; line-height: 2; color: #002c9a;}
+.sub .election .heading button {height: 42px; padding: 0 12px; border: 1px solid var(--primary-color); border-radius: 5px; margin-left: 2px; font-size: 15px; line-height: 2; color: var(--primary-color);}
 .sub .election .heading .button2 {padding:0 17px;line-height:40px;border-color:#d5d5d5;color:#222;}
 .sub .election .heading .button2.info:before {margin-top:10px;}
 .sub .heading i.election_btn1 {background-image: url(/publish/images/content/candidate_img.png); width: 25px; height: 22px; margin: 0 3px 0px 0;}
@@ -730,6 +540,7 @@
 .search_sample input[type="text"]::placeholder {font-size: 17px; font-weight: 300; color: #999;}
 .search_sample button {background-color: #fff;width: 40px;height: 40px;border-radius: 0 3px 3px 0;}
 .search_sample button img {width: 20px;height: 20px;}
+
 /* 문자 샘플 탭 */
 .area_tabs{text-align: center; margin-bottom: 30px;}
 .area_tabs .top_tab{display: flex; justify-content: space-between; position: relative;padding:0 0 0 160px;}
@@ -737,47 +548,50 @@
 .tab_depth1 a{width: 50px;line-height: 36px;border-right: 1px solid #bcbdc1;}
 .tab_depth1 a:first-child{border-radius: 5px 0 0 5px;}
 .tab_depth1 a:last-child{border-right: 0;border-radius: 0 5px 5px 0;}
-.tab_depth1 a.on{background-color:#fff;border:1px solid #002c9a;font-size:16px;font-weight:500;color:#002c9a;line-height:35px;height:36px;margin:-1px 0 0;}
+.tab_depth1 a.on{background-color:#fff;border:1px solid var(--primary-color);font-size:16px;font-weight:500;color:var(--primary-color);line-height:35px;height:36px;margin:-1px 0 0;}
 .tab_depth1 a.on:last-child{border-radius: 0 5px 5px 0;}
 .tab_depth1 .on_active {display:none;}
-.area_tabs .tab_depth2{width: 45%;justify-content: center;margin: 0 auto; align-self: center;display: flex;}
-.area_tabs .tab_depth2>div {display: none;}
-.area_tabs .tab_depth2 .photo_wrap.active {display: block;}
-.area_tabs .tab_depth2 a{padding: 0 30px; color: #555; font-size: 19px;height: 53px;line-height: 50px; box-sizing: border-box; border: 1px solid #b1b1b1; border-radius: 100px;margin: 0 5px; flex-basis: calc(95% / 3);transition: all 0.1s ease-in-out;}
-.area_tabs .tab_depth2 a.on{position: relative; background-color: #fff;border: 3px solid #002c9a;border-radius: 100px; color: #002c90; font-weight: 600; box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3); height: 53px; line-height: 44px; transition: all 0.1s ease-in-out;}
-.area_tabs .tab_depth2 a.on::after{position: absolute; content: "▼"; font-size: 15px; bottom: -30px; left: 50%; transform: translateX(-50%); z-index: 1;}
-.area_tabs .tab_depth2 a.tab_next::after,.tab_depth2 a.tab_prev::after{display: none;}
-.area_tabs .bottom_tab{margin-top: 20px;}
-.area_tabs .tab_depth3{width: 100%; display: flex; flex-wrap: wrap; justify-content: center; background-color: #f2f2f2;font-size: 16px; letter-spacing: -0.5px; color: #666;font-weight: 300;padding: 20px 40px; border-radius: 10px;margin-bottom: 30px; box-sizing: border-box;}
-.area_tabs .tab_depth3 a{padding: 0 15px;position: relative; line-height: 2;}
-.area_tabs .tab_depth3 a:hover{color: #002c9a;text-decoration: underline;}
-.area_tabs .tab_depth3 a.on{color: #002c9a; font-weight: 600;}
-.area_tabs .tab_depth3 a.on::before{position: absolute; content: " "; width: calc(100% - 25px); height: 5px; background-color: #003ed9; opacity: 0.2; bottom: 8px; left: 12px;}
-.area_tabs .tab_depth3 a::after{position: absolute; content: " "; width: 4px; height: 4px; background-color: #c3c4c5; border-radius: 10px; top: 15px;right: -3px;}
+
+.area_tabs .tab_depth2{display:flex;width:45%;margin:0 auto;justify-content:center;align-self:center;gap:10px;}
+.area_tabs .tab_depth2>div {display:none;}
+.area_tabs .tab_depth2 .photo_wrap.active {display:block;}
+.area_tabs .tab_depth2 a{display:flex;width:150px;height:53px;font-size:17px;font-weight:500;color:#555;border:1px solid #d5d5d5;border-radius:60px;justify-content:center;align-items:center;}
+.area_tabs .tab_depth2 a.on{position:relative;background-color:var(--primary-color);border:1px solid var(--primary-color);font-weight:600;color:#fff;box-shadow:0 0 10px rgba(0, 0, 0, 0.2);transition:all 0.1s ease-in-out;}
+
+.area_tabs .bottom_tab{margin:25px 0 0 0;}
+.area_tabs .tab_depth3{display:flex;width:100%;background:#f2f2f2;font-size:16px;font-weight:300;color:#666;letter-spacing:-0.5px;padding:20px 40px;margin:0 0 30px 0;border-radius:10px;box-sizing:border-box;flex-wrap:wrap;justify-content:center;}
+.area_tabs .tab_depth3 a{position:relative;padding:0 15px;line-height:2;}
+.area_tabs .tab_depth3 a:hover{color:var(--primary-color);text-decoration:underline;}
+.area_tabs .tab_depth3 a.on{color:var(--primary-color);font-weight:600;}
+.area_tabs .tab_depth3 a.on::before{position:absolute;content:"";width:calc(100% - 25px);height:5px;background-color:var(--primary-color);opacity:0.2;bottom:8px;left:12px;}
+.area_tabs .tab_depth3 a::after{position:absolute;content:"";width:4px;height:4px;background-color:#b0b0b0;border-radius:100%;top:13px;right:-2px;}
 .area_tabs .tab_depth3 a:last-child::after{display: none;}
-.area_tabs .tab_depth4{position: relative; min-width: 550px; /* display: inline-flex; justify-content: center; background-image: url(/publish/images/tab4_item01.png),url(/publish/images/tab4_item01.png); background-repeat: no-repeat; background-position: left center, right center; */ margin: 0 auto;font-size: 15px;}
-/* .area_tabs .tab_depth4::before{position: absolute; content: " "; width: 100%; height: 1px; background-color: #d5d5d5; top: 50%; left: 0; z-index: 0;} */
-.area_tabs .tab_depth4 a{padding: 8px 25px 9px 25px; border: 1px solid #dbdce0; color: #666; font-size: 17px; font-weight: 400; background-color: #fff; margin: 5px; border-radius: 30px; z-index: 2; transition: all 0.2s ease-in-out;display:inline-block;}
-.area_tabs .tab_depth4 a.on{background-color: #fbc72b; border: 1px solid #fbc72b; color: #222; font-weight: 500; box-shadow: 0 0 7px rgba(0,0,0,0.25); transition: all 0.2s ease-in-out;}
-.customReq {position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
-.customReq button {height: 36px; padding: 0 12px; border-radius: 5px; background-color: #002c9a; font-size: 18px; color: #fff;}
-.customReq button i {background-image: url(/publish/images/content/customReq.png); width: 22px; height: 18px; margin: 0 10px 3px 0 ;}
-.customReq button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
+
+.area_tabs .tab_depth4{position:relative;display:flex;min-width:550px;margin:0 auto;font-size:15px;gap:10px;flex-wrap:wrap;justify-content:center;align-items:center;}
+.area_tabs .tab_depth4 a{padding:8px 25px 9px 25px;border:1px solid var(--gray-border);color:#555;font-size:17px;font-weight:300;background:#fff;border-radius:30px;z-index:2;transition: all 0.2s ease-in-out;display:inline-block;}
+.area_tabs .tab_depth4 a.on{background-color:var(--gray-color-hover);border:1px solid var(--gray-color-hover);color:#Fff;font-weight:500;box-shadow:0 0 10px rgba(0,0,0,0.2);}
+
+.customReq {position:absolute;left:0;top:50%;transform:translateY(-50%);}
+.customReq button {width:143px;height:42px;background:var(--primary-dark-color);padding:0 12px;font-size:17px;font-weight:500;color:#fff;border-radius:3px;}
+.customReq button i {display:none;}
+.customReq button:hover {box-shadow: 0px 0px 10px rgba(0,0,0,0.2);}
 .customReq input[type=button] {display:none;}
+
 .area_total_count {min-height:5px;margin:-12px 0 10px;font-size:16px;font-weight:300;text-align:left;color:#555;}
 .area_total_count strong {font-weight:500;color:#000;}
+
 /* 문자샘플 콘텐츠 */
 .area_tabcontent{display: flex; flex-wrap: wrap; width: 100%; justify-content: flex-start; text-align: center; margin-bottom: 50px;}
 .area_tabcontent li{width: calc(100% / 5 - 11px); border: 1px solid #d5d5d5; background-color: #f2f2f2; border-radius: 10px; padding: 0 14px; margin-bottom: 13px; box-sizing: border-box;margin-right: 13px; transition: all 0.3s ease-in-out;cursor:pointer;height:100%;}
 .area_tabcontent li:nth-child(5n){margin-right: 0;}
-.area_tabcontent li .tit_text_wrap {position:relative;padding: 10px 5px;}
-.area_tabcontent li .tit_text{width:100%;height: 16px; margin: 0 auto; font-size: 14px; font-weight: 500;  text-overflow: ellipsis;overflow: hidden;display:-webkit-inline-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;text-align:left;padding:0 85px 0 0;box-sizing:border-box;}
-.area_tabcontent li .tit_text_wrap .custom_button {position:absolute;right:0;top:5px;width:85px;height:24px;font-size:13px;font-weight:300;line-height:22px;text-align:center;color:#002c9a;border:1px solid #002c9a;background:#fff;border-radius:5px;}
+.area_tabcontent li .tit_text_wrap {position:relative;display:flex;padding:10px 5px;justify-content:space-between;align-items:center;}
+.area_tabcontent li .tit_text{width:100%;margin:0 auto;padding:0 85px 0 0;font-size:14px;font-weight:500;text-overflow:ellipsis;overflow:hidden;display:-webkit-inline-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;text-align:left;box-sizing:border-box;}
+.area_tabcontent li .tit_text_wrap .custom_button {position:absolute;right:0;top:5px;width:85px;height:24px;font-size:13px;font-weight:300;line-height:22px;text-align:center;color:var(--primary-color);border:1px solid var(--primary-color);background:#fff;border-radius:5px;}
 .area_tabcontent .msg_cont{width: 100%; height: 240px; text-align: left; position: relative;}
-.area_tabcontent .msg_cont .msg_text{display: inline-block; width: 100%; height: 100%; min-height: 240px; border-radius: 5px; letter-spacing: -0.5px; line-height: 1.2; font-size: 15px; font-weight: 300; font-family: 'Noto Sans KR', sans-serif; color: #555; padding: 13px 14px; background-color: #fff; box-sizing: border-box;overflow:hidden;overflow-y:auto;word-break:break-all;}
+.area_tabcontent .msg_cont .msg_text{display: inline-block; width: 100%; height: 100%; min-height: 240px; border-radius: 5px; letter-spacing: -0.5px; line-height: 1.2; font-size: 15px; font-weight: 300; font-family: 'Pretendard'; color: #555; padding: 13px 14px; background-color: #fff; box-sizing: border-box;overflow:hidden;overflow-y:auto;word-break:break-all;}
 .area_tabcontent li .info_text{font-size: 13px; font-weight: 300; color: #222; padding: 10px 0;}
-.area_tabcontent li .info_text .limit_text{color: #002c9a; font-weight: 500;}
-.area_tabcontent li:hover{border: 1px solid #002c9a; background-color: #e7ecf6; color: #002c9a; box-shadow: 0 0 8px rgba(0,0,0,0.25); transition: all 0.3s ease-in-out;}
+.area_tabcontent li .info_text .limit_text{color: var(--primary-color); font-weight: 500;}
+.area_tabcontent li:hover{border:1px solid var(--primary-color);background:var(--primary-lighter-color);color:#222;box-shadow: 0 0 10px rgba(0,0,0,0.2);transition:all 0.3s ease-in-out;}
 .area_tabcontent.photo_sample {min-height:773px;}
 
 /* 내 문자함 */
@@ -788,7 +602,7 @@
 .area_tabcontent.myBox li .tit_text_wrap {display: flex;}
 .area_tabcontent.myBox li .tit_text {padding-right: 16px;}
 .area_tabcontent li .info_text {text-align: right;}
-.area_tabcontent.myBox .myphoto_info {position: absolute; left: 14px; bottom:0;}
+.area_tabcontent.myBox .myphoto_info {position: absolute; left: 14px; bottom:6px;}
 .area_tabcontent.myBox .myphoto_info p {color: #555;}
 
 
@@ -802,17 +616,17 @@
 
 /* 지도/약도 추가 */
 .map_search {margin-bottom: 20px;}
-.map_search input[type="text"] {width: 260px; height: 40px; padding: 0 15px;  border-radius: 5px; border: 2px solid #fbc72b;}
+.map_search input[type="text"] {width: 260px; height: 40px; padding: 0 15px;  border-radius: 5px; border: 2px solid var(--gray-border);}
 .map_search input[type="text"]::placeholder {font-weight: 300; color: #a6a6a6;}
 .map_search button {padding: 0 19px; height: 40px; border-radius: 5px; margin-left: 2px;}
-.map_search .map_check {background-color: #fbc72b;}
+.map_search .map_check {background-color: var(--secondary-light-color); border:1px solid var(--secondary-light-color-hover);}
 .map_search .map_add {background-color: #2a57c8; color: #fff;}
 .map_search p {font-size: 14px; font-weight: 300; display: inline-block;padding-left: 12px; vertical-align: middle;}
 /* //지도/약도 추가 */
 
 
 /* sub2 맞춤제작 */
-.custom_visual { max-width: 1400px; height: 480px; border-radius: 10px; margin: 0 auto 20px auto; overflow: hidden;}
+.custom_visual { max-width: 1400px; height: 400px; border-radius: 10px; margin: 0 auto 20px auto; overflow: hidden;}
 .custom_visual .custom_visual_image {background-image: url(/publish/images/content/custom_visual.jpg); background-repeat: no-repeat; width: 100%; height: 100%;}
 .custom_content {background-color: #fff; padding: 40px; border-radius: 10px;}
 
@@ -820,10 +634,14 @@
 .custom_content.custom1 .area_tabcontent {min-height:720px;}
 .custom_content.custom1 .area_tabcontent li {position: relative;padding: 7px;}
 .custom_content.custom1 .photo_cont {vertical-align: middle;}
+
+.custom_content.custom1 .area_tabs .top_tab{padding:0;}
+.custom_content.custom1 .area_tabs .customReq{position:relative;transform:none;}
+
 /* 제작방법 및 이용안내 */
 .custom_content.custom2 .cont_top {margin: 50px 0 80px 0;}
 .custom_content.custom2 table {width: 100%; color: #222; font-size: 18px;text-align: center;}
-.custom_content.custom2 table thead tr {background-color: #fbc72b; border-radius: 5px;height: 50px; line-height: 50px;font-weight: 500;}
+.custom_content.custom2 table thead tr {background-color: var(--secondary-light-color); border-radius: 5px;height: 50px; line-height: 50px;font-weight: 500;}
 .custom_content.custom2 table thead tr th:first-child {border-radius:5px 0 0 5px;}
 .custom_content.custom2 table thead tr th:last-child {border-radius:0 5px 5px 0;}
 .custom_content.custom2 table thead tr span {font-size: 14px;}
@@ -840,10 +658,10 @@
 
 .custom_content.custom2 .cont_bottom {}
 .custom_content.custom2 .cont_bottom .custom_step {position:relative;padding:57px 45px 80px 45px;box-shadow:0px 0px 10px 1px rgba(0,0,0,0.1);border-radius:10px;box-sizing:border-box;}
-.custom_content.custom2 .cont_bottom .custom_step::after {content:"";position:absolute;top:0;left:50%;width:30%;height:8px;background-color:#fbc72b;transform:translateX(-50%);}
+.custom_content.custom2 .cont_bottom .custom_step::after {content:"";position:absolute;top:0;left:50%;width:30%;height:8px;background-color:var(--secondary-color);transform:translateX(-50%);}
 .custom_content.custom2 .cont_bottom .custom_step .step_title {text-align:center;}
-.custom_content.custom2 .cont_bottom .custom_step .step_title p {font-family:'yg-jalnan',snas-serif;font-size:28px;color:#000;}
-.custom_content.custom2 .cont_bottom .custom_step .step_title p span {font-family:'yg-jalnan',snas-serif;color:#002c9a;}
+.custom_content.custom2 .cont_bottom .custom_step .step_title p {font-size:28px;color:#000;}
+.custom_content.custom2 .cont_bottom .custom_step .step_title p span {color:var(--primary-color);}
 .custom_content.custom2 .cont_bottom .custom_step .step_title .summary {display:block;margin:11px 0 0;font-size:18px;letter-spacing:-0.025em;}
 .custom_content.custom2 .cont_bottom .custom_step ol {display:flex;margin:33px 0 0;justify-content:space-between;}
 .custom_content.custom2 .cont_bottom .custom_step ol li {position:relative;width:calc(100%/3 - 36px);height:380px;padding:217px 0 0;text-align:center;background:url(/publish/images/content/custom2_sample1.png) #f1f1f1 no-repeat center 44px;border-radius:10px;box-sizing:border-box;}
@@ -851,7 +669,7 @@
 .custom_content.custom2 .cont_bottom .custom_step ol li:first-child:after {display:none;}
 .custom_content.custom2 .cont_bottom .custom_step ol li:nth-child(2) {background-image:url(/publish/images/content/custom2_sample2.png);}
 .custom_content.custom2 .cont_bottom .custom_step ol li:nth-child(3) {background-image:url(/publish/images/content/custom2_sample3.png);}
-.custom_content.custom2 .cont_bottom .custom_step ol li .step {display:inline-block;width:116px;height:34px;font-size:16px;line-height:34px;text-align:center;background:#fbc72b;border-radius:34px;}
+.custom_content.custom2 .cont_bottom .custom_step ol li .step {display:inline-block;width:116px;height:34px;font-size:16px;color:#fff;line-height:34px;text-align:center;background:var(--secondary-color);border-radius:34px;}
 .custom_content.custom2 .cont_bottom .custom_step ol li .step strong {margin:0 0 0 3px;font-size:24px;font-weight:700;vertical-align:top;}
 .custom_content.custom2 .cont_bottom .custom_step ol li .text {margin:20px 0 0;font-size:20px;font-weight:300;line-height:28px;letter-spacing:-0.01em;}
 .custom_content.custom2 .cont_bottom .custom_step ol li .text strong {font-weight:500;}
@@ -880,17 +698,24 @@
 .custom_content.custom3 .area_tabcontent.photo_sample{gap:25px 13.4px;}
 .custom_content.custom3 .area_tabcontent li {background-color: transparent; padding: 0; border: 0; margin:0;}
 .custom_content.custom3 .area_tabcontent li .photo_preview {background-color: #f2f2f2; padding: 0 7px 7px 7px; border: 1px solid #d5d5d5; border-radius: 10px;}
-.custom_content.custom3 .area_tabcontent li .tit_text_wrap {padding: 10px 0; letter-spacing: -1px;}
-.custom_content.custom3 .area_tabcontent li .tit_text_wrap input[type="checkbox"] {margin-bottom: 4px;}
+.custom_content.custom3 .area_tabcontent li .tit_text_wrap {padding: 10px 4px; letter-spacing: -1px;}
+.custom_content.custom3 .area_tabcontent li .tit_text_wrap .title{display:flex;align-items:center;gap:6px;}
 .custom_content.custom3 .area_tabcontent li .tit_text_wrap input[type="checkbox"]+label {display: inline-block; max-width: calc(100% - 100px); font-size: 15px; color: #222; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
-.custom_content.custom3 .tit_text_wrap>span {font-size: 14px; width: 60px; text-align: center; padding: 4px; display: inline-block; border-radius: 11px; margin-left: 2px; font-weight: 300;}
+
+.custom_content.custom3 .status{display:flex;min-width:60px;height:24px;border-radius:30px;padding:0 6px;font-size:14px;font-weight:400;justify-content:center;align-items:center;}
+.custom_content.custom3 .status.fill.primary{background:var(--primary-color);color:#fff;}
+.custom_content.custom3 .status.fill.secondary{background:var(--secondary-color);color:#fff;}
+.custom_content.custom3 .status.line.primary{background:#fff;border:1px solid var(--primary-color);color:var(--primary-color);}
+.custom_content.custom3 .status.fill.gray{background:#888;color:#fff;}
+
+/* .custom_content.custom3 .tit_text_wrap>span {font-size: 14px; width: 60px; text-align: center; padding: 4px; display: inline-block; border-radius: 11px; margin-left: 2px; font-weight: 300;}
 .custom_content.custom3 .tit_text_wrap>span.step1 {background-color: #2a57c8; color: #fff;}
-.custom_content.custom3 .tit_text_wrap>span.step2 {background-color: #fbc72b; color: #222; font-weight: 400;}
-.custom_content.custom3 .tit_text_wrap>span.step3 {background-color: #999; color: #fff;}
+.custom_content.custom3 .tit_text_wrap>span.step2 {background-color: var(--secondary-light-color); color: #222; font-weight: 400;}
+.custom_content.custom3 .tit_text_wrap>span.step3 {background-color: #999; color: #fff;} */
 .custom_content.custom3 .area_tabcontent li:hover { box-shadow: none;}
 .myphoto_info {position: relative; margin-top: 12px;}
-.myphoto_info p {font-size: 14px; font-weight: 400; color: #222; text-align: left; font-weight: 300; line-height:18px;}
-.myphoto_info p:first-child {padding: 3px 0 8px 0;}
+.myphoto_info .left{flex:2;align-items:flex-start;}
+.myphoto_info p {padding:4px 0;font-size:14px;font-weight:400;color:#222;text-align:left;}
 .myphoto_info button {position: absolute; right: 0; background-color: #fff; height: 24px; padding: 0 6px; border: 1px solid #ccc; border-radius: 5px; font-size: 13px; color: #555;}
 .custom_content.custom3 .myphoto_info{text-align:right;}
 .custom_content.custom3 .myphoto_info button{position: inherit;}
@@ -908,13 +733,13 @@
 .list_tab_wrap ul li::before {content: "";position: absolute;top: 47%;right: 15px; width: 1px;height: 15px;background: #d5d5d5;transform: translateY(-50%);}
 .list_tab_wrap ul li:last-child::before {content: none;}
 .list_tab_wrap ul li button { font-size: 18px; color: #666; font-weight: 300;}
-.list_tab_wrap ul li.active button { color: #002c9a; font-weight: 500; position: relative; }
-.list_tab_wrap ul li.active button::after {content: ""; position: absolute; width: 90%; height: 9px; background-color: rgba(0,44,154,0.15);bottom: -1px; left: 50%; transform: translateX(-50%);}
+.list_tab_wrap ul li.active button { color: var(--primary-color); font-weight: 500; position: relative; }
+.list_tab_wrap ul li.active button::after {content: ""; position: absolute; width: 100%; height: 9px; background-color: rgba(23,110,229,0.15);bottom: -1px; left: 50%; transform: translateX(-50%);}
 .list_tab_wrap {position: relative;}
 .list_tab_wrap .selType2 {position: absolute; right: 0; top: -5px;}
 /* board list tab2 */
 .list_tab_wrap2 {position: relative;}
-.list_tab_wrap2::after {position: absolute;height: 2px;background-color: #000;width: 100%; content: "";bottom: 0;left: 0;}
+.list_tab_wrap2::after {position: absolute;height: 2px;background-color: #1E3862;width: 100%; content: "";bottom: 0;left: 0;}
 .list_tab_wrap2 ul {display: flex;text-align: center;margin-bottom: 20px;position: relative;background-color: #fff;}
 .list_tab_wrap2 ul li {border-top: 1px solid #e5e5e5;}
 .list_tab_wrap2 ul li:first-child{border-radius: 10px 0 0 0; border-left: 1px solid #e5e5e5;}
@@ -922,7 +747,7 @@
 .list_tab_wrap2 ul li button {width: 100%; height: 45px; padding: 10px 0;font-size: 17px;border-right: 1px solid #e5e5e5;background-color: #fff;}
 .list_tab_wrap2 ul li:first-child button {border-radius: 10px 0 0 0;}
 .list_tab_wrap2 ul li:last-child button {border-radius: 0 10px 0 0; border-right: 0;} 
-.list_tab_wrap2 ul li.active button {background-color: #46484a; height: 45px; border-radius:10px 10px 0 0;color: #fff;border-right: 1px solid transparent;}
+.list_tab_wrap2 ul li.active button {background-color: #1E3862; height: 45px; border-radius:10px 10px 0 0;color: #fff;border-right: 1px solid transparent;}
 .list_tab_wrap2.type2 ul li {width: 120px;}
 .list_tab_wrap2.type3 ul li {width: 180px;}
 .list_tab_wrap2.type4 ul li {width: 150px;}
@@ -935,13 +760,13 @@
 .table_tab_wrap ul li::before {content: "";position: absolute;top: 52%;right: 23px; width: 1px;height: 15px;background: #d5d5d5;transform: translateY(-50%);}
 .table_tab_wrap ul li:last-child::before {content: none;}
 .table_tab_wrap ul li button { font-size: 18px; color: #666; font-weight: 300;}
-.table_tab_wrap ul li.active button { color: #002c9a; font-weight: 500; position: relative; }
-.table_tab_wrap ul li.active button::after {content: ""; position: absolute; width: 90%; height: 9px; background-color: rgba(0,44,154,0.15);bottom: -1px; left: 50%; transform: translateX(-50%);}
+.table_tab_wrap ul li.active button { color: var(--primary-color); font-weight: 500; position: relative; }
+.table_tab_wrap ul li.active button::after {content: ""; position: absolute; width: 90%; height: 9px; background-color: rgba(23,110,229,0.15);bottom: -1px; left: 50%; transform: translateX(-50%);}
 .table_tab_wrap .selType2 {width: 130px; position: absolute; top: 50%; right: 30px; transform: translateY(-50%);}
 /*발송결과 개선 */
 .table_tab_wrap .tab_btnbox{position:absolute; top: 50%; right: 30px; transform: translateY(-50%); z-index:9;}
-.table_tab_wrap .tab_btnbox button.btnType.btnType14.check_validity {border: 1px solid #002c9a; color: #002c9a;}
-.table_tab_wrap .tab_btnbox .qmMark{background-image: url(../images/content/qmIcon_s.png); width: 19px; height: 19px; margin-left: 5px; margin-top: -2px;}
+.table_tab_wrap .tab_btnbox button.btnType.btnType14.check_validity {display:flex;border: 1px solid var(--primary-color); font-size:16px; color: var(--primary-color);align-items:center;justify-content:center;}
+.table_tab_wrap .tab_btnbox .qmMark{background-image: url(/publish/images/content/qmIcon_s.png); width: 19px; height: 19px;}
 
 /* board_list - 공지사항 */
 .board_list {width: 100%; margin: 23px 0 50px 0; text-align: center;}
@@ -950,7 +775,7 @@
 .board_list tbody td {font-size: 17px; height: 60px; padding: 0 5px;  border-bottom: 1px solid #e5e5e5; vertical-align: middle; font-weight: 300; color: #666;}
 .board_list tbody td.list_link {color: #222; font-weight: 400; text-align: left;}
 .board_list tbody tr:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.waitA {width: 85px; height: 35px; border-radius: 5px; color: #222; background-color: #fbc72b; display: inline-block; line-height: 35px; font-weight: 400;} 
+.waitA {width: 85px; height: 35px; border-radius: 5px; color: #222; background-color: var(--secondary-light-color); display: inline-block; line-height: 35px; font-weight: 400;} 
 .completeA {width: 85px; height: 35px; border-radius: 5px; color: #777; background-color: #d5d5d5; display: inline-block; line-height: 35px; font-weight: 400;} 
 .list_btnWrap {text-align: right; margin-bottom: 30px;}
 
@@ -980,7 +805,7 @@
 .firstpay_event .agree_wrap input[type="checkbox"]+label{border-radius: 5px;display: inline-block; position: relative; cursor: pointer; vertical-align: middle; margin-right: 5px; padding:0 0 0 35px;}
 .firstpay_event .agree_wrap input[type="checkbox"]+label::after{position: absolute;content: "";display: inline-block;width:24px;height: 24px;background-color: #fff;background-repeat: no-repeat;top: 1px;left: 0;border-radius: 5px;}
 .firstpay_event .agree_wrap input[type="checkbox"]:checked+label{position: relative;}
-.firstpay_event .agree_wrap input[type="checkbox"]:checked+label::after{background-image: url(/publish/images/event/icon_checked01.png);background-position: center;background-color: #fbc72b;}
+.firstpay_event .agree_wrap input[type="checkbox"]:checked+label::after{background-image: url(/publish/images/event/icon_checked01.png);background-position: center;background-color: var(--secondary-light-color);}
 
 .view_cont .serv_content.charg_cont{display: block; text-align: left; padding: 0;}
 .view_cont .serv_content.charg_cont .tType1{margin-bottom: 0;}
@@ -992,7 +817,7 @@
 .attachedFile2 .attachedFile_in:last-child {margin-bottom: 0;}
 .attachedFile2 .attachedFile_in a {font-size: 18px; font-weight: 300; display: inline-block;}
 .view_btnWrap {position:relative;min-height:50px;text-align: center;}
-.view_btnWrap button {background-color: #fbc72b; width: 100px; height: 50px; border-radius: 5px; font-size: 18px; color: #222; }
+.view_btnWrap button {background-color: var(--gray-color); width: 100px; height: 50px; border-radius: 5px; font-size: 18px; color: #fff; }
 .view_btnWrap .list_button {position:absolute;right:0;top:0;}
 /* 상세페이지 이전글, 다음글 */
 .list_prev-next {margin-top: 50px;}
@@ -1016,7 +841,7 @@
  
 /* 이용안내 */
 .kisa_guidebook {margin:0 0 25px;text-align:right;}
-.kisa_guidebook .download_button {display:inline-block;height:40px;padding:0 18px;font-size:16px;line-height:40px;letter-spacing:-0.025em;text-align:center;color:#fff;background:#002c9a;border-radius:5px;}
+.kisa_guidebook .download_button {display:inline-block;height:40px;padding:0 18px;font-size:16px;line-height:40px;letter-spacing:-0.025em;text-align:center;color:#fff;background:var(--primary-color);border-radius:5px;}
 .kisa_guidebook .download_button:before {content:'';display:inline-block;width:18px;height:40px;margin:0 10px 0 0;vertical-align:top;background:url(/publish/images/content/icon_filedown_button.png) no-repeat left top;}
 .clause_list li.list_open .clause_list_head span.operGuide_title {font-family: 'GmarketSansBold'; font-size: 22px; display: inline-block; padding-top: 4px;}
 .clause_select_wrap {text-align: right;}
@@ -1026,13 +851,13 @@
 .qna_cont .search_wrap .btn_left {float: right;}
 .qna {width: 100%; border-top: 2px solid #000; margin: 23px 0 50px 0;} 
 /* 질문 */
-.qna li .question_text {width: 20px;font-family: 'GmarketSansMedium'; color: #002c9a; font-size: 22px; padding-right: 20px; vertical-align: top;margin: 4px 0 0 0;}
-.qna li button {position: relative; width: 100%; min-height: 74px; padding: 0 30px; text-align: left; border-bottom: 1px solid #d5d5d5; box-sizing: border-box;}
+.qna li .question_text {width: 20px;font-family: 'GmarketSansMedium'; color: var(--primary-color); font-size: 22px; padding-right: 20px; vertical-align: top;margin: 4px 0 0 0;}
+.qna li button {position: relative; display: flex; width: 100%; min-height: 74px; padding: 12px 30px; text-align: left; border-bottom: 1px solid #d5d5d5; box-sizing: border-box; align-items: center;}
 .qna li.open button::after {background-image: url(/publish/images/content/qna_close.png);width: 22px; height: 2px;} 
 .qna li button::after {background-image: url(/publish/images/content/qna_open.png); background-repeat: no-repeat; position: absolute; top: 50%; transform: translateY(-50%); content: ""; width: 22px; height: 22px; right: 30px;} 
 .qna li button p {display: inline-block; font-size: 20px; width: calc(100% - 80px);white-space:normal; word-break:break-all;} 
 /* 답변 */
-.qna li .answer_text {font-family: 'GmarketSansMedium'; color: #eea301; font-size: 22px; padding-right: 20px; padding-top: 6px; vertical-align: top;}
+.qna li .answer_text {font-family: 'GmarketSansMedium'; color: var(--secondary-color); font-size: 22px; padding-right: 20px; padding-top: 6px; vertical-align: top;}
 .qna li .qna_answer {background-color: #f5f5f5; display: none; padding: 36px 30px; border-bottom: 1px solid #d5d5d5; display: none; box-sizing: border-box;}
 .qna li .qna_answer p {display: inline-block;}
 .qna li .qna_answer .answer_cont {font-size: 18px; font-weight: 300; line-height: 1.4; width: calc(100% - 100px);}
@@ -1053,7 +878,7 @@
 
 .serv_btnWrap {text-align: center;display: flex;width: 820px;margin: 0 auto;justify-content: space-between;}
 .serv_btnWrap button {width: calc(100%/2 - 5px);height: 70px;border-radius: 5px;font-size: 22px;}
-.serv_btnWrap button:first-child {background-color: #fbc72b;}
+.serv_btnWrap button:first-child {background-color: var(--secondary-color);color:#fff;}
 .serv_btnWrap button:last-child {background-color: #999; color: #fff;font-weight: 300;}
 
 /* photo - 이벤트 */
@@ -1068,6 +893,7 @@
 
 /* 결제내역 */
 /* 요금결제내역 */
+.pay_cont .list_info div:last-child button{font-size:14px;}
 .pay_cont .tType1 .calendar_wrap {margin-right: 3px;}
 .pay_cont .tType1 .calendar_wrap>input[type="text"] {border: 0; width: 160px; height: 40px;}
 .pay_cont .tType1 button {height: 40px; margin-right: 2px;}
@@ -1075,11 +901,12 @@
 .pay_cont .excel_middle {margin: 20px 0 10px 0;}
 .pay_cont .excel_middle .selType2 {/* width: 82px;  */height: 32px; margin-left: 0;}
 .pay_cont .select_btnWrap{display:flex;justify-content:space-between;align-items:center;}
+/* .pay_cont .select_btnWrap:only-child{justify-self:end;} */
 .pay_cont .select_btnWrap .add_text2 {font-size: 16px; padding-top: 7px; color: #666; font-weight: 300;}
 .pay_cont .select_btnWrap .add_text2 .accountinfo {padding:2px 0 0 10px; color:#21376c; font-weight:400;}
 .pay_cont .select_btnWrap .add_text2 .accountinfo span {font-size:14px; color:#697593; padding:0 0 0 10px;}
 /*등급 및 누적결제액 확인 버튼 추가*/
-.pay_cont .excel_middle .level_btn{margin: 0 5px; border: 1px solid #002c9a; color: #002c9a;}
+.pay_cont .excel_middle .level_btn{margin: 0 5px; border: 1px solid var(--primary-color); color: var(--primary-color);}
 .pay_cont .excel_middle .level_btn img{margin-top: -3px;}
 
 /* .pay_cont .excel_middle .print_btn {margin: 0 5px;} */
@@ -1087,9 +914,9 @@
 .pay_cont .pay_info p:nth-child(1) {font-size: 18px;}
 .pay_cont .pay_info p:nth-child(2), .pay_cont .pay_info p:nth-child(3) {font-size: 16px; font-weight: 300;}
 .pay_cont .pay_info p:nth-child(2) {padding: 0 47px 0 57px;}
-.pay_cont .pay_info p span {color: #002c9a; font-weight: 500;}
+.pay_cont .pay_info p span {color: var(--primary-color); font-weight: 500;}
 .clause_list {margin-bottom: 50px;}
-.clause_list .list_head_in span>i {background-image: url(/publish/images/content/titBoxIcon.png); width: 18px; height: 20px; margin: 0 8px 3px 0;}
+.clause_list .list_head_in span>i {background-image: url(/publish/images/content/titBoxIcon.png); width: 20px; height: 20px; margin: 0 8px 3px 0;}
 .clause_list .clause_list_body {background-color: #efeff0 !important;}
 .clause_list .refund_info {text-align: center; width: 100%;}
 .clause_list .refund_info th { height: 45px; line-height: 45px; font-size: 17px; font-weight: 500;background-color: #fff; }
@@ -1113,7 +940,7 @@
 .pay_cont .tType1 td input[type="text"].readonly::placeholder {font-size: 18px;}
 .pay_cont .tType1 td select {width: 200px; background-color: #f2f2f2; border: 0; height: 40px; margin-right: 2px; font-size: 18px;}
 .pay_cont .tType1 td .btnType9 {width: 90px; margin-right: 0; margin-left: 2px;}
-.tType1 td .reqTxt6 {color: #e40000; font-size: 14px; line-height: 50px; font-weight: 400; padding-left: 13px;}
+.tType1 td .reqTxt6 {color: #f43131; font-size: 14px; line-height: 50px; font-weight: 400; padding-left: 13px;}
 .tType1 td .reqTxt6>span {vertical-align: middle;}
 .pay_cont .tType1 tbody tr td.send_cf>div:first-child {margin-bottom: 10px;}
 .pay_cont .tType1 tbody tr td .refund_reason {overflow:hidden;}
@@ -1131,7 +958,7 @@
 .hisroy_price .hisroy_price_in>div>p {font-size: 17px; font-weight: 300;}
 .hisroy_price .hisroy_price_in>div>p:first-child {float: left;}
 .hisroy_price .hisroy_price_in>div>p:last-child {float: right;}
-.hisroy_price .hisroy_price_in>div>p>span {font-size: 22px; font-family: 'GmarketSansBold'; color: #002c9a; padding-right: 5px;}
+.hisroy_price .hisroy_price_in>div>p>span {font-size: 22px; font-family: 'GmarketSansBold'; color: var(--primary-color); padding-right: 5px;}
 #payUserListLoad .pay_cont .tType4 td p .btnType20{margin:0;}
 .price_history_cont .tType4 .btnType20{margin:0;}
 
@@ -1148,7 +975,7 @@
 .hisroy_price .hisroy_defprice_in>div>p {font-size: 15px; font-weight: 300;}
 .hisroy_price .hisroy_defprice_in>div>p:first-child {float: left;}
 .hisroy_price .hisroy_defprice_in>div>p:last-child {float: right;}
-.hisroy_price .hisroy_defprice_in>div>p>span {font-size: 20px; font-family: 'GmarketSansBold'; color: #002c9a; padding-right: 1px;}
+.hisroy_price .hisroy_defprice_in>div>p>span {font-size: 20px; font-family: 'GmarketSansBold'; color: var(--primary-color); padding-right: 1px;}
 .hisroy_price .hisroy_defprice_in .clearfix{ display: flex; justify-content: space-between; align-items: center; height: 40px; background-color: #fff; padding: 5px 10px; border-radius: 5px; margin: 0 0 10px 0;}
 .hisroy_price .hisroy_defprice_in .clearfix:last-child{margin: 0 0 0 0; text-align: right;}
 .hisroy_price .hisroy_defprice_in .clearfix p:nth-child(2n){width: calc(100% - 5px); text-align: right;}
@@ -1175,7 +1002,7 @@
 .hisroy_price .total_price .clearfix p:nth-child(2)::before{position: absolute; content: ""; width: 1px; height: 18px; background-color: #d5d5d5; right: 0;}
 .hisroy_price .total_price p{margin: 0 0 0 0;}
 .hisroy_price .total_price>div:last-child{padding: 0 0 0 0;}
-.hisroy_price .hisroy_price_in>div>p>span {font-size: 20px;  font-family: 'GmarketSansBold'; color: #002c9a; padding-right: 5px;}*/
+.hisroy_price .hisroy_price_in>div>p>span {font-size: 20px;  font-family: 'GmarketSansBold'; color: var(--primary-color); padding-right: 5px;}*/
 /*.hisroy_price {display: flex; justify-content: space-between; margin-bottom: 0; flex-flow: wrap;}
 .hisroy_price .hisroy_price_in {background-color: #f2f2f2; width: calc(100%/2 - 15px); padding: 28px 22px; border-radius: 5px; box-sizing: border-box;}
 .hisroy_price .hisroy_price_in>p{font-size: 20px; font-weight: 600; margin-bottom: 25px; font-family: 'GmarketSansBold';}
@@ -1194,15 +1021,15 @@
 .hisroy_price .hisroy_price_in:nth-child(2) i{width: 31px; height: 20px; background-image: url(/publish/images/content/history_icon1.png); background-position: center 0; margin: 0 7px 0 0;}
 .hisroy_price .hisroy_price_in:nth-child(3) i{width: 25px; height: 25px; background-image: url(/publish/images/content/icon_kakaotalk.png); background-position: center 0; margin: 0 7px 0 0;}
 .hisroy_price .hisroy_price_in:nth-child(4) i{width: 26px; height: 28px; background-image: url(/publish/images/content/history_fax.png); background-position: center 0; margin: 0 7px 0 0;}
-.hisroy_price .hisroy_price_in>div>p>span {font-size: 18px; font-family: 'GmarketSansBold'; color: #002c9a; letter-spacing: -.5px;}*/
+.hisroy_price .hisroy_price_in>div>p>span {font-size: 18px; font-family: 'GmarketSansBold'; color: var(--primary-color); letter-spacing: -.5px;}*/
 
 .list_info {margin-bottom: 10px; display: flex; justify-content: space-between; align-items: flex-end;}
 .list_info .selType2 {height: 32px;}
 .list_info p {font-size: 16px; }
-.list_info p span {color: #002c9a; font-weight: 500;}
+.list_info p span {color: var(--primary-color); font-weight: 500;}
 .list_info .cf_text{display: inline-block; font-size: 14px; font-weight: 500;}
 .list_info>div {float: right;}
-.list_info>div button {padding:0 10px;height:32px;border-radius:5px;margin-left:2px;font-weight:300;}
+.list_info>div button {padding:0 10px;height:32px;border-radius:5px;margin-left:2px;font-size:16px;font-weight:400;}
 .list_info>div .btnType15 {width:auto;}
 .serv_content .excel_middle .calendar_wrap>input[type="text"] {width: 129px; height: 32px; border-radius: 5px;}
 .serv_content .calendar_wrap button {border: 0 !important; height: 100%;}
@@ -1211,12 +1038,12 @@
 .serv_content .select_btnWrap .btn_left>button:hover {color: #222;border: 1px solid #b1b1b1}
 .serv_content .select_btnWrap .btn_left>button.btnType6 {background-color: #e8f0ff;border: 1px solid #b1c6ee;}
 .serv_content .select_btnWrap .btn_left .reqTxt4 {font-size: 14px;}
-.cal_label {padding-right: 8px; vertical-align: middle;}
+.cal_label {height:18px;}
 .publish_btn {background-color: #f2f2f2; padding: 0 30px; border-radius: 5px; height: 65px; margin-bottom: 40px; line-height: 59px; box-sizing: border-box;}
 .publish_btn>div:first-child {float: left;}
 .publish_btn input[type="radio"]+label {font-size: 18px; font-weight: 300;}
 .publish_btn>div:last-child {float: right;}
-.publish_btn button {background-color: #002c9a; color: #fff; width: 120px; height: 45px; font-size: 18px;line-height:45px;}
+.publish_btn button {background-color: var(--primary-color); color: #fff; width: 120px; height: 45px; font-size: 18px;line-height:45px;}
 
 /* 세금계산서/영수증 */
 .pay_cont .tType1 td .emailWrap2 {display: inline-flex;background-color: #f2f2f2; width: calc(100% - 620px); min-width: 470px; height: 40px; border-radius: 5px;position: relative;vertical-align: middle; }
@@ -1250,26 +1077,26 @@
 .charg_cont {background-color: #fff;padding: 40px;border-radius: 10px; min-height: 589px; display: none;}
 .charg_cont.current {display: block;}
 .charg_cont .tab_tit{font-size: 24px; font-weight: bold; color: #222; margin-bottom: 20px; margin-top: 40px;}
-.charg_cont .area_tab{display: flex; width: 100%; justify-content: space-between; flex-wrap: wrap;}
-/* 간편결제 오픈 시 
-.charg_cont .area_tab li{ width: calc((100% - 80px)/5); border: 1px solid #ddd; border-radius: 5px; position: relative; box-sizing: border-box; text-align: center;} */
-.charg_cont .area_tab li{ width: calc((100% - 80px)/4); border: 1px solid #ddd; border-radius: 5px; position: relative; box-sizing: border-box; text-align: center;}
-.charg_cont .area_tab li button {font-size: 22px; font-weight: 400; width: 100%; height: 100%; padding: 60px 20px 40px 20px;position:relative;z-index:1;}
-/* .charg_cont .area_tab li.active {border: 3px solid #fbc72b;} */
-.charg_cont .area_tab li.active::after{position: absolute; content: " "; width: 100%; height: 100%; border: 3px solid #fbc72b; left: -3px; top: -3px; border-radius: 5px;}
-.charg_cont .area_tab li.active::before{background-image: url(/publish/images/content/icon_chargeCheck2.png); background-color: #fbc72b; border: 2px solid #fbc72b;}
-.charg_cont .area_tab li::before{position: absolute; content: " "; width: 31px; height: 31px; border: 3px solid #ccc; right: 15px; top: 15px; border-radius: 100%; background-image: url(/publish/images/content/icon_chargeCheck1.png); background-repeat: no-repeat; background-position: center 58%;}
-.charg_cont .area_tab button i{width: 65px; height: 55px; display: block; margin: 0 auto 15px auto; background-position: center;}
+/* 간편결제 오픈 시 */
+.charg_cont .area_tab{display:flex;gap:25px 30px;flex-wrap:wrap;}
+.charg_cont .area_tab li{position:relative;position:relative;width:calc((100% /4) - 23px);border:1px solid #d5d5d5;border-radius:5px;box-sizing:border-box;}
+.charg_cont .area_tab li button{position:relative;display:flex;width:100%;height:82px;padding:0 0 0 20px;font-size:22px;font-weight:400;justify-content:flex-start;align-items:center;gap:10px;z-index:1;}
+.charg_cont .area_tab button i{display:block;width:32px;height:32px;background-position:center;}
+.charg_cont .area_tab li::before,
+.charg_cont .area_tab li::after{position: absolute;content:"";}
+.charg_cont .area_tab li::before{width:31px;height:31px;border:3px solid #d5d5d5;border-radius:100%;background-image:url(/publish/images/content/icon_chargeCheck1.png);background-repeat:no-repeat;background-position:center 58%;right:15px;top:50%;transform:translateY(-50%);}
+.charg_cont .area_tab li.active{border:1px solid var(--secondary-color);}
+.charg_cont .area_tab li.active::before{background-image:url(/publish/images/content/icon_chargeCheck2.png);background-color:var(--secondary-color);border:2px solid var(--secondary-color);}
+
+
 /*.charg_cont .area_tab .btn_charge_simple i{background-image: url(/publish/images/simple.png);}*/
-.charg_cont .area_tab .btn_charge1 i{background-image: url(/publish/images/content/icon_charging2.png);}
-.charg_cont .area_tab .btn_charge2 i{background-image: url(/publish/images/content/icon_charging3.png);}
-.charg_cont .area_tab .btn_charge3 i{background-image: url(/publish/images/content/icon_charging4.png);}
-.charg_cont .area_tab .btn_charge4 i{background-image: url(/publish/images/content/icon_charging5.png);}
+.charg_cont .area_tab .btn_charge1 i{background-image:url(/publish/images/content/icon_charging2.png);}
+.charg_cont .area_tab .btn_charge2 i{background-image:url(/publish/images/content/icon_charging3.png);}
+.charg_cont .area_tab .btn_charge3 i{background-image:url(/publish/images/content/icon_charging4.png);}
+.charg_cont .area_tab .btn_charge4 i{background-image:url(/publish/images/content/icon_charging5.png);}
 
 /*간편결제_오픈시_수정한부분*/
-.charg_cont .area_tab .simple_pay{margin-top: 25px;}
-.charg_cont .area_tab .simple_pay button{padding: 24px 20px 8px 20px;}
-.charg_cont .area_tab .simple_pay button i{width: 150px; height: 33px; display: block; margin: 0 auto 15px auto; background-position: center;}
+.charg_cont .area_tab .simple_pay button i{width:150px;height:33px;display:block;background-position:center;}
 .charg_cont .area_tab .btn_charge5 i{background-image: url(/publish/images/never_pay.png);}
 .charg_cont .area_tab .btn_charge6 i{background-image: url(/publish/images/kakao_pay.png);}
 .charg_cont .area_tab .btn_charge7 i{background-image: url(/publish/images/toss_pay.png);}
@@ -1294,9 +1121,9 @@
 .charg_cont .checkbox_wrap input[type="checkbox"]+label::after,
 .charg_cont .checkbox_wrap input[type="radio"]+label::after {background-image: url(/publish/images/content/icon_chargeCheck3.png);background-repeat: no-repeat; background-position: center 60%;position: absolute;content: "";display: inline-block;width:24px;height: 100%;top: -1px;left: -1px;border-radius: 50%;border: 2px solid #ccc;}
 .charg_cont .checkbox_wrap input[type="checkbox"]:checked+label,
-.charg_cont .checkbox_wrap input[type="radio"]:checked+label{position: relative;font-weight:500;color:#002c9a;}
+.charg_cont .checkbox_wrap input[type="radio"]:checked+label{position: relative;font-weight:500;color:var(--primary-color);}
 .charg_cont .checkbox_wrap input[type="checkbox"]:checked+label::after,
-.charg_cont .checkbox_wrap input[type="radio"]:checked+label::after{background-image: url(/publish/images/mem/check2_ckecked.png);background-color: #002c9a;border: 2px solid #002c9a;}
+.charg_cont .checkbox_wrap input[type="radio"]:checked+label::after{background-image: url(/publish/images/mem/check2_ckecked.png);background-color: var(--primary-color);border: 2px solid var(--primary-color);}
 .charg_cont .right{text-align: right;}
 .charg_cont .area_tabcont{display: none;}
 .charg_cont .area_tabcont.on{display: block;}
@@ -1304,14 +1131,14 @@
 .charg_cont .tType1{margin-bottom: 50px;}
 .charg_cont .tType1 select, .charg_cont .tType1 button, .charg_cont .tType1 input{height: 40px; border-radius: 5px; display: inline-block;line-height:40px;}
 .charg_cont .tType1 select{width: 220px; padding: 0 20px 0 15px; border: 1px solid #ccc; margin-left: 8px; font-size: 16px; color: #222; font-weight: 300; background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 92% center;}
-.area_tabcont .tType1 button {background-color: #002c9a; padding: 0 20px; color: #fff; font-weight: normal; letter-spacing: -0.5px; font-size: 17px;}
+.area_tabcont .tType1 button {background-color: var(--primary-color); padding: 0 20px; color: #fff; font-weight: normal; letter-spacing: -0.5px; font-size: 17px;}
 .charg_cont .tType1 input{border: 1px solid #ccc; margin-right: 5px; vertical-align: middle; margin-left: 8px;}
 /* .charg_cont .tType1 input:nth-child(2) {margin-left: 0;} */
 .charg_cont .tType1 .area_text{ font-size: 16px; font-weight: 300; color: #555;}
 .charg_cont .tType1 .area_text p{margin-bottom:11px;}
 .charg_cont .tType1 .area_text p input{background-color: #fff; width: 360px;}
 .charg_cont .tType1 .area_text p:last-child{margin-bottom: 0;}
-.charg_cont .tType1 .area_text p span{color: #e40000; font-weight: 500;}
+.charg_cont .tType1 .area_text p span{color: #f43131; font-weight: 500;}
 .charg_cont .tType1 .area_text p span.c_222222{color: #222;}
 .charg_cont .tType1 .checkbox_wrap{font-size: 18px; font-weight: normal; margin-top: 5px;}
 .charg_cont .tType1 .checkbox_wrap input[type="checkbox"]+label,
@@ -1337,7 +1164,7 @@
 .charg_cont .tType1 tbody tr td .amount_wrap dl dd ul li .equal:before {content:'';position:absolute;left:6px;top:9px;width:15px;height:3px;background:#8f8f8f;}
 .charg_cont .tType1 tbody tr td .amount_wrap dl dd ul li .equal:after {content:'';position:absolute;left:6px;top:15px;width:15px;height:3px;background:#8f8f8f;}
 .charg_cont .tType1 tbody tr td .amount_wrap dl dd ul li.total {padding-right:0;font-size:20px;color:#222;}
-.charg_cont .tType1 tbody tr td .amount_wrap dl dd ul li.total strong {color:#e40000;}
+.charg_cont .tType1 tbody tr td .amount_wrap dl dd ul li.total strong {color:#f43131;}
 .charg_cont .tType1 tbody tr td .amount_wrap .btnType {width:210px;height:56px;font-size:20px;}
 
 .info_bank{display: flex; width: 100%; flex-wrap: wrap; justify-content: space-between;}
@@ -1361,7 +1188,7 @@
 .charg_cont .tType1 .box_input.flex select{margin-left: 10px;}
 .charg_cont .tType1 .box_input.flex input{border: 1px solid #ccc;}
 .charg_cont .tType1 .box_input.flex input[type="text"] {width: 200px;background-color: #fff;}
-.charg_cont .tType1 .box_input.flex button{background-color: #002c9a; color: #fff; border: 0; margin-left: 10px;}
+.charg_cont .tType1 .box_input.flex button{background-color: var(--primary-color); color: #fff; border: 0; margin-left: 10px;}
 
 
 /*누적결제액별 등급 및 단간 추가*/
@@ -1369,7 +1196,7 @@
 .accrue_price p{font-size: 22px; font-weight: 700; line-height: 105px; margin-left: 53px;}
 .accrue_price p span{border-radius: 5px; background-color: #fff; padding: 10px 10px 10px 10px; font-size: 18px; font-weight: 400;}
 .accrue_price p span img{margin-right: 5px; margin-top: -5px;}
-.accrue_price p span span{padding: 0; font-size: 22px; font-weight: 700; color: #e40000;}
+.accrue_price p span span{padding: 0; font-size: 22px; font-weight: 700; color: #f43131;}
 .accrue_level .tType1_title{margin-top: 40px;}
 .accrue_level .tType1_title img{margin-top: -5px;}
 .accrue_level .tType2{width: 100%; border-top: 1px solid #000; text-align: center;}
@@ -1422,7 +1249,7 @@
 .fee_cont .banner ul li p strong {display:block;margin:2px 0 0;font-size:20px;font-weight:700;white-space:nowrap;}
 .fee_cont .banner ul li p span {display:block;margin:2px 10px 0 0;font-size:15px;font-weight:300;}
 .fee_cont .banner ul li a,
-.fee_cont .banner ul li button{font-size: 15px; color: #fff; font-weight: 500; background-color: #eea301; height: 30px; border-radius: 20px; margin-left: 8px; padding: 5px 10px; vertical-align: inherit;position:absolute;right:20px;top:50%;margin:-15px 0 0;box-sizing:border-box;line-height:20px;}
+.fee_cont .banner ul li button{font-size: 15px; color: #fff; font-weight: 500; background-color: var(--secondary-color); height: 30px; border-radius: 20px; margin-left: 8px; padding: 5px 10px; vertical-align: inherit;position:absolute;right:20px;top:50%;margin:-15px 0 0;box-sizing:border-box;line-height:20px;}
 .charg_cont .tType1 tbody tr td .readonly {background-color: #e9e9e9;}
 .charg_cont .tType1 tbody tr td .calendar_wrap>input[type="text"] {width:160px;}
 .charg_cont .tType1 tbody tr td .calendar_in>button {right: 12px;}
@@ -1437,7 +1264,7 @@
 .tType1.itemInfo .publish_btn {background-color: #fff; padding: 0;}
 .tType1.itemInfo tbody tr td .readonly {background-color: #fff; width: 130px; padding: 0 40px 0 15px; border: 1px solid #ccc; margin-left: 0; text-align: right; }
 .tb_wrap.totalPrice_tb .tType4 tbody td {font-size: 18px; font-weight: 400; color: #222; height: 52px; line-height: 31px; position: relative;}
-.tb_wrap.totalPrice_tb .tType4 tbody td select {height: 36px; top: 8px; border: 2px solid; }
+.tb_wrap.totalPrice_tb .tType4 tbody td select {height: 36px; top: 8px; }
 
 
 /*문자(등급별 요금 안내)*/
@@ -1455,7 +1282,7 @@
 .rev_admin .rev_admin_in {background-color: #f2f2f2; width: calc(100%/4 - 20px); padding: 25px; border-radius: 5px; box-sizing: border-box;}
 .rev_admin .rev_admin_in .rev_admin_top p:first-child {font-size: 22px; font-family: 'GmarketSansBold'; float: left;}
 .rev_admin .rev_admin_in .rev_admin_top p:last-child {font-size: 16px; font-weight: 300; float: right;}
-.rev_admin .rev_admin_in .rev_admin_top p:last-child span {font-size: 20px; font-weight: 600; font-family: 'GmarketSansBold'; color: #002c9a;}
+.rev_admin .rev_admin_in .rev_admin_top p:last-child span {font-size: 20px; font-weight: 600; font-family: 'GmarketSansBold'; color: var(--primary-color);}
 /* .rev_admin .rev_admin_in .rev_admin_btm {background-color: #fff; padding: 12px 0; border-radius: 5px; margin-top: 12px; box-sizing: border-box; display: flex;justify-content:space-between;}
 .rev_admin .rev_admin_in .rev_admin_btm p {width: calc(100%/3); font-size: 16px; font-weight: 300;text-align:center;}
 .rev_admin .rev_admin_in .rev_admin_btm p span {font-weight: 500;} */
@@ -1499,12 +1326,12 @@
 
 /* 마이페이지 kisa 신고 */
 .kisa_info {overflow:hidden;height:323px;margin:30px 0;padding:111px 0 0;font-size:22px;line-height:32px;letter-spacing:-.025em;text-align:center;color:#000;background:url(/publish/images/content/img_banner_kisa.png) no-repeat center top;background-size:100% 100%;border-radius:5px;box-sizing:border-box;}
-.kisa_info strong {font-weight:700;color:#e40000;}
+.kisa_info strong {font-weight:700;color:#f43131;}
 .kisa_info p {margin:6px 0 0;font-size:16px;font-weight:300;}
 .kisa_info .btnType {width:150px;margin:21px 0 0;background:#0f6de1;}
 .kisa_tb_wrap .tType4 thead tr:only-child th {height:54px;line-height:16px;}
 .kisa_tb_wrap .tType4 tbody td {padding:0;font-size:14px;font-weight:300;}
-.kisa_tb_wrap .tType4 tbody td .attach {font-weight:500;line-height:23px;color:#002c9a;}
+.kisa_tb_wrap .tType4 tbody td .attach {font-weight:500;line-height:23px;color:var(--primary-color);}
 .kisa_tb_wrap .tType4 tbody td .attach button {width:23px;height:23px;margin:0 0 0 4px;font-size:0;text-indent:-9999em;vertical-align:top;border:1px solid #b1b1b1;background:url(/publish/images/content/kisa_attach_icon.png) no-repeat center center;border-radius:5px;}
 .tType4 tbody tr:only-child:last-child td.nodata {padding:175px 0;font-size:16px;border-bottom:0 none;}
 .kisa_list_info {margin-top:20px;}
@@ -1542,8 +1369,8 @@
 .progress_bar_wrap{position:fixed;display:none;width:100%;height:100%;background:rgba(0,0,0,0.38);left:0;top:0;z-index:999;justify-content:center;align-items:center;flex-direction:column;}
 .progress_box{padding:30px;background:#fff;border-radius:10px;text-align:center;}
 .progress_bar_wrap .bar{display:flex;width:400px;height:5px;text-align:left;padding:0;background:#f4f5f6;border-radius:30px;align-items:center;}
-.progress_bar_wrap .bar span{position:relative;display:inline-block;min-width:0px;height:5px;border-radius:20px;background:#fbc72b;transition:all 0.3s linear;}
-.progress_bar_wrap .bar span::after{position:absolute;content:"";width:8px;height:8px;border-radius:100%;background:#fff;border:2px solid #fbc72b;right:-8px;top:-3px;box-shadow:0 0 3px rgba(0,0,0,0.2);}
+.progress_bar_wrap .bar span{position:relative;display:inline-block;min-width:0px;height:5px;border-radius:20px;background:var(--secondary-light-color);transition:all 0.3s linear;}
+.progress_bar_wrap .bar span::after{position:absolute;content:"";width:8px;height:8px;border-radius:100%;background:#fff;border:2px solid var(--secondary-light-color);right:-8px;top:-3px;box-shadow:0 0 3px rgba(0,0,0,0.2);}
 .progress_bar_wrap .time_text{height:20px;font-family:'GmarketSansBold';font-size:20px;font-weight:500;color:#222;margin:0 0 20px 0;}
 .progress_bar_wrap .time_text.animation{animation:text-loading 1.5s ease-in infinite;}
 
@@ -1555,7 +1382,7 @@
 .intro_cont .link_box li{margin: 0 20px 13px 0;}
 .intro_cont .link_box a{position: relative; height: 45px; padding: 7px 15px 7px 53px; border: 1px solid #222; border-radius: 5px; font-family: 'GmarketSansMedium'; font-size: 18px; line-height: 33.5px; color: #222; background-color: #fff; box-sizing: border-box;}
 .intro_cont .link_box a:hover{box-shadow: 3px 3px 5px rgba(0,0,0,0.3);}
-.intro_cont .link_box a::after{position: absolute; content: "#"; width: 30px; height: 30px; border-radius: 100%; background-color: #fbc72b; font-family: 'GmarketSansMedium'; color: #222; text-align: center; line-height: 34px; left: 13px; top: 50%; transform: translateY(-50%);}
+.intro_cont .link_box a::after{position: absolute; content: "#"; width: 30px; height: 30px; border-radius: 100%; background-color: var(--secondary-light-color); font-family: 'GmarketSansMedium'; color: #222; text-align: center; line-height: 34px; left: 13px; top: 50%; transform: translateY(-50%);}
 .intro_cont .intro_keyword_wrap{margin: 100px 0 0 0;}
 .intro_cont .tab_wrap{display: flex;}
 .intro_cont .tab_wrap .tab{position: relative;}
@@ -1563,8 +1390,8 @@
 .intro_cont .tab_wrap .tab:last-child::after{display:none;}
 .intro_cont .tab_wrap .tab button{position: relative; padding: 0 25px; font-size: 18px; color: #666;}
 .intro_cont .tab_wrap .tab:last-child button{padding: 0 0 0 25px;}
-.intro_cont .tab_wrap .tab.active button{font-weight: 600; color: #002c9a;}
-.intro_cont .tab_wrap .tab.active button::after{position: absolute; content: " "; width: calc(100% - 50px); height: 10px; background-color: #002c9a; opacity: 0.15; left: 25px; bottom: 0;}
+.intro_cont .tab_wrap .tab.active button{font-weight: 600; color: var(--primary-color);}
+.intro_cont .tab_wrap .tab.active button::after{position: absolute; content: " "; width: calc(100% - 50px); height: 10px; background-color: var(--primary-color); opacity: 0.15; left: 25px; bottom: 0;}
 .intro_cont .tab_wrap .tab.active:last-child button::after{width: calc(100% - 25px);}
 .intro_cont .keyword_box{display: flex; width: 100%; padding: 30px; margin: 0 0 50px 0; border-radius: 5px; background-color: #f5f5f5; box-sizing: border-box; flex-wrap: wrap; align-items: center;}
 .intro_cont .keyword_box li{margin: 0 20px 13px 0;}
@@ -1573,17 +1400,60 @@
 .intro_cont .keyword_box .keyword_tab.active button{color: #222; font-weight: 500;}
 .intro_cont .keyword_box .keyword_tab.active button::after{width: calc(100% - 2px); height: calc(100% - 2px); border: 2px solid #000;}
 
+.intro_cont .box_list{display:flex;background:#f8f8f8;margin:-40px 0 0 0;padding:80px 40px 55px;flex-wrap:wrap;gap:20px;}
+.intro_cont .box_list li{width:calc((100%/2) - 20px);padding:55px 40px;background:#fff;border:1px solid #E7E7E7;border-radius:10px;box-sizing:border-box;}
+.intro_cont .box_list .title{margin:0;font-family: 'GmarketSansBold';font-size:24px;color:#222;justify-content:flex-start;align-items:flex-end;gap:5px;}
+.intro_cont .box_list .title span{font-family: 'GmarketSansBold';font-size:32px;color:#4BB7ED;}
+.intro_cont .box_list .summary{margin:20px 0 0 0;font-size:18px;font-weight:400;color:#555;line-height:1.4;letter-spacing:0;}
+
+.intro_cont.service .why_cont>.title{position:relative;width:100%;margin:104px 0 0 0;}
+.intro_cont.service .why_cont>.title::before{position:absolute;content:"";width:100%;height:1px;background:#4BB7ED;left:0;top:38px;z-index:0;}
+.intro_cont.service .why_cont>.title strong{position:relative;width:430px;height:76px;margin:0 auto;font-family:'Gmarket Sans TTF';font-size:30px;font-weight:700;color:#fff;text-align:center;line-height:84px;border-radius:100px;background:linear-gradient(90deg,rgba(72, 194, 255, 1) 0%, rgba(43, 140, 250, 1) 100%);justify-content:center;align-items:center;}
+
+.intro_cont.service .user_content{background:#e7e7e7;border-radius:10px;margin:40px 0 0 0;padding:50px 56px 70px 56px;}
+.intro_cont.service .user_content .title{font-family: 'GmarketSansBold';font-size:28px;text-decoration:underline;color:#222;margin:0 0 28px 0;justify-content:center;box-sizing:bor}
+.intro_cont.service .user_content .box{background:#fff;border:1px solid #d5d5d5;border-radius:10px;padding:40px;}
+.intro_cont.service .user_content dt{position:relative;font-size:20px;font-weight:700;color:#222;padding:0 0 0 16px;}
+.intro_cont.service .user_content dt::before{position:absolute;content:"";width:6px;height:6px;border-radius:100%;background:#222;left:0;top:8px;}
+.intro_cont.service .user_content dd{font-size:20px;font-weight:400;color:#555;line-height:1.4;margin:5px 0 20px 0;}
+.intro_cont.service .user_content dd:last-child{margin:5px 0 0 0;}
+.intro_cont.service .user_content .box:last-child{padding:0;margin:15px 0 0 0;padding:20px 40px;}
+.intro_cont.service .user_content dd.color_red{margin:0;color:#f43131;}
+
+.intro_cont.function>.title{height:335px;font-size:30px;font-weight:700;color:#222;border-radius:10px;background:linear-gradient(180deg,rgba(201, 234, 255, 1) 0%, rgba(255, 255, 255, 1) 76%);justify-content:center;align-items:center;gap:8px;}
+.intro_cont.function .title strong{font-family: 'GmarketSansBold';font-size:36px;color:#176EE5;}
+
+.intro_cont.function .function_list>.title{position:relative;width:100%;margin:-100px 0 0 0;}
+.intro_cont.function .function_list>.title::before{position:absolute;content:"";width:100%;height:1px;background:#4BB7ED;left:0;top:38px;z-index:0;}
+.intro_cont.function .function_list>.title strong{position:relative;width:430px;height:76px;margin:0 auto;font-family:'Gmarket Sans TTF';font-size:30px;font-weight:700;color:#fff;text-align:center;line-height:84px;border-radius:100px;background:linear-gradient(90deg,rgba(72, 194, 255, 1) 0%, rgba(43, 140, 250, 1) 100%);justify-content:center;align-items:center;}
+.intro_cont.function .box_list li{display:flex;align-items:flex-start;gap:27px;}
+.intro_cont.function .box_list .icon{display:inline-block;width:58px;height:45px;}
+.intro_cont.function .box_list .icon01{background:url(/publish/images/function_icon01.png) no-repeat center;}
+.intro_cont.function .box_list .icon02{background:url(/publish/images/function_icon02.png) no-repeat center;}
+.intro_cont.function .box_list .icon03{background:url(/publish/images/function_icon03.png) no-repeat center;}
+.intro_cont.function .box_list .icon04{background:url(/publish/images/function_icon04.png) no-repeat center;}
+.intro_cont.function .box_list .icon05{background:url(/publish/images/function_icon05.png) no-repeat center;}
+.intro_cont.function .box_list .icon06{background:url(/publish/images/function_icon06.png) no-repeat center;}
+.intro_cont.function .box_list .icon07{background:url(/publish/images/function_icon07.png) no-repeat center;}
+.intro_cont.function .box_list .icon08{background:url(/publish/images/function_icon08.png) no-repeat center;}
+.intro_cont.function .box_list .icon09{background:url(/publish/images/function_icon09.png) no-repeat center;}
+.intro_cont.function .box_list .icon10{background:url(/publish/images/function_icon10.png) no-repeat center;}
+.intro_cont.function .box_list .icon11{background:url(/publish/images/function_icon11.png) no-repeat center;}
+.intro_cont.function .box_list .icon12{background:url(/publish/images/function_icon12.png) no-repeat center;}
+.intro_cont.function .box_list .summary{width:calc(100% - 68px);font-size:22px;font-weight:500;color:#222;margin:0;}
+.intro_cont.function .box_list .summary span:not(.color_red,.cf_text){color:#1956B4;}
+.intro_cont.function .box_list .summary .cf_text{display:block;width:100%;font-size:16px;font-weight:400;color:#555;margin:10px 0 0 0;}
+
 /* 카카오톡 */
 .tab_content{display: none;}
 .tab_content.current{display: block;}
 .kakaotalkset_cont .cf_text{font-size: 15px; font-weight: 300; color: #555;}
 .kakaotalkset_cont .tabType1{margin-top: 50px;}
+.kakaotalkset_cont .tabType1 li button{height:53px;font-size:16px;}
 .kakaotalkset_cont .list_tab_wrap2.type2 .list_tab li{width: 220px;}
 .kakaotalkset_cont .tb_wrap{min-height: auto;}
 .kakaotalkset_cont .table_btn .btnType15{width: auto;}
-.kakaotalkset_cont .select_btnWrap .btn_left{float: left; align-items: center;}
-.kakaotalkset_cont .select_btnWrap .btn_left .selType2{margin: 0 6px;}
-.kakaotalkset_cont .select_btnWrap .search_input{height: 36px; border: 1px solid #d5d5d5; margin: 0 4px 0 0;}
+.kakaotalkset_cont .select_btnWrap .search_input{height: 36px; border: 1px solid #d5d5d5;}
 .kakaotalkset_cont .select_btnWrap .btnType2{width: 60px; height: 36px; font-size: 16px; border: 0;}
 .kakaotalkset_cont .list_info button{height:36px; font-weight: 400;}
 .kakaotalkset_cont .list_info .template_add{width: 110px;}
@@ -1603,7 +1473,7 @@
 .kakaotalkset_cont .kakao_template_list .kakao_template_wrap{position: relative; width: 100%; height: 363px; padding: 30px 0 15px 0; border-radius: 22px 22px 0 0; box-shadow: inset 0 2px 8px rgba(0,0,0,0.2); background: #b6cddd; overflow-y: auto; box-sizing: border-box;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_wrap p.cf_text{width: calc(100% - 40px); font-size: 13px; font-weight: 300; color: #555; margin: 10px auto; text-align: right;}
 .kakaotalkset_cont .kakao_template_list .template_cont{background-color: #fff; width: calc(100% - 31px); margin: 0 0 0 12px; border-radius: 15px;}
-.kakaotalkset_cont .kakao_template_list .template_cont .title{position: relative; height: 36px; background-color: #ffe400; border-radius: 15px 15px 0 0; text-align: center; line-height: 36px; font-size: 16px; color: #222;}
+.kakaotalkset_cont .kakao_template_list .template_cont .title{position: relative; height: 36px; background-color: #FFE400; border-radius: 15px 15px 0 0; text-align: center; line-height: 36px; font-size: 16px; color: #222;}
 .kakaotalkset_cont .kakao_template_list .template_cont .title .check{position: absolute; left: 15px; top: -2px;}
 .kakaotalkset_cont .kakao_template_list .template_cont .title p{width: calc(100% - 70px); margin: 0 auto; padding: 0 0 0 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
 .kakaotalkset_cont .kakao_template_list .template_cont .img_box img{width: 100%; height: auto;}
@@ -1621,7 +1491,7 @@
 .kakaotalkset_cont .kakao_template_list .template_cont .allimtalk_content button{margin: 0 0 8px 10px;}
 .kakaotalkset_cont .kakao_template_list .template_cont .allimtalk_content button:last-child{margin-bottom: 0;}
 .kakaotalkset_cont .kakao_template_list .template_cont .allimtalk_content .template_text+.btn_kakao_type{margin-top: 8px;}
-.kakaotalkset_cont .kakao_template_list .template_cont .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ffea00;}
+.kakaotalkset_cont .kakao_template_list .template_cont .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color:#FFEA00;}
 .kakaotalkset_cont .kakao_template_list .template_cont .allimtalk_content .btn_kakao_type{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ededed;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info{ font-size: 14px; color: #555; padding: 10px 0 0 4px;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info dl{display: flex; padding: 6px 0;}
@@ -1629,7 +1499,7 @@
 .kakaotalkset_cont .kakao_template_list .kakao_template_info dt::after{position: absolute; content: " "; width: 1px; height: 12px; background-color: #d5d5d5; right: 0; top: 2px;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info dd{position: relative; width: calc(100% - 90px);}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info dd p{display: inline-block; max-width: calc(100% - 67px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
-.kakaotalkset_cont .kakao_template_list .kakao_template_info dd span{color: #002c9a; font-weight: bold;}
+.kakaotalkset_cont .kakao_template_list .kakao_template_info dd span{color: var(--primary-color); font-weight: bold; vertical-align:top;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info .btn_wrap{position: absolute; right: 7px; top: -4.5px;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info .btn_wrap button{margin: 0 5px;}
 .kakaotalkset_cont .kakao_template_list .kakao_template_info .btn_wrap button:first-child{margin: 0 2px 0 0;}
@@ -1637,7 +1507,8 @@
 .kakaotalkset_cont .list_content{display: none;}
 .kakaotalkset_cont .list_content td{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
 .kakaotalkset_cont .thumbnail_content.current{display: block;}
-.kakaotalkset_cont .template_sample_content_wrap .btn_wrap{text-align: center; margin: 10px 0 0 0;}
+.kakaotalkset_cont .template_sample_content_wrap .template_cont .allimtalk_content p{width:100%;padding:0;}
+.kakaotalkset_cont .template_sample_content_wrap .btn_wrap{text-align: center; margin: 10px 0 0 0; justify-content: center;}
 .kakaotalkset_cont .template_sample_content_wrap .btn_template_use{width: 136px; text-align: center; border-radius: 100px; font-size: 16px;}
 .kakaotalkset_cont .template_sample_content_wrap .pagination{margin-top: 40px;}
 
@@ -1657,7 +1528,7 @@
 .kakao_wrap .img_file_info_wrap li{display: flex;min-height: 60px;padding: 10px 20px; border-bottom: 1px solid #e5e5e5;justify-content: space-between; align-items: center; box-sizing: border-box;}
 .kakao_wrap .img_file_info_wrap li:last-child{border-bottom: 0;}
 .kakao_wrap .img_file_info_wrap .file_name{font-size: 16px; font-weight: 500;}
-.kakao_wrap .img_file_info_wrap .btn_del{width: 30px;height: 30px;border: 1px solid #002c9a;border-radius: 5px;}
+.kakao_wrap .img_file_info_wrap .btn_del{width: 30px;height: 30px;border: 1px solid var(--primary-color);border-radius: 5px;}
 .kakao_wrap .img_file_info_wrap .img_url{width: calc(100% - 190px);}
 .kakao_wrap .img_file_info_wrap .info_text{margin:0 0 10px 0;}
 .kakao_wrap .img_file_info_wrap .info_text li{list-style:1.4;}
@@ -1701,12 +1572,12 @@
 .kakaotalkset_cont .kakao_wrap .button_type_wrap .button_type_input input{width: 330px;}
 .kakaotalkset_cont .kakao_wrap .button_type_wrap .button_type_input ul li{margin: 0 0 10px 0;}
 .kakaotalkset_cont .kakao_wrap .button_type_wrap .button_type_input ul li:last-child{margin: 0 0 0 0;}
-.kakaotalkset_cont .kakao_wrap .button_type_wrap .btn_del{width: 30px; height: 30px; border: 1px solid #002c9a; border-radius: 5px;}
+.kakaotalkset_cont .kakao_wrap .button_type_wrap .btn_del{width: 30px; height: 30px; border: 1px solid var(--primary-color); border-radius: 5px;}
 .kakaotalkset_cont .kakao_wrap .security_template_wrap{position: relative;}
 .kakaotalkset_cont .kakao_wrap .security_template_wrap .cf_text{position: absolute; width: calc(100% - 205px); right: 0; top: 50%; transform: translateY(-50%);}
 .kakao_wrap .send_right .phone{width: 340px;}
 .kakao_wrap .send_right .phone .phoneIn{height: 610px; background-image: url(/publish/images/content/kakaoBg.png);padding: 27px 25px 0 25px;}
-.kakao_wrap .send_right .phone .prev_p{padding: 0 0 0 10px; border: 0; letter-spacing: -0.25px;}
+.kakao_wrap .send_right .phone .prev_p{padding:5px 0 0 10px;font-size:18px;font-weight:600;border:0;letter-spacing:-0.25px;}
 .kakao_wrap .send_right .phone .prev_p img{margin: 0 10px 0 0;}
 .kakao_wrap .send_right .allimtalk_title{position: relative; width: calc(100% - 20px); background-color: #fae100; font-family: 'LotteMartDream'; font-size: 18px; padding: 12px 21px; border-radius: 5px 5px 0 0; box-sizing: border-box;}
 .kakao_wrap .send_right .allimtalk_title::after{position: absolute; content: " "; width: 42px; height: 42px; background: url(/publish/images/content/icon_kakao01.png) no-repeat; right: -20px; top: -10px;}
@@ -1725,7 +1596,7 @@
 .kakao_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content button{margin: 0 0 8px 10px;}
 .kakao_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content button:last-child{margin-bottom: 0;}
 .kakao_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content .template_text+.btn_kakao_type{margin-top: 8px;}
-.kakao_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ffea00;}
+.kakao_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content .btn_kakao_channel{display:flex;width:calc(100% - 20px);height:40px;font-size:15px;border-radius:5px;background-color:#FFEA00;align-items:center;justify-content:center;gap:8px;}
 .kakao_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content .btn_kakao_type{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ededed;}
 .kakao_wrap .send_right .phone .phoneIn .template_info_wrap{display: flex; width: calc(100% + 13px); height: auto; padding: 6px 15px 6px 23px; justify-content: space-between; align-items: center; background-color: #fae100; margin: -5px 0 0 -5.1px; border-radius: 0 0 25px 25px;}
 .kakao_wrap .send_right .phone .phoneIn .template_info_wrap .btn_template_choice{width: 120px; height: 36px; font-size: 16px; color: #fae100; background-color: #302218; border-radius: 5px;}
@@ -1750,22 +1621,22 @@
 .kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont dd{display:inline-block;width: calc(100% - 150px);font-size: 16px;font-weight: 300;line-height: 1.4;}
 .kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont li.alitalk_return_info{padding: 10px 0 5px 0}
 .kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont li.alitalk_return_info dd{width: calc((100% - 300px)/2); vertical-align: text-top;}
-.kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont .state_type{display:inline-block;height: 28px;padding: 0 10px;border: 1px solid #002c9a;border-radius: 20px;color: #002c9a;font-weight: 500;line-height: 27px;}
-.kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont .state_type.state_red{border: 1px solid #e40000;color: #e40000;}
+.kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont .state_type{display:inline-block;height: 28px;padding: 0 10px;border: 1px solid var(--primary-color);border-radius: 20px;color: var(--primary-color);font-weight: 500;line-height: 27px;}
+.kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont .state_type.state_red{border: 1px solid #f43131;color: #f43131;}
 .kakao_wrap .box_wrap.kakao_alimtalk_return .box_cont .file_text i{display: inline-block;width: 18px;height: 15px;margin:-4px 8px 0 0;background: url(/publish/images/content/attach_file2.png) no-repeat;}
 .send_top .kakaotalksend_cont{padding: 30px 40px 80px 40px;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left{padding: 20px 0 0 0;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .tType1 td{padding: 15px 0;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap ul{margin: 14px 0;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap li{font-size: 16px; font-weight: 300; line-height: 1.5;}
-.send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap li span{color: #e40000;}
-.send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap .excel_btn{height: 40px; border: 5px solid #129738; color: #129738; font-size: 16px; font-weight: 500; padding: 0 15px; border-radius: 5px;}
+.send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap li span{color: #f43131;}
+.send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap .excel_btn{height: 40px; border: 5px solid #15983a; color: #15983a; font-size: 16px; font-weight: 500; padding: 0 15px; border-radius: 5px;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .variable_wrap .excel_btn i{width: 17px; height: 15px; background-image: url(/publish/images/content/excel_img.png); margin: 0 5px 5px 0;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .receiver_wrap01{display: none !important;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .receiver_wrap02 .btnType{margin:0 0 0 6px;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .receiver_wrap02 .listType{width: 100%;}
 .send_top .kakaotalksend_cont .kakao_wrap .send_left .receipt_num .list_table_num{width: calc(100% - 60px);}
-.kakaotalksend_cont .kakao_wrap .put_right .qmMark{width: 19px; height: 19px; background-image: url(/publish/images/content/qmIcon_s.png); margin: -0.3px 0 2px 4px;}
+.kakaotalksend_cont .kakao_wrap .put_right .qmMark{width: 19px; height: 19px; background-image: url(/publish/images/content/qmIcon_s.png); margin:0 0 0 4px;}
 .kakaotalksend_cont .kakao_wrap .receipt_num_top{align-items:center;gap:6px;}
 .kakaotalksend_cont .kakao_wrap .send_right .phone_bottom{top:calc(100% - 230px);}
 .kakaotalksend_cont .kakao_wrap .send_right .phone .phoneIn .text_preview{height: 78%;}
@@ -1788,11 +1659,11 @@
 .kakaotalksend_cont .kakao_wrap .button_type_wrap .button_type_input input{width: 330px;}
 .kakaotalksend_cont .kakao_wrap .button_type_wrap .button_type_input ul li{margin: 0 0 10px 0;}
 .kakaotalksend_cont .kakao_wrap .button_type_wrap .button_type_input ul li:last-child{margin: 0 0 0 0;}
-.kakaotalksend_cont .kakao_wrap .button_type_wrap .btn_del{width: 30px; height: 30px; border: 1px solid #002c9a; border-radius: 5px;}
+.kakaotalksend_cont .kakao_wrap .button_type_wrap .btn_del{width: 30px; height: 30px; border: 1px solid var(--primary-color); border-radius: 5px;}
 .kakao_wrap .listType .list_body_wrap{max-height: calc(100% - 37px); overflow: auto;}
 
 .kakao_use_guide_cont .kakao_use_guide{display: flex; margin: 0 0 50px 0;}
-.kakao_use_guide_cont .kakao_use_guide li{position: relative; width: calc((100% - 60px)/4); padding: 35px 23px; background-color: #eee; border-radius: 5px; margin: 0 20px 0 0; text-align: center;}
+.kakao_use_guide_cont .kakao_use_guide li{position: relative; width: calc((100% - 60px)/4); padding: 35px 23px; background-color: #f2f2f2; border-radius: 5px; margin: 0 20px 0 0; text-align: center;}
 .kakao_use_guide_cont .kakao_use_guide li::after{position: absolute; content: " "; width: 50px; height: 50px; background-image: url(/publish/images/content/icon_kakao_guide_next.png); right: -35px; top: 50%; transform: translateY(-50%); z-index: 1;}
 .kakao_use_guide_cont .kakao_use_guide li:last-child{margin: 0 0 0 0;}
 .kakao_use_guide_cont .kakao_use_guide li:last-child::after{display: none;}
@@ -1803,8 +1674,8 @@
 .kakao_use_guide_cont .kakao_use_guide li.guide_04 i{background-image: url(/publish/images/content/icon_kakao_guide04.png);}
 .kakao_use_guide_cont .kakao_use_guide li .guide_title{font-family: 'GmarketSansBold'; font-size: 24px; margin: 20px 0 0 0;}
 .kakao_use_guide_cont .kakao_use_guide li .guide_info{display: block; height: 120px;  font-size: 18px; font-weight: 300; color: #444; line-height: 1.3; margin: 20px 0 0 0;}
-.kakao_use_guide_cont .kakao_use_guide li .btn_wrap{display: flex; width: 100%; height: 50px; font-size: 16px; text-align: center; letter-spacing: -0.5px; margin: 20px 0 0 0; border-radius: 5px; background-color: #fcc72b; justify-content: center; align-items: center;}
-.kakao_use_guide_cont .kakao_use_guide li .btn_wrap a{position: relative; padding: 0 8px;}
+.kakao_use_guide_cont .kakao_use_guide li .btn_wrap{display: flex; width: 100%; height: 50px; font-size: 16px; color:#fff; text-align: center; letter-spacing: -0.5px; margin: 20px 0 0 0; border-radius: 5px; background-color: var(--secondary-color); justify-content: center; align-items: center;}
+.kakao_use_guide_cont .kakao_use_guide li .btn_wrap a{position:relative;display:flex;width:100%;height:100%;font-weight:500;justify-content:center;align-items:center;}
 .kakao_use_guide_cont .kakao_use_guide li .btn_wrap a::after{position: absolute; content: " "; width: 1px; height: 15px; background-color: #836e31; top: 1px; right: 0;}
 .kakao_use_guide_cont .kakao_use_guide li .btn_wrap a:last-child::after{display: none;}
 .kakao_use_guide_cont .qna{margin: 0 0 50px 0;}
@@ -1874,7 +1745,7 @@
 .fax_content .final_wrap .final_pay {position: relative; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;}
 .fax_content .final_wrap p:first-child {font-size: 20px;font-weight: 500;}
 .fax_content .final_wrap p:last-child {font-size: 20px;}
-.fax_content .final_wrap p span#totalPriceTxt {font-size: 24px;color: #e40000;font-weight: 500;}
+.fax_content .final_wrap p span#totalPriceTxt {font-size: 24px;color: #f43131;font-weight: 500;}
 .fax_content .final_wrap p span:last-child {font-size: 16px;color: #888;font-weight: 300;}
 /* .fax_content .final_wrap .pay_type {border-radius: 5px; height: 60px; padding: 12px 13px; box-sizing: border-box;} */
 .fax_content .final_wrap .pay_type:last-child {margin-top: 10px;}
@@ -1905,7 +1776,7 @@
 .fax_content .send_info_fax .fax_content img{width: 100%;}
 .fax_content .send_info_fax ul li{padding: 15px 0; border-bottom: 1px dashed #d5d5d5;}
 .fax_content .send_info_fax ul li:last-child{border-bottom: 0; padding-bottom: 0;}
-.fax_content .send_info_fax ul .num_title{display: inline-block; width: 25px; font-size: 16px;font-family: 'GmarketSansBold'; color: #002c9a; vertical-align: top; padding: 3px 0 0 0;}
+.fax_content .send_info_fax ul .num_title{display: inline-block; width: 25px; font-size: 16px;font-family: 'GmarketSansBold'; color: var(--primary-color); vertical-align: top; padding: 3px 0 0 0;}
 .fax_content .send_info_fax ul p{display: inline-block; width: calc(100% - 30px); font-size: 15px; color: #666; line-height: 1.3; padding: 2px 0 0 0; letter-spacing: -1px;}
 .fax_content .send_info_fax ul b{display: block; font-size: 16px; font-weight: 500; color: #333; margin: 0 0 5px 0;}
 .fax_content .send_info_fax ul span{display: block; font-size: 14px; text-indent: -18px; padding: 0 0 0 18px; margin: 5px 0 0 0; letter-spacing: -1px;}
@@ -1925,127 +1796,66 @@
 .kakao_intro_cont{letter-spacing: -0.5px; /*word-break: keep-all;*/}
 .kakao_intro_cont .heading h2{letter-spacing: 0;}
 
-/* 카톡전송 > 알림톡 소개_알림톡이란? */
-.kakao_intro_cont .kakao_intro{background-image: url(/publish/images/kakao_intro_cont/bg01.png);}
-.kakao_intro_cont .kakao_intro ,.service ,.use{width: 100%; /*height: 1382px;*/ background-color: #f3f6fb; border-radius: 20px; padding: 0 98px 70px; box-sizing: border-box;}
-.kakao_intro_cont .kakao_intro ,.service ,.use .title{margin: 0 auto;}
-.kakao_intro_cont .kakao_intro .title h3 ,.service .title h3 ,.use .title h3{font-family: 'GmarketSansBold'; font-size: 36px; text-align: center; padding-top: 70px;}
-.kakao_intro_cont .kakao_intro .title-line .left-line{width: 379px; height: 3px; background-color: #949aa5; border-radius: 1.5; float: left; margin-top: -24px;}
-.kakao_intro_cont .kakao_intro .title-line .right-line{width: 379px; height: 3px; background-color: #949aa5; border-radius: 1.5; float: right; margin-top: -24px;}
+.kakao_intro_cont .kakao_intro .box.fill{padding:60px 96px;margin:0 0 30px 0;background:#f8f8f8;border-radius:10px;}/* font-family: 'GmarketSansBold'; */
+.kakao_intro_cont .box .title{display:flex;padding:0 0 40px 0;justify-content:center;align-items:center;gap:36px;}
+.kakao_intro_cont .box h3{font-family:'GmarketSansBold';font-size:42px;}
+.kakao_intro_cont .box h3 .summary {display:block;font-size:20px;font-weight:600;color:#888;margin:8px 0 0 0;}
 
-/*컨텐츠*/
-.kakao_intro_cont .kakao_intro .con .intro{display: flex; justify-content: space-between; margin-top: 65px;}
-.kakao_intro_cont .kakao_intro .con .intro .phone{margin-top: -25px;}
-/*text
-.kakao_intro_cont .kakao_intro .con .text{position: absolute; left: 560px;}
-.kakao_intro_cont .kakao_intro .con .text p{position: relative; font-family: 'GmarketSansBold'; font-size: 29px; color: #fff; z-index: 9; text-shadow: 0px 0px 6px rgba(0,0,0,0.5);} 
-.kakao_intro_cont .kakao_intro .con .text p span{font-family: 'GmarketSansBold'; font-size: 32px; color: #fbc72b;}
-.kakao_intro_cont .kakao_intro .con .text img{position: absolute; top: -40px; left: 550px;}*/
+.kakao_intro_cont .box h4{font-family:'GmarketSansBold';font-size:32px;color:#222;text-decoration:underline;text-underline-offset:6px;}
 
-/*좋은점 목록*/
-.kakao_intro_cont .kakao_intro .con .intro ul{margin-top: -50px;}
-.kakao_intro_cont .kakao_intro .con .intro ul li{position: relative; margin-bottom: 23px;}
-.kakao_intro_cont .kakao_intro .con .intro ul li p:nth-child(1){font-family: 'GmarketSansBold'; font-size: 18px; width: 40px; height: 40px; background-color: #002c9a; color: #fff;  text-align: center; line-height: 43px; border-radius: 20px; position: absolute; left: -10px; top: -12px;} 
-.kakao_intro_cont .kakao_intro .con .intro ul li p:nth-child(2){font-family: 'GmarketSansBold'; font-size: 20px; width: 100%; height: 75px; background-color: #fff; text-align: center; line-height: 78px; border-radius: 20px; box-shadow: 0 0 7px rgba(0,0,0,0.2);} 
-.kakao_intro_cont .kakao_intro .con .intro ul li p:nth-child(2) span{font-family: 'GmarketSansMedium';} 
-/*1번째*/
-.kakao_intro_cont .kakao_intro .con .intro ul li:nth-child(1){margin-bottom: 50px;}
-/*4번쨰*/
-.kakao_intro_cont .kakao_intro .con .intro ul li:nth-child(4) p:nth-child(2){line-height: 30px; padding: 25px 0 5px 0;}
-/*7번째*/
-.kakao_intro_cont .kakao_intro .con .intro ul li p:nth-child(7){margin-bottom: 0;}
-/*문자vs알림톡*/
-.kakao_intro_cont .kakao_intro .con .fight{position: relative;}
-.kakao_intro_cont .kakao_intro .con .fight .line{width: 100%; border-top: 6px dotted #b7bfcc; margin-top: 60px;}
-.kakao_intro_cont .kakao_intro .con .fight .fight-title{ width: 232px; margin: 50px auto 0 auto;}
-.kakao_intro_cont .kakao_intro .con .fight .fight-title h4{font-family: 'GmarketSansBold'; font-size: 28px; margin-left: 37px;}
-.kakao_intro_cont .kakao_intro .con .fight .fight-title h4 span{font-family: 'GmarketSansBold'; font-size: 25px;}
-.kakao_intro_cont .kakao_intro .con .fight .fight-title .circle{width: 19px; height: 19px; background-color: #f3f6fb; margin-top: -30px; border: 4px solid #ffcc33; border-radius: 50%;}
+.kakao_intro_cont .intro .title{padding:0 0 30px 0;border-bottom:1px solid var(--primary-dark-color);}
+.kakao_intro_cont .intro .icon.kakao_intro_title{display:inline-block;width:110px;height:110px;background:url(/publish/images/kakao_intro_cont/kakao_intro_title.png) no-repeat center center;}
+.kakao_intro_cont .intro .contents{display:flex;margin:50px 0;justify-content:center;align-items:center;gap:34px;}
+.kakao_intro_cont .intro .list{display:flex;flex-direction:column;gap:20px;}
+.kakao_intro_cont .intro .list li{display:flex;min-height:80px;padding:18px 40px 18px 10px;background:#fff;border-radius:120px;gap:15px;box-sizing:border-box;align-items:center;}
+.kakao_intro_cont .intro .list li p:first-child{width:40px;height:40px;font-family:'GmarketSansBold';font-size:18px;color:#fff;text-align:center;line-height:42px;background:var(--primary-color-hover);border-radius:100%;}
+.kakao_intro_cont .intro .list li p:last-child{width:calc(100% - 50px);font-size:20px;font-weight:400;color:#222;line-height:1.4;}
+.kakao_intro_cont .intro .list li b{font-weight:600;}
 
-/*문자vs알림톡_컨텐츠*/
-/*.kakao_intro_cont .kakao_intro .con .fight .con .fight-img .name p{width: 110px; height: 36px; background-color: #002788; position: relative; margin: 0 auto;}
-.kakao_intro_cont .kakao_intro .con .fight .con .fight-img .icon{position: relative; background-color: #fff; box-shadow: 0 0 7px rgba(0,0,0,0.2); width: 195px; height: 220px; border-radius: 20px; }
-.kakao_intro_cont .kakao_intro .con .fight .con .fight-img .icon img{position: absolute; transform: translate(26%,33%);}*/
-/*.kakao_intro_cont .kakao_intro .con .fight .box .fight-img{padding: 0 20%; padding-bottom: 50px;} */
-.kakao_intro_cont .kakao_intro .con .fight .wrap{width: 100%; display: flex; justify-content: space-between; margin-top: 40px;}
-.kakao_intro_cont .kakao_intro .con .fight .box{width: 436px; display: flex; flex-wrap: wrap;}
+.kakao_intro_cont .vs ul{display:flex;align-items:center;gap:28px;}
+.kakao_intro_cont .vs li{flex:1;background:#fff;padding:10px 20px 20px;border:1px solid #d5d5d5;border-radius:5px;}
+.kakao_intro_cont .vs .summary{display:flex;height:50px;border-bottom:1px solid #e7e7e7;font-size:20px;font-weight:400;color:var(--primary-color-hover);justify-content:center;align-items:center;}
+.kakao_intro_cont .vs .summary b{font-weight:600;}
+.kakao_intro_cont .vs .bottom{display:flex;align-items:center;gap:14px;}
+.kakao_intro_cont .vs dl{flex:1;margin:20px 0 0 0;padding:20px 0;background:#f2f2f2;border-radius:5px;}
+.kakao_intro_cont .vs dt{display:flex;width:70px;height:26px;margin:0 auto;border:1px solid #d5d5d5;border-radius:30px;font-size:16px;font-weight:400;color:#888;align-items:center;justify-content:center;}
+.kakao_intro_cont .vs dd{display:flex;margin:15px 0 0 0;font-family:'GmarketSansBold';font-size:21px;color:#888;justify-content:center;align-items:center;gap:10px;}
+.kakao_intro_cont .vs .icon{display:inline-block;width:36px;height:32px;}
+.kakao_intro_cont .vs .msg{background:url(/publish/images/kakao_intro_cont/icon_msg.png) no-repeat center;}
+.kakao_intro_cont .vs .kakao{background:url(/publish/images/kakao_intro_cont/icon_kakao.png) no-repeat center;}
 
-.kakao_intro_cont .kakao_intro .con .fight .box .fight-img{position: relative; }
-.kakao_intro_cont .kakao_intro .con .fight .box .fight-img .name{position: absolute; left: 50%; transform: translateX(-50%); margin-top: -15px; width: 100px; height: 34px; line-height: 34px; background-color: #e4e6ea; color: #666; text-align: center; border-radius: 17px; font-weight: 500;}
-.kakao_intro_cont .kakao_intro .con .fight .box .fight-img .icon{padding: 0 33px; height: 220px; background-color: #fff; border-radius: 20px; box-shadow: 0 0 5px rgba(0,0,0,0.2); text-align: center;}
-.kakao_intro_cont .kakao_intro .con .fight .box .fight-img .icon img{margin-top: 38px;}
-.kakao_intro_cont .kakao_intro .con .fight .box .fight-img .icon .price{font-family: 'GmarketSansBold'; font-size: 22px; color: #999; padding-top: 12px;}
-/*text*/
-.kakao_intro_cont .kakao_intro .con .fight .fight-text-wrap{display: flex; justify-content: space-between;}
-.kakao_intro_cont .kakao_intro .con .fight .text p{background-color: #ced4de; width: 436px; height: 45px; text-align: center; border-radius: 10px; font-weight: 300; font-size: 17px; margin-top: 20px; display: flex; align-items: center; justify-content: center;}
-.kakao_intro_cont .kakao_intro .con .fight .text p span{font-weight: 700;}
-/*vs*/
-.kakao_intro_cont .kakao_intro .con .fight .box .vs{font-family: 'GmarketSansBold'; font-size: 15px; color: #002c9a; margin:100px 12px 0 12px;}
-/*line*/
-.kakao_intro_cont .kakao_intro .con .fight .fight-line{width: 0; height: 224px; border-right: 6px dotted #b7bfcc; /* display: flex; position: absolute; top: 33%; left: 50%;*/}
-/*알림톡*/
-.kakao_intro_cont .kakao_intro .con .fight .box .kakao .name{background-color: #fbc72b; color: #222;}
-.kakao_intro_cont .kakao_intro .con .fight .box .kakao .icon .price{color: #222;}
+.kakao_intro_cont .vs .yellow{background:#f9e000;}
+.kakao_intro_cont .vs .yellow dt{border:1px solid #371c1d;color:#371C1D;}
+.kakao_intro_cont .vs .yellow dd{color:#371C1D;}
 
-/*알림톡 활용 방법*/
-.kakao_intro_cont .use{background-image: url(/publish/images/kakao_intro_cont/bg02.png);}
-.kakao_intro_cont .use ,.service,.note{margin-top: 80px;}
-.kakao_intro_cont .use .title-line .left-line{width: 346px; height: 3px; background-color: #949aa5; border-radius: 1.5; float: left; margin-top: -24px;}
-.kakao_intro_cont .use .title-line .right-line{width: 346px; height: 3px; background-color: #949aa5; border-radius: 1.5; float: right; margin-top: -24px;}
+
 /*알림톡 활용 방법_tab*/
-.kakao_intro_cont .use .tab-wrap{width: 100%; margin: 65px auto 0 auto;}
+.kakao_intro_cont .use .tab-wrap{width: 100%; margin: 0 auto;}
 .kakao_intro_cont .use ul.tabs{margin: 0px; padding: 0px; list-style: none;}
-.kakao_intro_cont .use ul.tabs{width: 100%; background-color: #fff; display: flex; justify-content: space-between; border-radius: 10px 10px 0 0; border-bottom: 2px solid #b7bfcc;}
-.kakao_intro_cont .use ul.tabs li{border-left: 1px solid #e5e5e5; font-weight: 400; font-size: 20px; width: 170px; height: 60px; text-align: center; line-height: 60px; background: none; display: inline-block; cursor: pointer;}
+.kakao_intro_cont .use ul.tabs{display:flex;width: 100%;justify-content: center;gap:15px;}
+.kakao_intro_cont .use ul.tabs li{display:flex;padding:0 30px;height:50px;font-size:20px;color:#555;border-radius:55px;border:1px solid #d5d5d5;background:#fff;justify-content:center;align-items:center;cursor:pointer;}
 .kakao_intro_cont .use ul.tabs li:nth-child(1){border-left: none;}
-/*선택_tab*/
-.kakao_intro_cont .use ul.tabs li.current{border-radius: 10px 10px 0 0; background: #002c9a; font-weight: 500; font-size: 20px; color: #fff}
-/*tab_안에내용*/
+.kakao_intro_cont .use ul.tabs li.current{background: var(--primary-color-hover);color:#fff;border:1px solid var(--primary-color-hover);}
 .kakao_intro_cont .use .tab-content{display: none;}
 .kakao_intro_cont .use .tab-content img{margin-top: 40px; /*width: 100%;*/}
-/*선택_tab_안에내용*/
 .kakao_intro_cont .use .tab-content.current{display: inherit;}
 
-/*서비스이용방법*/
-.kakao_intro_cont .service{background-image: url(/publish/images/kakao_intro_cont/bg03.png);}
-.kakao_intro_cont .service .title-line .left-line{width: 346px; height: 3px; background-color: #949aa5; border-radius: 1.5; float: left; margin-top: -24px;}
-.kakao_intro_cont .service .title-line .right-line{width: 346px; height: 3px; background-color: #949aa5; border-radius: 1.5; float: right; margin-top: -24px;}
 /*서비스 이용 방법 공통점*/
-.kakao_intro_cont .service .con{ display: flex; justify-content: space-between; /*0letter-spacing: 1.5;*/}
-.kakao_intro_cont .service .con .common{width: 98%; padding-bottom: 30px; background-color: #fff; border-radius: 20px; box-shadow: 0 0 7px rgba(0,0,0,0.2);}
-.kakao_intro_cont .service .con .common .step p{height: 45px; background-color: #002c9a;; border-radius: 20px 20px 0 0; text-align: center; line-height: 45px; color: #fff; font-size: 18px; font-weight: 300;}
-.kakao_intro_cont .service .con .common .step p span{font-size: 22px; font-weight: 500;}
-.kakao_intro_cont .service .con .common .text{padding: 22px 10px 0 30px; position: relative;}
-.kakao_intro_cont .service .con .common .text .btn a{display: inline-block; font-family: 'GmarketSansBold'; font-size: 23px; margin-bottom: 5px;}
-.kakao_intro_cont .service .con .common .text .btn a:hover{color: #002c9a;}
-.kakao_intro_cont .service .con .common .text .btn a img{margin: -3px 0 0 8px;}
-.kakao_intro_cont .service .con .common .text .type p:nth-child(1){font-size: 18px; font-weight: 300; line-height: 25px; margin-top: 8px;}
-.kakao_intro_cont .service .con .common .text .type p:nth-child(2){font-size: 16px; font-weight: 300; line-height: 21px; color: #999; text-indent: -20px; margin: 0 0 0 20px; margin-top: 6px;} 
-/*서비스 이용 방법_01*/
-.kakao_intro_cont .service .con .service-01 ,.service-03{margin-right: 30px;}
-.kakao_intro_cont .service .con .service-01 ,.service-02{margin-top: 65px;}
-.kakao_intro_cont .service .con .service-01 .text .text-line{width: 304px; border-top: 4px dotted #b7bfcc; margin-left: 2px;}
-/*아이콘*/
-.kakao_intro_cont .service .con .service-01 .text .icon{position: absolute; top: 100px; right: 30px;}
-/*서비스 이용 방법_02*/
-.kakao_intro_cont .service .con .service-02 .text .text-line{width: 244px; border-top: 4px dotted #b7bfcc; margin-left: 2px;}
-/*아이콘*/
-.kakao_intro_cont .service .con .service-02 .text .icon{position: absolute; top: 100px; right: 30px;}
-/*서비스 이용 방법_03*/
-.kakao_intro_cont .service .con .service-03 ,.service-04{margin-top: 30px;}
-.kakao_intro_cont .service .con .service-03{padding-bottom: 26px;}
-.kakao_intro_cont .service .con .service-03 .text .text-line{width: 304px; border-top: 4px dotted #b7bfcc; margin-left: 2px;}
-.kakao_intro_cont .service .con .service-03 .type p:nth-child(1){padding-right: 90px;}
-/*아이콘*/
-.kakao_intro_cont .service .con .service-03 .text .icon{position: absolute; top: 100px; right: 30px;}
-/*서비스 이용 방법_04*/
-.kakao_intro_cont .service .con .service-04 .text .text-line{width: 180px; border-top: 4px dotted #b7bfcc; margin-left: 2px;}
-/*아이콘*/
-.kakao_intro_cont .service .con .service-04 .text .icon{position: absolute; top: 100px; right: 30px;}
+.kakao_intro_cont .service .con{ display: flex; justify-content: space-between; gap:20px; flex-wrap:wrap;}
+.kakao_intro_cont .service .con .common{position:relative;width:calc((100% / 2) - 82px);background:#fff;padding:30px 35px;border-radius:10px;border:1px solid #d5d5d5;}
+.kakao_intro_cont .service .step{font-size:18px;font-weight:600;color:var(--secondary-color);}
+.kakao_intro_cont .service .step span{font-size:25px;font-weight:700;}
+.kakao_intro_cont .service .btn a{display:inline-block;height:45px;margin:15px 0 0 0;font-family: 'GmarketSansMedium';font-size:19px;color:#fff;line-height:1.1;background:var(--primary-color-hover);padding:15px 20px;border-radius:50px;box-sizing:border-box;}
+.kakao_intro_cont .service .btn:hover{box-shadow:none;}
+.kakao_intro_cont .service .btn a img{margin:0.5px 0 0 12px;vertical-align:top;}
+.kakao_intro_cont .service .type p{width:83%;margin:20px 0 0 0;font-size:18px;color:#555;line-height:1.4;}
+.kakao_intro_cont .service .type p:nth-child(2){font-size:16px;color:#999;}
+.kakao_intro_cont .service .icon{position:absolute;bottom:60px;right:35px;}
+
 /*서비스 이용 방법_이용가이드 버튼*/
-.kakao_intro_cont .service .guide a{font-weight: 500; font-size: 24px; line-height: 60px; text-align: center; background-color: #fbc72b; width: 360px; height: 60px; margin: 40px auto 0 auto; border-radius: 10px;}
+.kakao_intro_cont .service .guide a{display:flex;width:33%;height:60px;margin:40px auto 0 auto;padding:15px 20px;font-size:24px;font-weight:500;color:#fff;background:var(--secondary-color);border-radius:5px;box-sizing:border-box;align-items:center;justify-content:center;}
 .kakao_intro_cont .service .guide a:hover{box-shadow: 0 0 10px rgba(0,0,0,0.4);}
-.kakao_intro_cont .service .guide a img{margin-top: -4px;}
+
 
 /*유의사항*/
 .kakao_intro_cont .note{width: 100%; background-color: #e9ebf0; border-radius: 20px; padding: 0 98px 40px; box-sizing: border-box;}
@@ -2053,55 +1863,43 @@
 .kakao_intro_cont .note .note-title p span{padding-right: 10px;}
 /*유의사항_목록*/
 .kakao_intro_cont .note ul{line-height: 26px; font-weight: 300; font-size: 16px; color: #666; background-color: #fff; border-radius: 10px; padding: 25px 53px;}
-.kakao_intro_cont :not(.friendtalk) .note ul li:nth-child(4){font-size: 15px; color: #999; padding-left: 10px; margin-top: -3px;}
-.kakao_intro_cont :not(.friendtalk) .note ul li:nth-child(5){font-weight: 400; font-size: 14px; color: #fff; margin: 3px 0 7px 10px; background-color: #002c9a; width: 260px; height: 32px; line-height: 31px; text-align: center; border-radius: 5px;} 
-.kakao_intro_cont :not(.friendtalk) .note ul li:nth-child(5):hover{box-shadow: 0 0 8px rgba(0,0,0,0.5);}
+.kakao_intro_cont .tab_content:not(.brandMsg) .note ul li:nth-child(4){font-size: 15px; color: #999; padding-left: 10px; margin-top: -3px;}
+.kakao_intro_cont .tab_content:not(.brandMsg) .note ul li:nth-child(5){font-weight: 400; font-size: 14px; color: #fff; margin: 3px 0 7px 10px; background-color: #888; width: 260px; height: 32px; line-height: 31px; text-align: center; border-radius: 5px;} 
+.kakao_intro_cont .tab_content:not(.brandMsg) .note ul li:nth-child(5):hover{box-shadow: 0 0 8px rgba(0,0,0,0.5);}
 
-/* 친구톡 소개 */
-.kakao_intro_cont .friendtalk .kakao_intro .con .intro ul li:nth-child(1){margin:0 0 45px 0;}
-.kakao_intro_cont .friendtalk .kakao_intro .con .intro ul li{margin:0 0 19px 0;}
-.kakao_intro_cont .friendtalk .kakao_intro .con .intro ul li p:nth-child(2){display:flex;line-height:1;height:auto;justify-content:center;align-items:center;padding:22px 0 18px 0;font-family:'GmarketSansMedium';}
-.kakao_intro_cont .friendtalk .kakao_intro .con .intro ul li p:nth-child(2) span{display:inline-block;font-family:'GmarketSansBold';margin:0 4px;}
-.kakao_intro_cont .friendtalk .kakao_intro .con .intro ul li:nth-child(4) p:nth-child(2){height:auto;line-height:1;padding:24px 0 18px 0;}
-.kakao_intro_cont .friendtalk .kakao_intro .con .intro .phone{width:auto;height:100%;margin:-20px 0 0 -15px;}
+/* 브랜드메시지 소개 */
+.kakao_intro_cont .brandMsg .vs_table{width:100%;background:#fff;border-top:1px solid #222;}
+.kakao_intro_cont .brandMsg .vs_table table{width:100%;table-layout:fixed;}
+.kakao_intro_cont .brandMsg .vs_table table th,.kakao_intro_cont .brandMsg .vs_table table td{vertical-align:middle;font-family:'GmarketSansBold';font-size:20px;text-align:center;}
+.kakao_intro_cont .brandMsg .vs_table thead tr{border-bottom:1px solid #d5d5d5;}
+.kakao_intro_cont .brandMsg .vs_table thead th{height:80px;}
+.kakao_intro_cont .brandMsg .vs_table .type_text{display:inline-flex;width:180px;height:40px;margin:0 auto;font-family:inherit;font-size:20px;color:#666;line-height:45px;border-radius:99px;background:#e7e7e7;justify-content:center;align-items:center;}
+.kakao_intro_cont .brandMsg .vs_table .type_text.yellow{background:#F9E000;color:#222;}
+.kakao_intro_cont .brandMsg .vs_table tbody td{height:70px;padding:11px 0 5px;border-bottom:1px solid #f2f2f2;box-sizing:border-box;}
+.kakao_intro_cont .brandMsg .vs_table tbody td:first-child{color:#666;}
+.kakao_intro_cont .brandMsg .vs_table tbody td:nth-child(2){font-family: 'GmarketSansMedium';color:#545A62;}
+.kakao_intro_cont .brandMsg .vs_table tbody td span{font-size:16px;font-weight:300;}
 
-.kakao_intro_cont .friendtalk .kakao_intro .fight .wrap{max-width:1024px;gap:50px;justify-content:center;}
-.kakao_intro_cont .friendtalk .kakao_intro .con .fight .fight-title{width:250px;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs{display:flex;width:calc((100% - 200px) / 2);flex-direction:column;align-items:center;gap:20px;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs.vs_title{width:100px;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs .title{height:34px;padding:5px 30px 3px;border-radius:35px;background:#E4E6EA;font-family:'GmarketSansBold';color:#666;font-size:20px;line-height:35px;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs.vs_title ul{padding:20px 0;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs.vs_title .title{background:transparent;font-family:'GmarketSansMedium';}
-.kakao_intro_cont .friendtalk .kakao_intro .vs.vs_title ul li{background:transparent;font-family:'GmarketSansMedium';}
-.kakao_intro_cont .friendtalk .kakao_intro .fight .vs .box{display:flex;width:100%;padding:20px;background:#fff;border-radius:20px;box-shadow:0 0 10px rgba(0,0,0,0.1);align-items:center;flex-direction:column;box-sizing:border-box;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs ul li{display:flex;height:51px;margin:4px 0;font-size:20px;font-family:'GmarketSansBold';color:#666;letter-spacing:-.85px;text-align:center;justify-content:center;align-items:center;flex-wrap:wrap;gap:0;}
-.kakao_intro_cont .friendtalk .kakao_intro .vs .box ul li span{display:block;width:100%;font-size:16px;font-weight:400;margin:-10px 0 0 0;}
+.kakao_intro_cont .brand_use{display:flex;max-width:1024px;margin:0 0 40px 0;justify-content:space-between;}
+.kakao_intro_cont .brand_use li{text-align:center;width:calc((1024px / 3) - 20px);}
+.kakao_intro_cont .brand_use .title{display:inline-flex;height:43px;font-size:20px;font-weight:bold;color:var(--primary-color);text-align:center;background:#fff;padding:0 23px;margin:0 auto 20px auto;border:2px solid var(--primary-color);border-radius:35px;justify-content:center;align-items:center;}
+.kakao_intro_cont .brand_use img{margin:0 0 20px 0;}
+.kakao_intro_cont .brand_use .explan_text{display:table-cell;width:100%;height:100px;line-height:1.4;padding:0 20px;background:#fff;border:1px solid #B2C7DA;border-radius:10px;box-sizing:border-box;vertical-align:middle;}
+.kakao_intro_cont .brand_use li:first-child .explan_text{display:flex;align-items:center;justify-content:center;}
+.kakao_intro_cont .brand_use .explan_text span{font-weight:bold;}
 
-.kakao_intro_cont .friendtalk .kakao_intro .friendtalk_vs .title{background:#ffcc33;color:#222;}
-.kakao_intro_cont .friendtalk .friendtalk_vs .box{border:1px solid #222;}
-.kakao_intro_cont .friendtalk .friendtalk_vs .box ul li{color:#222;}
-.kakao_intro_cont .friendtalk .friendtalk_vs .box ul li span{color:#666;}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide{display: flex; margin: 50px 0; gap: 30px;}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li{position: relative; display:flex; width: calc((100% - 60px)/3); background-color: #fff; border:1px solid #d5d5d5;border-radius: 10px; padding: 40px 0 30px 0; text-align: center; overflow: hidden;flex-direction: column;gap: 20px;align-items:center;}
+.kakao_intro_cont .brandMsg .service .title{font-size:18px;font-weight:600;color:var(--secondary-color);gap:4px;padding:0;}
+.kakao_intro_cont .brandMsg .service .title span{font-size:25px;font-weight:700;}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li i{display: block; width: 128px; height: 128px; margin: 10px auto 0 auto; background-color: #F3F6FB; border-radius: 100%; background-repeat: no-repeat; background-position: center;}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li.guide_01 i{background-image: url(/publish/images/content/icon_kakao_guide01.png);}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li.guide_02 i{background-image: url(/publish/images/content/icon_kakao_guide02.png);}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li.guide_03 i{background-image: url(/publish/images/content/icon_kakao_guide04.png);}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li .guide_title{display:inline-block;height:43px;padding:0 20px;background:var(--primary-color-hover);font-family: 'GmarketSansMedium';font-size: 19px;line-height:45px;color:#fff;border-radius:50px;}
+.kakao_intro_cont .brandMsg .service .kakao_use_guide li .guide_info{display: block; height: 120px;  font-size: 18px; font-weight: 300; color: #444; line-height: 1.3; padding: 0 20px;}
 
-.friendtalk_use{display:flex;max-width:1024px;margin:50px 0;justify-content:space-between;}
-.friendtalk_use li{text-align:center;width:calc((1024px / 3) - 20px);}
-.friendtalk_use .title{display:inline-flex;height:43px;font-size:20px;font-weight:bold;color:#002c9a;text-align:center;background:#fff;padding:0 23px;margin:0 auto 20px auto;border:2px solid #002c9a;border-radius:35px;justify-content:center;align-items:center;}
-.friendtalk_use img{margin:0 0 20px 0;}
-.friendtalk_use .explan_text{display:table-cell;width:100%;height:100px;line-height:1.4;padding:0 20px;background:#fff;border-radius:10px;box-sizing:border-box;vertical-align:middle;}
-.friendtalk_use li:first-child .explan_text{display:flex;align-items:center;justify-content:center;}
-.friendtalk_use .explan_text span{font-weight:bold;}
-
-.friendtalk .service .kakao_use_guide{display: flex; margin: 50px 0; gap: 30px;}
-.friendtalk .service .kakao_use_guide li{position: relative; display:flex; width: calc((100% - 60px)/3); background-color: #fff; border-radius: 20px; padding: 0 0 30px 0; text-align: center; overflow: hidden;flex-direction: column;gap: 20px;}
-.friendtalk .service .kakao_use_guide .title{display:flex;width:100%;height:50px;font-size:19px;background:#002c9a;color:#fff;justify-content:center;align-items:center;letter-spacing:1px;}
-.friendtalk .service .kakao_use_guide .title span{font-weight:bold;font-size:22px;}
-.friendtalk .service .kakao_use_guide li i{display: block; width: 128px; height: 128px; margin: 10px auto 10px auto; background-color: #F3F6FB; border-radius: 100%; background-repeat: no-repeat; background-position: center;}
-.friendtalk .service .kakao_use_guide li.guide_01 i{background-image: url(/publish/images/content/icon_kakao_guide01.png);}
-.friendtalk .service .kakao_use_guide li.guide_02 i{background-image: url(/publish/images/content/icon_kakao_guide02.png);}
-.friendtalk .service .kakao_use_guide li.guide_03 i{background-image: url(/publish/images/content/icon_kakao_guide04.png);}
-.friendtalk .service .kakao_use_guide li .guide_title{font-family: 'GmarketSansBold'; font-size: 24px;}
-.friendtalk .service .kakao_use_guide li .guide_info{display: block; height: 120px;  font-size: 18px; font-weight: 300; color: #444; line-height: 1.3; padding: 0 20px;}
-
-.kakao_intro_cont .friendtalk .note b{font-weight:400;color:#e40000;}
+.kakao_intro_cont .brandMsg .note b{font-weight:400;color:#f43131;}
 
 
 /* api - 소개 */
@@ -2125,11 +1923,11 @@
 .api_guide_cont .api_process_guide li::after{position: absolute; content: " "; width: 33px; height: 33px; background-image: url(/publish/images/api_intro_cont/icon_api_next.png); right: -23px; top: 50%; transform: translateY(-50%); z-index: 1;}
 .api_guide_cont .api_process_guide li:last-child{margin: 0 0 0 0;}
 .api_guide_cont .api_process_guide li:last-child::after{display: none;}
-.api_guide_cont .api_process_guide .step_title {background:#fbc72b; font-size:18px; text-align: center; border-radius:10px 10px 0 0; padding:10px 0; box-shadow: 0 0 8px rgba(0,0,0,0.2);}
+.api_guide_cont .api_process_guide .step_title {background:var(--secondary-color);font-size:18px;color:#fff;text-align:center;border-radius:10px 10px 0 0;padding:10px 0;box-shadow:0 0 8px rgba(0,0,0,0.2);}
 .api_guide_cont .api_process_guide .step_title span {font-weight: bold; font-size: 24px;}
 .api_guide_cont .api_process_guide .step_con {height:250px; background:#fff;  border-radius:0 0 10px 10px; text-align: center; padding:25px 0 25px 0; box-shadow: 0 0 8px rgba(0,0,0,0.2);}
 .api_guide_cont .api_process_guide dl dt {font-family: 'GmarketSansBold'; font-size: 19px; text-align: center; margin:20px 0 6px 0;}
-.api_guide_cont .api_process_guide dl dd {font-family: 'Noto Sans KR', sans-serif; color:#555; font-size: 14px; font-weight: 400;  line-height: 1.2; padding:0 10px;}
+.api_guide_cont .api_process_guide dl dd {font-family: 'Pretendard'; color:#555; font-size: 14px; font-weight: 400;  line-height: 1.2; padding:0 10px;}
 
 /* api - 사용안내  */
 .api_guide {display: none;}
@@ -2147,7 +1945,7 @@
 .api_guide_cont .box .text table td {text-indent: 18px; font-weight: 200;}
 
 .api_guide_cont .code_view pre code.hljs{padding:0;background:transparent;overflow:unset;}
-.api_guide_cont .code_view .hljs-attr{color:#fbc72b;}
+.api_guide_cont .code_view .hljs-attr{color:var(--secondary-light-color);}
 .api_guide_cont .code_view .hljs-string,.api_guide_cont .code_view .hljs-punctuation,.api_guide_cont .code_view .hljs-tag{color:#fff;}
 
 .api_guide_cont .api_guide#tab5_1 .list_tab_wrap2.type3 li{width:calc(100%/5)}
@@ -2158,8 +1956,8 @@
 .api_guide_cont .re_cont .type_table table thead th:first-child {border-left:none;}
 .api_guide_cont .re_cont .type_table table td {border-bottom:1px solid #e5e5e5; text-align: center; padding:20px 0; border-right:1px solid #e5e5e5; font-weight: 300;}
 .api_guide_cont .re_cont .type_table table td .font_b {font-weight:400;}
-.api_guide_cont .re_cont .type_table table td .select_o {color:#002c9a; font-weight: 400;}
-.api_guide_cont .re_cont .type_table table td .select_x {color:#e40000; font-weight: 400;}
+.api_guide_cont .re_cont .type_table table td .select_o {color:var(--primary-color); font-weight: 400;}
+.api_guide_cont .re_cont .type_table table td .select_x {color:#f43131; font-weight: 400;}
 .api_guide_cont .re_cont .type_table table td:last-child {border-right: none;}
 .api_guide_cont .re_cont .type_table .table_info {font-size:15px; color:#555; font-weight: 300; margin:0 0 30px 0;}
 .api_guide_cont .re_cont .type_table .table_info p {padding:5px 0;}
@@ -2167,8 +1965,8 @@
 .api_guide_cont .re_cont .box .title {font-size:20px; color:#222; font-weight:bold; letter-spacing: -1px; text-indent: 28px;}
 .api_guide_cont .re_cont .box .title_t1 {text-indent: 28px;}
 .api_guide_cont .re_cont .box .title_t1 .ex {font-size:20px; color:#222; font-weight:bold; letter-spacing: -1px;}
-.api_guide_cont .re_cont .box .title_t1 .ex_success { font-size:15px; color:#002c9a; font-weight: 300; background: #fff; border:1px solid #002c9a; border-radius: 3px; padding:0 5px 2px 5px; margin:0 0 0 10px; }
-.api_guide_cont .re_cont .box .title_t1 .ex_fail { font-size:15px; color:#e40000; font-weight: 300; background: #fff; border:1px solid #e40000; border-radius: 3px; padding:0 5px 2px 5px; margin:0 0 0 10px; }
+.api_guide_cont .re_cont .box .title_t1 .ex_success { font-size:15px; color:var(--primary-color); font-weight: 300; background: #fff; border:1px solid var(--primary-color); border-radius: 3px; padding:0 5px 2px 5px; margin:0 0 0 10px; }
+.api_guide_cont .re_cont .box .title_t1 .ex_fail { font-size:15px; color:#f43131; font-weight: 300; background: #fff; border:1px solid #f43131; border-radius: 3px; padding:0 5px 2px 5px; margin:0 0 0 10px; }
 .api_guide_cont .re_cont .box .code_view .l_code {text-indent:18px; }
 .api_guide_cont .re_cont .box .code_view .l_code_t1 {text-indent:98px;}
 .api_guide_cont .re_cont .box .code_view .l_code_t2 {text-indent:63px;}
@@ -2177,7 +1975,7 @@
 .api_guide_cont .re_cont .box .code_view .indent .indent_t1 {text-indent:80px; }
 .api_guide_cont .re_cont .box .code_view .indent .indent_t1 .indent_t2 {text-indent:108px;}
 .api_guide_cont .re_cont .box .code_view .indent p {padding:8px 0;}
-.api_guide_cont .re_cont .box .code_view .indent p span {color:#fbc72b;}
+.api_guide_cont .re_cont .box .code_view .indent p span {color:var(--secondary-light-color);}
 .api_guide_cont .re_cont .res_title {background:url(/publish/images/api_intro_cont/icon_api_response.jpg) 0 5px no-repeat; padding:0 0 0 30px; font-size:26px; font-weight:bold; letter-spacing: -1px; margin:60px 0 -20px 0;}
 
 /* api - 예제 다운로드 */
@@ -2185,19 +1983,20 @@
 .download_cont.current {display: block;}
 .api_guide_cont .api_download .list_tab_wrap2.type2 {margin:30px 0;}
 .api_guide_cont .api_download .btn_area {text-align:center; padding:30px 0 50px 0; }
-.api_guide_cont .api_download .btnType.btnType11 {color:#fff; background:#002c9a; width:230px; height:50px; font-size:18px; font-weight:400; border-radius: 5px; padding:0 20px;}
+.api_guide_cont .api_download .btnType.btnType11 {color:#fff; background:var(--primary-color); width:230px; height:50px; font-size:18px; font-weight:400; border-radius: 5px; padding:0 20px;}
 
 /* api - 신청/관리 */
-.api_guide_cont .api_admin {margin:0 0 60px 0; }
+.api_guide_cont .api_admin {position:relative;margin:0 0 60px 0;}
 .api_guide_cont .api_admin .info{margin:0 0 30px 0;}
 .api_guide_cont .api_admin .admin_title {font-size:20px; font-weight:bold; letter-spacing: -1px; margin:0 0 10px 0;}
 .api_guide_cont .api_admin .tb_wrap_t1{ width: 100%; border: 1px solid #ccc; border-radius: 5px; margin-bottom: 10px; box-sizing: border-box; border-bottom: 0 none;}
 .api_guide_cont .api_admin .admin_info { font-size:14px; font-weight:300; color:#555; margin:0 0 5px 0;}
 .api_guide_cont .api_admin .input_box {background: #f2f2f2; border-radius:5px; padding:17px 17px 17px 30px; text-indent:20px; margin:15px 0 8px 0;}
-.api_guide_cont .api_admin .input_box .box_in {background: url(/publish/images/api_intro_cont/icon_api_input.png) 0 8px no-repeat; font-size:16px;}
-.api_guide_cont .api_admin .input_box input {border:1px solid #d5d5d5; border-radius:5px; width:400px; padding:2px 0 5px 10px;}
+.api_guide_cont .api_admin .input_box .box_in {position:relative;display:flex;background: url(/publish/images/api_intro_cont/icon_api_input.png) 0 center no-repeat; font-size:16px; align-items:center; gap:8px;}
+.api_guide_cont .api_admin .input_box input {height:33px; border:1px solid #d5d5d5; border-radius:5px; width:400px; padding:2px 0 5px 10px;}
 .api_guide_cont .api_admin .input_box input::placeholder {font-size:14px; color:#ababab;}
-.api_guide_cont .api_admin .btnType.btnType2 {float:right; padding:0 20px 0 20px; font-size:16px; letter-spacing: -1px;}
+.api_guide_cont .api_admin .btnType.btnType2 {position:absolute;padding:0 20px 0 20px; font-size:16px; letter-spacing: -1px;right:0;}
+.api_guide_cont .api_admin .tType4 button{height:28px;font-size:14px;font-weight:400;}
 
 /*선거 문자전송 > 문구추가*/
 .tType1 tbody tr .ele_te{font-size: 14px; padding: 15px 0;}
@@ -2213,7 +2012,7 @@
 .send_top .resultcont_left {max-width: 800px;flex-basis: 68%;}
 .send_top .resultcont_left .table_btn {margin:-5px 0 0 0;}
 .send_top .resultcont_left {max-width: 800px;flex-basis: 68%;}
-.send_top .resultcont_left .table_btn_left .excel_btn.btnType {color:#129738;}
+.send_top .resultcont_left .table_btn_left .excel_btn.btnType {color:#15983a;}
 .send_top .resultcont_left .table_btn_right_txt {padding:5px 0 0 0;font-size:14px; font-weight:500;}
 
 /* 발송결과 상세 */
@@ -2222,7 +2021,7 @@
 .res_info .res_info_in .res_info_top p:first-child {font-size: 22px; font-family: 'GmarketSansBold'; float: left; padding:10px 0 0 0;}
 .res_info .res_info_in .res_info_top p:last-child {font-size: 16px; font-weight: 300; float: right;}
 .res_info .res_info_in .res_info_top .btnType.btnType3 {width:76px; font-size:15px;}
-/*.res_info .res_info_in .res_info_top p:last-child span {font-size: 20px; font-weight: 600; font-family: 'GmarketSansBold'; color: #002c9a;}*/
+/*.res_info .res_info_in .res_info_top p:last-child span {font-size: 20px; font-weight: 600; font-family: 'GmarketSansBold'; color: var(--primary-color);}*/
 
 .res_info .res_info_in .res_info_btm {margin:20px 0 0 0;padding:10px;background:#fff;border-radius:5px;box-sizing:border-box;}
 .res_info .res_info_in .res_info_btm dl {display:flex;padding:8px 10px;font-size:16px;font-weight:300;justify-content:space-between; color:#222;}
@@ -2251,7 +2050,7 @@
 .send_top .resultcont_right .phone .text_length2 {padding: 12px 0;}
 .send_top .resultcont_right .phone .text_length2>span {float: left;line-height: 27px;}
 .send_top .resultcont_right .phone .text_length2>div {float: right;margin-top: 3px;}
-.send_top .resultcont_right .phone .text_length2>div span {color: #002c9a;font-size: 15px;padding-right: 2px;}
+.send_top .resultcont_right .phone .text_length2>div span {color: var(--primary-color);font-size: 15px;padding-right: 2px;}
 .send_top .resultcont_right .phone .text_length2>div button {width: 24px;height: 24px; border: 1px solid #ccc;border-radius: 3px;}
 .send_top .resultcont_right .phone .text_length2>div button:hover {border: 1px solid #a3a3a3;}
 .send_top .resultcont_right .phone .text_length2>div button img {margin-bottom: 2px;}
@@ -2265,7 +2064,7 @@
 .preview_auto p {word-break: break-all;}
 .preview_auto .none_txt {color: #999; font-weight: 300;}
 /* 핸드폰 안에 내용 길어져서 스크롤 생길 때 */
-.send_top .resultcont_right .phone .addText {color: #002c9a;text-align: center; font-size: 14px; padding-top: 2px; margin:0 0 10px 0;}
+.send_top .resultcont_right .phone .addText {color: var(--primary-color);text-align: center; font-size: 14px; padding-top: 2px; margin:0 0 10px 0;}
 
 /* 그림 문자 */
 .send_top .resultcont_right .phone .text_length2 .photo_msg_num {margin-left: 3px; float: left;}
@@ -2297,13 +2096,13 @@
 .send_top .resultcont_right .phone_kakako .phoneIn .text_preview .allimtalk_content button{margin: 0 0 8px 10px;}
 .send_top .resultcont_right .phone_kakako .phoneIn .text_preview .allimtalk_content button:last-child{margin-bottom: 0;}
 .send_top .resultcont_right .phone_kakako .phoneIn .text_preview .allimtalk_content .template_text+.btn_kakao_type{margin-top: 8px;}
-.send_top .resultcont_right .phone_kakako .phoneIn .text_preview .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ffea00;}
+.send_top .resultcont_right .phone_kakako .phoneIn .text_preview .allimtalk_content .btn_kakao_channel{display:flex;width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color:#FFEA00;justify-content:center;align-items:center;gap:8px;}
 .send_top .resultcont_right .phone_kakako .phoneIn .text_preview .allimtalk_content .btn_kakao_type{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ededed;}
 .send_top .resultcont_right .phone_kakako .phoneIn .template_info_wrap{display: flex; width: calc(85% + 13px); height: auto; padding: 6px 15px 6px 23px; justify-content: space-between; align-items: center; background-color: #fae100; margin: -5px 0 0 -3px; border-radius: 0 0 25px 25px;}
 .send_top .resultcont_right .phone_kakako .phoneIn .template_info_wrap .btn_template_choice{width: 120px; height: 36px; font-size: 16px; color: #fae100; background-color: #302218; border-radius: 5px;}
-.send_top .resultcont_right .phone_kakako .addText{color: #002c9a;text-align: center; font-size: 14px; padding-top: 2px; margin:10px 0 10px 0;}
+.send_top .resultcont_right .phone_kakako .addText{color: var(--primary-color);text-align: center; font-size: 14px; padding-top: 2px; margin:10px 0 10px 0;}
 
-.send_top .resultcont_right .phone_kakako.friendtalk .phoneIn .text_preview .allimtalk_content{border-radius:5px;}
+.send_top .resultcont_right .phone_kakako.friendtalk .phoneIn .text_preview .allimtalk_content{border-radius:5px;overflow:hidden;}
 .send_top .resultcont_right .phone_kakako.friendtalk .friend_talk_title{margin:0 0 10px 0;font-size:15px;color:#777;}
 .send_top .resultcont_right .phone_kakako.friendtalk .kakao_block_text{width:calc(100% - 20px);text-align:right;font-size:13px;color:#555;font-weight:300;margin:10px 0 0 0;}
 
@@ -2365,7 +2164,7 @@
 .privacy_content .conbox ul.conlist4 {margin:25px 0; border-top:1px solid #d5d5d5; border-bottom:1px solid #d5d5d5; width:410px; padding:10px 0;}
 .privacy_content .conbox ul.conlist4 li { position: relative; padding:0px 7px 3px 5px; line-height: 1.4; font-size:16px;font-weight: 300; }
 .privacy_content .conbox ul.conlist5 { margin:0 0 15px 0;}
-.privacy_content .conbox ul.conlist5 li {color:#002c9a; font-size:16px;font-weight: 400; padding:5px 0;}
+.privacy_content .conbox ul.conlist5 li {color:var(--primary-color); font-size:16px;font-weight: 400; padding:5px 0;}
 .privacy_content .conbox .contitle3 {font-size:16px; font-weight: 500;}
 .privacy_content_select_wrap {text-align: left;}
 .privacy_content_select_wrap .version_change_select{width: 278px; margin: 10px 0 20px 0;}
@@ -2417,8 +2216,8 @@
 .clause_new ol.conlist8 li::before {content:"";}
 
 /* 불법스팸방지정책_2024*/
-.spam_content .title .red{margin: 0 0 0 3px; font-size: 16px; color: #e40000; font-weight: 500; }
-.spam_content .spam_conbox .blue{color: #002c9a; font-weight: 400;}
+.spam_content .title .red{margin: 0 0 0 3px; font-size: 16px; color: #f43131; font-weight: 500; }
+.spam_content .spam_conbox .blue{color: var(--primary-color); font-weight: 400;}
 .spam_content .spam_conbox .bold{font-weight: 500;}
 .spam_content .spam_conbox .text{margin: 0 0 0 -8px;}
 .spam_content .spam_conbox .tri_te span{font-size: 14px;}
@@ -2427,7 +2226,7 @@
 /*.spam_content .spam_conbox.spam_table{padding: 0;}*/
 
 /*4번 수정후*/
-.spam_content .spam_conbox .spam_clause .tit{width: 200px; padding: 6px 0 7px 0; margin: 0 0 10px 9px; background-color: #002c9a; color: #ffffff; text-align: center; font-size: 15px; font-weight: 500; border-radius: 100px;}
+.spam_content .spam_conbox .spam_clause .tit{width: 200px; padding: 6px 0 7px 0; margin: 0 0 10px 9px; background-color: var(--primary-color); color: #ffffff; text-align: center; font-size: 15px; font-weight: 500; border-radius: 100px;}
 .spam_content .spam_conbox .spam_clause{padding: 22px 16px; margin: 20px 0 0 0; border: 1px solid #d5d5d5; border-radius: 5px;}
 .spam_content .spam_conbox .spam_clause .spam_clause_cen{margin: 12px 0;}
 .spam_content .spam_conbox .spam_clause ul li{padding: 0 7px 0 18px; font-size: 15px; line-height: 1.4;}
@@ -2511,7 +2310,7 @@
 .tb_wrap1 table.type4 th{position: sticky; top:0; z-index: 1; background-color:#ededed;}
 
 /*문자전송_안심번호 안내 추가*/
-.top_content .send_general .send_left .tType1 .btn_popup_wrap .info_guide{margin: -11px 0 0 0; text-align: left; line-height: 1.3; font-size: 14px; color: #e40000; font-weight: 400;}
+.top_content .send_general .send_left .tType1 .btn_popup_wrap .info_guide{margin: -11px 0 0 0; text-align: left; line-height: 1.3; font-size: 14px; color: #f43131; font-weight: 400;}
 .top_content .send_general .send_left .tType1 .btn_popup_wrap .info_guide:hover{text-decoration: underline;}
 .tType1 tbody tr td.putText textarea.phone_num{height: 84px;}
 
@@ -2615,7 +2414,7 @@
 		
 	/* 후불회원 요금사용내역*/
 	.hisroy_price .hisroy_defprice_in>p {font-size: 18px; margin-bottom: 25px;  font-family: 'GmarketSansBold';}
-	.hisroy_price .hisroy_defprice_in>div>p>span {font-size: 17px; font-family: 'GmarketSansBold'; color: #002c9a; padding-right: 1px;}
+	.hisroy_price .hisroy_defprice_in>div>p>span {font-size: 17px; font-family: 'GmarketSansBold'; color: var(--primary-color); padding-right: 1px;}
 	
 	/* 카카오톡 설정*/
 	.kakao_use_guide_cont .kakao_use_guide li .btn_wrap{margin: 30px 0 0 0;}
src/main/webapp/publish/css/estimate.css
--- src/main/webapp/publish/css/estimate.css
+++ src/main/webapp/publish/css/estimate.css
@@ -117,9 +117,9 @@
 
 
 /* 인쇄 미리보기 팝업(테이블) */
-.c_002c9a {color: #002c9a !important;}
+.c_002c9a {color: var(--primary-color) !important;}
 .c_e40000 {color: #e40000 !important;}
-.c_ffa200 {color: #ffa200 !important;}
+.c_ffa200 {color: var(--secondary-color) !important;}
 .c_000 {color: #000 !important;}
 
 .tablePrint_wrap {width: 950px; padding: 50px 30px; margin: 0 auto; position: relative; color: #222; letter-spacing: -0.5px; box-sizing: border-box;} 
src/main/webapp/publish/css/font.css
--- src/main/webapp/publish/css/font.css
+++ src/main/webapp/publish/css/font.css
@@ -1,3 +1,118 @@
+/* ================================
+     Pretendard
+     ================================ */
+
+/* Thin (100) */
+
+
+/* ExtraLight (200) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 200;
+    font-style: normal;
+    src: url('/publish/font/Pretendard-ExtraLight.woff2') format('woff2'),
+         url('/publish/font/Pretendard-ExtraLight.woff') format('woff'),
+         url('/publish/font/Pretendard-ExtraLight.ttf') format('truetype'),
+         url('/publish/font/Pretendard-ExtraLight.otf') format('opentype');
+}
+
+/* Light (300) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 300;
+    font-style: normal;
+    src: url('/publish/font/Pretendard-Light.woff2') format('woff2'),
+         url('/publish/font/Pretendard-Light.woff') format('woff'),
+         url('/publish/font/Pretendard-Light.ttf') format('truetype'),
+         url('/publish/font/Pretendard-Light.otf') format('opentype');
+}
+
+/* Regular (400) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 400;
+    font-style: normal;
+    src: url('/publish/font/Pretendard-Regular.woff2') format('woff2'),
+         url('/publish/font/Pretendard-Regular.woff') format('woff'),
+         url('/publish/font/Pretendard-Regular.ttf') format('truetype'),
+         url('/publish/font/Pretendard-Regular.otf') format('opentype');
+}
+
+/* Medium (500) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 500;
+    font-style: normal;
+    src: url('/publish/font/Pretendard-Medium.woff2') format('woff2'),
+         url('/publish/font/Pretendard-Medium.woff') format('woff'),
+         url('/publish/font/Pretendard-Medium.ttf') format('truetype'),
+         url('/publish/font/Pretendard-Medium.otf') format('opentype');
+}
+
+/* SemiBold (600) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 600;
+    font-style: normal;
+    src: url('/publish/font/Pretendard-SemiBold.woff2') format('woff2'),
+         url('/publish/font/Pretendard-SemiBold.woff') format('woff'),
+         url('/publish/font/Pretendard-SemiBold.ttf') format('truetype'),
+         url('/publish/font/Pretendard-SemiBold.otf') format('opentype');
+}
+
+/* Bold (700) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 700;
+    font-style: normal;
+    src: url('/publish/font/Pretendard-Bold.woff2') format('woff2'),
+         url('/publish/font/Pretendard-Bold.woff') format('woff'),
+         url('/publish/font/Pretendard-Bold.ttf') format('truetype'),
+         url('/publish/font/Pretendard-Bold.otf') format('opentype');
+}
+
+
+
+
+
+/* ================================
+    Gmarket Sans TTF
+    ================================ */
+
+@font-face {
+    font-family: 'Gmarket Sans TTF';
+    font-weight: 300;
+    font-style: normal;
+    src: url('/publish/font/GmarketSansTTFLight.woff2') format('woff2'),
+         url('/publish/font/GmarketSansTTFLight.woff') format('woff'),
+         url('/publish/font/GmarketSansTTFLight.ttf') format('truetype'),
+         url('/publish/font/GmarketSansTTFLight.eot?#iefix') format('embedded-opentype');
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Gmarket Sans TTF';
+    font-weight: 500;
+    font-style: normal;
+    src: url('/publish/font/GmarketSansTTFMedium.woff2') format('woff2'),
+         url('/publish/font/GmarketSansTTFMedium.woff') format('woff'),
+         url('/publish/font/GmarketSansTTFMedium.ttf') format('truetype'),
+         url('/publish/font/GmarketSansTTFMedium.eot?#iefix') format('embedded-opentype');
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Gmarket Sans TTF';
+    font-weight: 700;
+    font-style: normal;
+    src: url('/publish/font/GmarketSansTTFBold.woff2') format('woff2'),
+         url('/publish/font/GmarketSansTTFBold.woff') format('woff'),
+         url('/publish/font/GmarketSansTTFBold.ttf') format('truetype'),
+         url('/publish/font/GmarketSansTTFBold.eot?#iefix') format('embedded-opentype');
+    font-display: swap;
+}
+
+
 /* 티몬 몬소리체 */
 @font-face {
     font-family: 'TmonMonsori';
@@ -6,6 +121,13 @@
     font-style: normal;
 } 
 
+@font-face {
+    font-family: 'GMarketSansLight';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansLight.woff') format('woff');
+    font-weight: 300;
+    font-display: swap;
+}
+
 /* 지마켓 산스체 */
 @font-face {
     font-family: 'GmarketSansBold';
src/main/webapp/publish/css/jquery.mCustomScrollbar.css
--- src/main/webapp/publish/css/jquery.mCustomScrollbar.css
+++ src/main/webapp/publish/css/jquery.mCustomScrollbar.css
@@ -429,7 +429,7 @@
 .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); }
 
 .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
-.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #002c9a; }
+.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: var(--primary-color); }
 
 .mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
 
src/main/webapp/publish/css/main.css
--- src/main/webapp/publish/css/main.css
+++ src/main/webapp/publish/css/main.css
@@ -1,8 +1,12 @@
-/* 메인 비주얼 영역 */
+.main{margin:0 0 80px 0;}
+
+/* =============================================
+   메인비주얼
+============================================= */
 .visual {min-width: 1240px;position: relative;}
 .visual {max-width: 100%; position: relative;}
 .visual .swiper-slide {z-index: -1 !important;}
-.visual .slideImg {height: 455px;min-width: 1400px;}
+.visual .slideImg {height: 455px;min-width: 1240px;}
 .visual .slideImg img {position:relative;left:50%;transform:translateX(-50%);}
 .visual .swiper-button-prev,.visual  .swiper-button-next {position: absolute;top: 50%;transform: translateY(-50%);background-position:center; width: 50px;height: 50px;margin:0;border-radius: 8px; background-color: rgba(0,0,0,0.5);background-repeat: no-repeat;background-size:15px 26px;}
 .visual .swiper-button-prev {left: 50px;background-image: url(/publish/images/main/visual_prev.png);}
@@ -10,222 +14,152 @@
 .visual .slide_button{position: absolute;left:50%;bottom:15%;margin:0 0 0 -680px;text-align:center;}
 .visual .slide_button .swiper-pagination{position:relative;display:inline-block;margin: 0 auto;white-space:nowrap;}
 .visual .slide_button .swiper-pagination .swiper-pagination-bullet{display: inline-block;margin-right:10px;position: relative;vertical-align: middle;width: 12px;height: 12px;background-color: rgba(0,0,0,0.5);border-radius: 100%;opacity:1;}
-.visual .slide_button .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 33px;height: 7px; background-color: #eea301;border-radius: 3.5px;vertical-align: middle;}
+.visual .slide_button .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{width: 33px;height: 7px; background-color: var(--secondary-color);border-radius: 3.5px;vertical-align: middle;}
 .visual .slide_button .slidePause {position:relative;display:inline-block;background-image: url(/publish/images/main/visualStop.png);background-repeat: no-repeat;width: 12px;height: 14px;z-index:1;}
 .visual .slide_button .slidePause.active {background-image:url(/publish/images/main/visualStart.png);}
-/*// visual 영역 */
-
-/* content1 */
-.banner_w {position:relative;max-width: 1400px;min-width: 1200px;margin: -40px auto 0 auto;z-index:1;}
-.banner_w .swiper2 .swiper-wrapper .swiper-slide {position:relative;}
-.banner_w .swiper2 .swiper-wrapper .swiper-slide img {width:90%;}
-.banner_w .swiper2 .swiper-button-next {width: 10px;height: 18px;background-image:none;position:absolute;top:266px;right:42%; z-index: 1;}
-.banner_w .swiper2 .swiper-button-prev {width: 10px;height: 18px;background-image:none;position:absolute;top:266px;left:42%; z-index: 1;}
-.banner_w .swiper2 .swiper-pagination {position:absolute;left:50%;bottom:-1px;width:auto;transform:translateX(-50%);z-index:1;}
-.banner_w .swiper2 .swiper-pagination .swiper-pagination-bullet {width:9px;height:9px;background-color: #c8c8c8;opacity:1;margin:0 5px;vertical-align:top;}
-.banner_w .swiper2 .swiper-pagination .swiper-pagination-bullet-active {background-color: #23428b;}
-
-.sw_wrap {position:relative;overflow: hidden;width:100%;height: 265px;border-radius: 15px;transition: 0.5s ease;}
-.sw_wrap::after{position: absolute; content: " ";width:97%;height: 190px; box-shadow: 0 0 10px 4px rgba(0,0,0,0.15);background-color: #fff; z-index: 0; top: 20px; left: 50%; transform: translateX(-50%); border-radius: 15px;}
-.swiper2  {overflow: hidden; height: 265px;width:97%;margin:0 auto;position: relative;} 
-.swiper2 .swiper-slide{width:100%;height: 240px; border-radius: 15px; position: relative; z-index: 1; margin: 0px auto 25px auto;}
-.swiper2 .contWrap {display: table !important; position: relative; margin-top: 20px;width:100%;}
-.swiper2 .contWrap::after{content: ""; transition: all 0.2s ease-in-out; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
-.swiper2 .swiper-slide-next .contWrap,
-.swiper2 .swiper-slide.on .contWrap.on {position: relative; z-index: 1; cursor: pointer; transition: all 0.2s ease-in-out; opacity: 1; background-image: none !important;border-radius:15px;}
-.swiper2 .swiper-slide .contWrap{background: url(../images/main/cont1_shadow.png) 0 0 no-repeat;background-size: 49px 190px;}
-.swiper2 .swiper-slide.swiper-slide-active .contWrap{background: none;}
-.swiper2 .contWrap .slide_cont {padding: 0 30px 0 40px; height: 190px;}
-.swiper2 .contWrap .slide_cont .cont1_title {font-size: 22px;font-weight: 700;}
-.swiper2 .contWrap .slide_cont .cont1_ex {color: #555;font-weight: 400; line-height: 1.4;height: 42px; padding: 13px 0 30px 0;font-size:16px;letter-spacing:-0.5px;}
-.swiper2 .contWrap .slide_cont::after {position: absolute;content: "";background-color: #e1e1e5;border-radius: 50%;top: 50%;right: 30px; transform: translateY(-50%);width: 70px;height: 70px;}
-.swiper2 .contWrap.ct1 .slide_cont::after {background:url('../images/main/cont1_1.png') #e1e1e5 center no-repeat;}
-.swiper2 .contWrap.ct2 .slide_cont::after {background:url('../images/main/cont1_2.png') #e1e1e5 18px center no-repeat;}
-.swiper2 .contWrap.ct3 .slide_cont::after {background:url('../images/main/cont1_3.png') #e1e1e5 15px center no-repeat;}
-.swiper2 .contWrap.ct4 .slide_cont::after {background:url('../images/main/cont1_4.png') #e1e1e5 20px center no-repeat;}
-.swiper2 .contWrap.ct4 .slide_cont {cursor:default;}
-.swiper2 .contWrap.ct4 .slide_cont .cont1_title {margin-top:-51px;}
-.swiper2 .contWrap.ct4 .slide_cont .cont1_ex {padding-bottom:10px;}
-.swiper2 .contWrap.ct5 .slide_cont::after {background:url('../images/main/cont1_5.png') #e1e1e5 center center no-repeat;}
-.swiper2 .contWrap.ct6 .slide_cont::after {background:url('../images/main/cont1_6.png') #e1e1e5 center center no-repeat;}
-.swiper2 .contWrap.ct7 .slide_cont::after {background:url('../images/main/cont1_7.png') #e1e1e5 center center no-repeat;}
-.swiper2 .contWrap.ct8 .slide_cont::after {background:url('../images/main/cont1_8.png') #e1e1e5 center center no-repeat;}
-.swiper2 .contWrap.ct9 .slide_cont::after {background:url('../images/main/cont1_9.png') #e1e1e5 center no-repeat;}
-.swiper2 .contWrap .slide_cont .more {width: 115px;height: 30px; padding-right:15px;border: 1px solid #d9d9d9; border-radius: 14px; text-align: center; color: #555;background-image: url(../images/main/cont1_arrow.png);background-position: 86% center;background-repeat: no-repeat;line-height: 29px;}
-
-.swiper2 .contWrap .slide_cont .more {margin:5px 0 0 0; width: 115px;height: 30px; padding-right:15px;border: 1px solid #d9d9d9; border-radius: 14px; text-align: center; color: #555;background-image: url(../images/main/cont1_arrow.png);background-position: 86% center;background-repeat: no-repeat;line-height: 29px;}
-.swiper2 .contWrap .slide_cont1 {padding: 0 30px 0 36px; height: 190px; }
-.swiper2 .contWrap .slide_cont1 .cont1_title {font-size: 22px;font-weight: 700; padding:25px 0 0 0;}
-.swiper2 .contWrap .slide_cont1 .cont_ex {display:flex; justify-content: space-between;}
-.swiper2 .contWrap .slide_cont1 .cont_ex .txt {padding:13px 0 0 0; line-height: 1.4; width:70%; color:#555; font-size: 16px; letter-spacing: -1px; word-wrap:break-word;}
-.swiper2 .contWrap .slide_cont1 .cont_ex .bg_icon {position:relative; background-color: #e1e1e5; border-radius: 50%; top:50px; right:0; transform: translateY(-50%); width: 70px; height: 70px; display:flex; justify-content: center; align-items: center; } 
-.swiper2 .contWrap .slide_cont1 .cont_ex .bg_icon img {width: auto; height: auto; max-width: 70px; max-height: 70px;}
-.swiper2 .contWrap .slide_cont1 .more {margin:5px 0 0 0; width: 115px;height: 30px; padding-right:15px;border: 1px solid #d9d9d9; border-radius: 14px; text-align: center; color: #555;background-image: url(../images/main/cont1_arrow.png);background-position: 86% center;background-repeat: no-repeat;line-height: 29px;}
 
 
-   /* on클래스 */
-.swiper2 .swiper-slide-next .contWrap::after,
-.swiper2 .swiper-slide.on .contWrap.on::after {background-color: #ffcc33;width: 100%;height:110%;z-index: -1;cursor: pointer;transition: all 0.2s ease-in-out;box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);border-radius: 15px;}
-.swiper2 .swiper-slide-next .contWrap .slide_cont .cont1_ex,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont .cont1_ex {color: #222;}
-.swiper2 .swiper-slide-next .contWrap .slide_cont .more,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont .more {background-color: #eea301;color: #fff;border: 1px solid #eea301;background-image: url(../images/main/cont1_arrow_white.png);}
-.swiper2 .swiper-slide-next .contWrap .slide_cont::after,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont::after {background-color: #edb818;}
-.swiper2 .swiper-slide-next .contWrap.active:after {display:none;}
+/* =============================================
+   배너
+============================================= */
+.banner_slide {position:relative;max-width: 1400px;min-width: 1240px;margin:0 auto;padding:40px 0 0 0;z-index:1;}
+.banner_slide .swiper2,.banner_slide .swiper-wrapper{height:100%;}
+.banner_slide .swiper-slide{display:flex;align-items:center;justify-content:center;box-sizing:border-box;}
+.banner_slide .swiper-slide.swiper-slide-next+.swiper-slide+.swiper-slide a{border-right:0;}
+.banner_slide .swiper-slide-prev{border-right:0;}
 
-.swiper2 .swiper-slide-next .contWrap .slide_cont1 .more,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont1 .more {background-color: #eea301;color: #fff;border: 1px solid #eea301;background-image: url(../images/main/cont1_arrow_white.png);}
-.swiper2 .swiper-slide-next .contWrap .slide_cont1::after,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont1::after {background-color: #edb818;}
-.swiper2 .swiper-slide-next .contWrap .slide_cont1 .cont_ex .bg_icon,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont1 .cont_ex .bg_icon {background-color: #edb818;}
-.swiper2 .swiper-slide-next .contWrap .slide_cont1 .cont_ex .txt,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont1 .cont_ex .txt {color: #222;}
-.swiper2 .swiper-slide-next .contWrap .slide_cont1::after,
-.swiper2 .swiper-slide.on .contWrap.on .slide_cont1::after {background-color: #edb818;}
+.banner_slide .slide_btns{display:flex;height:21px;margin:30px 0 0 0;justify-content:center;align-items:center;gap:20px;}
+.banner_slide .swiper-button-next,
+.banner_slide .swiper-button-prev{position:relative;width:10px;height:18px;background:none;top:auto;left:auto;right:auto;margin:0;}
+.banner_slide .swiper-pagination{position:relative;}
+.banner_slide .swiper-pagination .swiper-pagination-bullet {width:12px;height:12px;background-color: #d5d5d5;opacity:1;margin:0 5px;vertical-align:top;}
+.banner_slide .swiper-pagination .swiper-pagination-bullet-active {background-color:var(--secondary-color);}
 
-/*// content1 */
+.banner_wrap {position:relative;width:100%;height:195px;background:#fff;border:1px solid var(--primary-color);border-radius:15px;overflow:hidden;transition:0.5s ease;}
+.banner_wrap a{display:flex;width:100%;height:100%;border-right:1px solid var(--primary-color);flex-direction:column;gap:15px;align-items:center;justify-content:center;transition:background 0.3s;}
+.banner_wrap a:hover{background:#f4fbff;}
+.banner_wrap .title{font-size:23px;font-weight:bold;color:#222;}
+.banner_wrap .summary{font-size:16px;font-weight:400;color:#555;}
 
+.main .contents_title{display:flex;align-items:center;justify-content:center;}
+.main .contents_title .title{font-family:'GmarketSansBold';font-size:33px;color:#222;}
+.main_cont3 .contents_title{justify-content:flex-start;margin:0 0 20px 0;}
+.main_cont3 .contents_title .title{font-size:27px;}
+.main_cont3 .contents_title.between{justify-content:space-between;align-items:center;}
+.main_cont3 .plus_btn{width:23px;height:23px;background:url(/publish/images/plus.png) no-repeat center;transition:transform 0.5s ease-in-out;}
+.main_cont3 .plus_btn:hover{background:url(/publish/images/plus2.png) no-repeat center;transform: rotate(180deg);}
 
-/* content2 문자샘플 */
-.main_cont2{margin: -240px auto 0 auto; padding: 305px 150px 80px 150px; text-align: center; background-color: #ecedef; min-width: 1240px; box-sizing: border-box;}
+/* =============================================
+   이달의 인기문자
+============================================= */
+.main_cont2{min-width:1240px;margin:80px auto;text-align:center;background:#fff;box-sizing:border-box;}
 .main_cont2 .inner{min-width: 0;}
 .main_cont2 .inner>p.tit_text{font-size: 34px; font-weight: 700;}
 .main_cont2 .inner>p.sub_text{font-size: 14px; font-weight: 400; margin: 20px auto 0 auto; width: 60%; color: #777; line-height: 1.4;} 
-/* 탭 */
-.main_cont2 .tabs{text-align: center;position: relative;margin-top: 30px;}
-.main_cont2 .tab_depth1{position: absolute; display: flex;height: 33px; color: #555; font-size: 16px; border: 1px solid #bcbdc1; box-shadow: inset 2px 2px 4px rgba(0, 0, 0, 0.2); border-radius: 5px; overflow: visible; margin-top: 9px;  background-color: #ecedef;}
-.main_cont2 .tab_depth1 a{width: 50px;line-height: 33px;border-right: 1px solid #bcbdc1;}
-.main_cont2 .tab_depth1 a:first-child{border-radius: 5px 0 0 5px;}
-.main_cont2 .tab_depth1 a:last-child{border-right: 0;border-radius: 0 5px 5px 0;}
-.main_cont2 .tab_depth1 a.on {height:33px;border-color:#002c9a;}
-.main_cont2 .tab_depth1 .on_active{position: absolute; width: 51px; height: 33px;background-color: #fff;border: 1px solid #002c9a;left: 0; top: -1px; font-size: 16px; font-weight: 500; transition: left 0.3s ease-in-out; color: #002c9a; line-height: 32px; border-radius: 5px 0 0 5px;}
-/* .tab_depth1 a.on{border: 1px solid #002c9a; background-color: #fff;line-height: 30px;font-weight: 500; color:#002c9a; height: 33px;margin-top: -1px;margin-left: -1px;} */
-.tab_depth2{display: flex; width: 80%;justify-content: center; margin: 0 auto 16px auto}
-.tab_depth2 a{position: relative; color: #555;font-size: 19px;height: 55px;line-height: 52px; box-sizing: border-box; border: 3px solid transparent; flex-basis: calc(65% / 4); transition: all 0.2s ease-in-out;}
-.tab_depth2 a::after{position: absolute; content: " "; width: 1px; height: 15px; background-color: #b0b4b9; right: 0; top: 36%;}
-.tab_depth2 a:last-child:after{display: none;}
-.tab_depth2 a.on{background-color: #fff;border: 3px solid #002c9a;border-radius: 100px; color: #002c90; font-weight: 600; box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.3); height: 53px; line-height: 46px; transition: all 0.2s ease-in-out;}
+
+.main_cont2 .tabs{position:relative;text-align: center;position: relative;margin-top: 30px;}
+.tab_depth2{display:flex;width:80%;justify-content:center;margin:0 auto 16px auto;gap:20px;}
+.tab_depth2 a{display:flex;height:50px;padding:0 25px;font-size:17px;font-weight:500;color:#555;background:#fff;border:1px solid #d5d5d5;border-radius:50px; justify-content:center;align-items:center;transition:all 0.3s;}
+.tab_depth2 a.on{background:var(--primary-color);border:1px solid var(--primary-color);color:#fff;box-shadow:0 0 8px rgba(0,0,0,0.25);}
 .tab_depth2 a.tab_next::after,.tab_depth2 a.tab_prev::after{display: none;}
 .tab_depth2 a.on::after{display: none;}
-.tab_depth3{width: 100%; display: flex; flex-wrap: wrap; justify-content: center; background-color: #e1e2e5;font-size: 16px; color: #666;font-weight: 400;padding: 20px 40px; border-radius: 10px;margin-bottom: 50px; box-sizing: border-box;line-height:2;}
-.tab_depth3 a{padding: 0 13px;position: relative;}
-.tab_depth3 a:hover{color: #002c9a;text-decoration: underline;}
-.tab_depth3 a.on{color: #002c9a; font-weight: 600;}
-.tab_depth3 a.on::before{position: absolute; content: " "; width: calc(100% - 25px); height: 5px; background-color: #003ed9; opacity: 0.2; bottom: 7px; left: 12px;}
-.tab_depth3 a::after{position: absolute; content: " "; width: 4px; height: 4px; background-color: #c3c4c5; border-radius: 10px; top: 15px;right: -1px;}
-.tab_depth3 a:last-child::after{display: none;}
-/* 탭 콘텐츠 */
-.tab_contwrap{position: relative;margin-bottom: 50px; }
-.tab_contwrap .btn_prev,.tab_contwrap .btn_next{width: 50px;height: 50px; border-radius: 8px; background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,0.3);position: absolute;z-index:1;}
-.tab_contwrap .btn_prev{left: -70px;top: 40%;}
-.tab_contwrap .btn_next{right: -70px;top: 40%;}
-.main_cont2 button.btn_more{font-size: 18px;height: 49px; padding:0 35px 0 24px; background-color: #fff; border: 1px solid #d5d5d5; border-radius: 30px; color: #666; background-image: url(/publish/images/main/btn_more02.png); background-repeat: no-repeat; background-position: 90% center;line-height: 0.1;position: relative;}
-.main_cont2 button.btn_more img{margin-top: -4px; margin-left: 10px;}
-.main_cont2 button.btn_more:hover{color: #002c9a; border: 1px solid #002c9a; background-image: url(/publish/images/main/btn_more03.png);box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.2);}
-.tab_con{justify-content: space-between; width: 99.8%; height: 0; overflow: hidden;}
-.tab_con.active{display: block; height: 100%; overflow: visible; border-bottom: 1px solid #d5d5d5;}
+
+.btn_custom{position:absolute;width:143px;height:42px;font-size:17px;font-weight:500;border-radius:3px;background:var(--primary-dark-color);color:#fff;right:0;top:50%;transform:translateY(-50%);}
+
+/* 인기문자 탭 */
+.tab_contwrap{position:relative;}
+.tab_contwrap .btn_prev,.tab_contwrap .btn_next{position:absolute;width:56px;height:56px;border-radius:100%;background-color:#f2f2f2;top: 40%;z-index:1;}
+.tab_contwrap .btn_prev{left:-70px;}
+.tab_contwrap .btn_next{right:-70px;}
+.main_cont2 .btn_more{display:flex;height:45px;font-size:18px;font-weight:500;color:#222;margin:30px auto 0;padding:0 25px;background:#f2f2f2;border-radius:3px;justify-content:center;align-items:center;gap:15px;}
+.main_cont2 .btn_more .more{display:inline-block;width:8px;height:14px;background:url(/publish/images/main/btn_more02.png) no-repeat center;}
+
+.tab_con{margin:25px auto 0;overflow:hidden;}
+.tab_con .swiper-slide{box-sizing:border-box;cursor:pointer;}
+
 /* 포토문자 */
-.tab_con.msg_photo_wrap{overflow:hidden;margin: 0 auto;}
-.msg_photo .swiper-slide{padding: 0 10px; box-sizing: border-box;cursor:pointer;}
-.msg_photo .swiper-slide .slide_area{width: calc(100% - 10px) !important; background-color: #f5f5f5; position: relative;height: 420px; border: 5px solid #f5f5f5; border-radius: 16px;box-shadow: 0 0 15px rgba(0,0,0,0.15); margin-bottom: 53px; margin-top: 13px;}
-.msg_photo .swiper-slide .slide_area:hover::after{position: absolute; content: " "; width: calc(100% + 10px); height: 5px; background-color: #002c9a; left: -5px; bottom: -14%;}
-.msg_photo .swiper-slide .slide_area .mask{display:block;position: absolute; width: calc(100% + 10px); height: calc(100% + 10px);background-color: rgba(43, 48, 71,0);left: -5px;top: -5px; border-radius: 16px; transition: background-color 0.2s ease-in-out;}
-.msg_photo .swiper-slide .slide_area .btn_more{display: none;}
-.msg_photo .swiper-slide .slide_area .btn_more img{display: inline-block;}
-.msg_photo .swiper-slide .slide_area:hover .mask{background-color: rgba(43, 48, 71,0.5); transition: background-color 0.2s ease-in-out;opacity:1;filter:opacity(100);}
-.msg_photo .swiper-slide .slide_area:hover div.btn_more{display: block; width: 54px; height: 54px; background-color: rgba(0,0,0,0.4); border-radius: 100%; line-height: 48px; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
-.msg_photo .area_img{display:flex;height:365px; border-radius: 16px 16px 0 0; overflow: hidden;align-items:center;}
-.msg_photo .area_img img{width: 100%; height: auto;}
-.msg_photo .area_img_text{font-size: 17px;padding: 18px 10px 0 10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.msg_photo .swiper-slide .slide_area{position: relative;min-width:260px;height:420px;background-color:#f8f8f8;border:1px solid #d5d5d5;border-radius:10px;}
+.msg_photo .swiper-slide .slide_area .mask{position:absolute;display:block;width:100%;height:100%;background-color:rgba(0,0,0,0);border-radius:10px;transition:background-color 0.3s ease-in-out;left:0;top:0;}
+.msg_photo .swiper-slide .slide_area .btn_more{position:absolute;display:flex;width:50px;height:50px;padding:0;background:var(--secondary-color);border-radius:100%;justify-content:center;align-items:center;opacity:0;left:50%;top:50%;transform:translate(-50%,-50%);}
+.msg_photo .swiper-slide .slide_area .btn_more .more{display:inline-block;width:24px;height:24px;background:url(/publish/images/main/btn_more01.png) no-repeat center;}
+.msg_photo .area_img{display:flex;height:365px;border-radius:10px 10px 0 0;overflow:hidden;align-items:center;}
+.msg_photo .area_img img{width: 100%;height:auto;}
+.msg_photo .area_img_text{display:flex;height:50px;border-top:1px solid #d5d5d5;font-size:17px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;justify-content:center;}
 .msg_photo .area_img_text .sub_text{display: block; font-size: 14px; color: #777; margin: 5px auto;}
+
+.msg_photo .swiper-slide .slide_area:hover .mask{background-color:rgba(0,0,0,.3);transition: background-color 0.3s ease-in-out;left:0;top:0;}
+.msg_photo .swiper-slide .slide_area:hover div.btn_more{opacity:1;}
+
 .msg_photo_wrap .swiper-button-prev {margin:0;background-image:url(/publish/images/main/btn_prev.png);background-size:12px 21px;}
 .msg_photo_wrap .swiper-button-next {margin:0;background-image:url(/publish/images/main/btn_next.png);background-size:12px 21px;}
+
 /* 단문문자&장문문자 */
-.tab_con.msg_text{overflow:hidden;margin: 0 auto;}
-.msg_text .swiper-slide{padding: 0 10px;cursor:pointer;box-sizing:border-box;}
-.msg_text .swiper-wrapper{height: 442px}
-.msg_text .swiper-slide .slide_area{position: relative;border-radius: 16px; background-image: url(/publish/images/main/msg_text_bg01.png); background-size: 100% 100%; background-repeat: no-repeat; height: 387px; transition: all 0.2s ease-in-out; box-sizing: border-box; margin-top: 13px;}
-.msg_text .swiper-slide .slide_area::before{position: absolute; content: " "; width: 100%; height: 100%; box-shadow: 0 0 15px rgba(0,0,0,0.15); left: 0; top: 0; border-radius: 16px;}
-.msg_text .swiper-slide .slide_area:hover::before{width: calc(100% - 3px); height: calc(100% - 3px); border: 3px solid #000;}
-.msg_text .swiper-slide .slide_area:hover::after{position: absolute; content: " "; width: calc(100% + 10px); height: 5px; background-color: #002c9a; left: -5px; bottom: -42px;}
-.msg_text .swiper-slide .slide_area .slide_content{width:100%;padding: 34px 0 62px 0; display: inline-block;}
-.msg_text .swiper-slide .slide_area .area_tit_text{height: 33px; line-height: 33px; background-color: #f5f5f5; border: 1px solid #e0e0e0; margin: 0 auto; color: #333; font-size: 17px; font-weight: 400; transition: all 0.2s ease-in-out; box-sizing: border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%;padding:0 10px;text-align:center;}
-.msg_text .swiper-slide .slide_area:hover .area_tit_text{background-color: #747b8e; border: 1px solid #747b8e; color: #fff; font-weight: 500; width: 100%;}
-.msg_text .swiper-slide .slide_area .area_in_text{width: 95%; height: 279px; margin: 0 auto; padding: 20px 0; background-image: url(/publish/images/main/msg_text_bg02.png); background-repeat: no-repeat; background-position: 15px 20px; box-sizing: border-box;}
-.msg_text .swiper-slide .slide_area:hover .area_in_text{background-image: url(/publish/images/main/msg_text_bg03.png);}
-.msg_text .swiper-slide .slide_area .area_in_text p{width: 85.5%; height: 238px; margin: 0 auto; text-align: left; line-height: 1.3; font-size: 15px; letter-spacing: -0.25px; padding: 10px; overflow-y: auto; box-sizing: border-box;position:relative;z-index:1;}
+.msg_text .swiper-slide .slide_area{position:relative;min-width:260px;height:384px;padding:20px 15px;background:#fff;border:1px solid #d5d5d5;border-radius:10px;box-sizing:border-box;transition:all .3s ease-in-out;}
+.msg_text .swiper-slide .slide_area .slide_content{width:100%;height:100%;}
+.msg_text .swiper-slide .slide_area .area_tit_text{position:relative;height:45px;padding:20px 0 0 0;font-size:18px;font-weight:500;line-height:1.5;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
+.msg_text .swiper-slide .slide_area .area_tit_text::before{position:absolute;content:"";width:30px;height:7px;border-radius:10px;background:#d5d5d5;top:0;left:50%;transform:translateX(-50%);transition:all .3s ease-in-out;}
+.msg_text .swiper-slide .slide_area .area_in_text{width:100%;max-height:285px;height:100%;background:#f8f8f8;border-radius:5px;margin:18px auto 0;padding:15px 20px;box-sizing:border-box;overflow-y:auto;transition:all .3s ease-in-out;}
+.msg_text .swiper-slide .slide_area .area_in_text p{font-size:17px;font-weight:400;line-height:1.4;color:#555;text-align:left;}
+
+.msg_text .swiper-slide .slide_area:hover{border:1px solid var(--primary-color);box-shadow:0 0 10px rgba(0,0,0,.2);}
+.msg_text .swiper-slide .slide_area:hover .area_tit_text::before{background:var(--primary-color);}
+.msg_text .swiper-slide .slide_area:hover .area_in_text{background:#f4fbff;}
+
+
 .msg_text_wrap .swiper-button-prev {margin:0;background-image:url(/publish/images/main/btn_prev.png);background-size:12px 21px;}
 .msg_text_wrap .swiper-button-next {margin:0;background-image:url(/publish/images/main/btn_next.png);background-size:12px 21px;}
-/* //content2 문자샘플 */
 
-/* content3 서비스 및 공지사항 영역 */
-.main_cont3 {min-width: 1200px;}
-.main_cont3 .inner{display: flex;justify-content: space-between;padding: 80px 0; box-sizing: border-box}
-.main_cont3 .inner>div {width: 100%;max-width: 440px; /*height: 343px;*/ flex-basis: calc(100%/3 - 26px);}
-.main_cont3 .title {margin-bottom: 20px; font-size: 26px;font-weight: 600;display: inline-block;}
-.main_cont3 .plus_btn { float: right; transition: transform 0.5s ease-in-out;background-image: url(/publish/images/plus.png);background-repeat: no-repeat; width:23px;height: 23px;}
-.main_cont3 .plus_btn:hover {transform: rotate(180deg);transition: transform 0.5s ease-in-out;background-image: url(/publish/images/plus2.png);}
+/* =============================================
+   content03
+============================================= */
+
+.main_cont3 .inner{display:flex;gap:40px;}
+.main_cont3 .inner>div{min-width:0;flex:1;}
+
 /* 자주찾는 서비스 */
-.main_cont3 .main_service ul {display: flex;flex-flow: wrap;justify-content: space-between;height: 300px;color: #222;}
-.main_cont3 .main_service ul li {height: 145px;border: 1px solid #d9d9d9;border-radius: 10px;width: calc(100%/3 - 8px);margin-bottom: 10px;text-align: center;display: table;box-sizing: border-box;transition: all 0.3s ease-in-out;position: relative;}
-/* hover효과1 */
-.main_cont3 .main_service ul li:hover {background-color: #fbc72b;box-shadow: 3px 3px 10px 4px rgba(0,0,0,0.15);border:1px solid #fbc72b;transition: all 0.2s ease-in-out;transform: translateY(-5%);}
-.main_cont3 .main_service ul li:hover i {background-color: #edb818;transition: all 0.2s ease-in-out;}
-.main_cont3 .main_service ul li:hover i {background-color: #edb818;}
-.main_cont3 .main_service ul li:hover span {font-weight: 500;}
-.main_cont3 .main_service ul li a {width: 100%;height: 100%;display: table-cell;vertical-align: middle;}
-.main_cont3 .main_service ul li i {background-color: #eee; width: 75px;height: 75px;border-radius: 50%;margin-bottom: 10px; position: relative;transition: all 0.2s ease-in-out;}
-.main_cont3 .main_service ul li i::after {content: ""; position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
-.main_cont3 .main_service ul li:nth-child(1) i::after{background-image: url(/publish/images/main/service01.png);width: 58px;height: 44px;}
-.main_cont3 .main_service ul li:nth-child(2) i::after{background-image: url(/publish/images/main/service02.png);width: 36px;height: 46px;}
-.main_cont3 .main_service ul li:nth-child(3) i::after{background-image: url(/publish/images/main/service03.png);width: 40px;height: 44px;}
-.main_cont3 .main_service ul li:nth-child(4) i::after{background-image: url(/publish/images/main/service04.png);width: 42px;height: 48px;}
-.main_cont3 .main_service ul li:nth-child(5) i::after{background-image: url(/publish/images/main/service05.png);width: 40px;height: 46px;}
-.main_cont3 .main_service ul li:nth-child(6) i::after{background-image: url(/publish/images/main/service06.png);width: 47px;height: 34px;}
-.main_cont3 .main_service ul li span {display: block;}
+.main_cont3 .main_service ul {display:flex;flex-flow:wrap;gap:13px;}
+.main_cont3 .main_service ul li {width:calc(100%/3 - 9px);}
+.main_cont3 .main_service ul li a {display:flex;width:100%;height:112px;padding:26px 0;border:1px solid #d5d5d5;border-radius:10px;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;transition:all .3s ease-in-out;}
+.main_cont3 .main_service ul li i {position:relative;width:100%;height:24px;margin:0 0 10px 0;background-position:center;transition: all 0.2s ease-in-out;}
+.main_cont3 .main_service ul li:nth-child(1) i{background-image: url(/publish/images/main/service01.png);}
+.main_cont3 .main_service ul li:nth-child(2) i{background-image: url(/publish/images/main/service02.png);}
+.main_cont3 .main_service ul li:nth-child(3) i{background-image: url(/publish/images/main/service03.png);}
+.main_cont3 .main_service ul li:nth-child(4) i{background-image: url(/publish/images/main/service04.png);}
+.main_cont3 .main_service ul li:nth-child(5) i{background-image: url(/publish/images/main/service05.png);}
+.main_cont3 .main_service ul li:nth-child(6) i{background-image: url(/publish/images/main/service06.png);}
+.main_cont3 .main_service ul li span {font-size:17px;font-weight:500;}
+
+.main_cont3 .main_service ul li a:hover{border:1px solid var(--primary-color);background:#f4fbff;box-shadow:0 0 10px 0 rgba(0,0,0,.2);}
+
+
 /* 공지사항 */
-.main_cont3 .main_notice ul {border: 1px solid #d9d9d9;height: 300px;padding-top:1px;padding-bottom:1px;border-radius: 10px;box-sizing: border-box;}
-.main_cont3 .main_notice ul li {padding: 12px 0; margin: 0 30px; border-bottom: 1px solid #d9d9d9; position: relative;z-index: 1;}
-.main_cont3 .main_notice ul li:last-child {border:0 none;}
-/* .main_cont3 .main_notice ul li:hover::after {content: ""; border:2px solid #fbc72b;background-color: #fff; position: absolute;top: -1px;left: 50%;transform: translateX(-50%); width: calc(100% + 30px);height: 44px;z-index: -1;box-shadow: 3px 3px 10px 4px rgb(0 0 0 / 15%);} */
-/* hover효과1 */
-.main_cont3 .main_notice ul li::after {content: "";position: absolute;top: -1px;left: 50%;transform: translateX(-50%); z-index: -1;transition: all 0.1s ease-in-out;opacity: 0;cursor: pointer;}
-.main_cont3 .main_notice ul li:hover::after {border:2px solid #fbc72b;background-color: #fff;width: calc(100% + 30px);height: 41px;box-shadow: 3px 3px 10px 4px rgba(0,0,0,0.15);;transition: all 0.1s ease-in-out;opacity: 1;}
-.main_cont3 .main_notice ul li a {font-weight: 500;}
-.main_cont3 .main_notice ul li:hover::before {background-image: url(/publish/images/main/notice_arrow.png);content: "";right: 0;top: 50%;transform: translateY(-50%); width: 9px; height: 14px;z-index: 1;position: absolute;}
-.main_cont3 .main_notice ul li a {color: #555;font-weight: 400;width: 90%;text-overflow: ellipsis;overflow: hidden;display: -webkit-inline-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;height: 16px;}
+.main_cont3 .main_notice ul {display:flex;border:1px solid #d5d5d5;border-radius:10px;padding:10px;box-sizing:border-box;flex-direction:column;}
+.main_cont3 .main_notice ul li:nth-child(n+6){display:none;}
+.main_cont3 .main_notice ul a{position:relative;display:inline-block;max-width:100%;font-size:17px;font-weight:400;color:#222;padding:11.5px 0 11.5px 26px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;align-items:center;transition:all 0.3s ease-in-out;box-sizing:border-box;}
+.main_cont3 .main_notice ul a::before{position:absolute;content:"";width:7px;height:7px;background:#d9d9d9;border-radius:100%;left:10px;top:50%;transform:translateY(-50%);}
+
+.main_cont3 .main_notice ul a:hover{text-decoration:underline;}
+
 /* 고객센터 */
-.main_cont3 .service_center .tablet {background-image: url(/publish/images/main/serive_tablet.png);background-repeat: no-repeat;height: 300px;color: #222;font-weight: 300;}
-.main_cont3 .service_center .tablet>div {padding: 15px 30px 0 30px;}
-.main_cont3 .service_center .tablet .service_center_title {position: relative;padding-left: 126px;}
-.main_cont3 .service_center .tablet .service_center_title::after {position: absolute;content: "";background-image: url(/publish/images/main/serviceCenter.png);width: 90px;height: 90px;top: -11px;left: 12px;}
-.main_cont3 .service_center .tablet .service_center_title p {margin: 0 0 0 -3px; font-size: 32px;font-weight: 700; color: #23428b;padding-bottom: 10px; letter-spacing: -1px;line-height:35px;}
-.main_cont3 .service_center .tablet .service_center_title span {font-size: 17px;font-weight: 300; }
-.main_cont3 .service_center .tablet .serive_info {background-image: url(/publish/images/main/serviceCenter_text.png);background-repeat: no-repeat;height: 71px;margin: 27px 0 15px 0;}
-.main_cont3 .service_center .tablet .serive_info p{line-height: 1.5;padding: 13px 18px;font-size: 16px; font-weight: 400;}
-.main_cont3 .service_center .tablet .serive_btn {text-align: center;display: flex;height: 47px;}
-.main_cont3 .service_center .tablet .serive_btn li {display: inline-block;width: calc(100% - 2px /3);border: 1px solid #d5d5d5;margin-left: -1px; box-sizing: border-box;}
-.main_cont3 .service_center .tablet .serive_btn li a,
-.main_cont3 .service_center .tablet .serive_btn li button {position:relative;font-size: 17px; font-weight:400; width: 100%; height: 100%;line-height:44px;box-sizing:border-box;}
-.main_cont3 .service_center .tablet .serive_btn li a:before,
-.main_cont3 .service_center .tablet .serive_btn li button:before {content:'';display:inline-block;width:20px;height:45px;margin:0 5px 0 0;vertical-align:top;background:url(/publish/images/main/icon_main_cscenter01.png) no-repeat left top;}
-.main_cont3 .service_center .tablet .serive_btn li.remote a:before {width:21px;background-image:url(/publish/images/main/icon_main_cscenter03.png);}
-.main_cont3 .service_center .tablet .serive_btn li.qnabtn a:before {width:23px;background-image:url(/publish/images/main/icon_main_cscenter02.png);}
-.main_cont3 .service_center .tablet .serive_btn li:first-child {border-radius: 8px 0 0 8px;}
-.main_cont3 .service_center .tablet .serive_btn li:last-child {border-radius: 0 8px 8px 0;}
-.main_cont3 .service_center .tablet .serive_btn li:hover {font-weight: 500;}
-.main_cont3 .service_center .tablet .serive_btn li:hover a::after,
-.main_cont3 .service_center .tablet .serive_btn li:hover button::after {content:'';position:absolute;left:-1px;top:-2px;width:100%;height:100%;border: 2px solid #fbc72b;box-shadow: 3px 3px 10px 4px rgba(0,0,0,0.15);z-index: 1;}
-.main_cont3 .service_center .tablet .serive_btn li:first-child:hover a::after,
-.main_cont3 .service_center .tablet .serive_btn li:first-child:hover button::after {border-radius: 8px 0 0 8px;}
-.main_cont3 .service_center .tablet .serive_btn li:last-child:hover a::after,
-.main_cont3 .service_center .tablet .serive_btn li:last-child:hover button::after {border-radius: 0 8px 8px 0;}
-/*// content3 서비스 및 공지사항 영역 */
-.btn_custom{position: absolute; top: 11px; right: 0; width: 145px; height: 36px; color: #fff; font-size: 18px; font-weight: 400; background-color: #002c9a; border-radius: 5px; letter-spacing: -0.5px;}
-.btn_custom img{vertical-align: middle; margin-top: -4px; margin-right: 2px;}
-.btn_custom:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
+.service_center .box{display:flex;padding:29.5px 30px;border:1px solid #d5d5d5;border-radius:10px;flex-direction:column;gap:15px;}
+.service_title{display:flex;align-items:center;gap:20px;}
+.service_title .service{display:inline-block;width:55px;height:55px;padding:0;margin:0;border-radius:5px;background:var(--primary-color) url(/publish/images/main/serviceCenter.png) no-repeat center;}
+.service_title b{font-family:'GmarketSansBold';font-size:29px;color:var(--primary-dark-color-hover);}
+.service_title .email{font-family: 'GmarketSansMedium';font-size:15px;font-weight:300;color:#454545;}
+
+.service_time_info{font-size:16px;font-weight:400;color:#555;line-height:1.4;}
+
+.service_btn{display:flex;width:100%;height:46px;background:#f2f2f2;border-radius:3px;}
+.service_btn li{flex:1;height:100%;}
+.service_btn a{display:flex;width:100%;height:100%;font-size:17px;font-weight:400;color:#222;justify-content:center;align-items:center;gap:8px;transition:box-shadow .3s ease-in-out;}
+.service_btn a:hover{box-shadow:0 0 8px rgba(0,0,0,0.15);border-radius:4px;}
+
+.service_btn .circle{display:inline-block;width:15px;height:15px;border-radius:100%;}
+.service_btn .kakao{background:#564742;}
+.service_btn .remote{background:#4673B7;}
+.service_btn .qnabtn{background:#3D5E5E;}
+
+.main_cont4{display:none;}
 
 /*요금안내 top 배너 시작*/
 .price_top_banner{position: fixed; right: 4%; top: 160px; z-index: 20;}
@@ -238,7 +172,7 @@
 .keyword_wrap .link_box li{margin: 0 8px 8px 0;}
 .keyword_wrap .link_box a{position: relative; height: 35px; padding: 7px 11px 7px 34px; border: 1px solid #222; border-radius: 5px; font-family: 'GmarketSansMedium'; font-size: 14px; line-height: 22.5px; color: #222; background-color: #fff; box-sizing: border-box;}
 .keyword_wrap .link_box a:hover{box-shadow: 3px 3px 5px rgba(0,0,0,0.3);}
-.keyword_wrap .link_box a::after{position: absolute; content: "#"; width: 22px; height: 22px; border-radius: 100%; background-color: #fbc72b; font-family: 'GmarketSansMedium'; color: #222; text-align: center; line-height: 25px; left: 8px; top: 50%; transform: translateY(-50%);}
+.keyword_wrap .link_box a::after{position: absolute; content: "#"; width: 22px; height: 22px; border-radius: 100%; background-color: var(--secondary-light-color); font-family: 'GmarketSansMedium'; color: #222; text-align: center; line-height: 25px; left: 8px; top: 50%; transform: translateY(-50%);}
 
 
 /* media queries */
@@ -255,7 +189,7 @@
 	.msg_text .area_in_text{background-size: 90% 90%;}
     /* content3 */
     .main_cont3 .service_center .tablet{background-size: 100% 100%}
-    .main_cont3 .inner{padding: 80px 70px}
+    
 	.main_cont3 .service_center .tablet>div {padding: 15px 20px 0 20px;}
     .main_cont3 .service_center .tablet .serive_info{background-size: 100% 100%}
     .main_cont3 .service_center .tablet .serive_info p{padding: 13px 10px 13px 23px; font-size: 15px}
@@ -291,6 +225,10 @@
 }
 
 @media screen and (max-width: 1480px){
+	
+	.banner_slide,.main_cont2 .inner,.main_cont3 .inner{padding:0 40px;box-sizing:border-box;}
+	.banner_slide{padding:40px 40px 0 40px;}
+	
    /* 메인 비주얼 영역 */
    .visual .swiper-button-prev {left: 10px;}
    .visual .swiper-button-next {right: 10px;}
@@ -301,13 +239,13 @@
    .swiper2 .contWrap .slide_cont::after {right: 15px;}
 
    /* content2 문자샘플 영역 */
-   .main_cont2 {padding: 235px 80px 80px 80px;}
+   
    .tab_depth2 a{font-size: 18px;}
    .tab_depth3{padding: 20px; box-sizing: border-box;}
    .tab_con{width: 90%;}
    .tab_con.msg_photo_wrap, .tab_con.msg_text_wrap {width:100%;}
-   .tab_contwrap .btn_prev{left: 0;}
-   .tab_contwrap .btn_next{right: 0;}
+   .tab_contwrap .btn_prev{left: -20px;}
+   .tab_contwrap .btn_next{right: -20px;}
    .tab_contwrap .btn_prev,.tab_contwrap .btn_next{width: 40px;height: 40px;}
    /* content3 */
    .main_cont3 .inner>div {flex-basis: calc(100%/3 - 10px);}
@@ -316,6 +254,11 @@
    .main_cont3 .service_center .tablet .service_center_title span {font-size:15px;}
    /* 광고배너 */
    .main_cont4 .inner li{width: calc((100%/4) - 15px);}
+   
+   .service_title .info{width:calc(100% - 75px);}
+   .service_time_info{font-size:15px;}
+   .service_btn .circle{width:12px;height:12px;}
+   .service_btn a{font-size:16px;}
 }
 
 @media screen and (max-width: 1300px){
src/main/webapp/publish/css/mem.css
--- src/main/webapp/publish/css/mem.css
+++ src/main/webapp/publish/css/mem.css
@@ -3,21 +3,21 @@
 .mem_cont .mem_cont_in {position: relative; margin: 0 auto;}
 .mem_cont {max-width: 820px; padding: 80px 0; margin: 0 auto; }
 .welcome {font-size: 30px; font-weight: 300; text-align: center; letter-spacing: -0.5px;}
-.welcome>span {font-weight: 600; color: #002c9a;}
+.welcome>span {font-weight: 600; color: var(--primary-color);}
 .welcome_sub{font-size: 18px; text-align: center; margin-top: -10px;}
-.mem_cont .text_top {font-size: 20px;  padding: 21.5px 40px; border-radius: 10px; margin-bottom: 30px; background-color: #ffcc33;}
+.mem_cont .text_top {font-size: 20px;  padding: 21.5px 40px; border-radius: 10px; margin-bottom: 30px; background-color: var(--secondary-light-color);}
 .mem_cont .text_top p {display: inline-block; vertical-align: middle; margin-bottom:3px;}
-.mem_cont .text_top span {font-weight: 500; color: #002c9a;}
+.mem_cont .text_top span {font-weight: 500; color: var(--primary-color);}
 .mem_cont .text_req2 {font-size: 24px; font-weight: 500; color: #002222; padding-bottom: 12px;}
 .mem_cont .text_req2 .join3_1 {background-image: url(/publish/images/mem/join3_1.png); width: 19px; height: 24px; margin: 0 10px 3px 0;}
 .mem_cont .text_req2 .join3_2 {background-image: url(/publish/images/mem/join3_2.png); width: 24px; height: 23px; margin: 0 10px 3px 0;}
-.input_list .list_title {font-size: 18px; font-weight: 500; color: #002c9a; position: relative; display: inline-block; margin-bottom: 20px;}
+.input_list .list_title {font-size: 18px; font-weight: 500; color: var(--primary-color); position: relative; display: inline-block; margin-bottom: 20px;}
 .input_list .list_title::after {content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);width: 100%; height: 6px; background-color: rgba(0,44,154,0.15);}
 .checkbox_wrap {display: inline-block; margin-right: 15px;}
 
 /* membership button type 공통(하단 버튼) */
 .mem_btnWrap {text-align: center;}
-.mem_btn1 {width: 100%; height: 70px; background-color: #ffcc33; position: relative;font-size: 22px; border-radius: 5px; color: #222 !important;}
+.mem_btn1 {width: 100%; height: 70px; background-color: var(--secondary-color); position: relative;font-size: 22px; border-radius: 5px; color: #fff !important;}
 .mem_btn1:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.15);}
 .selType2 {width: 255px; height: 50px; padding: 0 15px; border-radius: 5px; background-image: url(/publish/images/select_search.png);background-repeat: no-repeat;background-position: right 15px top 50%; color: #666;}
 .mem_btnWrap .mem_btn1::after {content: ""; background-image: url(/publish/images/mem/join2_btn_bg.png); background-repeat: no-repeat; width: 820px; height: 16px; position: absolute; bottom: 0; left: 0;}
@@ -26,9 +26,9 @@
 .mem_btnWrap2 button {width: calc(100%/2 - 5px);height: 70px; border-radius: 5px; font-size: 22px; color: #fff;}
 .mem_btnWrap2 button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.2);}
 .mem_btnWrap2 .mem_btn2 {background-color: #999;}
-.mem_btnWrap2 .mem_btn3 {background-color: #002c9a;}
-.mem_btnWrap2 .mem_btn4 {border: 1px solid #002c9a; color: #002c9a; font-weight: 400;}
-.mem_btnWrap2 .mem_btn5 {width: 100%; background-color: #fbc72b; color: #222; font-weight: 400;}
+.mem_btnWrap2 .mem_btn3 {background-color: var(--primary-color);}
+.mem_btnWrap2 .mem_btn4 {border: 1px solid var(--primary-color); color: var(--primary-color); font-weight: 400;}
+.mem_btnWrap2 .mem_btn5 {width: 100%; background-color: var(--secondary-color); color: #fff; font-weight: 400;}
 .mem_btnWrap2.justify {justify-content:center;}
 
 .mem_btnWrap3 {text-align: center; margin: 0 auto;}
@@ -36,12 +36,12 @@
 .mem_btnWrap3 button:last-child {margin-left: 6px;}
 .mem_btnWrap3 button:only-child {margin-left: 0;}
 .mem_btnWrap3 button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.2);}
-.mem_btnWrap3 .mem_btn4 {border: 1px solid #002c9a; color: #002c9a;}
-.mem_btnWrap3 .mem_btn5 {background-color: #002c9a; color: #fff;}
+.mem_btnWrap3 .mem_btn4 {border: 1px solid var(--primary-color); color: var(--primary-color);}
+.mem_btnWrap3 .mem_btn5 {background-color: var(--primary-color); color: #fff;}
 
 .mem_btnWrap4 {text-align: center; margin: 40px auto 0 auto;}
 .mem_btnWrap4 button{width: 160px; height: 50px; border-radius: 5px; font-size: 20px;}
-.mem_btnWrap4 .mem_btnok{background-color: #fbc72b; color: #222; font-weight: 400;}
+.mem_btnWrap4 .mem_btnok{background-color: var(--secondary-color); color: #FFF; font-weight: 400;}
 .mem_btnWrap4 .mem_btncancel{background-color: #666; color: #fff; font-weight: 400;}
 /* //membership button type */
 
@@ -49,18 +49,18 @@
 .joinCheckbox{display: none;}
 .joinCheckbox+label{display: inline-block; vertical-align: middle; margin-bottom: 3px; position: relative; cursor: pointer;padding:0 0 0 36px;line-height:24px;}
 .joinCheckbox+label::after {width:24px;height:24px;border-radius:50%;background-image: url(/publish/images/mem/check2_ckecked.png);background-repeat: no-repeat; background-position: center;position: absolute;content: "";display: inline-block;top:0;left:0;border-radius: 50%;border: 2px solid #fff;vertical-align:top;box-sizing:border-box;}
-.joinCheckbox+label span.esn {font-size:20px;font-weight:500;color:#002c9a;}
+.joinCheckbox+label span.esn {font-size:20px;font-weight:500;color:var(--primary-color);}
 .joinCheckbox+label span.sel {font-size:20px;font-weight:500;color:#0fab7a;}
 .joinCheckbox+label strong {font-size:20px;font-weight:500;}
-.joinCheckbox:checked+label{position: relative;font-weight:500;color:#002c9a;}
-.joinCheckbox:checked+label::after{background-image: url(/publish/images/mem/check2_ckecked.png);background-color: #002c9a;border: 1px solid #002c9a;}
+.joinCheckbox:checked+label{position: relative;font-weight:500;color:var(--primary-color);}
+.joinCheckbox:checked+label::after{background-image: url(/publish/images/mem/check2_ckecked.png);background-color: var(--primary-color);border: 1px solid var(--primary-color);}
 
 .joinCheckbox.type2+label::after {background-image: url(/publish/images/mem/check2.png);border: 2px solid #ccc;}
-.joinCheckbox.type2:checked+label::after{background-image: url(/publish/images/mem/check2_ckecked.png); border: 1px solid #002c9a;}
+.joinCheckbox.type2:checked+label::after{background-image: url(/publish/images/mem/check2_ckecked.png); border: 1px solid var(--primary-color);}
 
 .joinCheckbox.type3+label{}
 .joinCheckbox.type3+label::after {background-image: url(/publish/images/mem/check3.png); border: 1px solid #ccc;}
-.joinCheckbox.type3:checked+label::after{background-image: url(/publish/images/mem/check3_checked.png);border: 1px solid #002c9a;}
+.joinCheckbox.type3:checked+label::after{background-image: url(/publish/images/mem/check3_checked.png);border: 1px solid var(--primary-color);}
 
 /* membership nav */
 .mem_cont .mem_nav {display: flex; max-width: 820px; margin: 60px auto; position: relative;}
@@ -78,8 +78,8 @@
 .mem_cont .mem_nav li:nth-child(2) i::after {background-image: url(/publish/images/mem/step2.png); width: 23px; height: 37px;}
 .mem_cont .mem_nav li:nth-child(3) i::after {background-image: url(/publish/images/mem/step3.png); width: 37px; height: 34px;}
 /* on */
-.mem_cont .mem_nav li.on>div {color: #002c9a;}
-.mem_cont .mem_nav li.on::before {background-color: #002c9a;}
+.mem_cont .mem_nav li.on>div {color: var(--primary-color);}
+.mem_cont .mem_nav li.on::before {background-color: var(--primary-color);}
 
 .mem_cont .mem_nav li.on:nth-child(1) i::after {background-image: url(/publish/images/mem/step1_on.png);}
 .mem_cont .mem_nav li.on:nth-child(2) i::after {background-image: url(/publish/images/mem/step2_on.png);}
@@ -94,11 +94,11 @@
 .mem_cont.join1 ul li {width: calc(100%/2 - 20px); padding: 38px 0; border-radius: 10px; background-color: #e8e9eb;  transition: all 0.2s ease-in-out; position: relative;}
 
 .mem_cont.join1 ul li.on,
-.mem_cont.join1 ul li:hover {background-color: #fbc72b; transition: all 0.2s ease-in-out; box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.2);}
+.mem_cont.join1 ul li:hover {background-color: var(--secondary-color); transition: all 0.2s ease-in-out; box-shadow: 0px 0px 10px 3px rgba(0,0,0,0.2);}
 .mem_cont.join1 ul li.on::after,
 .mem_cont.join1 ul li:hover::after {background-image: url(/publish/images/mem/join1_check.png); background-repeat: no-repeat; position: absolute; top: 14px; right: 13px; content: ""; width: 31px;height: 31px; cursor: pointer;}
-.mem_cont.join1 ul li.on p {font-weight: 500;}
-.mem_cont.join1 ul li.on span {color: #222;}
+.mem_cont.join1 ul li.on p {font-weight: 500; color:#fff;}
+.mem_cont.join1 ul li.on span {color: #222; color:#fff;}
 
 .mem_cont.join1 ul li p {font-size: 24px; padding: 20px 0 12px 0;}
 .mem_cont.join1 ul li span {font-size: 17px; font-weight: 300; color: #666;}
@@ -111,7 +111,7 @@
 
 .mem_cont.join1 .join_check {display: flex; justify-content: center; margin-top: 57px; font-size: 18px;}
 .mem_cont.join1 .join_check p {color: #666; font-weight: 300; padding: 0 10px;}
-.mem_cont.join1 .join_check a {color: #002c9a; font-weight: 500; padding: 0 10px; position: relative;}
+.mem_cont.join1 .join_check a {color: var(--primary-color); font-weight: 500; padding: 0 10px; position: relative;}
 .mem_cont.join1 .join_check a::after {content: ""; position: absolute; width: 90%; height: 9px; background-color: rgba(0,44,154,0.15);bottom: -1px; left: 50%; transform: translateX(-50%);}
 /* //join1 - 가입 선택 화면 */
 
@@ -124,7 +124,7 @@
 .clause_list li.list_open .clause_list_head button i::after {content: ""; background-image: url(/publish/images/mem/clause_open.png); width: 17px; height: 17px; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
 .clause_list li.list_open .clause_list_head span {margin:0 3px 0 0;font-size: 20px; font-weight: 500; line-height: 1.5;}
 .mem_cont.join2 .clause_list {margin-bottom: 0;}
-.mem_cont.join2 .clause_list li.list_open .clause_list_head span>.esn {color: #002c9a;}
+.mem_cont.join2 .clause_list li.list_open .clause_list_head span>.esn {color: var(--primary-color);}
 .mem_cont.join2 .clause_list li.list_open .clause_list_head span>.sel {color: #0fab7a;}
 .mem_cont.join2 .clause_list li.list_open .clause_list_body {padding: 5px 30px 40px 30px; background-color: #efeff0;}
 .mem_cont.join2 .clause_list li.list_open .clause_list_body .agree_text {background-color: #fff; height: 414px; padding: 20px; border-radius: 5px;}
@@ -235,21 +235,21 @@
 input[type="text"].list_inputType1::placeholder {color: #222;}
 /* password */
 input[type="password"].list_inputType1 {padding: 0px;background-color: transparent; width: 100%; height: 100%; font-weight: 300; font-size: 18px;font-family: 'pass', 'Roboto', Helvetica, Arial, sans-serif;}
-.list_inputType1.colorLight::placeholder {color: #a6a6a6 !important; font-size: 18px; font-family: 'Noto Sans KR', sans-serif;}
-.list_inputType1.colorLight:-ms-input-placeholder {color: #a6a6a6 !important; font-size: 16px; font-family: 'Noto Sans KR', sans-serif;}
+.list_inputType1.colorLight::placeholder {color: #a6a6a6 !important; font-size: 18px; font-family: 'Pretendard';}
+.list_inputType1.colorLight:-ms-input-placeholder {color: #a6a6a6 !important; font-size: 16px; font-family: 'Pretendard';}
 /* select */
 .input_list.listType2 .list_inputType1 {font-size: 17px;}
 .input_list.listType2 .list_selType1 {font-size: 16px;}
 /* 정보 입력 list 안에있는 button */
 .list_btn_wrap {position: absolute; top: 50%; right: -10px; transform: translateY(-50%);}
 .list_btn_wrap>span {font-size: 14px; font-weight: 300; color: #a6a6a6; padding-right: 12px;}
-.list_btn_wrap button {background-color: #6a6c72; height: 40px; padding: 0 14px; border-radius: 5px; color: #fff; font-size: 15px;}
+.list_btn_wrap button {background-color: var(--gray-color); height: 40px; padding: 0 14px; border-radius: 5px; color: #fff; font-size: 15px;}
 .list_btn_wrap button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
 
 /* 스팸, 상업성 광고문자 동의 안내 */
 .consent_info {padding: 30px; border: 3px solid #efeff0; border-radius: 5px; margin-top: -30px; margin-bottom: 50px; position: relative;}
 .consent_info .consent_info_cont {margin-bottom: 30px;}
-.consent_info .consent_info_cont .textType {display:inline-block; color:#002c9a; font-weight:bold;}
+.consent_info .consent_info_cont .textType {display:inline-block; color:var(--primary-color); font-weight:bold;}
 .consent_info .consent_info_cont:nth-child(2) {margin-bottom: 40px;}
 .consent_info .consent_info_cont p:first-child {font-weight: 500; color: #e40000;}
 .consent_info .consent_info_cont p:last-child {line-height: 1.45; letter-spacing: -0.5px; padding-top: 10px;} 
@@ -294,13 +294,13 @@
 .mem_cont.join4 .welcome_join {background-image: url(/publish/images/mem/join4_bg.png); background-repeat: no-repeat; width: 100%; height: 387px; display: table;}
 .mem_cont.join4 .welcome_join .welcome_join_in {display: table-cell; vertical-align: middle;}
 .mem_cont.join4 .welcome_join .welcome_join_in .name p {font-family: 'TmonMonsori'; font-size: 85px; color: #fff;-webkit-text-stroke: 3px #000; text-shadow: 5px 5px 0px #000; margin-bottom: 10px; letter-spacing: -1.5px;}
-.mem_cont.join4 .welcome_join .welcome_join_in .name span {font-family: 'TmonMonsori'; color: #002c9a;-webkit-text-stroke: 3px #fff;}
+.mem_cont.join4 .welcome_join .welcome_join_in .name span {font-family: 'TmonMonsori'; color: var(--primary-color);-webkit-text-stroke: 3px #fff;}
 .mem_cont.join4 .welcome_join .welcome_join_in .service_info {margin-top: 15px;}
 .mem_cont.join4 .welcome_join .welcome_join_in .service_info p {font-size: 21px; font-weight: 300;}
 .mem_cont.join4 .welcome_join .welcome_join_in .service_info p:first-child {font-weight: 500; padding-bottom: 8px;}
-.mem_cont.join4 .mem_ship_join {padding:28px 0 0;text-align:center;background:#fbc72b;border-radius:10px;}
+.mem_cont.join4 .mem_ship_join {padding:28px 0 0;text-align:center;background:var(--secondary-light-color);border-radius:10px;}
 .mem_cont.join4 .mem_ship_join .text {padding:15px 0 33px;font-size:22px;letter-spacing:-0.025em;color:#222;}
-.mem_cont.join4 .mem_ship_join .text strong {font-weight:700;color:#002c9a;}
+.mem_cont.join4 .mem_ship_join .text strong {font-weight:700;color:var(--primary-color);}
 
 .mem_cont.join4 .text_bottom {font-size: 20px; padding: 25px 0; border: 5px solid #e5e5e5; border-radius: 10px; margin:20px 0 40px 0; color: #333;}
 .mem_cont.join4 .text_bottom div { display: flex; width: 25%; margin: 0 auto; position: relative;}
@@ -329,7 +329,7 @@
 .my_dashboard .event_text span{font-size: 15px; font-weight: bold; color: #e40000; padding: 0 0 0 0;} */
 .my_dashboard .send_price{display: flex;width: calc(100% - 490px); height: 80%; margin: 0 0 0 0; line-height: 1; align-items: stretch;}
 .my_dashboard .send_price::after{display: none;}
-.my_dashboard .send_price .price_title{display: flex; width: 100px; background-color: #eea301; color: #fff; font-size: 18px; font-weight: bold; border-radius: 10px 0 0 10px; align-items: center; justify-content: center; line-height: 1.5;}
+.my_dashboard .send_price .price_title{display: flex; width: 100px; background-color: var(--secondary-color); color: #fff; font-size: 18px; font-weight: bold; border-radius: 10px 0 0 10px; align-items: center; justify-content: center; line-height: 1.5;}
 .my_dashboard .send_price .price_wrap{width: calc(135% - 100px); background-color: #fff; border-radius: 0 10px 10px 0; padding: 0 10px;}
 .my_dashboard .send_price ul{display: flex; width: calc(100% - 0px); border-bottom: 1px dashed #d5d5d5; margin: 0 auto; padding: 10px 14px; align-items: center; flex-wrap: wrap; box-sizing: border-box;}
 .my_dashboard .send_price ul:last-child{border: 0; align-items: flex-start;}
@@ -362,28 +362,28 @@
 .my_dashboard .picker__table thead th::after{display: none;}
 .my_dashboard .picker__table tbody td{height: auto; border: 0; background-color: transparent;}
 
-.my_dashboard .table_wrap {border: 1px solid #ccc; border-radius: 5px; margin: 0 0 15px 0;}
+.my_dashboard .table_wrap {border: 1px solid #d5d5d5; border-radius: 5px; margin: 0 0 15px 0;}
 .my_dashboard .table_wrap:last-child{margin: 0 0 0 0;}
 .my_dashboard_cont2 .table_wrap {margin-top: 10px;}
 .my_dashboard table {table-layout: fixed; width: 100%;}
-.my_dashboard table thead {background-color: #ededed;  z-index: 0;}
-.my_dashboard table thead th {height: 36px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: 15px; z-index: 1; vertical-align: middle;position: relative;}
+.my_dashboard table thead {background-color: #f8f8f8;  z-index: 0;}
+.my_dashboard table thead th {height: 36px; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; font-size: 15px; z-index: 1; vertical-align: middle;position: relative;}
 .my_dashboard table thead th:first-child {border-radius: 5px 0 0 0;}
 .my_dashboard table thead th:last-child {border-right: 1px solid transparent; border-radius: 0 5px 0 0;}
-.my_dashboard table thead th::after{position: absolute; content: " "; width: 100%; height: 18px; background-color: #e5e5e5; bottom: 0; left: 0; z-index: -1;}
 .my_dashboard table tbody td {text-align: center; font-size: 15px; font-weight: 300; height: 38px; padding: 0 5px; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; background-color: #fff;vertical-align: middle; color: #666; letter-spacing: -0.5px;}
 .my_dashboard table tbody td .event_status02{display: inline-block; width: 19px; height: 19px; line-height: 19px; background-color: #e40000; color: #fff; font-size: 14px; font-weight: bold; border-radius: 5px; margin: -1px 0 0 0;}
 .my_dashboard table tbody td:last-child {border-right: 1px solid transparent;}
 .my_dashboard table tbody tr:last-child td {border-bottom: 1px solid transparent; }
 .my_dashboard table tbody tr:last-child td:first-child {border-bottom: 1px solid transparent; border-radius: 0 0 0 5px;}
 .my_dashboard table tbody tr:last-child td:last-child {border-bottom: 1px solid transparent; border-radius: 0 0 5px 0 ;}
+.my_dashboard table tbody td button{font-size:14px;}
 
 /* mypage dashboard cont1 */
 .my_dashboard .my_dashboard_cont1 {padding: 25px 30px;}
 .my_dashboard_cont1>div {display: flex; align-items: center;}
 .my_dashboard_cont1 p {font-size: 20px; font-weight: 300;}
 .my_dashboard_cont1 p span {font-size: 26px; font-weight: 600; padding-right: 3px;}
-.my_dashboard .my_dashboard_cont1 button {font-size: 17px; height: 45px; padding: 0 15px; border: 1px solid #002c9a; border-radius: 5px; margin-left: 15px; color: #002c9a; background-color: #fff; position: relative; right: 5px; top: 3px;}
+.my_dashboard .my_dashboard_cont1 button {font-size: 17px; height: 45px; padding: 0 15px; border: 1px solid var(--primary-color); border-radius: 5px; margin-left: 15px; color: var(--primary-color); background-color: #fff; position: relative; right: 5px; top: 3px;}
 .my_dashboard_cont1>span {background-color: #fff; height: 43px; padding: 0 30px; border-radius: 21.5px; align-items: center; display: flex; font-weight: 300;}
 .my_dashboard_cont1>span>span {font-weight: 500;}
 .my_dashboard_cont1 .title_wrap{width:450px;}
@@ -397,7 +397,7 @@
 .my_dashboard_cont1>div {display: flex; align-items: center;}
 .my_dashboard_cont1 p {font-size: 16px; font-weight: 300;}
 .my_dashboard_cont1 p span {font-size: 24px; font-weight: 600; padding-right: 3px; /*margin-left: -20px;*/}
-.my_dashboard .my_dashboard_cont1 button {font-size: 17px; height: 45px; padding: 0 8px; border: 1px solid #002c9a; border-radius: 5px; margin-left: 15px; color: #002c9a; background-color: #fff; position: relative; right: 5px; top: 3px;}
+.my_dashboard .my_dashboard_cont1 button {font-size: 17px; height: 45px; padding: 0 8px; border: 1px solid var(--primary-color); border-radius: 5px; margin-left: 15px; color: var(--primary-color); background-color: #fff; position: relative; right: 5px; top: 3px;}
 .my_dashboard_cont1>span {background-color: #fff; height: 43px; padding: 0 30px; border-radius: 21.5px; align-items: center; display: flex; font-weight: 300;}
 .my_dashboard_cont1>span>span {font-weight: 500;}
 .my_dashboard .my_dashboard_cont1 .level_icon{margin: 0 7px 0 0; display: block; width: 46px; height: 80px; text-align: center; padding: 0; background-color: transparent; border: 0;}
@@ -409,7 +409,7 @@
 .dashboard_info>div {background-color: #fff; padding: 15px 20px; border-radius: 5px; box-sizing: border-box;}
 .dashboard_info>div  p:first-child {font-size: 18px; padding-bottom: 15px;}
 .dashboard_info>div  p:last-child {font-size: 18px; text-align: right; font-size: 16px; font-weight: 300;}
-.dashboard_info>div  p:last-child span {color: #002c9a; font-weight: 800; letter-spacing: -0.25px; font-size: 20px; font-family: 'GmarketSansBold';}
+.dashboard_info>div  p:last-child span {color: var(--primary-color); font-weight: 800; letter-spacing: -0.25px; font-size: 20px; font-family: 'GmarketSansBold';}
 .my_dashboard_cont2>div:nth-child(1) .dashboard_info>div {width: calc(100%/3 - 5px);}
 .my_dashboard_cont2>div:nth-child(2) .dashboard_info>div {width: calc(100%/2 - 5px);}
 .my_dashboard_cont2>div {width: calc(100%/2 - 5px); padding: 40px 30px; background-color: #f2f2f2; border-radius: 5px; margin-bottom: 15px; box-sizing: border-box; position: relative;}
@@ -419,7 +419,7 @@
 .my_dashboard_cont2>div:nth-child(1) .cont2_com p:first-child {font-size: 18px;}
 .my_dashboard_cont2>div:nth-child(1) .cont2_com p:last-child {font-size: 16px; font-weight: 300;}
 .my_dashboard_cont2>div:nth-child(1) .cont2_com p:last-child span {font-family: 'GmarketSansBold'; font-size: 20px; font-weight: 600; letter-spacing: -0.25px;}
-.my_dashboard_cont2>div:nth-child(1) .cont2_2 {background-color: #fbc72b; margin: 15px 0 7px 0;}
+.my_dashboard_cont2>div:nth-child(1) .cont2_2 {background-color: var(--secondary-light-color); margin: 15px 0 7px 0;}
 .my_dashboard_cont2>div:nth-child(1) .cont2_3 {background-color: #fff;}
 .my_dashboard_cont2>div:nth-child(1) .cont2_4 {text-align: center; font-size: 16px; color: #555; font-weight: 300; padding-top: 15px;}
 .my_dashboard_cont2>div:nth-child(1) .cont2_4>span {font-weight: 800;}
@@ -440,24 +440,24 @@
 .mypage_content .mem_cont_in.widthM {max-width: 740px;}
 .mypage_content .mem_cont_in.widthL {max-width: 100%;}
 .mypage_content .mem_cont_in .input_list {margin-bottom: 0;}
-.mypage_content .text_top {font-size: 20px;  padding: 21.5px 50px; border-radius: 10px; margin-bottom: 30px; background-color: #ffcc33; text-align: center;}
+.mypage_content .text_top {font-size: 20px;  padding: 21.5px 50px; border-radius: 10px; margin-bottom: 30px; background-color: var(--secondary-light-color); text-align: center;}
 .mypage_content .text_top p {display: inline-block; vertical-align: middle; margin-bottom:3px;line-height:26px;word-break:break-all;}
-.mypage_content .text_top span {font-weight: 500; color: #002c9a;}
-.mypage_content .text_top strong {font-size:24px;font-weight:700;color:#002c9a;}
+.mypage_content .text_top span {font-weight: 500; color: var(--primary-color);}
+.mypage_content .text_top strong {font-size:24px;font-weight:700;color:var(--primary-color);}
 .mypage_content .text_top dl {display:flex;margin:20px -35px 0;padding:28px 0;justify-content:space-between;background:#fff;border-radius:5px;}
 .mypage_content .text_top dl dt {display:flex;width:135px;font-size:20px;font-weight:700;justify-content:center;align-items:center;color:#222;border-right:1px solid #ccc;}
 .mypage_content .text_top dl dd {width:calc(100% - 135px);padding:0 50px 0 35px;font-size:18px;line-height:26px;text-align:left;box-sizing:border-box;}
 .mypage_content .mem_cont_in .mem_btnWrap2 {margin-top: 30px;}
 .mypage_content .mem_cont_in .list_title2 {font-size: 26px; text-align: center; margin-bottom: 40px;}
 
-.mypage_content .mem_cortab {display:flex;justify-content:space-between;background:#f4f4f5;border-radius:5px;}
+.mypage_content .mem_cortab {display:flex;justify-content:space-between;background:#f2f2f2;border-radius:5px;}
 .mypage_content .mem_cortab li {width:calc(100%/2);}
-.mypage_content .mem_cortab li button {display:block;width:100%;height:60px;font-size:20px;line-height:60px;text-align:center;color:#555;}
-.mypage_content .mem_cortab li.active button {font-weight:500;color:#222;background:#fbc72b;border-radius:5px;}
+.mypage_content .mem_cortab li button {display:block;width:100%;height:60px;font-size:20px;line-height:60px;text-align:center;color:#222;}
+.mypage_content .mem_cortab li.active button {font-weight:500;color:#fff;background:var(--secondary-color);border:1px solid var(--secondary-color-hover);border-radius:5px;}
 .mypage_content .cor_noti {margin:60px 0 30px;padding:0 30px 20px;font-size:20px;line-height:26px;text-align:center;word-break:break-all;}
 .mypage_content .cor_noti:before {content:'';display:inline-block;width:16px;height:11px;margin:0 18px;vertical-align:top;background:url(/publish/images/mem/icon_quotation01.jpg) no-repeat left top;}
 .mypage_content .cor_noti:after {content:'';display:inline-block;width:16px;height:11px;margin:0 18px;vertical-align:top;background:url(/publish/images/mem/icon_quotation02.jpg) no-repeat left top;}
-.mypage_content .cor_noti span {font-weight:500;color:#002c9a;}
+.mypage_content .cor_noti span {font-weight:500;color:var(--primary-color);}
 .mypage_content .input_list_cor {display:none;}
 .mypage_content .input_list_cor:first-child {display:block;}
 /* 로그인 */
@@ -505,6 +505,10 @@
 .certify_in>div .certify_in_body textarea {height: 93px; padding: 15px; border: none; border-radius: 5px; margin-top: 20px; background-color: #f2f2f2;}
 .certify_in>div .certify_in_body textarea::placeholder {color: #a6a6a6; font-size: 16px;}
 /* 발신번호 관리 */
+.mypage_content .heading.call_numbe_con .button_wrap .button.certificate::before,
+.mypage_content .heading.call_numbe_con .button_wrap .button.id_card::before{display:none;}
+.mypage_content .heading.call_numbe_con .button_wrap .button.pro_ex{background:var(--secondary-light-color);border:1px solid var(--secondary-light-color-hover);}
+.mypage_content .heading.call_numbe_con .button_wrap .button.pro_ex::before{display:none;}
 .mypage_content .mem_cont_in.widthXL {max-width: 100%; padding: 0;}
 .mypage_content .tType1 tbody td.put_num>p {display: inline-block; vertical-align: middle; padding-left: 15px; color: #a6a6a6; line-height: 1.7; font-weight: 300; font-size: 15px;}
 .mypage_content .search_wrap {margin: 20px 0 30px 0;}
@@ -521,13 +525,13 @@
 .mypage_content .papers_guide {overflow:hidden;position:relative;margin:0 0 60px;padding:32px 0 0;box-sizing:border-box;}
 .mypage_content .papers_guide h3 {padding:0 0 15px;font-size:20px;font-weight:500;line-height:22px;letter-spacing:-0.025em;}
 .mypage_content .papers_guide h3:before {content:'';display:inline-block;width:21px;height:22px;margin:0 8px 0 0;vertical-align:top;background:url(/publish/images/mem/icon_papers_guide_title.png) no-repeat left top;}
-.mypage_content .papers_guide .guide_content {position:relative;padding:19px 59px 15px;border:1px solid #46484a;border-radius:5px;}
+.mypage_content .papers_guide .guide_content {position:relative;padding:19px 59px 15px;border:1px solid #1E3862;border-radius:5px;}
 .mypage_content .papers_guide .guide_content .guide_tab {overflow:hidden;position:absolute;right:0;top:-38px;width:385px;}
 .mypage_content .papers_guide .guide_content .guide_tab:after {content:'';position:absolute;left:50%;top:0;width:4px;height:1px;background:#bcbdc1;transform:translateX(-50%);}
 .mypage_content .papers_guide .guide_content .guide_tab li {float:left;width:calc(100%/2);box-sizing:border-box;}
 .mypage_content .papers_guide .guide_content .guide_tab li button {display:block;width:100%;font-size:18px;height:38px;text-align:center;border-top:1px solid #bcbdc1;border-right:1px solid #bcbdc1;border-radius:0 5px 0 0;}
 .mypage_content .papers_guide .guide_content .guide_tab li:first-child button {border-left:1px solid #bcbdc1;border-right:0 none;border-radius:5px 0 0 0;}
-.mypage_content .papers_guide .guide_content .guide_tab li.active button {color:#fff;border-color:#46484a;background:#46484a;border-radius:5px 5px 0 0;}
+.mypage_content .papers_guide .guide_content .guide_tab li.active button {color:#fff;border-color:#46484a;background:#1E3862;border-radius:5px 5px 0 0;}
 .mypage_content .papers_guide .guide_content .guide_table {display:none;}
 .mypage_content .papers_guide .guide_content .guide_table.active {display:block;}
 .mypage_content .papers_guide .guide_content table {width:100%;table-layout:fixed;}
@@ -546,7 +550,7 @@
 .mypage_content .tType1 tbody > tr#phone, 
 .mypage_content .tType1 tbody > tr#upload {visibility:collapse;} 
 .mypage_content .tType1 tbody tr td input[type=text] {width:340px;margin:0 2px 0 0;}
-.mypage_content .tType1 tbody tr td .calling .btnType {width:75px;height:40px;font-size:16px;letter-spacing:-0.025em;text-align:center;color:#222;border:1px solid #b1c6ee;background:#e8f0ff;border-radius:5px;}
+.mypage_content .tType1 tbody tr td .calling .btnType {width:75px;height:40px;font-size:16px;letter-spacing:-0.025em;text-align:center;color:#222;border:1px solid #d5d5d5;background:#f8f8f8;border-radius:5px;}
 .mypage_content .tType1 tbody tr td .summary {margin:0 0 0 10px;font-size:14px;line-height:40px;color:#e40000;}
 .mypage_content .tType1 tbody tr td .name_check input[type=radio] {width:18px;height:18px;margin-top:2px;}
 .mypage_content .tType1 tbody tr td .name_check input[type=radio] + label {font-size:18px;cursor:pointer;}
@@ -563,7 +567,7 @@
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 {height:100%;}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 tr {border:0 none;}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 thead th,
-.mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 tbody td {text-align:center;border-right:0 none;border-top:0 none;}
+.mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 tbody td {text-align:center;border-right:0 none;border-top:0 none;font-size:16px;}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 thead th:first-child,
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 tbody td:first-child {padding:0 0 0 10px;text-align:left;}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .tType4 tbody td {padding:0;}
@@ -575,7 +579,7 @@
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap.no_img_box:after {content:'';position:absolute;left:0;top:36.5px;width:100%;height:calc(100% - 36.5px);background:#f2f2f2;}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap.no_img_box .tType4 tbody td:first-child {padding:0;}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .file_info {position:absolute;left:0;bottom:0;width:100%;height:36px;padding:0 11px;font-size:15px;font-weight:300;line-height:36px;text-align:right;border-top:1px solid #ccc;background:#ededed;box-sizing:border-box;}
-.mypage_content .tType1 tbody tr td .upload_area .tb_wrap .file_info strong {font-weight:500;color:#002c9a;}
+.mypage_content .tType1 tbody tr td .upload_area .tb_wrap .file_info strong {font-weight:500;color:var(--primary-color);}
 .mypage_content .tType1 tbody tr td .upload_area .tb_wrap .file_info span {display:inline-block;width:1px;height:16px;margin:11px 18px 0;vertical-align:top;background:#666;}
 .mypage_content .tType1 tbody tr td .certify_in_body .noti {position:absolute;right:0;top:50%;font-size:16px;font-weight:300;letter-spacing:-0.025em;color:#a6a6a6;transform:translateY(-50%);}
 
@@ -589,7 +593,7 @@
 .security_login .security_set .title_wrap p{margin:3px 0 0 0;}
 .security_login .security_set .ip_add_wrap{display:flex;height:46px;font-size:15px;color:#222;background:#f4f4f5;border-radius:5px;padding:8px 14px;align-items:center;gap:10px;}
 .security_login .security_set .ip_add_wrap .btnType{height:30px;font-size:14px;}
-.security_login .security_set .ip_add_wrap b{font-weight:500;color:#002c9a;}
+.security_login .security_set .ip_add_wrap b{font-weight:500;color:var(--primary-color);}
 .security_login .input_text{width:98%;}
 .security_login .dashboard_title{padding: 0;}
 .security_login .dashboard_title .small_text{margin:0 0 0 6px;font-size:14px;font-weight:300;color:#666}
@@ -649,7 +653,7 @@
 .self_identfy_wrap>div {width: 64%; height: 390px; border: 3px solid #dddddd; border-radius: 5px; display: table; text-align: center;}
 .self_identfy_wrap p {font-size: 24px; font-weight: 500;}
 .self_identfy_wrap span {font-size: 17px; font-weight: 300; color: #555; margin: 12px 0 22px 0; display: inline-block; line-height: 1.5;}
-.self_identfy_wrap .indenfy_btn {width: 325px; height: 50px; border-radius: 5px; background-color: #002c9a; color: #fff; font-size: 18px;}
+.self_identfy_wrap .indenfy_btn {width: 325px; height: 50px; border-radius: 5px; background-color: var(--primary-color); color: #fff; font-size: 18px;}
 .self_identfy_wrap .indenfy_btn:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
 .self_identfy_wrap .indenfy_num {width: 325px; margin: 0 auto;}
 .self_identfy_wrap .indenfy_num>div input[type="text"] {background-color: #f2f2f2; height: 40px; padding: 0 20px; border-radius: 5px;}
@@ -677,7 +681,7 @@
 .reason_wrap .reason_checkbox>div input[type="text"].inputLight {background-color: #f2f2f2; border-radius: 5px; width: 370px; height: 36px; margin-left: 10px; font-size: 14px;} 
 .reason_wrap .reason_checkbox>div input[type="text"].inputLight::placeholder {font-size: 14px;}
 .reason_wrap .reason_checkbox>div:first-child {margin-right: 30px;}
-.reason_wrap .reason_checkbox>div:first-child button {background-color: #fbc72b; width: 100px; height: 36px; border-radius: 5px; margin-left: 10px ; font-size: 14px;}
+.reason_wrap .reason_checkbox>div:first-child button {background-color: var(--secondary-light-color); width: 100px; height: 36px; border-radius: 5px; margin-left: 10px ; font-size: 14px;}
 .reason_wrap .reason_checkbox>div:last-child button {width: 50px; height: 36px; border-radius: 5px; margin-left: 1px; background-color: #999; color: #fff; font-size: 14px;}
 .reason_wrap .pw_wrap {display: flex; padding-top: 30px;}
 .reason_wrap .pw_wrap p {line-height: 50px; width: 110px;}
@@ -695,7 +699,7 @@
 .list_title3.ver3::before {right: 250px;}
 .id_show {width: 100%; padding: 50px 0; border: 3px solid #efeff0; border-radius: 5px; box-sizing: border-box; text-align: center;}
 .id_show p {font-size: 26px; padding-bottom: 15px;}
-.id_show p span {color: #002c9a; font-weight: 600; font-size: 26px;}
+.id_show p span {color: var(--primary-color); font-weight: 600; font-size: 26px;}
 .id_show span {font-size: 16px; font-weight: 300; color: #999;}
 .id_show button {width: calc(100%/2 - 5px);height: 40px; border-radius: 5px; font-size: 16px; color: #fff;}
 .id_show button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.2);}
@@ -703,7 +707,7 @@
 .id_show .mem_btn3 {background-color: #eee; color: #333;}
 .id_show .idfind_certify {margin:48px 0 0;}
 .id_show .idfind_certify p {margin:0 0 6px;font-size:18px;color:#444;}
-.id_show .idfind_certify button {width:285px;color:#002c9a;}
+.id_show .idfind_certify button {width:285px;color:var(--primary-color);}
 /* ��й�ȣ �缳�� */
 .input_list.pw_set .input_list_item.emailWrap>div {width: calc(100% - 260px);}
 .input_list.pw_set .input_list_item.emailWrap .input_right .email_select {width: 250px;}
@@ -745,7 +749,7 @@
     /* mypage dashboard cont1 등급제 기간 추가 - 기간 지나면 이부분 삭제 */
     .my_dashboard_cont1 p {font-size: 17px;}
     .my_dashboard_cont1 p span {font-size: 22px;}
-    .my_dashboard .my_dashboard_cont1 button {font-size: 16px; padding: 0 8px; margin: 0 0 0 13px; color: #002c9a;}
+    .my_dashboard .my_dashboard_cont1 button {font-size: 16px; padding: 0 8px; margin: 0 0 0 13px; color: var(--primary-color);}
     .my_dashboard_cont1 .level_icon{margin: 0 22px 0 0;}
     .my_dashboard .send_price{margin: 0 -24px 0 0;}
     .my_dashboard .send_price .price_wrap{width: calc(104% - 88px);}
src/main/webapp/publish/css/popup.css
--- src/main/webapp/publish/css/popup.css
+++ src/main/webapp/publish/css/popup.css
@@ -2,11 +2,12 @@
 .ptEditer_wrap {width: 1100px; min-width: 950px; height: 850px; display: flex;position: relative;overflow: hidden;}
 /* photo edit - header */
 .ptEditer_header {width: 324px;height:100%;display: flex;}
+.ptEditer_header .search_box button{top:7px;}
 /* tab */
-.ptEditer_header .tabType3 {background-color: #fbc72b;width: 100px; height: 100%;text-align: center;}
-.ptEditer_header .tabType3 .tab {width: 100%; height: 108px;margin: 0 auto; display: table;border-top: 1px solid #fcd255;border-bottom: 1px solid #d6a925;}
+.ptEditer_header .tabType3 {background-color: var(--secondary-color);width: 100px; height: 100%;text-align: center;}
+.ptEditer_header .tabType3 .tab {width: 100%; height: 108px;margin: 0 auto; display: table;border-top: 1px solid #3C9DCE;border-bottom: 1px solid #3C9DCE;}
 .ptEditer_header .tabType3 .tab:first-child {border-top: 0;}
-.ptEditer_header .tabType3 .tab a {display: table-cell;vertical-align: middle;}
+.ptEditer_header .tabType3 .tab a {display: table-cell;vertical-align: middle; color:#fff;}
 .ptEditer_header .tabType3 .tab span {display: block;padding-top: 12px; line-height: 1.3;}
 .ptEditer_header .tabType3 .tab .myPhoto {background-image: url(/publish/images/popup/editer_tab1.png);width: 28px;height: 28px;}
 .ptEditer_header .tabType3 .tab .recomTemplate {background-image: url(/publish/images/popup/editer_tab2.png);width: 25px;height: 28px;}
@@ -22,7 +23,7 @@
 .ptEditer_header .header_cont {display: none;flex-basis: calc(100% - 100px);padding: 24px 20px 12px 20px;box-sizing: border-box;background-color: #222;}
 .ptEditer_header .header_cont.current {display: block;/*max-width: 220px;*/}
 /* tab disable 시 */
-.ptEditer_header .tabType3 .tab.disable {background-color: #dbae2a; border-bottom: 1px solid #dbae2a; border-bottom: 1px solid #ba9424}
+.ptEditer_header .tabType3 .tab.disable {background-color:var(--secondary-color); border-bottom: 1px solid #A0D2EB;}
 .ptEditer_header .tabType3 .tab.disable i {opacity: 0.3;}
 .ptEditer_header .tabType3 .tab.disable span {opacity: 0.3;}
 
@@ -44,7 +45,7 @@
 .header_cont .search_box {margin: 0 0 10px 0;position: relative;}
 .header_cont .search_box input[type="text"] {width: 100%;height: 34px;border-radius: 3px;margin-bottom: 5px;font-size: 14px;}
 .header_cont .search_box button {position: absolute;top: 5px; right: 10px;}
-.header_cont .search_box select {width: 100%;height: 34px;padding-left: 10px; border-radius: 3px; border: 1px solid #fbc72b; background-color: #434343;color: #fff;font-size: 14px;background-image: url(/publish/images/popup/select.png);background-repeat: no-repeat;background-position: 93% center;}
+.header_cont .search_box select {width: 100%;height: 34px;padding-left: 10px; border-radius: 3px; border: 1px solid var(--secondary-light-color); background-color: #434343;color: #fff;font-size: 14px;background-image: url(/publish/images/popup/select.png);background-repeat: no-repeat;background-position: 93% center;}
 .header_cont.recomTem_cont .contWrap li img {width: 100%; border-radius: 3px;}
 /* header cont - 스티커 */
 .sticker_cont .contWrap_scroll {height: 639px;}
@@ -54,7 +55,7 @@
 .header_cont.sticker_cont .contWrap li:hover {background-color: rgba(255,255,255,0.8);}
 /* header cont - 편집도구 */
 .header_cont .search_box2 {margin: 0 0 10px 0; position: relative;}
-.header_cont.photoEdit_cont button.edit_btn {width: 100%; height: 34px; border-radius: 3px; border: 1px solid #fbc72b; color: #fff; background-color: rgba(255,255,255,0.15)  ; font-size: 14px; font-weight: 300;}
+.header_cont.photoEdit_cont button.edit_btn {width: 100%; height: 34px; border-radius: 3px; border: 1px solid var(--secondary-light-color); color: #fff; background-color: rgba(255,255,255,0.15)  ; font-size: 14px; font-weight: 300;}
 .header_cont.photoEdit_cont button.edit_btn:hover {background-color: rgba(255,255,255,0.2);}
 .header_cont.photoEdit_cont button.edit_btn i { background-repeat: no-repeat; margin: 0 7px 2px 0;} 
 .header_cont.photoEdit_cont button.edit_btn i.put_text {background-image: url(/publish/images/popup/put_text.png); width: 13px; height: 16px;} /* 텍스트  */
@@ -83,7 +84,7 @@
 .header_cont.photoEdit_cont .editContWrap.text li:nth-child(6) i {background-image: url(/publish/images/popup/photo_edit_text6.png);width: 27px;height: 27px;}
 /* hover 시 */
 .header_cont.photoEdit_cont .editContWrap.text li.active,
-.header_cont.photoEdit_cont .editContWrap.text li:hover {border: 1px solid #fbc72b;}
+.header_cont.photoEdit_cont .editContWrap.text li:hover {border: 1px solid var(--secondary-light-color);}
 .header_cont.photoEdit_cont .editContWrap.text li.active span,
 .header_cont.photoEdit_cont .editContWrap.text li:hover span {color: #fff;}
 .header_cont.photoEdit_cont .editContWrap.text li:nth-child(1).active i,
@@ -144,7 +145,7 @@
 .header_cont.photoEdit_cont .editContWrap2 li:nth-child(7):hover i::after {background-image: url(/publish/images/popup/photo_edit_light3_hover.png);}
 .header_cont.photoEdit_cont .editContWrap2 li:nth-child(8):hover i::after {background-image: url(/publish/images/popup/photo_edit_light4_hover.png);}
 
-.header_cont.photoEdit_cont .set_btn .set_app {background-color: #fbc72b;}
+.header_cont.photoEdit_cont .set_btn .set_app {background-color: var(--secondary-light-color);}
 .header_cont.photoEdit_cont .set_btn .set_app i {background-image: url(/publish/images/popup/check.png);width: 11px; height: 9px; margin-right: 3px;}
 .header_cont.photoEdit_cont .set_btn .set_cancel {background-color: #414141; color: #fff; margin-left: 3px;}
 .header_cont.photoEdit_cont .set_btn .set_cancel i {background-image: url(/publish/images/popup/close2.png);width: 9px; height: 9px;margin-right: 3px;}
@@ -153,15 +154,15 @@
 /* preview image (이미지 미리보기) */
 .image_preview {position: absolute; width: 140px; height: 100%; padding: 25px 20px; background-color: rgba(0,0,0,0.35); box-sizing: border-box;}
 .image_preview .preview {text-align: right; margin-bottom: 12px; position: relative;}
-.image_preview .preview.on::after {position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100px; height: 150px; border: 3px solid #fbc72b; box-sizing: border-box; z-index: 1}
+.image_preview .preview.on::after {position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100px; height: 150px; border: 3px solid var(--secondary-color); box-sizing: border-box; z-index: 1}
 .image_preview .preview .preview_img_wrap {width: 100px; height: 150px; box-sizing: border-box; position: relative; overflow: hidden;}
 /* .image_preview .preview .preview_img_wrap.on {position: relative;}
-.image_preview .preview .preview_img_wrap.on::after {position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100px; height: 150px; border: 3px solid #fbc72b; box-sizing: border-box;} */
+.image_preview .preview .preview_img_wrap.on::after {position: absolute; content: ""; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100px; height: 150px; border: 3px solid var(--secondary-light-color); box-sizing: border-box;} */
 /* 이미지 미리보기 숫자표시 */
 .image_preview .preview .img_number {background-image: url(/publish/images/popup/img_number_bg.png); background-repeat: no-repeat; width: 46px; height: 46px; position: absolute; top: 0; left: 0;z-index: 1; font-family: 'pass', 'Roboto', Helvetica, Arial, sans-serif ; font-weight: 600; font-size: 15px;}
 .image_preview .preview .img_number span {position: absolute; top: 3px; left: 5px;}
 
-/* .image_preview .preview .img_number { width: 0; height: 0; border-bottom: 40px solid transparent; border-left: 40px solid #fbc72b; position: absolute; top: 0; left: 0;} */
+/* .image_preview .preview .img_number { width: 0; height: 0; border-bottom: 40px solid transparent; border-left: 40px solid var(--secondary-light-color); position: absolute; top: 0; left: 0;} */
 /* .image_preview .preview .img_number::after {top: 5px; left: 6px; position: absolute; font-size: 15px; font-family: 'pass', 'Roboto', Helvetica, Arial, sans-serif ; font-weight: 600;z-index: 2;} */
 /* .image_preview .preview:nth-child(1) .img_number::after {content: "1"; }
 .image_preview .preview:nth-child(2) .img_number::after {content: "2"; }
@@ -202,8 +203,8 @@
 /* footer right */
 .ptEditer_footer .footer_right {float: right;}
 .ptEditer_footer .footer_right button {height: 36px;padding: 0 13px;border-radius: 3px;margin-left: 2px; font-size: 16px;}
-.ptEditer_footer .footer_right button:first-child {background-color: #fbc72b;}
-.ptEditer_footer .footer_right button:first-child:hover {background-color:#f8bd0e;box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
+.ptEditer_footer .footer_right button:first-child {background-color: var(--secondary-color);color:#fff;}
+.ptEditer_footer .footer_right button:first-child:hover {background-color:var(--secondary-color);box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
 .ptEditer_footer .footer_right button:last-child {background-color: #757b86;color: #fff;font-weight: 200;}
 .ptEditer_footer .footer_right button:last-child:hover {background-color:#6a6c72;box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
 .ptEditer_footer .footer_right .footer_close {background-image: url(/publish/images/popup/close.png);width: 12px;height: 12px;margin-right: 5px; margin-bottom: 2px;}
src/main/webapp/publish/css/popupLayer.css
--- src/main/webapp/publish/css/popupLayer.css
+++ src/main/webapp/publish/css/popupLayer.css
@@ -1,7 +1,7 @@
 /* 공통영역 */
 .tooltip-wrap {position: relative; z-index: 100;}
 .popup-com {display: none;position: fixed; border-radius: 10px;background-color: #fff;box-shadow: 5px 5px 15px rgba(0,0,0,0.5); overflow: hidden;opacity:0;transition:opacity 0.3s;}
-.popup-com .popup_heading {background-color: #fbc72b; position: relative; padding: 15px 20px; }
+.popup-com .popup_heading {background-color: var(--secondary-color); color:#fff; position: relative; padding: 15px 20px; }
 .popup-com .popup_heading p {font-size: 22px; font-weight: 600;}
 .popup-com .popup_heading button {position: absolute; top: 50%; transform: translateY(-50%); right: 20px;}
 .popup-com .titBox>button {height: 36px;}
@@ -9,7 +9,7 @@
 .popup-com {overflow-y:auto;max-height:calc(100% - 100px);}
 .popup-com::-webkit-scrollbar {width:5px;}
 .popup-com::-webkit-scrollbar-track {border-radius:3px;}
-.popup-com::-webkit-scrollbar-thumb {background:#002c9a;border-radius:3px;}
+.popup-com::-webkit-scrollbar-thumb {background:var(--primary-color);border-radius:3px;}
 
 .mask {left:-9999%;top:-9999%;}
 .mask.on {overflow:hidden;position:fixed;left:0;top:0;width:100%;min-width:1920px;height:100%;background: rgba(0,0,0,0.5);z-index:99;}
@@ -19,8 +19,8 @@
 .popup_search_wrap.grayborder{border: 1px solid #d5d5d5;}
 .popup_search_wrap.grayfill{background-color: #f2f2f2;}
 
-.popup_button_type{height: 40px; padding: 0 15px; border-radius: 5px; font-size: 16px; color: #fff; background-color: #002c9a;}
-.popup_search_wrap.type2 button{position: inherit; transform: none; margin: 0 4px;}
+.popup_button_type{height: 40px; padding: 0 15px; border-radius: 5px; font-size: 16px; color: #fff; background-color: var(--primary-color);}
+.popup_search_wrap.type2 button{position: inherit; transform: none; margin: 0 4px; padding:0 15px;}
 .popup_search_wrap.type2 button:first-child{margin-left: 0;}
 .popup_search_wrap.type2 button:last-child{margin-right: 0;}
 
@@ -42,7 +42,7 @@
 /* 메인 팝업 */
 /* .layer_popup_wrap{position: fixed; width: 100%; height: 100%; z-index: 999; background-color: rgba(0,0,0,0.5); left: 0; top: 0;} */
 .layer_popup_wrap{position:fixed;left:50%;top:39%;margin:60px 0 0;z-index:999;transform:translate(-50%,-50%);}
-.layer_popup_wrap .layer_popup{margin: 0 30px;box-shadow:5px 5px 15px rgba(0,0,0,0.5);}
+.layer_popup_wrap .layer_popup{min-width:300px;margin: 0 30px;box-shadow:5px 5px 15px rgba(0,0,0,0.5);}
 .layer_popup_wrap .layer_popup:first-child{margin-left: 0;}
 .layer_popup_wrap .layer_popup:last-child{margin-right: 0;}
 .layer_popup_wrap .popup_inner{position: relative; display: flex; width: 100%; height: 100%; vertical-align: middle; justify-content: center; align-items: center;}
@@ -52,7 +52,7 @@
 .layer_popup_wrap input[type="checkbox"]+label{border-radius: 5px;display: inline-block; position: relative; cursor: pointer; vertical-align: middle; margin: 5px 0 0 0; padding:0 0 0 30px; font-family: 'GmarketSansMedium';}
 .layer_popup_wrap input[type="checkbox"]+label::after{position: absolute;content: "";display: inline-block;width:18px;height: 18px;background-color: #fff;background-repeat: no-repeat;top: -4px;left: 0;border-radius: 5px; border: 1px solid #000;}
 .layer_popup_wrap input[type="checkbox"]:checked+label{position: relative;}
-.layer_popup_wrap input[type="checkbox"]:checked+label::after{background-image: url(/publish/images/event/icon_checked01.png);background-position: center;background-color: #fbc72b;}
+.layer_popup_wrap input[type="checkbox"]:checked+label::after{background-image: url(/publish/images/event/icon_checked01.png);background-position: center;background-color: var(--secondary-light-color);}
 .layer_popup_wrap02{position:fixed;left:50%;top:50%;margin:60px 0 0;z-index:999;transform:translate(-50%,-50%);}
 .layer_popup_wrap02 .layer_popup{margin: 0 30px;box-shadow:5px 5px 15px rgba(0,0,0,0.5);}
 .layer_popup_wrap02 .layer_popup:first-child{margin-left: 0;}
@@ -70,7 +70,7 @@
 .layer_tType2 tbody tr td {font-size: 14px; color: #666; height: 30px; line-height: 30px; border-bottom: 1px solid #e5e6e7; background-color: #f2f2f2;}
 .layer_tType2 tbody tr:last-child td {border-bottom: 0;}
 .layer_tType2 tbody tr.error * {color: #e40000;}
-.layer_tType2 tbody tr td .pop_select {font-size: 13px; font-weight: 300; background-color: #fff; width: 90%; border-radius: 3px; background-image: url(/publish/images/content/select_s.png);background-repeat: no-repeat;background-position: right 5px top 50%;font-family: 'Noto Sans KR', sans-serif; cursor: pointer; padding: 3px 5px;}
+.layer_tType2 tbody tr td .pop_select {font-size: 13px; font-weight: 300; background-color: #fff; width: 90%; border-radius: 3px; background-image: url(/publish/images/content/select_s.png);background-repeat: no-repeat;background-position: right 5px top 50%;font-family: 'Pretendard'; cursor: pointer; padding: 3px 5px;}
 
 /* 팝업 table */
 /* thead */
@@ -96,7 +96,7 @@
 .adr_excel .adr_hd>div,.adr_excel .adr_bd>div{width:calc((100% - 40px)/7);}
 .adr_excel .adr_hd>div:nth-child(1),.adr_excel .adr_bd>div:nth-child(1){width:40px;}
 .adr_excel .adr_hd.select_adr_hd{background:#e0e0e0;}
-.adr_excel .adr_hd>div select{width:calc(100% - 8px);height:36px;background:transparent url(/publish/images/select_search.png) no-repeat 90% 15px;background-size:16px auto;margin:-8px 0 0 0;border:0;text-align:center;line-height:1.3;}
+.adr_excel .adr_hd>div select{width:calc(100% - 8px);height:36px;background:transparent url(/publish/images/select_search.png) no-repeat 90% 12px;margin:0;border:0;text-align:center;line-height:1.3;}
 .adr_excel .adr_hd>div:last-child::after{display:none;}
 .adr_excel .adr_hd.msg>div:first-child::after{display:none;}
 
@@ -132,7 +132,7 @@
 .adr_excel .adr_bd>div {height: 34px; padding: 0 5px; line-height: 34px; border-bottom: 1px solid #e5e5e5; text-align: center; color: #666; font-weight: 300; box-sizing: border-box;}
 .adr_excel .adr_bd:last-child>div {border-bottom: 0;}
 .adr_excel .adr_bd.error * {color: #e40000 !important; font-weight: 400;}
-/* .excel_paste .adr_bd select {font-size: 13px; font-weight: 300; background-color: #fff; width: 100%; border-radius: 3px; background-image: url(/publish/images/content/select_s.png);background-repeat: no-repeat;background-position: right 5px top 50%;font-family: 'Noto Sans KR', sans-serif; cursor: pointer; padding: 0 5px;} */
+/* .excel_paste .adr_bd select {font-size: 13px; font-weight: 300; background-color: #fff; width: 100%; border-radius: 3px; background-image: url(/publish/images/content/select_s.png);background-repeat: no-repeat;background-position: right 5px top 50%;font-family: 'Pretendard'; cursor: pointer; padding: 0 5px;} */
 
 /*// 팝업 table */
 
@@ -154,7 +154,7 @@
 .header_cont .search_box {margin: 0 0 10px 0;position: relative;}
 .header_cont .search_box input[type="text"] {width: 100%;height: 34px;border-radius: 3px;margin-bottom: 5px;font-size: 14px;}
 .header_cont .search_box button {position: absolute;top: 5px; right: 10px;}
-.header_cont .search_box select {width: 100%;height: 34px;padding-left: 10px; border-radius: 3px; border: 1px solid #fbc72b; background-color: #434343;color: #fff;font-size: 14px;background-image: url(/publish/images/popup/select.png);background-repeat: no-repeat;background-position: 93% center;}
+.header_cont .search_box select {width: 100%;height: 34px;padding-left: 10px; border-radius: 3px; border: 1px solid var(--secondary-light-color); background-color: #434343;color: #fff;font-size: 14px;background-image: url(/publish/images/popup/select.png);background-repeat: no-repeat;background-position: 93% center;}
 .header_cont.recomTem_cont .contWrap li img {width: 100%; border-radius: 3px;}
 .header_cont .slectImg_cont {overflow:hidden;display:flex;height:270px;margin:0 0 10px;align-items:center;background:#fff;border-radius:5px;}
 .header_cont .slectImg_cont img {width:100%;}
@@ -214,7 +214,7 @@
 .custom_layer .body_cont .custom_btn {width: 226px; display: flex; justify-content: space-between; margin: 18px auto 0 auto;}
 .custom_layer .body_cont .custom_btn button {width: calc(100%/2 - 3px); height: 42px; color: #fff; font-size: 18px; border-radius: 5px;} 
 .custom_layer .body_cont .custom_btn button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.custom_layer .body_cont .custom_btn button:first-child {background-color: #002c9a;}
+.custom_layer .body_cont .custom_btn button:first-child {background-color: var(--primary-color);}
 .custom_layer .body_cont .custom_btn button:last-child {background-color: #999;}
 /* //맞춤제작 */
 
@@ -231,7 +231,7 @@
 /* 임시 버튼 */
 .popup_btn_wrap {height: 500px; margin: 50px;}
 .popup_btn {display: flex; justify-content: center;}
-.popup_btn button {height: 42px; padding: 0 28px; border-radius: 5px; background-color: #002c9a; font-size: 16px; color: #fff;}
+.popup_btn button {height: 42px; padding: 0 28px; border-radius: 5px; background-color: var(--primary-color); font-size: 16px; color: #fff;}
 .popup_btn button i {background-image: url(/publish/images/content/customReq.png); width: 22px; height: 18px; margin: 0 10px 3px 0 ;}
 .popup_btn button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12); background-color: #002788;}
 
@@ -243,11 +243,11 @@
 .popup_btn_wrap2 {width: 226px; margin: 30px auto 0 auto; display: flex; justify-content: center;}
 .popup_btn_wrap2 button {width: calc(100%/2 - 3.5px); height: 42px; border-radius: 5px;color: #fff; font-size: 18px; font-weight: 300;} 
 .popup_btn_wrap2 button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
-.popup_btn_wrap2 button:first-child {background-color: #002c9a; margin-right: 6px}
+.popup_btn_wrap2 button:first-child {background-color: var(--primary-color); margin-right: 6px}
 .popup_btn_wrap2 button:first-child:only-child {margin-right:0}
-.popup_btn_wrap2 button:nth-child(2) {background-color: #002c9a; margin-right: 6px}
+.popup_btn_wrap2 button:nth-child(2) {background-color: var(--primary-color); margin-right: 6px}
 .popup_btn_wrap2 button:last-child {background-color: #999;}
-.popup_btn_wrap2 button.check_btn_pop {background-color: #002c9a;}
+.popup_btn_wrap2 button.check_btn_pop {background-color: var(--primary-color);}
 
 .popup_btn_wrap3 {text-align: center;}
 .popup_btn_wrap3 button {width: 120px; height: 42px; font-size: 18px;}
@@ -335,13 +335,13 @@
 .send_miniPop.spc_character .tab_character a{border: 0; font-size: 14px; letter-spacing: -1px; margin-right: 10px; width: auto; height: auto;}
 .send_miniPop.spc_character .tab_character a:last-child{margin-right: 0;}
 .send_miniPop.spc_character .tab_character a:nth-child(5n){margin-right: 10px;}
-.send_miniPop.spc_character .tab_character a.on{color: #002c9a; font-weight: 600;}
+.send_miniPop.spc_character .tab_character a.on{color: var(--primary-color); font-weight: 600;}
 
 .send_miniPop.spc_character .cnt_character {display: none;}
 .send_miniPop.spc_character.kakao_emoticon .cnt_character {display: block; height: 200px; border: 1px solid #e5e5e5; border-radius: 5px;}
 .send_miniPop.spc_character .cnt_character.on{display: block; border: 1px solid #e5e5e5; border-radius: 5px; width: calc(100% - 20px); margin: 0 auto; height: 200px;}
 .send_miniPop.spc_character .cnt_character .box_character{display: flex; flex-flow: wrap; justify-content: flex-start; box-sizing: border-box;}
-.send_miniPop.spc_character .cnt_character a {width: calc((100% - 7px)/7); border: 1px solid #e5e5e5;  height: 30px; text-align: center; margin-left: -1px; margin-top: -1px; display: flex; align-items: center; justify-content: center; font-size: 15px; letter-spacing: -1px; font-weight: 500; font-family: 'Noto Sans KR', sans-serif;}
+.send_miniPop.spc_character .cnt_character a {width: calc((100% - 7px)/7); border: 1px solid #e5e5e5;  height: 30px; text-align: center; margin-left: -1px; margin-top: -1px; display: flex; align-items: center; justify-content: center; font-size: 15px; letter-spacing: -1px; font-weight: 500; font-family: 'Pretendard';}
 .send_miniPop.spc_character.kakao_emoticon a img{width: 60%;}
 .send_miniPop.spc_character .cnt_character a:hover{background-color: #f5f5f5;}
 .send_miniPop.spc_character .cnt_character.emt_character a{width: calc(100%/3.04); letter-spacing: 0; font-size: 13px; letter-spacing: -1px;}
@@ -352,7 +352,7 @@
 /* 특수문자 일괄변환 */
 .send_miniPop.convers>div {width: 100%;}
 .send_miniPop.convers .convers_top {padding: 15px;box-sizing: border-box; text-align: center;}
-.send_miniPop.convers .convers_top span {background-color: #2a57c8; color: #fff; border-radius: 12.5px; font-size: 15px; font-weight: 500; padding: 3px 9px; letter-spacing: -0.5px;}
+.send_miniPop.convers .convers_top span {display:flex;height:27px;padding:0 12px;border-radius:40px;font-size:15px;font-weight:500;color:#fff;background:var(--primary-color);justify-content:center;align-items:center;}
 .send_miniPop.convers .convers_top p {font-size: 14px; color: #555; font-weight: 300; line-height: 1.3; letter-spacing: -0.5px; padding-top: 10px; text-align: left;}
 .send_miniPop.convers a {color: #222; font-weight: 300; padding: 12px 0; text-align: center;}
 .send_miniPop.convers .convers_middle {border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
@@ -365,12 +365,12 @@
 .charge01_layer{width: 540px;}
 .charge01_layer .layer_in{padding: 20px; box-sizing: border-box;}
 .charge01_layer .area_text{margin: 0 auto 20px auto; text-align: center; font-size: 20px; font-weight: 300; color: #222; line-height: 1.5;}
-.charge01_layer .area_text span{font-weight: normal; color: #002c9a;}
+.charge01_layer .area_text span{font-weight: normal; color: var(--primary-color);}
 .charge01_layer .popup_cont ul li{height: 105px; border: 1px solid #d5d5d5; border-radius: 5px;  margin-bottom: 10px; box-sizing: border-box;}
 .charge01_layer .popup_cont ul li button {width: 100%; padding: 18px 20px; display: flex; font-size: 17px; color: #555; letter-spacing: -0.5px; align-items: center; line-height: 1.3; font-weight: 300;box-sizing: border-box;}
-.charge01_layer .popup_cont ul li:hover{border: 3px solid #fbc72b;}
+.charge01_layer .popup_cont ul li:hover{border: 3px solid var(--secondary-light-color);}
 .charge01_layer .popup_cont ul li i{width: 66px; height: 66px; background-color: #e8e9eb; border-radius: 100%; margin-right: 25px; background-position: center; z-index: -1;}
-.charge01_layer .popup_cont ul li:hover i{background-color: #fbc72b;}
+.charge01_layer .popup_cont ul li:hover i{background-color: var(--secondary-light-color);}
 .charge01_layer .popup_cont ul li:nth-child(1) i{background-image: url(/publish/images/popup/icon_charge1.png);}
 .charge01_layer .popup_cont ul li:nth-child(2) i{background-image: url(/publish/images/popup/icon_charge2.png);}
 .charge01_layer .popup_cont ul li:nth-child(3) i{background-image: url(/publish/images/popup/icon_charge3.png);}
@@ -407,9 +407,9 @@
 /* 주소록 대량등록 */
 .pop_more_cont .titBox {height: 64px; margin: 15px 0 30px 0; overflow: hidden;}
 .pop_more_cont .titBox p:nth-child(3) {padding: 2px 0 10px 0;}
-.pop_more_wrap {text-align: center;}
+.pop_more_wrap {text-align: center;margin:-30px 0 30px 0;}
 .pop_more i {background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; width: 16px; height: 18px; margin-left: 8px; margin-top:4px; opacity: 0.7;}
-.pop_more {background-image: url(/publish/images/pop_more.png); background-repeat: no-repeat; background-size: cover; width: 145px; height: 26px; font-size: 15px; color: #555; margin-top: -60px; background-color: #fff;position:relative;z-index:1;}
+.pop_more {background-image: url(/publish/images/pop_more.png); background-repeat: no-repeat; background-size: cover; width: 145px; height: 26px; font-size: 15px; color: #555; margin-top: -2px; background-color: #fff;position:relative;z-index:1;}
 /* 더보기 클릭 시 */
 .pop_more_cont.pop_more_click .titBox {height: 100%;}
 .pop_more_cont.pop_more_click .titBox p:nth-child(3) {padding: 2px 0;}
@@ -448,8 +448,8 @@
 
 /* 붙여넣기 */
 .req_area { margin-bottom: 15px; position: relative;}
-.req_area textarea {background-color: #f2f2f2; height: 160px; padding: 25px 30px; border-radius: 5px; border: 1px solid transparent; box-sizing: border-box; font-size: 14px; color: #222; font-weight: 300; font-family: 'Noto Sans KR', sans-serif;}
-.req_area .text_box {background-color: #f2f2f2; padding: 25px 30px; border-radius: 5px; border: 1px solid transparent; box-sizing: border-box; font-size: 14px; line-height:20px; color: #888; font-weight: 300; font-family: 'Noto Sans KR', sans-serif;}
+.req_area textarea {background-color: #f2f2f2; height: 160px; padding: 25px 30px; border-radius: 5px; border: 1px solid transparent; box-sizing: border-box; font-size: 14px; color: #222; font-weight: 300; font-family: 'Pretendard';}
+.req_area .text_box {background-color: #f2f2f2; padding: 25px 30px; border-radius: 5px; border: 1px solid transparent; box-sizing: border-box; font-size: 14px; line-height:20px; color: #888; font-weight: 300; font-family: 'Pretendard';}
 .req_area.active p {display: none;}
 .req_area p {width: 100%; padding: 0 30px; font-size: 14px; color: #888; line-height: 1.8; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); box-sizing: border-box; display: block;}
 .adr_popup_btn {text-align: center;}
@@ -461,7 +461,7 @@
 .select_group ul {display: flex; margin-top: 12px; flex-flow: wrap;}
 .select_group ul li { height: 34px; padding: 0 40px 0 15px; background-color: #fff; border-radius: 5px; margin-right: 5px; margin-top: 5px; font-size: 16px; font-weight: 300; line-height: 34px; position: relative; box-sizing: border-box;}
 .select_group ul li:nth-child(3n) {margin-right: 0;}
-.select_group ul li span {color: #002c9a; font-weight: 400;}
+.select_group ul li span {color: var(--primary-color); font-weight: 400;}
 .select_group ul li button {position: absolute; right: 15px; top: 6px;}
 
 .gorup_join_cont .group_input {background-color: #f2f2f2; padding: 15px 20px; border-radius: 5px; display: flex; box-sizing: border-box; margin-top: 15px;}
@@ -473,8 +473,8 @@
 .select_group2 {background-color: #f2f2f2; padding: 20px; border-radius: 5px; box-sizing: border-box;}
 .select_group2 ul li {height: 32px; padding: 0 40px 0 15px; background-color: #fff; border-radius: 5px; margin-top: 5px; font-size: 16px; font-weight: 300; line-height: 34px; position: relative; box-sizing: border-box;}
 .select_group2 ul li:first-child {margin-top: 0;}
-.select_group2 ul li span {color: #002c9a; font-weight: 400;}
-.select_group2 ul li p {position: absolute; right: 15px; top: -1px; font-size: 16px; font-weight: 500; color: #002c9a;}
+.select_group2 ul li span {color: var(--primary-color); font-weight: 400;}
+.select_group2 ul li p {position: absolute; right: 15px; top: -1px; font-size: 16px; font-weight: 500; color: var(--primary-color);}
 .select_group_info {font-size: 14px; color: #e40000; margin-top: 8px;}
 .adr_popup08 .tb_wrap {min-height: auto;}
 .adr_popup08 .tType4 tbody tr:last-child td {border-bottom: 0;}
@@ -543,7 +543,7 @@
 
 /* 주소록 불러오기 */
 /* 주소록 관리 - 주소록 관리 */
-.titBox button.adr_admin {color: #002c9a; padding: 0 10px; border: 1px solid #002c9a;}
+.titBox button.adr_admin {color: var(--primary-color); padding: 0 10px; border: 1px solid var(--primary-color);}
 .adr_wrap {display: flex; justify-content: space-between;}
 /* 왼쪽 */
 .adr_pop_left {width: 220px;}
@@ -558,11 +558,11 @@
 .adr_cb_wrap2>p {line-height: 1.3; width: 100%; padding-left: 25px; position: relative; letter-spacing: -0.5px; font-size: 14px;}
 .adr_cb_wrap2 p img {margin:0 4px 2px 2px; position: absolute; left: 0; top: 3px;}
 .adr_cb_wrap2.active {background-color: #e8e8e8;}
-.adr_cb_wrap2.active>p {color: #002c9a; font-weight: 500; cursor: default;} 
-.adr_cb_wrap2 span span {color: #002c9a; font-weight: 500;}
+.adr_cb_wrap2.active>p {color: var(--primary-color); font-weight: 500; cursor: default;} 
+.adr_cb_wrap2 span span {color: var(--primary-color); font-weight: 500;}
 
 /* .adr_cb_wrap2.total_adr_cb_wrap{background:#e5e5e5;border-radius:5px 5px 0 0;font-size:15px;justify-content:space-between;align-items:center;} */
-/* .adr_cb_wrap2.total_adr_cb_wrap p{color:#002c9a;font-weight:500;text-align:right;font-size:15px;} */
+/* .adr_cb_wrap2.total_adr_cb_wrap p{color:var(--primary-color);font-weight:500;text-align:right;font-size:15px;} */
 /* .adr_cb_wrap2.total_adr_cb_wrap span{color:#444;font-weight:300;} */
 
 .adr_call_popup .popup_btn_wrap2 button{width:auto;min-width:100px;padding:0 10px;}
@@ -668,7 +668,7 @@
 .adpop1_top>div>p {font-size: 34px; font-family: 'GmarketSansBold'; padding-bottom: 15px;}
 .adpop1_top>div>div {background-color: #fff; padding: 20px; border-radius: 10px; box-sizing: border-box;}
 .adpop1_top>div>div>p {font-size: 15px; position: relative; padding-left: 30px; margin-bottom: 15px; letter-spacing: -0.5px; line-height: 1.3; color: #333;}
-.adpop1_top>div>div>p::after {font-family: 'GmarketSansBold'; font-size: 15px; color: #002c9a; position: absolute; left: 0; top: 2px;}
+.adpop1_top>div>div>p::after {font-family: 'GmarketSansBold'; font-size: 15px; color: var(--primary-color); position: absolute; left: 0; top: 2px;}
 .adpop1_top>div>div>p:nth-child(1)::after {content: "01";}
 .adpop1_top>div>div>p:nth-child(2)::after {content: "02";}
 .adpop1_top>div>div>p:nth-child(3)::after {content: "03";}
@@ -680,22 +680,22 @@
 .adpop1_middle {padding: 25px 30px; border: 3px solid #ddd; border-radius: 5px; margin: 0 0 30px 0; box-sizing: border-box; text-align: center;}
 .adpop1_middle p {font-size: 16px; line-height: 1.5; letter-spacing: -0.5px;}
 .adpop1_middle a,
-.adpop1_middle button {height: 40px; padding: 0 44px 0 20px; border-radius: 5px; border: 1px solid #002c9a; margin: 15px 0 10px 0; color: #002c9a; font-size: 16px; background-image: url(/publish/images/content/adpop_arrow.png); background-repeat: no-repeat; background-position: right 20px top 50%;display:inline-block;line-height:38px;}
+.adpop1_middle button {height: 40px; padding: 0 44px 0 20px; border-radius: 5px; border: 1px solid var(--primary-color); margin: 15px 0 10px 0; color: var(--primary-color); font-size: 16px; background-image: url(/publish/images/content/adpop_arrow.png); background-repeat: no-repeat; background-position: right 20px top 50%;display:inline-block;line-height:38px;}
 .adpop1_middle span {display: block; font-size: 14px; font-weight: 300; color: #666;}
 .adpop1_bottom {border-top: 2px solid #000; border-bottom: 1px solid #d5d5d5;}
 .adpop1_bottom>p {font-size: 18px; font-family: 'GmarketSansMedium'; position: relative; padding: 20px 0 20px 35px;}
-.adpop1_bottom>p::after {content: "Q1.";font-size: 18px; font-family: 'GmarketSansMedium'; position: absolute; left: 0; top: 20px; color: #002c9a;}
+.adpop1_bottom>p::after {content: "Q1.";font-size: 18px; font-family: 'GmarketSansMedium'; position: absolute; left: 0; top: 20px; color: var(--primary-color);}
 .adpop1_bottom>div {background-color: #f5f5f5; padding: 25px 30px; border-radius: 5px; box-sizing: border-box; letter-spacing: -0.5px;}
 .adpop1_bottom>div>div>p {padding-left: 15px;}
-.adpop1_bottom>div>div>p:first-child {font-size: 18px; font-weight: 500; color: #002c9a; position: relative;}
-.adpop1_bottom>div>div>p:first-child::after {content: ""; background-color: #002c9a; width: 5px; height: 5px; border-radius: 50%; position: absolute; top: 7px; left: 0;}
+.adpop1_bottom>div>div>p:first-child {font-size: 18px; font-weight: 500; color: var(--primary-color); position: relative;}
+.adpop1_bottom>div>div>p:first-child::after {content: ""; background-color: var(--primary-color); width: 5px; height: 5px; border-radius: 50%; position: absolute; top: 7px; left: 0;}
 .adpop1_bottom>div>div>p:not(:first-child) {font-size: 16px; font-weight: 300; color: #666; line-height: 1.5; padding-top: 10px;}
 .adpop1_bottom>div>div:nth-child(1) {margin-bottom: 20px;}
 .adpop1_bottom>div>div:nth-child(2) {margin-bottom: 20px;}
 .adpop1_bottom .adpop1_bottom_in {background-color: #fff; padding: 20px 15px; border-radius: 10px; box-sizing: border-box;}
 .adpop1_bottom .adpop1_bottom_in>p {font-size: 16px !important; color: #222 !important; padding-bottom: 18px; font-weight: 500; position: relative;}
 .adpop1_bottom .adpop1_bottom_in>div:not(.adpop1_bottom_req) {display: flex;}
-.adpop1_bottom .adpop1_bottom_in span {height: 25px; padding: 0 11px; border-radius: 12.5px; border: 1px solid #002c9a; margin-right: 5px; color: #002c9a; font-size: 15px; background-color: #fff; line-height: 21px; box-sizing: border-box;}
+.adpop1_bottom .adpop1_bottom_in span {height: 25px; padding: 0 11px; border-radius: 12.5px; border: 1px solid var(--primary-color); margin-right: 5px; color: var(--primary-color); font-size: 15px; background-color: #fff; line-height: 21px; box-sizing: border-box;}
 .adpop1_bottom .adpop1_bottom_in div div { padding-top: 4px; margin-bottom: 15px;}
 .adpop1_bottom .adpop1_bottom_in div p:first-child {font-size: 15px;}
 .adpop1_bottom .adpop1_bottom_in div p:not(:first-child) {color: #666; font-size: 15px; font-weight: 300; font-size: 15px; line-height: 1.4; padding-top: 5px;}
@@ -720,12 +720,12 @@
 .adpop_cont.adpop3 .adpop1_top>div>p>span {font-weight: 100; font-size: 34px;}
 .adpop_cont.adpop3 .adpop1_top>div>span {font-size: 15px; font-weight: 300; line-height: 1.3; padding-bottom: 15px; display: inline-block;}
 .adpop2_middle {background-color: #ddd; padding: 20px; border-radius: 0 0 5px 5px; margin-bottom: 30px; box-sizing: border-box;font-size: 15px; font-weight: 400; letter-spacing: -0.75px; line-height: 1.4;}
-.adpop2_middle p:first-child {font-weight: 600; color: #002c9a; padding-bottom: 3px;}
+.adpop2_middle p:first-child {font-weight: 600; color: var(--primary-color); padding-bottom: 3px;}
 .adpop2_bottom .adpop2_title {font-size: 20px; font-weight: 500; font-family: 'GmarketSansMedium'; margin-bottom: 20px;}
 .adpop2_bottom .adpop2_title i {background-image: url(/publish/images/content/adpop_icon.png); width: 19px; height: 23px; margin: 0 8px 3px 0;}
 .adpop2_bottom>div>p:first-child {font-size: 18px; padding-bottom: 15px;}
 .adpop2_bottom>div>p:last-child {background-color: #f5f5f5; border-radius: 5px; padding: 20px 25px; margin-bottom: 20px; font-size: 15px; font-weight: 400; line-height: 1.5; color: #555; letter-spacing: -0.5px;}
-.election_btn {background-color: #002c9a; height: 42px; padding: 0 22px; border-radius: 5px; color: #fff; font-size: 18px;}
+.election_btn {background-color: var(--primary-color); height: 42px; padding: 0 22px; border-radius: 5px; color: #fff; font-size: 18px;}
 .election_btn i {background-image: url(/publish/images/content/election_btn.png); width: 20px; height: 20px; margin: 0 5px 4px 0;}
 
 /* 선거문자 이용안내 */
@@ -748,7 +748,7 @@
 .cdpop_info li i.info_step6 {background-image: url(/publish/images/content/cdPop_cont1_6.png);}
 .cdpop_info li>div {padding-left: 20px;}
 .cdpop_info li p {font-size: 18px; font-weight: 500;}
-.cdpop_info li button {width: 80px; height: 30px; border-radius: 5px; border: 1px solid #002c9a; color: #002c9a; font-size: 15px; }
+.cdpop_info li button {width: 80px; height: 30px; border-radius: 5px; border: 1px solid var(--primary-color); color: var(--primary-color); font-size: 15px; }
 .cdpop_info li:not(:nth-child(1),:nth-child(4)):after {content: ""; background-image: url(/publish/images/content/cdPop_info_arrow.png); position: absolute; top: 50%; left: -16px; transform: translateY(-50%); width: 22px; height: 22px;}
 .cdpop_cont .cdpop_title .cdpop_title_icon2 {background-image: url(/publish/images/content/cdPop_title2.png); width: 21px; height: 19px; margin: 0 8px 0px 6px;}
 .cdpop_benefit {display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
@@ -789,7 +789,7 @@
 .popupJunk .titBox .notibox {margin:16px 0;padding:15px 0;font-size:16px;font-weight:400;line-height:1.5;letter-spacing:-1px;text-align:center;color:#222;background:#f5f5f5;border-radius:5px;box-sizing:border-box}
 .popupJunk .titBox + .adpop1_bottom {border-top:2px solid #000;}
 .popupJunk .adpop1_bottom {border-top:0 none;}
-.popupJunk .adpop1_bottom .title_box span {font-size:18px;font-family:'GmarketSansMedium';position:absolute;left:0;top:20px;color:#002c9a;}
+.popupJunk .adpop1_bottom .title_box span {font-size:18px;font-family:'GmarketSansMedium';position:absolute;left:0;top:20px;color:var(--primary-color);}
 .popupJunk .adpop1_bottom .title_box:after {display:none;}
 .popupJunk .adpop1_bottom .view_button {position:absolute;top:12px;right:0;background-color:#fff;width:36px;height:36px;border:1px solid #d5d5d5;border-radius:5px;}
 .popupJunk .adpop1_bottom .view_button i::after {content: "";background-image:url(/publish/images/mem/clause_close.png);width:17px;height:2px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);}
@@ -802,20 +802,20 @@
 .popupJunk .adpop1_bottom .content_box .list li ul:after {content:'';display:block;clear:both;}
 .popupJunk .adpop1_bottom .content_box .list li ul li {width:calc(100%/3);padding:0 0 0 25px;box-sizing:border-box;}
 .popupJunk .adpop1_bottom .content_box .list li ul li .img_box {text-align:center;background:#fff;border-radius:5px;}
-.popupJunk .adpop1_bottom .content_box .list li ul li a {display:block;margin:10px 0 0;font-size:16px;line-height:30px;letter-spacing:-0.025em;text-align:center;color:#fff;background:#002c9a;border-radius:5px;}
+.popupJunk .adpop1_bottom .content_box .list li ul li a {display:block;margin:10px 0 0;font-size:16px;line-height:30px;letter-spacing:-0.025em;text-align:center;color:#fff;background:var(--primary-color);border-radius:5px;}
 .popupJunk .adpop1_bottom .content_box .list .tit ul li a{font-size: 15px;}
 .popupJunk .adpop1_bottom .content_box .list li dl {display:flex;height:100px;background:#fff;border-radius:5px;}
 .popupJunk .adpop1_bottom .content_box .list li dl dt {width:168px;}
 .popupJunk .adpop1_bottom .content_box .list li dl dd {width:calc(100% - 168px);font-size:16px;font-weight:300;line-height:27px;letter-spacing:-0.05em;color:#666;}
 .popupJunk .adpop1_bottom .content_box .list li dl dd p {position:relative;top:50%;transform:translateY(-50%);}
-.popupJunk .adpop1_bottom .content_box .list li dl dd a {display:inline-block;color:#002c9a;}
+.popupJunk .adpop1_bottom .content_box .list li dl dd a {display:inline-block;color:var(--primary-color);}
 .popupJunk .adpop1_bottom .content_box .list02 {display:flex;margin:0 0 0 -25px;justify-content:space-between;}
 .popupJunk .adpop1_bottom .content_box .list02 li {width:calc(100%/3 - 25px);margin:0 0 0 25px;padding:0 0 20px;background:#fff;border-radius:5px;box-sizing:border-box;}
 .popupJunk .adpop1_bottom .content_box .list02 li .img_box {text-align:center;}
 .popupJunk .adpop1_bottom .content_box .list02 li dl {margin:7px 0 0;text-align:center;}
-.popupJunk .adpop1_bottom .content_box .list02 li dl dt {font-size:16px;font-weight:500;line-height:27px;color:#002c9a;}
+.popupJunk .adpop1_bottom .content_box .list02 li dl dt {font-size:16px;font-weight:500;line-height:27px;color:var(--primary-color);}
 .popupJunk .adpop1_bottom .content_box .list02 li dl dd {margin:2px 0 0;font-size:16px;font-weight:300;line-height:24px;letter-spacing:-0.025em;color:#666;}
-.popupJunk .adpop1_bottom .content_box .cscenter dt {font-size:16px;font-weight:500;line-height:27px;color:#002c9a;}
+.popupJunk .adpop1_bottom .content_box .cscenter dt {font-size:16px;font-weight:500;line-height:27px;color:var(--primary-color);}
 .popupJunk .adpop1_bottom .content_box .cscenter dd {margin:2px 0 0;font-size:16px;font-weight:300;line-height:24px;letter-spacing:-0.025em;color:#666;}
 .popupJunk .mCSB_outside + .mCSB_scrollTools {right:2px;}
 /* 휴대폰 결제완료 팝업 */
@@ -838,7 +838,7 @@
 .kisa_popup .layer_law:before {content:'';position:absolute;left:25px;top:25px;width:calc(100% - 50px);height:calc(100% - 50px);border:3px solid #ddd;border-radius:5px;box-sizing:border-box;}
 .kisa_popup .layer_law dl {margin:3px;padding:20px 25px;letter-spacing:-0.025em;}
 .kisa_popup .layer_law dl dt {margin:0 0 6px;font-size:17px;font-weight:500;line-height:27px;}
-.kisa_popup .layer_law dl dt:before {content:'';display:inline-block;width:5px;height:5px;margin:14px 9px 0 0;vertical-align:top;background:#002c9a;border-radius:5px;}
+.kisa_popup .layer_law dl dt:before {content:'';display:inline-block;width:5px;height:5px;margin:14px 9px 0 0;vertical-align:top;background:var(--primary-color);border-radius:5px;}
 .kisa_popup .layer_law dl dd p {font-size:15px;font-weight:400;line-height:22px;color:#222;}
 .kisa_popup .layer_law dl dd ol li {font-size:15px;font-weight:300;line-height:22px;color:#666;}
 /* 신고내용 상세보기 */
@@ -883,13 +883,13 @@
 .kisa_popup .layer_attachfile .tb_wrap .tType4 tbody td .delBtn {width:18px;height:18px;font-size:0;text-indent:-9999em;border:1px solid #ccc;background:url(/publish/images/content/kisa_layer_file_delete_icon.png) no-repeat center center;border-radius:3px;}
 .kisa_popup .layer_attachfile .tb_wrap .tType4 tbody td .file_add {height:230px;margin:0;border:0 none;border-radius:0;}
 .kisa_popup .layer_attachfile .tb_wrap .file_info {position:absolute;left:0;bottom:0;width:100%;height:36px;padding:0 11px;font-size:15px;font-weight:300;line-height:36px;text-align:right;border-top:1px solid #ccc;background:#ededed;box-sizing:border-box;}
-.kisa_popup .layer_attachfile .tb_wrap .file_info strong {font-weight:500;color:#002c9a;}
+.kisa_popup .layer_attachfile .tb_wrap .file_info strong {font-weight:500;color:var(--primary-color);}
 .kisa_popup .layer_attachfile .tb_wrap .file_info span {display:inline-block;width:1px;height:16px;margin:11px 18px 0;vertical-align:top;background:#666;}
 .kisa_popup .layer_attachfile .button_box {display:flex;padding:9px 15px;justify-content:space-between;background:#f2f2f2;border-radius:5px;}
 .kisa_popup .layer_attachfile .button_box button {width:85px;height:32px;font-size:14px;font-weight:300;text-align:center;color:#555;border:1px solid #b1b1b1;background:#fff;border-radius:3px;}
 .kisa_popup .layer_attachfile .button_box .file_box {position:relative;width:70px;height:32px;}
 .kisa_popup .layer_attachfile .button_box .file_box input[type=file] {width:100%;height:100%;opacity:0;}
-.kisa_popup .layer_attachfile .button_box .file_box input[type=file] + label {position:absolute;left:0;top:0;width:100%;height:100%;font-size:14px;line-height:32px;text-align:center;color:#002c9a;border:1px solid #002c9a;background:#fff;border-radius:3px;cursor:pointer;}
+.kisa_popup .layer_attachfile .button_box .file_box input[type=file] + label {position:absolute;left:0;top:0;width:100%;height:100%;font-size:14px;line-height:32px;text-align:center;color:var(--primary-color);border:1px solid var(--primary-color);background:#fff;border-radius:3px;cursor:pointer;}
 /* KISA신고 알림 팝업 */
 .kisa_popup .layer_notify {width:633px;height:262px;}
 .kisa_popup.popup06 .popup_btn_wrap2 button {width:auto;min-width:110px;}
@@ -910,8 +910,8 @@
 
 /* window popup 공통영역 */
 .info_popup {overflow:hidden;background-color:#fff;}
-.info_popup .popup_heading {background-color: #fbc72b; position: relative; padding:13px 20px 17px;}
-.info_popup .popup_heading p {font-size: 22px; font-weight: 600;}
+.info_popup .popup_heading {position:relative;background:var(--secondary-color);color:#fff;padding:13px 20px 17px;}
+.info_popup .popup_heading p {font-size:22px;font-weight:600;}
 .info_popup .popup_heading button {position: absolute; top: 50%; transform: translateY(-50%); right: 20px;}
 .info_popup .titBox>button {height: 36px;}
 .info_popup .layer_in {height:auto;padding:30px 25px 50px;}
@@ -935,8 +935,8 @@
 .pop_msg_fails .layer_in .msg_text {font-size:20px;line-height:28px;letter-spacing:-0.025em;text-align:center;}
 .pop_msg_spam .layer_in .msg_text {font-size:20px;line-height:28px;letter-spacing:-0.025em;text-align:center;}
 .pop_msg_success .layer_in .msg_text strong,
-.pop_msg_fails .layer_in .msg_text strong {font-weight:500;color:#002c9a;}
-.pop_msg_spam .layer_in .msg_text strong {font-weight:500;color:#002c9a;}
+.pop_msg_fails .layer_in .msg_text strong {font-weight:500;color:var(--primary-color);}
+.pop_msg_spam .layer_in .msg_text strong {font-weight:500;color:var(--primary-color);}
 .pop_msg_success .layer_in .msg_text span,
 .pop_msg_fails .layer_in .msg_text span {font-weight:500;color:#e40000;}
 .pop_msg_spam .layer_in .msg_text span {font-weight:500;color:#e40000;}
@@ -957,7 +957,7 @@
 .msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left {display: flex; align-items: center;}
 .msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left span {padding: 5.5px 12px; border-radius: 13px; margin-right: 12px; font-size: 14px; display: inline-block; }
 .msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left span.span_1 {background-color: #2a57c8; color: #fff;}
-.msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left span.span_2 {background-color: #fbc72b; color: #222;}
+.msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left span.span_2 {background-color: var(--secondary-light-color); color: #222;}
 .msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left span.span_3 {background-color: #fff; border: 1px solid #999; color: #999;}
 .msgCtmViewCont .msgCtmViewCont_head .msgCtmViewCont_head_left p {font-size: 17px; color: #222; display: inline-block;}
 .msgCtmViewCont .msgCtmViewCont_head date {font-size: 16px; font-weight: 300; color: #666; position: absolute; top: 50%; right: 65px; transform: translateY(-50%);} 
@@ -978,8 +978,8 @@
 .custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td p::after {content: ""; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); width: 1px; height: 15px; background-color: #d5d5d5; display: inline-block;}
 .custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td p:last-child::after {display: none;}
 .custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td>span {font-size: 15px; text-align: center; width: 90px; padding: 9px 0; border-radius: 5px; margin-right: 5px; display: inline-block; font-weight: 400;}
-.custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td>span.span_2_1 {color: #002c9a; border: 1px solid #002c9a;}
-.custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td>span.span_2_2 {color: #fff; background-color: #002c9a;}
+.custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td>span.span_2_1 {color: var(--primary-color); border: 1px solid var(--primary-color);}
+.custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td>span.span_2_2 {color: #fff; background-color: var(--primary-color);}
 .custom_layer .body_cont .msgCtmViewCont table tr.custom_view1 td>span.span_2_3 {color: #fff; background-color: #999;}
 .custom_layer .body_cont .msgCtmViewCont table tr.custom_view2 td {padding: 20px 16px;}
 .custom_layer .body_cont .msgCtmViewCont table tr.custom_view2 td img {max-width:100%;}
@@ -1001,7 +1001,7 @@
 .test_sendpop .test_wrap .number dl.price dd {padding:0;line-height:50px;text-align:right;}
 .test_sendpop .test_wrap .number dl.price dd span {font-size:22px;font-weight:500;color:#e40000;}
 .test_sendpop .test_wrap .number .text {margin:32px 0 0;font-size:20px;letter-spacing:-0.025em;color:#222;}
-.test_sendpop .test_wrap .number .text span {display:block;margin:12px 0 0;font-size:15px;font-weight:300;color:#002c9a;}
+.test_sendpop .test_wrap .number .text span {display:block;margin:12px 0 0;font-size:15px;font-weight:300;color:var(--primary-color);}
 .test_sendpop .test_wrap .number .btnType {width:100%;margin:18px 0 0;}
 .test_sendpop .test_wrap .phone {width:350px;}
 .test_sendpop .test_wrap .phone .phoneIn {background-image: url(/publish/images/content/phoneBg.png); height: 657px; background-size: 100% auto; background-repeat: no-repeat; }
@@ -1010,7 +1010,7 @@
 .test_sendpop .test_wrap .phone .text_length2 {padding: 12px 0;}
 .test_sendpop .test_wrap .phone .text_length2>span {float: left;line-height: 27px;}
 .test_sendpop .test_wrap .phone .text_length2>div {float: right;margin-top: 3px;}
-.test_sendpop .test_wrap .phone .text_length2>div span {color: #002c9a;font-size: 15px;padding-right: 2px;}
+.test_sendpop .test_wrap .phone .text_length2>div span {color: var(--primary-color);font-size: 15px;padding-right: 2px;}
 .test_sendpop .test_wrap .phone .text_length2>div button {width: 24px;height: 24px; border: 1px solid #ccc;border-radius: 3px;}
 .test_sendpop .test_wrap .phone .text_length2>div button:hover {border: 1px solid #a3a3a3;}
 .test_sendpop .test_wrap .phone .text_length2>div button img {margin-bottom: 2px;}
@@ -1045,6 +1045,7 @@
 .template_choice_popup .template_type{width: 180px;}
 .template_choice_popup .emphasis_type{width: 180px;}
 .template_choice_popup .popup_search_wrap .template_name{width: 300px;}
+.template_choice_popup .popup_search_wrap .search_input{width:300px;}
 /* .template_choice_popup .kakao_template_list{margin: 20px 0 0 0;} */
 .template_choice_popup .kakao_template_list{display:flex;flex-wrap:wrap;gap:30px 16px;margin:20px 0;}
 /* .template_choice_popup .kakao_template_list li{position: relative; display: inline-block; width: calc((100% - 80px)/3); border-radius: 25px; box-shadow: inset 0 0px 8px rgba(0,0,0,0.2); padding: 8px 8px 16px 8px; margin: 0 11px 40px 0;} */
@@ -1055,7 +1056,7 @@
 .template_choice_popup .kakao_template_list li::after{position: absolute; content: " "; width: 100%; height: 18px; background: url(/publish/images/kakao_template_cont.png) no-repeat top center; top: 8px;}
 .template_choice_popup .kakao_template_list .kakao_template_wrap{width: 100%; height: 370px; padding: 30px 0 15px 0; border-radius: 22px 22px 0 0; box-shadow: inset 0 2px 8px rgba(0,0,0,0.2); background: #b6cddd; overflow-y: auto; box-sizing: border-box;}
 .template_choice_popup .kakao_template_list .template_cont{background-color: #fff; width: calc(100% - 31px); margin: 0 0 10px 12px; border-radius: 15px;}
-.template_choice_popup .kakao_template_list .template_cont .title{position: relative; height: 36px; background-color: #ffe400; border-radius: 15px 15px 0 0; text-align: center; line-height: 36px; font-size: 16px; color: #222;}
+.template_choice_popup .kakao_template_list .template_cont .title{position: relative; height: 36px; background-color:#FFE400; border-radius: 15px 15px 0 0; text-align: center; line-height: 36px; font-size: 16px; color: #222;}
 .template_choice_popup .kakao_template_list .template_cont .title .check{position: absolute; left: 15px; top: -2px;}
 .template_choice_popup .kakao_template_list .template_cont .img_box img{width: 100%; height: auto;}
 .template_choice_popup .kakao_template_list .template_cont .text_box{font-size: 14px; color: #555; line-height: 1.4; padding: 20px;}
@@ -1065,7 +1066,7 @@
 .template_choice_popup .kakao_template_list .kakao_template_info dt{position: relative; width: 76px; margin: 0 13px 0 0;}
 .template_choice_popup .kakao_template_list .kakao_template_info dt::after{position: absolute; content: " "; width: 1px; height: 12px; background-color: #d5d5d5; right: 0; top: 2px;}
 .template_choice_popup .kakao_template_list .kakao_template_info dd{width:calc(100% - 76px);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
-.template_choice_popup .kakao_template_list .kakao_template_info dd span{color: #002c9a; font-weight: bold;}
+.template_choice_popup .kakao_template_list .kakao_template_info dd span{color: var(--primary-color); font-weight: bold;}
 .template_choice_popup .kakao_template_list .cf_text{width: calc(100% - 31px); margin: 10px 0 30px 0; font-size: 14px; color: #666; text-align: right;}
 
 /* 카카오톡 발송결과, 예약관리 문자내용 보기 */
@@ -1089,9 +1090,9 @@
 .kakao_rev_popup .kakao_wrap .allimtalk_content button{margin: 0 0 8px 10px;}
 .kakao_rev_popup .kakao_wrap .allimtalk_content button:last-child{margin-bottom: 0;}
 .kakao_rev_popup .kakao_wrap .allimtalk_content .template_text+.btn_kakao_type{margin-top: 8px;}
-.kakao_rev_popup .kakao_wrap .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ffea00;}
+.kakao_rev_popup .kakao_wrap .allimtalk_content .btn_kakao_channel{display:flex;width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color:#FFEA00;gap:8px;justify-content:center;align-items:center;}
 .kakao_rev_popup .kakao_wrap .allimtalk_content .btn_kakao_type{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ededed;}
-.kakao_rev_popup .tab_phone .addText{margin:8px 0 0 0;color:#002c9a;font-size:14px;}
+.kakao_rev_popup .tab_phone .addText{margin:8px 0 0 0;color:var(--primary-color);font-size:14px;}
 
 /* 카카오톡 발송결과, 예약관리 문자내용 보기 - 친구톡 */
 .kakao_rev_popup .kakao_wrap .friendtalk .allimtalk_content{border-radius:5px;}
@@ -1119,7 +1120,7 @@
 .test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .text_preview .allimtalk_content button{margin: 0 0 8px 10px;}
 .test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .text_preview .allimtalk_content button:last-child{margin-bottom: 0;}
 .test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .text_preview .allimtalk_content .template_text+.btn_kakao_type{margin-top: 8px;}
-.test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .text_preview .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ffea00;}
+.test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .text_preview .allimtalk_content .btn_kakao_channel{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color:#FFEA00;}
 .test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .text_preview .allimtalk_content .btn_kakao_type{width: calc(100% - 20px); height: 40px; font-size: 15px; border-radius: 5px; background-color: #ededed;}
 .test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .template_info_wrap{display: flex; width: calc(100% + 13px); height: auto; padding: 6px 15px 6px 23px; justify-content: space-between; align-items: center; background-color: #fae100; margin: -5px 0 0 -5.1px; border-radius: 0 0 25px 25px;}
 .test_sendpop.kakao_rev_popup .kakao_wrap .phone .phoneIn .template_info_wrap .btn_template_choice{width: 120px; height: 36px; font-size: 16px; color: #fae100; background-color: #302218; border-radius: 5px;}
@@ -1130,7 +1131,7 @@
 
 /* 팩스전송결과 상세 */
 .fax_detail_popup{width: 900px; margin: 0 auto;}
-.fax_detail_popup .popup_heading {background-color: #fbc72b; position: relative; padding: 15px 20px; }
+.fax_detail_popup .popup_heading {background-color: var(--secondary-light-color); position: relative; padding: 15px 20px; }
 .fax_detail_popup .popup_heading p {font-size: 22px; font-weight: 600;}
 .fax_detail_popup .popup_heading button {position: absolute; top: 50%; transform: translateY(-50%); right: 20px;}
 .fax_detail_popup .titBox>button {height: 36px;}
@@ -1140,7 +1141,7 @@
 
 /* 이용약관 다른버전 팝업 */
 .clause_version_popup{width: 650px;}
-.clause_version_popup .popup_heading {background-color: #fbc72b; position: relative; padding: 15px 20px; }
+.clause_version_popup .popup_heading {background-color: var(--secondary-light-color); position: relative; padding: 15px 20px; }
 .clause_version_popup .popup_heading p {font-size: 22px; font-weight: 600;}
 .clause_version_popup .popup_heading button {position: absolute; top: 50%; transform: translateY(-50%); right: 20px;}
 .clause_version_popup .clause_list{width: calc(100% - 40px); margin: 0 auto;}
@@ -1191,28 +1192,29 @@
 .sub .heading.call_numbe_con{display: flex; justify-content: space-between; align-items: center; margin: -10px 0 0 0;}
 .sub .heading.call_numbe_con .btn{position: static; margin: 0 0 0 4px;}
 .sub .heading.call_numbe_con .button.id_card:before{content: ''; display: inline-block; width: 20px; height: 21px; margin: 13px 7px 0 0; vertical-align: top; background: url(/publish/images/content/id_card_icon.png) no-repeat left top;}
-.sub .heading.call_numbe_con .button.pro_ex{border-color: #ffcc33; background-color: #ffcc33;}
+.sub .heading.call_numbe_con .button.pro_ex{border-color: var(--secondary-color);}
 .sub .heading.call_numbe_con .button.pro_ex:before{content: ''; display: inline-block; width: 20px; height: 19px; margin: 14px 5px 0 0; vertical-align: top; background: url(/publish/images/content/icon_button_attorney.png) no-repeat left top;}
 
 .call_number_pop{margin: 0 0 30px; padding: 11px 17px 17px; letter-spacing: -0.02em; border: 3px solid #ddd; border-radius: 5px;}
 .call_number_pop .call_numbber_list li{height: auto; padding: 0 0 0 10px; margin: 0; border: none; text-indent: -8px; font-size: 15px; font-weight: 300; line-height: 26px; color: #666;}
 .call_number_pop .call_numbber_list strong{font-weight: 400; color: #222;}
 .call_number_pop .noted_items{background: #f5f5f5; padding: 20px; margin: 16px 0 0 0; border-radius: 5px; font-size: 14px;}
-.call_number_pop .noted_items .title{display: flex; justify-content: center; width: 76px; margin: 0 0 6px 0; border-radius: 20px; border: 1px solid #002c9a; background: #fff; font-size: 15px; font-weight: 500; color: #002c9a; line-height: 24px;}
+.call_number_pop .noted_items .title{display: flex; justify-content: center; width: 76px; margin: 0 0 6px 0; border-radius: 20px; border: 1px solid var(--primary-color); background: #fff; font-size: 15px; font-weight: 500; color: var(--primary-color); line-height: 24px;}
 .call_number_pop .noted_items ul li{line-height: 24px;}
 
 .ex_con_wrap{background: #f5f5f5; padding: 20px; border-radius: 5px; text-align: center;}
 .ex_con_wrap .ex_con{background: #fff; padding: 34px; border-radius: 5px;}
 .ex_con_wrap .ex_con .ex_con_tit{margin: 0 0 20px 0; font-family: 'GmarketSansMedium'; font-size: 22px; font-weight: 500;}
 .ex_con_wrap .ex_con .ex_con_te{margin: 15px 0 0 0; font-size: 16px; color: #666; font-weight: 300;}
+.ex_con_wrap .ex_con img{width:100%;}
 
 .servInfo_cont .layer_in.pro_layer_in{padding: 10px 30px 40px 30px;}
 .pro_layer_in .call_number_pop{padding: 17px;}
 .pro_btn_wrap{text-align: right; margin: 0 0 10px 0;}
-.pro_btn_wrap .btn{padding: 0 17px; font-size: 16px; line-height: 46px; text-align: center; border: 1px solid #d5d5d5; border-radius: 5px; /* border-color: #ffcc33; background-color: #ffcc33;*/}
-.pro_btn_wrap .btn:before{content: ''; display: inline-block; width: 15px; height: 19px; margin: 14px 8px 0 0; vertical-align: top; background: url(/publish/images/content/icon_button_attorney.png) no-repeat left top;}
+.pro_btn_wrap .btn{padding: 0 17px; font-size: 16px; line-height: 46px; text-align: center; border: 1px solid #d5d5d5; border-radius: 5px; /* border-color: var(--secondary-light-color); background-color: var(--secondary-light-color);*/}
+/* .pro_btn_wrap .btn:before{content: ''; display: inline-block; width: 15px; height: 19px; margin: 14px 8px 0 0; vertical-align: top; background: url(/publish/images/content/icon_button_attorney.png) no-repeat left top;} */
 .call_number_pop .pro_tit{background: #f5f5f5; padding: 10px; margin: 0 0 10px 0; border-radius: 5px; line-height: 24px; font-size: 17px; text-align: center;}
-.call_number_pop .pro_tit span{font-weight: 700; color: #002c9a;}
+.call_number_pop .pro_tit span{font-weight: 700; color: var(--primary-color);}
 
 .call_layer .info_tit{font-size: 20px; font-weight: 500; margin: 0 0 15px 0;}
 .call_layer .call_new ul li {padding:0;}
@@ -1245,7 +1247,7 @@
 
 /* 주소록 대량등록  */
 .file_upload_wrap{position:relative;display:flex;justify-content:space-between;align-items:center;}
-.file_upload_wrap .file_add.upload_area{display:flex;width:78%;margin:0;align-items:center;justify-content:center;}
+.file_upload_wrap .file_add.upload_area{display:flex;flex:0.99;margin:0;align-items:center;justify-content:center;}
 .file_upload_wrap .file_add.upload_area p{display:block;}
 .file_upload_wrap  .btnType.c3{position:unset;height:82px;}
 
src/main/webapp/publish/css/reset.css
--- src/main/webapp/publish/css/reset.css
+++ src/main/webapp/publish/css/reset.css
@@ -1,7 +1,8 @@
-html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit;vertical-align: baseline;color: inherit;font-weight: inherit;word-break: keep-all;font-family: 'Noto Sans KR', sans-serif;}
+html{-webkit-text-size-adjust: 100%;}
+html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin: 0;padding: 0;border: 0;font-size: 100%;vertical-align: baseline;color: inherit;word-break: keep-all;font-family: 'Pretendard'; font-weight: inherit;}
 *{outline: 0;}
-article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block;font-family: 'Noto Sans KR', sans-serif;}
-body {line-height: 1;}
+article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block;font-family: 'Pretendard';}
+body {line-height: 1;font-family: 'Pretendard', system-ui, -apple-system;}
 ol,ul,li {list-style: none;}
 p, h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;} 
 a {color: inherit; text-decoration: none;display: block;}
@@ -17,7 +18,7 @@
 select {background-color: #fff;appearance: none;-webkit-appearance: none;-moz-appearance: none;}
 select::-ms-expand { display: none; }
 input::-webkit-calendar-picker-indicator {display: none;} /* datalist 화실표 제거 */
-button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button;cursor: pointer;overflow: visible;font-family: 'Noto Sans KR', sans-serif;}
+button,html input[type="button"],input[type="reset"],input[type="submit"] {-webkit-appearance: button;cursor: pointer;overflow: visible;font-family: 'Pretendard';}
 button[disabled],html input[disabled] {cursor: default;}
 /* ie 하위버전 기본적으로 적용되어 있는 css 변경 */
 input[type="checkbox"],input[type="radio"] {box-sizing: border-box;padding: 0;margin: 0;}
 
src/main/webapp/publish/css/style.css (added)
+++ src/main/webapp/publish/css/style.css
@@ -0,0 +1,407 @@
+:root{
+  --primary-color:#176EE5;
+  --primary-color-hover:#1956B4;
+  --primary-light-color:#DBF0FA;
+  --primary-light-color-hover:#93D4F4;
+  --primary-lighter-color:#f4fbff;
+  --primary-dark-color:#1956B4;
+  --primary-dark-color-hover:#1A4B8E;
+  
+  --secondary-color:#4BB7ED;
+  --secondary-color-hover:#3C9DCE;
+  --secondary-light-color:#DBF0FA;
+  --secondary-light-color-hover:#93D4F4;
+  
+  --red-color:#F43131;
+  --red-color-hover:#D70202;
+  --red-light-color:#ffe5e5;
+  
+  --green-color:#15983A;
+  --green-color-hover:#0E9A1F;
+  
+  --gray-color:#888888;
+  --gray-color-hover:#666666;
+  --lightgray-color:#999999;
+  --lightgray-color-hover:#a3a3a3;
+  
+  --gray-border:#D5D5D5;
+  --darkgray-border:#B9B9B9;
+  --primary-light-border:#B1C6EE;
+  
+  --lightergray-bg:#f8f8f8;
+  --lightgray-bg:#f2f2f2;
+  --lightgray-bg-hover:#fafafa;
+}
+
+/* =============================================
+   폰트 기본
+============================================= */
+.fwLg{font-weight:300!important;}
+.fwRg{font-weight:400!important;}
+.fwMd{font-weight:500!important;}
+.fwBold{font-weight:700!important;}
+
+.c_white{color:#fff!important;}
+.c_002c9a{color:var(--primary-color)!important;}
+.c_e40000{color:#e40000!important;}
+.c_999999{color:#999!important;}
+.c_ffa200{color:var(--secondary-color)!important;}
+.c_19b32b{color:#19b32b!important;}
+.c_000{color:#000!important;}
+.c_222{color:#222!important;}
+.c_666{color:#666!important;}
+
+.color_red{color:#F43131;}
+
+/* =============================================
+   폰트 강조(GmarketSans Bold)
+============================================= */
+.c_666_g{padding:0 4px 0 0;font-family:'GmarketSansBold';font-size:26px;color:#666!important;}
+.c_002c9a_g{padding:0 4px 0 0;font-family:'GmarketSansBold';font-size:26px;color:var(--primary-color)!important;}
+.c_e40000_g{padding:0 4px 0 0;font-family:'GmarketSansBold';font-size:26px;color:#e40000!important;}
+.c_222_g{padding:0 4px 0 0;font-family:'GmarketSansBold';font-size:26px;color:#222!important;}
+
+.sub_font{font-family:'GmarketSansBold';}
+
+/* =============================================
+   테이블 유틸리티
+============================================= */
+.table{display:table;width:100%;}
+.table_cell{display:table-cell;vertical-align:middle;}
+.table_cell1{position:relative;display:table-cell;vertical-align:top;}
+.vMiddle{vertical-align:middle;}
+.tRight{text-align:right!important;}
+.tLeft{text-align:left!important;}
+
+/* 기타 반복 사용 */
+.SortLine{position:relative;}
+.SortLine::before{position:absolute;top:50%;left:0;display:block;content:"";width:1px;height:12px;background:#b0b0b0;transform:translateY(-50%);}
+.text_deco{position:relative;padding-right:40px;}
+.text_deco::after{position:absolute;top:50%;left:0;content:"";width:20px;height:20px;border:5px solid var(--secondary-light-color);border-radius:50%;background-color:#fff;transform:translateY(-50%);}
+.text_deco2{position:relative;padding-right:16px;}
+.text_deco2::after{position:absolute;top:50%;left:0;content:"";width:4px;height:4px;border-radius:50%;background-color:#23428b;transform:translateY(-50%);}
+.text_deco3{position:relative;padding-right:16px;}
+.text_deco3::after{position:absolute;top:50%;left:0;content:"";width:5px;height:17px;border-radius:2.5px;background-color:var(--secondary-light-color);transform:translateY(-50%);}
+.font_ellipsis>p{display:-webkit-inline-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;-webkit-box-orient:vertical;font-weight:300;line-break:anywhere;text-align:left;}
+.font_ellipsis>a>p{display:-webkit-inline-box;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:1;-webkit-box-orient:vertical;font-weight:400;line-break:anywhere;text-align:left;}
+
+/* ===================== SORT BUTTON / CASE COUNT ===================== */
+.sort_wrap{display:inline-block;}
+.sort_wrap button:nth-child(1) img{margin-left:3px;}
+.sort_wrap button:nth-child(2) img{margin-left:-5px;}
+.sort_wrap button img{margin-bottom:5px;}
+
+.sortBtn{margin:-3px 0 0;background:url(/publish/images/sortUp.png) no-repeat center;background-color:transparent;border:0;height:14px;cursor:pointer;}
+.sortBtnDesc{margin:-2px 0 0;background:url(/publish/images/sortDown.png) no-repeat center;background-color:transparent;border:0;height:14px;cursor:pointer;}
+.sortBtnAsc{background:url(/publish/images/sortUp.png) no-repeat center;background-color:transparent;border:0;height:14px;cursor:pointer;}
+
+.numOfCase{position:absolute;top:57px;right:0;}
+.numOfCase p{display:inline-block;font-size:13px;}
+.numOfCase p:first-child span{font-weight:500;color:#e40000;}
+.numOfCase p:last-child span{font-weight:500;color:var(--primary-color);}
+
+/* ========================================================================== */
+/*  INPUT / SELECT — GLOBAL UNIFIED STYLE                                     */
+/* ========================================================================== */
+
+.form_area{display:flex;align-items:center;gap:8px;}
+.form_area.left{justify-content:flex-start;}
+.form_area.right{justify-content:flex-end;}
+
+.form_area.column{flex-direction:column;}
+
+select{border:1px solid #e5e5e5;vertical-align:middle;font-family:'Pretendard';font-weight:300;font-size:16px;}
+select.selType1{padding:0 25px 0 10px;height:34px;border:1px solid #d5d5d5;border-radius:3px;background-image:url(/publish/images/select_search2.png);background-repeat:no-repeat;background-position:right 5px top 50%;color:#777;}
+select.selType2{margin-left:2px;align-self:center;padding-left:12px;width:125px;height:36px;border:1px solid #ccc;border-radius:3px;box-sizing:border-box;background-image:url(/publish/images/select_search.png);background-repeat:no-repeat;background-position:92% center;font-size:16px;color:#666;}
+.list_selType1:focus{outline:none;}
+select.list_selType1{padding:0 15px;width:100%;border:none;background-color:transparent;background-image:url(/publish/images/mem/list_select.png);background-repeat:no-repeat;background-position:right 0 top 50%;font-family:'Pretendard';font-size:18px;color:#222;cursor:pointer;}
+.select_gray_type{padding:0 20px;width:340px;height:40px;border-radius:5px;border:0;background-color:#f2f2f2;background-image:url(../images/select_search.png);background-repeat:no-repeat;background-position:94% center;font-weight:400;font-size:16px;color:#222;}
+
+input{border:0;vertical-align:middle;box-sizing:border-box;font-family:'Pretendard';}
+input:focus{outline:none;}
+input::placeholder{font-family:'Pretendard';font-weight:300;color:#a6a6a6!important;}
+input:-ms-input-placeholder{font-family:'Pretendard';font-weight:300;color:#a6a6a6!important;}
+input[type="text"]{padding:0 10px;border-radius:3px;font-size:16px;}
+input[type="text"].readonly::placeholder{color:#222!important;}
+input[type="text"].readonly:-ms-input-placeholder{color:#222!important;}
+input[type="text"].inputLight::placeholder{color:#a6a6a6!important;}
+input[type="text"].inputLight:-ms-input-placeholder{color:#a6a6a6!important;}
+input[type="password"]{padding:0 10px;border-radius:3px;font-size:16px;}
+input[type="password"].inputLight::placeholder{color:#a6a6a6!important;}
+input[type="password"].inputLight:-ms-input-placeholder{color:#a6a6a6!important;}
+input.input_text{border:1px solid #d5d5d5;}
+
+input[type="checkbox"]{width:16px;height:16px;border:1px solid #d6d8da;}
+input[type="radio"]{margin:2px 3px 0 0;}
+input[type="radio"]+label{margin-right:18px;font-size:16px;vertical-align:middle;}
+input[type="radio"].radio_big{margin:0;width:16px;height:16px;}
+
+textarea{padding:15px;width:100%;box-sizing:border-box;font-family:'Pretendard';font-weight:300;font-size:16px;color:#666;}
+textarea::-webkit-scrollbar{width:7px;}
+textarea::-webkit-scrollbar-thumb{background:#c3c6c7;border-radius:3px;}
+textarea::-webkit-scrollbar-thumb:active{background:#808080;}
+textarea::placeholder{font-family:'Pretendard';font-weight:300;color:#a6a6a6!important;}
+textarea:-ms-input-placeholder{font-family:'Pretendard';font-weight:300;color:#a6a6a6!important;}
+.textarea_gray_type{padding:24px 20px;border-radius:5px;background-color:#f2f2f2;border:none;}
+
+/* =============================================
+   인풋 클리어 버튼 제거 (IE 대응)
+============================================= */
+input[type=text]::-ms-celar,
+input[type=password]::-ms-clear,
+input[type=email]::-ms-clear,
+input[type=number]::-ms-clear,
+input[type=tel]::-ms-clear{display:none;width:0;height:0;}
+
+input[type=text]::-ms-reveal,
+input[type=password]::-ms-reveal,
+input[type=email]::-ms-reveal,
+input[type=number]::-ms-reveal,
+input[type=tel]::-ms-reveal{display:none;width:0;height:0;}
+
+.w100{width:100%;}
+.h100{height:100%;}
+
+
+
+/* =============================================
+   테이블 타입
+============================================= */
+
+.tType1 {width: 100%;text-align: left;table-layout: fixed;}
+.tType1 tbody tr {border-bottom: 1px solid #e5e5e5;}
+.tType1 tbody tr:first-child{border-top: 2px solid #000;}
+.tType1 tbody tr th {min-width: 75px; height: 55px; vertical-align: middle;font-size: 17px; text-align: left;}
+.tType1 tbody tr th .essential {display:inline-block;margin:4px 2px 0 0;vertical-align:top;color:#e40000;}
+.tType1 tbody tr th.vTop {vertical-align: top; padding-top: 20px; line-height: 1.2;}
+.tType1 tbody tr td {vertical-align: middle;font-weight: 300;line-height: 1.3; padding: 10px 0;}
+.tType1 tbody tr td p {line-height: 1.4;}
+.tType1 tbody tr td.send_cf {font-size: 18px;} 
+.tType1 tbody tr td.putText {padding: 10px 0;}
+.tType1 tbody tr td.putText>div {display: flex; width: 100%;}
+.tType1 tbody tr td.putText>p:last-child {color: #555; font-size: 14px; padding-top: 10px;}
+.tType1 tbody tr td.putText .put_left {float: left;width: calc(100% - 26%); min-width: 420px; padding: 0 10px; border:1px solid #f2f2f2;box-sizing: border-box; border-radius: 5px; background-color: #f2f2f2; position: relative; /*max-height: 300px;*/}
+.tType1 tbody tr td.putText .put_left .text_length {position: relative;min-height: 28px;margin:0 0 15px;border-radius: 0 0 5px 5px;}
+.tType1 tbody tr td.putText .put_left .text_length>div:first-child {font-size: 15px; padding-left: 10px;}
+.tType1 tbody tr td.putText .put_left .text_length>div:last-child {position: absolute;bottom: 0;right: 10px;}
+.tType1 tbody tr td.putText .put_left .text_length p {display: inline-block;padding-right: 10px;}
+.tType1 tbody tr td.putText .put_right { width: 26%; max-width: 200px; position: relative;}
+.tType1 tbody tr td.putText .put_right>button {width: calc(100% - 10px); margin-left: 10px;margin-bottom: 5px;}
+.tType1 tbody tr td.putText .put_right .btn_popup_wrap button:not(.btn_close) {width: calc(100% - 10px); margin-left: 10px;margin-bottom: 5px;}
+.tType1 tbody tr td.putText button .qmMark {background-image: url(/publish/images/content/qmIcon_s.png); width: 19px; height: 19px; margin-left: 5px; margin-top: -2px;}
+.tType1 tbody tr td.putText .put_right .send_btnWrap {position: absolute;bottom: 0;right:0;width: calc(100% - 10px);}
+.tType1 tbody tr td.putText .put_right .send_btnWrap button {width: 48.5%;}
+.tType1 tbody tr td.putText textarea {height: 160px; border: none;margin: 0;padding:0 15px;border-radius: 5px 5px 0 0;outline: 0;background-color: transparent; font-size: 15px;}
+.tType1 tbody tr td.putText .put_left.short textarea {height: 190px;margin:10px 0;padding:0 5px;}
+.tType1 tbody tr td.putText .put_left.short textarea::placeholder {color: #b5b5b5;}
+.tType1 tbody tr td.putText .put_left.short.on {border: 1px solid var(--primary-color);border-radius: 5px;background-color: #eef2f9 !important;}
+.tType1 tbody tr td.putText .put_left.long textarea {height: 380px;}
+.tType1 tbody tr td.putText .put_left.long.on {border: 1px solid #12bec9;border-radius: 5px;background-color: #eef5f9 !important;}
+.tType1 tbody tr td.putText .put_left.photo.on {border: 1px solid #e26ba9;border-radius: 5px;background-color: #f8f1f5 !important;}
+.tType1 tbody tr.msg_title {display:none;}
+.tType1 tbody tr.msg_title.active {display:table-row;}
+.tType1 tbody tr.msg_title td .title_wrap .textbox {display:none;margin:10px 0 0;}
+.tType1 tbody tr.msg_title td .title_wrap .textbox.active {display:block;}
+
+.tType1_title {font-size: 20px; font-weight: 600; position: relative; height: 40px;}
+.tType1_title button {position: absolute;top: 22%; right: 0; transform: translateY(-50%); background-color: var(--primary-color); height: 40px; padding: 0 15px; color: #fff;}
+.tType1_title>span {font-size: 16px; font-weight: 300; color: #666;}
+.tType1 tbody tr td.send_list {position: relative;display: flex; justify-content: space-between;}
+.tType1 tbody tr td.send_list .list_left, .tType1 tbody tr td.send_list .list_right {width: calc(100%/2 - 25px);min-width: 290px;}
+.tType1 tbody tr td.send_list .list_left {left: 0;position: relative;}
+.tType1 tbody tr td.send_list .list_left .add_num {height: 90px;}
+.tType1 tbody tr td.send_list .list_left .add_num input[type="text"] {width: calc(100% - 97px);min-width: 200px;}
+.tType1 tbody tr td.send_list .list_left .add_num input[type="text"]::placeholder {color: #a6a6a6; font-weight: 300;}
+.tType1 tbody tr td.send_list .list_left .add_num>span {color: #e40000;font-size: 13px;font-weight: 400;line-height: 39px;}
+.tType1 tbody tr td .text_req {display: inline-block; color: #999; font-size: 17px; font-weight: 300; vertical-align: middle;}
+
+
+.tType1 tbody tr td.send_list .list_right {right: 0;}
+.tType1 tbody tr td.send_list .list_right .list_btnWrap {display: flex;flex-flow: wrap;justify-content: space-between;}
+.tType1 tbody tr td.send_list .list_right .list_btnWrap button {height: 37px;width: calc(100%/3 - 3px);margin-bottom: 5px;}
+
+.tType1 tbody tr td.send_list .add_btn {position: absolute; right: 0; top: 0;}
+.tType1 tbody tr td.send_list .add_btn button {min-width: 95px; height: 32px; font-size: 14px;}
+.tType1 tbody tr td.send_list .add_remove {text-align: center;margin: 40px 4px 0 4px;align-self: center;}
+.tType1 tbody tr td.send_list .add_remove button {display: block;max-width: 44px;padding: 4px 6px; border: 1px solid #b1b1b1;border-radius: 5px; margin: 0 auto;margin-bottom: 5px;font-size: 12px;}
+.tType1 tbody tr td.send_list .add_remove button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
+.tType1 tbody tr td.send_list .add_remove button.add i {background-image:url(/publish/images/content/add_btn.png);width: 11px;height: 10px;display: block;margin: 0 auto;}
+.tType1 tbody tr td.send_list .add_remove button.remove i {background-image:url(/publish/images/content/remove_btn.png);width: 11px;height: 10px;display: block;margin: 0 auto;}
+
+.tType1 tbody tr th.billingAmount {position: relative;line-height: 1;vertical-align: middle;}
+.tType1 tbody tr th.billingAmount>div {background-color: #f2f2f2;border-radius: 5px;padding: 23px 30px;margin: 20px 0; position: relative;}
+.tType1 tbody tr th.billingAmount>div .final_pay {position: relative; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center;}
+.tType1 tbody tr th.billingAmount>div p:first-child {font-size: 20px;font-weight: 500;}
+.tType1 tbody tr th.billingAmount>div p:last-child {font-size: 20px;}
+.tType1 tbody tr th.billingAmount>div p span#totalPriceTxt {font-size: 24px;color: #e40000;font-weight: 500;}
+.tType1 tbody tr th.billingAmount>div p span:last-child {font-size: 16px;color: #888;font-weight: 300;}
+.tType1 tbody tr th.billingAmount .pay_info_list p {float:left;line-height:35px;}
+.tType1 tbody tr th.billingAmount .pay_info_list .info {float:left;margin:0 0 0 15px;padding:8px 15px 10px;font-size:16px;font-weight:300;color:#555;background:#e5e5e5;border-radius:5px;box-sizing:border-box;}
+.tType1 tbody tr th.billingAmount .pay_info_list .info strong {font-size:18px;font-weight:700;color:var(--primary-color);}
+.tType1 tbody tr th.billingAmount .pay_info_list .info span {margin:0 8px 0 7px;} 
+.tType1 tbody tr th.billingAmount button.cal_btn {position: absolute;right: 0; top: 50%;transform: translateY(-50%);background-color: var(--secondary-color);width: 88px;height: 32px;border-radius: 5px;}
+.tType1 tbody tr th.billingAmount button.cal_btn:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
+.tType1 tbody tr th.billingAmount button.cal_btn i {background-image: url(/publish/images/content/calIcon.png);width: 12px;height: 16px;margin: 0 3px 2px 0;}
+.tType1 tbody tr th.billingAmount .pay_type {background-color: #fff; border-radius: 5px 5px 0 0; height: 60px; padding: 12px 13px; box-sizing: border-box;}
+.tType1 tbody tr th.billingAmount .pay_type button.btn_event_cash{width: 100px;}
+.tType1 tbody tr th.billingAmount .pay_type:last-child {margin-top: 10px;}
+.tType1 tbody tr th.billingAmount .pay_type>div:first-child {float: left;margin:0 0 0 5px;}
+.tType1 tbody tr th.billingAmount .pay_type>div .won {display:inline-block;margin:9px 11px 0 -34px;font-size:16px;vertical-align:top;color:#9a9a9a;}
+.tType1 tbody tr th.billingAmount .pay_type>div:last-child {float: right;}
+.tType1 tbody tr th.billingAmount .pay_type>div:only-child{float: left;}
+.tType1 tbody tr th.billingAmount .pay_type input[type="radio"]+label {font-size: 16px;}
+.tType1 tbody tr th.billingAmount .pay_type input[type="radio"]+label span {font-size: 17px; font-weight: 700;}
+.tType1 tbody tr th.billingAmount .pay_type input[type="text"] {width: 210px; height: 36px; padding:0 37px 2px 16px; border-radius: 5px;text-align:right;}
+.tType1 tbody tr th.billingAmount .pay_type input[type="text"]::placeholder {color: #000; font-size: 16px; text-align: right; font-weight: 500;}
+.tType1 tbody tr th.billingAmount .pay_type button {width: 78px; margin-left: 5px;}
+
+.tType1 tbody tr td.check_num>div {display: inline-block;}
+.tType1 tbody tr td.check_num>div button {height: 40px; padding: 0 5px;}
+.tType1 tbody input[type="text"] {height: 40px; padding: 0 15px; background-color: #f2f2f2;border-radius: 5px;line-height:38px;}
+.tType1 tbody input[type="password"] {height: 50px; padding: 0 15px; background-color: #f2f2f2;border-radius: 5px; font-size: 16px;}
+.tType1 tbody select.sel_number {width: 340px; height: 40px; padding: 0 20px; background-color: #f2f2f2;border-radius: 5px; border: 0;color: var(--primary-color);font-weight: 400;font-size: 16px;background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 94% center;}
+.tType1 tbody input[type="text"]::placeholder {color: #a6a6a6;}
+.tType1 tbody input:disabled {background-color: #dedede;}
+
+
+.tType3 {width: 100%; border-radius: 3px; border: 1px solid #ccc; box-sizing: border-box;}
+.tType3.payDetail {margin-bottom: 50px;}
+.tType3.usageDetail {margin-bottom: 50px;}
+.tType3.payDetail {margin: -15px 0 10px 0;}
+.payDetail .tType3_hd>div:nth-child(1), .payDetail .tType3_bd>div:nth-child(1) {width: 40px;}
+.payDetail .tType3_hd>div:nth-child(2), .payDetail .tType3_bd>div:nth-child(2) {width: 20%;}
+.payDetail .tType3_hd>div:nth-child(3), .payDetail .tType3_bd>div:nth-child(3) {width: 17%;}
+.payDetail .tType3_hd>div:nth-child(4), .payDetail .tType3_bd>div:nth-child(4) {width: 15%;}
+.payDetail .tType3_hd>div:nth-child(5), .payDetail .tType3_bd>div:nth-child(5) {width: 17%;}
+.payDetail .tType3_hd>div:nth-child(6), .payDetail .tType3_bd>div:nth-child(6) {width: 15%;}
+.payDetail .tType3_hd>div:nth-child(7), .payDetail .tType3_bd>div:nth-child(7) {width: 17%;}
+
+.table_cont {display: none;}
+.table_cont.current {display: block;}
+
+.tType3 .tType3_hd {position:relative;display:flex;height:36px;font-size:15px;background:#f8f8f8;text-align:center;border-radius:5px 5px 0 0;box-sizing:border-box;z-index:0;}
+.tType3 .tType3_hd>div {display:flex;border-left:1px solid #d5d5d5;border-bottom:1px solid #d5d5d5;box-sizing:border-box;justify-content:center;align-items:center;gap:8px;}
+.tType3 .tType3_hd>div:first-child {border-left:0;} 
+.tType3 .font_ellipsis {position:relative;}
+
+.tType3 .tType3_bd {display:flex;height:40px;box-sizing:border-box;text-align:center;}
+.tType3 .tType3_bd span {font-weight:400;}
+.tType3 .tType3_bd>div {height:40px;padding:0 10px;border-bottom:1px solid #d5d5d5;border-left:1px solid #d5d5d5;text-align:center;font-size:15px;color:#555;font-weight:300;box-sizing:border-box;}
+.tType3 .tType3_bd>div:first-child {border-left: 0;}
+.tType3 .tType3_bd:last-child>div {border-bottom: 0;}
+.tType3 .tType3_bd .table_certify {font-weight: 400;}
+.tType3 .tType3_bd .input_wrap2 input[type="text"] {text-align: center; background-color: #f2f2f2; width: calc(100% - 20px); height: 32px; border-radius: 5px; color: #555; vertical-align: baseline;}
+.tType3 .tType3_bd .input_wrap2 input[type="text"]::placeholder {color: #555;}
+.tType3 .tType3_bd .input_wrap2 input[type="text"]:-ms-input-placeholder {color: #555;}
+.tType3 .tType3_bd .btnType14 {height: 28px; padding: 0 11.5px; vertical-align: baseline; line-height: 28px;}
+.tType3 .tType3_bd input[type="radio"] {margin-top: 0; margin-right: 0; vertical-align: revert;}
+
+.tb_wrap{position:relative;width:100%;min-height:430px;border:1px solid #d5d5d5;border-radius:5px;margin-bottom:10px;box-sizing: border-box;border-bottom:0 none;overflow:hidden;}
+.tb_wrap:after {position:absolute;content:'';width:calc(100% - 4px);height:1px;background:#d5d5d5;left:2px;bottom:0;}
+.tType4{width:100%;table-layout:fixed;}
+.tType4 thead{position:relative;background:#f8f8f8;z-index:0;}
+.tType4 thead tr:only-child th{height:36px;}
+.tType4 thead th{position:relative;height:25px;border-right:1px solid #d5d5d5;border-bottom:1px solid #d5d5d5;font-size:15px;font-weight:400;vertical-align:middle;z-index:1;}
+.tType4 thead th:last-child{border-right: 0;}
+.tType4 .sort_wrap{display: inline-block;}
+.tType4 tbody td{text-align: center; font-size: 15px; color: #666; font-weight: 400; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; height: 38px; vertical-align: middle; padding: 0 10px; box-sizing: border-box;}
+.tType4 tbody td.tb_tit{text-align: left; position: relative;}
+.tType4 tbody td.input_wrap2 input[type="text"] {text-align: center;background-color: #f2f2f2;width: calc(100% - 20px);height: 32px;border-radius: 5px;border: 1px solid #f2f2f2;margin-right: 0;color: #555;}
+.tType4 tbody tr:only-child:last-child td{border-bottom: 1px solid #ccc;}
+.tType4 tbody td:last-child{border-right: 0;}
+.tType4 tbody td>p{width: 100%; line-height: 38px; white-space: nowrap; text-overflow: ellipsis; letter-spacing: -0.5px; overflow: hidden;margin: 0 auto;}
+.tType4 tbody td span {font-weight: 400;}
+.tType4 td input[type="text"]{height: 28px; display: inline-block; border: 1px solid #e5e5e5; margin-right: 5px;}
+.tType4 tbody .btnType14 {height: 28px;}
+.tType4 .memo_text {width: calc(100% - 35px); margin-right: 5px; display: inline-block; text-align: left; vertical-align: inherit;}
+.tType4 tbody td span.textReject {line-height:28px;}
+.tType4 tbody td .btnTypeReject {margin:0 0 0 3px;line-height:26px;letter-spacing:0;text-align:center;vertical-align:top;}
+.tType4 tbody td.result_cont a {text-align: left!important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
+.tType4 tbody td.result_cont .result_tit { }
+.tType4 tbody td .cancel_date {font-size:14px; color:#666; display: block;}
+
+/* =============================================
+   탭 타입
+============================================= */
+.top_content {display: none;}
+.top_content.current {display: block;}
+.custom_content {display: none;}
+.custom_content.current {display: block;}
+.bottom_content {display: none;}
+.bottom_content.current {display: block;}
+.popup_cont {display: none;}
+.popup_cont.current {display: block;}
+.history_cont {display: none;}
+.history_cont.current {display: block;}
+.alarm_cont {display: none;}
+.alarm_cont.current {display: block;}
+.pay_cont {display: none;}
+.pay_cont.current {display: block;}
+.fee_cont {display: none;}
+.fee_cont.current {display: block;}
+
+.tabType1{display:flex;width:100%;margin:0 0 20px;background:#fff;border-radius:10px;border:1px solid var(--primary-color);text-align:center;overflow:hidden;}
+.tabType1 li{position:relative;flex:1;}
+.tabType1 li button{position:relative;width:100%;height:60px;padding:13px 0;font-size:18px;color:#222;border-radius:8px;z-index:1;}
+.tabType1 li.active button {border:1px solid var(--primary-color);background-color:var(--primary-color);font-weight:600;color:#fff;}
+
+.mypage_content .tabType1 {background-color: #f4f4f5; color: #222; margin-top: 40px;}
+.mypage_content .tabType1 li.active button {background-color: var(--secondary-light-color); color: #222;}
+
+.pay_tab_wrap .tabType1 {background-color: #f4f4f5; color: #222; margin: 30px 0 ;border:0 none;border-radius:5px;}
+.pay_tab_wrap .tabType1 li::after {content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 30px; background-color: #d5d5d5;}
+.pay_tab_wrap .tabType1 li:last-child::after {content: none;}
+.pay_tab_wrap .tabType1 li button{height:53px;font-size:16px;}
+.pay_tab_wrap .tabType1 li:first-child button {border-radius:5px 0 0 5px;}
+.pay_tab_wrap .tabType1 li:last-child button {border-radius:0 5px 5px 0;}
+.pay_tab_wrap .tabType1 li.active {background-color:transparent;}
+.pay_tab_wrap .tabType1 li.active::after {content: none;}
+.pay_tab_wrap .tabType1 li.active button {background-color: var(--secondary-color); border:1px solid var(--secondary-color-hover);color: #FFF;border-radius:5px;}
+.pay_tab_wrap .tabType1 li.active button:before {display:none;}
+.pay_tab_wrap .tabType1 li.active button:after {display:none;}
+
+.tabType2 {position:relative;display:flex;width:calc(100% - 600px);margin:0 0 20px 0;background:#fff;border-radius:10px 10px 0 0;text-align:center;}
+.tabType2::after {position:absolute;content: "";width:calc(100% + 600px);height:2px;background:#1E3862;bottom:0;left:0;}
+.tabType2 li {flex-basis:calc(100% /4);min-width: 200px;}
+.tabType2 li button {width: 100%;padding:13px 0;font-size:20px;border-left:1px solid #f2f2f2;background:#fff;}
+.tabType2 li:nth-child(3) button {border-left:0;}
+.tabType2 li:first-child button {border-left:0;border-radius:10px 0 0 0;}
+.tabType2 li:last-child button {border-radius:0 10px 0 0;}
+.tabType2 li.active button {background:#1E3862;border-radius:10px 10px 0 0;color:#fff;border-left:1px solid transparent;}
+
+.tabType4 {background-color: #fff;width: 100%;border-radius: 10px; display: flex;text-align: center;margin-bottom: 20px;border:1px solid var(--primary-color);overflow:hidden;}
+.tabType4 li {flex-basis: calc(100%/3); position: relative;}
+.tabType4 li::after {content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 34px; background-color: #d5d5d5;}
+.tabType4 li:last-child::after {content: none;}
+.tabType4 li.active::after {content: none;}
+.tabType4 li button {position:relative;width: 100%; height: 50px; padding: 12px 0;font-size: 18px; letter-spacing: -0.5px;}
+.tabType4 li.active button {color:#fff;border:1px solid var(--primary-color);background-color:var(--primary-color);border-radius:8px;}
+/* .tabType4 li.active button:before {content:'';position:absolute;left:-1px;top:-1px;width:100%;height:100%;border:2px solid #46484a;box-sizing:border-box;} */
+/* .tabType4 li.active button:after {content:'';position:absolute;left:-5px;top:-5px;width:100%;height:100%;border:5px solid #46484a;border-radius:10px;} */
+.tabType4.tabTwo li {flex-basis: calc(100%/2);}
+
+.tabType5 {background-color: #fff;width: 100%; border: 1px solid #dfdfdf; border-bottom: 1px solid #46484a; border-radius: 5px 5px 0 0; display: flex;text-align: center;}
+.tabType5 li {flex-basis: calc(100%/3); position: relative;}
+.tabType5 li::after {content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%); width: 1px; height: 100%; background-color: #c7c8c8;}
+.tabType5 li:last-child::after {content: none;}
+.tabType5 li.active::after {content: none;}
+.tabType5 li button {width: 100%;height: 45px; font-size: 18px;}
+.tabType5 li.active button {background-color: #46484a;border-radius: 5px 5px 0 0;color: #fff; font-weight: 300;}
+
+.tabType6 {background-color: #fff;width: 100%;border-bottom: 1px solid #e5e5e5;  display: flex;text-align: center;}
+.tabType6 li {flex-basis: calc(100%/2);}
+.tabType6 li button {width: 100%;height: 35px; font-size: 16px;border: 1px solid #dfdfdf; border-bottom: 1px solid #e5e5e5; border-radius: 5px 5px 0 0;}
+.tabType6 li.active button {background-color: #c8c8c8;border-radius: 5px 5px 0 0; border: 1px solid #c8c8c8;}
+.pay_refund_cont .pay_tType1 {margin-top:-20px;}
+.pay_refund_cont .pay_tType1 tbody tr:first-child {border-top:0 none;}
+
+/* =============================================
+   캘린더
+============================================= */
+.calendar_wrap {position:relative;display: inline-block;}
+.calendar_wrap>span {font-weight: 500;}
+.calendar_wrap>input[type="text"] {height: 36px;line-height: 36px;width: 140px;border: 1px solid #d5d5d5;font-size: 16px;font-weight: 300;padding: 0 5px;color: #777;background: url(/publish/images/calendar/calendarIcon2.png) #fff no-repeat right 7px center;}
+.calendar_in {position: relative;display: inline;}
+.calendar_in>button {  border: 1px solid transparent !important; height: 26px; margin: 1px 0 0 0; padding: 0; text-indent: -9999em; width: 26px; vertical-align: middle; position: absolute; right: 8px;top: 57%; transform: translateY(-50%);}
+.calendar_in .calendar-frame {border: 0;height: 290px;width: 320px;}
+.calendar_in .calendarPop {display: none;position: absolute;z-index: 10;top: 32px;left: -204px; border-radius: 10px 10px 0 0;box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12); background-color: #fff;}(No newline at end of file)
 
src/main/webapp/publish/css/tab.css (added)
+++ src/main/webapp/publish/css/tab.css
@@ -0,0 +1,230 @@
+/* =======================================================================================
+   BASIC TAB CONTENT DISPLAY
+======================================================================================= */
+
+.tab_content,.alarm_cont,.fee_cont{display:none;}
+.tab_content.current,.alarm_cont.current,.fee_cont.current{display:block;}
+
+.tabs{display:flex;width:100%;margin:0 0 40px;}
+.tabs.tab02 li{width:calc(100%/2);}
+.tabs.tab03 li{width:calc(100%/3);}
+.tabs.tab04 li{width:calc(100%/4);}
+.tabs.tab05 li{width:calc(100%/5);}
+.tabs.tab06 li{width:calc(100%/6);}
+
+/* =======================================================================================
+   TAB STYLE — FILL TYPE
+======================================================================================= */
+
+.tabs.fill{display:flex;width:100%;background:#eff2f9;border-radius:10px;padding:0 20px;}
+.tabs.fill .tab{width:100%;min-width:180px;height:60px;font-size:20px;font-weight:500;color:#8f96a6;}
+.tabs.fill .tab.active{border-bottom:3px solid var(--primary-color);font-weight:600;color:var(--primary-color);}
+
+.tabs.fill.yellow{background:#f4f4f5;color:#222;padding:0;}
+.tabs.fill.yellow .tab{font-size:16px;font-weight:500;border-radius:10px;}
+.tabs.fill.yellow .tab.active{color:#222;background:var(--secondary-light-color);border:1px solid #46484a;}
+
+/* =======================================================================================
+   TAB STYLE — LINE TYPE
+======================================================================================= */
+
+.tabs.line{display:flex;width:100%;border:1px solid #ced3de;border-bottom:2px solid var(--primary-color);border-radius:10px 10px 0 0;}
+.tabs.line .tab{position:relative;width:100%;height:50px;font-size:18px;border-right:1px solid #ced3de;}
+.tabs.line .tab.active{background:#e9eef8;color:var(--primary-color);font-weight:600;border-radius:10px 10px 0 0;}
+.tabs.line .tab.active::after{content:"";position:absolute;top:-1px;left:-1px;width:calc(100% + 2px);height:calc(100% + 2px);border:2px solid var(--primary-color);border-bottom:0;border-radius:10px 10px 0 0;}
+.tabs.line :last-child .tab{border-right:0;}
+
+/* =======================================================================================
+   OLD TAB CONTENT (tap → tab 오타 대응용)
+======================================================================================= */
+
+.top_content,.custom_content,.bottom_content,.popup_cont,.history_cont{display:none;}
+.top_content.current,.custom_content.current,.bottom_content.current,.popup_cont.current,.history_cont.current{display:block;}
+
+/* =======================================================================================
+   TAB TYPE 1 — 상단 탭 (일반문자/대량문자)
+======================================================================================= */
+
+.tabType1{display:flex;width:100%;margin:0 0 20px;background:#fff;border-radius:5px;border:1px solid var(--primary-color);text-align:center;}
+.tabType1 li{flex-basis:calc(100%/2);position:relative;}
+.tabType1 li button{width:100%;height:60px;padding:13px 0;font-size:18px;color:#222;position:relative;z-index:1;}
+.tabType1 li.active{background:var(--primary-color);}
+.tabType1 li.active::after{content:"";position:absolute;top:-1px;left:-1px;width:100%;height:100%;border:1px solid #46484a;}
+.tabType1 li.active button{color:#fff;background:#46484a;border:1px solid #46484a;}
+.tabType1 li.active button::before{content:"";position:absolute;top:-1px;left:-1px;width:100%;height:100%;border:2px solid #46484a;box-sizing:border-box;}
+.tabType1 li.active button::after{content:"";position:absolute;top:-5px;left:-5px;width:100%;height:100%;border:5px solid #46484a;border-radius:10px;}
+
+/* =======================================================================================
+   TAB TYPE 2 — 하단 탭
+======================================================================================= */
+
+.tabType2{display:flex;width:calc(100% - 600px);margin:0 0 20px;position:relative;background:#fff;border-radius:10px 10px 0 0;text-align:center;}
+.tabType2::after{content:"";position:absolute;bottom:0;left:0;width:calc(100% + 600px);height:2px;background:#000;}
+.tabType2 li{flex-basis:calc(100%/4);min-width:200px;}
+.tabType2 li button{width:100%;padding:13px 0;font-size:20px;background:#fff;border-left:1px solid #e5e5e5;}
+.tabType2 li:first-child button{border-left:0;border-radius:10px 0 0 0;}
+.tabType2 li:nth-child(3) button{border-left:0;}
+.tabType2 li:last-child button{border-radius:0 10px 0 0;}
+.tabType2 li.active button{background:#46484a;color:#fff;border-radius:10px 10px 0 0;border-left:1px solid transparent;}
+
+/* =======================================================================================
+   TAB TYPE 4 — 3분할, 2분할 탭
+======================================================================================= */
+
+.tabType4{display:flex;width:100%;margin:0 0 20px;background:#fff;border:1px solid var(--primary-color);border-radius:5px;text-align:center;}
+.tabType4 li{flex-basis:calc(100%/3);position:relative;}
+.tabType4 li::after{content:"";position:absolute;right:-1px;top:50%;transform:translateY(-50%);width:1px;height:34px;background:#ccc;}
+.tabType4 li:last-child::after,.tabType4 li.active::after{content:none;}
+.tabType4 li button{position:relative;width:100%;height:50px;padding:12px 0;font-size:18px;letter-spacing:-.5px;}
+.tabType4 li.active button{background:#46484a;color:#fff;border:1px solid #46484a;border-radius:10px;}
+.tabType4 li.active button::before{content:"";position:absolute;top:-1px;left:-1px;width:100%;height:100%;border:2px solid #46484a;box-sizing:border-box;}
+.tabType4 li.active button::after{content:"";position:absolute;top:-5px;left:-5px;width:100%;height:100%;border:5px solid #46484a;border-radius:13px;}
+.tabType4.tabTwo li{flex-basis:calc(100%/2);}
+
+/* =======================================================================================
+   TAB TYPE 5 — 심플한 3분할 탭
+======================================================================================= */
+
+.tabType5{display:flex;width:100%;background:#fff;border:1px solid #dfdfdf;border-bottom:1px solid #46484a;border-radius:5px 5px 0 0;text-align:center;}
+.tabType5 li{flex-basis:calc(100%/3);position:relative;}
+.tabType5 li::after{content:"";position:absolute;right:-1px;top:50%;transform:translateY(-50%);width:1px;height:100%;background:#c7c8c8;}
+.tabType5 li:last-child::after,.tabType5 li.active::after{content:none;}
+.tabType5 li button{width:100%;height:45px;font-size:18px;}
+.tabType5 li.active button{background:#46484a;color:#fff;border-radius:5px 5px 0 0;font-weight:300;}
+
+/* =======================================================================================
+   TAB TYPE 6 — 전송내역 팝업 탭
+======================================================================================= */
+
+.tabType6{display:flex;width:100%;background:#fff;border-bottom:1px solid #e5e5e5;text-align:center;}
+.tabType6 li{flex-basis:calc(100%/2);}
+.tabType6 li button{width:100%;height:35px;font-size:16px;border:1px solid #dfdfdf;border-bottom:1px solid #e5e5e5;border-radius:5px 5px 0 0;}
+.tabType6 li.active button{background:#c8c8c8;border:1px solid #c8c8c8;border-radius:5px 5px 0 0;}
+
+/* =======================================================================================
+   AREA TABS — 기본 레이아웃
+======================================================================================= */
+
+.area_tabs{text-align:center;margin:0 0 30px 0;}
+.area_tabs .top_tab{position:relative;display:flex;padding:0 0 0 160px;justify-content:space-between;align-items:center;}
+
+/* 전체/기업/개인 용 탭 - 현재 없음 */
+/* .tab_depth1{position:relative;display:flex;height:36px;font-size:16px;color:#555;border:1px solid #bcbdc1;border-radius:4px;box-shadow:inset 2px 2px 4px rgba(0,0,0,.2);background:#ecedef;align-self:center;}
+.tab_depth1 a{width:50px;line-height:36px;border-right:1px solid #bcbdc1;}
+.tab_depth1 a:first-child{border-radius:5px 0 0 5px;}
+.tab_depth1 a:last-child{border-right:0;border-radius:0 5px 5px 0;}
+.tab_depth1 a.on{background:#fff;border:1px solid var(--primary-color);color:var(--primary-color);font-size:16px;font-weight:500;height:36px;line-height:35px;margin-top:-1px;}
+.tab_depth1 a.on:last-child{border-radius:0 5px 5px 0;}
+.tab_depth1 .on_active{display:none;} */
+
+.area_tabs .tab_depth2{display:flex;width:45%;justify-content:center;margin:0 auto;align-self:center;}
+.area_tabs .tab_depth2>div{display:none;}
+.area_tabs .tab_depth2 .photo_wrap.active{display:block;}
+.area_tabs .tab_depth2 a{display:flex;height:53px;padding:0 30px;margin:0 5px;font-size:20px;color:#555;line-height:50px;border:1px solid #b1b1b1;border-radius:100px;flex-basis:calc(60%/3);background:#fff;transition:.1s;justify-content:center;align-items:center;}
+.area_tabs .tab_depth2 a.on{position:relative;background:#fff;border:3px solid var(--primary-color);color:#002c90;font-weight:600;box-shadow:3px 3px 5px rgba(0,0,0,.3);height:53px;line-height:44px;}
+.area_tabs .tab_depth2 a.on::after{content:"▼";position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);font-size:15px;}
+.area_tabs .tab_depth2 a.tab_next::after,.tab_depth2 a.tab_prev::after{display:none;}
+
+.area_tabs .tab_depth3{display:flex;width:100%;padding:20px 40px;margin:0 0 30px 0;font-size:16px;font-weight:300;color:#666;letter-spacing:-.5px;background:#f2f2f2;border-radius:10px;box-sizing:border-box;flex-wrap:wrap;justify-content:center;}
+.area_tabs .tab_depth3 a{position:relative;padding:0 15px;line-height:2;}
+.area_tabs .tab_depth3 a:hover{color:var(--primary-color);text-decoration:underline;}
+.area_tabs .tab_depth3 a.on{font-weight:600;color:var(--primary-color);}
+.area_tabs .tab_depth3 a.on::before{position:absolute;content:"";width:calc(100% - 25px);height:5px;background:rgba(0,62,217,.2);bottom:8px;left:12px;}
+.area_tabs .tab_depth3 a::after{position:absolute;content:"";width:4px;height:4px;background:#c3c4c5;border-radius:50%;top:15px;right:-3px;}
+.area_tabs .tab_depth3 a:last-child::after{display:none;}
+
+.area_tabs .tab_depth4{position:relative;min-width:550px;margin:0 auto;font-size:15px;}
+.area_tabs .tab_depth4 a{display:inline-block;padding:8px 25px;border:1px solid #dbdce0;font-size:16px;font-weight:400;color:#666;background:#fff;margin:5px;border-radius:30px;transition:.2s;}
+.area_tabs .tab_depth4 a.on{background:var(--secondary-light-color);border-color:var(--secondary-light-color);color:#222;font-weight:500;box-shadow:0 0 7px rgba(0,0,0,.25);}
+
+/* =======================================================================================
+   LIST TAB WRAP — TEXT LINE STYLE
+======================================================================================= */
+
+.list_tab_wrap{position:relative;}
+.list_tab_wrap ul{display:flex;max-width:calc(100% - 150px);margin:50px 0 -5px;flex-wrap:wrap;}
+.list_tab_wrap ul li{position:relative;padding:0 30px 5px 0;}
+.list_tab_wrap ul li::before{content:"";position:absolute;top:47%;right:15px;transform:translateY(-50%);width:1px;height:15px;background:#d5d5d5;}
+.list_tab_wrap ul li:last-child::before{display:none;}
+.list_tab_wrap ul li button{font-size:18px;color:#666;font-weight:300;}
+.list_tab_wrap ul li.active button{color:var(--primary-color);font-weight:500;position:relative;}
+.list_tab_wrap ul li.active button::after{content:"";position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:90%;height:9px;background:rgba(0,44,154,.15);}
+.list_tab_wrap .selType2{position:absolute;right:0;top:-5px;}
+
+/* =======================================================================================
+   LIST TAB WRAP 2 — BOX TAB STYLE
+======================================================================================= */
+
+.list_tab_wrap2{position:relative;}
+.list_tab_wrap2::after{content:"";position:absolute;bottom:0;left:0;width:100%;height:2px;background:#000;}
+.list_tab_wrap2 ul{display:flex;text-align:center;background:#fff;margin-bottom:20px;position:relative;}
+.list_tab_wrap2 ul li{border-top:1px solid #e5e5e5;}
+.list_tab_wrap2 ul li:first-child{border-left:1px solid #e5e5e5;border-radius:10px 0 0 0;}
+.list_tab_wrap2 ul li:last-child{border-right:1px solid #e5e5e5;border-radius:0 10px 0 0;}
+.list_tab_wrap2 ul li button{width:100%;height:45px;padding:10px 0;font-size:17px;border-right:1px solid #e5e5e5;background:#fff;}
+.list_tab_wrap2 ul li:last-child button{border-right:0;border-radius:0 10px 0 0;}
+.list_tab_wrap2 ul li.active button{background:#46484a;color:#fff;border-radius:10px 10px 0 0;border-right:1px solid transparent;}
+
+.list_tab_wrap2.type2 ul li{width:120px;}
+.list_tab_wrap2.type3 ul li{width:180px;}
+.list_tab_wrap2.type4 ul li{width:150px;}
+.list_tab_wrap2.type5 ul li{width:200px;}
+
+.list_tab_wrap2.type3 .btnType2{position:absolute;right:0;top:50%;transform:translateY(-50%);font-weight:300;padding:0 10px;}
+
+/* =======================================================================================
+   PAY TAB (노란색 배경)
+======================================================================================= */
+
+.pay_cont{display:none;}
+.pay_cont.current{display:block;}
+
+.pay_tab_wrap .tabType1{background:#f4f4f5;color:#222;margin:30px 0;border:0;border-radius:5px;}
+.pay_tab_wrap .tabType1 li::after{content:"";position:absolute;right:-1px;top:50%;transform:translateY(-50%);width:1px;height:30px;background:#d5d5d5;}
+.pay_tab_wrap .tabType1 li:last-child::after{display:none;}
+.pay_tab_wrap .tabType1 li:first-child button{border-radius:5px 0 0 5px;}
+.pay_tab_wrap .tabType1 li:last-child button{border-radius:0 5px 5px 0;}
+.pay_tab_wrap .tabType1 li.active{background:transparent;}
+.pay_tab_wrap .tabType1 li.active::after{display:none;}
+.pay_tab_wrap .tabType1 li.active button{background:#fbc72b;color:#222;border-radius:5px;line-height:25px;}
+.pay_tab_wrap .tabType1 li.active button::before,.pay_tab_wrap .tabType1 li.active button::after{display:none;}
+
+/* =======================================================================================
+   TAB TYPE 7 — 주소록 등록 ㄱ~ㅎ
+======================================================================================= */
+
+.tabType7{display:flex;width:calc(100% - 80px);margin-bottom:20px;position:relative;background:#fff;border:1px solid #e5e5e5;border-radius:10px 10px 0 0;text-align:center;}
+.tabType7::after{content:"";position:absolute;bottom:0;left:0;width:calc(100% + 80px);height:2px;background:#000;z-index:1;}
+.tabType7 li{width:calc(100%/17);}
+.tabType7 li:first-child{width:80px!important;border-right:0;border-radius:10px 0 0 0;z-index:1;}
+.tabType7 li button{width:100%;height:45px;padding:10px 0;font-size:17px;font-weight:300;background:#fff;border-right:1px solid #e5e5e5;border-radius:10px 0 0 0;}
+.tabType7 li:last-child button{border-right:0;border-radius:0 10px 0 0;}
+.tabType7 li.active button{background:#46484a;color:#fff;border-radius:10px 10px 0 0;border-left:1px solid transparent;}
+
+/* =======================================================================================
+   TABLE TAB WRAP — 발송결과 탭
+======================================================================================= */
+.tab_phone{display:none;}
+.tab_phone.current{display:block;}
+
+.table_tab_wrap{position:relative;}
+.table_tab_wrap ul{display:flex;height:60px;padding:0 30px;margin-bottom:25px;align-items:center;background:#f2f2f2;border-radius:5px;box-sizing:border-box;}
+.table_tab_wrap ul li{position:relative;padding:0 46px 5px 0;}
+.table_tab_wrap ul li::before{content:"";position:absolute;top:52%;right:23px;transform:translateY(-50%);width:1px;height:15px;background:#d5d5d5;}
+.table_tab_wrap ul li:last-child::before{display:none;}
+.table_tab_wrap ul li button{font-size:18px;color:#666;font-weight:300;}
+.table_tab_wrap ul li.active button{color:var(--primary-color);font-weight:500;position:relative;}
+.table_tab_wrap ul li.active button::after{content:"";position:absolute;bottom:-1px;left:50%;transform:translateX(-50%);width:90%;height:9px;background:rgba(0,44,154,.15);}
+.table_tab_wrap .selType2{position:absolute;top:50%;right:30px;transform:translateY(-50%);width:130px;}
+
+/* 발송결과 개선 버튼 추가 */
+.table_tab_wrap .tab_btnbox{position:absolute;top:50%;right:30px;transform:translateY(-50%);z-index:9;}
+.table_tab_wrap .tab_btnbox button.btnType.btnType14.check_validity{border:1px solid var(--primary-color);color:var(--primary-color);}
+.table_tab_wrap .tab_btnbox .qmMark{background:url(../images/content/qmIcon_s.png) no-repeat;width:19px;height:19px;}
+
+
+/* =======================================================================================
+   마이페이지
+======================================================================================= */
+.mypage_content .tabType1 {background:#f4f4f5;color:#222;margin:40px 0 0 0;}
+.mypage_content .tabType1 li.active button {background-color: var(--secondary-light-color); color: #222;}(No newline at end of file)
 
src/main/webapp/publish/css/table.css (added)
+++ src/main/webapp/publish/css/table.css
@@ -0,0 +1,113 @@
+.table{width:100%;table-layout:fixed;}
+
+
+
+/* =======================================================================================
+   tType1
+======================================================================================= */
+
+/* 공통 */
+.tType1{text-align:left;border-top:2px solid #000;}
+.tType1 tr{border-bottom:1px solid var(--table-tbody-border);}
+.tType1 th{min-width:75px;height:55px;font-size:17px;vertical-align:middle;}
+.tType1 th .essential{display:inline-block;margin:4px 2px 0 0;vertical-align:top;color:#e40000;}
+.tType1 th.vTop{vertical-align:top;padding:20px 0 0 0;}
+.tType1 td{font-size:16px;vertical-align:middle;padding:10px 0;}
+.tType1 tbody tr td p {line-height: 1.4;}
+
+.tType1 tbody tr.msg_title {display:none;}
+.tType1 tbody tr.msg_title.active {display:table-row;}
+.tType1 tbody tr.msg_title td .title_wrap .textbox {display:none;margin:10px 0 0;}
+.tType1 tbody tr.msg_title td .title_wrap .textbox.active {display:block;}
+
+.tType1_title {font-size: 20px; font-weight: 600; position: relative; height: 40px;}
+.tType1_title button {position: absolute;top: 22%; right: 0; transform: translateY(-50%); background-color: var(--primary-color); height: 40px; padding: 0 15px; color: #fff;}
+.tType1_title>span {font-size: 16px; font-weight: 300; color: #666;}
+.tType1 tbody tr td.send_list {position: relative;display: flex; justify-content: space-between;}
+.tType1 tbody tr td.send_list .list_left, .tType1 tbody tr td.send_list .list_right {width: calc(100%/2 - 25px);min-width: 290px;}
+.tType1 tbody tr td.send_list .list_left {left: 0;position: relative;}
+.tType1 tbody tr td.send_list .list_left .add_num {height: 90px;}
+.tType1 tbody tr td.send_list .list_left .add_num input[type="text"] {width: calc(100% - 97px);min-width: 200px;}
+.tType1 tbody tr td.send_list .list_left .add_num input[type="text"]::placeholder {color: #a6a6a6; font-weight: 300;}
+.tType1 tbody tr td.send_list .list_left .add_num>span {color: #e40000;font-size: 13px;font-weight: 400;line-height: 39px;}
+.tType1 tbody tr td .text_req {display: inline-block; color: #999; font-size: 17px; font-weight: 300; vertical-align: middle;}
+
+
+.tType1 tbody tr td.send_list .list_right {right: 0;}
+.tType1 tbody tr td.send_list .list_right .list_btnWrap {display: flex;flex-flow: wrap;justify-content: space-between;}
+.tType1 tbody tr td.send_list .list_right .list_btnWrap button {height: 37px;width: calc(100%/3 - 3px);margin-bottom: 5px;}
+
+.tType1 tbody tr td.send_list .add_btn {position: absolute; right: 0; top: 0;}
+.tType1 tbody tr td.send_list .add_btn button {min-width: 95px; height: 32px; font-size: 14px;}
+.tType1 tbody tr td.send_list .add_remove {text-align: center;margin: 40px 4px 0 4px;align-self: center;}
+.tType1 tbody tr td.send_list .add_remove button {display: block;max-width: 44px;padding: 4px 6px; border: 1px solid #b1b1b1;border-radius: 5px; margin: 0 auto;margin-bottom: 5px;font-size: 12px;}
+.tType1 tbody tr td.send_list .add_remove button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.12);}
+.tType1 tbody tr td.send_list .add_remove button.add i {background-image:url(/publish/images/content/add_btn.png);width: 11px;height: 10px;display: block;margin: 0 auto;}
+.tType1 tbody tr td.send_list .add_remove button.remove i {background-image:url(/publish/images/content/remove_btn.png);width: 11px;height: 10px;display: block;margin: 0 auto;}
+
+.tType1 tbody tr td.check_num>div {display: inline-block;}
+.tType1 tbody tr td.check_num>div button {height: 40px; padding: 0 5px;}
+.tType1 tbody input[type="text"] {height: 40px; padding: 0 15px; background-color: #f2f2f2;border-radius: 5px;line-height:38px;}
+.tType1 tbody input[type="password"] {height: 50px; padding: 0 15px; background-color: #f2f2f2;border-radius: 5px; font-size: 16px;}
+.tType1 tbody select.sel_number {width: 340px; height: 40px; padding: 0 20px; background-color: #f2f2f2;border-radius: 5px; border: 0;color: var(--primary-color);font-weight: 400;font-size: 16px;background-image: url(/publish/images/select_search.png); background-repeat: no-repeat; background-position: 94% center;}
+.tType1 tbody input[type="text"]::placeholder {color: #a6a6a6;}
+.tType1 tbody input:disabled {background-color: #dedede;}
+
+
+.tType3 {width: 100%; border-radius: 3px; border: 1px solid #ccc; box-sizing: border-box;}
+.tType3.payDetail {margin-bottom: 50px;}
+.tType3.usageDetail {margin-bottom: 50px;}
+.tType3.payDetail {margin: -15px 0 10px 0;}
+.payDetail .tType3_hd>div:nth-child(1), .payDetail .tType3_bd>div:nth-child(1) {width: 40px;}
+.payDetail .tType3_hd>div:nth-child(2), .payDetail .tType3_bd>div:nth-child(2) {width: 20%;}
+.payDetail .tType3_hd>div:nth-child(3), .payDetail .tType3_bd>div:nth-child(3) {width: 17%;}
+.payDetail .tType3_hd>div:nth-child(4), .payDetail .tType3_bd>div:nth-child(4) {width: 15%;}
+.payDetail .tType3_hd>div:nth-child(5), .payDetail .tType3_bd>div:nth-child(5) {width: 17%;}
+.payDetail .tType3_hd>div:nth-child(6), .payDetail .tType3_bd>div:nth-child(6) {width: 15%;}
+.payDetail .tType3_hd>div:nth-child(7), .payDetail .tType3_bd>div:nth-child(7) {width: 17%;}
+
+.table_cont {display: none;}
+.table_cont.current {display: block;}
+
+.tType3 .tType3_hd { display: flex; height: 36px; line-height: 34px; font-size: 15px; box-sizing: border-box; position: relative; z-index: 0; background-color: #ededed; text-align: center; border-radius: 3px 3px 0 0;}
+.tType3 .tType3_hd::after {content: ""; background-color: #e9e9e9; width: 100%; height: 18px; position: absolute; bottom: 0; left: 0;z-index: -1;}
+.tType3 .tType3_hd>div {border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; box-sizing: border-box;}
+.tType3 .tType3_hd>div:first-child {border-left: 0; } 
+.tType3 .font_ellipsis {position: relative;}
+
+.tType3 .tType3_bd { display: flex; height: 40px; line-height: 40px; font-size: 15px; box-sizing: border-box; text-align: center; color: #555; font-weight: 300;}
+.tType3 .tType3_bd span {font-weight: 400;}
+.tType3 .tType3_bd>div {height: 40px; padding: 0 10px; line-height: 40px; border-bottom: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; text-align: center; color: #555; font-weight: 300; box-sizing: border-box;}
+.tType3 .tType3_bd>div:first-child {border-left: 0;}
+.tType3 .tType3_bd:last-child>div {border-bottom: 0;}
+.tType3 .tType3_bd .table_certify {font-weight: 400;}
+.tType3 .tType3_bd .input_wrap2 input[type="text"] {text-align: center; background-color: #f2f2f2; width: calc(100% - 20px); height: 32px; border-radius: 5px; color: #555; vertical-align: baseline;}
+.tType3 .tType3_bd .input_wrap2 input[type="text"]::placeholder {color: #555;}
+.tType3 .tType3_bd .input_wrap2 input[type="text"]:-ms-input-placeholder {color: #555;}
+.tType3 .tType3_bd .btnType14 {height: 28px; padding: 0 11.5px; vertical-align: baseline; line-height: 28px;}
+.tType3 .tType3_bd input[type="radio"] {margin-top: 0; margin-right: 0; vertical-align: revert;}
+
+.tb_wrap{position:relative;width: 100%; min-height: 430px; border: 1px solid #ccc; border-radius: 5px; margin-bottom: 10px; box-sizing: border-box;border-bottom:0 none;}
+.tb_wrap:after {content:'';position:absolute;left:2px;bottom:0;width:calc(100% - 4px);height:1px;background:#ccc;}
+.tType4{table-layout: fixed; width: 100%;}
+.tType4 thead{background-color: #ededed; position: relative; z-index: 0;}
+.tType4 thead tr:only-child th{height: 36px;}
+.tType4 thead th{border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; font-size: 15px; font-weight: 400; position: relative; z-index: 1; line-height: 25px; vertical-align: middle;}
+.tType4 thead th::after{position: absolute; content: " "; width: 100%; height: 18px; background-color: #e5e5e5; bottom: 0; left: 0; z-index: -1;}
+.tType4 thead th:last-child{border-right: 0;}
+.tType4 .sort_wrap{display: inline-block;}
+.tType4 tbody td{text-align: center; font-size: 15px; color: #666; font-weight: 400; border-right: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; height: 38px; vertical-align: middle; padding: 0 10px; box-sizing: border-box;}
+.tType4 tbody td.tb_tit{text-align: left; position: relative;}
+.tType4 tbody td.input_wrap2 input[type="text"] {text-align: center;background-color: #f2f2f2;width: calc(100% - 20px);height: 32px;border-radius: 5px;border: 1px solid #f2f2f2;margin-right: 0;color: #555;}
+.tType4 tbody tr:only-child:last-child td{border-bottom: 1px solid #ccc;}
+.tType4 tbody td:last-child{border-right: 0;}
+.tType4 tbody td>p{width: 100%; line-height: 38px; white-space: nowrap; text-overflow: ellipsis; letter-spacing: -0.5px; overflow: hidden;margin: 0 auto;}
+.tType4 tbody td span {font-weight: 400;}
+.tType4 td input[type="text"]{height: 28px; display: inline-block; border: 1px solid #e5e5e5; margin-right: 5px;}
+.tType4 tbody .btnType14 {height: 28px;}
+.tType4 .memo_text {width: calc(100% - 35px); margin-right: 5px; display: inline-block; text-align: left; vertical-align: inherit;}
+.tType4 tbody td span.textReject {line-height:28px;}
+.tType4 tbody td .btnTypeReject {margin:0 0 0 3px;line-height:26px;letter-spacing:0;text-align:center;vertical-align:top;}
+.tType4 tbody td.result_cont a {text-align: left!important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
+.tType4 tbody td.result_cont .result_tit { }
+.tType4 tbody td .cancel_date {font-size:14px; color:#666; display: block;}
src/main/webapp/publish/estimate.html
--- src/main/webapp/publish/estimate.html
+++ src/main/webapp/publish/estimate.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/estimate2.html
--- src/main/webapp/publish/estimate2.html
+++ src/main/webapp/publish/estimate2.html
@@ -8,6 +8,7 @@
 
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/common.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/estimate3.html
--- src/main/webapp/publish/estimate3.html
+++ src/main/webapp/publish/estimate3.html
@@ -8,6 +8,7 @@
 
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/common.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/estimate4.html
--- src/main/webapp/publish/estimate4.html
+++ src/main/webapp/publish/estimate4.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/fax_send.html
--- src/main/webapp/publish/fax_send.html
+++ src/main/webapp/publish/fax_send.html
@@ -12,6 +12,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/firstpay_event.html
--- src/main/webapp/publish/firstpay_event.html
+++ src/main/webapp/publish/firstpay_event.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/firstpay_event2.html
--- src/main/webapp/publish/firstpay_event2.html
+++ src/main/webapp/publish/firstpay_event2.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
 
src/main/webapp/publish/font/GmarketSansTTFBold.eot (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFBold.eot
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFBold.ttf (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFBold.ttf
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFBold.woff (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFBold.woff
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFBold.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFBold.woff2
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFLight.eot (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFLight.eot
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFLight.ttf (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFLight.ttf
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFLight.woff (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFLight.woff
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFLight.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFLight.woff2
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFMedium.eot (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFMedium.eot
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFMedium.ttf (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFMedium.ttf
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFMedium.woff (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFMedium.woff
Binary file is not shown
 
src/main/webapp/publish/font/GmarketSansTTFMedium.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/GmarketSansTTFMedium.woff2
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Bold.ttf (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Bold.ttf
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Bold.woff (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Bold.woff
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Bold.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Bold.woff2
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-ExtraBold.ttf (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-ExtraBold.ttf
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-ExtraBold.woff (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-ExtraBold.woff
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-ExtraBold.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-ExtraBold.woff2
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Light.ttf (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Light.ttf
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Light.woff (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Light.woff
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Light.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Light.woff2
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Medium.ttf (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Medium.ttf
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Medium.woff (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Medium.woff
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Medium.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Medium.woff2
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Regular.ttf (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Regular.ttf
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Regular.woff (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Regular.woff
Binary file is not shown
 
src/main/webapp/publish/font/NotoSansKR-Regular.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/NotoSansKR-Regular.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Black.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Black.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Black.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Black.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Black.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Black.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Black.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Black.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Bold.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Bold.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Bold.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Bold.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Bold.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Bold.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Bold.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Bold.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraBold.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraBold.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraBold.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraBold.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraBold.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraBold.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraBold.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraBold.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraLight.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraLight.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraLight.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraLight.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraLight.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraLight.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-ExtraLight.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-ExtraLight.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Light.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Light.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Light.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Light.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Light.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Light.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Light.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Light.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Medium.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Medium.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Medium.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Medium.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Medium.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Medium.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Medium.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Medium.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Regular.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Regular.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Regular.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Regular.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Regular.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Regular.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Regular.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Regular.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-SemiBold.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-SemiBold.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-SemiBold.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-SemiBold.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-SemiBold.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-SemiBold.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-SemiBold.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-SemiBold.woff2
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Thin.otf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Thin.otf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Thin.ttf (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Thin.ttf
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Thin.woff (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Thin.woff
Binary file is not shown
 
src/main/webapp/publish/font/Pretendard-Thin.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/Pretendard-Thin.woff2
Binary file is not shown
 
src/main/webapp/publish/font/font.css (added)
+++ src/main/webapp/publish/font/font.css
@@ -0,0 +1,305 @@
+/* ================================
+     Pretendard
+     ================================ */
+
+/* Thin (100) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 100;
+    font-style: normal;
+    src: url('../font/Pretendard-Thin.woff2') format('woff2'),
+         url('../font/Pretendard-Thin.woff') format('woff'),
+         url('../font/Pretendard-Thin.ttf') format('truetype'),
+         url('../font/Pretendard-Thin.otf') format('opentype');
+    font-display: swap;
+}
+
+/* ExtraLight (200) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 200;
+    font-style: normal;
+    src: url('../font/Pretendard-ExtraLight.woff2') format('woff2'),
+         url('../font/Pretendard-ExtraLight.woff') format('woff'),
+         url('../font/Pretendard-ExtraLight.ttf') format('truetype'),
+         url('../font/Pretendard-ExtraLight.otf') format('opentype');
+    font-display: swap;
+}
+
+/* Light (300) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 300;
+    font-style: normal;
+    src: url('../font/Pretendard-Light.woff2') format('woff2'),
+         url('../font/Pretendard-Light.woff') format('woff'),
+         url('../font/Pretendard-Light.ttf') format('truetype'),
+         url('../font/Pretendard-Light.otf') format('opentype');
+    font-display: swap;
+}
+
+/* Regular (400) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 400;
+    font-style: normal;
+    src: url('../font/Pretendard-Regular.woff2') format('woff2'),
+         url('../font/Pretendard-Regular.woff') format('woff'),
+         url('../font/Pretendard-Regular.ttf') format('truetype'),
+         url('../font/Pretendard-Regular.otf') format('opentype');
+    font-display: swap;
+}
+
+/* Medium (500) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 500;
+    font-style: normal;
+    src: url('../font/Pretendard-Medium.woff2') format('woff2'),
+         url('../font/Pretendard-Medium.woff') format('woff'),
+         url('../font/Pretendard-Medium.ttf') format('truetype'),
+         url('../font/Pretendard-Medium.otf') format('opentype');
+    font-display: swap;
+}
+
+/* SemiBold (600) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 600;
+    font-style: normal;
+    src: url('../font/Pretendard-SemiBold.woff2') format('woff2'),
+         url('../font/Pretendard-SemiBold.woff') format('woff'),
+         url('../font/Pretendard-SemiBold.ttf') format('truetype'),
+         url('../font/Pretendard-SemiBold.otf') format('opentype');
+    font-display: swap;
+}
+
+/* Bold (700) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 700;
+    font-style: normal;
+    src: url('../font/Pretendard-Bold.woff2') format('woff2'),
+         url('../font/Pretendard-Bold.woff') format('woff'),
+         url('../font/Pretendard-Bold.ttf') format('truetype'),
+         url('../font/Pretendard-Bold.otf') format('opentype');
+    font-display: swap;
+}
+
+/* ExtraBold (800) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 800;
+    font-style: normal;
+    src: url('../font/Pretendard-ExtraBold.woff2') format('woff2'),
+         url('../font/Pretendard-ExtraBold.woff') format('woff'),
+         url('../font/Pretendard-ExtraBold.ttf') format('truetype'),
+         url('../font/Pretendard-ExtraBold.otf') format('opentype');
+    font-display: swap;
+}
+
+/* Black (900) */
+@font-face {
+    font-family: 'Pretendard';
+    font-weight: 900;
+    font-style: normal;
+    src: url('../font/Pretendard-Black.woff2') format('woff2'),
+         url('../font/Pretendard-Black.woff') format('woff'),
+         url('../font/Pretendard-Black.ttf') format('truetype'),
+         url('../font/Pretendard-Black.otf') format('opentype');
+    font-display: swap;
+}
+
+
+/* ================================
+    Gmarket Sans TTF
+    ================================ */
+
+@font-face {
+    font-family: 'Gmarket Sans TTF';
+    font-weight: 300;
+    font-style: normal;
+    src: url('../font/GmarketSansTTFLight.woff2') format('woff2'),
+         url('../font/GmarketSansTTFLight.woff') format('woff'),
+         url('../font/GmarketSansTTFLight.ttf') format('truetype'),
+         url('../font/GmarketSansTTFLight.eot?#iefix') format('embedded-opentype');
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Gmarket Sans TTF';
+    font-weight: 500;
+    font-style: normal;
+    src: url('../font/GmarketSansTTFMedium.woff2') format('woff2'),
+         url('../font/GmarketSansTTFMedium.woff') format('woff'),
+         url('../font/GmarketSansTTFMedium.ttf') format('truetype'),
+         url('../font/GmarketSansTTFMedium.eot?#iefix') format('embedded-opentype');
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'Gmarket Sans TTF';
+    font-weight: 700;
+    font-style: normal;
+    src: url('../font/GmarketSansTTFBold.woff2') format('woff2'),
+         url('../font/GmarketSansTTFBold.woff') format('woff'),
+         url('../font/GmarketSansTTFBold.ttf') format('truetype'),
+         url('../font/GmarketSansTTFBold.eot?#iefix') format('embedded-opentype');
+    font-display: swap;
+}
+
+
+/* 티몬 몬소리체 */
+@font-face {
+    font-family: 'TmonMonsori';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/TmonMonsori.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+} 
+
+/* 지마켓 산스체 */
+@font-face {
+    font-family: 'GmarketSansBold';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansBold.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+} 
+@font-face {
+    font-family: 'GmarketSansMedium';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+
+/* cafe24 당당해 */
+@font-face {
+    font-family: 'Cafe24Dangdanghae';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.4/Cafe24Dangdanghae.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+} 
+
+/* cafe24 아네모네 */
+@font-face {
+    font-family: 'Cafe24Ohsquare';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/Cafe24Ohsquare.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+} 
+
+/* cafe24 심플해 */
+@font-face {
+    font-family: 'Cafe24Simplehae';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_twelve@1.1/Cafe24Simplehae.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+} 
+
+/* 다키 */
+@font-face {
+    font-family: 'DakiB';
+    src: url('/publish/font/DakiB.eot');
+    src: url('/publish/font/DakiB.eot?#iefix') format('embedded-opentype'),
+        url('/publish/font/DakiB.woff2') format('woff2'),
+        url('/publish/font/DakiB.woff') format('woff'),
+        url('/publish/font/DakiB.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+@font-face {
+    font-family: 'DakiMTitle';
+    src: url('/publish/font/DakiMTitle.eot');
+    src: url('/publish/font/DakiMTitle.eot?#iefix') format('embedded-opentype'),
+        url('/publish/font/DakiMTitle.woff2') format('woff2'),
+        url('/publish/font/DakiMTitle.woff') format('woff'),
+        url('/publish/font/DakiMTitle.ttf') format('truetype');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+
+/* 나눔바른고딕 */
+@font-face {
+ font-family: 'NanumBarunGothicR';
+ font-style: normal;
+ font-weight: 400;
+ src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot');
+ src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.eot?#iefix') format('embedded-opentype'), 
+	 url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.woff') format('woff'), 
+	 url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWeb.ttf') format('truetype');
+}
+@font-face {
+ font-family: 'NanumBarunGothicB';
+ font-style: normal;
+ font-weight: 700;
+ src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot');
+ src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.eot?#iefix') format('embedded-opentype'), 
+	 url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.woff') format('woff'), 
+	 url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebBold.ttf') format('truetype')
+}
+@font-face {
+ font-family: 'NanumBarunGothicL';
+ font-style: normal;
+ font-weight: 300;
+ src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot');
+ src: url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.eot?#iefix') format('embedded-opentype'), 
+	 url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.woff') format('woff'), 
+	 url('//cdn.jsdelivr.net/font-nanumlight/1.0/NanumBarunGothicWebLight.ttf') format('truetype');
+}
+.nanumbarungothic * {
+ font-family: 'NanumBarunGothic', sans-serif;
+}
+
+
+/* 나눔명조EB */
+@font-face {
+    font-family: 'NanumMyeongjoEB';
+    src: url('/publish/font/NanumMyeongjoExtraBold.eot');
+    src: url('/publish/font/NanumMyeongjoExtraBold.eot?#iefix') format('embedded-opentype'),
+        url('/publish/font/NanumMyeongjoExtraBold.woff2') format('woff2'),
+        url('/publish/font/NanumMyeongjoExtraBold.woff') format('woff'),
+        url('/publish/font/NanumMyeongjoExtraBold.ttf') format('truetype');
+    font-weight: 800;
+    font-style: normal;
+    font-display: swap;
+}
+
+/* 나눔스퀘어EB */
+@font-face {
+    font-family: 'NanumSquareEB';
+    src: url('/publish/font/NanumSquareEB.eot');
+    src: url('/publish/font/NanumSquareEB.eot?#iefix') format('embedded-opentype'),
+        url('/publish/font/NanumSquareEB.woff2') format('woff2'),
+        url('/publish/font/NanumSquareEB.woff') format('woff'),
+        url('/publish/font/NanumSquareEB.ttf') format('truetype');
+    font-weight: 800;
+    font-style: normal;
+    font-display: swap;
+}
+
+/* 여기어때 잘난체 */
+@font-face {
+    font-family: 'yg-jalnan';
+    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+
+/* 롯데마트 드림체 */
+@font-face {
+    font-family: 'LotteMartDream';
+    font-style: normal;
+    font-weight: 700;
+    src: url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamBold.woff2') format('woff2'), url('//cdn.jsdelivr.net/korean-webfonts/1/corps/lottemart/LotteMartDream/LotteMartDreamBold.woff') format('woff');
+}
+
+/* 비밀번호를 위한 폰트 */
+@font-face {
+    font-family: 'pass';
+    font-style: normal;
+    font-weight: 400;
+    src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAATsAA8AAAAAB2QAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAABWAAAABwAAAAcg9+z70dERUYAAAF0AAAAHAAAAB4AJwANT1MvMgAAAZAAAAA/AAAAYH7AkBhjbWFwAAAB0AAAAFkAAAFqZowMx2N2dCAAAAIsAAAABAAAAAQAIgKIZ2FzcAAAAjAAAAAIAAAACAAAABBnbHlmAAACOAAAALkAAAE0MwNYJ2hlYWQAAAL0AAAAMAAAADYPA2KgaGhlYQAAAyQAAAAeAAAAJAU+ATJobXR4AAADRAAAABwAAAAcCPoA6mxvY2EAAANgAAAAEAAAABAA5gFMbWF4cAAAA3AAAAAaAAAAIAAKAE9uYW1lAAADjAAAARYAAAIgB4hZ03Bvc3QAAASkAAAAPgAAAE5Ojr8ld2ViZgAABOQAAAAGAAAABuK7WtIAAAABAAAAANXulPUAAAAA1viLwQAAAADW+JM4eNpjYGRgYOABYjEgZmJgBEI2IGYB8xgAA+AANXjaY2BifMg4gYGVgYVBAwOeYEAFjMgcp8yiFAYHBl7VP8wx/94wpDDHMIoo2DP8B8kx2TLHACkFBkYA8/IL3QB42mNgYGBmgGAZBkYGEEgB8hjBfBYGDyDNx8DBwMTABmTxMigoKKmeV/3z/z9YJTKf8f/X/4/vP7pldosLag4SYATqhgkyMgEJJnQFECcMOGChndEAfOwRuAAAAAAiAogAAQAB//8AD3jaY2BiUGJgYDRiWsXAzMDOoLeRkUHfZhM7C8Nbo41srHdsNjEzAZkMG5lBwqwg4U3sbIx/bDYxgsSNBRUF1Y0FlZUYBd6dOcO06m+YElMa0DiGJIZUxjuM9xjkGRhU2djZlJXU1UDQ1MTcDASNjcTFQFBUBGjYEkkVMJCU4gcCKRTeHCk+fn4+KSllsJiUJEhMUgrMUQbZk8bgz/iA8SRR9qzAY087FjEYD2QPDDAzMFgyAwC39TCRAAAAeNpjYGRgYADid/fqneL5bb4yyLMwgMC1H90HIfRkCxDN+IBpFZDiYGAC8QBbSwuceNpjYGRgYI7594aBgcmOAQgYHzAwMqACdgBbWQN0AAABdgAiAAAAAAAAAAABFAAAAj4AYgI+AGYB9AAAAAAAKgAqACoAKgBeAJIAmnjaY2BkYGBgZ1BgYGIAAUYGBNADEQAFQQBaAAB42o2PwUrDQBCGvzVV9GAQDx485exBY1CU3PQgVgIFI9prlVqDwcZNC/oSPoKP4HNUfQLfxYN/NytCe5GwO9/88+/MBAh5I8C0VoAtnYYNa8oaXpAn9RxIP/XcIqLreZENnjwvyfPieVVdXj2H7DHxPJH/2/M7sVn3/MGyOfb8SWjOGv4K2DRdctpkmtqhos+D6ISh4kiUUXDj1Fr3Bc/Oc0vPqec6A8aUyu1cdTaPZvyXyqz6Fm5axC7bxHOv/r/dnbSRXCk7+mpVrOqVtFqdp3NKxaHUgeod9cm40rtrzfrt2OyQa8fppCO9tk7d1x0rpiQcuDuRkjjtkHt16ctbuf/radZY52/PnEcphXpZOcofiEZNcQAAeNpjYGIAg///GBgZsAF2BgZGJkZmBmaGdkYWRla29JzKggxD9tK8TAMDAxc2D0MLU2NjENfI1M0ZACUXCrsAAAABWtLiugAA) format('woff');
+    } 
+    
+    (No newline at end of file)
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.eot (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.eot
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.svg (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.svg
@@ -0,0 +1,47 @@
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><title>400: Font family not found</title><link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css"/><style>
+      * {
+        margin: 0;
+        padding: 0;
+      }
+      html,code {
+        font: 15px/22px arial,sans-serif;
+      }
+      html {
+        background: #fff;
+        color: #222;
+        padding: 15px;
+      }
+      body {
+        background: 100% 5px no-repeat;
+        margin-top: 0;
+        max-width: none:
+        min-height: 180px;
+        padding: 30px 0 15px;
+      }
+      * > body {
+        padding-right: 205px;
+      }
+      p {
+        margin: 22px 0 0;
+        overflow: hidden;
+      }
+      ins {
+        text-decoration: none;
+      }
+      ins {
+        color: #777;
+      }
+      /* Google Fonts logo styling*/
+      .projectLogo a {
+        font-family: "Open Sans", arial, sans-serif;
+        font-size: 32px;
+        font-weight: 300;
+        color: #63666a;
+        line-height: 1.375;
+        text-decoration: none;
+      }
+      .projectLogo img {
+        margin: -1px 0 -4px;
+        vertical-align: middle;
+      }
+    </style></head><body><h1 id="g" class="projectLogo"><a href="//www.google.com/fonts"><img src="//www.google.com/images/logos/google_logo_41.png" alt="Google"/> Fonts</a></h1><p><b>400:</b>&nbsp;<ins>Missing font family</ins></p><p>The requested font families are not available.<p>Requested: Noto Sans KR (style: normal, weight: 300)<p><ins>For reference, see the <a href="https://developers.google.com/fonts/docs/getting_started">Google Fonts API documentation</a>.</ins></p></body></html>(No newline at end of file)
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.woff (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.woff
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-300.woff2
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.eot (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.eot
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.svg (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.svg
@@ -0,0 +1,47 @@
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><title>400: Font family not found</title><link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css"/><style>
+      * {
+        margin: 0;
+        padding: 0;
+      }
+      html,code {
+        font: 15px/22px arial,sans-serif;
+      }
+      html {
+        background: #fff;
+        color: #222;
+        padding: 15px;
+      }
+      body {
+        background: 100% 5px no-repeat;
+        margin-top: 0;
+        max-width: none:
+        min-height: 180px;
+        padding: 30px 0 15px;
+      }
+      * > body {
+        padding-right: 205px;
+      }
+      p {
+        margin: 22px 0 0;
+        overflow: hidden;
+      }
+      ins {
+        text-decoration: none;
+      }
+      ins {
+        color: #777;
+      }
+      /* Google Fonts logo styling*/
+      .projectLogo a {
+        font-family: "Open Sans", arial, sans-serif;
+        font-size: 32px;
+        font-weight: 300;
+        color: #63666a;
+        line-height: 1.375;
+        text-decoration: none;
+      }
+      .projectLogo img {
+        margin: -1px 0 -4px;
+        vertical-align: middle;
+      }
+    </style></head><body><h1 id="g" class="projectLogo"><a href="//www.google.com/fonts"><img src="//www.google.com/images/logos/google_logo_41.png" alt="Google"/> Fonts</a></h1><p><b>400:</b>&nbsp;<ins>Missing font family</ins></p><p>The requested font families are not available.<p>Requested: Noto Sans KR (style: normal, weight: 500)<p><ins>For reference, see the <a href="https://developers.google.com/fonts/docs/getting_started">Google Fonts API documentation</a>.</ins></p></body></html>(No newline at end of file)
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.woff (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.woff
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-500.woff2
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.eot (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.eot
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.svg (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.svg
@@ -0,0 +1,47 @@
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><title>400: Font family not found</title><link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css"/><style>
+      * {
+        margin: 0;
+        padding: 0;
+      }
+      html,code {
+        font: 15px/22px arial,sans-serif;
+      }
+      html {
+        background: #fff;
+        color: #222;
+        padding: 15px;
+      }
+      body {
+        background: 100% 5px no-repeat;
+        margin-top: 0;
+        max-width: none:
+        min-height: 180px;
+        padding: 30px 0 15px;
+      }
+      * > body {
+        padding-right: 205px;
+      }
+      p {
+        margin: 22px 0 0;
+        overflow: hidden;
+      }
+      ins {
+        text-decoration: none;
+      }
+      ins {
+        color: #777;
+      }
+      /* Google Fonts logo styling*/
+      .projectLogo a {
+        font-family: "Open Sans", arial, sans-serif;
+        font-size: 32px;
+        font-weight: 300;
+        color: #63666a;
+        line-height: 1.375;
+        text-decoration: none;
+      }
+      .projectLogo img {
+        margin: -1px 0 -4px;
+        vertical-align: middle;
+      }
+    </style></head><body><h1 id="g" class="projectLogo"><a href="//www.google.com/fonts"><img src="//www.google.com/images/logos/google_logo_41.png" alt="Google"/> Fonts</a></h1><p><b>400:</b>&nbsp;<ins>Missing font family</ins></p><p>The requested font families are not available.<p>Requested: Noto Sans KR (style: normal, weight: 700)<p><ins>For reference, see the <a href="https://developers.google.com/fonts/docs/getting_started">Google Fonts API documentation</a>.</ins></p></body></html>(No newline at end of file)
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.woff (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.woff
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-700.woff2
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.eot (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.eot
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.svg (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.svg
@@ -0,0 +1,47 @@
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><title>400: Font family not found</title><link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css"/><style>
+      * {
+        margin: 0;
+        padding: 0;
+      }
+      html,code {
+        font: 15px/22px arial,sans-serif;
+      }
+      html {
+        background: #fff;
+        color: #222;
+        padding: 15px;
+      }
+      body {
+        background: 100% 5px no-repeat;
+        margin-top: 0;
+        max-width: none:
+        min-height: 180px;
+        padding: 30px 0 15px;
+      }
+      * > body {
+        padding-right: 205px;
+      }
+      p {
+        margin: 22px 0 0;
+        overflow: hidden;
+      }
+      ins {
+        text-decoration: none;
+      }
+      ins {
+        color: #777;
+      }
+      /* Google Fonts logo styling*/
+      .projectLogo a {
+        font-family: "Open Sans", arial, sans-serif;
+        font-size: 32px;
+        font-weight: 300;
+        color: #63666a;
+        line-height: 1.375;
+        text-decoration: none;
+      }
+      .projectLogo img {
+        margin: -1px 0 -4px;
+        vertical-align: middle;
+      }
+    </style></head><body><h1 id="g" class="projectLogo"><a href="//www.google.com/fonts"><img src="//www.google.com/images/logos/google_logo_41.png" alt="Google"/> Fonts</a></h1><p><b>400:</b>&nbsp;<ins>Missing font family</ins></p><p>The requested font families are not available.<p>Requested: Noto Sans KR (style: normal, weight: 900)<p><ins>For reference, see the <a href="https://developers.google.com/fonts/docs/getting_started">Google Fonts API documentation</a>.</ins></p></body></html>(No newline at end of file)
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.woff (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.woff
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-900.woff2
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.eot (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.eot
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.svg (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.svg
@@ -0,0 +1,47 @@
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><title>400: Font family not found</title><link href="//fonts.googleapis.com/css?family=Open+Sans:300,400" rel="stylesheet" type="text/css"/><style>
+      * {
+        margin: 0;
+        padding: 0;
+      }
+      html,code {
+        font: 15px/22px arial,sans-serif;
+      }
+      html {
+        background: #fff;
+        color: #222;
+        padding: 15px;
+      }
+      body {
+        background: 100% 5px no-repeat;
+        margin-top: 0;
+        max-width: none:
+        min-height: 180px;
+        padding: 30px 0 15px;
+      }
+      * > body {
+        padding-right: 205px;
+      }
+      p {
+        margin: 22px 0 0;
+        overflow: hidden;
+      }
+      ins {
+        text-decoration: none;
+      }
+      ins {
+        color: #777;
+      }
+      /* Google Fonts logo styling*/
+      .projectLogo a {
+        font-family: "Open Sans", arial, sans-serif;
+        font-size: 32px;
+        font-weight: 300;
+        color: #63666a;
+        line-height: 1.375;
+        text-decoration: none;
+      }
+      .projectLogo img {
+        margin: -1px 0 -4px;
+        vertical-align: middle;
+      }
+    </style></head><body><h1 id="g" class="projectLogo"><a href="//www.google.com/fonts"><img src="//www.google.com/images/logos/google_logo_41.png" alt="Google"/> Fonts</a></h1><p><b>400:</b>&nbsp;<ins>Missing font family</ins></p><p>The requested font families are not available.<p>Requested: Noto Sans KR (style: normal, weight: 400)<p><ins>For reference, see the <a href="https://developers.google.com/fonts/docs/getting_started">Google Fonts API documentation</a>.</ins></p></body></html>(No newline at end of file)
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.woff (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.woff
Binary file is not shown
 
src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.woff2 (Binary) (added)
+++ src/main/webapp/publish/font/noto-sans-kr-v21-korean-regular.woff2
Binary file is not shown
src/main/webapp/publish/guide.html
--- src/main/webapp/publish/guide.html
+++ src/main/webapp/publish/guide.html
@@ -1,233 +1,1273 @@
 <!DOCTYPE html>
-<html lang="en">
-
+<html lang="ko">
 <head>
-    <meta charset="UTF-8">
-    <title>문자온 가이드</title>
+<meta charset="utf-8" />
+<meta name="viewport" content="width=device-width,initial-scale=1" />
+<title>퍼블리싱 가이드 - 파일 리스트</title>
+<script src="./js/jquery-3.5.0.js"></script>
+<style>
+  :root{
+    --bg:#f5f6fa;--card:#fff;--accent:#0072ff;--muted:#6b7280;
+    --done:#198754;--ing:#e67e22;--wait:#9ca3af;
+  }
+  *{box-sizing:border-box}
+  body{font-family: "Pretendard", "Noto Sans KR", system-ui, -apple-system, Arial; background:var(--bg); color:#111; margin:0; padding:32px;}
+  .wrap{max-width:1200px;margin:0 auto;background:var(--card);border-radius:14px;box-shadow:0 6px 20px rgba(15,23,42,0.08);overflow:hidden;}
+  header{padding:28px 40px;border-bottom:1px solid #eef2f7;background:linear-gradient(180deg,#fff,#fbfdff);}
+  header h1{margin:0;font-size:20px;color:#0f172a}
+  header p{margin:6px 0 0;font-size:13px;color:var(--muted)}
+  .meta{padding:18px 40px;border-bottom:1px solid #f0f3f7;display:flex;gap:24px;flex-wrap:wrap;font-size:14px;color:#374151}
+  .meta b{min-width:110px;color:#111}
+  /* Tabs - CSS radio */
 
-    <style>
-        * {list-style: none;text-decoration: none;color: #333;padding: 0;margin: 0;}
-        .page {margin: 10px 0 50px 0;}
-        .page>li>a {position: relative;display: inline-block;width: auto;font-weight: 600;font-size: 14px;margin: 0 20px 0 0;padding: 0 0 0 8px;}
-        .page>li>a::after {position: absolute;content: "";width: 3px;height: 3px;background: #222;border-radius: 100%;left: 0;top: 10px;}
-        .page>li>b {display: block;font-size: 18px;font-weight: 800;color: #183c7c;margin: 20px 0 10px 0;}
-        .font1 {font-weight: 600;color: darkblue;}
-        .font2 {font-weight: 600;color: teal;}
-    </style>
+  /* content area */
+  .content{padding:24px 40px 40px}
+  .table_wrap{background:linear-gradient(180deg,#fff,#fcfeff);border-radius:10px;padding:18px;border:1px solid #f0f3f7;box-shadow:0 2px 8px rgba(2,6,23,0.03)}
+  table{width:100%;border-collapse:collapse;font-size:13px}
+  thead th{background:#fbfdff;padding:12px 10px;border-bottom:1px solid #eef2f7;text-align:left;font-weight:700;color:#0f172a;position:sticky;top:0;z-index:1}
+  tbody td{padding:12px 10px;border-bottom:1px solid #f3f5f8;color:#334155}
+  td.center,th.center{text-align:center}
+  td.small{font-size:12px;color:var(--muted)}
+  a.link{color:var(--accent);text-decoration:none}
+  a.link:hover{text-decoration:underline}
+  .badge{display:inline-block;padding:6px 8px;border-radius:8px;font-size:12px;color:#fff}
+  .done{color:#198754;font-weight:600;}
+  .ing{color:#e67e22;font-weight:600;}
+  .wait{color:#aaa;font-weight:600;}
+  /* depth classes */
+  .depth01{font-weight:700;color:#0b1220}
+  .depth02{font-weight:600;color:#475569}
+  /* responsive */
+  @media (max-width:980px){
+    body{padding:18px}
+    .wrap{border-radius:10px}
+    header{padding:18px}
+    .meta{padding:12px}
+    .tabs{padding:12px;gap:6px}
+    .content{padding:18px}
+  }
+  /* TAB WRAP */
+  .tab_wrap{border-bottom:1px solid #eef2f7}
+  .tab_wrap input[type="radio"]{display:none}
+  .tab_wrap .tab{display:flex;gap:8px;padding:18px 40px;flex-wrap:wrap;}
+  .tab_wrap .tab li{list-style:none;}
+  .tab_wrap .tab label{display:block;padding:8px 12px;border-radius:8px;background:#fff;border:1px solid #e6e9ef;cursor:pointer;font-size:13px;color:#334155;white-space:nowrap;}
+
+  /* TAB ACTIVE (radio checked) */
+  #tab_all:checked ~ .tab label[for="tab_all"],
+  #tab_common:checked ~ .tab label[for="tab_common"],
+  #tab_msg:checked ~ .tab label[for="tab_msg"],
+  #tab_kakao:checked ~ .tab label[for="tab_kakao"],
+  #tab_fax:checked ~ .tab label[for="tab_fax"],
+  #tab_custom:checked ~ .tab label[for="tab_custom"],
+  #tab_addr:checked ~ .tab label[for="tab_addr"],
+  #tab_result:checked ~ .tab label[for="tab_result"],
+  #tab_reserve:checked ~ .tab label[for="tab_reserve"],
+  #tab_pay:checked ~ .tab label[for="tab_pay"],
+  #tab_join:checked ~ .tab label[for="tab_join"],
+  #tab_login:checked ~ .tab label[for="tab_login"],
+  #tab_mypage:checked ~ .tab label[for="tab_mypage"],
+  #tab_cs:checked ~ .tab label[for="tab_cs"],
+  #tab_firstpay:checked ~ .tab label[for="tab_firstpay"],
+  #tab_popup:checked ~ .tab label[for="tab_popup"],
+  #tab_api:checked ~ .tab label[for="tab_api"],
+  #tab_adv:checked ~ .tab label[for="tab_adv"],
+  #tab_etc:checked ~ .tab label[for="tab_etc"]{
+    background:var(--accent);
+    color:#fff;
+    border-color:var(--accent);
+    box-shadow:0 6px 18px rgba(2,6,23,0.06);
+  }
+</style>
+
+<script>
+  $(function () {
+  
+    /* ===== 넘버링 ===== */
+    function updateNumbering() {
+      let idx = 1;
+      $('tbody tr:visible').each(function () {
+        $(this).find('td').eq(0).text(idx++);
+      });
+    }
+  
+    /* ===== tab id ↔ depth01 매핑 ===== */
+    const tabMap = {
+      tab_all: '전체',
+      tab_common: '공통',
+      tab_msg: '문자발송',
+      tab_kakao: '카톡발송',
+      tab_fax: '팩스발송',
+      tab_custom: '맞춤제작',
+      tab_addr: '주소록관리',
+      tab_result: '발송결과',
+      tab_reserve: '예약문자관리',
+      tab_pay: '결제관리',
+      tab_join: '회원가입',
+      tab_login: '로그인',
+      tab_mypage: '마이페이지',
+      tab_cs: '고객센터',
+      tab_firstpay: '첫결제 이벤트',
+      tab_popup: '팝업',
+      tab_api: 'API',
+      tab_adv: '광고',
+      tab_etc: '기타'
+    };
+  
+    /* ===== 탭 변경 ===== */
+    $('input[name="tab"]').on('change', function () {
+      const tabId = this.id;
+      const keyword = tabMap[tabId];
+  
+      // 탭 active 처리
+      $('.tab li').removeClass('active');
+      $('label[for="' + tabId + '"]').parent().addClass('active');
+  
+      // 전체
+      if (keyword === '전체') {
+        $('tbody tr').show();
+        updateNumbering();
+        return;
+      }
+  
+      // 필터링
+      $('tbody tr').each(function () {
+        const depth01Text = $(this).find('.depth01').text().trim();
+        depth01Text === keyword ? $(this).show() : $(this).hide();
+      });
+  
+      updateNumbering();
+    });
+  
+    /* ===== 최초 로드 ===== */
+    updateNumbering();
+  
+  });
+  </script>
+
+
 </head>
+<body>
+<div class="wrap">
+  <header>
+    <h1>퍼블리싱 가이드 — 파일 리스트</h1>
+    <p>-</p>
+  </header>
 
-<body style="width: 1200px;margin: 80px auto">
-    <!-- <p>***<span class="font1"> (컨텐츠)</span> : 반복적으로 사용 안함</p>
-    <p>***<span class="font2"> (보드)</span> : 반복적으로 사용</p> -->
+  <div class="meta">
+    <div><b>프로젝트명</b> 문자고</div>
+    <div><b>작성자</b> 정수빈</div>
+    <div><b>작성일</b> 2026-02-27</div>
+    <div><b>파일경로</b> /publish/</div>
+  </div>
 
-    <ul class="page">
-        <li><a target="_blank" href="/publish/index.html">index.html</a>메인</li>
+  <div class="tab_wrap">
+    <!-- radio -->
+    <input type="radio" name="tab" id="tab_all" checked>
+    <input type="radio" name="tab" id="tab_common">
+    <input type="radio" name="tab" id="tab_msg">
+    <input type="radio" name="tab" id="tab_kakao">
+    <input type="radio" name="tab" id="tab_fax">
+    <input type="radio" name="tab" id="tab_custom">
+    <input type="radio" name="tab" id="tab_addr">
+    <input type="radio" name="tab" id="tab_result">
+    <input type="radio" name="tab" id="tab_reserve">
+    <input type="radio" name="tab" id="tab_pay">
+    <input type="radio" name="tab" id="tab_join">
+    <input type="radio" name="tab" id="tab_login">
+    <input type="radio" name="tab" id="tab_mypage">
+    <input type="radio" name="tab" id="tab_cs">
+    <input type="radio" name="tab" id="tab_firstpay">
+    <input type="radio" name="tab" id="tab_popup">
+    <input type="radio" name="tab" id="tab_api">
+    <input type="radio" name="tab" id="tab_adv">
+    <input type="radio" name="tab" id="tab_etc">
 
-        <li><b>공통</b></li>
-        <li><a target="_blank" href="/publish/layout/_header.html">_header.html</a>header</li>
-        <li><a target="_blank" href="/publish/layout/_footer.html">_footer.html</a>footer</li>
-
-        <li><b>문자발송</b></li>
-        <li><a target="_blank" href="/publish/sub1.html">sub1.html</a>문자전송</li>
-        <li><a target="_blank" href="/publish/sub_election_v2024.html">sub_election_v2024.html</a>선거문자</li>
-        <li><a target="_blank" href="/publish/photo_editer.html">photo_editer.html</a>포토에디터</li>
-        <!-- ///////////////문자발송/////////////// -->
-
-
-        <li><b>카톡발송</b></li>
-        <li><a target="_blank" href="/publish/kakao_allimtalk_intro.html">kakao_allimtalk_intro.html</a>카카오톡 소개</li>
-        <li><a target="_blank" href="/publish/kakao_friendtalk_add.html">kakao_friendtalk_add.html</a> 카카오 친구톡 템플릿 등록</li>
-        <li><a target="_blank" href="/publish/kakao_use_guide.html">kakao_use_guide.html</a>알림톡 사용안내</li>
-        <li><a target="_blank" href="/publish/kakao_allimtalk_send.html">kakao_allimtalk_send.html</a>알림톡 전송</li>
-        <li><a target="_blank" href="/publish/testKakaoSendPop.html">testKakaoSendPop.html</a>카카오 테스트발송 팝업</li>
-        <li><a target="_blank" href="/publish/kakao_allimtalk_add.html">kakao_allimtalk_add.html</a>카카오톡 설정 > 알림톡 템플릿 등록</li>
-        <li><a target="_blank" href="/publish/reservedmsg_2023.html">reservedmsg_2023.html</a>예약관리 > 카카오톡</li>
-        <li><a target="_blank" href="/publish/kakao_friendtalk_send.html">kakao_friendtalk_send.html</a> 카카오 친구톡 전송</li>
-        <li><a target="_blank" href="/publish/kakao_texting_detail.html">kakao_texting_detail.html</a>개인별 실패/대기 있을 경우 팝업</li>
-        <li><a target="_blank" href="/publish/kakao_friendtalk_list.html">kakao_friendtalk_list.html</a> 카카오 친구톡 템플릿 관리</li>
-        <li><a target="_blank" href="/publish/popup_allimtalk_template_choice.html">popup_allimtalk_template_choice.html</a>알림톡 템플릿 선택</li>
-        <li><a target="_blank" href="/publish/kakao_allimtalk_list.html">kakao_allimtalk_list.html</a>카카오톡 설정 > 알림톡 템플릿 등록/관리</li>
-        <li><a target="_blank" href="/publish/kakao_profile_add.html">kakao_profile_add.html</a>카카오톡 설정 > 발신프로필 등록/관리</li>
-        <!-- ///////////////카톡발송/////////////// -->
-
-
-        <li><b>팩스발송</b></li>
-        <li><a target="_blank" href="/publish/fax_send.html">fax_send.html</a>팩스전송</li>
-        <!-- ///////////////팩스발송/////////////// -->
-
-
-        <li><b>맞춤제작</b></li>
-        <li><a target="_blank" href="/publish/sub2.html">sub2.html</a>맞춤제작</li>
-        <!-- ///////////////맞춤제작/////////////// -->
-
-
-        <li><b>주소록관리</b></li>
-        <li><a target="_blank" href="/publish/adrbook1.html">adrbook1.html</a>주소록 관리</li>
-        <li><a target="_blank" href="/publish/adrbook2.html">adrbook2.html</a>수신거부 관리</li>
-        <li><a target="_blank" href="/publish/adrbook3.html">adrbook3.html</a>주소록 입력 대행(무료)</li>
-        <li><a target="_blank" href="/publish/adrbook4.html">adrbook4.html</a>폰주소록 등록</li>
-        <li><a target="_blank" href="/publish/adrbook_fax.html">adrbook_fax.html</a>팩스 주소록 관리</li>
-        <!-- ///////////////주소록관리/////////////// -->
-
-
-        <li><b>발송결과</b></li>
-        <li><a target="_blank" href="/publish/textingmsg.html">textingmsg.html</a>발송관리</li>
-        <li><a target="_blank" href="/publish/textingmsg_detail.html">textingmsg_detail.html</a>발송관리 > 상세</li>
-        <li><a target="_blank" href="/publish/textingmsg_detail_allimtalk.html">textingmsg_detail_allimtalk.html</a>발송관리 > 상세(알림톡)</li>
-        <li><a target="_blank" href="/publish/textingmsg_detail_friendtalk.html">textingmsg_detail_friendtalk.html</a>발송관리 > 상세(친구톡)</li>
-        <li><a target="_blank" href="/publish/estimate2.html">estimate2.html</a>문자 발송내역서</li>
-        <!-- ///////////////발송결과/////////////// -->
-
-
-        <li><b>예약문자관리</b></li>
-        <li><a target="_blank" href="/publish/reservedmsg.html">reservedmsg.html</a>예약관리</li>
-        <!-- ///////////////예약문자관리/////////////// -->
-
-
-        <li><b>결제관리</b></li>
-        <li><a target="_blank" href="/publish/payment1.html">payment1.html</a>요금안내/견적내기</li>
-        <li><a target="_blank" href="/publish/payment2.html">payment2.html</a>결제하기</li>
-        <li><a target="_blank" href="/publish/payment3.html">payment3.html</a>요금 결제내역</li>
-        <li><a target="_blank" href="/publish/payment4.html">payment4.html</a>요금 사용내역(table 수정 안함)</li>
-        <li><a target="_blank" href="/publish/payment5.html">payment5.html</a>세금계산서 발행 등록</li>
-        <li><a target="_blank" href="/publish/payment6.html">payment6.html</a>요금사용내역(후불회원)</li>
-        <li><a target="_blank" href="/publish/estimate.html">estimate.html</a>견적서</li>
-        <li><a target="_blank" href="/publish/use_statement.html">use_statement.html</a>사용내역서 팝업</li>
-        <li><a target="_blank" href="/publish/transaction_statement.html">transaction_statement.html</a>거래명세서 팝업</li>
-        <!-- ///////////////결제관리/////////////// -->
-
-
-        <li><b>회원가입, 로그인, 고객센터</b></li>
-
-        <li><a target="_blank" href="/publish/mem1.html">mem1.html</a>회원가입_가입화면</li>
-        <li><a target="_blank" href="/publish/mem2.html">mem2.html</a>회원가입_약관동의</li>
-        <li><a target="_blank" href="/publish/mem3.html">mem3.html</a>회원가입_정보입력</li>
-        <li><a target="_blank" href="/publish/mem4.html">mem4.html</a>회원가입_가입완료</li>
-        <!-- ///////////////회원가입/////////////// -->
-
-
-        <li>====================================================================================================================================================</li>
-
-
-        <li><a target="_blank" href="/publish/mypage_index.html">mypage_index.html</a>마이페이지>대시보드</li>
-        <!-- ///////////////마이페이지 대시보드드/////////////// -->
-
-
-        <li>====================================================================================================================================================</li>
-
-
-        <li><a target="_blank" href="/publish/mypage1.html">mypage1.html</a>로그인</li>
-        <li><a target="_blank" href="/publish/security_login_ajax.html">security_login_ajax.html</a>로그인 > 보안 로그인</li>
-        <li><a target="_blank" href="/publish/mypage1_dormant_member.html">mypage1_dormant_member.html</a>로그인 > 장기 미이용</li>
-        <li><a target="_blank" href="/publish/mypage1_dormant_member2.html">mypage1_dormant_member2.html</a>로그인 > 장기 미이용 > 확인절차</li>
-        <li><a target="_blank" href="/publish/mypage9.html">mypage9.html</a>로그인 > 아이디찾기/비밀번호 재설정</li>
-        <li><a target="_blank" href="/publish/mypage9_id.html">mypage9_id.html</a>로그인 > 아이디찾기/비밀번호 재설정 > 아이디 찾기 완료</li>
-        <li><a target="_blank" href="/publish/mypage9_password.html">mypage9_password.html</a>로그인 > 아이디찾기/비밀번호 재설정 > 비밀번호 재설정</li>
-        <!-- ///////////////로그인/////////////// -->
-
-
-        <li>====================================================================================================================================================</li>
-
-
-        <li><a target="_blank" href="/publish/mypage2.html">mypage2.html</a>마이페이지 > 회원정보 변경</li>
-
-        <li><a target="_blank" href="/publish/member_info_change_passwordCheck.html">member_info_change_passwordCheck.html</a>마이페이지 > 비밀번호 확인</li>
-        <li><a target="_blank" href="/publish/member_info_change_company.html">member_info_change_company.html</a>마이페이지 > 기업 회원정보 변경</li>
-        <li><a target="_blank" href="/publish/member_info_change_person.html">member_info_change_erson.html</a>마이페이지 > 회원정보 변경</li>
-
-        <li><a target="_blank" href="/publish/mypage3.html">mypage3.html</a>마이페이지 > 기업회원 전환</li>
-        <li><a target="_blank" href="/publish/mypage3_return.html">mypage3_return.html</a>마이페이지 > 기업회원 전환 > 반려상태</li>
-        <li><a target="_blank" href="/publish/mypage4.html">mypage4.html</a>마이페이지 > 비밀번호 변경</li>
-        <li><a target="_blank" href="/publish/mypage5.html">mypage5.html</a>마이페이지 > 발신번호 관리</li>
-        <li><a target="_blank" href="/publish/mypage5_2.html">mypage5_2.html</a>마이페이지 > 발신번호 관리 > 번호 추가</li>
-        <!-- <li><a target="_blank" href="/publish/mypage6.html">mypage6.html</a>마이페이지 > 알림설정</li> -->
-        <li><a target="_blank" href="/publish/mypage7.html">mypage7.html</a>마이페이지 > 회원탈퇴</li>
-        <li><a target="_blank" href="/publish/mypage8.html">mypage8.html</a>마이페이지 > 회원탈퇴 > 상세</li>
-        <li><a target="_blank" href="/publish/mypage_security_login.html">mypage_security_login.html</a>마이페이지 > 보안로그인</li>
-        <!-- ///////////////마이페이지/////////////// -->
-
-
-        <li>====================================================================================================================================================</li>
-
-
-        <li><a target="_blank" href="/publish/service1.html">service1.html</a>고객센터 > 공지사항</li>
-        <li><a target="_blank" href="/publish/service2.html">service2.html</a>고객센터 > 이용약관</li>
-        <li><a target="_blank" href="/publish/service1_2024.html">└ service1_2024.html</a>고객센터 > 이용약관 (2024)</li>
-        <li><a target="_blank" href="/publish/service1_2025.html">└ service1_2025.html</a>고객센터 > 이용약관 (2025)</li>
-        <li><a target="_blank" href="/publish/service3.html">service3.html</a>고객센터 > 자주하는 질문</li>
-        <li><a target="_blank" href="/publish/service4.html">service4.html</a>고객센터 > 1:1 문의</li>
-        <li><a target="_blank" href="/publish/service4_2.html">service4_2.html</a>고객센터 > 1:1 문의 > 등록</li>
-        <li><a target="_blank" href="/publish/service5.html">service5.html</a>고객센터 > 이벤트</li>
-        <li><a target="_blank" href="/publish/service6.html">service6.html</a>고객센터 > 불편신고</li>
-        <li><a target="_blank" href="/publish/service7.html">service7.html</a>고객센터 > 상세(공지사항/1:1문의/불편신고/이벤트)</li>
-        <!-- ///////////////고객센터/////////////// -->
-
-
-        <li>====================================================================================================================================================</li>
-
-        
-        <li><a target="_blank" href="/publish/firstpay_event.html">firstpay_event.html</a>첫결제 이벤트</li>
-        <li><a target="_blank" href="/publish/firstpay_event2.html">firstpay_event2.html</a>첫결제 이벤트 > 결제</li>
-        <!-- ///////////////첫결제 이벤트/////////////// -->
-
-
-        <li><b>팝업</b></li>
-        <li><a target="_blank" href="/publish/info_popup.html">사용안내 팝업</a></li>
-        <li><a target="_blank" href="/publish/popup_list.html">popup_list.html</a>팝업 리스트</li>
-        <li><a target="_blank" href="/publish/popup_pay_complete.html">popup_pay_complete.html</a>결제완료 팝업</li>
-        <li><a target="_blank" href="/publish/popup_fax_detail.html">popup_fax_detail.html</a>팩스전송결과 팝업</li>
-        <li><a target="_blank" href="/publish/popup_allimtalk_template_choice.html">popup_allimtalk_template_choice.html</a> 알림톡 템플릿 선택 팝업</li>
-        <li><a target="_blank" href="/publish/popup_friendtalk_template_choice.html">popup_friendtalk_template_choice.html</a> 친구톡 템플릿 선택 팝업</li>
-        <li><a target="_blank" href="/publish/previewList1.html">previewList1.html</a>주소록관리 인쇄 미리보기 팝업</li>
-        <li><a target="_blank" href="/publish/previewList2.html">previewList2.html</a>주소록관리 내보내기 인쇄 미리보기 팝업</li>
-        <li><a target="_blank" href="/publish/estimate.html">estimate.html</a>견적서</li>
-        <li><a target="_blank" href="/publish/estimate2.html">estimate2.html</a>문자 발송내역서서</li>
-        <li><a target="_blank" href="/publish/estimate3.html">estimate3.html</a>간이영수증</li>
-        <li><a target="_blank" href="/publish/kisa_management_ledger.html">kisa_management_ledger.html</a>KISA 신고 관리 대장</li>
-        <li><a target="_blank" href="/publish/testKakaoSendPop.html">testKakaoSendPop.html</a>테스트 발송 팝업</li>
-        <li><a target="_blank" href="/publish/use_statement.html">use_statement.html</a>사용내역서 팝업</li>
-        <!-- ///////////////팝업/////////////// -->
-
-
-        <li><b>기타</b></li>
-        <li><a target="_blank" href="/publish/email_form_dormant.html">email_form_dormant.html</a>휴면회원 메일</li>
-        <li><a target="_blank" href="/publish/maintenance.html">maintenance.html</a>시스템 점검 페이지</li>
-        <li><a target="_blank" href="/publish/intro_service.html">intro_service.html</a>문자온 소개 > 서비스 소개</li>
-        <li><a target="_blank" href="/publish/intro_function.html">intro_function.html</a>문자온 소개 > 주요기능</li>
-        <li><a target="_blank" href="/publish/intro_bestsample.html">intro_bestsample.html</a>문자온 소개 > 베스트문자샘플</li>
-        <!-- ///////////////기타/////////////// -->
-
-
-        <li><b>API</b></li>
-        <li><a target="_blank" href="/publish/api_admin4.html">api_admin4.html</a>API > 신청/관리 (API 사용 승인 후 IP 등록 후) </li>
-        <li><a target="_blank" href="/publish/api_admin3.html">api_admin3.html</a>API > 신청/관리 (API 사용 승인 후 IP 등록 전) </li>
-        <li><a target="_blank" href="/publish/api_admin2.html">api_admin2.html</a>API > 신청/관리 (API 사용 신청 후 심사중의 경우) </li>
-        <li><a target="_blank" href="/publish/api_admin1.html">api_admin1.html</a>API > 신청/관리 (API 사용 미신청의 경우) </li>
-        <li><a target="_blank" href="/publish/api_download.html">api_download.html</a>API > 예제 다운로드</li>
-        <li><a target="_blank" href="/publish/api_guide.html">api_guide.html</a>API > API 사용안내</li>
-        <li><a target="_blank" href="/publish/api_intro.html">api_intro.html</a>API > 문자 API 소개</li>
-        <!-- ///////////////API/////////////// -->
-
-
-        <li><b>광고</b></li>
-        <li><a target="_blank" href="/publish/publish_adv/send_group_text.html">send_group_text.html</a>텍스트 수정, 메인화면 이동 버튼 추가</li>
-        <li><a target="_blank" href="/publish/publish_text/send_text.html">send_text.html</a>문자보내기</li>
-        <li><a target="_blank" href="/publish/publish_text/text_send.html">text_send.html</a>문자발송</li>
-        <li><a target="_blank" href="/publish/publish_text/multi_text.html">multi_text.html</a>단체문자</li>
-        <!-- ///////////////광고/////////////// -->
-
-
-        <li><b>이메일 폼</b></li>
-        <li><a target="_blank" href="/publish/email_form_dormant.html">email_form_dormant.html</a>휴면회원전환 메일</li>
-        <li><a target="_blank" href="/publish/email_form_terms.html">email_form_terms.html</a>서비스 이용약관 개정</li>
-        <li><a target="_blank" href="/publish/email_form_terms_2024_clause.html">email_form_terms_2024_clause.html</a>서비스 이용약관 개정</li>
-        <li><a target="_blank" href="/publish/email_form_terms_2024_privacy.html">email_form_terms_2024_privacy.html</a>개인정보처리방침 개정</li>
-        <li><a target="_blank" href="/publish/email_form_terms_2025_clause.html">email_form_terms_2025_clause.html</a>서비스 이용약관 개정</li>
-        <!-- ///////////////이메일 폼/////////////// -->
-
+    <!-- tab buttons -->
+    <ul class="tab">
+      <li class="active"><label for="tab_all">전체</label></li>
+      <li><label for="tab_common">공통</label></li>
+      <li><label for="tab_msg">문자발송</label></li>
+      <li><label for="tab_kakao">카톡발송</label></li>
+      <li><label for="tab_fax">팩스발송</label></li>
+      <li><label for="tab_custom">맞춤제작</label></li>
+      <li><label for="tab_addr">주소록관리</label></li>
+      <li><label for="tab_result">발송결과</label></li>
+      <li><label for="tab_reserve">예약문자관리</label></li>
+      <li><label for="tab_pay">결제관리</label></li>
+      <li><label for="tab_join">회원가입</label></li>
+      <li><label for="tab_login">로그인</label></li>
+      <li><label for="tab_mypage">마이페이지</label></li>
+      <li><label for="tab_cs">고객센터</label></li>
+      <li><label for="tab_firstpay">첫결제 이벤트</label></li>
+      <li><label for="tab_popup">팝업</label></li>
+      <li><label for="tab_api">API</label></li>
+      <li><label for="tab_adv">광고</label></li>
+      <li><label for="tab_etc">기타</label></li>
     </ul>
+  </div>
 
+  <div class="content">
+    <!-- Table container -->
+    <div class="table_wrap">
+
+      <!-- ALL view (visible by default) -->
+      <div id="view_all" class="view">
+        <table>
+        	<colgroup>
+        		<col style="width:48px;"/>
+        		<col style="width:10%;"/>
+        		<col style="width:15%;"/>
+        		<col style="width:20%;"/>
+        		<col style="width:auto;"/>
+        		<col style="width:77px;"/>
+        		<col style="width:14%;"/>
+        	</colgroup>
+          <thead>
+            <tr>
+              <th>No</th>
+              <th>Depth01</th>
+              <th>Depth02</th>
+              <th>페이지명</th>
+              <th>파일명</th>
+              <th class="center">상태</th>
+              <th>비고</th>
+            </tr>
+          </thead>
+          <tbody>
+  			<!-- 공통 -->
+			  <tr>
+			    <td class="center">4</td>
+			    <td class="depth01">공통</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/layout/_header.html" target="_blank">header</a></td>
+			    <td class="small">/publish/layout/_header.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">5</td>
+			    <td class="depth01">공통</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/layout/_footer.html" target="_blank">footer</a></td>
+			    <td class="small">/publish/layout/_footer.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 문자발송 -->
+			  <tr>
+			    <td class="center">6</td>
+			    <td class="depth01">문자발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/sub1.html" target="_blank">문자전송</a></td>
+			    <td class="small">/publish/sub1.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <!-- <tr>
+			    <td class="center">7</td>
+			    <td class="depth01">문자발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/sub_election_v2024.html" target="_blank">선거문자</a></td>
+			    <td class="small">/publish/sub_election_v2024.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr> -->
+			  <tr>
+			    <td class="center">8</td>
+			    <td class="depth01">문자발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/photo_editer.html" target="_blank">포토에디터</a></td>
+			    <td class="small">/publish/photo_editer.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 카톡발송 -->
+			  <tr>
+			    <td class="center">9</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_allimtalk_intro.html" target="_blank">카카오톡 소개</a></td>
+			    <td class="small">/publish/kakao_allimtalk_intro.html</td>
+			    <td class="center ing">작업중</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">10</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_friendtalk_add.html" target="_blank">카카오 친구톡 템플릿 등록</a></td>
+			    <td class="small">/publish/kakao_friendtalk_add.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">11</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_use_guide.html" target="_blank">알림톡 사용안내</a></td>
+			    <td class="small">/publish/kakao_use_guide.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">12</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_allimtalk_send.html" target="_blank">알림톡 전송</a></td>
+			    <td class="small">/publish/kakao_allimtalk_send.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">13</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/testKakaoSendPop.html" target="_blank">카카오 테스트발송 팝업</a></td>
+			    <td class="small">/publish/testKakaoSendPop.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">14</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_allimtalk_add.html" target="_blank">알림톡 템플릿 등록</a></td>
+			    <td class="small">/publish/kakao_allimtalk_add.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <!-- <tr>
+			    <td class="center">15</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/reservedmsg_2023.html" target="_blank">예약관리 &gt; 카카오톡</a></td>
+			    <td class="small">/publish/reservedmsg_2023.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr> -->
+			  <tr>
+			    <td class="center">16</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_friendtalk_send.html" target="_blank">카카오 친구톡 전송</a></td>
+			    <td class="small">/publish/kakao_friendtalk_send.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">17</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_texting_detail.html" target="_blank">개인별 실패/대기 팝업</a></td>
+			    <td class="small">/publish/kakao_texting_detail.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">18</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_friendtalk_list.html" target="_blank">친구톡 템플릿 관리</a></td>
+			    <td class="small">/publish/kakao_friendtalk_list.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">19</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/popup_allimtalk_template_choice.html" target="_blank">알림톡 템플릿 선택</a></td>
+			    <td class="small">/publish/popup_allimtalk_template_choice.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">20</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_allimtalk_list.html" target="_blank">알림톡 템플릿 관리</a></td>
+			    <td class="small">/publish/kakao_allimtalk_list.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">21</td>
+			    <td class="depth01">카톡발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/kakao_profile_add.html" target="_blank">발신프로필 등록/관리</a></td>
+			    <td class="small">/publish/kakao_profile_add.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			    <!-- 팩스발송 -->
+			  <tr>
+			    <td class="center">22</td>
+			    <td class="depth01">팩스발송</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/fax_send.html" target="_blank">팩스전송</a></td>
+			    <td class="small">/publish/fax_send.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 맞춤제작 -->
+			  <tr>
+			    <td class="center">23</td>
+			    <td class="depth01">맞춤제작</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/sub2.html" target="_blank">맞춤제작</a></td>
+			    <td class="small">/publish/sub2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 주소록관리 -->
+			  <tr>
+			    <td class="center">24</td>
+			    <td class="depth01">주소록관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/adrbook1.html" target="_blank">주소록 관리</a></td>
+			    <td class="small">/publish/adrbook1.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">25</td>
+			    <td class="depth01">주소록관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/adrbook2.html" target="_blank">수신거부 관리</a></td>
+			    <td class="small">/publish/adrbook2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">26</td>
+			    <td class="depth01">주소록관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/adrbook3.html" target="_blank">주소록 입력 대행(무료)</a></td>
+			    <td class="small">/publish/adrbook3.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">27</td>
+			    <td class="depth01">주소록관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/adrbook4.html" target="_blank">폰주소록 등록</a></td>
+			    <td class="small">/publish/adrbook4.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">28</td>
+			    <td class="depth01">주소록관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/adrbook_fax.html" target="_blank">팩스 주소록 관리</a></td>
+			    <td class="small">/publish/adrbook_fax.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 발송결과 -->
+			  <tr>
+			    <td class="center">29</td>
+			    <td class="depth01">발송결과</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/textingmsg.html" target="_blank">발송관리</a></td>
+			    <td class="small">/publish/textingmsg.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">30</td>
+			    <td class="depth01">발송결과</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/textingmsg_detail.html" target="_blank">발송관리 &gt; 상세</a></td>
+			    <td class="small">/publish/textingmsg_detail.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">31</td>
+			    <td class="depth01">발송결과</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/textingmsg_detail_allimtalk.html" target="_blank">발송관리 &gt; 상세(알림톡)</a></td>
+			    <td class="small">/publish/textingmsg_detail_allimtalk.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">32</td>
+			    <td class="depth01">발송결과</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/textingmsg_detail_friendtalk.html" target="_blank">발송관리 &gt; 상세(친구톡)</a></td>
+			    <td class="small">/publish/textingmsg_detail_friendtalk.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">33</td>
+			    <td class="depth01">발송결과</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/estimate2.html" target="_blank">문자 발송내역서</a></td>
+			    <td class="small">/publish/estimate2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 예약문자관리 -->
+			  <tr>
+			    <td class="center">34</td>
+			    <td class="depth01">예약문자관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/reservedmsg.html" target="_blank">예약관리</a></td>
+			    <td class="small">/publish/reservedmsg.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 결제관리 -->
+			  <tr>
+			    <td class="center">35</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/payment1.html" target="_blank">요금안내/견적내기</a></td>
+			    <td class="small">/publish/payment1.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">36</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/payment2.html" target="_blank">결제하기</a></td>
+			    <td class="small">/publish/payment2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">37</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/payment3.html" target="_blank">요금 결제내역</a></td>
+			    <td class="small">/publish/payment3.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">38</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/payment4.html" target="_blank">요금 사용내역</a></td>
+			    <td class="small">/publish/payment4.html</td>
+			    <td class="center ing">작업중</td>
+			    <td>table 수정 안함</td>
+			  </tr>
+			  <tr>
+			    <td class="center">39</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/payment5.html" target="_blank">세금계산서 발행 등록</a></td>
+			    <td class="small">/publish/payment5.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">40</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/payment6.html" target="_blank">요금사용내역(후불회원)</a></td>
+			    <td class="small">/publish/payment6.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">41</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/estimate.html" target="_blank">견적서</a></td>
+			    <td class="small">/publish/estimate.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">42</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/use_statement.html" target="_blank">사용내역서 팝업</a></td>
+			    <td class="small">/publish/use_statement.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">43</td>
+			    <td class="depth01">결제관리</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/transaction_statement.html" target="_blank">거래명세서 팝업</a></td>
+			    <td class="small">/publish/transaction_statement.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			    <!-- 회원가입 -->
+			  <tr>
+			    <td class="center">44</td>
+			    <td class="depth01">회원가입</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/mem1.html" target="_blank">회원가입_가입화면</a></td>
+			    <td class="small">/publish/mem1.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">45</td>
+			    <td class="depth01">회원가입</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/mem2.html" target="_blank">회원가입_약관동의</a></td>
+			    <td class="small">/publish/mem2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">46</td>
+			    <td class="depth01">회원가입</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/mem3.html" target="_blank">회원가입_정보입력</a></td>
+			    <td class="small">/publish/mem3.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">47</td>
+			    <td class="depth01">회원가입</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/mem4.html" target="_blank">회원가입_가입완료</a></td>
+			    <td class="small">/publish/mem4.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 마이페이지 대시보드 -->
+			  <tr>
+			    <td class="center">48</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">대시보드</td>
+			    <td><a class="link" href="/publish/mypage_index.html" target="_blank">마이페이지 대시보드</a></td>
+			    <td class="small">/publish/mypage_index.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 로그인 -->
+			  <tr>
+			    <td class="center">49</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/mypage1.html" target="_blank">로그인</a></td>
+			    <td class="small">/publish/mypage1.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">50</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">보안</td>
+			    <td><a class="link" href="/publish/security_login_ajax.html" target="_blank">보안 로그인</a></td>
+			    <td class="small">/publish/security_login_ajax.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">51</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">장기 미이용</td>
+			    <td><a class="link" href="/publish/mypage1_dormant_member.html" target="_blank">장기 미이용</a></td>
+			    <td class="small">/publish/mypage1_dormant_member.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">52</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">장기 미이용</td>
+			    <td><a class="link" href="/publish/mypage1_dormant_member2.html" target="_blank">장기 미이용 확인절차</a></td>
+			    <td class="small">/publish/mypage1_dormant_member2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">53</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">ID/PW 찾기</td>
+			    <td><a class="link" href="/publish/mypage9.html" target="_blank">아이디/비밀번호 찾기</a></td>
+			    <td class="small">/publish/mypage9.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">54</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">ID 찾기</td>
+			    <td><a class="link" href="/publish/mypage9_id.html" target="_blank">아이디 찾기 완료</a></td>
+			    <td class="small">/publish/mypage9_id.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">55</td>
+			    <td class="depth01">로그인</td>
+			    <td class="depth02">PW 재설정</td>
+			    <td><a class="link" href="/publish/mypage9_password.html" target="_blank">비밀번호 재설정</a></td>
+			    <td class="small">/publish/mypage9_password.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 마이페이지 -->
+			  <tr>
+			    <td class="center">56</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">회원정보</td>
+			    <td><a class="link" href="/publish/mypage2.html" target="_blank">회원정보 변경</a></td>
+			    <td class="small">/publish/mypage2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">57</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">비밀번호 확인</td>
+			    <td><a class="link" href="/publish/member_info_change_passwordCheck.html" target="_blank">비밀번호 확인</a></td>
+			    <td class="small">/publish/member_info_change_passwordCheck.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">58</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">회원정보</td>
+			    <td><a class="link" href="/publish/member_info_change_company.html" target="_blank">기업 회원정보 변경</a></td>
+			    <td class="small">/publish/member_info_change_company.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">59</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">회원정보</td>
+			    <td><a class="link" href="/publish/member_info_change_person.html" target="_blank">개인 회원정보 변경</a></td>
+			    <td class="small">/publish/member_info_change_person.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">60</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">기업전환</td>
+			    <td><a class="link" href="/publish/mypage3.html" target="_blank">기업회원 전환</a></td>
+			    <td class="small">/publish/mypage3.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">61</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">기업전환</td>
+			    <td><a class="link" href="/publish/mypage3_return.html" target="_blank">기업회원 전환 반려</a></td>
+			    <td class="small">/publish/mypage3_return.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">62</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">비밀번호</td>
+			    <td><a class="link" href="/publish/mypage4.html" target="_blank">비밀번호 변경</a></td>
+			    <td class="small">/publish/mypage4.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">63</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">발신번호</td>
+			    <td><a class="link" href="/publish/mypage5.html" target="_blank">발신번호 관리</a></td>
+			    <td class="small">/publish/mypage5.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">64</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">발신번호</td>
+			    <td><a class="link" href="/publish/mypage5_2.html" target="_blank">발신번호 추가</a></td>
+			    <td class="small">/publish/mypage5_2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">65</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">회원탈퇴</td>
+			    <td><a class="link" href="/publish/mypage7.html" target="_blank">회원탈퇴</a></td>
+			    <td class="small">/publish/mypage7.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">66</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">회원탈퇴</td>
+			    <td><a class="link" href="/publish/mypage8.html" target="_blank">회원탈퇴 상세</a></td>
+			    <td class="small">/publish/mypage8.html</td>
+			    <td class="center ing">작업중</td>
+			    <td>기업회원 전환 버튼 색상 수정</td>
+			  </tr>
+			  <tr>
+			    <td class="center">67</td>
+			    <td class="depth01">마이페이지</td>
+			    <td class="depth02">보안</td>
+			    <td><a class="link" href="/publish/mypage_security_login.html" target="_blank">보안로그인</a></td>
+			    <td class="small">/publish/mypage_security_login.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 고객센터 -->
+			  <tr>
+			    <td class="center">68</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">공지사항</td>
+			    <td><a class="link" href="/publish/service1.html" target="_blank">공지사항</a></td>
+			    <td class="small">/publish/service1.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">69</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">이용약관</td>
+			    <td><a class="link" href="/publish/service2.html" target="_blank">이용약관</a></td>
+			    <td class="small">/publish/service2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">71</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">이용약관</td>
+			    <td><a class="link" href="/publish/service1_2025.html" target="_blank">이용약관 (2025)</a></td>
+			    <td class="small">/publish/service1_2025.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">72</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">FAQ</td>
+			    <td><a class="link" href="/publish/service3.html" target="_blank">자주하는 질문</a></td>
+			    <td class="small">/publish/service3.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">73</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">1:1 문의</td>
+			    <td><a class="link" href="/publish/service4.html" target="_blank">1:1 문의</a></td>
+			    <td class="small">/publish/service4.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">74</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">1:1 문의</td>
+			    <td><a class="link" href="/publish/service4_2.html" target="_blank">1:1 문의 등록</a></td>
+			    <td class="small">/publish/service4_2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">75</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">이벤트</td>
+			    <td><a class="link" href="/publish/service5.html" target="_blank">이벤트</a></td>
+			    <td class="small">/publish/service5.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">76</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">불편신고</td>
+			    <td><a class="link" href="/publish/service6.html" target="_blank">불편신고</a></td>
+			    <td class="small">/publish/service6.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">77</td>
+			    <td class="depth01">고객센터</td>
+			    <td class="depth02">상세</td>
+			    <td><a class="link" href="/publish/service7.html" target="_blank">상세 페이지</a></td>
+			    <td class="small">/publish/service7.html</td>
+			    <td class="center done">완료</td>
+			    <td>공지/문의/이벤트 공통</td>
+			  </tr>
+			    <!-- 첫결제 이벤트 -->
+			  <tr>
+			    <td class="center">78</td>
+			    <td class="depth01">첫결제 이벤트</td>
+			    <td class="depth02">-</td>
+			    <td><a class="link" href="/publish/firstpay_event.html" target="_blank">첫결제 이벤트</a></td>
+			    <td class="small">/publish/firstpay_event.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">79</td>
+			    <td class="depth01">첫결제 이벤트</td>
+			    <td class="depth02">결제</td>
+			    <td><a class="link" href="/publish/firstpay_event2.html" target="_blank">첫결제 이벤트 &gt; 결제</a></td>
+			    <td class="small">/publish/firstpay_event2.html</td>
+			    <td class="center done">완료</td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 팝업 -->
+			  <tr>
+			    <td class="center">80</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">사용안내</td>
+			    <td><a class="link" href="/publish/info_popup.html" target="_blank">사용안내 팝업</a></td>
+			    <td class="small">/publish/info_popup.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">81</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">목록</td>
+			    <td><a class="link" href="/publish/popup_list.html" target="_blank">팝업 리스트</a></td>
+			    <td class="small">/publish/popup_list.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">82</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">결제완료</td>
+			    <td><a class="link" href="/publish/popup_pay_complete.html" target="_blank">결제완료 팝업</a></td>
+			    <td class="small">/publish/popup_pay_complete.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">83</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">팩스전송결과</td>
+			    <td><a class="link" href="/publish/popup_fax_detail.html" target="_blank">팩스전송결과 팝업</a></td>
+			    <td class="small">/publish/popup_fax_detail.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">84</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">알림톡 템플릿</td>
+			    <td><a class="link" href="/publish/popup_allimtalk_template_choice.html" target="_blank">알림톡 템플릿 선택 팝업</a></td>
+			    <td class="small">/publish/popup_allimtalk_template_choice.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">85</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">친구톡 템플릿</td>
+			    <td><a class="link" href="/publish/popup_friendtalk_template_choice.html" target="_blank">친구톡 템플릿 선택 팝업</a></td>
+			    <td class="small">/publish/popup_friendtalk_template_choice.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">86</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">주소록 인쇄</td>
+			    <td><a class="link" href="/publish/previewList1.html" target="_blank">주소록관리 인쇄 미리보기 팝업</a></td>
+			    <td class="small">/publish/previewList1.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">87</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">주소록 내보내기</td>
+			    <td><a class="link" href="/publish/previewList2.html" target="_blank">주소록관리 내보내기 미리보기 팝업</a></td>
+			    <td class="small">/publish/previewList2.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">88</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">견적서</td>
+			    <td><a class="link" href="/publish/estimate.html" target="_blank">견적서</a></td>
+			    <td class="small">/publish/estimate.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">89</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">발송내역서</td>
+			    <td><a class="link" href="/publish/estimate2.html" target="_blank">문자 발송내역서</a></td>
+			    <td class="small">/publish/estimate2.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">90</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">간이영수증</td>
+			    <td><a class="link" href="/publish/estimate3.html" target="_blank">간이영수증</a></td>
+			    <td class="small">/publish/estimate3.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">91</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">KISA</td>
+			    <td><a class="link" href="/publish/kisa_management_ledger.html" target="_blank">KISA 신고 관리 대장</a></td>
+			    <td class="small">/publish/kisa_management_ledger.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">92</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">테스트 발송</td>
+			    <td><a class="link" href="/publish/testKakaoSendPop.html" target="_blank">테스트 발송 팝업</a></td>
+			    <td class="small">/publish/testKakaoSendPop.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">93</td>
+			    <td class="depth01">팝업</td>
+			    <td class="depth02">사용내역서</td>
+			    <td><a class="link" href="/publish/use_statement.html" target="_blank">사용내역서 팝업</a></td>
+			    <td class="small">/publish/use_statement.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 기타 -->
+			  <tr>
+			    <td class="center">94</td>
+			    <td class="depth01">기타</td>
+			    <td class="depth02">휴면회원 메일</td>
+			    <td><a class="link" href="/publish/email_form_dormant.html" target="_blank">휴면회원 메일</a></td>
+			    <td class="small">/publish/email_form_dormant.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">95</td>
+			    <td class="depth01">기타</td>
+			    <td class="depth02">시스템 점검</td>
+			    <td><a class="link" href="/publish/maintenance.html" target="_blank">시스템 점검 페이지</a></td>
+			    <td class="small">/publish/maintenance.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">96</td>
+			    <td class="depth01">기타</td>
+			    <td class="depth02">서비스 소개</td>
+			    <td><a class="link" href="/publish/intro_service.html" target="_blank">문자온 서비스 소개</a></td>
+			    <td class="small">/publish/intro_service.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">97</td>
+			    <td class="depth01">기타</td>
+			    <td class="depth02">주요기능</td>
+			    <td><a class="link" href="/publish/intro_function.html" target="_blank">문자온 주요기능</a></td>
+			    <td class="small">/publish/intro_function.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">98</td>
+			    <td class="depth01">기타</td>
+			    <td class="depth02">베스트문자</td>
+			    <td><a class="link" href="/publish/intro_bestsample.html" target="_blank">문자온 베스트문자샘플</a></td>
+			    <td class="small">/publish/intro_bestsample.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- API -->
+			  <tr>
+			    <td class="center">99</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">신청/관리(IP 등록 후)</td>
+			    <td><a class="link" href="/publish/api_admin4.html" target="_blank">API 신청/관리</a></td>
+			    <td class="small">/publish/api_admin4.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">100</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">신청/관리(IP 등록 전)</td>
+			    <td><a class="link" href="/publish/api_admin3.html" target="_blank">API 신청/관리</a></td>
+			    <td class="small">/publish/api_admin3.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">101</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">심사중</td>
+			    <td><a class="link" href="/publish/api_admin2.html" target="_blank">API 신청/관리</a></td>
+			    <td class="small">/publish/api_admin2.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">102</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">미신청</td>
+			    <td><a class="link" href="/publish/api_admin1.html" target="_blank">API 신청/관리</a></td>
+			    <td class="small">/publish/api_admin1.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">103</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">다운로드</td>
+			    <td><a class="link" href="/publish/api_download.html" target="_blank">API 예제 다운로드</a></td>
+			    <td class="small">/publish/api_download.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">104</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">사용안내</td>
+			    <td><a class="link" href="/publish/api_guide.html" target="_blank">API 사용안내</a></td>
+			    <td class="small">/publish/api_guide.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">105</td>
+			    <td class="depth01">API</td>
+			    <td class="depth02">소개</td>
+			    <td><a class="link" href="/publish/api_intro.html" target="_blank">문자 API 소개</a></td>
+			    <td class="small">/publish/api_intro.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 광고 -->
+			  <tr>
+			    <td class="center">106</td>
+			    <td class="depth01">광고</td>
+			    <td class="depth02">그룹문자</td>
+			    <td><a class="link" href="/publish/publish_adv/send_group_text.html" target="_blank">텍스트 수정/메인이동</a></td>
+			    <td class="small">/publish/publish_adv/send_group_text.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">107</td>
+			    <td class="depth01">광고</td>
+			    <td class="depth02">문자보내기</td>
+			    <td><a class="link" href="/publish/publish_text/send_text.html" target="_blank">문자보내기</a></td>
+			    <td class="small">/publish/publish_text/send_text.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">108</td>
+			    <td class="depth01">광고</td>
+			    <td class="depth02">문자발송</td>
+			    <td><a class="link" href="/publish/publish_text/text_send.html" target="_blank">문자발송</a></td>
+			    <td class="small">/publish/publish_text/text_send.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">109</td>
+			    <td class="depth01">광고</td>
+			    <td class="depth02">단체문자</td>
+			    <td><a class="link" href="/publish/publish_text/multi_text.html" target="_blank">단체문자</a></td>
+			    <td class="small">/publish/publish_text/multi_text.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			
+			  <!-- 이메일 폼 -->
+			  <tr>
+			    <td class="center">110</td>
+			    <td class="depth01">이메일 폼</td>
+			    <td class="depth02">휴면회원</td>
+			    <td><a class="link" href="/publish/email_form_dormant.html" target="_blank">휴면회원전환 메일</a></td>
+			    <td class="small">/publish/email_form_dormant.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">111</td>
+			    <td class="depth01">이메일 폼</td>
+			    <td class="depth02">약관 개정</td>
+			    <td><a class="link" href="/publish/email_form_terms.html" target="_blank">서비스 이용약관 개정</a></td>
+			    <td class="small">/publish/email_form_terms.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">112</td>
+			    <td class="depth01">이메일 폼</td>
+			    <td class="depth02">약관(2024)</td>
+			    <td><a class="link" href="/publish/email_form_terms_2024_clause.html" target="_blank">서비스 이용약관 개정</a></td>
+			    <td class="small">/publish/email_form_terms_2024_clause.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">113</td>
+			    <td class="depth01">이메일 폼</td>
+			    <td class="depth02">개인정보(2024)</td>
+			    <td><a class="link" href="/publish/email_form_terms_2024_privacy.html" target="_blank">개인정보처리방침 개정</a></td>
+			    <td class="small">/publish/email_form_terms_2024_privacy.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			  <tr>
+			    <td class="center">114</td>
+			    <td class="depth01">이메일 폼</td>
+			    <td class="depth02">약관(2025)</td>
+			    <td><a class="link" href="/publish/email_form_terms_2025_clause.html" target="_blank">서비스 이용약관 개정</a></td>
+			    <td class="small">/publish/email_form_terms_2025_clause.html</td>
+			    <td class="center"></td>
+			    <td></td>
+			  </tr>
+			</tbody>
+        </table>
+      </div>
+
+    </div>
+  </div>
+</div>
 
 </body>
-
-</html>
(No newline at end of file)
+</html>
 
src/main/webapp/publish/guide_bak.html (added)
+++ src/main/webapp/publish/guide_bak.html
@@ -0,0 +1,233 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <title>문자온 가이드</title>
+
+    <style>
+        * {list-style: none;text-decoration: none;color: #333;padding: 0;margin: 0;}
+        .page {margin: 10px 0 50px 0;}
+        .page>li>a {position: relative;display: inline-block;width: auto;font-weight: 600;font-size: 14px;margin: 0 20px 0 0;padding: 0 0 0 8px;}
+        .page>li>a::after {position: absolute;content: "";width: 3px;height: 3px;background: #222;border-radius: 100%;left: 0;top: 10px;}
+        .page>li>b {display: block;font-size: 18px;font-weight: 800;color: #183c7c;margin: 20px 0 10px 0;}
+        .font1 {font-weight: 600;color: darkblue;}
+        .font2 {font-weight: 600;color: teal;}
+    </style>
+</head>
+
+<body style="width: 1200px;margin: 80px auto">
+    <!-- <p>***<span class="font1"> (컨텐츠)</span> : 반복적으로 사용 안함</p>
+    <p>***<span class="font2"> (보드)</span> : 반복적으로 사용</p> -->
+
+    <ul class="page">
+        <li><a target="_blank" href="/publish/index.html">index.html</a>메인</li>
+
+        <li><b>공통</b></li>
+        <li><a target="_blank" href="/publish/layout/_header.html">_header.html</a>header</li>
+        <li><a target="_blank" href="/publish/layout/_footer.html">_footer.html</a>footer</li>
+
+        <li><b>문자발송</b></li>
+        <li><a target="_blank" href="/publish/sub1.html">sub1.html</a>문자전송</li>
+        <li><a target="_blank" href="/publish/sub_election_v2024.html">sub_election_v2024.html</a>선거문자</li>
+        <li><a target="_blank" href="/publish/photo_editer.html">photo_editer.html</a>포토에디터</li>
+        <!-- ///////////////문자발송/////////////// -->
+
+
+        <li><b>카톡발송</b></li>
+        <li><a target="_blank" href="/publish/kakao_allimtalk_intro.html">kakao_allimtalk_intro.html</a>카카오톡 소개</li>
+        <li><a target="_blank" href="/publish/kakao_friendtalk_add.html">kakao_friendtalk_add.html</a> 카카오 친구톡 템플릿 등록</li>
+        <li><a target="_blank" href="/publish/kakao_use_guide.html">kakao_use_guide.html</a>알림톡 사용안내</li>
+        <li><a target="_blank" href="/publish/kakao_allimtalk_send.html">kakao_allimtalk_send.html</a>알림톡 전송</li>
+        <li><a target="_blank" href="/publish/testKakaoSendPop.html">testKakaoSendPop.html</a>카카오 테스트발송 팝업</li>
+        <li><a target="_blank" href="/publish/kakao_allimtalk_add.html">kakao_allimtalk_add.html</a>카카오톡 설정 > 알림톡 템플릿 등록</li>
+        <li><a target="_blank" href="/publish/reservedmsg_2023.html">reservedmsg_2023.html</a>예약관리 > 카카오톡</li>
+        <li><a target="_blank" href="/publish/kakao_friendtalk_send.html">kakao_friendtalk_send.html</a> 카카오 친구톡 전송</li>
+        <li><a target="_blank" href="/publish/kakao_texting_detail.html">kakao_texting_detail.html</a>개인별 실패/대기 있을 경우 팝업</li>
+        <li><a target="_blank" href="/publish/kakao_friendtalk_list.html">kakao_friendtalk_list.html</a> 카카오 친구톡 템플릿 관리</li>
+        <li><a target="_blank" href="/publish/popup_allimtalk_template_choice.html">popup_allimtalk_template_choice.html</a>알림톡 템플릿 선택</li>
+        <li><a target="_blank" href="/publish/kakao_allimtalk_list.html">kakao_allimtalk_list.html</a>카카오톡 설정 > 알림톡 템플릿 등록/관리</li>
+        <li><a target="_blank" href="/publish/kakao_profile_add.html">kakao_profile_add.html</a>카카오톡 설정 > 발신프로필 등록/관리</li>
+        <!-- ///////////////카톡발송/////////////// -->
+
+
+        <li><b>팩스발송</b></li>
+        <li><a target="_blank" href="/publish/fax_send.html">fax_send.html</a>팩스전송</li>
+        <!-- ///////////////팩스발송/////////////// -->
+
+
+        <li><b>맞춤제작</b></li>
+        <li><a target="_blank" href="/publish/sub2.html">sub2.html</a>맞춤제작</li>
+        <!-- ///////////////맞춤제작/////////////// -->
+
+
+        <li><b>주소록관리</b></li>
+        <li><a target="_blank" href="/publish/adrbook1.html">adrbook1.html</a>주소록 관리</li>
+        <li><a target="_blank" href="/publish/adrbook2.html">adrbook2.html</a>수신거부 관리</li>
+        <li><a target="_blank" href="/publish/adrbook3.html">adrbook3.html</a>주소록 입력 대행(무료)</li>
+        <li><a target="_blank" href="/publish/adrbook4.html">adrbook4.html</a>폰주소록 등록</li>
+        <li><a target="_blank" href="/publish/adrbook_fax.html">adrbook_fax.html</a>팩스 주소록 관리</li>
+        <!-- ///////////////주소록관리/////////////// -->
+
+
+        <li><b>발송결과</b></li>
+        <li><a target="_blank" href="/publish/textingmsg.html">textingmsg.html</a>발송관리</li>
+        <li><a target="_blank" href="/publish/textingmsg_detail.html">textingmsg_detail.html</a>발송관리 > 상세</li>
+        <li><a target="_blank" href="/publish/textingmsg_detail_allimtalk.html">textingmsg_detail_allimtalk.html</a>발송관리 > 상세(알림톡)</li>
+        <li><a target="_blank" href="/publish/textingmsg_detail_friendtalk.html">textingmsg_detail_friendtalk.html</a>발송관리 > 상세(친구톡)</li>
+        <li><a target="_blank" href="/publish/estimate2.html">estimate2.html</a>문자 발송내역서</li>
+        <!-- ///////////////발송결과/////////////// -->
+
+
+        <li><b>예약문자관리</b></li>
+        <li><a target="_blank" href="/publish/reservedmsg.html">reservedmsg.html</a>예약관리</li>
+        <!-- ///////////////예약문자관리/////////////// -->
+
+
+        <li><b>결제관리</b></li>
+        <li><a target="_blank" href="/publish/payment1.html">payment1.html</a>요금안내/견적내기</li>
+        <li><a target="_blank" href="/publish/payment2.html">payment2.html</a>결제하기</li>
+        <li><a target="_blank" href="/publish/payment3.html">payment3.html</a>요금 결제내역</li>
+        <li><a target="_blank" href="/publish/payment4.html">payment4.html</a>요금 사용내역(table 수정 안함)</li>
+        <li><a target="_blank" href="/publish/payment5.html">payment5.html</a>세금계산서 발행 등록</li>
+        <li><a target="_blank" href="/publish/payment6.html">payment6.html</a>요금사용내역(후불회원)</li>
+        <li><a target="_blank" href="/publish/estimate.html">estimate.html</a>견적서</li>
+        <li><a target="_blank" href="/publish/use_statement.html">use_statement.html</a>사용내역서 팝업</li>
+        <li><a target="_blank" href="/publish/transaction_statement.html">transaction_statement.html</a>거래명세서 팝업</li>
+        <!-- ///////////////결제관리/////////////// -->
+
+
+        <li><b>회원가입, 로그인, 고객센터</b></li>
+
+        <li><a target="_blank" href="/publish/mem1.html">mem1.html</a>회원가입_가입화면</li>
+        <li><a target="_blank" href="/publish/mem2.html">mem2.html</a>회원가입_약관동의</li>
+        <li><a target="_blank" href="/publish/mem3.html">mem3.html</a>회원가입_정보입력</li>
+        <li><a target="_blank" href="/publish/mem4.html">mem4.html</a>회원가입_가입완료</li>
+        <!-- ///////////////회원가입/////////////// -->
+
+
+        <li>====================================================================================================================================================</li>
+
+
+        <li><a target="_blank" href="/publish/mypage_index.html">mypage_index.html</a>마이페이지>대시보드</li>
+        <!-- ///////////////마이페이지 대시보드드/////////////// -->
+
+
+        <li>====================================================================================================================================================</li>
+
+
+        <li><a target="_blank" href="/publish/mypage1.html">mypage1.html</a>로그인</li>
+        <li><a target="_blank" href="/publish/security_login_ajax.html">security_login_ajax.html</a>로그인 > 보안 로그인</li>
+        <li><a target="_blank" href="/publish/mypage1_dormant_member.html">mypage1_dormant_member.html</a>로그인 > 장기 미이용</li>
+        <li><a target="_blank" href="/publish/mypage1_dormant_member2.html">mypage1_dormant_member2.html</a>로그인 > 장기 미이용 > 확인절차</li>
+        <li><a target="_blank" href="/publish/mypage9.html">mypage9.html</a>로그인 > 아이디찾기/비밀번호 재설정</li>
+        <li><a target="_blank" href="/publish/mypage9_id.html">mypage9_id.html</a>로그인 > 아이디찾기/비밀번호 재설정 > 아이디 찾기 완료</li>
+        <li><a target="_blank" href="/publish/mypage9_password.html">mypage9_password.html</a>로그인 > 아이디찾기/비밀번호 재설정 > 비밀번호 재설정</li>
+        <!-- ///////////////로그인/////////////// -->
+
+
+        <li>====================================================================================================================================================</li>
+
+
+        <li><a target="_blank" href="/publish/mypage2.html">mypage2.html</a>마이페이지 > 회원정보 변경</li>
+
+        <li><a target="_blank" href="/publish/member_info_change_passwordCheck.html">member_info_change_passwordCheck.html</a>마이페이지 > 비밀번호 확인</li>
+        <li><a target="_blank" href="/publish/member_info_change_company.html">member_info_change_company.html</a>마이페이지 > 기업 회원정보 변경</li>
+        <li><a target="_blank" href="/publish/member_info_change_person.html">member_info_change_erson.html</a>마이페이지 > 회원정보 변경</li>
+
+        <li><a target="_blank" href="/publish/mypage3.html">mypage3.html</a>마이페이지 > 기업회원 전환</li>
+        <li><a target="_blank" href="/publish/mypage3_return.html">mypage3_return.html</a>마이페이지 > 기업회원 전환 > 반려상태</li>
+        <li><a target="_blank" href="/publish/mypage4.html">mypage4.html</a>마이페이지 > 비밀번호 변경</li>
+        <li><a target="_blank" href="/publish/mypage5.html">mypage5.html</a>마이페이지 > 발신번호 관리</li>
+        <li><a target="_blank" href="/publish/mypage5_2.html">mypage5_2.html</a>마이페이지 > 발신번호 관리 > 번호 추가</li>
+        <!-- <li><a target="_blank" href="/publish/mypage6.html">mypage6.html</a>마이페이지 > 알림설정</li> -->
+        <li><a target="_blank" href="/publish/mypage7.html">mypage7.html</a>마이페이지 > 회원탈퇴</li>
+        <li><a target="_blank" href="/publish/mypage8.html">mypage8.html</a>마이페이지 > 회원탈퇴 > 상세</li>
+        <li><a target="_blank" href="/publish/mypage_security_login.html">mypage_security_login.html</a>마이페이지 > 보안로그인</li>
+        <!-- ///////////////마이페이지/////////////// -->
+
+
+        <li>====================================================================================================================================================</li>
+
+
+        <li><a target="_blank" href="/publish/service1.html">service1.html</a>고객센터 > 공지사항</li>
+        <li><a target="_blank" href="/publish/service2.html">service2.html</a>고객센터 > 이용약관</li>
+        <li><a target="_blank" href="/publish/service1_2024.html">└ service1_2024.html</a>고객센터 > 이용약관 (2024)</li>
+        <li><a target="_blank" href="/publish/service1_2025.html">└ service1_2025.html</a>고객센터 > 이용약관 (2025)</li>
+        <li><a target="_blank" href="/publish/service3.html">service3.html</a>고객센터 > 자주하는 질문</li>
+        <li><a target="_blank" href="/publish/service4.html">service4.html</a>고객센터 > 1:1 문의</li>
+        <li><a target="_blank" href="/publish/service4_2.html">service4_2.html</a>고객센터 > 1:1 문의 > 등록</li>
+        <li><a target="_blank" href="/publish/service5.html">service5.html</a>고객센터 > 이벤트</li>
+        <li><a target="_blank" href="/publish/service6.html">service6.html</a>고객센터 > 불편신고</li>
+        <li><a target="_blank" href="/publish/service7.html">service7.html</a>고객센터 > 상세(공지사항/1:1문의/불편신고/이벤트)</li>
+        <!-- ///////////////고객센터/////////////// -->
+
+
+        <li>====================================================================================================================================================</li>
+
+        
+        <li><a target="_blank" href="/publish/firstpay_event.html">firstpay_event.html</a>첫결제 이벤트</li>
+        <li><a target="_blank" href="/publish/firstpay_event2.html">firstpay_event2.html</a>첫결제 이벤트 > 결제</li>
+        <!-- ///////////////첫결제 이벤트/////////////// -->
+
+
+        <li><b>팝업</b></li>
+        <li><a target="_blank" href="/publish/info_popup.html">사용안내 팝업</a></li>
+        <li><a target="_blank" href="/publish/popup_list.html">popup_list.html</a>팝업 리스트</li>
+        <li><a target="_blank" href="/publish/popup_pay_complete.html">popup_pay_complete.html</a>결제완료 팝업</li>
+        <li><a target="_blank" href="/publish/popup_fax_detail.html">popup_fax_detail.html</a>팩스전송결과 팝업</li>
+        <li><a target="_blank" href="/publish/popup_allimtalk_template_choice.html">popup_allimtalk_template_choice.html</a> 알림톡 템플릿 선택 팝업</li>
+        <li><a target="_blank" href="/publish/popup_friendtalk_template_choice.html">popup_friendtalk_template_choice.html</a> 친구톡 템플릿 선택 팝업</li>
+        <li><a target="_blank" href="/publish/previewList1.html">previewList1.html</a>주소록관리 인쇄 미리보기 팝업</li>
+        <li><a target="_blank" href="/publish/previewList2.html">previewList2.html</a>주소록관리 내보내기 인쇄 미리보기 팝업</li>
+        <li><a target="_blank" href="/publish/estimate.html">estimate.html</a>견적서</li>
+        <li><a target="_blank" href="/publish/estimate2.html">estimate2.html</a>문자 발송내역서서</li>
+        <li><a target="_blank" href="/publish/estimate3.html">estimate3.html</a>간이영수증</li>
+        <li><a target="_blank" href="/publish/kisa_management_ledger.html">kisa_management_ledger.html</a>KISA 신고 관리 대장</li>
+        <li><a target="_blank" href="/publish/testKakaoSendPop.html">testKakaoSendPop.html</a>테스트 발송 팝업</li>
+        <li><a target="_blank" href="/publish/use_statement.html">use_statement.html</a>사용내역서 팝업</li>
+        <!-- ///////////////팝업/////////////// -->
+
+
+        <li><b>기타</b></li>
+        <li><a target="_blank" href="/publish/email_form_dormant.html">email_form_dormant.html</a>휴면회원 메일</li>
+        <li><a target="_blank" href="/publish/maintenance.html">maintenance.html</a>시스템 점검 페이지</li>
+        <li><a target="_blank" href="/publish/intro_service.html">intro_service.html</a>문자온 소개 > 서비스 소개</li>
+        <li><a target="_blank" href="/publish/intro_function.html">intro_function.html</a>문자온 소개 > 주요기능</li>
+        <li><a target="_blank" href="/publish/intro_bestsample.html">intro_bestsample.html</a>문자온 소개 > 베스트문자샘플</li>
+        <!-- ///////////////기타/////////////// -->
+
+
+        <li><b>API</b></li>
+        <li><a target="_blank" href="/publish/api_admin4.html">api_admin4.html</a>API > 신청/관리 (API 사용 승인 후 IP 등록 후) </li>
+        <li><a target="_blank" href="/publish/api_admin3.html">api_admin3.html</a>API > 신청/관리 (API 사용 승인 후 IP 등록 전) </li>
+        <li><a target="_blank" href="/publish/api_admin2.html">api_admin2.html</a>API > 신청/관리 (API 사용 신청 후 심사중의 경우) </li>
+        <li><a target="_blank" href="/publish/api_admin1.html">api_admin1.html</a>API > 신청/관리 (API 사용 미신청의 경우) </li>
+        <li><a target="_blank" href="/publish/api_download.html">api_download.html</a>API > 예제 다운로드</li>
+        <li><a target="_blank" href="/publish/api_guide.html">api_guide.html</a>API > API 사용안내</li>
+        <li><a target="_blank" href="/publish/api_intro.html">api_intro.html</a>API > 문자 API 소개</li>
+        <!-- ///////////////API/////////////// -->
+
+
+        <li><b>광고</b></li>
+        <li><a target="_blank" href="/publish/publish_adv/send_group_text.html">send_group_text.html</a>텍스트 수정, 메인화면 이동 버튼 추가</li>
+        <li><a target="_blank" href="/publish/publish_text/send_text.html">send_text.html</a>문자보내기</li>
+        <li><a target="_blank" href="/publish/publish_text/text_send.html">text_send.html</a>문자발송</li>
+        <li><a target="_blank" href="/publish/publish_text/multi_text.html">multi_text.html</a>단체문자</li>
+        <!-- ///////////////광고/////////////// -->
+
+
+        <li><b>이메일 폼</b></li>
+        <li><a target="_blank" href="/publish/email_form_dormant.html">email_form_dormant.html</a>휴면회원전환 메일</li>
+        <li><a target="_blank" href="/publish/email_form_terms.html">email_form_terms.html</a>서비스 이용약관 개정</li>
+        <li><a target="_blank" href="/publish/email_form_terms_2024_clause.html">email_form_terms_2024_clause.html</a>서비스 이용약관 개정</li>
+        <li><a target="_blank" href="/publish/email_form_terms_2024_privacy.html">email_form_terms_2024_privacy.html</a>개인정보처리방침 개정</li>
+        <li><a target="_blank" href="/publish/email_form_terms_2025_clause.html">email_form_terms_2025_clause.html</a>서비스 이용약관 개정</li>
+        <!-- ///////////////이메일 폼/////////////// -->
+
+    </ul>
+
+
+</body>
+
+</html>(No newline at end of file)
src/main/webapp/publish/images/CI.png (Binary)
--- src/main/webapp/publish/images/CI.png
+++ src/main/webapp/publish/images/CI.png
Binary file is not shown
 
src/main/webapp/publish/images/CI_gray.png (Binary) (added)
+++ src/main/webapp/publish/images/CI_gray.png
Binary file is not shown
src/main/webapp/publish/images/all_menu.png (Binary)
--- src/main/webapp/publish/images/all_menu.png
+++ src/main/webapp/publish/images/all_menu.png
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/api_guide_00.png (Binary)
--- src/main/webapp/publish/images/api_intro_cont/api_guide_00.png
+++ src/main/webapp/publish/images/api_intro_cont/api_guide_00.png
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/api_guide_01.jpg (Binary)
--- src/main/webapp/publish/images/api_intro_cont/api_guide_01.jpg
+++ src/main/webapp/publish/images/api_intro_cont/api_guide_01.jpg
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/api_guide_02.jpg (Binary)
--- src/main/webapp/publish/images/api_intro_cont/api_guide_02.jpg
+++ src/main/webapp/publish/images/api_intro_cont/api_guide_02.jpg
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/api_guide_03.jpg (Binary)
--- src/main/webapp/publish/images/api_intro_cont/api_guide_03.jpg
+++ src/main/webapp/publish/images/api_intro_cont/api_guide_03.jpg
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/api_guide_04.jpg (Binary)
--- src/main/webapp/publish/images/api_intro_cont/api_guide_04.jpg
+++ src/main/webapp/publish/images/api_intro_cont/api_guide_04.jpg
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/api_intro_visual.jpg (Binary)
--- src/main/webapp/publish/images/api_intro_cont/api_intro_visual.jpg
+++ src/main/webapp/publish/images/api_intro_cont/api_intro_visual.jpg
Binary file is not shown
src/main/webapp/publish/images/api_intro_cont/icon_api_next.png (Binary)
--- src/main/webapp/publish/images/api_intro_cont/icon_api_next.png
+++ src/main/webapp/publish/images/api_intro_cont/icon_api_next.png
Binary file is not shown
src/main/webapp/publish/images/btn_delete.png (Binary)
--- src/main/webapp/publish/images/btn_delete.png
+++ src/main/webapp/publish/images/btn_delete.png
Binary file is not shown
src/main/webapp/publish/images/btn_list_icon.png (Binary)
--- src/main/webapp/publish/images/btn_list_icon.png
+++ src/main/webapp/publish/images/btn_list_icon.png
Binary file is not shown
src/main/webapp/publish/images/btn_searchclose.png (Binary)
--- src/main/webapp/publish/images/btn_searchclose.png
+++ src/main/webapp/publish/images/btn_searchclose.png
Binary file is not shown
src/main/webapp/publish/images/btn_thumbnail_icon.png (Binary)
--- src/main/webapp/publish/images/btn_thumbnail_icon.png
+++ src/main/webapp/publish/images/btn_thumbnail_icon.png
Binary file is not shown
src/main/webapp/publish/images/calendar/calendarIcon2.png (Binary)
--- src/main/webapp/publish/images/calendar/calendarIcon2.png
+++ src/main/webapp/publish/images/calendar/calendarIcon2.png
Binary file is not shown
 
src/main/webapp/publish/images/content/Frame 8162857.png (Binary) (added)
+++ src/main/webapp/publish/images/content/Frame 8162857.png
Binary file is not shown
src/main/webapp/publish/images/content/add_icon.png (Binary)
--- src/main/webapp/publish/images/content/add_icon.png
+++ src/main/webapp/publish/images/content/add_icon.png
Binary file is not shown
src/main/webapp/publish/images/content/banner_call01.png (Binary)
--- src/main/webapp/publish/images/content/banner_call01.png
+++ src/main/webapp/publish/images/content/banner_call01.png
Binary file is not shown
src/main/webapp/publish/images/content/banner_charge.jpg (Binary)
--- src/main/webapp/publish/images/content/banner_charge.jpg
+++ src/main/webapp/publish/images/content/banner_charge.jpg
Binary file is not shown
src/main/webapp/publish/images/content/banner_email01.png (Binary)
--- src/main/webapp/publish/images/content/banner_email01.png
+++ src/main/webapp/publish/images/content/banner_email01.png
Binary file is not shown
src/main/webapp/publish/images/content/banner_kakao01.png (Binary)
--- src/main/webapp/publish/images/content/banner_kakao01.png
+++ src/main/webapp/publish/images/content/banner_kakao01.png
Binary file is not shown
src/main/webapp/publish/images/content/close_folder2.png (Binary)
--- src/main/webapp/publish/images/content/close_folder2.png
+++ src/main/webapp/publish/images/content/close_folder2.png
Binary file is not shown
src/main/webapp/publish/images/content/custom2_sample1.png (Binary)
--- src/main/webapp/publish/images/content/custom2_sample1.png
+++ src/main/webapp/publish/images/content/custom2_sample1.png
Binary file is not shown
src/main/webapp/publish/images/content/custom2_sample2.png (Binary)
--- src/main/webapp/publish/images/content/custom2_sample2.png
+++ src/main/webapp/publish/images/content/custom2_sample2.png
Binary file is not shown
src/main/webapp/publish/images/content/custom2_sample3.png (Binary)
--- src/main/webapp/publish/images/content/custom2_sample3.png
+++ src/main/webapp/publish/images/content/custom2_sample3.png
Binary file is not shown
src/main/webapp/publish/images/content/custom_visual.jpg (Binary)
--- src/main/webapp/publish/images/content/custom_visual.jpg
+++ src/main/webapp/publish/images/content/custom_visual.jpg
Binary file is not shown
 
src/main/webapp/publish/images/content/excel download.png (Binary) (added)
+++ src/main/webapp/publish/images/content/excel download.png
Binary file is not shown
 
src/main/webapp/publish/images/content/excel get.png (Binary) (added)
+++ src/main/webapp/publish/images/content/excel get.png
Binary file is not shown
 
src/main/webapp/publish/images/content/excel.png (Binary) (added)
+++ src/main/webapp/publish/images/content/excel.png
Binary file is not shown
src/main/webapp/publish/images/content/file_add.png (Binary)
--- src/main/webapp/publish/images/content/file_add.png
+++ src/main/webapp/publish/images/content/file_add.png
Binary file is not shown
src/main/webapp/publish/images/content/file_img2.png (Binary)
--- src/main/webapp/publish/images/content/file_img2.png
+++ src/main/webapp/publish/images/content/file_img2.png
Binary file is not shown
src/main/webapp/publish/images/content/history_icon1.png (Binary)
--- src/main/webapp/publish/images/content/history_icon1.png
+++ src/main/webapp/publish/images/content/history_icon1.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_account_arrow.png (Binary)
--- src/main/webapp/publish/images/content/icon_account_arrow.png
+++ src/main/webapp/publish/images/content/icon_account_arrow.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging2.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging2.png
+++ src/main/webapp/publish/images/content/icon_charging2.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging2_small.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging2_small.png
+++ src/main/webapp/publish/images/content/icon_charging2_small.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging3.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging3.png
+++ src/main/webapp/publish/images/content/icon_charging3.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging3_small.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging3_small.png
+++ src/main/webapp/publish/images/content/icon_charging3_small.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging4.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging4.png
+++ src/main/webapp/publish/images/content/icon_charging4.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging4_small.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging4_small.png
+++ src/main/webapp/publish/images/content/icon_charging4_small.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging5.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging5.png
+++ src/main/webapp/publish/images/content/icon_charging5.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_charging5_small.png (Binary)
--- src/main/webapp/publish/images/content/icon_charging5_small.png
+++ src/main/webapp/publish/images/content/icon_charging5_small.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_fax_title.png (Binary)
--- src/main/webapp/publish/images/content/icon_fax_title.png
+++ src/main/webapp/publish/images/content/icon_fax_title.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_kakao_guide01.png (Binary)
--- src/main/webapp/publish/images/content/icon_kakao_guide01.png
+++ src/main/webapp/publish/images/content/icon_kakao_guide01.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_kakao_guide02.png (Binary)
--- src/main/webapp/publish/images/content/icon_kakao_guide02.png
+++ src/main/webapp/publish/images/content/icon_kakao_guide02.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_kakao_guide03.png (Binary)
--- src/main/webapp/publish/images/content/icon_kakao_guide03.png
+++ src/main/webapp/publish/images/content/icon_kakao_guide03.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_kakao_guide04.png (Binary)
--- src/main/webapp/publish/images/content/icon_kakao_guide04.png
+++ src/main/webapp/publish/images/content/icon_kakao_guide04.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_kakao_guide_next.png (Binary)
--- src/main/webapp/publish/images/content/icon_kakao_guide_next.png
+++ src/main/webapp/publish/images/content/icon_kakao_guide_next.png
Binary file is not shown
 
src/main/webapp/publish/images/content/icon_mypage_message-1.png (Binary) (added)
+++ src/main/webapp/publish/images/content/icon_mypage_message-1.png
Binary file is not shown
 
src/main/webapp/publish/images/content/icon_mypage_message-2.png (Binary) (added)
+++ src/main/webapp/publish/images/content/icon_mypage_message-2.png
Binary file is not shown
src/main/webapp/publish/images/content/icon_mypage_message.png (Binary)
--- src/main/webapp/publish/images/content/icon_mypage_message.png
+++ src/main/webapp/publish/images/content/icon_mypage_message.png
Binary file is not shown
src/main/webapp/publish/images/content/layerPopup_close.png (Binary)
--- src/main/webapp/publish/images/content/layerPopup_close.png
+++ src/main/webapp/publish/images/content/layerPopup_close.png
Binary file is not shown
src/main/webapp/publish/images/content/memo_img.png (Binary)
--- src/main/webapp/publish/images/content/memo_img.png
+++ src/main/webapp/publish/images/content/memo_img.png
Binary file is not shown
src/main/webapp/publish/images/content/open_folder2.png (Binary)
--- src/main/webapp/publish/images/content/open_folder2.png
+++ src/main/webapp/publish/images/content/open_folder2.png
Binary file is not shown
src/main/webapp/publish/images/content/order_change.png (Binary)
--- src/main/webapp/publish/images/content/order_change.png
+++ src/main/webapp/publish/images/content/order_change.png
Binary file is not shown
src/main/webapp/publish/images/content/page_first.png (Binary)
--- src/main/webapp/publish/images/content/page_first.png
+++ src/main/webapp/publish/images/content/page_first.png
Binary file is not shown
src/main/webapp/publish/images/content/page_last.png (Binary)
--- src/main/webapp/publish/images/content/page_last.png
+++ src/main/webapp/publish/images/content/page_last.png
Binary file is not shown
src/main/webapp/publish/images/content/page_next.png (Binary)
--- src/main/webapp/publish/images/content/page_next.png
+++ src/main/webapp/publish/images/content/page_next.png
Binary file is not shown
src/main/webapp/publish/images/content/page_prev.png (Binary)
--- src/main/webapp/publish/images/content/page_prev.png
+++ src/main/webapp/publish/images/content/page_prev.png
Binary file is not shown
src/main/webapp/publish/images/content/print_icon.png (Binary)
--- src/main/webapp/publish/images/content/print_icon.png
+++ src/main/webapp/publish/images/content/print_icon.png
Binary file is not shown
src/main/webapp/publish/images/content/qmIcon_s.png (Binary)
--- src/main/webapp/publish/images/content/qmIcon_s.png
+++ src/main/webapp/publish/images/content/qmIcon_s.png
Binary file is not shown
src/main/webapp/publish/images/content/remove_icon.png (Binary)
--- src/main/webapp/publish/images/content/remove_icon.png
+++ src/main/webapp/publish/images/content/remove_icon.png
Binary file is not shown
src/main/webapp/publish/images/content/searchW.png (Binary)
--- src/main/webapp/publish/images/content/searchW.png
+++ src/main/webapp/publish/images/content/searchW.png
Binary file is not shown
src/main/webapp/publish/images/content/titBoxIcon.png (Binary)
--- src/main/webapp/publish/images/content/titBoxIcon.png
+++ src/main/webapp/publish/images/content/titBoxIcon.png
Binary file is not shown
src/main/webapp/publish/images/content/txt_img.png (Binary)
--- src/main/webapp/publish/images/content/txt_img.png
+++ src/main/webapp/publish/images/content/txt_img.png
Binary file is not shown
src/main/webapp/publish/images/favicon/android-icon-144x144.png (Binary)
--- src/main/webapp/publish/images/favicon/android-icon-144x144.png
+++ src/main/webapp/publish/images/favicon/android-icon-144x144.png
Binary file is not shown
src/main/webapp/publish/images/favicon/android-icon-192x192.png (Binary)
--- src/main/webapp/publish/images/favicon/android-icon-192x192.png
+++ src/main/webapp/publish/images/favicon/android-icon-192x192.png
Binary file is not shown
src/main/webapp/publish/images/favicon/android-icon-36x36.png (Binary)
--- src/main/webapp/publish/images/favicon/android-icon-36x36.png
+++ src/main/webapp/publish/images/favicon/android-icon-36x36.png
Binary file is not shown
src/main/webapp/publish/images/favicon/android-icon-48x48.png (Binary)
--- src/main/webapp/publish/images/favicon/android-icon-48x48.png
+++ src/main/webapp/publish/images/favicon/android-icon-48x48.png
Binary file is not shown
src/main/webapp/publish/images/favicon/android-icon-72x72.png (Binary)
--- src/main/webapp/publish/images/favicon/android-icon-72x72.png
+++ src/main/webapp/publish/images/favicon/android-icon-72x72.png
Binary file is not shown
src/main/webapp/publish/images/favicon/android-icon-96x96.png (Binary)
--- src/main/webapp/publish/images/favicon/android-icon-96x96.png
+++ src/main/webapp/publish/images/favicon/android-icon-96x96.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-114x114.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-114x114.png
+++ src/main/webapp/publish/images/favicon/apple-icon-114x114.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-120x120.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-120x120.png
+++ src/main/webapp/publish/images/favicon/apple-icon-120x120.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-144x144.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-144x144.png
+++ src/main/webapp/publish/images/favicon/apple-icon-144x144.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-152x152.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-152x152.png
+++ src/main/webapp/publish/images/favicon/apple-icon-152x152.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-180x180.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-180x180.png
+++ src/main/webapp/publish/images/favicon/apple-icon-180x180.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-57x57.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-57x57.png
+++ src/main/webapp/publish/images/favicon/apple-icon-57x57.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-60x60.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-60x60.png
+++ src/main/webapp/publish/images/favicon/apple-icon-60x60.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-72x72.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-72x72.png
+++ src/main/webapp/publish/images/favicon/apple-icon-72x72.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-76x76.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-76x76.png
+++ src/main/webapp/publish/images/favicon/apple-icon-76x76.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon-precomposed.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon-precomposed.png
+++ src/main/webapp/publish/images/favicon/apple-icon-precomposed.png
Binary file is not shown
src/main/webapp/publish/images/favicon/apple-icon.png (Binary)
--- src/main/webapp/publish/images/favicon/apple-icon.png
+++ src/main/webapp/publish/images/favicon/apple-icon.png
Binary file is not shown
src/main/webapp/publish/images/favicon/favicon-16x16.png (Binary)
--- src/main/webapp/publish/images/favicon/favicon-16x16.png
+++ src/main/webapp/publish/images/favicon/favicon-16x16.png
Binary file is not shown
src/main/webapp/publish/images/favicon/favicon-32x32.png (Binary)
--- src/main/webapp/publish/images/favicon/favicon-32x32.png
+++ src/main/webapp/publish/images/favicon/favicon-32x32.png
Binary file is not shown
src/main/webapp/publish/images/favicon/favicon-96x96.png (Binary)
--- src/main/webapp/publish/images/favicon/favicon-96x96.png
+++ src/main/webapp/publish/images/favicon/favicon-96x96.png
Binary file is not shown
src/main/webapp/publish/images/favicon/favicon.ico (Binary)
--- src/main/webapp/publish/images/favicon/favicon.ico
+++ src/main/webapp/publish/images/favicon/favicon.ico
Binary file is not shown
src/main/webapp/publish/images/favicon/manifest.json
--- src/main/webapp/publish/images/favicon/manifest.json
+++ src/main/webapp/publish/images/favicon/manifest.json
@@ -1,5 +1,5 @@
 {
- "name": "App",
+ "name": "문자고",
  "icons": [
   {
    "src": "\/android-icon-36x36.png",
src/main/webapp/publish/images/favicon/ms-icon-144x144.png (Binary)
--- src/main/webapp/publish/images/favicon/ms-icon-144x144.png
+++ src/main/webapp/publish/images/favicon/ms-icon-144x144.png
Binary file is not shown
src/main/webapp/publish/images/favicon/ms-icon-150x150.png (Binary)
--- src/main/webapp/publish/images/favicon/ms-icon-150x150.png
+++ src/main/webapp/publish/images/favicon/ms-icon-150x150.png
Binary file is not shown
src/main/webapp/publish/images/favicon/ms-icon-310x310.png (Binary)
--- src/main/webapp/publish/images/favicon/ms-icon-310x310.png
+++ src/main/webapp/publish/images/favicon/ms-icon-310x310.png
Binary file is not shown
src/main/webapp/publish/images/favicon/ms-icon-70x70.png (Binary)
--- src/main/webapp/publish/images/favicon/ms-icon-70x70.png
+++ src/main/webapp/publish/images/favicon/ms-icon-70x70.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon01.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon01.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon02.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon02.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon03.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon03.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon04.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon04.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon05.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon05.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon06.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon06.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon07.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon07.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon08.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon08.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon09.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon09.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon10.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon10.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon11.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon11.png
Binary file is not shown
 
src/main/webapp/publish/images/function_icon12.png (Binary) (added)
+++ src/main/webapp/publish/images/function_icon12.png
Binary file is not shown
 
src/main/webapp/publish/images/function_title.png (Binary) (added)
+++ src/main/webapp/publish/images/function_title.png
Binary file is not shown
src/main/webapp/publish/images/goTop.png (Binary)
--- src/main/webapp/publish/images/goTop.png
+++ src/main/webapp/publish/images/goTop.png
Binary file is not shown
src/main/webapp/publish/images/hdTop_FavStar.png (Binary)
--- src/main/webapp/publish/images/hdTop_FavStar.png
+++ src/main/webapp/publish/images/hdTop_FavStar.png
Binary file is not shown
src/main/webapp/publish/images/hdTop_center.png (Binary)
--- src/main/webapp/publish/images/hdTop_center.png
+++ src/main/webapp/publish/images/hdTop_center.png
Binary file is not shown
src/main/webapp/publish/images/hdTop_mypage.png (Binary)
--- src/main/webapp/publish/images/hdTop_mypage.png
+++ src/main/webapp/publish/images/hdTop_mypage.png
Binary file is not shown
 
src/main/webapp/publish/images/icon/quick4_hover.png (Binary) (added)
+++ src/main/webapp/publish/images/icon/quick4_hover.png
Binary file is not shown
 
src/main/webapp/publish/images/icon/quick6_hover.png (Binary) (added)
+++ src/main/webapp/publish/images/icon/quick6_hover.png
Binary file is not shown
src/main/webapp/publish/images/icon_qucik_cscenter.png (Binary)
--- src/main/webapp/publish/images/icon_qucik_cscenter.png
+++ src/main/webapp/publish/images/icon_qucik_cscenter.png
Binary file is not shown
 
src/main/webapp/publish/images/icon_search.png (Binary) (added)
+++ src/main/webapp/publish/images/icon_search.png
Binary file is not shown
 
src/main/webapp/publish/images/icon_select.png (Binary) (added)
+++ src/main/webapp/publish/images/icon_select.png
Binary file is not shown
 
src/main/webapp/publish/images/icon_select_white.png (Binary) (added)
+++ src/main/webapp/publish/images/icon_select_white.png
Binary file is not shown
 
src/main/webapp/publish/images/intro_service_banner.jpg (Binary) (added)
+++ src/main/webapp/publish/images/intro_service_banner.jpg
Binary file is not shown
 
src/main/webapp/publish/images/intro_service_title.jpg (Binary) (added)
+++ src/main/webapp/publish/images/intro_service_title.jpg
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/arrow.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/arrow.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/bank.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/bank.png
+++ src/main/webapp/publish/images/kakao_intro_cont/bank.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/brandMsg_use1.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/brandMsg_use1.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/brandMsg_use2.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/brandMsg_use2.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/brandMsg_use3.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/brandMsg_use3.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/delivery.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/delivery.png
+++ src/main/webapp/publish/images/kakao_intro_cont/delivery.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/event.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/event.png
+++ src/main/webapp/publish/images/kakao_intro_cont/event.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/icon_kakao.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/icon_kakao.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/icon_msg.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/icon_msg.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/kakao_intro_title.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/kakao_intro_title.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/organization.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/organization.png
+++ src/main/webapp/publish/images/kakao_intro_cont/organization.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/phone.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/phone.png
+++ src/main/webapp/publish/images/kakao_intro_cont/phone.png
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/phone_brandMsg.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/phone_brandMsg.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/reservation.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/reservation.png
+++ src/main/webapp/publish/images/kakao_intro_cont/reservation.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/service_01.jpg (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/service_01.jpg
+++ src/main/webapp/publish/images/kakao_intro_cont/service_01.jpg
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/service_01.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/service_01.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/service_02.jpg (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/service_02.jpg
+++ src/main/webapp/publish/images/kakao_intro_cont/service_02.jpg
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/service_02.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/service_02.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/service_03.jpg (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/service_03.jpg
+++ src/main/webapp/publish/images/kakao_intro_cont/service_03.jpg
Binary file is not shown
 
src/main/webapp/publish/images/kakao_intro_cont/service_03.png (Binary) (added)
+++ src/main/webapp/publish/images/kakao_intro_cont/service_03.png
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/service_04.jpg (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/service_04.jpg
+++ src/main/webapp/publish/images/kakao_intro_cont/service_04.jpg
Binary file is not shown
src/main/webapp/publish/images/kakao_intro_cont/travel.png (Binary)
--- src/main/webapp/publish/images/kakao_intro_cont/travel.png
+++ src/main/webapp/publish/images/kakao_intro_cont/travel.png
Binary file is not shown
src/main/webapp/publish/images/kakao_pay.png (Binary)
--- src/main/webapp/publish/images/kakao_pay.png
+++ src/main/webapp/publish/images/kakao_pay.png
Binary file is not shown
src/main/webapp/publish/images/main/btn_more01.png (Binary)
--- src/main/webapp/publish/images/main/btn_more01.png
+++ src/main/webapp/publish/images/main/btn_more01.png
Binary file is not shown
src/main/webapp/publish/images/main/btn_more02.png (Binary)
--- src/main/webapp/publish/images/main/btn_more02.png
+++ src/main/webapp/publish/images/main/btn_more02.png
Binary file is not shown
src/main/webapp/publish/images/main/btn_next.png (Binary)
--- src/main/webapp/publish/images/main/btn_next.png
+++ src/main/webapp/publish/images/main/btn_next.png
Binary file is not shown
src/main/webapp/publish/images/main/btn_prev.png (Binary)
--- src/main/webapp/publish/images/main/btn_prev.png
+++ src/main/webapp/publish/images/main/btn_prev.png
Binary file is not shown
src/main/webapp/publish/images/main/cont1_next.png (Binary)
--- src/main/webapp/publish/images/main/cont1_next.png
+++ src/main/webapp/publish/images/main/cont1_next.png
Binary file is not shown
src/main/webapp/publish/images/main/cont1_prev.png (Binary)
--- src/main/webapp/publish/images/main/cont1_prev.png
+++ src/main/webapp/publish/images/main/cont1_prev.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_080.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_080.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_adress.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_adress.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_api.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_api.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_automation.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_automation.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_conversion.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_conversion.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_customize2.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_customize2.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_map.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_map.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon/mb_photoeditor.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon/mb_photoeditor.png
Binary file is not shown
 
src/main/webapp/publish/images/main/icon_qucik_cscenter.png (Binary) (added)
+++ src/main/webapp/publish/images/main/icon_qucik_cscenter.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_080.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_080.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_adress.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_adress.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_api.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_api.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_automation.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_automation.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_conversion.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_conversion.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_customize2.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_customize2.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_map.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_map.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_massage.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_massage.png
Binary file is not shown
 
src/main/webapp/publish/images/main/mb_photoeditor.png (Binary) (added)
+++ src/main/webapp/publish/images/main/mb_photoeditor.png
Binary file is not shown
src/main/webapp/publish/images/main/service01.png (Binary)
--- src/main/webapp/publish/images/main/service01.png
+++ src/main/webapp/publish/images/main/service01.png
Binary file is not shown
src/main/webapp/publish/images/main/service02.png (Binary)
--- src/main/webapp/publish/images/main/service02.png
+++ src/main/webapp/publish/images/main/service02.png
Binary file is not shown
src/main/webapp/publish/images/main/service03.png (Binary)
--- src/main/webapp/publish/images/main/service03.png
+++ src/main/webapp/publish/images/main/service03.png
Binary file is not shown
src/main/webapp/publish/images/main/service04.png (Binary)
--- src/main/webapp/publish/images/main/service04.png
+++ src/main/webapp/publish/images/main/service04.png
Binary file is not shown
src/main/webapp/publish/images/main/service05.png (Binary)
--- src/main/webapp/publish/images/main/service05.png
+++ src/main/webapp/publish/images/main/service05.png
Binary file is not shown
src/main/webapp/publish/images/main/service06.png (Binary)
--- src/main/webapp/publish/images/main/service06.png
+++ src/main/webapp/publish/images/main/service06.png
Binary file is not shown
src/main/webapp/publish/images/main/serviceCenter.png (Binary)
--- src/main/webapp/publish/images/main/serviceCenter.png
+++ src/main/webapp/publish/images/main/serviceCenter.png
Binary file is not shown
src/main/webapp/publish/images/main/visualStart.png (Binary)
--- src/main/webapp/publish/images/main/visualStart.png
+++ src/main/webapp/publish/images/main/visualStart.png
Binary file is not shown
src/main/webapp/publish/images/main/visualStop.png (Binary)
--- src/main/webapp/publish/images/main/visualStop.png
+++ src/main/webapp/publish/images/main/visualStop.png
Binary file is not shown
src/main/webapp/publish/images/main/visual_next.png (Binary)
--- src/main/webapp/publish/images/main/visual_next.png
+++ src/main/webapp/publish/images/main/visual_next.png
Binary file is not shown
src/main/webapp/publish/images/main/visual_prev.png (Binary)
--- src/main/webapp/publish/images/main/visual_prev.png
+++ src/main/webapp/publish/images/main/visual_prev.png
Binary file is not shown
src/main/webapp/publish/images/mem/join1_1.png (Binary)
--- src/main/webapp/publish/images/mem/join1_1.png
+++ src/main/webapp/publish/images/mem/join1_1.png
Binary file is not shown
src/main/webapp/publish/images/mem/join1_2.png (Binary)
--- src/main/webapp/publish/images/mem/join1_2.png
+++ src/main/webapp/publish/images/mem/join1_2.png
Binary file is not shown
src/main/webapp/publish/images/mem/join4_bg.png (Binary)
--- src/main/webapp/publish/images/mem/join4_bg.png
+++ src/main/webapp/publish/images/mem/join4_bg.png
Binary file is not shown
src/main/webapp/publish/images/mem/req_deco1.png (Binary)
--- src/main/webapp/publish/images/mem/req_deco1.png
+++ src/main/webapp/publish/images/mem/req_deco1.png
Binary file is not shown
src/main/webapp/publish/images/mem/req_deco2.png (Binary)
--- src/main/webapp/publish/images/mem/req_deco2.png
+++ src/main/webapp/publish/images/mem/req_deco2.png
Binary file is not shown
src/main/webapp/publish/images/mem/req_deco3.png (Binary)
--- src/main/webapp/publish/images/mem/req_deco3.png
+++ src/main/webapp/publish/images/mem/req_deco3.png
Binary file is not shown
src/main/webapp/publish/images/mem/step1.png (Binary)
--- src/main/webapp/publish/images/mem/step1.png
+++ src/main/webapp/publish/images/mem/step1.png
Binary file is not shown
src/main/webapp/publish/images/mem/step1_on.png (Binary)
--- src/main/webapp/publish/images/mem/step1_on.png
+++ src/main/webapp/publish/images/mem/step1_on.png
Binary file is not shown
src/main/webapp/publish/images/mem/step2.png (Binary)
--- src/main/webapp/publish/images/mem/step2.png
+++ src/main/webapp/publish/images/mem/step2.png
Binary file is not shown
src/main/webapp/publish/images/mem/step2_on.png (Binary)
--- src/main/webapp/publish/images/mem/step2_on.png
+++ src/main/webapp/publish/images/mem/step2_on.png
Binary file is not shown
src/main/webapp/publish/images/mem/step3.png (Binary)
--- src/main/webapp/publish/images/mem/step3.png
+++ src/main/webapp/publish/images/mem/step3.png
Binary file is not shown
src/main/webapp/publish/images/mem/step3_on.png (Binary)
--- src/main/webapp/publish/images/mem/step3_on.png
+++ src/main/webapp/publish/images/mem/step3_on.png
Binary file is not shown
src/main/webapp/publish/images/never_pay.png (Binary)
--- src/main/webapp/publish/images/never_pay.png
+++ src/main/webapp/publish/images/never_pay.png
Binary file is not shown
src/main/webapp/publish/images/payco.png (Binary)
--- src/main/webapp/publish/images/payco.png
+++ src/main/webapp/publish/images/payco.png
Binary file is not shown
src/main/webapp/publish/images/plus.png (Binary)
--- src/main/webapp/publish/images/plus.png
+++ src/main/webapp/publish/images/plus.png
Binary file is not shown
src/main/webapp/publish/images/plus2.png (Binary)
--- src/main/webapp/publish/images/plus2.png
+++ src/main/webapp/publish/images/plus2.png
Binary file is not shown
src/main/webapp/publish/images/popup/editer_tab1.png (Binary)
--- src/main/webapp/publish/images/popup/editer_tab1.png
+++ src/main/webapp/publish/images/popup/editer_tab1.png
Binary file is not shown
src/main/webapp/publish/images/popup/img_number_bg.png (Binary)
--- src/main/webapp/publish/images/popup/img_number_bg.png
+++ src/main/webapp/publish/images/popup/img_number_bg.png
Binary file is not shown
src/main/webapp/publish/images/popup/pro_ex.png (Binary)
--- src/main/webapp/publish/images/popup/pro_ex.png
+++ src/main/webapp/publish/images/popup/pro_ex.png
Binary file is not shown
src/main/webapp/publish/images/popup/search.png (Binary)
--- src/main/webapp/publish/images/popup/search.png
+++ src/main/webapp/publish/images/popup/search.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/title01_icon.png (Binary) (added)
+++ src/main/webapp/publish/images/popup/title01_icon.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/title02_icon.png (Binary) (added)
+++ src/main/webapp/publish/images/popup/title02_icon.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/title03_icon.png (Binary) (added)
+++ src/main/webapp/publish/images/popup/title03_icon.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/title04_icon.png (Binary) (added)
+++ src/main/webapp/publish/images/popup/title04_icon.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/title05_icon.png (Binary) (added)
+++ src/main/webapp/publish/images/popup/title05_icon.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/tw_banner.png (Binary) (added)
+++ src/main/webapp/publish/images/popup/tw_banner.png
Binary file is not shown
 
src/main/webapp/publish/images/popup/tw_con_01.jpg (Binary) (added)
+++ src/main/webapp/publish/images/popup/tw_con_01.jpg
Binary file is not shown
 
src/main/webapp/publish/images/popup/tw_con_02.jpg (Binary) (added)
+++ src/main/webapp/publish/images/popup/tw_con_02.jpg
Binary file is not shown
 
src/main/webapp/publish/images/popup/tw_con_03.jpg (Binary) (added)
+++ src/main/webapp/publish/images/popup/tw_con_03.jpg
Binary file is not shown
 
src/main/webapp/publish/images/popup/tw_con_04.jpg (Binary) (added)
+++ src/main/webapp/publish/images/popup/tw_con_04.jpg
Binary file is not shown
 
src/main/webapp/publish/images/popup/tw_con_05.jpg (Binary) (added)
+++ src/main/webapp/publish/images/popup/tw_con_05.jpg
Binary file is not shown
src/main/webapp/publish/images/quick1.png (Binary)
--- src/main/webapp/publish/images/quick1.png
+++ src/main/webapp/publish/images/quick1.png
Binary file is not shown
src/main/webapp/publish/images/quick1_hover.png (Binary)
--- src/main/webapp/publish/images/quick1_hover.png
+++ src/main/webapp/publish/images/quick1_hover.png
Binary file is not shown
src/main/webapp/publish/images/quick2.png (Binary)
--- src/main/webapp/publish/images/quick2.png
+++ src/main/webapp/publish/images/quick2.png
Binary file is not shown
src/main/webapp/publish/images/quick2_hover.png (Binary)
--- src/main/webapp/publish/images/quick2_hover.png
+++ src/main/webapp/publish/images/quick2_hover.png
Binary file is not shown
src/main/webapp/publish/images/quick3.png (Binary)
--- src/main/webapp/publish/images/quick3.png
+++ src/main/webapp/publish/images/quick3.png
Binary file is not shown
src/main/webapp/publish/images/quick3_hover.png (Binary)
--- src/main/webapp/publish/images/quick3_hover.png
+++ src/main/webapp/publish/images/quick3_hover.png
Binary file is not shown
src/main/webapp/publish/images/quick4.png (Binary)
--- src/main/webapp/publish/images/quick4.png
+++ src/main/webapp/publish/images/quick4.png
Binary file is not shown
src/main/webapp/publish/images/quick4_hover.png (Binary)
--- src/main/webapp/publish/images/quick4_hover.png
+++ src/main/webapp/publish/images/quick4_hover.png
Binary file is not shown
src/main/webapp/publish/images/quick5.png (Binary)
--- src/main/webapp/publish/images/quick5.png
+++ src/main/webapp/publish/images/quick5.png
Binary file is not shown
src/main/webapp/publish/images/quick5_hover.png (Binary)
--- src/main/webapp/publish/images/quick5_hover.png
+++ src/main/webapp/publish/images/quick5_hover.png
Binary file is not shown
src/main/webapp/publish/images/quick6.png (Binary)
--- src/main/webapp/publish/images/quick6.png
+++ src/main/webapp/publish/images/quick6.png
Binary file is not shown
src/main/webapp/publish/images/quick6_hover.png (Binary)
--- src/main/webapp/publish/images/quick6_hover.png
+++ src/main/webapp/publish/images/quick6_hover.png
Binary file is not shown
src/main/webapp/publish/images/quick7.png (Binary)
--- src/main/webapp/publish/images/quick7.png
+++ src/main/webapp/publish/images/quick7.png
Binary file is not shown
src/main/webapp/publish/images/quick7_hover.png (Binary)
--- src/main/webapp/publish/images/quick7_hover.png
+++ src/main/webapp/publish/images/quick7_hover.png
Binary file is not shown
 
src/main/webapp/publish/images/quick7_hvoer.png (Binary) (added)
+++ src/main/webapp/publish/images/quick7_hvoer.png
Binary file is not shown
src/main/webapp/publish/images/quick8.png (Binary)
--- src/main/webapp/publish/images/quick8.png
+++ src/main/webapp/publish/images/quick8.png
Binary file is not shown
src/main/webapp/publish/images/quick8_hover.png (Binary)
--- src/main/webapp/publish/images/quick8_hover.png
+++ src/main/webapp/publish/images/quick8_hover.png
Binary file is not shown
src/main/webapp/publish/images/required_read.gif (Binary)
--- src/main/webapp/publish/images/required_read.gif
+++ src/main/webapp/publish/images/required_read.gif
Binary file is not shown
 
src/main/webapp/publish/images/required_read.png (Binary) (added)
+++ src/main/webapp/publish/images/required_read.png
Binary file is not shown
src/main/webapp/publish/images/search.png (Binary)
--- src/main/webapp/publish/images/search.png
+++ src/main/webapp/publish/images/search.png
Binary file is not shown
src/main/webapp/publish/images/search02.png (Binary)
--- src/main/webapp/publish/images/search02.png
+++ src/main/webapp/publish/images/search02.png
Binary file is not shown
src/main/webapp/publish/images/select_search.png (Binary)
--- src/main/webapp/publish/images/select_search.png
+++ src/main/webapp/publish/images/select_search.png
Binary file is not shown
src/main/webapp/publish/images/select_search2.png (Binary)
--- src/main/webapp/publish/images/select_search2.png
+++ src/main/webapp/publish/images/select_search2.png
Binary file is not shown
src/main/webapp/publish/images/simple_small.png (Binary)
--- src/main/webapp/publish/images/simple_small.png
+++ src/main/webapp/publish/images/simple_small.png
Binary file is not shown
src/main/webapp/publish/images/sortDown.png (Binary)
--- src/main/webapp/publish/images/sortDown.png
+++ src/main/webapp/publish/images/sortDown.png
Binary file is not shown
src/main/webapp/publish/images/sortUp.png (Binary)
--- src/main/webapp/publish/images/sortUp.png
+++ src/main/webapp/publish/images/sortUp.png
Binary file is not shown
src/main/webapp/publish/images/toss_pay.png (Binary)
--- src/main/webapp/publish/images/toss_pay.png
+++ src/main/webapp/publish/images/toss_pay.png
Binary file is not shown
src/main/webapp/publish/index.html
--- src/main/webapp/publish/index.html
+++ src/main/webapp/publish/index.html
@@ -39,6 +39,7 @@
 	<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&amp;display=swap">
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/main.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
src/main/webapp/publish/info_popup.html
--- src/main/webapp/publish/info_popup.html
+++ src/main/webapp/publish/info_popup.html
@@ -10,6 +10,7 @@
   <link rel="stylesheet" href="/publish/css/reset.css">
   <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
   <link rel="stylesheet" href="/publish/css/common.css">
+  <link rel="stylesheet" href="/publish/css/style.css">
   <link rel="stylesheet" href="/publish/css/button.css">
   <link rel="stylesheet" href="/publish/css/content.css">
   <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/info_popup_adrbook_fax.html
--- src/main/webapp/publish/info_popup_adrbook_fax.html
+++ src/main/webapp/publish/info_popup_adrbook_fax.html
@@ -7,6 +7,7 @@
   <link rel="stylesheet" href="/publish/css/reset.css">
   <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
   <link rel="stylesheet" href="/publish/css/common.css">
+  <link rel="stylesheet" href="/publish/css/style.css">
   <link rel="stylesheet" href="/publish/css/button.css">
   <link rel="stylesheet" href="/publish/css/content.css?date=202301160001">
   <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/intro_bestsample.html
--- src/main/webapp/publish/intro_bestsample.html
+++ src/main/webapp/publish/intro_bestsample.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/intro_function.html
--- src/main/webapp/publish/intro_function.html
+++ src/main/webapp/publish/intro_function.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
@@ -154,10 +155,94 @@
                     <div class="heading">
                         <h2>주요기능</h2>
                     </div>
-                    <div class="intro_cont">
-                        <div class="img_cont">
-                            <img src="/publish/images/intro_function.jpg" alt="">
+                    <div class="intro_cont function">
+                        <div class="title">
+                        	<img src="/publish/images/function_title.png" alt="" /> 이제 <strong>문자고</strong>의 다양한 기능을 경험해보세요.
                         </div>
+                        
+                        <div class="function_list">
+	                        <div class="title">
+	                   			<strong>주요기능</strong>
+	                   		</div>
+	                        <ul class="box_list">
+	                   			<li>
+	                   				<i class="icon icon01"></i>
+	                   				<p class="summary">
+	                   					별도의 프로그램 설치없이 웹(web)에서 <span>최대 30만건</span> 이상 끊김 없는 대량 전송 가능
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon02"></i>
+	                   				<p class="summary">
+	                   					문자 내 특정문구(성명, 단어 등)를 수신자 별로 다르게 <span>일괄변환(치환) 기능 </span>제공
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon03"></i>
+	                   				<p class="summary">
+	                   					별도 모듈 설치 없이 소스를 추가하여 간단하게 발송할 수 있는 <span>문자연동(API) 제공</span>
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon04"></i>
+	                   				<p class="summary">
+	                   					기업 마케팅 도구로 활용되는 카카오 비즈니스 서비스인 <span>알림톡, 브랜드메시지 지원</span>
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon05"></i>
+	                   				<p class="summary">
+	                   					대량‧그림문자에 최적화된 사용자 UI/UX 및 <span>강력한 문자발송빌더<span class="color_red">*</span></span> 제공
+	                   					<span class="cf_text"><span class="color_red">*</span> 드래그앤드롭빌더, 예약 및 테스트 발송, 주소록 등록, 주소록 불러오기, 자주 보내는 번호, 문자저장, 내문자함 등</span>
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon06"></i>
+	                   				<p class="summary">
+	                   					쉽고 편리한 <span>주소록 관리모듈<span class="color_red">*</span> 및 폰주소록(CSV, XLSX) 등록</span> 기능 제공
+	                   					<span class="cf_text"><span class="color_red">*</span> 그룹생성‧합치기‧복사, 주소록 내보내기, 중복번호 자동필터, 문자 바로보내기, 엑셀 다운로드, 인쇄하기 등</span>
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon07"></i>
+	                   				<p class="summary">
+	                   					장문(LMS), 그림(MMS) 메시지 <span>제목 입력</span> 기능 및 <span>이미지 3장 일괄 전송, 문자 미리보기</span> 제공
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon08"></i>
+	                   				<p class="summary">
+	                   					스티커, 이미지 자르기, 텍스트 입력 등 자사 기술로 개발한 <span>문자 포토에디터</span> 무료 제공
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon09"></i>
+	                   				<p class="summary">
+	                   					문자메시지에 <span>지도 및 약도 추가 <br />기능</span> 제공
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon10"></i>
+	                   				<p class="summary">
+	                   					다양한 <span>결제수단</span>(신용카드, 간편결제, 전용계좌, 즉시이체) 제공
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon11"></i>
+	                   				<p class="summary">
+	                   					쉽게 확인 가능한 <span>결제, 사용내역, 문자전송결과 등 통합관리 기능<span class="color_red">*</span></span> 제공
+	                   					<span class="cf_text"><span class="color_red">*</span> PDF 및 엑셀 다운로드 지원, 문자 유형별‧전송건별 문자전송 상태, 건수, 성공률, 실패사유 등</span>
+	                   				</p>
+	                   			</li>
+	                   			<li>
+	                   				<i class="icon icon12"></i>
+	                   				<p class="summary">
+	                   					<span>신속한 비용처리</span> 자동화(견적서, 세금계산서 자동발행<span class="color_red">*</span>, 현금영수증 등)
+	                   					<span class="cf_text"><span class="color_red">*</span> 세금계산서 결제액 전체 일괄 발행 가능(타사 : 총 충전금에서 월별 사용액만 발행 가능)</span>
+	                   				</p>
+	                   			</li>
+	                   		</ul>
+                   		</div>
                     </div>
                 </div>
 
src/main/webapp/publish/intro_service.html
--- src/main/webapp/publish/intro_service.html
+++ src/main/webapp/publish/intro_service.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
@@ -155,10 +156,83 @@
                     <div class="heading">
                         <h2>서비스 소개</h2>
                     </div>
-                    <div class="intro_cont">
-                        <div class="img_cont">
-                            <img src="/publish/images/intro_service.jpg" alt="">
-                        </div>
+                    <div class="intro_cont service">
+                    	<img src="/publish/images/intro_service_title.jpg" alt="">
+                    	
+                    	<div class="why_cont">
+                    		<div class="title">
+                    			<strong>왜 문자고일까요?</strong>
+                    		</div>
+                    		<ul class="box_list">
+                    			<li>
+                    				<div class="title">
+                    					<span>1.</span> 대량문자·단체문자 전송
+                    				</div>
+                    				<p class="summary">별도의 설치 과정 없이 최대 30만 건까지 한번에 전송 가능하며, 특정문구 일괄변환, 지도 및 약도 기능 등을 제공하고 있습니다.</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>2.</span> 문자연동(API) 제공
+                    				</div>
+                    				<p class="summary">웹 API 연동 서비스를 제공하여 별도 모듈 설치 없이 소스 추가만으로 간편하게 문자 발송이 가능합니다.</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>3.</span> 알림톡, 브랜드메시지 제공
+                    				</div>
+                    				<p class="summary">기업의 마케팅 도구로 활용되는 카카오 비즈니스 서비스인 알림톡, 브랜드메시지를 제공하고 있습니다.</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>4.</span> 고객을 위한 무료 서비스
+                    				</div>
+                    				<p class="summary">주소록 입력 대행, 080무료수신거부, 문자 포토에디터, 프리미엄 문자 샘플 등 필수 서비스를 무료로 제공하고 있습니다.</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>5.</span> 그림문자 맞춤제작
+                    				</div>
+                    				<p class="summary">효과적인 홍보를 위해 고품질의 다양한 샘플을 활용하여 고객이 원하는 이미지로 맞춤제작 해드립니다.</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>6.</span> 자동화 기반 비용처리
+                    				</div>
+                    				<p class="summary">견적서, 세금계산서, 현금영수증 등 비용처리 업무를 자동화하여 편리하게 이용할 수 있습니다. (결제금액 전액 계산서 발행 가능)</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>7.</span> 안정적인 시스템 운영
+                    				</div>
+                    				<p class="summary">외주나 위탁없이 자체기술로 숙련된 엔지니어를 통해 365일 24시간 즉각적 기술대응으로 안정적인 서비스를 제공합니다.</p>
+                    			</li>
+                    			<li>
+                    				<div class="title">
+                    					<span>8.</span> 1:1 전문 상담 제공
+                    				</div>
+                    				<p class="summary">실시간 모니터링 및 전문 상담원에 의한 전화, 카카오톡, 원격지원 등으로 상담을 받을 수 있습니다.</p>
+                    			</li>
+                    		</ul>
+                    		<img src="/publish/images/intro_service_banner.jpg" alt="" />
+                    		
+                    		<div class="user_content">
+                    			<div class="title">
+                    				<strong>주요 이용고객</strong>
+                    			</div>
+                    			<dl class="user_list box">
+                    				<dt>개인(사업자)</dt>
+                    				<dd>동호회, 동문회, 향우회, 병원, 부동산, 음식점, 마트, 대리점, 숙박업, 전문직 사무실, 소셜커머스 사업자, 교육시설(학원, 학교, 유치원, 어린이집), 스포츠시설(골프장, 피트니스) 등</dd>
+                    				<dt>기업‧협회‧단체</dt>
+                    				<dd>기업(대‧중‧소기업), 협회, 조합, 비영리단체, 종교단체(교회, 사찰), 은행, 카드사, 쇼핑몰, 택배사, 보험사, 리서치사 등</dd>
+                    				<dt>공공</dt>
+                    				<dd>정부, 지방자치단체, 국회, 지방의회, 법원, 공공기관, 공직유관단체, 도서관, 미술관, 전시관, 공연시설, 영화관 등</dd>
+                    			</dl>
+                    			<dl class="box">
+                    				<dd class="color_red">*도박, 대출, 성인, 의약품, 주식, 비트코인, 스미싱 등 불법 스팸메시지는 전송이 불가합니다.</dd>
+                    			</dl>
+                    		</div>
+                    		
+                    	</div>
                     </div>
                 </div>
 
src/main/webapp/publish/js/main.js
--- src/main/webapp/publish/js/main.js
+++ src/main/webapp/publish/js/main.js
@@ -2,7 +2,7 @@
 
 $(document).ready(function() {
 
-	/* content1 슬라이드 */
+	/* 배너 슬라이드 */
 	var mySwiper = new Swiper('.swiper2', {
 		slidesPerView: 4,
 		spaceBetween: 0,
@@ -17,13 +17,14 @@
 			clickable: true,
 		},
 		navigation: {
-			nextEl: '.swiper2 .swiper-button-next',
-			prevEl: '.swiper2 .swiper-button-prev',
+			nextEl: '.banner_slide .swiper-button-next',
+			prevEl: '.banner_slide .swiper-button-prev',
 		},
+		roundLengths: true,
 	});
 
-	$(".banner_w .swiper-slide-next").find(".contWrap").addClass("on");
-	$(".banner_w .contWrap").mouseover(function(){
+	$(".banner_slide .swiper-slide-next").find(".contWrap").addClass("on");
+	$(".banner_slide .contWrap").mouseover(function(){
 		$(this).addClass("on");
 		$(this).parent().addClass("on");
 		$(this).parent().siblings().find(".contWrap").removeClass("on");
@@ -34,7 +35,7 @@
 		mySwiper.autoplay.stop();
 	});
 
-	$(".banner_w .contWrap").mouseout(function () {
+	$(".banner_slide .contWrap").mouseout(function () {
 		$(this).removeClass("on");
 		$(this).parent().removeClass("on");
 		$(this).parent().siblings().find(".contWrap").removeClass("on");
@@ -42,17 +43,17 @@
 		mySwiper.autoplay.start();
 	});
 	
-	$(".banner_w .swiper-pagination").click(function(){
+	$(".banner_slide .swiper-pagination").click(function(){
 		$(".contWrap").removeClass("on");
 		$(".swiper2 .contWrap").addClass("on");
 	});
 
-	$(".banner_w .swiper-button-next").click(function(){
+	$(".banner_slide .swiper-button-next").click(function(){
 		$(".contWrap").removeClass("on");
 		$(".swiper2 .contWrap").addClass("on");
 	});
 
-	$(".banner_w .swiper-button-prev").click(function(){
+	$(".banner_slide .swiper-button-prev").click(function(){
 		$(".contWrap").removeClass("on");
 		$(".swiper2 .contWrap").addClass("on");
 	});
src/main/webapp/publish/kakao_allimtalk_add.html
--- src/main/webapp/publish/kakao_allimtalk_add.html
+++ src/main/webapp/publish/kakao_allimtalk_add.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_allimtalk_intro.html
--- src/main/webapp/publish/kakao_allimtalk_intro.html
+++ src/main/webapp/publish/kakao_allimtalk_intro.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/kakao_allimtalk_list.html
--- src/main/webapp/publish/kakao_allimtalk_list.html
+++ src/main/webapp/publish/kakao_allimtalk_list.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_allimtalk_send.html
--- src/main/webapp/publish/kakao_allimtalk_send.html
+++ src/main/webapp/publish/kakao_allimtalk_send.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_friendtalk_add.html
--- src/main/webapp/publish/kakao_friendtalk_add.html
+++ src/main/webapp/publish/kakao_friendtalk_add.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_friendtalk_list.html
--- src/main/webapp/publish/kakao_friendtalk_list.html
+++ src/main/webapp/publish/kakao_friendtalk_list.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_friendtalk_send.html
--- src/main/webapp/publish/kakao_friendtalk_send.html
+++ src/main/webapp/publish/kakao_friendtalk_send.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_profile_add.html
--- src/main/webapp/publish/kakao_profile_add.html
+++ src/main/webapp/publish/kakao_profile_add.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kakao_texting_detail.html
--- src/main/webapp/publish/kakao_texting_detail.html
+++ src/main/webapp/publish/kakao_texting_detail.html
@@ -10,6 +10,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/kakao_use_guide.html
--- src/main/webapp/publish/kakao_use_guide.html
+++ src/main/webapp/publish/kakao_use_guide.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/adrbook.css">
src/main/webapp/publish/kisa.html
--- src/main/webapp/publish/kisa.html
+++ src/main/webapp/publish/kisa.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/layout/_header.html
--- src/main/webapp/publish/layout/_header.html
+++ src/main/webapp/publish/layout/_header.html
@@ -90,20 +90,22 @@
   <div class="header_body">
     <div class="inner table">
       <h1 class="logo"><a href="/publish/index.html" alt="문자온 메인 바로가기"><img src="/publish/images/CI.png" alt="문자온 CI"></a></h1>
-      <ul class="gnbWrap table_cell">
-        <li><a href="#">문자전송</a></li>
-        <li><a href="#">카톡발송</a></li>
-        <li><a href="#">팩스발송</a></li>
-        <li><a href="#">맞춤제작</a></li>
-        <li><a href="#">주소록 관리</a></li>
-        <li><a href="#">발송결과</a></li>
-        <li><a href="#">예약문자관리</a></li>
-        <li><a href="#">결제관리</a></li>
-      </ul>
-      <div class="s_menu">
-        <i class="allSearch_info"><span>문자검색</span></i>
-        <button type="button" title="전체검색" class="allSearch" onclick="searchToggle();"><img src="/publish/images/search.png" alt="검색영역 열기" class="allMenu"></button>
-        <button type="button" title="전체메뉴" onclick="sitemapToggle(this);"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
+      <div class="gnb_right">
+	      <ul class="gnbWrap table_cell">
+	        <li><a href="#">문자전송</a></li>
+	        <li><a href="#">카톡발송</a></li>
+	        <li><a href="#">팩스발송</a></li>
+	        <li><a href="#">맞춤제작</a></li>
+	        <li><a href="#">주소록 관리</a></li>
+	        <li><a href="#">발송결과</a></li>
+	        <li><a href="#">예약문자관리</a></li>
+	        <li><a href="#">결제관리</a></li>
+	      </ul>
+	      <div class="s_menu">
+	        <i class="allSearch_info"><span>문자검색</span></i>
+	        <button type="button" title="전체검색" class="allSearch" onclick="searchToggle();"><img src="/publish/images/search.png" alt="검색영역 열기" class="allMenu"></button>
+	        <button type="button" title="전체메뉴" onclick="sitemapToggle(this);"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
+	      </div>
       </div>
     </div>
 
@@ -311,7 +313,7 @@
       <div class="login_left">
         <div class="login_info">
           <div class="login2_name" onclick="location.href='/publish/member_info_change_company.html'">
-            <i class="icon_user"></i>
+            
             <p>정수빈</p><span>(개인) 님</span>
           </div>
           <div class="session">
@@ -321,7 +323,7 @@
             <button type="button" onclick="sessionExpend(); return false;">연장</button>
           </div>
           <!-- <button type="button" class="btnType btnType3" onclick="location.href='/web/user/mberInfoIndex.do'">마이페이지</button> -->
-          <button type="button" class="btnType btn_36 fill_gray" onclick="location.href='/web/uat/uia/actionLogout.do'">로그아웃</button>
+          <button type="button" class="btnType btnType1" onclick="location.href='/web/uat/uia/actionLogout.do'">로그아웃</button>
 
           <div class="security_box green_box">
             <a href="/web/user/mberSecureLogin.do" class="title">보안로그인</a>
@@ -375,34 +377,9 @@
                 </div>
                 <span class="fwMd" id="hdUserMoney">999,999,999.99</span>원
               </div>
+              <button type="button" class="btnType btnType1">충전</button>
             </div>
-            <button type="button" class="btnType btnType3">충전</button>
-            <!-- <div class="account_box">
-              <button type="button" class="btnType btnType3">전용계좌</button>
-              <dl>
-                <dt>전용계좌</dt>
-                <dd>기업은행 48011304697636</dd>
-              </dl>
-            </div> -->
-          </div>
-          <!-- <div class="check_money">
-             <div class="holdingsum_box">
-        <i></i>
-                 <p>보유잔액<span class="fwMd" id="hdUserMoney">123</span>원</p>
-            <dl>
-          <dd>후불제 고객의 보유잔액(캐시)은 당월 발송 가능<br>금액을 말하며 <span>매월 1일 자동으로 충전</span>됩니다.</dd>
-        </dl>
-         </div>
-         <button type="button" class="btnType btnType3" onclick="location.href='/web/member/pay/PayView.do'">충전</button>
-      <div class="account_box">
-        <button type="button" class="btnType btnType3" onclick="location.href='/web/member/pay/PayView.do?tabType=2'">전용계좌</button>
-        </div>
-    </div> -->
-          <div class="point">
-            <i></i>
-            <p>포인트 <span class="fwMd">9,999,999</span>원</p>
-            <button type="button" data-tooltip="popup04" class="btnType btnType3" onclick="popScrSetting();">교환</button>
-          </div>
+            
         </div>
       </div>
     </div>
src/main/webapp/publish/mem1.html
--- src/main/webapp/publish/mem1.html
+++ src/main/webapp/publish/mem1.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mem2.html
--- src/main/webapp/publish/mem2.html
+++ src/main/webapp/publish/mem2.html
@@ -8,6 +8,7 @@
 			<link rel="stylesheet" href="/publish/css/reset.css">
 			<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 			<link rel="stylesheet" href="/publish/css/common.css">
+			<link rel="stylesheet" href="/publish/css/style.css">
 			<link rel="stylesheet" href="/publish/css/button.css">
 			<link rel="stylesheet" href="/publish/css/content.css">
 			<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mem3.html
--- src/main/webapp/publish/mem3.html
+++ src/main/webapp/publish/mem3.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/mem4.html
--- src/main/webapp/publish/mem4.html
+++ src/main/webapp/publish/mem4.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mem4_company.html
--- src/main/webapp/publish/mem4_company.html
+++ src/main/webapp/publish/mem4_company.html
@@ -7,6 +7,7 @@
     <title>회원가입 < 문자온</title> <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
             <link rel="stylesheet" href="/publish/css/reset.css">
             <link rel="stylesheet" href="/publish/css/common.css">
+            <link rel="stylesheet" href="/publish/css/style.css">
             <link rel="stylesheet" href="/publish/css/button.css">
             <link rel="stylesheet" href="/publish/css/content.css">
             <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/member_info_change_company.html
--- src/main/webapp/publish/member_info_change_company.html
+++ src/main/webapp/publish/member_info_change_company.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/member_info_change_passwordCheck.html
--- src/main/webapp/publish/member_info_change_passwordCheck.html
+++ src/main/webapp/publish/member_info_change_passwordCheck.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/member_info_change_person.html
--- src/main/webapp/publish/member_info_change_person.html
+++ src/main/webapp/publish/member_info_change_person.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage1.html
--- src/main/webapp/publish/mypage1.html
+++ src/main/webapp/publish/mypage1.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage1_dormant_member.html
--- src/main/webapp/publish/mypage1_dormant_member.html
+++ src/main/webapp/publish/mypage1_dormant_member.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage1_dormant_member2.html
--- src/main/webapp/publish/mypage1_dormant_member2.html
+++ src/main/webapp/publish/mypage1_dormant_member2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage2.html
--- src/main/webapp/publish/mypage2.html
+++ src/main/webapp/publish/mypage2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage3.html
--- src/main/webapp/publish/mypage3.html
+++ src/main/webapp/publish/mypage3.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage3_return.html
--- src/main/webapp/publish/mypage3_return.html
+++ src/main/webapp/publish/mypage3_return.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage4.html
--- src/main/webapp/publish/mypage4.html
+++ src/main/webapp/publish/mypage4.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage5.html
--- src/main/webapp/publish/mypage5.html
+++ src/main/webapp/publish/mypage5.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage5_2.html
--- src/main/webapp/publish/mypage5_2.html
+++ src/main/webapp/publish/mypage5_2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage6.html
--- src/main/webapp/publish/mypage6.html
+++ src/main/webapp/publish/mypage6.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage7.html
--- src/main/webapp/publish/mypage7.html
+++ src/main/webapp/publish/mypage7.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage8.html
--- src/main/webapp/publish/mypage8.html
+++ src/main/webapp/publish/mypage8.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage9.html
--- src/main/webapp/publish/mypage9.html
+++ src/main/webapp/publish/mypage9.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage9_id.html
--- src/main/webapp/publish/mypage9_id.html
+++ src/main/webapp/publish/mypage9_id.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage9_password.html
--- src/main/webapp/publish/mypage9_password.html
+++ src/main/webapp/publish/mypage9_password.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage_index.html
--- src/main/webapp/publish/mypage_index.html
+++ src/main/webapp/publish/mypage_index.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage_index_2023.html
--- src/main/webapp/publish/mypage_index_2023.html
+++ src/main/webapp/publish/mypage_index_2023.html
@@ -9,6 +9,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage_index_2024.html
--- src/main/webapp/publish/mypage_index_2024.html
+++ src/main/webapp/publish/mypage_index_2024.html
@@ -9,6 +9,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/mypage_security_login.html
--- src/main/webapp/publish/mypage_security_login.html
+++ src/main/webapp/publish/mypage_security_login.html
@@ -10,6 +10,7 @@
   <link rel="stylesheet" href="/publish/css/reset.css">
   <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
   <link rel="stylesheet" href="/publish/css/common.css">
+  <link rel="stylesheet" href="/publish/css/style.css">
   <link rel="stylesheet" href="/publish/css/button.css">
   <link rel="stylesheet" href="/publish/css/content.css">
   <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/payment1.html
--- src/main/webapp/publish/payment1.html
+++ src/main/webapp/publish/payment1.html
@@ -11,6 +11,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/payment2.html
--- src/main/webapp/publish/payment2.html
+++ src/main/webapp/publish/payment2.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/payment3.html
--- src/main/webapp/publish/payment3.html
+++ src/main/webapp/publish/payment3.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/payment4.html
--- src/main/webapp/publish/payment4.html
+++ src/main/webapp/publish/payment4.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/payment5.html
--- src/main/webapp/publish/payment5.html
+++ src/main/webapp/publish/payment5.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/payment6.html
--- src/main/webapp/publish/payment6.html
+++ src/main/webapp/publish/payment6.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/photo_editer.html
--- src/main/webapp/publish/photo_editer.html
+++ src/main/webapp/publish/photo_editer.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/popup.css">
src/main/webapp/publish/popup_allimtalk_template_choice.html
--- src/main/webapp/publish/popup_allimtalk_template_choice.html
+++ src/main/webapp/publish/popup_allimtalk_template_choice.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css?date=202301160001">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/popup_clause_list.html
--- src/main/webapp/publish/popup_clause_list.html
+++ src/main/webapp/publish/popup_clause_list.html
@@ -10,6 +10,7 @@
   <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="/publish/css/reset.css">
   <link rel="stylesheet" href="/publish/css/common.css">
+  <link rel="stylesheet" href="/publish/css/style.css">
   <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
   <link rel="stylesheet" href="/publish/css/button.css">
   <link rel="stylesheet" href="/publish/css/content.css">
src/main/webapp/publish/popup_fax_detail.html
--- src/main/webapp/publish/popup_fax_detail.html
+++ src/main/webapp/publish/popup_fax_detail.html
@@ -10,6 +10,7 @@
   <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
   <link rel="stylesheet" href="/publish/css/reset.css">
   <link rel="stylesheet" href="/publish/css/common.css">
+  <link rel="stylesheet" href="/publish/css/style.css">
   <link rel="stylesheet" href="/publish/css/button.css">
   <link rel="stylesheet" href="/publish/css/content.css">
   <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/popup_friendtalk_template_choice.html
--- src/main/webapp/publish/popup_friendtalk_template_choice.html
+++ src/main/webapp/publish/popup_friendtalk_template_choice.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css?date=202301160001">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/popup_kakaoset_template.html
--- src/main/webapp/publish/popup_kakaoset_template.html
+++ src/main/webapp/publish/popup_kakaoset_template.html
@@ -11,6 +11,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css?date=202301160001">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/popup_list.html
--- src/main/webapp/publish/popup_list.html
+++ src/main/webapp/publish/popup_list.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/popup_pay_complete.html
--- src/main/webapp/publish/popup_pay_complete.html
+++ src/main/webapp/publish/popup_pay_complete.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&amp;display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/previewList1.html
--- src/main/webapp/publish/previewList1.html
+++ src/main/webapp/publish/previewList1.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/previewList2.html
--- src/main/webapp/publish/previewList2.html
+++ src/main/webapp/publish/previewList2.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/reservedmsg.html
--- src/main/webapp/publish/reservedmsg.html
+++ src/main/webapp/publish/reservedmsg.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/security_login.html
--- src/main/webapp/publish/security_login.html
+++ src/main/webapp/publish/security_login.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/security_login_ajax.html
--- src/main/webapp/publish/security_login_ajax.html
+++ src/main/webapp/publish/security_login_ajax.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service1.html
--- src/main/webapp/publish/service1.html
+++ src/main/webapp/publish/service1.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service1_2025.html
--- src/main/webapp/publish/service1_2025.html
+++ src/main/webapp/publish/service1_2025.html
@@ -10,6 +10,7 @@
 <link rel="stylesheet" href="/publish/css/reset.css">
 <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 <link rel="stylesheet" href="/publish/css/common.css">
+<link rel="stylesheet" href="/publish/css/style.css">
 <link rel="stylesheet" href="/publish/css/button.css">
 <link rel="stylesheet" href="css/content.css"> 
 <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service2.html
--- src/main/webapp/publish/service2.html
+++ src/main/webapp/publish/service2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service3.html
--- src/main/webapp/publish/service3.html
+++ src/main/webapp/publish/service3.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service3_spam_2024.html
--- src/main/webapp/publish/service3_spam_2024.html
+++ src/main/webapp/publish/service3_spam_2024.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service4.html
--- src/main/webapp/publish/service4.html
+++ src/main/webapp/publish/service4.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service4_2.html
--- src/main/webapp/publish/service4_2.html
+++ src/main/webapp/publish/service4_2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service5.html
--- src/main/webapp/publish/service5.html
+++ src/main/webapp/publish/service5.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service6.html
--- src/main/webapp/publish/service6.html
+++ src/main/webapp/publish/service6.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/service7.html
--- src/main/webapp/publish/service7.html
+++ src/main/webapp/publish/service7.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/sub1.html
--- src/main/webapp/publish/sub1.html
+++ src/main/webapp/publish/sub1.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/sub1_2023.html
--- src/main/webapp/publish/sub1_2023.html
+++ src/main/webapp/publish/sub1_2023.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/sub1_2024.html
--- src/main/webapp/publish/sub1_2024.html
+++ src/main/webapp/publish/sub1_2024.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/sub2.html
--- src/main/webapp/publish/sub2.html
+++ src/main/webapp/publish/sub2.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
@@ -520,149 +521,149 @@
                         <li class="hover_photo">
                             <div class="photo_preview">
                                 <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step3">완료</span>
+                                	<div class="title">
+									<input type="checkbox" name="myImgCheck" value="|0">
+									이미지 편집	
+									</div>
+                                    <span class="status fill primary">제작대기중</span>
                                 </div>
                                 <div class="photo_cont">
                                     <img src="/publish/images/content/photo_sample01.jpg" alt="">
                                 </div>
                             </div>
-                            <div class="myphoto_info">
-                                <!-- <p>등록일 :<span>2019.04.14</span></p>
-                                <p>이미지코드 :<span>20210414801</span></p> -->
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
+                            <div class="myphoto_info form_wrap">
+								<div class="left form_wrap column">
+									<p>등록일 : <span>2025-10-29</span></p>
+									<p>이미지 코드 : <span>custom_0</span></p>
+								</div>
+								<div class="right form_wrap column">
+									<button type="button" class="modify_btn w100" onclick="selectMyCustomImg(&quot;CUSTOM_0000000000000&quot;,&quot;FILE_000000000039284&quot;,&quot;1&quot;);">수정</button>
+									<button type="button" class="detail_btn w100" onclick="selectMyCustomDetail(&quot;CUSTOM_0000000000000&quot;);">상세보기</button>
+								</div>
+							</div>
                         </li>
-                        <li>
+                        <li class="hover_photo">
                             <div class="photo_preview">
                                 <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step1">수정요청</span>
+                                	<div class="title">
+									<input type="checkbox" name="myImgCheck" value="|0">
+									이미지 편집	
+									</div>
+                                    <span class="status line primary">제작중</span>
                                 </div>
                                 <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample02.jpg" alt="">
+                                    <img src="/publish/images/content/photo_sample01.jpg" alt="">
                                 </div>
                             </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
+                            <div class="myphoto_info form_wrap">
+								<div class="left form_wrap column">
+									<p>등록일 : <span>2025-10-29</span></p>
+									<p>이미지 코드 : <span>custom_0</span></p>
+								</div>
+								<div class="right form_wrap column">
+									<button type="button" class="modify_btn w100" onclick="selectMyCustomImg(&quot;CUSTOM_0000000000000&quot;,&quot;FILE_000000000039284&quot;,&quot;1&quot;);">수정</button>
+									<button type="button" class="detail_btn w100" onclick="selectMyCustomDetail(&quot;CUSTOM_0000000000000&quot;);">상세보기</button>
+								</div>
+							</div>
                         </li>
-                        <li>
+                        <li class="hover_photo">
                             <div class="photo_preview">
                                 <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플+본인제공 이미지</label>
-                                    <span class="step2">수정중</span>
+                                	<div class="title">
+									<input type="checkbox" name="myImgCheck" value="|0">
+									이미지 편집	
+									</div>
+                                    <span class="status fill secondary">수정요청</span>
                                 </div>
                                 <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample03.jpg" alt="">
+                                    <img src="/publish/images/content/photo_sample01.jpg" alt="">
                                 </div>
                             </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
+                            <div class="myphoto_info form_wrap">
+								<div class="left form_wrap column">
+									<p>등록일 : <span>2025-10-29</span></p>
+									<p>이미지 코드 : <span>custom_0</span></p>
+								</div>
+								<div class="right form_wrap column">
+									<button type="button" class="modify_btn w100" onclick="selectMyCustomImg(&quot;CUSTOM_0000000000000&quot;,&quot;FILE_000000000039284&quot;,&quot;1&quot;);">수정</button>
+									<button type="button" class="detail_btn w100" onclick="selectMyCustomDetail(&quot;CUSTOM_0000000000000&quot;);">상세보기</button>
+								</div>
+							</div>
                         </li>
-                        <li>
+                        <li class="hover_photo">
                             <div class="photo_preview">
                                 <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step3">완료</span>
+                                	<div class="title">
+									<input type="checkbox" name="myImgCheck" value="|0">
+									이미지 편집	
+									</div>
+                                    <span class="status line primary">수정중</span>
                                 </div>
                                 <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample04.jpg" alt="">
+                                    <img src="/publish/images/content/photo_sample01.jpg" alt="">
                                 </div>
                             </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
+                            <div class="myphoto_info form_wrap">
+								<div class="left form_wrap column">
+									<p>등록일 : <span>2025-10-29</span></p>
+									<p>이미지 코드 : <span>custom_0</span></p>
+								</div>
+								<div class="right form_wrap column">
+									<button type="button" class="modify_btn w100" onclick="selectMyCustomImg(&quot;CUSTOM_0000000000000&quot;,&quot;FILE_000000000039284&quot;,&quot;1&quot;);">수정</button>
+									<button type="button" class="detail_btn w100" onclick="selectMyCustomDetail(&quot;CUSTOM_0000000000000&quot;);">상세보기</button>
+								</div>
+							</div>
                         </li>
-                        <li>
+                        <li class="hover_photo">
                             <div class="photo_preview">
                                 <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step3">완료</span>
+                                	<div class="title">
+									<input type="checkbox" name="myImgCheck" value="|0">
+									이미지 편집	
+									</div>
+                                    <span class="status fill gray">제작취소</span>
                                 </div>
                                 <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample05.jpg" alt="">
+                                    <img src="/publish/images/content/photo_sample01.jpg" alt="">
                                 </div>
                             </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
+                            <div class="myphoto_info form_wrap">
+								<div class="left form_wrap column">
+									<p>등록일 : <span>2025-10-29</span></p>
+									<p>이미지 코드 : <span>custom_0</span></p>
+								</div>
+								<div class="right form_wrap column">
+									<button type="button" class="modify_btn w100" onclick="selectMyCustomImg(&quot;CUSTOM_0000000000000&quot;,&quot;FILE_000000000039284&quot;,&quot;1&quot;);">수정</button>
+									<button type="button" class="detail_btn w100" onclick="selectMyCustomDetail(&quot;CUSTOM_0000000000000&quot;);">상세보기</button>
+								</div>
+							</div>
                         </li>
-                        <li>
+                        <li class="hover_photo">
                             <div class="photo_preview">
                                 <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step1">수정요청</span>
+                                	<div class="title">
+									<input type="checkbox" name="myImgCheck" value="|0">
+									이미지 편집	
+									</div>
+                                    <span class="status fill gray">제작완료</span>
                                 </div>
                                 <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample06.jpg" alt="">
+                                    <img src="/publish/images/content/photo_sample01.jpg" alt="">
                                 </div>
                             </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
+                            <div class="myphoto_info form_wrap">
+								<div class="left form_wrap column">
+									<p>등록일 : <span>2025-10-29</span></p>
+									<p>이미지 코드 : <span>custom_0</span></p>
+								</div>
+								<div class="right form_wrap column">
+									<button type="button" class="modify_btn w100" onclick="selectMyCustomImg(&quot;CUSTOM_0000000000000&quot;,&quot;FILE_000000000039284&quot;,&quot;1&quot;);">수정</button>
+									<button type="button" class="detail_btn w100" onclick="selectMyCustomDetail(&quot;CUSTOM_0000000000000&quot;);">상세보기</button>
+								</div>
+							</div>
                         </li>
-                        <li>
-                            <div class="photo_preview">
-                                <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step2">수정중</span>
-                                </div>
-                                <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample07.jpg" alt="">
-                                </div>
-                            </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
-                        </li>
-                        <li>
-                            <div class="photo_preview">
-                                <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플+본인제공 이미지</label>
-                                    <span class="step2">수정중</span>
-                                </div>
-                                <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample08.jpg" alt="">
-                                </div>
-                            </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
-                        </li>
-                        <li>
-                            <div class="photo_preview">
-                                <div class="tit_text_wrap">
-                                    <input type="checkbox" id="">
-                                    <label for="">샘플 단순수정</label>
-                                    <span class="step3">완료</span>
-                                </div>
-                                <div class="photo_cont">
-                                    <img src="/publish/images/content/photo_sample10.jpg" alt="">
-                                </div>
-                            </div>
-                            <div class="myphoto_info">
-                                <p>일자 2021-01-01|코드 1234</p>
-                                <button type="button">수정</button>
-                            </div>
-                        </li>
+                        
+                        
                     </ul>
                     <!-- pagination -->
                     <ul class="pagination">
src/main/webapp/publish/sub3.html
--- src/main/webapp/publish/sub3.html
+++ src/main/webapp/publish/sub3.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/sub_election_v2024.html
--- src/main/webapp/publish/sub_election_v2024.html
+++ src/main/webapp/publish/sub_election_v2024.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/font.css">
src/main/webapp/publish/testKakaoSendPop.html
--- src/main/webapp/publish/testKakaoSendPop.html
+++ src/main/webapp/publish/testKakaoSendPop.html
@@ -10,6 +10,7 @@
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/button.css">
     <link rel="stylesheet" href="/publish/css/content.css">
     <link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg.html
--- src/main/webapp/publish/textingmsg.html
+++ src/main/webapp/publish/textingmsg.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_2024_detail.html
--- src/main/webapp/publish/textingmsg_2024_detail.html
+++ src/main/webapp/publish/textingmsg_2024_detail.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_2024_detail_kakao.html
--- src/main/webapp/publish/textingmsg_2024_detail_kakao.html
+++ src/main/webapp/publish/textingmsg_2024_detail_kakao.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_2024_list.html
--- src/main/webapp/publish/textingmsg_2024_list.html
+++ src/main/webapp/publish/textingmsg_2024_list.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_2025_detail.html
--- src/main/webapp/publish/textingmsg_2025_detail.html
+++ src/main/webapp/publish/textingmsg_2025_detail.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_2025_detail_kakao.html
--- src/main/webapp/publish/textingmsg_2025_detail_kakao.html
+++ src/main/webapp/publish/textingmsg_2025_detail_kakao.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_2025_list.html
--- src/main/webapp/publish/textingmsg_2025_list.html
+++ src/main/webapp/publish/textingmsg_2025_list.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_detail.html
--- src/main/webapp/publish/textingmsg_detail.html
+++ src/main/webapp/publish/textingmsg_detail.html
@@ -11,6 +11,7 @@
 		<link rel="stylesheet" href="/publish/css/reset.css">
 		<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 		<link rel="stylesheet" href="/publish/css/common.css">
+		<link rel="stylesheet" href="/publish/css/style.css">
 		<link rel="stylesheet" href="/publish/css/button.css">
 		<link rel="stylesheet" href="/publish/css/content.css">
 		<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_detail_allimtalk.html
--- src/main/webapp/publish/textingmsg_detail_allimtalk.html
+++ src/main/webapp/publish/textingmsg_detail_allimtalk.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/textingmsg_detail_friendtalk.html
--- src/main/webapp/publish/textingmsg_detail_friendtalk.html
+++ src/main/webapp/publish/textingmsg_detail_friendtalk.html
@@ -10,6 +10,7 @@
 	<link rel="stylesheet" href="/publish/css/reset.css">
 	<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
 	<link rel="stylesheet" href="/publish/css/common.css">
+	<link rel="stylesheet" href="/publish/css/style.css">
 	<link rel="stylesheet" href="/publish/css/button.css">
 	<link rel="stylesheet" href="/publish/css/content.css">
 	<link rel="stylesheet" href="/publish/css/mem.css">
src/main/webapp/publish/transaction_detail.html
--- src/main/webapp/publish/transaction_detail.html
+++ src/main/webapp/publish/transaction_detail.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/transaction_statement.html
--- src/main/webapp/publish/transaction_statement.html
+++ src/main/webapp/publish/transaction_statement.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
src/main/webapp/publish/use_statement.html
--- src/main/webapp/publish/use_statement.html
+++ src/main/webapp/publish/use_statement.html
@@ -9,6 +9,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap" rel="stylesheet">
     <link rel="stylesheet" href="/publish/css/reset.css">
     <link rel="stylesheet" href="/publish/css/common.css">
+    <link rel="stylesheet" href="/publish/css/style.css">
     <link rel="stylesheet" href="/publish/css/estimate.css">
     <link rel="stylesheet" href="/publish/css/font.css">
     <link rel="stylesheet" href="/publish/css/button.css">
Add a comment
List