tolag3/mjon_git
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'master' into 5102_친구톡_발송속도_개선

Browse Source
This commit is contained in:
hehihoho3@gmail.com 2025-06-04 14:52:52 +09:00
commit 8fabd4cbec
43 changed files with 6958 additions and 4889 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/main/resources/egovframework/egovProps/globals_dev.properties
View File

@ -28,7 +28,8 @@ Globals.Env = dev
# mysql
Globals.DriverClassName=com.mysql.jdbc.Driver
Globals.Url=jdbc:mysql://192.168.0.125:3306/mjon
#Globals.Url=jdbc:mysql://192.168.0.125:3306/mjon
Globals.Url=jdbc:mysql://139.150.73.12:3306/mjon_advc
Globals.UserName= mjonUr
Globals.Password= mjon!@#$

9
src/main/webapp/WEB-INF/jsp/web/com/webLayout.jsp
View File

@ -76,6 +76,15 @@
*/
</script>
<!-- Clarity tracking code for https://www.munjaon.co.kr/ -->
<script>
(function(c,l,a,r,i,t,y){
c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
t=l.createElement(r);t.async=1;t.src="https://www.clarity.ms/tag/"+i+"?ref=bwt";
y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y);
})(window, document, "clarity", "script", "rlrv4m2szn");
</script>
</head>
<decorator:head />

14
src/main/webapp/publish/api_admin1.html
View File

@ -40,7 +40,7 @@
</head>
<body>
<div class="mask on"></div>
<div class="mask"></div>
<div class="skip_menu">
<a href="#cont" title="본문 바로가기" class="contGo">본문 바로가기</a>
</div>
@ -201,7 +201,7 @@
<div id="container" class="cont sub">
<!-- 0724 기업회원 이동 팝업 -->
<div class="tooltip-wrap cvt_member_popup_wrap">
<!-- <div class="tooltip-wrap cvt_member_popup_wrap">
<div class="popup-com cvt_member_layer popup01" tabindex="0" data-tooltip-con="popup01" data-focus="popup01" data-focus-prev="popup01-close">
<div class="popup_heading">
<p>알림</p>
@ -215,7 +215,7 @@
</div>
</div>
</div>
</div>
</div> -->
<!--// 0724 기업회원 이동 팝업 -->
<button type="button" id="btnDeptPop" data-tooltip="popup01" style="display: none;"></button>
<div class="inner">
@ -223,8 +223,8 @@
<div class="send_top">
<!-- tab button -->
<ul class="tabType4">
<li class="tab"><button type="button" onclick="location.href='/publish/api_intro.html'">문자 API소개</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_guide.html'">API 사용안내</button></li>
<li class="tab "><button type="button" onclick="location.href='/publish/api_intro.html'">연동 안내</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_guide.html'">개발 가이드</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_download.html'">예제 다운로드</button></li>
<li class="tab active"><button type="button" onclick="location.href='/publish/api_admin1.html'">신청/관리</button></li>
</ul>
@ -238,6 +238,10 @@
<!--신청/관리 내용-->
<!--API 신청 정보 : 신청 전-->
<div class="api_admin">
<ul class="info">
<li>- 서비스 사용 신청 시, 문자 및 카카오톡 연동서비스를 모두 이용하실 수 있습니다.</li>
<li>- 관리자 승인 이후 발송 서버 IP를 등록해 주셔야 합니다.</li>
</ul>
<div class="admin_title">API 신청 정보</div>
<div class="tb_wrap_t1">
<table class="tType4">

281
src/main/webapp/publish/api_download.html
View File

@ -181,8 +181,8 @@
<div class="send_top">
<!-- tab button -->
<ul class="tabType4">
<li class="tab"><button type="button" onclick="location.href='/publish/api_intro.html'">문자 API소개</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_guide.html'">API 사용안내</button></li>
<li class="tab "><button type="button" onclick="location.href='/publish/api_intro.html'">연동 안내</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_guide.html'">개발 가이드</button></li>
<li class="tab active"><button type="button" onclick="location.href='/publish/api_download.html'">예제 다운로드</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_admin1.html'">신청/관리</button></li>
</ul>
@ -193,13 +193,21 @@
<h2>예제 다운로드</h2>
</div>
<!--예제 다운로드 내용-->
<div class="pay_tab_wrap">
<ul class="tabType1">
<li class="tab active"><button type="button" onclick="TabType5(this,'1');listTab3(this,'1');$('.list_tab .tab:first-child').addClass('active').siblings().removeClass('active');">문자</button></li>
<li class="tab"><button type="button" onclick="TabType5(this,'2');listTab3(this,'7');$('.list_tab .tab:first-child').addClass('active').siblings().removeClass('active');">카카오톡</button></li>
</ul>
</div>
<div class="api_guide current" id="tab5_1">
<div class="api_download">
<ul class="info">
<li>- 아래 예제(JSP)를 참고하시어 쉽고 편리하게 API를 연동할 수 있습니다.</li>
<li>- JSP 외 타 예제는 계속해서 업데이트 될 예정입니다.</li>
</ul>
<div class="list_tab_wrap2 type2">
<!-- tab button -->
<ul class="list_tab">
@ -456,7 +464,272 @@
</div>
<!--// IOS 다운로드-->
</div>
<!--// 예제 다운로드 내용-->
</div>
<div class="api_guide" id="tab5_2">
<div class="api_download">
<ul class="info">
<li>- 아래 예제(JSP)를 참고하시어 쉽고 편리하게 API를 연동할 수 있습니다.</li>
<li>- JSP 외 타 예제는 계속해서 업데이트 될 예정입니다.</li>
</ul>
<div class="list_tab_wrap2 type2">
<!-- tab button -->
<ul class="list_tab">
<li class="tab active"><button type="button" onclick="listTab3(this,'7');">JSP</button>
</li>
<!-- <li class="tab"><button type="button" onclick="listTab3(this,'8');">ASP</button>
</li> -->
<li class="tab"><button type="button" onclick="listTab3(this,'9');">PHP</button>
</li>
<!--<li class="tab"><button type="button" onclick="listTab3(this,'10');">.NET</button>
</li>
<li class="tab"><button type="button" onclick="listTab3(this,'11');">AOS</button>
</li>
<li class="tab"><button type="button" onclick="listTab3(this,'12');">IOS</button>
</li>-->
</ul>
<!--// tab button -->
</div>
<!-- JSP 다운로드-->
<div class="download_cont current" id="listTab3_7">
<div class="box">
<div class="text">
<h4>JSP Example</h4>
<table>
<caption>JSP 샘플 파일 설명 테이블</caption>
<colgroup>
<col style="width:35%;">
<col style="width:65%;">
</colgroup>
<tr>
<th>kakao jsp_example_send_msg_r1.jsp</th>
<td>문자보내기(여러명에게 동일한문자)</td>
</tr>
<tr>
<th>sp_example_send_msgs_r1.jsp</th>
<td>문자보내기(여러명에게 다른문자)</td>
</tr>
<tr>
<th>jsp_example_hstry_r1.jsp</th>
<td>전송내역조회</td>
</tr>
<tr>
<th>jsp_example_hstry_detail_r1.jsp</th>
<td>상세전송내역조회</td>
</tr>
<tr>
<th>jsp_example_select_price_r1.jsp</th>
<td>발송가능건수</td>
</tr>
</table>
</div>
</div>
<div class="btn_area">
<button type="button" class="btnType btnType11">JSP용 예제 다운받기</button>
</div>
</div>
<!--// JSP 다운로드-->
<!--ASP 다운로드-->
<div class="download_cont" id="listTab3_8">
<div class="box">
<div class="text">
<h4>ASP Example</h4>
<table>
<caption>ASP 샘플 파일 설명 테이블</caption>
<colgroup>
<col style="width:35%;">
<col style="width:65%;">
</colgroup>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
</table>
</div>
</div>
<div class="btn_area">
<button type="button" class="btnType btnType11">ASP용 예제 다운받기</button>
</div>
</div>
<!--// ASP 다운로드-->
<!--PHP 다운로드-->
<div class="download_cont" id="listTab3_9">
<div class="box">
<div class="text">
<h4>PHP Example</h4>
<table>
<caption>PHP 샘플 파일 설명 테이블</caption>
<colgroup>
<col style="width:35%;">
<col style="width:65%;">
</colgroup>
<tbody>
<tr>
<th>php_example_send_msg_r1.php</th>
<td>문자보내기(여러명에게 동일한문자)</td>
</tr>
<tr>
<th>php_example_send_msgs_r1.php</th>
<td>문자보내기(여러명에게 다른문자)</td>
</tr>
<tr>
<th>php_example_hstry_r1.php</th>
<td>전송내역조회</td>
</tr>
<tr>
<th>php_example_hstry_detail_r1.php</th>
<td>상세전송내역조회</td>
</tr>
<tr>
<th>php_example_select_price_r1.php</th>
<td>발송가능건수</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="btn_area">
<button type="button" class="btnType btnType11">PHP용 예제 다운받기</button>
</div>
</div>
<!--// PHP 다운로드-->
<!--.NET 다운로드-->
<div class="download_cont" id="listTab3_10">
<div class="box">
<div class="text">
<h4>.NET Example</h4>
<table>
<caption>.NET 샘플 파일 설명 테이블</caption>
<colgroup>
<col style="width:35%;">
<col style="width:65%;">
</colgroup>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
</table>
</div>
</div>
<div class="btn_area">
<button type="button" class="btnType btnType11">.NET용 예제 다운받기</button>
</div>
</div>
<!--// .NET 다운로드-->
<!--AOS 다운로드-->
<div class="download_cont" id="listTab3_11">
<div class="box">
<div class="text">
<h4>AOS Example</h4>
<table>
<caption>AOS 샘플 파일 설명 테이블</caption>
<colgroup>
<col style="width:35%;">
<col style="width:65%;">
</colgroup>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
</table>
</div>
</div>
<div class="btn_area">
<button type="button" class="btnType btnType11">AOS용 예제 다운받기</button>
</div>
</div>
<!--// AOS 다운로드-->
<!--IOS 다운로드-->
<div class="download_cont" id="listTab3_12">
<div class="box">
<div class="text">
<h4>IOS Example</h4>
<table>
<caption>IOS 샘플 파일 설명 테이블</caption>
<colgroup>
<col style="width:35%;">
<col style="width:65%;">
</colgroup>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
<tr>
<th>파일명</th>
<td>파일 설명</td>
</tr>
</table>
</div>
</div>
<div class="btn_area">
<button type="button" class="btnType btnType11">IOS용 예제 다운받기</button>
</div>
</div>
<!--// IOS 다운로드-->
</div>
</div>
</div>
</div>

2071
src/main/webapp/publish/api_guide.html
View File

File diff suppressed because it is too large Load Diff

270
src/main/webapp/publish/api_intro.html
View File

@ -26,159 +26,8 @@
<div class="skip_menu">
<a href="#cont" title="본문 바로가기" class="contGo">본문 바로가기</a>
</div>
<!--// skip 메뉴 -->
<!-- quick 메뉴 -->
<div class="quickMenu">
<div>
<p class="quick_title">QUICK<br>MENU</p>
<p class="quick_title2">QUICK</p>
<ul class="quickMenuIn">
<li>
<a href="/publish/index.html"><i class="quick1"></i><span>이용안내</span></a>
<div class="hover_cont">이용안내</div>
</li>
<li>
<a href="#"><i class="quick2"></i><span>채 팅상담</span></a>
<div class="hover_cont">채팅상담</div>
</li>
<li>
<a href="#"><i class="quick3"></i><span>원격지원</span></a>
<div class="hover_cont">원격지원</div>
</li>
<li>
<a href="#"><i class="quick4"></i><span>맞춤제작</span></a>
<div class="hover_cont">맞춤제작</div>
</li>
<li>
<a href="#"><i class="quick5"></i><span>주소록 등록</span></a>
<div class="hover_cont">주소록 등록</div>
</li>
<li>
<a href="#"><i class="quick6"></i><span>엑셀 전송</span></a>
<div class="hover_cont">엑셀 대량전송</div>
</li>
<li>
<a href="#"><i class="quick7"></i><span>견적서</span></a>
<div class="hover_cont">견적서</div>
</li>
<li>
<a href="#"><i class="quick8"></i><span>결제</span></a>
<div class="hover_cont">결제</div>
</li>
<li>
<a href="#"><i class="quick9"></i><span>영수증/계산서</span></a>
<div class="hover_cont">영수증/계산서</div>
</li>
</ul>
<button type="button" class="goTop" title="맨 위로 이동">TOP<i></i></button>
</div>
</div>
<!--// quick 메뉴 -->
<!-- header 영역 -->
<header id="header" class="header sub ">
<!-- header top 영역 -->
<div class="header_top">
<div class="inner">
<ul class="menu_left">
<li><a href="#"><i class="hdTop_fav"></i>즐겨찾기추가</a></li>
<li><a href="#"><i class="hdTop_mypage"></i>마이페이지</a></li>
<li><a href="#"><i class="hdTop_center"></i>고객센터</a></li>
</ul>
<ul class="menu_right">
<li><a href="#">충전하기</a></li>
<li class="SortLine"><a href="#">요금안내</a></li>
<li class="SortLine"><a href="#">이용안내</a></li>
<li class="SortLine"><a href="#">1:1고객상담</a></li>
</ul>
</div>
</div><!-- header top 영역 -->
<!-- header body 영역 -->
<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="전체메뉴"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
</div>
</div>
<!-- search popup 영역 -->
<div class="pop_search">
<div class="inner">
<div class="area_search">
<select name="" id="">
<option value="">그림문자</option>
<option value="">단문문자</option>
<option value="">장문문자</option>
<option value="">GIF</option>
</select>
<input type="text" placeholder="문자샘플 검색하기">
<button><img src="/publish/images/search02.png" alt=""></button>
</div>
<div class="area_popular">
<p><i></i>인기검색어</p>
<ul class="popular_tag">
<li><a href="#">#정월대보름</a></li>
<li class="on"><a href="#">#추석</a></li>
<li><a href="#">#가을인사</a></li>
<li><a href="#">#좋은하루</a></li>
</ul>
</div>
<button class="btn_close" onclick="searchToggle();"><img src="/publish/images/btn_searchclose.png"
alt=""></button>
</div>
</div>
<!--// search popup 영역 -->
</div>
<!--// header body 영역 -->
<div id="login" class="login">
<div class="inner table">
<div class="login_left table_cell">
<div class="login_put">
<label for="id_text" class="label"></label>
<input type="text" placeholder="아이디를 입력해주세요" id="id_text" class="id_text" maxlength="30"
size="18">
<label for="password_text" class="label"></label>
<input type="password" placeholder="비밀번호를 입력해주세요" id="password_text" class="password_text"
maxlength="30" size="18">
<label for="login_button" class="label"></label>
<button type="submit" class="btnType btnType1" class="login_button">로그인</button>
</div>
<div class="login_save">
<input type="checkbox" id="save_id">
<label for="save_id">아이디 저장</label>
</div>
<div class="login_find">
<a href="#">아이디찾기 /</a>
<a href="#">비밀번호 찾기</a>
</div>
<div>
<button type="button" class="btnType btnType2">회원가입</button>
<button type="button" class="btnType btnType3">둘러보기</button>
</div>
</div>
<div class="login_right">
<span><i></i>이달의 이벤트</span>
<button type="button" class="btnType btnType4">바로가기</button>
</div>
</div>
</div>
<!--// login 영역 -->
</header>
<!--// header 영역 -->
<!-- login 영역 -->
<div class="mask"></div>
<div data-include-path="/publish/layout/_header.html"></div>
<!-- content 영역 -->
<div id="container" class="cont sub">
<div class="inner">
@ -186,8 +35,8 @@
<div class="send_top">
<!-- tab button -->
<ul class="tabType4">
<li class="tab active"><button type="button" onclick="location.href='/publish/api_intro.html'">문자 API소개</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_guide.html'">API 사용안내</button></li>
<li class="tab active"><button type="button" onclick="location.href='/publish/api_intro.html'">연동 안내</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_guide.html'">개발 가이드</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_download.html'">예제 다운로드</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/api_admin1.html'">신청/관리</button></li>
</ul>
@ -195,7 +44,7 @@
<div class="api_guide_cont current">
<div class="heading">
<h2>문자 API 소개</h2>
<h2>연동 서비스 안내</h2>
</div>
<!--소개 내용-->
@ -206,8 +55,15 @@
</map>
</div>
<div class="pay_tab_wrap">
<ul class="tabType1">
<li class="tab active"><button type="button" onclick="TabType5(this,'1');">문자</button></li>
<li class="tab"><button type="button" onclick="TabType5(this,'2');">카카오톡</button></li>
</ul>
</div>
<!--사용 절차 설명 -->
<div class="api_intro">
<div class="api_intro api_guide current" id="tab5_1">
<div class="title">
<h3>문자 API 사용 절차</h3>
</div>
@ -222,17 +78,27 @@
<li class="guide">
<p class="step_title">STEP <span>01</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_01.jpg" alt="문자 API 신청 아이콘"></div>
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_00.png" alt="문자 API 신청 아이콘"></div>
<dl>
<dt>문자 API 신청</dt>
<dd>관리자 승인 후 사용 가능</dd>
<dt>발신번호 사전 등록</dt>
<dd>발송에 필요한 발신번호<br>등록 필요</dd>
</dl>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>02</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_02.jpg" alt="관리자 승인 아이콘"></div>
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_01.jpg" alt="관리자 승인 아이콘"></div>
<dl>
<dt>문자 연동 API 신청</dt>
<dd>관리자 승인 후 사용 가능</dd>
</dl>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>03</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_02.jpg" alt="아이피(IP) 등록 아이콘"></div>
<dl>
<dt>관리자 승인</dt>
<dd>승인 완료 시 문자 안내</dd>
@ -240,22 +106,22 @@
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>03</span></p>
<p class="step_title">STEP <span>04</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_03.jpg" alt="아이피(IP) 등록 아이콘"></div>
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_03.jpg" alt="API 연동 아이콘"></div>
<dl>
<dt>아이피<span>(IP)</span> 등록</dt>
<dd>문자 API를 통해 문자 발송 서버 IP 등록</dd>
</dl>
<dt>아이피(IP) 등록</dt>
<dd>문자 API를 통해<br>문자 발송 서버 IP 등록</dd>
</dt>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>04</span></p>
<p class="step_title">STEP <span>05</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_04.jpg" alt="API 연동 아이콘"></div>
<dl>
<dt>API 연동</dt>
<dd>API 사용 매뉴얼 및 샘플링을 통해 누구나 손쉽게 연동 가능</dd>
<dd>API 사용 매뉴얼 및 샘플링을<br>통해 누구나 손쉽게 연동 가능</dd>
</dt>
</div>
</li>
@ -263,6 +129,74 @@
</div>
</div>
<!--// 사용 절차 설명-->
<div class="api_intro api_guide kakao_intro" id="tab5_2">
<div class="title">
<h3>카카오톡 연동(API) 사용 절차</h3>
</div>
<div class="title-line">
<div class="left-line"></div>
<div class="right-line"></div>
</div>
<div class="con">
<ul class="api_process_guide">
<li class="guide">
<p class="step_title">STEP <span>01</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_00.png" alt="문자 API 신청 아이콘"></div>
<dl>
<dt>발신프로필 사전 등록</dt>
<dd>발송에 필요한 발신프로필<br>등록 필요</dd>
</dl>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>02</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_01.jpg" alt="관리자 승인 아이콘"></div>
<dl>
<dt>카카오톡 연동<br>API 신청</dt>
<dd>관리자 승인 후 사용 가능</dd>
</dl>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>03</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_02.jpg" alt="아이피(IP) 등록 아이콘"></div>
<dl>
<dt>관리자 승인</dt>
<dd>승인 완료 시 문자 안내</dd>
</dl>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>04</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_03.jpg" alt="API 연동 아이콘"></div>
<dl>
<dt>아이피(IP) 등록</dt>
<dd>카카오톡 API를 통해<br>문자 발송 서버 IP 등록</dd>
</dt>
</div>
</li>
<li class="guide">
<p class="step_title">STEP <span>05</span></p>
<div class="step_con">
<div class="icon"><img src="/publish/images/api_intro_cont/api_guide_04.jpg" alt="API 연동 아이콘"></div>
<dl>
<dt>API 연동</dt>
<dd>API 사용 매뉴얼 및 샘플링을<br>통해 누구나 손쉽게 연동 가능</dd>
</dt>
</div>
</li>
</ul>
</div>
</div>
<!--// 소개 내용-->
</div>
</div>

13
src/main/webapp/publish/css/button.css
View File

@ -84,6 +84,19 @@ textarea:-ms-input-placeholder {font-family: 'Noto Sans KR', sans-serif; font-we
.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.fill_gray{background:#6a6c72;color:#fff;}
.btnType.fill_lightgray{background:#8e8e8e;color:#fff;}
.btnType.fill_blue{background:#002c9a;color:#fff;}
.btnType.fill_lightblue{background:#b1c6ee;color:#222;}
.btnType.fill_yellow{background:#eea301;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_lightblue{border:1px solid #b1c6ee;color:#222;}
/* 기타 반복 사용 */
/* 기타 버튼 타입 */

46
src/main/webapp/publish/css/common.css
View File

@ -21,13 +21,14 @@ caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border:
.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 .header_top .menu_left li {margin-right: 25px;}
/* .header .header_top .menu_left {left: 0;position: absolute;top: 50%;transform: translateY(-50%); display: flex;} */
.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: 4px;}
.header .header_top .menu_left i {padding-right: 7px;vertical-align:bottom;}
.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_mypage.png);width: 13px;height: 13px;}
.header .header_top .menu_left .hdTop_center {background-image: url(/publish/images/hdTop_center.png);width: 13px;height: 13px;}
.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;}
@ -95,10 +96,10 @@ caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border:
.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 .login2_name {display: inline-block; min-width: 155px; position: relative; vertical-align: middle;}
.login2 .login_info .login2_name p {color: #222; font-weight: 400; vertical-align: top; font-weight: 500; height: 16px; white-space:nowrap;}
.login2 .login_info .login2_name span {width: 61px;padding:0 10px 0 0;margin: 0 0 0 -5px;}
.login2 .login_info i {background-image: url(/publish/images/mypageIcon2.png);width: 34px;height: 34px;margin-right: 5px;}
.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 .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);}
@ -113,12 +114,12 @@ caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border:
.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 {margin-right: 2px;}
.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 i {background-image: url(/publish/images/check_money2.png);width: 29px;height: 30px;margin-right: 3px;}
.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%);}
@ -127,8 +128,24 @@ caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border:
.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 10px 8px 10px;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{width:100%;padding:2px 0;margin:8px 0 0 0;background:#e5e5e5;font-size:13px;color:#444;text-align:center;border-radius:25px;}
/*후불 회원에게만 노출되는 안내레이어*/
.login2 .check_money .holdingsum_box {position: relative;}
.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;}
@ -153,7 +170,7 @@ caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border:
.login2 .event {white-space:nowrap;}
/* 보안로그인 */
.security_box{display:inline-flex;height:36px;font-weight:500;background:#fff;padding:0 8px 0 11px;margin:0 0 0 3px;vertical-align:middle;border-radius:5px;align-items:center;}
.security_box{display:inline-flex;height:36px;font-weight:500;background:#fff;padding:0 8px 0 11px;margin:0 0 0 3px;vertical-align:middle;border-radius:5px;align-items:center;box-sizing:border-box;}
.security_box.red_box{border:1px solid #ca1a1a;}
.security_box.green_box{border:1px solid #0ca448;}
.security_box p{cursor:pointer;}
@ -356,6 +373,9 @@ caption, .label {position: absolute;width: 1px;height: 1px;margin: -1px;border:
.login_right {margin-right: 20px; text-align: inherit;}
.login2 .login_info {margin-right: 30px;}
.login2 .login_info::after {right: -25px;}
.login2 .login_info .login2_name p{font-size:14px;}
.login2 .login_info button.btn_36.fill_gray{padding:0 8px;font-size:14px;}
.security_box,.login2 .check_money .user_money_wrap, .login2 .point,.login2 .session span,.login2 .login_info .login2_name span{font-size:14px;}
.login2 .check_money {margin-right: 15px;}
.login2 .login_right button {padding: 0 8px; margin-right: 20px;}
/* quick Menu */

99
src/main/webapp/publish/css/content.css
View File

@ -20,6 +20,7 @@
/*// 발송결과 화면개선 */
.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;}
@ -530,7 +531,7 @@ input[type=text]::-ms-reveal, input[type=password]::-ms-reveal, input[type=email
.send_top .send_right {flex-basis: calc(100% - 68% - 80px); position: relative;min-height:630px;}
.send_top .send_general.sec .send_right {min-height:auto;}
/* phone 기본 -- sticky */
.send_top .send_right .phone {width: 320px; position: absolute; right: -2px; top: 0;}
.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 .prev_p {font-size: 20px;font-weight: 500;padding-bottom: 12px;border-bottom: 1px solid #e5e5e5;}
@ -601,6 +602,7 @@ input[type=text]::-ms-reveal, input[type=password]::-ms-reveal, input[type=email
.send_general.sec .tType1 tbody tr:first-child {border-top: 0;}
.send_top .excelWrap {padding: 20px 0;}
.excel_middle {background-color: #f2f2f2; padding: 9px 20px; border-radius: 5px; margin: 20px 0;}
.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;}
@ -875,11 +877,12 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.search_wrap_btn button {height: 36px;}
.search_wrap_btn p {display: inline-block; font-size: 16px; font-weight: 300; vertical-align: middle; color: #666; padding-left: 5px;}
.search_wrap_btn p .add_text {font-size: 14px; padding-left: 5px;}
.custom_content.custom3 .area_tabcontent li {background-color: transparent; padding: 0; border: 0;}
.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: 2px;}
.custom_content.custom3 .area_tabcontent li .tit_text_wrap input[type="checkbox"]+label {font-size: 15px; color: #222;}
.custom_content.custom3 .area_tabcontent li .tit_text_wrap input[type="checkbox"] {margin-bottom: 4px;}
.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 .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;}
@ -889,6 +892,8 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.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 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;}
.myphoto_info button:hover {box-shadow: 0px 0px 5px 3px rgba(0,0,0,0.1);}
.myphoto_info button.modify_btn {top: 0;}
.myphoto_info button.detail_btn {top: 26px;}
@ -1068,7 +1073,8 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.pay_cont .tType1 button {height: 40px; margin-right: 2px;}
.pay_cont .tType1 .btnType17 {font-size: 16px; width: 100px;}
.pay_cont .excel_middle {margin: 20px 0 10px 0;}
.pay_cont .excel_middle .selType2 {width: 82px; height: 32px; margin-left: 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 .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;}
@ -1076,7 +1082,7 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.pay_cont .excel_middle .level_btn{margin: 0 5px; border: 1px solid #002c9a; color: #002c9a;}
.pay_cont .excel_middle .level_btn img{margin-top: -3px;}
.pay_cont .excel_middle .print_btn {margin: 0 5px;}
/* .pay_cont .excel_middle .print_btn {margin: 0 5px;} */
.pay_cont .pay_info {display: flex; justify-content: center; background-color: #efeff0; width: 100%; padding: 16px 0; border-radius: 5px; margin: 20px 0 50px 0; box-sizing: border-box; }
.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;}
@ -1126,6 +1132,9 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.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;}
.price_history_cont .tType4 .btnType20{margin:0;}
/*후불회원 요금 사용내역*/
.hisroy_price .hisroy_defprice_in {position:relative; background-color: #f2f2f2; width: calc(100%/4 - 10px); padding: 28px 22px 40px 22px; border-radius: 5px; box-sizing: border-box;}
.hisroy_price .hisroy_defprice_in>p {font-size: 20px; font-weight: 600; margin-bottom: 25px; font-family: 'GmarketSansBold';}
@ -1222,13 +1231,20 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.pay_cont .bill_tab p {padding:0 0 0 20px;}
.pay_cont .bill_content_wrap .bill_content {display:none;}
.pay3_list td.td_payInfo span{position: relative; margin: 0 8px;}
/* .pay3_list td.td_payInfo span{position: relative; margin: 0 8px;}
.pay3_list td.td_payInfo span::after{position: absolute; content: " "; width: 1px; height: 12px; background-color: #666; left: 2px; top: 50%; transform: translateY(-50%);}
.pay3_list .tType4 tbody td p{display:inline-block;width:auto;margin:0;vertical-align:middle;}
.pay3_list td button{margin-right: 5px; padding: 0 10px; width: auto;}
.pay3_list td button:last-child{margin-right: 0;}
.pay3_list td button.btnType.btnType20 {display:block;margin:5px auto;}
.pay3_list td button.btnType.btnType20:first-child {margin-top:10px;}
.pay3_list td button.btnType.btnType20:last-child {margin-bottom:10px;}
.pay3_list td button.btnType.btn_use_status{display:inline-block;margin:0;} */
.pay3_list td.td_payInfo span{position: relative; margin: 0 8px;}
.pay3_list td.td_payInfo span::after{position: absolute; content: " "; width: 1px; height: 12px; background-color: #666; left: 2px; top: 50%; transform: translateY(-50%);}
.pay3_list .tType4 tbody td p{display:inline-block;width:auto;margin:0;vertical-align:middle;}
.pay3_list td button{width:auto;padding:0 10px;margin:0;}
/* 결제하기 */
.charg_cont {background-color: #fff;padding: 40px;border-radius: 10px; min-height: 589px; display: none;}
@ -1623,6 +1639,8 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.kakaotalkset_cont .template_sample_content_wrap .pagination{margin-top: 40px;}
.kakaotalkset_cont .send_general.kakao_wrap{padding: 50px 0 0 0;}
.kakaotalkset_cont .friend_talk_wrap .template_name_wrap input{width:340px;}
.kakaotalkset_cont .friend_talk_wrap .template_name_wrap button{padding:0 15px;font-weight:400;}
.kakao_wrap .tType1_title{font-size: 24px;}
.kakao_wrap .template_name{width: 340px;}
.kakao_wrap .template_name_cf{display: inline-block; color: #666; padding: 0 0 0 15px; vertical-align: inherit;}
@ -1630,13 +1648,19 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.kakao_wrap .img_add_info_wrap .info_title_text{font-size: 15px; font-weight: 500;}
.kakao_wrap .img_add_info_wrap .info_text{font-size: 15px; color: #555;}
.kakao_wrap .img_add_info_wrap .info_text li{margin: 3px 0 0 0;}
.kakao_wrap .img_file_add_wrap .btn_img_upload{width: 251px; margin: 10px 0 15px 0;}
.kakao_wrap .img_file_add_wrap .info_title_text{font-weight: 500;margin:0 0 5px 0;}
.kakao_wrap .img_file_add_wrap .btn_img_upload{width: 251px;}
.kakao_wrap .img_file_add_wrap .img_file_info_wrap{width: 100%; max-width: 623px; border: 1px solid #e5e5e5; border-radius: 5px;}
.kakao_wrap .img_file_add_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_add_wrap .img_file_info_wrap li:last-child{border-bottom: 0;}
.kakao_wrap .img_file_add_wrap .file_name{font-size: 16px; font-weight: 500;}
.kakao_wrap .img_file_add_wrap .btn_del{width: 30px;height: 30px;border: 1px solid #002c9a;border-radius: 5px;}
.kakao_wrap .img_file_add_wrap .img_url{width: calc(100% - 190px);}
.kakao_wrap .img_file_add_wrap .info_text{margin:0 0 10px 0;}
.kakao_wrap .img_file_add_wrap .info_text li{list-style:1.4;}
.kakao_wrap .img_file_add_wrap .img_file_wrap{display:inline-flex;width:calc(100% - 200px);}
.kakao_wrap .img_file_add_wrap .img_file_wrap .file_name{width:calc(100% - 28px);}
.kakao_wrap .img_file_add_wrap .img_file_wrap .file_name.file_none{color:#666;font-weight:300;line-height:1.8;}
.kakaotalkset_cont .kakao_wrap .template_category{width: 270px;}
.kakaotalkset_cont .kakao_wrap .emphasis_select{width: 250px;}
@ -1667,6 +1691,7 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.kakaotalkset_cont .kakao_wrap .put_right .btn_close{width: calc(100% - 20px); height: 36px; background-color: #999; color: #fff; font-size: 15px; border-radius: 5px; margin-top: 5px;}
.kakaotalkset_cont .kakao_wrap .put_right .send_btnWrap{position: absolute; width: 100%; bottom: 0;}
.kakaotalkset_cont .kakao_wrap .put_right .send_btnWrap button{width: 100%; max-width: 100%;}
.kakaotalkset_cont .friend_talk_wrap .phone_bottom{bottom:17px;}
.kakaotalkset_cont .kakao_wrap .button_type_wrap{display: flex; border: 1px solid #e5e5e5; border-radius: 5px; padding: 10px 20px; margin: 10px 0 0 0;}
.kakaotalkset_cont .kakao_wrap .button_type_wrap dt{width: 110px; font-weight: 400; padding: 8px 0 0 0;}
.kakaotalkset_cont .kakao_wrap .button_type_wrap .button_type_input{width: 483px;}
@ -1708,7 +1733,7 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.kakaotalkset_cont .kakao_wrap .send_right .phone_bottom .cancel{width: calc((100% - 10px));}
.kakao_wrap .replace_send_wrap{display: none; border: 1px solid #000; border-radius: 8px;padding: 0 20px; margin: 0 0 20px 0;}
.kakao_wrap .replace_send_wrap .tType1 tr:first-child{border-top: 0;}
.kakao_wrap .replace_send_wrap .tType1 tbody tr td.putText .put_right .btnType9{position: absolute; max-width: 100%; bottom: 0;}
.kakao_wrap .replace_send_wrap .tType1 tbody tr td.putText .put_right .btnType9{position: absolute; max-width: 100%; bottom: 0; left: 0;}
.kakao_wrap .replace_send_th{height: auto; padding: 20px 0 0 0;}
.kakao_wrap .replace_send_th .title_th{margin: 0 0 20px 0;}
.kakao_wrap .replace_send_th .title_th p{display: inline-block; width: 90px;}
@ -1733,14 +1758,17 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.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 .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 .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%;}
.kakaotalksend_cont .kakao_wrap .kakao_template_text {display: flex;justify-content: space-between;}
.kakaotalksend_cont .kakao_wrap .put_right .btn_popup_wrap{margin: 0 0 5px 0;}
.kakaotalksend_cont .kakao_wrap .replace_send_wrap .put_left{height: 234px;}
.kakaotalksend_cont .kakao_wrap .replace_send_wrap .put_left.short textarea{height: calc(100% - 58px);}
.kakaotalksend_cont .kakao_wrap .replace_send_wrap .put_left.short textarea{height: calc(100% - 79px);}
.kakaotalksend_cont .kakao_wrap .button_type_wrap{display: flex; border: 1px solid #e5e5e5; border-radius: 5px; padding: 10px 20px; margin: 10px 0 0 0;}
.kakaotalksend_cont .kakao_wrap .button_type_wrap dt{width: 110px; font-weight: 400; padding: 8px 0 0 0;}
.kakaotalksend_cont .kakao_wrap .button_type_wrap .button_type_input{width: 483px;}
@ -1779,13 +1807,16 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.friend_talk_wrap .put_text_wrap .put_text{height: calc(100% - 40px); border: 0; background-color: transparent; padding: 14px 0 0 0px;}
.friend_talk_wrap .put_text_wrap .text_length{position: absolute; display: flex; width: calc(100% - 40px); justify-content: space-between; align-items: center; left: 20px; box-sizing: border-box;}
.friend_talk_wrap .put_text_wrap .ad_txt{padding: 0;margin: 0;}
.friend_talk_wrap .put_right .btn_popup_wrap>button,.friend_talk_wrap .put_right .send_btnWrap>button{width: 100%; max-width: 100%; height: 40px;}
.friend_talk_wrap .put_right .btn_popup_wrap>button{width: 100%; max-width: 100%; height: 40px;}
.friend_talk_wrap .put_right .btn_popup_wrap>button:last-child,.friend_talk_wrap .put_right .send_btnWrap>button:last-child{margin: 0;}
.friend_talk_wrap .put_right .btn_text_save{background-color: #fff; border: 1px solid #002c9a; color: #002c9a; margin: 0 0 8px 0;}
.friend_talk_wrap .put_right .send_btnWrap{display:flex;gap:6px;}
.friend_talk_wrap .put_right .send_btnWrap .btnType9{width:40%;}
.friend_talk_wrap .put_right .send_btnWrap .btn_text_save{width:60%;}
.friend_talk_wrap .template_button .cf_text{margin: 10px 0 0 0; font-size: 14px; color: #666;}
.friend_talk_wrap .friend_talk_title{margin: 0 0 10px 0; font-size: 15px; color: #222;}
.friend_talk_wrap .friend_talk_title span{color: #777;}
.friend_talk_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content{border-radius: 5px;}
.friend_talk_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content{border-radius: 5px;overflow:hidden;}
.friend_talk_wrap .send_right .phone .phoneIn .text_preview .allimtalk_content .template_text{font-size: 15px; font-weight: 300; color: #555;}
.friend_talk_wrap .send_right .kakao_block_text{width: calc(100% - 20px); text-align: right; font-size: 13px; font-weight: 300; color: #555; margin: 10px 0 0 0;}
.friend_talk_wrap .put_left {position: relative;width: calc(100% - 175px);height: 260px;}
@ -1793,8 +1824,11 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.friend_talk_wrap .put_right{width: 165px;}
.friend_talk_wrap .put_right .send_btnWrap {position: absolute;width: 100%;bottom: 0;}
.kakaotalksend_cont .friend_talk_wrap{padding: 0;}
.kakaotalksend_cont .friend_talk_wrap .put_left {height: 307px;}
.kakaotalksend_cont .friend_talk_wrap .put_text_wrap{height: calc(100% - 48px); margin: 10px 0 0 0;}
.kakaotalksend_cont .friend_talk_wrap .put_left {height: 259px;}
.kakaotalksend_cont .friend_talk_wrap .template_name_wrap{display:flex;gap:10px;}
.kakaotalksend_cont .friend_talk_wrap .template_name_wrap input{width:340px;}
.kakaotalksend_cont .friend_talk_wrap .template_name_wrap button{padding:0 15px;font-weight:400;}
/* .kakaotalksend_cont .friend_talk_wrap .put_text_wrap{height: calc(100% - 48px); } */
.kakaotalksend_cont .friend_talk_wrap .put_right {position: relative;width: 165px;}
.kakaotalksend_cont .tType1 tbody tr td.putText .put_right .btn_popup_wrap button:not(.btn_close){margin: 0 0 0 10px;}
@ -2009,10 +2043,10 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.kakao_intro_cont .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 .note ul li:nth-child(5):hover{box-shadow: 0 0 8px rgba(0,0,0,0.5);}
/* api - 소개 */
.send_top .api_guide_cont {background-color: #fff;padding: 30px 40px;border-radius: 10px;}
.send_top .api_guide_con{display:none;}
.send_top .api_guide_con.current{display:block;}
.api_guide_cont .api_visual_image {margin:0 0 57px 0; }
.api_guide_cont .api_visual_image img {max-width:100%;}
.api_guide_cont .api_intro {width:100%; margin:20px 0 0 0;}
@ -2023,17 +2057,18 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.api_guide_cont .api_intro .title h3 {font-family:'yg-jalnan'; font-size: 28px; text-align: center; padding-top: 55px;}
.api_guide_cont .api_intro .title-line .left-line{width:33%; height: 2px; background-color: #949aa5; border-radius: 1.5; float: left; margin-top: -15px;}
.api_guide_cont .api_intro .title-line .right-line{width:33%; height: 2px; background-color: #949aa5; border-radius: 1.5; float: right; margin-top: -15px;}
.api_guide_cont .api_intro.kakao_intro .title-line .left-line,.api_guide_cont .api_intro.kakao_intro .title-line .right-line{width:25%;}
.api_guide_cont .api_intro .con { padding:0 0 50px 0; margin:30px 0 0 0; }
.api_guide_cont .api_process_guide {display: flex; margin: 0 0 20px 0;}
.api_guide_cont .api_process_guide li{position: relative; width: calc((100% - 60px)/4); padding: 0; border-radius: 5px; margin: 0 60px 0 0; text-align: center;}
.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: -46px; top: 50%; transform: translateY(-50%); z-index: 1;}
.api_guide_cont .api_process_guide li{position: relative; width: calc((100% - 15px)/5); padding: 0; border-radius: 5px; margin: 0 15px 0 0; text-align: center;}
.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 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: 23px; 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: 17px; font-weight: 300; line-height: 1.2; padding:0 10px;}
.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 - 사용안내 */
.api_guide {display: none;}
@ -2049,6 +2084,8 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.api_guide_cont .box .text table tr {border-bottom:1px solid #d5d5d5; }
.api_guide_cont .box .text table th {width:210px; text-align: left; text-indent: 18px; line-height: 1.2; background:#f5f5f5; font-size:16px; padding:10px 0;}
.api_guide_cont .box .text table td {text-indent: 18px; font-weight: 200;}
.api_guide_cont .api_guide#tab5_1 .list_tab_wrap2.type3 li{width:calc(100%/5)}
/* // api 사용안내, 예제 다운로드 공통 사용*/
.api_guide_cont .re_cont .type_table table {width:100%; margin:40px 0 7px 0;}
.api_guide_cont .re_cont .type_table table thead th {border-top:1px solid #000; border-left:1px solid #e5e5e5; border-bottom:1px solid #e5e5e5; background:#f7f7f7; padding: 15px 0; }
@ -2086,6 +2123,7 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
/* api - 신청/관리 */
.api_guide_cont .api_admin {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;}
@ -2139,12 +2177,10 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
/* right area 문자 미리보기 */
.send_top .resultcont_right {flex-basis: calc(100% - 68% - 80px); position: relative;min-height:630px;}
.send_top .send_general.sec .resultcont_right {min-height:auto;}
.send_top .resultcont_right .tab_phone {display: none; }
.send_top .resultcont_right .tab_phone.current {display: block;}
/* phone 기본 -- sticky */
.send_top .resultcont_right .phone {width: 374px; position: absolute; right: -2px; top: 0;}
.send_top .resultcont_right .phone .phoneIn {background-image: url(/publish/images/content/phoneBg.png); height: 720px; background-size: 100% auto; background-repeat: no-repeat; }
.send_top .resultcont_right .phone .phoneIn>div {padding: 45px 30px 25px 30px; position: relative; height: 98%; box-sizing: border-box;}
.send_top .resultcont_right .phone .phoneIn>div {padding: 45px 30px 0 30px; position: relative; height: 96%; box-sizing: border-box;}
.send_top .resultcont_right .phone .prev_p {font-size: 20px;font-weight: 500;padding-bottom: 12px;border-bottom: 1px solid #e5e5e5;}
.send_top .resultcont_right .phone .text_length2 {padding: 12px 0;}
.send_top .resultcont_right .phone .text_length2>span {float: left;line-height: 27px;}
@ -2175,8 +2211,8 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
/* 알림톡 미리보기 */
.send_top .resultcont_right .phone_kakao {width: 374px; position: absolute; right:0; top: 0;}
.send_top .resultcont_right .phone_kakako .phoneIn{height: 720px; width:346px; background-image: url(/publish/images/content/kakaoBg_01.png); padding: 27px 25px 0 25px; margin:0 0 0 -12px;}
.send_top .resultcont_right .phone_kakako .prev_p{padding: 0 0 0 10px; border: 0; letter-spacing: -0.25px;}
.send_top .resultcont_right .phone_kakako .phoneIn{height: 690px; width:340px; background-image: url(/publish/images/content/kakaoBg_01.png); background-position:-10px top; padding: 27px 25px 0 25px;}
.send_top .resultcont_right .phone_kakako .prev_p{padding: 8px 0 0 10px; border: 0; letter-spacing: -0.25px;}
.send_top .resultcont_right .phone_kakako .prev_p img{margin: 0 10px 0 0;}
.send_top .resultcont_right .phone_kakako .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;}
.send_top .resultcont_right .phone_kakako .allimtalk_title::after{position: absolute; content: " "; width: 42px; height: 42px; background: url(/publish/images/content/icon_kakao01.png) no-repeat; right: -20px; top: -10px;}
@ -2199,7 +2235,7 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.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:-25px 0 10px 0;}
.send_top .resultcont_right .phone_kakako .addText{color: #002c9a;text-align: center; font-size: 14px; padding-top: 2px; margin:10px 0 10px 0;}
.btn_list_type1 {border-top:solid 1px #e5e5e5; text-align: right; padding:26px 0 0 0; margin:60px 0 0 0;}
.btn_list_type1 .btnType.btnType17 {width:100px; }
@ -2393,6 +2429,11 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.tb_wrap1{height:302px; overflow-y: auto; position:relative; border:1px solid #ccc; border-radius:5px;}
.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:hover{text-decoration: underline;}
.tType1 tbody tr td.putText textarea.phone_num{height: 84px;}
@keyframes rotate-loading {
0% {transform:rotate(0)}
@ -2588,6 +2629,10 @@ button.check_validity:hover {border: 1px solid #a3a3a3;box-shadow: 0px 0px 5px
.sub .election .receipt_number_table_wrap .list_bottom{width:100%;}
.sub .election .list_bottom .list_bottom_right button{height:30px;font-size:14px;letter-spacing:-1.4px;}
.sub .election .list_bottom .pagination button{display:inline-flex;width:25px;height:30px;align-items:center;justify-content:center;}
/*문자전송_안심번호 안내 추가*/
.top_content .send_general .send_left .tType1 .btn_popup_wrap .info_guide{margin: 0 0 0 11px; text-indent: -11px;}
.tType1 tbody tr td.putText textarea.phone_num{height: 103px;}
}
@media only screen and (max-width:1380px){

1
src/main/webapp/publish/css/estimate.css
View File

@ -31,6 +31,7 @@
.est_body .cont2 {background-color: #f2f2f2; padding: 0 20px; border: 1px solid #ccc; border-radius: 5px; margin: 13px 0 20px 0; height: 50px; line-height: 50px; box-sizing: border-box;}
.est_body .cont2 p:first-child {float: left; font-size: 16px; font-weight: 500;}
.est_body .cont2 p:first-child span{font-size:13px;font-weight:400;color:#666;}
.est_body .cont2 p:last-child {float: right; font-size: 13px; font-weight: 300;}
.est_body .cont2 p span {font-size: 20px; font-weight: 700;}

4
src/main/webapp/publish/css/mem.css
View File

@ -319,13 +319,13 @@ input[type="password"].list_inputType1 {padding: 0px;background-color: transpare
.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_wrap{width: calc(135% - 100px); background-color: #fff; border-radius: 0 10px 10px 0;}
.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;}
.my_dashboard .send_price ul:first-child li:last-child{margin: 0; padding: 0}
.my_dashboard .send_price .price_wrap .title{font-size: 16px; color: #222;}
.my_dashboard .send_price .price_wrap .title img{margin: 0 8px 0 0; vertical-align: top;}
.my_dashboard .send_price .event_wrap{width: 100%; background-color: #f5f5f5; border-radius: 5px; text-align: center; margin: 10px 0 0 0;}
.my_dashboard .send_price .event_wrap{width: 100%; background-color: #f5f5f5; border-radius: 5px; text-align: center; margin: 10px 0;}
.my_dashboard .send_price .event_wrap .event_text{font-size: 15px; color: #444; padding: 8px 0;}
.my_dashboard .send_price .event_wrap .event_text span{color: #e40000; font-size: 17px;}

5
src/main/webapp/publish/guide.html
View File

@ -139,7 +139,7 @@
<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/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>
@ -188,6 +188,7 @@
<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>
@ -220,8 +221,6 @@
<li><a target="_blank" href="/publish/email_form_terms_2024_privacy.html">email_form_terms_2024_privacy.html</a>개인정보처리방침 개정</li>
<!-- ///////////////이메일 폼/////////////// -->
</ul>

BIN
src/main/webapp/publish/images/api_intro_cont/api_guide_00.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
src/main/webapp/publish/images/content/kakao_img_basic.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
src/main/webapp/publish/images/content/kakao_img_wide.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
src/main/webapp/publish/images/icon_header_user.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 476 B

BIN
src/main/webapp/publish/images/icon_message.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 345 B

411
src/main/webapp/publish/index.html
View File

@ -92,265 +92,15 @@
</div>
</div>
<!-- skip 메뉴 -->
<div class="skip_menu">
<a href="#cont" title="본문 바로가기" class="contGo" rel="nosublink">본문 바로가기</a>
</div>
<!--// skip 메뉴 -->
<!--// 요금안내 top 배너 시작 -->
<img class="price_top_banner" src="/publish/images/level/top_banner.png" alt="최저 8.1원 요금안내" usemap="#topbanner">
<!-- <img class="price_top_banner" src="/publish/images/level/top_banner.png" alt="최저 8.1원 요금안내" usemap="#topbanner">
<map name="topbanner">
<area shape="poly" coords="45,165,194,164,182,183,155,200,124,208,85,202,63,187,46,167" href="https://www.munjaon.co.kr/web/pay/PayGuide.do" alt="">
</map>
</map> -->
<!--// 요금안내 top 배너 끝-->
<!--// quick 메뉴 시작 -->
<!--quick 메뉴 변경전
<div class="quickMenu">
<div>
<p class="quick_title">QUICK<br>MENU</p>
<p class="quick_title2">QUICK</p>
<ul class="quickMenuIn">
<li>
<a href="/publish/index.html"><i class="quick1"></i><span>이용안내</span></a>
<div class="hover_cont">이용안내</div>
</li>
<li>
<a href="#"><i class="quick2"></i><span>채팅상담</span></a>
<div class="hover_cont">채팅상담</div>
</li>
<li>
<a href="#"><i class="quick3"></i><span>원격지원</span></a>
<div class="hover_cont">원격지원</div>
</li>
<li>
<a href="#"><i class="quick4"></i><span>맞춤제작</span></a>
<div class="hover_cont">맞춤제작</div>
</li>
<li>
<a href="#"><i class="quick5"></i><span>주소록 등록</span></a>
<div class="hover_cont">주소록 등록</div>
</li>
<li>
<a href="#"><i class="quick6"></i><span>엑셀 전송</span></a>
<div class="hover_cont">엑셀 대량전송</div>
</li>
<li>
<a href="#"><i class="quick7"></i><span>견적서</span></a>
<div class="hover_cont">견적서</div>
</li>
<li>
<a href="#"><i class="quick8"></i><span>결제</span></a>
<div class="hover_cont">결제</div>
</li>
<li>
<a href="#"><i class="quick9"></i><span>영수증/계산서</span></a>
<div class="hover_cont">영수증/계산서</div>
</li>
</ul>
<button type="button" class="goTop" title="맨 위로 이동">TOP<i></i></button>
</div>
</div>
-->
<!--quick 메뉴 변경후 시작-->
<div class="quickMenu main">
<div>
<p class="quick_title">QUICK<br>MENU</p>
<p class="quick_title2">QUICK</p>
<ul class="quickMenuIn">
<!--
<li>
<a href="#" rel="nosublink"><i class="quick2"></i><span>카톡상담</span></a>
<div class="hover_cont">카톡상담</div>
</li>
<li>
<a href="#" rel="nosublink"><i class="quick3"></i><span>원격지원</span></a>
<div class="hover_cont">원격지원</div>
</li>
-->
<!-- 맞춤제작
<li>
<a href="/web/pay/PayGuide.do" rel="nosublink"><i class="quick4"></i><span>맞춤제작</span></a>
<div class="hover_cont">맞춤제작</div>
</li>
-->
<li>
<a href="/web/pay/PayGuide.do" rel="nosublink"><i class="quick12"></i><span>요금안내</span></a>
<div class="hover_cont">요금안내</div>
</li>
<li>
<a href="/web/mjon/addr/selectAddrList.do" rel="nosublink"><i class="quick10"></i><span>주소록 관리</span></a>
<div class="hover_cont">주소록 관리</div>
</li>
<li>
<a href="/web/user/sendNumberManage.do"><i class="quick5"></i><span>발신번호 관리</span></a>
<div class="hover_cont">발신번호 관리</div>
</li>
<li style="margin-top: 1px;">
<a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do"><i class="quick6"></i><span>엑셀 대량전송</span></a>
<div class="hover_cont">엑셀 대량전송</div>
</li>
<li>
<a href="/web/pay/PayGuide.do?tabType=2" rel="nosublink"><i class="quick7"></i><span>견적서</span></a>
<div class="hover_cont">견적서</div>
</li>
<li style="margin-top: 1px;">
<a href="/web/member/pay/PayList.do" rel="nosublink"><i class="quick8"></i><span>결제관리</span></a>
<div class="hover_cont">결제관리</div>
</li>
<!--
<li>
<a href="/web/member/pay/BillPub.do" rel="nosublink"><i class="quick9"></i><span>계산서/영수증</span></a>
<div class="hover_cont">계산서/영수증</div>
</li>
-->
<li>
<a href="/web/member/pay/BillPub.do" rel="nosublink"><i class="quick9"></i><span>세금계산서</span></a>
<div class="hover_cont">세금계산서</div>
</li>
<li class="cscenter">
<a href="/web/cop/bbs/NoticeList.do" rel="nosublink"><i class="quick11"></i><span>고객센터</span></a>
<div class="hover_cont">
<div class="title">고객센터</div>
<div class="number">1551-8011</div>
<ul class="info">
<li>· 월~금 : 09:30 ~ 18:30</li>
<li>· 점심시간 : 13:00 ~ 14:00</li>
<li>· 토, 일요일 및 법정공휴일 휴무</li>
</ul>
<div class="cskakao">
<a href="http://pf.kakao.com/_PxoTtb/chat" class="kakao" target="_blank" rel="nosublink">카톡 상담</a>
<a href="javascript:void(0);" class="remote" onclick="remotePop('https://939.co.kr/munjaon/');" rel="nosublink">원격지원</a>
</div>
</div>
</li>
</ul>
<button type="button" class="goTop" title="맨 위로 이동">TOP<i></i></button>
</div>
<div class="quick_kakaobtn main"><a href="http://pf.kakao.com/_PxoTtb/chat" target="_blank" rel="nosublink">카카오톡 상담</a></div>
</div>
<!--// quick 메뉴 끝 -->
<!-- header 영역 -->
<header id="header" class="header sub">
<!-- header top 영역 -->
<div class="header_top">
<div class="inner">
<ul class="menu_left">
<li><a href="#"><i class="hdTop_fav"></i>즐겨찾기추가2222</a></li>
<li><a href="#"><i class="hdTop_mypage"></i>마이페이지</a></li>
<li><a href="#"><i class="hdTop_center"></i>고객센터</a></li>
</ul>
<ul class="menu_right">
<li><a href="#">충전하기</a></li>
<li class="SortLine"><a href="#">요금안내</a></li>
<li class="SortLine"><a href="#">이용안내</a></li>
<li class="SortLine"><a href="#">1:1고객상담</a></li>
</ul>
</div>
</div><!-- header top 영역 -->
<!-- header body 영역 -->
<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 class="new"><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="전체메뉴"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
</div>
</div>
<!-- search popup 영역 -->
<div class="pop_search">
<div class="inner">
<div class="area_search">
<select name="" id="">
<option value="">그림문자</option>
<option value="">단문문자</option>
<option value="">장문문자</option>
<option value="">GIF</option>
</select>
<input type="text" placeholder="문자샘플 검색하기" onfocus="this.placeholder=''" onblur="this.placeholder='문자샘플 검색하기'">
<button><img src="/publish/images/search02.png" alt=""></button>
</div>
<div class="area_popular">
<p><i></i>인기검색어</p>
<ul class="popular_tag">
<li><a href="#">#정월대보름</a></li>
<li class="on"><a href="#">#추석</a></li>
<li><a href="#">#가을인사</a></li>
<li><a href="#">#좋은하루</a></li>
</ul>
</div>
<button class="btn_close" onclick="searchToggle();"><img src="/publish/images/btn_searchclose.png" alt=""></button>
</div>
</div>
<!--// search popup 영역 -->
</div>
<!--// header body 영역 -->
<div id="login" class="login2">
<div class="inner">
<div class="login_left">
<div class="login_info">
<i><img src="/publish/images/mypageIcon2.png" id="commonHeaderGradeIcon"></i>
<div class="login2_name">
<p>정수빈</p><span>(개인) 님</span>
</div>
<div class="session">
<div>
<span id="ViewTimer">00:00</span>
</div>
<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 btnType2" onclick="location.href='/web/uat/uia/actionLogout.do'">로그아웃</button>
<div class="security_box green_box">
<a href="/web/user/mberSecureLogin.do" class="title">보안로그인</a><!-- 보안로그인 클릭시 보안로그인 홈페이지로 -->
<a href="#" id="secuLoginFlag" class="state on">ON</a><!-- ON/OFF 클릭시 이벤트 발생 -->
</div>
</div>
<div class="login_pay">
<div class="check_money">
<div class="holdingsum_box">
<i></i>
<p>보유잔액
<!-- <em>(캐시)</em> --> <span class="fwMd" id="hdUserMoney">0</span>원</p>
</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="point">
<i></i>
<p>
<!-- <em>적립</em> -->포인트 <span class="fwMd">0</span>원</p>
<button type="button" data-tooltip="popup04" class="btnType btnType3" onclick="popScrSetting();">교환</button>
</div>
</div>
</div>
</div>
</div>
<!--// login 영역 -->
</header>
<!--// header 영역 -->
<div class="mask"></div>
<div data-include-path="/publish/layout/_header.html"></div>
<!-- login 영역 -->
<!-- content 영역 -->
@ -394,10 +144,11 @@
<div class="banner_w">
<div class="sw_wrap">
<div class="swiper-container swiper2 swiper-container-initialized swiper-container-horizontal">
<div class="swiper-wrapper" style="transition-duration: 0ms; transform: translate3d(-3395px, 0px, 0px);">
<div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-prev" data-swiper-slide-index="5" style="width: 339.5px;">
<div class="swiper-wrapper" style="transition-duration: 0ms; transform: translate3d(-3734.5px, 0px, 0px);"><div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="5" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/msgdata/selectMsgDataView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">특정문구 일괄변환 기능</li>
<li class="cont_ex">
@ -406,14 +157,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111599" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-active" data-swiper-slide-index="6" style="width: 339.5px;">
</div><div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-prev" data-swiper-slide-index="6" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/msgdata/selectMsgDataView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">문자 포토에디터 무료 제공</li>
<li class="cont_ex">
@ -422,14 +178,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111600" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-next" data-swiper-slide-index="7" style="width: 339.5px;">
</div><div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-active" data-swiper-slide-index="7" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/msgdata/selectMsgDataView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">문자 제목 및 약도 추가</li>
<li class="cont_ex">
@ -438,14 +199,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111601" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="8" style="width: 339.5px;">
</div><div class="swiper-slide swiper-slide-duplicate swiper-slide-duplicate-next" data-swiper-slide-index="8" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/member/pay/BillPub.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">자동화 기반 비용처리</li>
<li class="cont_ex">
@ -454,15 +220,25 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111602" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<!-- 배너수정 250224 -->
<div class="swiper-slide" data-swiper-slide-index="0" style="width: 339.5px;">
<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">
@ -471,14 +247,21 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111594" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide" data-swiper-slide-index="1" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/api/intrdView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">문자연동(API) 서비스 제공</li>
<li class="cont_ex">
@ -487,14 +270,21 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111595" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide" data-swiper-slide-index="2" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">그림문자 맞춤제작</li>
<li class="cont_ex">
@ -503,14 +293,21 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111596" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide" data-swiper-slide-index="3" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/addragency/selectAddrAgencyList.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">주소록 등록 무료대행</li>
<li class="cont_ex">
@ -519,13 +316,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111597" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide" data-swiper-slide-index="4" style="width: 339.5px;">
<div class="contWrap">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">080수신거부 무료 제공</li>
<li class="cont_ex">
@ -534,12 +337,17 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111598" alt="">
</p>
</li>
</ul>
</div>
</div>
<div class="swiper-slide swiper-slide-prev" data-swiper-slide-index="5" style="width: 339.5px;">
<div class="swiper-slide" data-swiper-slide-index="5" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/msgdata/selectMsgDataView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">특정문구 일괄변환 기능</li>
<li class="cont_ex">
@ -548,14 +356,21 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111599" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-active" data-swiper-slide-index="6" style="width: 339.5px;">
<div class="swiper-slide swiper-slide-prev" data-swiper-slide-index="6" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/msgdata/selectMsgDataView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">문자 포토에디터 무료 제공</li>
<li class="cont_ex">
@ -564,14 +379,21 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111600" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-next on" data-swiper-slide-index="7" style="width: 339.5px;">
<div class="contWrap on">
<div class="swiper-slide swiper-slide-active" data-swiper-slide-index="7" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/msgdata/selectMsgDataView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">문자 제목 및 약도 추가</li>
<li class="cont_ex">
@ -580,14 +402,21 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111601" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide" data-swiper-slide-index="8" style="width: 339.5px;">
<div class="contWrap">
<div class="swiper-slide swiper-slide-next on" data-swiper-slide-index="8" style="width: 339.5px;">
<div class="contWrap on">
<a href="/web/member/pay/BillPub.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">자동화 기반 비용처리</li>
<li class="cont_ex">
@ -596,16 +425,25 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111602" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<!--// 배너수정 250224 -->
<div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="0" style="width: 339.5px;">
<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">
@ -614,14 +452,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111594" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="1" style="width: 339.5px;">
</div><div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="1" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/api/intrdView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">문자연동(API) 서비스 제공</li>
<li class="cont_ex">
@ -630,14 +473,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111595" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="2" style="width: 339.5px;">
</div><div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="2" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/custom/selectMsgCustomView.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">그림문자 맞춤제작</li>
<li class="cont_ex">
@ -646,14 +494,19 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111596" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
<div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="3" style="width: 339.5px;">
</div><div class="swiper-slide swiper-slide-duplicate" data-swiper-slide-index="3" style="width: 339.5px;">
<div class="contWrap">
<a href="/web/mjon/addragency/selectAddrAgencyList.do" title="페이지 이동">
<ul class="slide_cont1 table_cell1">
<li class="cont1_title">주소록 등록 무료대행</li>
<li class="cont_ex">
@ -662,12 +515,15 @@
<img src="/cmm/fms/getImage.do?atchFileId=FILE_000000000111597" alt="">
</p>
</li>
<li class="more">자세히보기</li>
</ul>
</a>
</div>
</div>
</div>
</div></div>
<!-- 버튼 -->
<div class="swiper-button-next" tabindex="0" role="button" aria-label="Next slide">
<img src="/publish/images/main/cont1_next.png" alt="다음">
@ -676,9 +532,8 @@
<img src="/publish/images/main/cont1_prev.png" alt="이전">
</div>
<!-- 페이징 -->
<div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets"><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 1"></span><span class="swiper-pagination-bullet swiper-pagination-bullet-active" tabindex="0" role="button" aria-label="Go to slide 2"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 3"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 4"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 5"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 6"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 7"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 8"></span></div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span>
</div>
<div class="swiper-pagination swiper-pagination-clickable swiper-pagination-bullets"><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 1"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 2"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 3"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 4"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 5"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 6"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 7"></span><span class="swiper-pagination-bullet swiper-pagination-bullet-active" tabindex="0" role="button" aria-label="Go to slide 8"></span><span class="swiper-pagination-bullet" tabindex="0" role="button" aria-label="Go to slide 9"></span></div>
<span class="swiper-notification" aria-live="assertive" aria-atomic="true"></span></div>
</div>
</div>
<form id="mainImgSendForm" name="mainImgSendForm" method="post">

19
src/main/webapp/publish/info_popup.html
View File

@ -429,6 +429,25 @@
</div>
<!-- // 결제관리 > 세금계산서 발행 등록 -->
<!-- 카톡발송 > 친구톡 -->
<div class="info_popup" id="friendTalkSend">
<div class="popup_heading">
<p>사용안내</p>
</div>
<div class="layer_in layer_info_wrap">
<ul class="info_list">
<li>친구톡 텍스트형은 최대 1,000자까지 작성 가능 (이미지형 400자, 와이드 이미지형 76자)</li>
<li>변수는 [*이름*], [*1*]~[*4*]까지 입력하실 수 있습니다.</li>
<li>광고성 정보 포함 시, 자동으로 (광고) 표시와 080무료수신거부번호가 메시지 내용에 표시됩니다.</li>
<li>(광고) 표기 사용 여부는 선택 가능하나, (광고) 표기 해제에 따른 법규 의무사항 미준수 시, 메시지 발송이 중단될 수 있습니다.</li>
<li>예약 메시지는 수정 가능하며, 예약 발송시간 5분전까지만 취소·삭제 가능합니다.</li>
<!-- <li>세금계산서 자동발행 등록 시 현금영수증 발행화면은 비활성화 됩니다.</li> -->
<li style="font-weight:bold;color:#222;">안심번호는 임시번호로 전송이 불가합니다.</li>
</ul>
</div>
</div>
<!-- // 카톡발송 > 친구톡 -->
</body>
</html>

189
src/main/webapp/publish/js/content.js
View File

@ -172,8 +172,7 @@ $(document).ready(function () {
if (checkAdrWrap.is(".adr_first") == true) {
// 첫번째가 선택됐을 때 첫번째는 고정이고 나머지만 움직이게
$(".adr_first").after(checkAdrWrap);
}
else{
} else {
// 첫번째가 선택 안됐을 때 나머지들을 최상단으로
$(".adr_first").before(checkAdrWrap);
}
@ -297,8 +296,7 @@ $(document).ready(function () {
if (checkAdrWrap.is(".adr_last") == true) {
// 첫번째가 선택됐을 때 첫번째는 고정이고 나머지만 움직이게
$(".adr_last").before(checkAdrWrap);
}
else{
} else {
// 첫번째가 선택 안됐을 때 나머지들을 최하단으로
$(".adr_last").after(checkAdrWrap);
}
@ -358,8 +356,7 @@ $(document).ready(function () {
if ($(this).parent().hasClass("check_group_all") === true) {
$(this).find("img").attr("src", "/publish/images/content/open_folder.png");
$(this).find("img").attr("alt", "폴더 열림");
}
else {
} else {
$(this).find("img").attr("src", "/publish/images/content/open_folder2.png");
$(this).find("img").attr("alt", "폴더 열림");
}
@ -472,7 +469,10 @@ $(document).ready(function () {
}*/
} else {
$(".replace_send_wrap").slideUp(400);
$('.send_top .send_right .phone').css({'top': '0','transition': 'top .4s linear'});
$('.send_top .send_right .phone').css({
'top': '0',
'transition': 'top .4s linear'
});
}
});
@ -495,15 +495,16 @@ $(document).ready(function () {
} else if ($(this).val() == "IMAGE") {
$(".emphasis_image").addClass("active");
$(".emphasis_image").siblings(".emphasis_cont").removeClass("active");
}
else if($(this).val() == "TEXT"){
} else if ($(this).val() == "TEXT") {
$(".emphasis_mark").addClass("active");
$(".emphasis_mark").siblings(".emphasis_cont").removeClass("active");
//첨부 이미지 정보가 있으면 지워준다.
$("#imgFile").val("");
$("#imgNm").val("");
}else{$(".emphasis_cont").removeClass("active");}
} else {
$(".emphasis_cont").removeClass("active");
}
});
$(".kakaotalksend_cont .template_type_select").change(function () {
@ -520,16 +521,32 @@ $(document).ready(function () {
$("input[name='img_file_add']").change(function () {
if ($("input[name='img_file_add']:checked").attr("id") == "img_file_1") {
$(".basic_img_add_wrap").show().siblings(".img_add_info_wrap").hide();
$(".img_file_add_wrap").show();
$(".basic_img_add_wrap").show().siblings(".wide_img_add_wrap").hide();
//$(".img_file_add_wrap").show();
$(".kakao_image img").show().attr("src", "/publish/images/content/kakao_img_basic.jpg");
} else if ($("input[name='img_file_add']:checked").attr("id") == "img_file_2") {
$(".wide_img_add_wrap").show().siblings(".img_add_info_wrap").hide();
$(".img_file_add_wrap").show();
$(".wide_img_add_wrap").show().siblings(".basic_img_add_wrap").hide();
$(".kakao_image img").show().attr("src", "/publish/images/content/kakao_img_wide.jpg");
//$(".img_file_add_wrap").show();
} else {
$(".img_add_info_wrap, .img_file_add_wrap").hide();
$(".kakao_image img").hide();
}
});
$(".friend_talk_wrap #ad_Y").click(function () {
if ($(this).is(":checked") == false) {
$(".ad_txt, .sub_ad_text p,.friend_talk_title,.kakao_block_text").hide();
$(".friend_talk_wrap .put_text_wrap .put_text").css({
"padding": "0",
"height": "calc(100% - 18px)"
});
} else {
$(".ad_txt, .sub_ad_text p,.friend_talk_title,.kakao_block_text").show();
$(".friend_talk_wrap .put_text_wrap .put_text").removeAttr("style")
}
})
/* 포토이미지 드래그 */
if ($('.thumb_wrap').length > 0) {
$('.thumb_wrap').sortable();
@ -606,7 +623,11 @@ function wrapWindowByMask(item){
var width = $("." + item).width();
var height = $("." + item).height();
/*$("."+item).css({'left' : ($(window).width() - width) / 2, 'top' : ($(window).height() - height) / 2,'opacity':'1'});*/
$("."+item).css({'left' : ($(document).width()-width)/2, 'top' : ($(window).height() - height) / 2,'opacity':'1'});
$("." + item).css({
'left': ($(document).width() - width) / 2,
'top': ($(window).height() - height) / 2,
'opacity': '1'
});
}, 250);
}
@ -695,6 +716,12 @@ function TabType2(obj, tabId) {
$('.tab_depth4 .tDep2_hashTag a').removeClass('on');
$('.tab_depth4 .tDep2_hashTag a').eq(0).addClass('on');
$(".api_guide_con").not($tabCn).removeClass("current");
$(".api_guide_con").not($tabCn).fadeOut(0);
$(".api_guide_con").not($tabCn).removeClass("current");
$(".api_guide_con").not($tabCn).fadeOut(0);
currTabId = tabId;
}
@ -1098,9 +1125,15 @@ function calendarSetting(){
if (thisCal.offset().left + thisCal.outerWidth() < $(window).outerWidth()) {
var ll = thisCal.closest('.picker').prev().position().left;
thisCal.css({'left':ll,'right':'initial'});
thisCal.css({
'left': ll,
'right': 'initial'
});
} else {
thisCal.css({'left':'initial','right':0});
thisCal.css({
'left': 'initial',
'right': 0
});
}
thisCal.css("display", "block");
}
@ -1124,9 +1157,15 @@ function calendarSetting(){
if (thisCal.offset().left + thisCal.outerWidth() < $(window).outerWidth()) {
var ll = thisCal.closest('.picker').prev().position().left;
thisCal.css({'left':ll,'right':'initial'});
thisCal.css({
'left': ll,
'right': 'initial'
});
} else {
thisCal.css({'left':'initial','right':0});
thisCal.css({
'left': 'initial',
'right': 0
});
}
thisCal.css("display", "block");
}
@ -1155,9 +1194,15 @@ function calendarSetting(){
if (thisCal.offset().left + thisCal.outerWidth() < $(window).outerWidth()) {
var ll = thisCal.closest('.picker').prev().position().left;
thisCal.css({'left':ll,'right':'initial'});
thisCal.css({
'left': ll,
'right': 'initial'
});
} else {
thisCal.css({'left':'initial','right':0});
thisCal.css({
'left': 'initial',
'right': 0
});
}
thisCal.css("display", "block");
}
@ -1208,9 +1253,15 @@ function calendarSetting(){
if (thisCal.offset().left + thisCal.outerWidth() < $(window).outerWidth()) {
var ll = thisCal.closest('.picker').prev().position().left;
thisCal.css({'left':ll,'right':'initial'});
thisCal.css({
'left': ll,
'right': 'initial'
});
} else {
thisCal.css({'left':'initial','right':0});
thisCal.css({
'left': 'initial',
'right': 0
});
}
thisCal.css("display", "block");
}
@ -1253,11 +1304,14 @@ function fnSetDynamicCalendar() {
$this.attr("data-dateControl", true);
switch ($this[0].className) {
case "startDate":
sText = "시작";break;
sText = "시작";
break;
case "endDate":
sText = "종료";break;
sText = "종료";
break;
case "date":
sText = "";break;
sText = "";
break;
default:
sText = "";
}
@ -1266,10 +1320,10 @@ function fnSetDynamicCalendar() {
$this.attr("id", $this.attr("name"));
sobjId = $this.attr("name");
}
var innerhtml ="<div class='calendarPop' id='calendarName_"+sobjId+"'>"
+"<input type='button' value='"+sText+"날짜 달력에서 선택'"
+"onclick=\"return calendarOpen('" + sobjId + "-lry','" + sText + "',this)\"/>"
+"</div>";
var innerhtml = "<div class='calendarPop' id='calendarName_" + sobjId + "'>" +
"<input type='button' value='" + sText + "날짜 달력에서 선택'" +
"onclick=\"return calendarOpen('" + sobjId + "-lry','" + sText + "',this)\"/>" +
"</div>";
$this.after(innerhtml);
}
});
@ -1278,8 +1332,12 @@ function fnSetDynamicCalendar() {
$(function () {
fnSetDynamicCalendar();
jQuery(".rv a").bind('mouseover keyup' , function() { imgOn(jQuery(this))})
jQuery(".rv a").bind('mouseout blur' , function() { imgOff(jQuery(this))})
jQuery(".rv a").bind('mouseover keyup', function () {
imgOn(jQuery(this))
})
jQuery(".rv a").bind('mouseout blur', function () {
imgOff(jQuery(this))
})
})
/* //calendar */
@ -1354,19 +1412,74 @@ function sendPhoneFixed(){
} else {
var pH = Math.round($(this).find('.send_right .phone').outerHeight() + 240);
}
var sendRightOft = Math.round($(this).find('.send_right:visible').offset().top);
$(window).on('scroll', function () {
var scrT = $(this).scrollTop();
var t = scrT + 213;
var h = Math.round($('.send_top').find('.send_right').outerHeight());
var revT = $('.send_rev').length ? Math.round($('.send_rev:visible').offset().top) : null;
if(t>ofsT && t-ofsT<h-pH){
$('.send_top .send_right .phone').css('top',t-ofsT);
}else if(t>ofsT){
$('.send_top .send_right .phone').css('top',h-pH);
}else if(t<=ofsT){
$('.send_top .send_right .phone').attr('style','');
if ($(".cont").find(".tabType1 .tab.active").text().trim() == "대량문자(광고문자)") {
if (t > ofsT && scrT !== 0) {
// send_rev 영역에 도달한 경우 멈춤
if (scrT + pH > revT) {
$('.send_top .send_right .phone:visible').css({
'top': revT - pH - sendRightOft + 470,
'transition': 'all 0.2s'
});
}
// 스크롤 위치에 맞춰 부드럽게 이동
else {
$('.send_top .send_right .phone:visible').css({
'top': t - sendRightOft,
'transition': 'all 0.2s'
});
}
}
// send_right 상단에 도달하면 스타일 제거
else {
$('.send_top .send_right .phone:visible').css({
'top': '0',
'transition': 'all 0.2s'
});
}
} else if ($(".cont").find(".tabType4 .tab.active").text().trim() == "알림톡") {
if (t > ofsT && t - ofsT < h - pH) {
$('.send_top .send_right .phone').css({
'top': t - ofsT,
'transition': 'all 0.2s'
});
} else if (t > ofsT) {
$('.send_top .send_right .phone').css({
'top': h - pH + 100,
'transition': 'all 0.2s'
});
} else if (t <= ofsT) {
$('.send_top .send_right .phone').css({
'top': '0',
'transition': 'all 0.2s'
});
}
} else {
if (t > ofsT && t - ofsT < h - pH) {
$('.send_top .send_right .phone').css({
'top': t - ofsT,
'transition': 'all 0.2s'
});
} else if (t > ofsT) {
$('.send_top .send_right .phone').css({
'top': h - pH,
'transition': 'all 0.2s'
});
} else if (t <= ofsT) {
$('.send_top .send_right .phone').css({
'top': '0',
'transition': 'all 0.2s'
});
}
}
});
});
}

333
src/main/webapp/publish/kakao_friendtalk_add.html
View File

@ -24,6 +24,7 @@
<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/popup.js"></script>
<script src="/publish/js/popupLayer.js"></script>
<script type="text/javascript" src="/publish/js/datepicker/picker.js"></script>
<script type="text/javascript" src="/publish/js/datepicker/picker.date.js"></script>
@ -37,112 +38,7 @@
<a href="#cont" title="본문 바로가기" class="contGo">본문 바로가기</a>
</div>
<!--// skip 메뉴 -->
<!-- header 영역 -->
<header id="header" class="header sub ">
<!-- header top 영역 -->
<div class="header_top">
<div class="inner">
<ul class="menu_left">
<li><a href="#"><i class="hdTop_fav"></i>즐겨찾기추가</a></li>
<li><a href="#"><i class="hdTop_mypage"></i>마이페이지</a></li>
<li><a href="#"><i class="hdTop_center"></i>고객센터</a></li>
</ul>
<ul class="menu_right">
<li><a href="#">충전하기</a></li>
<li class="SortLine"><a href="#">요금안내</a></li>
<li class="SortLine"><a href="#">이용안내</a></li>
<li class="SortLine"><a href="#">1:1고객상담</a></li>
</ul>
</div>
</div><!-- header top 영역 -->
<!-- header body 영역 -->
<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="전체메뉴"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
</div>
</div>
<!-- search popup 영역 -->
<div class="pop_search">
<div class="inner">
<div class="area_search">
<select name="" id="">
<option value="">그림문자</option>
<option value="">단문문자</option>
<option value="">장문문자</option>
<option value="">GIF</option>
</select>
<input type="text" placeholder="문자샘플 검색하기">
<button><img src="/publish/images/search02.png" alt=""></button>
</div>
<div class="area_popular">
<p><i></i>인기검색어</p>
<ul class="popular_tag">
<li><a href="#">#정월대보름</a></li>
<li class="on"><a href="#">#추석</a></li>
<li><a href="#">#가을인사</a></li>
<li><a href="#">#좋은하루</a></li>
</ul>
</div>
<button class="btn_close" onclick="searchToggle();"><img src="/publish/images/btn_searchclose.png"
alt=""></button>
</div>
</div>
<!--// search popup 영역 -->
</div>
<!--// header body 영역 -->
<div id="login" class="login">
<div class="inner table">
<div class="login_left table_cell">
<div class="login_put">
<label for="id_text" class="label"></label>
<input type="text" placeholder="아이디를 입력해주세요" id="id_text" class="id_text" maxlength="30"
size="18">
<label for="password_text" class="label"></label>
<input type="password" placeholder="비밀번호를 입력해주세요" id="password_text" class="password_text"
maxlength="30" size="18">
<label for="login_button" class="label"></label>
<button type="submit" class="btnType btnType1" class="login_button">로그인</button>
</div>
<div class="login_save">
<input type="checkbox" id="save_id">
<label for="save_id">아이디 저장</label>
</div>
<div class="login_find">
<a href="#">아이디찾기 /</a>
<a href="#">비밀번호 찾기</a>
</div>
<div>
<button type="button" class="btnType btnType2">회원가입</button>
<button type="button" class="btnType btnType3">둘러보기</button>
</div>
</div>
<div class="login_right">
<span><i></i>이달의 이벤트</span>
<button type="button" class="btnType btnType4">바로가기</button>
</div>
</div>
</div>
<!--// login 영역 -->
</header>
<!--// header 영역 -->
<!-- login 영역 -->
<div data-include-path="/publish/layout/_header.html"></div>
<!-- content 영역 -->
<div id="container" class="cont sub">
<div class="inner">
@ -153,15 +49,14 @@
<li class="tab"><button type="button" onclick="location.href='/publish/kakao_allimtalk_send.html'">알림톡</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/kakao_friendtalk_send.html'">친구톡</button></li>
<li class="tab active"><button type="button" onclick="location.href='/publish/kakao_use_guide.html'">카카오톡 설정</button></li>
<li class="tab"><button type="button" onclick="TabType5(this,'4');">알림톡·친구톡 소개</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/kakao_allimtalk_intro.html'">알림톡 소개</button></li>
</ul>
<!--// tab button -->
<!-- 카카오톡 설정 - 알림톡 템플릿 등록/관리 - 내템플릿 -->
<div class="top_content kakaotalkset_cont current pay_tab_wrap">
<div class="heading">
<h2>카카오톡 설정</h2>
<button type="button" class="button info"
onclick="window.open('popup_kakaoset_template.html','_blank','width=790, height=300, top=100, left=100, fullscreen=no, menubar=no, status=no, toolbar=no, titlebar=yes, location=no, scrollbars=yes')">사용안내</button>
<button type="button" class="button info" onclick="infoListPop('friendTalkSend','792','340');">사용안내</button>
</div>
<div class="list_tab_wrap2 type2">
<!-- tab button -->
@ -178,7 +73,7 @@
<p class="tType1_title">친구톡 템플릿 등록</p>
<table class="tType1">
<colgroup>
<col style="width: 190px;">
<col style="width: 130px;">
<col style="width: auto;">
</colgroup>
<tbody>
@ -186,6 +81,7 @@
<th>채널ID</th>
<td>
<select name="" id="" class="select_gray_type">
<option value="">채널 ID 선택</option>
<option value="">@munjaon</option>
</select>
</td>
@ -193,8 +89,10 @@
<tr>
<th>템플릿명</th>
<td>
<input type="text" class="template_name" placeholder="템플릿 명을 입력해주세요">
<p class="template_name_cf">최대 100자, 중복불가</p>
<div class="template_name_wrap">
<input type="text" placeholder="최대 50자, 템플릿 관리용">
<button type="button" class="btnType btnType8" onclick="window.open('/publish/popup_friendtalk_template_choice.html','_blank','width=930, height=780, top=100, left=100, fullscreen=no, menubar=no, status=no, toolbar=no, titlebar=yes, location=no, scrollbars=yes')">템플릿 불러오기</button>
</div>
</td>
</tr>
<tr>
@ -204,48 +102,57 @@
<input type="radio" name="img_file_add" id="img_file_0" checked><label for="img_file_0">첨부 안함</label>
<input type="radio" name="img_file_add" id="img_file_1"><label for="img_file_1">이미지 첨부</label>
<input type="radio" name="img_file_add" id="img_file_2"><label for="img_file_2">와이드 이미지 첨부</label>
<div class="img_add_info_wrap basic_img_add_wrap">
<div class="img_file_add_wrap basic_img_add_wrap">
<p class="info_title_text"><span class="c_e40000">*</span> 이미지 첨부 안내</p>
<ul class="info_text">
<li>- 권장사이즈 : 720px * 720px</li>
<li>- 권장사이즈 : 800px * 400px</li>
<li>- 제한사이즈 : 가로 500px 미만, 가로:세로 비율이 2:1 미만 또는 3:4 초과시 업로드 불가</li>
<li>- 파일형식 : jpg, png (최대 500kb)</li>
<li>- 이미지 첨부시 메시지 내용은 최대 400자까지 입력할 수 있습니다.</li>
<li>- 파일형식 : jpg, png (최대 5MB)</li>
<li>- 이미지 첨부 시 메시지 내용은 최대 400자, 버튼 5개까지 입력할 수 있습니다.</li>
</ul>
</div>
<div class="img_add_info_wrap wide_img_add_wrap">
<p class="info_title_text"><span class="c_e40000">*</span> 와이드 이미지 첨부 안내</p>
<ul class="info_text">
<li>- 권장사이즈 : 800px * 600px</li>
<!-- <li>- 제한사이즈 : 가로 500px 미만, 가로:세로 비율이 2:1 미만 또는 3:4 초과시 업로드 불가</li> -->
<li>- 파일형식 : jpg, png (최대 2mb)</li>
<li>- 와이드 이미지 첨부시 메시지 내용은 최대 76자, 버튼 1개까지 입력할 수 있습니다.</li>
</ul>
</div>
</div>
<div class="img_file_add_wrap">
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<ul class="img_file_info_wrap">
<li>
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<div class="img_file_wrap">
<p class="file_name">image_testtest.jpg</p>
<button type="button" class="btn_del" onclick="buttonTypeDel(this);"><img src="/publish/images/btn_delete.png" alt=""></button>
</div>
</li>
<li>
<p>이미지 클릭시 이동할 URL</p>
<input type="text" placeholder="http://" class="img_url">
<input type="text" placeholder="(선택사항) https://" class="img_url">
</li>
</ul>
</div>
<div class="img_file_add_wrap wide_img_add_wrap">
<p class="info_title_text"><span class="c_e40000">*</span> 와이드 이미지 첨부 안내</p>
<ul class="info_text">
<li>- 권장사이즈 : 800px * 600px</li>
<li>- 파일형식 : jpg, png (최대 5MB)</li>
<li>- 와이드 이미지 첨부시 메시지 내용은 최대 76자, 버튼 1개까지 입력할 수 있습니다.</li>
</ul>
<ul class="img_file_info_wrap">
<li>
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<div class="img_file_wrap">
<p class="file_name file_none">이미지 없음</p>
<button type="button" class="btn_del" onclick="buttonTypeDel(this);"><img src="/publish/images/btn_delete.png" alt=""></button>
</div>
</li>
<li>
<p>이미지 클릭시 이동할 URL</p>
<input type="text" placeholder="(선택사항) https://" class="img_url">
</li>
</ul>
</div>
</td>
</tr>
<tr>
<th>광고포함 여부</th>
<td>
<input type="radio" name="ad_yn" id="ad_Y"><label for="ad_Y">광고성 정보
포함</label>
<input type="radio" name="ad_yn" id="ad_N"><label for="ad_N">포함 안함</label>
<input type="checkbox" name="ad_yn" id="ad_Y" style="margin:-4px 5px 0 0;" checked>
<label for="ad_Y">광고성 정보 포함</label>
</td>
</tr>
<tr>
@ -260,7 +167,7 @@
<label for="textarea" class="label"></label>
<textarea id="textarea" class="put_text" placeholder="내용을 입력해주세요."></textarea>
<div class="text_length">
<div>
<div class="sub_ad_text">
<p>수신거부 : 홈 > 채널차단</p>
</div>
<div>
@ -271,8 +178,7 @@
</div>
<div class="put_right">
<div class="btn_popup_wrap">
<button type="button" class="btnType btnType7"
onclick="miniPopup(this)">특수문자</button>
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">특수문자</button>
<div class="send_miniPop spc_character">
<div class="tab_character">
<a href="#none" class="on">특수문자</a>
@ -499,14 +405,11 @@
</div>
</div>
<!-- //그외 -->
<button type="button" class="btn_close"
onclick="miniPopup(this)">닫기</button>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap convers_wrap">
<button type="button" class="btnType btnType7"
onclick="miniPopup(this)">특정문구 일괄변환<i
class="qmMark"></i></button>
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">특정문구 일괄변환<i class="qmMark"></i></button>
<div class="send_miniPop convers">
<div>
<div class="convers_top">
@ -521,31 +424,137 @@
<a href="#">#{4}</a>
</div>
</div>
<button type="button" class="btn_close"
onclick="miniPopup(this)">닫기</button>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap spc_wrap">
<button type="button" class="btnType btnType7"
onclick="miniPopup(this)">이모티콘</button>
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">이모티콘</button>
<div class="send_miniPop spc_character kakao_emoticon">
<div class="cnt_character">
<div class="box_character">
<a href="#">※</a>
<a href="#">☆</a>
<a href="#">★</a>
<a href="#">○</a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_001.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_002.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_003.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_004.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_005.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_006.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_007.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_008.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_009.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_010.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_011.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_012.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_013.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_014.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_015.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_016.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_017.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_018.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_019.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_020.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_021.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_022.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_023.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_024.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_025.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_026.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_027.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_028.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_029.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_030.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_031.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_032.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_033.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_034.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_035.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_036.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_037.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_038.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_039.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_040.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_041.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_042.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_043.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_044.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_045.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_046.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_047.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_048.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_049.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_050.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_051.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_052.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_053.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_054.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_055.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_056.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_057.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_058.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_059.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_060.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_061.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_062.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_063.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_064.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_065.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_066.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_067.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_068.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_069.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_070.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_071.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_072.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_073.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_074.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_075.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_076.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_077.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_078.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_079.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_080.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_081.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_082.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1001.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1002.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1003.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1004.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1005.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1006.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1007.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1008.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1009.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1010.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1011.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1012.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1013.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1014.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1015.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1016.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1017.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1018.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1019.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1020.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1021.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1022.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1023.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1024.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1025.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1026.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1027.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1028.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1029.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1030.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1031.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1032.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1033.png" alt="" /></a>
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1034.png" alt="" /></a>
</div>
</div>
<button type="button" class="btn_close"
onclick="miniPopup(this)">닫기</button>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap template_call_wrap">
<button type="button" class="btnType btnType8">템플릿 불러오기</button>
</div>
<div class="send_btnWrap">
<!-- <button type="button" class="btnType btn_text_save">내용 저장하기</button> -->
<button type="button" class="btnType btnType9">초기화</button>
</div>
</div>
@ -556,13 +565,8 @@
<td class="template_button">
<select name="" id="" class="select_gray_type template_button_select">
<option value="button_type_0">버튼타입 선택</option>
<option value="button_type_1">배송조회</option>
<option value="button_type_2">웹링크</option>
<option value="button_type_3">앱링크</option>
<option value="button_type_4">봇키워드</option>
<option value="button_type_5">메시지전달</option>
<option value="button_type_6">상담톡전환</option>
<option value="button_type_7">챗봇전환</option>
</select>
<button type="button" class="btnType btnType6"
onclick="templateButtonAdd();">추가</button>
@ -630,13 +634,12 @@
<div class="send_right">
<div class="phone">
<div class="phoneIn">
<p class="prev_p"><img src="/publish/images/content/kakao_prev_icon.png"
alt="">@munjaon</p>
<p class="prev_p"><img src="/publish/images/content/kakao_prev_icon.png" alt="">@munjaon</p>
<!-- 텍스트 미리보기 -->
<div class="text_preview">
<p class="friend_talk_title"><span>(광고)</span> munjaon</p>
<div class="allimtalk_content">
<div class="kakao_image"><img src="/publish/images/content/friend_talk_img.png" alt=""></div>
<div class="kakao_image"><img src="/publish/images/content/friend_talk_img.png" alt="" style="display:none;"></div>
<p class="template_text">홍길동 고객님 안녕하세요.
문자온입니다.
문자온에서는 재결제 고객님들께 다양한 이벤트를 준비하였으니, 방문하셔서 혜택 놓치지 마세요.</p>

543
src/main/webapp/publish/kakao_friendtalk_send.html
View File

@ -6,8 +6,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<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 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">
@ -24,11 +23,17 @@
<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/popup.js"></script>
<script src="/publish/js/popupLayer.js"></script>
<script type="text/javascript" src="/publish/js/datepicker/picker.js"></script>
<script type="text/javascript" src="/publish/js/datepicker/picker.date.js"></script>
<script type="text/javascript" src="/publish/js/datepicker/ko_KR.js"></script>
<script>
</script>
</head>
@ -38,111 +43,8 @@
</div>
<!--// skip 메뉴 -->
<!-- header 영역 -->
<header id="header" class="header sub ">
<!-- header top 영역 -->
<div class="header_top">
<div class="inner">
<ul class="menu_left">
<li><a href="#"><i class="hdTop_fav"></i>즐겨찾기추가</a></li>
<li><a href="#"><i class="hdTop_mypage"></i>마이페이지</a></li>
<li><a href="#"><i class="hdTop_center"></i>고객센터</a></li>
</ul>
<ul class="menu_right">
<li><a href="#">충전하기</a></li>
<li class="SortLine"><a href="#">요금안내</a></li>
<li class="SortLine"><a href="#">이용안내</a></li>
<li class="SortLine"><a href="#">1:1고객상담</a></li>
</ul>
</div>
</div><!-- header top 영역 -->
<!-- header body 영역 -->
<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="전체메뉴"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
</div>
</div>
<!-- search popup 영역 -->
<div class="pop_search">
<div class="inner">
<div class="area_search">
<select name="" id="">
<option value="">그림문자</option>
<option value="">단문문자</option>
<option value="">장문문자</option>
<option value="">GIF</option>
</select>
<input type="text" placeholder="문자샘플 검색하기">
<button><img src="/publish/images/search02.png" alt=""></button>
</div>
<div class="area_popular">
<p><i></i>인기검색어</p>
<ul class="popular_tag">
<li><a href="#">#정월대보름</a></li>
<li class="on"><a href="#">#추석</a></li>
<li><a href="#">#가을인사</a></li>
<li><a href="#">#좋은하루</a></li>
</ul>
</div>
<button class="btn_close" onclick="searchToggle();"><img src="/publish/images/btn_searchclose.png"
alt=""></button>
</div>
</div>
<!--// search popup 영역 -->
</div>
<!--// header body 영역 -->
<div id="login" class="login">
<div class="inner table">
<div class="login_left table_cell">
<div class="login_put">
<label for="id_text" class="label"></label>
<input type="text" placeholder="아이디를 입력해주세요" id="id_text" class="id_text" maxlength="30"
size="18">
<label for="password_text" class="label"></label>
<input type="password" placeholder="비밀번호를 입력해주세요" id="password_text" class="password_text"
maxlength="30" size="18">
<label for="login_button" class="label"></label>
<button type="submit" class="btnType btnType1" class="login_button">로그인</button>
</div>
<div class="login_save">
<input type="checkbox" id="save_id">
<label for="save_id">아이디 저장</label>
</div>
<div class="login_find">
<a href="#">아이디찾기 /</a>
<a href="#">비밀번호 찾기</a>
</div>
<div>
<button type="button" class="btnType btnType2">회원가입</button>
<button type="button" class="btnType btnType3">둘러보기</button>
</div>
</div>
<div class="login_right">
<span><i></i>이달의 이벤트</span>
<button type="button" class="btnType btnType4">바로가기</button>
</div>
</div>
</div>
<!--// login 영역 -->
</header>
<!--// header 영역 -->
<!-- login 영역 -->
<div data-include-path="/publish/layout/_header.html"></div>
<!-- content 영역 -->
<div id="container" class="cont sub">
<div class="inner">
@ -153,14 +55,14 @@
<li class="tab"><button type="button" onclick="location.href='/publish/kakao_allimtalk_send.html'">알림톡</button></li>
<li class="tab active"><button type="button" onclick="location.href='/publish/kakao_friendtalk_send.html'">친구톡</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/kakao_use_guide.html'">카카오톡 설정</button></li>
<li class="tab"><button type="button" onclick="TabType5(this,'4');">알림톡·친구톡 소개</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/kakao_allimtalk_intro.html'">알림톡 소개</button></li>
</ul>
<!--// tab button -->
<!-- 카카오톡 설정 - 알림톡 템플릿 등록/관리 - 내템플릿 -->
<div class="top_content kakaotalksend_cont current pay_tab_wrap">
<div class="heading">
<h2>친구톡 전송</h2>
<button type="button" class="button info">알림톡 사용방법</button>
<button type="button" class="button info" onclick="infoListPop('friendTalkSend','792','340');">사용안내</button>
</div>
<div class="send_general friend_talk_wrap kakao_wrap">
<div class="send_left">
@ -174,38 +76,51 @@
<th>채널ID</th>
<td>
<select name="" id="" class="select_gray_type">
<option value="">채널 ID 선택</option>
<option value="">@munjaon</option>
</select>
</td>
</tr>
<tr>
<th>템플릿명</th>
<td>
<div class="template_name_wrap">
<input type="text" placeholder="최대 50자, 템플릿 관리용">
<button type="button" class="btnType btnType8" onclick="window.open('/publish/popup_friendtalk_template_choice.html','_blank','width=930, height=780, top=100, left=100, fullscreen=no, menubar=no, status=no, toolbar=no, titlebar=yes, location=no, scrollbars=yes')">템플릿 불러오기</button>
</div>
</td>
</tr>
<tr>
<th>이미지 첨부</th>
<td>
<input type="radio" name="img_file_add" id="img_file_0" checked><label
for="img_file_0">첨부 안함</label>
<input type="radio" name="img_file_add" id="img_file_1"><label
for="img_file_1">이미지 첨부</label>
<input type="radio" name="img_file_add" id="img_file_2"><label
for="img_file_2">와이드 이미지 첨부</label>
<input type="radio" name="img_file_add" id="img_file_0" checked>
<label for="img_file_0">첨부 안함</label>
<input type="radio" name="img_file_add" id="img_file_1">
<label for="img_file_1">이미지 첨부</label>
<input type="radio" name="img_file_add" id="img_file_2">
<label for="img_file_2">와이드 이미지 첨부</label>
<div class="img_file_add_wrap basic_img_add_wrap">
<p class="info_title_text"><span class="c_e40000">*</span> 이미지 첨부 안내</p>
<ul class="info_text">
<li>- 권장사이즈 : 720px * 720px</li>
<li>- 권장사이즈 : 800px * 400px</li>
<li>- 제한사이즈 : 가로 500px 미만, 가로:세로 비율이 2:1 미만 또는 3:4 초과시 업로드 불가</li>
<li>- 파일형식 : jpg, png (최대 500kb)</li>
<li>- 이미지 첨부시 메시지 내용은 최대 400자까지 입력할 수 있습니다.</li>
<li>- 파일형식 : jpg, png (최대 5MB)</li>
<li>- 이미지 첨부 시 메시지 내용은 최대 400자, 버튼 5개까지 입력할 수 있습니다.</li>
</ul>
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<ul class="img_file_info_wrap">
<li>
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<div class="img_file_wrap">
<p class="file_name">image_testtest.jpg</p>
<button type="button" class="btn_del"
onclick="buttonTypeDel(this);"><img
src="/publish/images/btn_delete.png" alt=""></button>
<button type="button" class="btn_del" onclick="buttonTypeDel(this);"><img src="/publish/images/btn_delete.png" alt=""></button>
</div>
</li>
<li>
<p>이미지 클릭시 이동할 URL</p>
<input type="text" placeholder="http://" class="img_url">
<input type="text" placeholder="(선택사항) https://" class="img_url">
</li>
</ul>
</div>
@ -213,21 +128,20 @@
<p class="info_title_text"><span class="c_e40000">*</span> 와이드 이미지 첨부 안내</p>
<ul class="info_text">
<li>- 권장사이즈 : 800px * 600px</li>
<!-- <li>- 제한사이즈 : 가로 500px 미만, 가로:세로 비율이 2:1 미만 또는 3:4 초과시 업로드 불가</li> -->
<li>- 파일형식 : jpg, png (최대 2mb)</li>
<li>- 파일형식 : jpg, png (최대 5MB)</li>
<li>- 와이드 이미지 첨부시 메시지 내용은 최대 76자, 버튼 1개까지 입력할 수 있습니다.</li>
</ul>
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<ul class="img_file_info_wrap">
<li>
<p class="file_name">image_testtest.jpg</p>
<button type="button" class="btn_del"
onclick="buttonTypeDel(this);"><img
src="/publish/images/btn_delete.png" alt=""></button>
<button type="button" class="btnType btnType8 btn_img_upload">이미지 불러오기</button>
<div class="img_file_wrap">
<p class="file_name file_none">이미지 없음</p>
<button type="button" class="btn_del" onclick="buttonTypeDel(this);"><img src="/publish/images/btn_delete.png" alt=""></button>
</div>
</li>
<li>
<p>이미지 클릭시 이동할 URL</p>
<input type="text" placeholder="http://" class="img_url">
<input type="text" placeholder="(선택사항) https://" class="img_url">
</li>
</ul>
</div>
@ -236,16 +150,14 @@
<tr>
<th>광고포함 여부</th>
<td>
<input type="radio" name="ad_yn" id="ad_Y"><label for="ad_Y">광고성 정보
포함</label>
<input type="radio" name="ad_yn" id="ad_N"><label for="ad_N">포함 안함</label>
<input type="checkbox" name="ad_yn" id="ad_Y" style="margin:-4px 5px 0 0;" checked>
<label for="ad_Y">광고성 정보 포함</label>
</td>
</tr>
<tr>
<th>내용</th>
<td class="kakao_template_text">
<div class="put_left short">
<input type="text" class="template_name" placeholder="템플릿명을 입력해주세요. (최대 50자)">
<div class="put_text_wrap">
<div class="ad_txt">
<p>(광고) munjaon</p>
@ -253,7 +165,7 @@
<label for="textarea" class="label"></label>
<textarea id="textarea" class="put_text" placeholder="내용을 입력해주세요."></textarea>
<div class="text_length">
<div>
<div class="sub_ad_text">
<p>수신거부 : 홈 > 채널차단</p>
</div>
<div>
@ -264,8 +176,7 @@
</div>
<div class="put_right">
<div class="btn_popup_wrap">
<button type="button" class="btnType btnType7"
onclick="miniPopup(this)">특수문자</button>
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">특수문자</button>
<div class="send_miniPop spc_character">
<div class="tab_character">
<a href="#none" class="on">특수문자</a>
@ -492,14 +403,11 @@
</div>
</div>
<!-- //그외 -->
<button type="button" class="btn_close"
onclick="miniPopup(this)">닫기</button>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap convers_wrap">
<button type="button" class="btnType btnType7"
onclick="miniPopup(this)">특정문구 일괄변환<i
class="qmMark"></i></button>
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">특정문구 일괄변환<i class="qmMark"></i></button>
<div class="send_miniPop convers">
<div>
<div class="convers_top">
@ -514,13 +422,11 @@
<a href="#">#{4}</a>
</div>
</div>
<button type="button" class="btn_close"
onclick="miniPopup(this)">닫기</button>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap spc_wrap">
<button type="button" class="btnType btnType7"
onclick="miniPopup(this)">이모티콘</button>
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">이모티콘</button>
<div class="send_miniPop spc_character kakao_emoticon">
<div class="cnt_character">
<div class="box_character">
@ -642,15 +548,12 @@
<a href="#"><img src="/publish/images/kakao_emoticon/kakao_emoticon_1034.png" alt="" /></a>
</div>
</div>
<button type="button" class="btn_close"
onclick="miniPopup(this)">닫기</button>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap template_call_wrap">
<button type="button" class="btnType btnType8" onclick="window.open('/publish/popup_friendtalk_template_choice.html','_blank','width=930, height=780, top=100, left=100, fullscreen=no, menubar=no, status=no, toolbar=no, titlebar=yes, location=no, scrollbars=yes')">템플릿 불러오기</button>
</div>
<div class="send_btnWrap">
<button type="button" class="btnType btn_text_save">내용 저장하기</button>
<button type="button" class="btnType btnType9 btn_text_save">템플릿 저장</button>
<button type="button" class="btnType btnType9">초기화</button>
</div>
</div>
@ -661,18 +564,11 @@
<td class="template_button">
<select name="" id="" class="select_gray_type template_button_select">
<option value="button_type_0">버튼타입 선택</option>
<option value="button_type_1">배송조회</option>
<option value="button_type_2">웹링크</option>
<option value="button_type_3">앱링크</option>
<option value="button_type_4">봇키워드</option>
<option value="button_type_5">메시지전달</option>
<option value="button_type_6">상담톡전환</option>
<option value="button_type_7">챗봇전환</option>
</select>
<button type="button" class="btnType btnType6"
onclick="templateButtonAdd();">추가</button>
<p class="cf_text fwRg"><span class="c_e40000 fwBold">*</span> 버튼 타입중 <span class="c_e40000">봇키워드, 메시지전달</span>은 <span class="c_222">카카오톡 채널 관리자센터(https://center-pf.kakao.com)</span>에서 설정을 직접 한 후
이용하셔야 동작합니다. (최대 5개까지 등록가능)</p>
<button type="button" class="btnType btnType6" onclick="templateButtonAdd();">추가</button>
<!-- <p class="cf_text fwRg"><span class="c_e40000 fwBold">*</span> 버튼 타입중 <span class="c_e40000">봇키워드, 메시지전달</span>은 <span class="c_222">카카오톡 채널 관리자센터(https://center-pf.kakao.com)</span>에서 설정을 직접 한 후 이용하셔야 동작합니다. (최대 5개까지 등록가능)</p> -->
<div class="button_add_wrap">
<!-- <dl class="button_type_wrap template_channel_add">
<dt>채널추가</dt>
@ -733,11 +629,23 @@
<th>받는사람</th>
<td class="putText">
<div class="clearfix receipt_num">
<div class="receipt_num_top">
<div class="receipt_num_top" style="align-items:flex-start;">
<label for="" class="label">받는 번호입력</label>
<input type="text" placeholder="번호를 입력하세요" onfocus="this.placeholder=''" onblur="this.placeholder='번호를 입력하세요'" style="width:340px;">
<button type="button" class="btnType btnType6">번호추가</button>
<span><span class="vMiddle">*</span> 중복번호는 한번만 발송됩니다.</span>
<textarea name="callTo" id="callTo" cols="30" rows="10" class="receipt_num" placeholder="번호를 입력하세요" onfocus="this.placeholder=''" onblur="this.placeholder='번호를 입력하세요'" style="width:340px;height:66px;"></textarea>
<div class="btn_popup_wrap">
<button type="button" class="btnType btnType6 btn_add_number addCallToF">번호추가<i class="qmMark"></i></button>
<span style="display:block;margin:6px 0 0 0;"><span class="vMiddle">*</span> 중복번호는 한번만 추가됩니다.</span>
<div class="error_hover_cont send_hover_cont">
<p>줄바꿈(Enter) 기준으로 핸드폰 번호 입력이 가능합니다.</p>
<span>
(예시)<br>
010-1234-0001↵<br>
010-1235-0002↵<br>
01012350003↵<br>
01012350004↵<br>
</span>
</div>
</div>
</div>
<div class="receipt_num_midde">
<div class="listType list01">
@ -797,13 +705,6 @@
<div class="btn_popup_wrap">
<button type="button" data-tooltip="popup03" class="btnType btnType7 tab2">자주보내는 번호</button>
</div>
<div class="btn_popup_wrap check_validity_wrap">
<button type="button" class="btnType btnType7">오류 검사<i class="qmMark error_qm"></i></button>
<div class="error_hover_cont send_hover_cont">
<p>등록하신 전화번호(형식 등)가 정확하게 입력되었는지 오류여부를 자동으로 검사할 수 있습니다.</p>
<span>(예시) 010-1234-0001(O),<br> 010-123-0001(X)</span>
</div>
</div>
</div>
</div>
<div class="list_bottom clearfix">
@ -813,7 +714,6 @@
</div>
<div class="list_bottom_right">
<p>총 <span class="c_e40000">120</span>건 / 중복 <span class="c_002c9a">9</span>건</p>
<button type="button" class="address_reg2">주소록에 등록</button>
</div>
</div>
</div>
@ -836,8 +736,7 @@
</div>
<div class="pay_type clearfix">
<div>
<input type="radio" id="radio_bill_1" name="radio_bill"
checked="checked">
<input type="radio" id="radio_bill_1" name="radio_bill" checked="checked">
<label for="radio_bill_1">보유잔액</label>
<label for="userMoney" class="label">보유잔액</label>
<input type="text" id="userMoney" name="userMoney" value="0" readonly="">
@ -851,7 +750,8 @@
</tr>
<tr>
<th colspan="2" class="replace_send_th">
<div class="title_th"><p>대체문자</p>
<div class="title_th">
<p>대체문자</p>
<input type="checkbox" id="send_fail_check" class="send_fail_check"><label for="send_fail_check">친구톡 전송 실패 시 문자 전송</label>
</div>
<div class="replace_send_wrap">
@ -870,15 +770,6 @@
<button type="button" class="btnType btnType6">번호등록</button>
</td>
</tr>
<tr>
<th>제목</th>
<td>
<input id="title_y" type="radio" name="title_yn">
<label for="title_y">사용</label>
<input id="title_n" type="radio" name="title_yn" checked="checked">
<label for="title_n">사용안함</label>
</td>
</tr>
<tr>
<th>내용</th>
<td class="putText">
@ -896,274 +787,14 @@
</span>
<span class="c_002c9a fwMd" id="limitLeng">90</span>byte
</p>
<span
class="msg_com msg_short">단문</span>
<span class="msg_com msg_short">단문</span>
</div>
</div>
</div>
<div class="put_right">
<div class="btn_popup_wrap spc_wrap">
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">특수문자</button>
<div class="send_miniPop spc_character">
<div class="tab_character">
<a href="#none" class="on">특수문자</a>
<a href="#none">웃음</a>
<a href="#none">슬픔</a>
<a href="#none">분노</a>
<a href="#none">사랑</a>
<a href="#none">그외</a>
</div>
<!-- 특수문자 -->
<div class="cnt_character on">
<div class="box_character">
<a href="#">※</a>
<a href="#">☆</a>
<a href="#">★</a>
<a href="#">○</a>
<a href="#">●</a>
<a href="#">◎</a>
<a href="#">◇</a>
<a href="#">◆</a>
<a href="#">□</a>
<a href="#">■</a>
<a href="#">△</a>
<a href="#">▲</a>
<a href="#">▽</a>
<a href="#">▼</a>
<a href="#">→</a>
<a href="#">←</a>
<a href="#">↑</a>
<a href="#">↓</a>
<a href="#">↔</a>
<a href="#">〓</a>
<a href="#">◁</a>
<a href="#">♪</a>
<a href="#">◀</a>
<a href="#">▷</a>
<a href="#">▶</a>
<a href="#">♤</a>
<a href="#">♠</a>
<a href="#">♡</a>
<a href="#">♥</a>
<a href="#">♧</a>
<a href="#">♣</a>
<a href="#">⊙</a>
<a href="#">◈</a>
<a href="#">▣</a>
<a href="#">◐</a>
<a href="#">◑</a>
<a href="#">▒</a>
<a href="#">▦</a>
<a href="#">♨</a>
<a href="#">☏</a>
<a href="#">☎</a>
<a href="#">☞</a>
<a href="#">☜</a>
<a href="#">㈜</a>
<a href="#">™</a>
<a href="#">℡</a>
<a href="#">ㆀ</a>
<a href="#">ε</a>
<a href="#">『</a>
<a href="#">』</a>
<a href="#">ⓛ</a>
<a href="#">∏</a>
<a href="#">ご</a>
<a href="#">♂</a>
<a href="#">↗</a>
<a href="#">↙</a>
<a href="#">↖</a>
<a href="#">↘</a>
<a href="#">ψ</a>
</div>
</div>
<!-- //특수문자 -->
<!-- 웃음 -->
<div
class="cnt_character emt_character">
<div class="box_character">
<a href="#">⌒⌒</a>
<a href="#">^_^</a>
<a href="#">^0^</a>
<a href="#">s(￣▽￣)/</a>
<a href="#">(/^^)/</a>
<a href="#">^o^~♬</a>
<a href="#">^.~</a>
<a href="#">^-^b</a>
<a href="#">^▽^</a>
<a href="#">^ε^</a>
<a href="#">(^^)γ</a>
<a href="#">(~^^)~</a>
<a href="#">☆(~.^)/</a>
<a href="#">(*^o^*)</a>
<a href="#">n_n</a>
<a href="#">↖(^▽^)↗</a>
<a href="#">(￣∇￣)</a>
<a href="#">(*^.^)♂</a>
<a href="#">*^^*</a>
<a href="#">ㅎ.ㅎ</a>
<a href="#">=^.^=</a>
<a href="#">^▽^</a>
<a href="#">~_~</a>
<a href="#">(=^▽^)/♪</a>
</div>
</div>
<!-- //웃음 -->
<!-- 슬픔 -->
<div
class="cnt_character emt_character">
<div class="box_character">
<a href="#">(づ_T)</a>
<a href="#">(ㅠ.ㅠ)</a>
<a href="#">(#_-)</a>
<a href="#">o(T^T)o</a>
<a href="#">ㅠ.ㅠ</a>
<a href="#">(-_-メ)</a>
<a href="#">Y.Y</a>
<a href="#">TmT</a>
<a href="#">ご.ご</a>
<a href="#">(=_=;)</a>
<a href="#">⊇.⊆</a>
<a href="#">(o_Φ)</a>
<a href="#">∋.∈</a>
<a href="#">(___)_</a>
<a href="#">(-.￥)</a>
<a href="#">@_O</a>
<a href="#">●⊙</a>
<a href="#">(♨_♨)</a>
<a href="#">(X_X)</a>
<a href="#">Θ_Θ</a>
<a href="#">(∏.∏)</a>
<a href="#">(づ_ど)</a>
<a href="#">(￣^￣)</a>
</div>
</div>
<!-- //슬픔 -->
<!-- 분노 -->
<div
class="cnt_character emt_character">
<div class="box_character">
<a href="#">Θ_Θ</a>
<a href="#">=-_-a</a>
<a href="#">('o')</a>
<a href="#">(｀へ´)</a>
<a href="#">(-ヘㅡメ)凸</a>
<a href="#">⊙⊙ㆀ</a>
<a href="#">⊙.⊙</a>
<a href="#">ㅡㅡ+</a>
<a href="#">(`o´)y</a>
<a href="#">づºДº)つ</a>
<a href="#">O_O</a>
<a href="#">(@.@)</a>
<a href="#">★.★</a>
<a href="#">(;￢_￢)</a>
<a href="#">┏(;-_-)┛</a>
<a href="#">┏(-_-メ)┓</a>
<a href="#">(>&#60;ㆀ)&#47;</a>
<a href="#">--メ凸</a>
<a href="#">(`_)乂(_′)</a>
<a href="#">(-_-)c+_=)</a>
</div>
</div>
<!-- //분노 -->
<!-- 사랑 -->
<div
class="cnt_character emt_character">
<div class="box_character">
<a href="#">♥.♥</a>
<a href="#">^o^~♬</a>
<a href="#">(*^}{^*)</a>
<a href="#">ⓛⓞⓥⓔ</a>
<a href="#">(*_*)</a>
<a href="#">(♡.♡)</a>
<a href="#">ε♡₃ε♥</a>
<a href="#">(*..)(..*)</a>
<a href="#">(~.^)s</a>
<a href="#">☞♡☜</a>
<a href="#">*♥o♥*</a>
<a href="#">(/^o^)/♡</a>
<a href="#">@-m-m--</a>
<a href="#">=>>------▷♡</a>
<a href="#">(*^^)σ(^_^)</a>
<a href="#">(*^-^)♡(^o^*)</a>
<a href="#">(づ^.^)づ~♡</a>
<a href="#">＼(*^▽^*)ノ</a>
<a href="#">*⌒З^)^.⌒*)</a>
<a href="#">(づ￣³￣)づ~</a>
<a href="#">(づ￣³￣)づ</a>
<a href="#">(^*^)kiss</a>
<a href="#">(*'-⌒*)ⓥ</a>
<a href="#">s(￣▽￣)/</a>
</div>
</div>
<!-- //사랑 -->
<!-- 그외 -->
<div
class="cnt_character emt_character emt_etc ">
<div class="box_character">
<a href="#">&#60;:3)--</a>
<a href="#">(^(oo)^)</a>
<a href="#">(:::[</a>
<a href="#">]:::)</a>
<a href="#">[(￣.￣)]zZ</a>
<a href="#">(``)(``)</a>
<a href="#">(T(oo)T)</a>
<a href="#">(^.^)=O)#.#)</a>
<a href="#">?‥…─━★</a>
<a href="#">(__)zzz</a>
<a href="#">(=ㅅ)=333</a>
<a href="#">&#60;(>.<ㆀ)></a>
<a href="#">>(/////)&#60;</a>
<a href="#">((ど(</a>
<a href="#">^0^</a>
<a href="#">)つ))</a>
<a href="#">■■■■■□90%</a>
<a href="#">(￣_￣>-(^▽^;)</a>
<a href="#">∑⊙)++333=◀</a>
<a href="#">(ノ^_^)ノ~~⑩</a>
<a href="#">(^▽^)/＼(^_^)</a>
<a href="#">(*.*)@==(`.`)</a>
<a href="#">(っㅡㅡ)つ━●</a>
<a href="#">(``)(</a>
<a href="#">:)(..)(:</a>
<a href="#">(``)</a>
</div>
</div>
<!-- //그외 -->
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<div class="btn_popup_wrap convers_wrap">
<button type="button" class="btnType btnType7" onclick="miniPopup(this)">특정문구 일괄변환<i class="qmMark"></i></button>
<div class="send_miniPop convers">
<div>
<div class="convers_top">
<span>특정문구 일괄변환이란?</span>
<p>주소록, 엑셀에 입력된 내용을 이용해 수신자마다 다른
내용의 메시지를 발송하는 기능</p>
</div>
<div class="convers_middle"><a
href="#">#{이름}</a></div>
<div class="convers_bottom">
<a href="#">#{1}</a>
<a href="#">#{2}</a>
<a href="#">#{3}</a>
<a href="#">#{4}</a>
</div>
</div>
<button type="button" class="btn_close" onclick="miniPopup(this)">닫기</button>
</div>
</div>
<button type="button" class="btnType btnType7">내문자함</button>
<button type="button" class="btnType btnType8" onclick="showPotoediter();">이미지 불러오기</button>
<button type="button" class="btnType btnType7" onclick="javascript:fn_errorChk(); return false;">오류검사<i class="qmMark"></i></button>
<div class="send_btnWrap">
<button type="button" class="btnType btnType9">문자저장</button>
<button type="button" class="btnType btnType9">초기화</button>
<button type="button" class="btnType btnType9" style="width:100%;">초기화</button>
</div>
</div>
@ -1182,13 +813,12 @@
<div class="send_right">
<div class="phone">
<div class="phoneIn">
<p class="prev_p"><img src="/publish/images/content/kakao_prev_icon.png"
alt="">@munjaon</p>
<p class="prev_p"><img src="/publish/images/content/kakao_prev_icon.png" alt="">@munjaon</p>
<!-- 텍스트 미리보기 -->
<div class="text_preview">
<p class="friend_talk_title"><span>(광고)</span> munjaon</p>
<div class="allimtalk_content">
<div class="kakao_image"><img src="/publish/images/content/friend_talk_img.png" alt=""></div>
<div class="kakao_image"><img src="/publish/images/content/kakao_img_basic.jpg" alt="" style="display:none;"></div>
<p class="template_text">홍길동 고객님 안녕하세요.
문자온입니다.
문자온에서는 재결제 고객님들께 다양한 이벤트를 준비하였으니, 방문하셔서 혜택 놓치지 마세요.</p>
@ -1199,6 +829,13 @@
<!-- //텍스트 미리보기 -->
</div>
<p class="addText">※ 단말기 설정에 따라 다르게 보일 수 있습니다<p>
<div class="preview_util">
<button type="button" id="btnFirst" disabled="disabled"><img src="/publish/images/content/page_first.png"></button>
<button type="button" id="btnPrev" data-index="0" disabled="disabled"><img src="/publish/images/content/page_prev.png"></button>
<p>미리보기</p>
<button type="button" id="btnNext" data-index="1" disabled="disabled"><img src="/publish/images/content/page_next.png"></button>
<button type="button" id="btnLast" disabled="disabled"><img src="/publish/images/content/page_last.png"></button>
</div>
</div>
<div class="phone_bottom">

221
src/main/webapp/publish/layout/_header.html
View File

@ -71,14 +71,14 @@
<div class="inner">
<ul class="menu_left">
<li><a href="#"><i class="hdTop_fav"></i>즐겨찾기추가</a></li>
<li><a href="#"><i class="hdTop_mypage"></i>마이페이지</a></li>
<li><a href="#"><i class="hdTop_center"></i>고객센터</a></li>
<li><a href="/publish/member_info_change_company.html"><i class="hdTop_mypage"></i>마이페이지</a></li>
<li><a href="#"><i class="hdTop_center"></i>1:1 문의</a></li>
</ul>
<ul class="menu_right">
<li><a href="#">충전하기</a></li>
<li class="SortLine"><a href="#">요금안내</a></li>
<li class="SortLine"><a href="#">이용안내</a></li>
<li class="SortLine"><a href="#">1:1 문의</a></li>
<li class="SortLine"><a href="#">고객센터</a></li>
<li class="SortLine"><a href="#">불편신고</a></li>
</ul>
</div>
@ -103,7 +103,7 @@
<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="전체메뉴"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
<button type="button" title="전체메뉴" onclick="sitemapToggle(this);"><img src="/publish/images/all_menu.png" alt="전체메뉴 열기"></button>
</div>
</div>
@ -135,10 +135,144 @@
</div>
<!--// search popup 영역 -->
<!-- 사이트맵 -->
<div class="layer_sitemap">
<div class="inner">
<ul class="menu">
<li>
<dl>
<dt><a href="/web/mjon/msgdata/selectMsgDataView.do">문자전송</a></dt>
<dd>
<ul>
<li><a href="/web/mjon/msgdata/selectMsgDataView.do">단문·장문·그림문자</a></li>
<li><a href="/web/mjon/msgdata/excel/selectMsgExcelDataView.do">대량문자</a></li>
<li><a href="/web/api/intrdView.do">문자연동(API)</a></li>
</ul>
</dd>
</dl>
<dl>
<dt><a href="/web/mjon/alimtalk/kakaoAlimtalkMsgDataView.do">카톡전송</a></dt>
<dd>
<ul>
<li><a href="/web/mjon/alimtalk/kakaoAlimtalkMsgDataView.do">알림톡</a></li>
<li><a href="/web/mjon/kakao/stepinfo/selectKaKaoStepInfo.do">카카오톡 설정</a></li>
<li><a href="/web/mjon/kakao/alimtalk/kakaoAlimtalkIntrdView.do">알림톡 소개</a></li>
</ul>
</dd>
</dl>
</li>
<li>
<dl>
<dt><a href="/web/mjon/custom/selectMsgCustomView.do">맞춤제작</a></dt>
<dd>
<ul>
<li><a href="/web/mjon/custom/selectMsgCustomView.do">맞춤제작 샘플</a></li>
<li><a href="/web/mjon/custom/selectMsgCustomView.do?tap=2">제작방법 및 이용안내</a></li>
<li><a href="/web/mjon/custom/selectMsgCustomView.do?tap=3">내보관함</a></li>
</ul>
</dd>
</dl>
<dl>
<dt><a href="/web/info/mjonInfo.do">문자온소개</a></dt>
<dd>
<ul>
<li><a href="/web/info/mjonInfo.do">서비스 소개</a></li>
<li><a href="/web/info/mjonFunc.do">주요기능</a></li>
<li><a href="/web/mjon/msgdata/selectBestMsgDataView.do">베스트문자샘플</a></li>
</ul>
</dd>
</dl>
<dl>
<dt><a href="/web/info/mjonInfo.do">팩스전송</a></dt>
<dd>
<ul>
<li><a href="/web/mjon/fax/faxDataView.do">팩스전송</a></li>
<li><a href="/web/mjon/fax/faxSendList.do">팩스전송내역</a></li>
</ul>
</dd>
</dl>
</li>
<li>
<dl>
<dt><a href="/web/mjon/addr/selectAddrList.do">주소록관리</a></dt>
<dd>
<ul>
<li><a href="/web/mjon/addr/selectAddrList.do">주소록관리</a></li>
<li><a href="/web/mjon/addrBlock/selectBlockList.do">수신거부</a></li>
<li><a href="/web/mjon/addr/addrMobGuide.do">폰주소록 등록</a></li>
<li><a href="/web/mjon/addragency/selectAddrAgencyList.do">주소록 입력 대행(무료)</a></li>
</ul>
</dd>
</dl>
</li>
<li>
<dl>
<dt><a href="/web/mjon/msgsent/selectMsgSentView.do">발송결과</a></dt>
<dd>
<ul>
<li><a href="/web/mjon/msgsent/selectMsgSentView.do">발송결과</a></li>
</ul>
</dd>
</dl>
</li>
<li>
<dl>
<dt><a href="/publish/member_info_change_company.html">마이페이지</a></dt>
<dd>
<ul>
<li><a href="/web/user/mberInfoChange.do">회원정보 변경</a></li>
<!-- 개인회원 일때만 노출되는 영역 -->
<li><a href="/web/user/passwordChange.do">비밀번호 변경</a></li>
<li><a href="/web/user/sendNumberManage.do">발신번호 관리</a></li>
<!-- <li><a href="/web/user/notifyManage.do">알림설정</a></li> -->
</ul>
</dd>
</dl>
</li>
<li>
<dl>
<dt><a href="/web/member/pay/PayList.do">결제관리</a></dt>
<dd>
<ul>
<li><a href="/web/pay/PayGuide.do">요금안내/견적내기</a></li>
<li><a href="/web/member/pay/PayView.do">결제하기</a></li>
<li><a href="/web/member/pay/PayList.do">요금 결제내역</a></li>
<li><a href="/web/member/pay/PayUserSWList.do">요금 사용내역</a></li>
<!-- 현금영수증 자동발행 주석 -->
<li><a href="/web/member/pay/BillPub.do">세금계산서 발행</a></li>
</ul>
</dd>
</dl>
</li>
<li>
<dl>
<dt><a href="/web/cop/bbs/NoticeList.do">고객센터</a></dt>
<dd>
<ul>
<li><a href="/web/cop/bbs/NoticeList.do">공지사항</a></li>
<li><a href="/web/cop/bbs/TermsList.do?menuNm=02&amp;termsMastNo=2023">이용약관</a></li>
<li><a href="/web/cop/bbs/FaqList.do">자주하는 질문</a></li>
<li><a href="/web/cop/bbs/QnaList.do">1:1 문의</a></li>
<li><a href="/web/cop/bbs/SuggestList.do">불편신고</a></li>
<li><a href="/web/cop/bbs/EventList.do">이벤트</a></li>
<li><a href="javascript:void(0);" onclick="remotePop('https://939.co.kr/munjaon/');">원격지원</a></li>
</ul>
</dd>
</dl>
</li>
</ul>
</div>
</div>
<!-- //사이트맵 -->
</div>
<!--// header body 영역 -->
<div id="login" class="login">
<!-- <div id="login" class="login">
<div class="inner">
<div class="login_left">
<div class="login_put">
@ -167,16 +301,16 @@
<button type="button" class="btnType btnType2" onclick="location.href='/web/cop/bbs/EventList.do'">GO</button>
</div>
</div>
</div>
</div> -->
<!--// login 영역 -->
<!-- 로그인 후 영역 -->
<!-- <div id="login" class="login2">
<div id="login" class="login2">
<div class="inner">
<div class="login_left">
<div class="login_info">
<i><img src="/publish/images/mypageIcon2.png" id="commonHeaderGradeIcon"></i>
<div class="login2_name">
<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">
@ -185,8 +319,8 @@
</div>
<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 btnType2" onclick="location.href='/web/uat/uia/actionLogout.do'">로그아웃</button>
<!-- <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>
<div class="security_box green_box">
<a href="/web/user/mberSecureLogin.do" class="title">보안로그인</a>
@ -197,28 +331,81 @@
<div class="check_money">
<div class="holdingsum_box">
<i></i>
<p>보유잔액
<span class="fwMd" id="hdUserMoney">0</span>원</p>
<div class="user_money_wrap">
보유잔액
<div class="hover_content_wrap">
<i class="qmMark">?</i>
<div class="hover_content">
<p class="hover_content_title">
<img src="/publish/images/content/icon_mypage_message.png" alt=""> 나의단가 <span>(발송가능 건수)</span>
</p>
<ul class="send_available_number">
<li>
<p class="title">· 단문</p>
<p class="number"><span class="c_002c9a fwBold">18</span>원(345건)</p>
</li>
<li>
<p class="title">· 장문</p>
<p class="number"><span class="c_002c9a fwBold">50</span>원(99건)</p>
</li>
<li>
<p class="title">· 그림(1장)</p>
<p class="number"><span class="c_002c9a fwBold">90</span>원(8건)</p>
</li>
<li>
<p class="title">· 그림(2장)</p>
<p class="number"><span class="c_002c9a fwBold">110</span>원(3건)</p>
</li>
<li>
<p class="title">· 그림(3장)</p>
<p class="number"><span class="c_002c9a fwBold">130</span>원(1건)</p>
</li>
<li>
<p class="title">· 알림톡</p>
<p class="number"><span class="c_002c9a fwBold">6.9</span>원(983건)</p>
</li>
<li>
<p class="title">· 팩스</p>
<p class="number"><span class="c_002c9a fwBold">58</span>원(345매)</p>
</li>
</ul>
<p class="event_term">이벤트 적용중 <span class="fwBold">D-60</span></p>
</div>
</div>
<span class="fwMd" id="hdUserMoney">999,999,999.99</span>원
</div>
</div>
<button type="button" class="btnType btnType3">충전</button>
<div class="account_box">
<!-- <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">0</span>원</p>
<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>
</div> -->
</div>
<!-- //로그인 후 영역 -->
</header>
<!--// header 영역 -->

23
src/main/webapp/publish/member_info_change_company.html
View File

@ -53,7 +53,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>
@ -123,7 +122,7 @@
<div class="input_list_item emailWrap">
<div>
<div class="input_left"><span class="essential">*</span>이메일</div>
<div class="input_left">이메일</div>
<div class="input_right">
<div class="email">
<label for="" class="label">이메일 주소 앞자리</label>
@ -146,6 +145,26 @@
</div>
</div>
</div>
<!-- <div class="input_list_item send_agree">
<div class="input_left">알림 설정</div>
<div class="input_right">
<div>
<div class="checkbox_wrap">
<input type="checkbox" id="allim_1" title="뉴스레터 동의" class="joinCheckbox type3">
<label for="allim_1">뉴스레터</label>
</div>
</div>
<div>
<div class="checkbox_wrap">
<input type="checkbox" id="allim_2" title="안내문자 동의" class="joinCheckbox type3">
<label for="allim_2">안내문자</label>
</div>
</div>
<div class="list_alert reqest_text">
<span style="line-height:1.2;">뉴스레터 및 각종 안내문자의<br>수신여부를 설정할 수 있습니다.</span>
</div>
</div>
</div> -->
<div class="input_list_item send_agree">
<div class="input_left">마케팅 수신 동의</div>
<div class="input_right">

1
src/main/webapp/publish/member_info_change_passwordCheck.html
View File

@ -41,7 +41,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/member_info_change_person.html
View File

@ -42,7 +42,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

284
src/main/webapp/publish/mypage2.html
View File

@ -25,6 +25,7 @@
<script src="/publish/js/popupLayer.js"></script>
</head>
<body>
<div class="mask"></div>
<div data-include-path="/publish/layout/_header.html"></div>
@ -78,8 +79,10 @@
<p class="reqTxt4">
- 외부로부터 고객님의 정보를 안전하게 보호하기 위해 비밀번호를 다시 확인합니다.<br>
- 비밀번호를 5회 이상 틀릴 경우 자동 로그아웃 됩니다.(영문, 숫자, 특수기호 조합 8자 이상)</p>
</div><!--// 기본정보 -->
</div><!--// 비밀번호 확인 -->
</div>
<!--// 기본정보 -->
</div>
<!--// 비밀번호 확인 -->
<!-- 개인회원 정보변경 -->
<div class="heading">
<h2>개인회원 정보변경</h2>
@ -138,6 +141,26 @@
</div>
</div>
</div>
<!-- <div class="input_list_item send_agree">
<div class="input_left">알림 설정</div>
<div class="input_right">
<div>
<div class="checkbox_wrap">
<input type="checkbox" id="allim_1" title="뉴스레터 동의" class="joinCheckbox type3">
<label for="allim_1">뉴스레터</label>
</div>
</div>
<div>
<div class="checkbox_wrap">
<input type="checkbox" id="allim_2" title="안내문자 동의" class="joinCheckbox type3">
<label for="allim_2">안내문자</label>
</div>
</div>
<div class="list_alert reqest_text">
<span style="line-height:1.2;">뉴스레터 및 각종 안내문자의<br>수신여부를 설정할 수 있습니다.</span>
</div>
</div>
</div> -->
<div class="input_list_item send_agree">
<div class="input_left">마케팅 수신 동의</div>
<div class="input_right">
@ -169,256 +192,23 @@
<button type="button" class="mem_btn4">기업회원 전환</button>
<button type="button" class="mem_btn3">변경</button>
</div>
</div><!--// 회원정보 변경 -->
</div>
<!--// 회원정보 변경 -->
</div>
<!-- 기업회원 정보변경 -->
<div class="heading">
<h2>기업회원 정보변경</h2>
</div>
<div class="mem_cont_in">
<div class="text_top">
<p>회원님의 정보를 <span class="c_002c9a">확인</span>및 <span class="c_002c9a">변경</span> 하실 수 있습니다.</p>
</div>
<div class="input_wrap">
<!-- 기본정보 -->
<div class="input_list">
<p class="list_title">기본정보</p>
<div class="input_list_item colorW">
<div class="input_left">아이디</div>
<div class="input_right">
<label for="" class="label">아이디</label>
<input type="text" class="list_inputType1" placeholder="hong5678" readonly>
</div>
</div>
<div class="input_list_item colorW">
<div class="input_left">이름</div>
<div class="input_right">
<label for="" class="label">이름</label>
<input type="text" class="list_inputType1" placeholder="홍길동" readonly>
</div>
</div>
<div class="input_list_item colorW">
<div class="input_left">휴대전화</div>
<div class="input_right">
<label for="" class="label">휴대전화</label>
<input type="text" class="list_inputType1" placeholder="010-1234-5678" readonly>
<div class="list_btn_wrap">
<span><span class="vMiddle">*</span>본인 명의의 휴대폰번호로만 변경가능</span>
<button type="button">번호 변경</button>
</div>
</div>
</div>
<div class="input_list_item emailWrap">
<div>
<div class="input_left">이메일</div>
<div class="input_right">
<div class="email">
<label for="" class="label">이메일 주소 앞자리</label>
<input type="text" class="list_inputType1" placeholder="hong1234" readonly>
<span>@</span>
<label for="" class="label">이메일 주소 뒷자리</label>
<input type="text" class="list_inputType1" placeholder="gmail.com" readonly>
</div>
<div class="email_select">
<label for="" class="label">이메일 선택</label>
<select class="list_selType1">
<option>직접입력</option>
<option>네이버</option>
<option>네이트</option>
<option>한메일(다음)</option>
<option>지메일</option>
</select>
</div>
</div>
</div>
</div>
<div class="input_list_item send_agree">
<div class="input_left">마케팅 수신 동의</div>
<div class="input_right">
<div>
<div class="checkbox_wrap">
<input type="checkbox" id="agree1_1" title="회원가입 전체약관에 동의" class="joinCheckbox type3">
<label for="agree1_1">휴대폰</label>
</div>
</div>
</>
<div>
<div class="checkbox_wrap">
<input type="checkbox" id="agree1_3" title="회원가입 전체약관에 동의" class="joinCheckbox type3">
<label for="agree1_3">이메일</label>
</div>
</div>
<div class="list_alert reqest_text">
<span style="line-height:1.2;">수신동의 시 각종 혜택 및<br> 이벤트 정보를 받아보실 수 있습니다.</span>
</div>
</div>
</div>
</div><!--// 기본정보 -->
<!-- 기업정보 -->
<div class="input_list">
<p class="list_title">기업정보</p>
<div class="input_list_item">
<div class="input_left">기업유형</div>
<div class="input_right">
<input id="radio1" type="radio"name="sel_type" checked="checked">
<label for="radio1">개인</label>
<input id="radio2" type="radio" name="sel_type">
<label for="radio2">영리법인</label>
<input id="radio3" type="radio" name="sel_type">
<label for="radio3">비영리법인</label>
<input id="radio4" type="radio" name="sel_type">
<label for="radio4">기타</label>
</div>
</div>
<div class="input_list_item">
<div class="input_left">회사명</div>
<div class="input_right">
<label for="" class="label">회사명 입력</label>
<input type="text" class="list_inputType1" placeholder="주식회사 수빈인터네셔널" readonly>
</div>
</div>
<div class="input_list_item">
<div class="input_left">사업자등록번호</div>
<div class="input_right">
<label for="" class="label">사업자등록번호 입력</label>
<input type="text" class="list_inputType1" placeholder="653-12-34567" readonly>
<div class="list_btn_wrap">
<button type="button">사업자등록번호 확인</button>
</div>
</div>
</div>
<div class="input_list_item">
<div class="input_left">사업자등록증 첨부</div>
<div class="input_right">
<label for="" class="label">사업자등록증 첨부</label>
<input type="text" class="list_inputType1" placeholder="주식회사 수빈인터네셔널 사업자.jpg" readonly>
<div class="list_btn_wrap">
<span>사업자등록증 첨부(5MB 이내)</span>
<button type="button">파일첨부</button>
</div>
</div>
</div>
<div class="input_list_item bis_status">
<div class="input_left">업태/종목</div>
<div class="input_right">
<label for="" class="label">업태 입력</label>
<input type="text" class="list_inputType1" placeholder="F.건설업" readonly>
<span>/</span>
<label for="" class="label">종목 입력</label>
<input type="text" class="list_inputType1" placeholder="소매업" readonly>
</div>
</div>
<div class="input_list_item">
<div class="input_left">사업장 주소</div>
<div class="input_right">
<label for="" class="label">사업장 주소 입력</label>
<input type="text" class="list_inputType1" placeholder="경기도 남양주시 다산중앙로 1234" readonly>
<div class="list_btn_wrap">
<button type="button">우편번호 찾기</button>
</div>
</div>
</div>
<div class="input_list_item">
<div>
<label for="" class="label">사업장 주소 상세 입력</label>
<input type="text" class="list_inputType1 colorLight" size="100" placeholder="상세주소를 입력해주세요(선택)" onfocus="this.placeholder = ''" onblur="this.placeholder='상세주소를 입력해주세요(선택)'">
</div>
</div>
</div><!--// 기업정보 -->
<!-- 계산서정보 -->
<div class="input_list listType2">
<p class="list_title">계산서정보</p>
<div class="input_list_item">
<div class="input_left">계산서 자동 발행</div>
<div class="input_right">
<input id="radio5" type="radio"name="publish" checked="checked">
<label for="radio5">자동발행</label>
<input id="radio6" type="radio" name="publish">
<label for="radio6">발행하지 않음</label>
</div>
</div>
<div class="invoice">
<div class="invoice_wrap">
<div class="input_list_item2">
<div class="input_left" style="width: 150px;">계산서 수신이메일</div>
<div class="input_right">
<div class="email">
<label for="" class="label">이메일 주소 앞자리</label>
<input type="text" class="list_inputType1" placeholder="sbitnsasa1234" readonly>
<span>@</span>
<label for="" class="label">이메일 주소 뒷자리</label>
<input type="text" class="list_inputType1" placeholder="gmail.com" readonly>
<label for="" class="label">이메일 선택</label>
<select class="list_selType1">
<option>직접입력</option>
<option>네이버</option>
<option>네이트</option>
<option>한메일(다음)</option>
<option>지메일</option>
</select>
</div>
</div>
</div>
<div class="input_list_item2">
<div class="input_half">
<div>담당자</div>
<div>
<label for="" class="label">담당자 입력</label>
<input type="text" class="list_inputType1" placeholder="홍길동" readonly>
</div>
</div>
<div class="input_half">
<div>직위</div>
<div>
<label for="" class="label">직위 입력</label>
<input type="text" class="list_inputType1" placeholder="주임" readonly>
</div>
</div>
</div>
<div class="input_list_item2 number">
<div class="input_left">휴대폰</div>
<div class="input_right">
<label for="" class="label">휴대폰 번호 입력</label>
<input type="text" class="list_inputType1" placeholder="010" readonly>
<span>-</span>
<label for="" class="label">휴대폰 번호 입력</label>
<input type="text" class="list_inputType1" placeholder="1234" readonly>
<span>-</span>
<label for="" class="label">휴대폰 번호 입력</label>
<input type="text" class="list_inputType1" placeholder="5678" readonly>
</div>
</div>
<div class="input_list_item2 number">
<div class="input_left">일반전화</div>
<div class="input_right">
<label for="" class="label">일반전화 번호 입력</label>
<input type="text" class="list_inputType1" placeholder="070" readonly>
<span>-</span>
<label for="" class="label">일반전화 번호 입력</label>
<input type="text" class="list_inputType1" placeholder="5858" readonly>
<span>-</span>
<label for="" class="label">일반전화 번호 입력</label>
<input type="text" class="list_inputType1" placeholder="1212" readonly>
</div>
</div>
</div>
</div>
<div class="mem_btnWrap2">
<button type="button" class="mem_btn3">변경</button>
<button type="button" class="mem_btn2">취소</button>
</div>
</div>
</div><!--// 계산서정보 -->
</div>
</div>
</div><!--// 마이페이지 - 회원정보 변경 -->
</div><!--// send top -->
</div>
</div><!--// content 영역 -->
</div>
<!--// 마이페이지 - 회원정보 변경 -->
</div>
<!--// send top -->
</div>
<!--// content 영역 -->
<!-- footer 영역 -->
<!-- footer -->
<div data-include-path="/publish/layout/_footer.html"></div>
<!--// footer 영역 -->
</body></html>
</body>
</html>

1
src/main/webapp/publish/mypage3.html
View File

@ -41,7 +41,6 @@
<li class="tab active"><button type="button" onclick="TabType5(this,'2');">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage3_return.html
View File

@ -41,7 +41,6 @@
<li class="tab active"><button type="button" onclick="TabType5(this,'2');">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage4.html
View File

@ -40,7 +40,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab active"><button type="button" onclick="TabType5(this,'4');">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage5.html
View File

@ -103,7 +103,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab active"><button type="button" onclick="TabType5(this,'5');">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage5_2.html
View File

@ -315,7 +315,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab active"><button type="button" onclick="TabType5(this,'5');">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage7.html
View File

@ -40,7 +40,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab active"><button type="button" onclick="TabType5(this,'7');">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage8.html
View File

@ -41,7 +41,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage6.html'">알림설정</button></li>
<li class="tab active"><button type="button" onclick="TabType5(this,'7');">회원탈퇴</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/security_login.html'">보안로그인</button></li>
</ul>

1
src/main/webapp/publish/mypage_security_login.html
View File

@ -64,7 +64,6 @@
<li class="tab"><button type="button" onclick="location.href='/publish/mypage3.html'">기업회원 전환</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage4.html'">비밀번호 변경</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage5.html'">발신번호 관리</button></li>
<li class="tab"><button type="button" onclick="TabType5(this,'6');">알림설정</button></li>
<li class="tab"><button type="button" onclick="location.href='/publish/mypage7.html'">회원탈퇴</button></li>
<li class="tab active"><button type="button" onclick="location.href='/publish/mypage_security_login.html'">보안로그인</button></li>
</ul>

30
src/main/webapp/publish/payment3.html
View File

@ -252,12 +252,13 @@
<!-- //기간설정 -->
<div class="excel_middle">
<div class="select_btnWrap clearfix">
<div class="add_text2" style="line-height: 1.3em;">
<div class="select_btnWrap ">
<div class="add_text2" style="line-height:1.4;font-size:15px;padding:0;">
※ 요금 결제내역은 결제일을 기준으로 최대 6개월까지만 조회가능합니다.
<br>※ 간편결제 영수증은 결제하신 서비스를 통해 제공됩니다.
<br>※ 거래명세서는 세금계산서 발행일로부터 30일 이내에만 출력이 가능합니다.
</div>
<div style="padding-top: 10px;">
<div>
<button type="button" class="excel_btn"><i class="downroad"></i>엑셀 다운로드</button>
<button type="button" class="print_btn"><i class="print_img"></i>인쇄하기</button>
<label for="pageUnit" class="label">검색조건 선택</label>
@ -279,7 +280,7 @@
<col style="width: 15%;">
<col style="width: 15%;">
<col style="width: 15%;">
<col style="width: 20%;">
<col style="width: 25%;">
</colgroup>
<thead>
<tr>
@ -336,7 +337,7 @@
<td class="tRight">20,909,000</td>
<td>결제완료</td>
<td>
<p class="fwMd c_002c9a">세금계산서 발행완료</p>
<button class="btnType btnType20 btn_use_status" onclick="window.open('/publish/transaction_statement.html','','width=790,height=800')">거래명세서</button>
</td>
</tr>
<tr>
@ -347,7 +348,18 @@
<td class="tRight">20,909,000</td>
<td>결제완료</td>
<td>
<p class="fwMd c_222">세금계산서 발행대기</p>
<p class="c_002c9a">세금계산서 발행완료</p>
</td>
</tr>
<tr>
<td>19</td>
<td>2025-03-05 14:40:00</td>
<td>개인전용계좌<br>(전용계좌번호)</td>
<td class="tRight">23,000,000</td>
<td class="tRight">20,909,000</td>
<td>결제완료</td>
<td>
<p class="c_222">세금계산서 발행대기</p>
</td>
</tr>
<tr>
@ -367,8 +379,8 @@
<td class="tRight">20,909,000</td>
<td>결제완료</td>
<td>
<button class="btnType btnType20">세금계산서</button>
<button class="btnType btnType20">현금영수증</button>
<button class="btnType btnType20">간이영수증</button>
</td>
</tr>
</tbody>
@ -425,7 +437,7 @@
<!-- //기간설정 -->
<div class="excel_middle">
<div class="select_btnWrap clearfix">
<div class="select_btnWrap ">
<div class="add_text2" style="line-height: 1.3em;">
※ 포인트 교환내역은 교환일을 기준으로 최대 6개월까지만 조회 가능합니다.
</div>
@ -761,7 +773,7 @@
<!-- //기간설정 -->
<div class="excel_middle">
<div class="select_btnWrap clearfix">
<div class="select_btnWrap">
<div class="add_text2"></div>
<div>
<button type="button" class="excel_btn" onclick="javascript:refundExcelDownload();">

64
src/main/webapp/publish/payment4.html
View File

@ -305,21 +305,28 @@
</div>
<div class="price_history_cont" id="listTab2_5">
<div class="list_info">
<p>총 <span>10</span>건</p>
<p>총 <span>10</span>건 (1,148원)</p>
<div>
<button type="button" class="print_btn"><i class="print_img"></i>인쇄하기</button>
<button type="button" class="pdf_btn"><i class="pdf_img"></i>PDF저장</button>
<button type="button" class="btnType btn_36 border_gray btnType12" onclick="window.open('/publish/use_statement.html','','width=790,height=800');">사용내역서</button>
<button type="button" class="excel_btn"><i class="downroad"></i>엑셀 다운로드</button>
<label for="pageUnit" class="label">검색조건 선택</label>
<select name="pageUnit" id="pageUnit" class="selType2">
<option value="10" selected="">10줄</option>
<option value="20">20줄</option>
<option value="30">30줄</option>
<option value="100">100줄</option>
</select>
</div>
</div>
<div class="tb_wrap">
<table class="tType4">
<colgroup>
<col style="width: auto;">
<col style="width: 15%;">
<col style="width: 15%;">
<col style="width: 15%;">
<col style="width: 20%;">
<col style="width: 9%;">
<col style="width: 10%;">
<col style="width: 12%;">
<col style="width: 12%;">
<col style="width: 16%;">
</colgroup>
<thead>
<tr>
@ -330,64 +337,77 @@
</div>
</th>
<th rowspan="2">
문자유형
형태
<div class="sort_wrap">
<input type="button" class="sort sortBtn" id="sort_orderByCode">
</div>
</th>
<th rowspan="2">내용</th>
<th rowspan="2">발송건수</th>
<th>사용</th>
<th colspan="2">발송건수</th>
<th rowspan="2">금액(원)</th>
</tr>
<tr>
<th>충전금</th>
<th>성공</th>
<th style="border-right:1px solid #ccc;">실패</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="5">
<td colspan="6">
검색 결과가 없습니다.
</td>
</tr>
<tr>
<td>2025-04-21 18:19:48</td>
<td>2025-04-21 18:19</td>
<td>알림톡</td>
<td><button class="btnType btnType20" data-tooltip="allimTalk_detail_popup">상세보기</button></td>
<td>
<p class="fwRg c_002c9a">1/0</p>
<p class="fwRg c_002c9a">187</p>
</td>
<td>
<p class="fwRg c_222">23</p>
</td>
<td>
<p class="fwRg c_002c9a">5</p>
</td>
</tr>
<tr>
<td>2025-04-21 18:19:48</td>
<td>2025-04-21 18:19</td>
<td>단문</td>
<td><button class="btnType btnType20" data-tooltip="shotMsg_detail_popup">상세보기</button></td>
<td>
<p class="fwRg c_002c9a">1/0</p>
<p class="fwRg c_002c9a">187</p>
</td>
<td>
<p class="fwRg c_222">23</p>
</td>
<td>
<p class="fwRg c_002c9a">5</p>
</td>
</tr>
<tr>
<td>2025-04-21 18:19:48</td>
<td>2025-04-21 18:19</td>
<td>장문</td>
<td><button class="btnType btnType20" data-tooltip="longMsg_detail_popup">상세보기</button></td>
<td>
<p class="fwRg c_002c9a">1/0</p>
<p class="fwRg c_002c9a">187</p>
</td>
<td>
<p class="fwRg c_222">23</p>
</td>
<td>
<p class="fwRg c_002c9a">5</p>
</td>
</tr>
<tr>
<td>2025-04-21 18:19:48</td>
<td>2025-04-21 18:19</td>
<td>그림</td>
<td><button class="btnType btnType20" data-tooltip="photoMsg_detail_popup">상세보기</button></td>
<td>
<p class="fwRg c_002c9a">1/0</p>
<p class="fwRg c_002c9a">187</p>
</td>
<td>
<p class="fwRg c_222">23</p>
</td>
<td>
<p class="fwRg c_002c9a">5</p>
@ -396,7 +416,7 @@
</tbody>
</table>
</div>
<div class="publish_btn clearfix">
<!-- <div class="publish_btn clearfix">
<div>
<input type="radio" name="publish" id="publishS" value="statement" checked>
<label for="publishS">거래명세서</label>
@ -410,7 +430,7 @@
<div>
<button type="button" class="btnType btn_publish">발행하기</button>
</div>
</div>
</div> -->
<!-- pagination -->
<ul class="pagination">
<li class="page_first"><button><img src="/publish/images/content/page_first.png" alt=""></button></li>

4
src/main/webapp/publish/publish_adv/adv_template_v1_230918.html
View File

@ -8,10 +8,10 @@
<title>단체문자 - 문자온</title>
<meta name="Keywords" content="문자전송, 문자발송, SMS, LMS, MMS, 문자보내기, 단체문자, 단체문자전송, 단체문자발송,단체문자사이트,문자사이트, 대량문자">
<meta name="description" content="요즘 시대에는 경조사, 알림, 안부인사, 홍보 등 여러 가지 상황에서 단체에게 내용을 전달해야 하는 경우가 많습니다.">
<meta name="description" content="문자온을 통해 단체문자 발송을 쉽고 효율적으로 관리하세요. 경조사, 알림, 홍보 등 다양한 상황에서 수백 명에게 동시에 문자 메시지를 전송할 수 있는 기능을 제공합니다. ">
<meta property="og:type" content="website">
<meta property="og:title" content="단체문자 - 문자온">
<meta property="og:description" content="요즘 시대에는 경조사, 알림, 안부인사, 홍보 등 여러 가지 상황에서 단체에게 내용을 전달해야 하는 경우가 많습니다.">
<meta property="og:description" content="문자온을 통해 단체문자 발송을 쉽고 효율적으로 관리하세요. 경조사, 알림, 홍보 등 다양한 상황에서 수백 명에게 동시에 문자 메시지를 전송할 수 있는 기능을 제공합니다. ">
<link rel="apple-touch-icon" sizes="57x57" href="/publish/images/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/publish/images/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/publish/images/favicon/apple-icon-72x72.png">

4
src/main/webapp/publish/publish_adv/adv_template_v1_manuscript_5.html
View File

@ -8,10 +8,10 @@
<title>인터넷문자 - 문자온</title>
<meta name="Keywords" content="문자전송, 문자발송, SMS, LMS, MMS, 문자보내기, 단체문자, 단체문자전송, 단체문자발송,단체문자사이트,문자사이트, 대량문자">
<meta name="description" content="요즘 시대에는 경조사, 알림, 안부인사, 홍보 등 여러 가지 상황에서 단체에게 내용을 전달해야 하는 경우가 많습니다.">
<meta name="description" content="문자온의 '인터넷문자' 서비스로 대량 문자 발송을 쉽고 효율적으로 관리하세요. 080 수신거부 무료 제공, 주소록 등록 대행, 그림문자 제작, 특정문구 일괄변환, 무료 문자포토에디터 등 다양한 기능을 통해 마케팅, 공지, 알림 등 다양한 용도의 문자 발송을 지원합니다.">
<meta property="og:type" content="website">
<meta property="og:title" content="인터넷문자 - 문자온">
<meta property="og:description" content="요즘 시대에는 경조사, 알림, 안부인사, 홍보 등 여러 가지 상황에서 단체에게 내용을 전달해야 하는 경우가 많습니다.">
<meta property="og:description" content="문자온의 '인터넷문자' 서비스로 대량 문자 발송을 쉽고 효율적으로 관리하세요. 080 수신거부 무료 제공, 주소록 등록 대행, 그림문자 제작, 특정문구 일괄변환, 무료 문자포토에디터 등 다양한 기능을 통해 마케팅, 공지, 알림 등 다양한 용도의 문자 발송을 지원합니다.">
<link rel="apple-touch-icon" sizes="57x57" href="/publish/images/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/publish/images/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/publish/images/favicon/apple-icon-72x72.png">

20
src/main/webapp/publish/textingmsg_detail_allimtalk.html
View File

@ -702,20 +702,21 @@
</dl>
</div>
</div>
</div>
</div>
<!--// 발송결과-->
<div class="table_btn clearfix">
<div class="table_btn clearfix" style="margin:15px 0 0 0;">
<div class="table_btn_left">
<button type="button" data-tooltip="rev_popup02" class="btnType btnType14"><i class="add_img"></i>주소록 등록</button>
<button type="button" class="excel_btn btnType"><i class="downroad"></i>엑셀 다운로드</button>
<!-- <button type="button" data-tooltip="rev_popup02" class="btnType btnType14"><i class="add_img"></i>주소록 등록</button>
<button type="button" class="excel_btn btnType"><i class="downroad"></i>엑셀 다운로드</button> -->
</div>
<div class="table_btn_right">
<p class="table_btn_right_txt">* 전체 건수를 클릭하면 받는 사람 상세정보를 확인하실 수 있습니다.</p>
</div>
</div>
</div>
</div>
<!--// 발송결과-->
</div>
<!--// 발송결과 상세 정보 -->
<div class="resultcont_right" id="previewPhone">
@ -798,16 +799,11 @@
</div>
</div>
<p class="addText">※ 단말기 설정에 따라 다르게 보일 수 있습니다</p>
<p>
</p>
</div>
</div>
<!--// 카카오 알림톡 미리보기 -->
<!-- // 대체문자 -->
</div>
</div>

296
src/main/webapp/publish/transaction_statement.html
View File

@ -13,13 +13,10 @@
<link rel="stylesheet" href="/publish/css/font.css">
<link rel="stylesheet" href="/publish/css/button.css">
<style>
.est_table th.text {text-align: center;vertical-align: middle;}
</style>
</head>
<body>
<!-- 견적서 -->
<div class="estimate_wrap">
<div class="estimate">
<div class="est_head clearfix">
@ -30,160 +27,285 @@
</div>
</div>
<div class="est_body">
<h2>거래명세서<span>(공급받는자 보관용)</span></h2>
<div class="cont1">
<div>
<h2>거래명세서<span style="font-size:20px;font-weight:400;">(공급받는자 보관용)</span></h2>
<div class="cont1 tb_ver2" style="display:flex;">
<div style="width:calc((100% - 40px)/2);">
<p>공급받는 자</p>
<table class="est_table">
<caption>공급받는자 정보</caption>
<caption>등록번호, 상호, 성명, 전화번호, 이메일 정보 제공</caption>
<colgroup>
<col style="width: 50px;">
<col style="width: 60px;">
<col style="width: auto;">
</colgroup>
<tbody>
<tr>
<th>수<span class="blank"></span>신</th>
<td>원영현</td>
<th>등록번호</th>
<td>사업자등록번호
<!--(개인회원인 경우 하이픈(-) 처리)-->
</td>
</tr>
<tr>
<th>참<span class="blank"></span>조</th>
<td>원영현 (01093414986)</td>
<th style="letter-spacing:-0.69px;">상&ensp;&ensp;&ensp;&nbsp;&nbsp;호</th>
<td>기업명
<!-- (개인회원인 경우 하이픈(-) 처리-->
</td>
</tr>
<tr>
<th>거래일자</th>
<td>2024-04-26~2025-04-25</td>
<th style="letter-spacing:-0.69px;">성&ensp;&ensp;&ensp;&nbsp;&nbsp;명</th>
<td>가입자명</td>
</tr>
<tr>
<th rowspan="2" colspan="2" class="text">아래와 같이 계산합니다.</th>
<th>전화번호</th>
<td>가입자 연락처</td>
</tr>
<tr>
<th style="letter-spacing:-0.85px;">이&ensp;메&ensp;일</th>
<td>가입자 이메일</td>
</tr>
<tr></tr>
</tbody>
</table>
</div>
<div>
<div style="width:calc((100% - 40px)/2);">
<p>공급자</p>
<img src="/publish/images/content/stamp.png" alt="도장" class="stamp mCS_img_loaded">
<table class="est_table">
<caption>공급자 정보</caption>
<caption>등록번호, 상호, 성명, 전화번호, 이메일 정보 제공</caption>
<colgroup>
<col style="width: 82px;">
<col style="width: 60px;">
<col style="width: auto;">
</colgroup>
<tbody>
<tr>
<th>회<span class="blank2"></span>사<span class="blank2"></span>명</th>
<td>주식회사 아이티앤</td>
</tr>
<tr>
<th>사업자등록번호</th>
<th>등록번호</th>
<td>653-87-00858</td>
</tr>
<tr>
<th>대<span class="blank2"></span>표<span class="blank2"></span>자</th>
<th style="letter-spacing:-0.69px;">상&ensp;&ensp;&ensp;&nbsp;&nbsp;호</th>
<td>주식회사 아이티앤</td>
</tr>
<tr>
<th style="letter-spacing:-0.69px;">성&ensp;&ensp;&ensp;&nbsp;&nbsp;명</th>
<td>유인식</td>
</tr>
<tr>
<th>전<span class="blank3"></span>화</th>
<th>전화번호</th>
<td>1551-8011</td>
</tr>
<tr>
<th>이<span class="blank2"></span>메<span class="blank2"></span>일</th>
<th style="letter-spacing:-0.85px;">이&ensp;메&ensp;일</th>
<td>help@iten.co.kr</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="cont2 clearfix">
<p>총 사용금액</p>
<p><span>517</span> 원(VAT 별도)</p>
</div>
<div class="cont3">
<p>(단위 : 원, 건)</p>
<div class="est_table2_wrap">
<table class="est_table2">
<caption>품목, 발송건수, 공급가액, 금액 정보를 제공하는 표</caption>
<caption>작성일자, 공급가액, 세액, 비고 정보를 제공하는 표</caption>
<colgroup>
<col style="width:20%;">
<col style="width:20%;">
<col style="width:20%;">
<col style="width:auto;">
<col style="width: 25%;">
<col style="width: 25%;">
<col style="width: 25%;">
</colgroup>
<thead>
<tr>
<th scope="col">품목</th>
<th scope="col">발송건수</th>
<th scope="col">작성일자</th>
<th scope="col">공급가액</th>
<th scope="col">금액</th>
<th scope="col">세액</th>
</tr>
</thead>
<tbody>
<tr>
<td>단문(SMS)</td>
<td>7</td>
<td>67</td>
<td>67</td>
</tr>
<tr>
<td>장문(LMS)</td>
<td>8</td>
<td>160</td>
<td>160</td>
</tr>
<tr>
<td>그림(MMS)</td>
<td>2</td>
<td>60</td>
<td>60</td>
</tr>
<tr>
<td>알림톡</td>
<td>26</td>
<td>130</td>
<td>130</td>
</tr>
<tr>
<td>팩스</td>
<td>2</td>
<td>100</td>
<td>100</td>
<td>2024-07-18</td>
<td>500,000</td>
<td>50,000</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>비고</th>
<td style="padding:0 0 0 20px;">사용기간(2024-01-01 ~ 2024-01-31)</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="cont4">
<table class="est_table">
<caption>공급가액, 총 결제금액에 대한 표</caption>
<div class="est_table2_wrap" style="margin:20px 0 0 0;">
<table class="est_table2">
<caption>월, 일, 품목, 규격, 수량, 단가, 공급가액, 세액, 비고 정보를 제공하는 표</caption>
<colgroup>
<col style="width: 100px;">
<col style="width: 60px;">
<col style="width: 60px;">
<col style="width: auto;">
<col style="width: 60px;">
<col style="width: 60px;">
<col style="width: 60px;">
<col style="width: 100px;">
<col style="width: 60px;">
<col style="width: 70px;">
</colgroup>
<thead>
<tr>
<th scope="col">월</th>
<th scope="col">일</th>
<th scope="col">품목</th>
<th scope="col">규격</th>
<th scope="col">수량</th>
<th scope="col">단가</th>
<th scope="col">공급가액</th>
<th scope="col">세액</th>
<th scope="col">비고</th>
</tr>
</thead>
<tbody>
<tr>
<th>공급가액</th>
<td><span>517</span></td>
<td>7</td>
<td>18</td>
<td>문자온 메시징 서비스 이용료</td>
<td></td>
<td></td>
<td></td>
<td>500,000</td>
<td>50,000</td>
<td>-</td>
</tr>
<tr class="total_price">
<th>총 사용금액</th>
<td><span>517</span></td>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
<!-- 후불제 -->
<!-- <tfoot>
<tr>
<th colspan="2">합계금액</th>
<th>전잔액</th>
<th colspan="2">입금액</th>
<th colspan="2">현잔액</th>
<th colspan="2" rowspan="2" style="background:#fff;vertical-align:middle;">이 금액을 [<span>청&ensp;구</span>]함</th>
</tr>
<tr>
<td style="text-align:center;" colspan="2">550,000</td>
<td style="text-align:center;">-</td>
<td style="text-align:center;" colspan="2">-</td>
<td style="text-align:center;" colspan="2">550,000</td>
</tr>
</tfoot> -->
<!-- //후불제 -->
<!-- 일반회원(선불제) -->
<tfoot>
<tr>
<th colspan="2">합계금액</th>
<th>전잔액</th>
<th colspan="2">입금액</th>
<th colspan="2">현잔액</th>
<th colspan="2" rowspan="2" style="background:#fff;vertical-align:middle;">이 금액을 [<span>영&ensp;수</span>]함</th>
</tr>
<tr>
<td style="text-align:center;" colspan="2">550,000</td>
<td style="text-align:center;">-</td>
<td style="text-align:center;" colspan="2">-</td>
<td style="text-align:center;" colspan="2">550,000</td>
</tr>
</tfoot>
<!-- //일반회원(선불제) -->
</table>
</div>
<div class="cont5">
<p><span>2025 년&nbsp;&nbsp;<span>4</span> 월&nbsp;&nbsp;<span>25</span> 일</span></p>
</div>
<!-- <div class="cont5">
<p><span>2021</span> 년&nbsp;&nbsp;<span>6</span> 월&nbsp;&nbsp;<span>17</span> 일</p>
<div>
<span></span>
<span>주식회사 아이티앤</span>
<span>유&nbsp;&nbsp;인&nbsp;&nbsp;식&nbsp;&nbsp;(인)</span>
</div>
<div class="est_btn_wrap" id="est_btn_wrap">
<button type="button" class="btnType" onclick="javascript:f_print(); return false;"><i class="print_img"></i>인쇄하기</button>
</div> -->
</div>
<div class="est_btn_wrap">
<button type="button" class="btnType" onclick="window.print();"><i class="print_img"></i>인쇄하기</button>
</div>
</div>
</div>
<!--// 견적서 -->
</body>
</html>

120
src/main/webapp/publish/use_statement.html
View File

@ -13,6 +13,29 @@
<link rel="stylesheet" href="/publish/css/font.css">
<link rel="stylesheet" href="/publish/css/button.css">
<style type="text/css">
.blank {
margin: 0 11.5px;
}
.est_table2_wrap {
overflow: hidden;
}
.est_table2 {
border: 0 none;
}
.est_table2 tbody td:first-child {
border-left: 0 none;
}
.est_table2 tbody tr:last-child th,
.est_table2 tbody tr:last-child td {
border-bottom: 0 none;
}
</style>
</head>
<body>
@ -38,30 +61,37 @@
</colgroup>
<tbody>
<tr>
<th>수<span class="blank"></span>신</th>
<td>원영현</td>
<th>등록번호</th>
<td>사업자등록번호(개인회원인 경우 하이픈(-) 처리)</td>
</tr>
<tr>
<th>참<span class="blank"></span>조</th>
<td>담당자 원영현 님</td>
<th>상<span class="blank"></span>호</th>
<td>기업명 (개인회원인 경우 하이픈(-) 처리)</td>
</tr>
<tr>
<th>거래일자</th>
<td>2024-04-29~2025-04-28</td>
<th>성<span class="blank"></span>명</th>
<td>가입자명</td>
</tr>
<tr>
<th>전화번호</th>
<td>가입자 연락처</td>
</tr>
<tr>
<th style="letter-spacing:-0.85px;">이&ensp;메&ensp;일</th>
<td>가입자 이메일</td>
</tr>
<tr>
<td colspan="2" style="text-align:center;"><span>주식회사OOO</span>님의 사용내역(2024-01-01~2024-07-19)을 아래와 같이 확인합니다.</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="cont2 clearfix">
<p>총 사용금액</p>
<p><span>517</span> 원(VAT 별도)</p>
</div>
<div class="cont3">
<p>(단위 : 원, 건)</p>
<div class="est_table2_wrap">
<table class="est_table2">
<caption>품목, 발송건수, 공급가액, 부가세, 금액 정보를 제공하는 표</caption>
<caption>사용일시, 문자유형, 발송건수, 사용금액을 제공하는 표</caption>
<colgroup>
<col style="width:20%;">
<col style="width:20%;">
@ -70,46 +100,36 @@
</colgroup>
<thead>
<tr>
<th scope="col">품목</th>
<th scope="col">사용일시</th>
<th scope="col">문자유형</th>
<th scope="col">발송건수</th>
<th scope="col">공급가액</th>
<th scope="col">금액</th>
<th scope="col">사용금액</th>
</tr>
</thead>
<tbody>
<tr>
<td>단문(SMS)</td>
<td>7</td>
<td>67</td>
<td>67</td>
<td>2024-07-18 12:11</td>
<td>단문</td>
<td>1</td>
<td>75</td>
</tr>
<tr>
<td>장문(LMS)</td>
<td>8</td>
<td>160</td>
<td>160</td>
</tr>
<tr>
<td>그림(MMS)</td>
<td>2024-07-18 12:11</td>
<td>장문</td>
<td>2</td>
<td>60</td>
<td>60</td>
<td>64</td>
</tr>
<tr>
<td>알림톡</td>
<td>26</td>
<td>130</td>
<td>130</td>
<td>2024-07-18 12:11</td>
<td>그림</td>
<td>1</td>
<td>59</td>
</tr>
<tr>
<td>팩스</td>
<td>2</td>
<td>100</td>
<td>100</td>
<td>2024-07-18 12:11</td>
<td>단문</td>
<td>1</td>
<td>75</td>
</tr>
</tbody>
@ -117,25 +137,9 @@
</div>
</div>
<div class="cont4">
<table class="est_table">
<caption>공급가액, 총 결제금액에 대한 표</caption>
<colgroup>
<col style="width: 100px;">
<col style="width: auto;">
</colgroup>
<tbody>
<tr>
<th>공급가액</th>
<td><span>517</span></td>
</tr>
<tr class="total_price">
<th>총 사용금액</th>
<td><span>517</span></td>
</tr>
</tbody>
</table>
<div class="cont2 clearfix">
<p>총 사용금액 <span>(VAT 별도)</span></p>
<p><span>145.5</span>원</p>
</div>
<div class="cont5">
<p><span>2025 년&nbsp;&nbsp;<span>4</span> 월&nbsp;&nbsp;<span>28</span> 일</span></p>