913 lines
37 KiB
HTML
913 lines
37 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ko">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<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 rel="stylesheet" href="/publish/css/reset.css">
|
||
<link rel="stylesheet" href="/publish/css/common.css">
|
||
<link rel="stylesheet" href="/publish/css/button.css">
|
||
<link rel="stylesheet" href="/publish/css/main.css">
|
||
<link rel="stylesheet" href="/publish/css/content.css">
|
||
<link rel="stylesheet" href="/publish/css/slick.css">
|
||
<link rel="stylesheet" href="/publish/css/font.css">
|
||
<link rel="stylesheet" href="/publish/css/chatbot_style.css">
|
||
<link rel="stylesheet" href="/publish/css/popupLayer.css">
|
||
<link rel="stylesheet" href="/publish/css/swiper.min.css">
|
||
|
||
<script src="/publish/js/jquery-3.5.0.js"></script>
|
||
<script src="/publish/js/jquery.bxslider.js"></script>
|
||
<script src="/publish/js/slick.js"></script>
|
||
<script src="/publish/js/slick.min.js"></script>
|
||
<script src="/publish/js/common.js"></script>
|
||
<script src="/publish/js/main.js"></script>
|
||
<script src="/publish/js/popupLayer.js"></script>
|
||
<script src="/publish/js/swiper.min.js"></script>
|
||
|
||
</head>
|
||
<body>
|
||
<div class="mask"></div>
|
||
|
||
<div class="layer_popup_wrap">
|
||
<div class="popup_inner">
|
||
<div class="layer_popup">
|
||
<div class="layer_popup_cont">
|
||
<img src="/publish/images/main/popup01.jpg" alt=""usemap="#popup-map">
|
||
<map name="popup-map">
|
||
<area target="_blank" href="/publish/firstpay_event.html" coords="385,458,28,410" shape="rect">
|
||
</map>
|
||
</div>
|
||
<div class="popup_btm">
|
||
<input type="checkbox" id="popup_close01"><label for="popup_close01">3일간 열지 않음</label>
|
||
<button type="button" class="popup_close"><img src="/publish/images/main/btn_popup_close01.png" alt=""></button>
|
||
</div>
|
||
</div>
|
||
<div class="layer_popup">
|
||
<div class="layer_popup_cont">
|
||
<img src="/publish/images/main/popup02.jpg" alt="">
|
||
</div>
|
||
<div class="popup_btm">
|
||
<input type="checkbox" id="popup_close02"><label for="popup_close02">3일간 열지 않음</label>
|
||
<button type="button" class="popup_close"><img src="/publish/images/main/btn_popup_close01.png" alt=""></button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
|
||
<!-- skip 메뉴 -->
|
||
<div class="skip_menu">
|
||
|
||
<a href="#cont" title="본문 바로가기" class="contGo">본문 바로가기</a>
|
||
</div><!--// skip 메뉴 -->
|
||
<!-- 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="#"><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="quick10"></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="tooltip-wrap">
|
||
<div class="chatBotPop chat_01" tabindex="0" data-tooltip-con="chat_01" data-focus="chat_01"
|
||
data-focus-prev="chat01-close">
|
||
<div class="top_close">
|
||
<button type="button" class="tooltip-close btn_close" data-focus="chat01-close"><img
|
||
src="/publish/images/chatbot/btn_close.png" alt=""></button>
|
||
</div>
|
||
<div class="area_text">
|
||
<p class="tit_text">챗봇 상담원 <span>온리</span></p>
|
||
<p class="info_text">문자온 서비스 이용전반에 대한 궁금하신 사항을 실시간으로 확인할 수 있습니다.</p>
|
||
</div>
|
||
<div class="icon">
|
||
<img src="/publish/images/chatbot/character_munzaon01.png" alt="">
|
||
</div>
|
||
<ul class="btn_wrap">
|
||
<li><button class="btn_kakao" title="카카오톡으로 상담하기"></button>
|
||
<div class="hover_cont">카카오톡 상담하기</div>
|
||
</li>
|
||
<li><button class="btn_copy" title="URL복사"></button>
|
||
<div class="hover_cont">URL복사</div>
|
||
</li>
|
||
<li><button class="btn_call" title="전화상담"></button>
|
||
<div class="hover_cont">전화상담</div>
|
||
</li>
|
||
</ul>
|
||
|
||
<button type="button" class="btn_start tooltip-close" data-tooltip="chat_02" data-focus="chat01-close">시작해볼까요? </button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="tooltip-wrap">
|
||
<div class="chatBotPop chat_02" tabindex="0" data-tooltip-con="chat_02" data-focus="chat_02"
|
||
data-focus-prev="chat02-close">
|
||
<!-- partial:index.partial.html -->
|
||
<section class="msger">
|
||
<header class="msger-header">
|
||
<div class="msger-header-title">
|
||
<p>문자온</p><img src="/publish/images/chatbot/tit_icon1.png" alt="">
|
||
<span>보통 몇분 내에 응답합니다.</span>
|
||
</div>
|
||
<button class="tooltip-close btn_close" data-focus="chat01-close"><img
|
||
src="/publish/images/chatbot/btn_close.png" alt=""></button>
|
||
</header>
|
||
<main class="msger-chat">
|
||
<div class="msg left-msg">
|
||
<div class="msg-img"></div>
|
||
|
||
<div class="msg-bubble">
|
||
<div class="msg-info">
|
||
<div class="msg-info-name">문자온</div>
|
||
<div class="msg-info-time">PM 3:45</div>
|
||
</div>
|
||
|
||
<div class="msg-text">
|
||
안녕하세요. 문자온 서비스 이용에 대한 궁금하신 사항을 무엇이든 물어보세요!
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
|
||
<form class="msger-inputarea">
|
||
<input type="text" class="msger-input" id="textInput" placeholder="">
|
||
<button type="button" class="msger-send-btn" onclick="fn_submit();"><img
|
||
src="/publish/images/chatbot/btn_send.png" alt=""></button>
|
||
</form>
|
||
</section>
|
||
<!-- partial -->
|
||
<script src='https://use.fontawesome.com/releases/v5.0.13/js/all.js'></script>
|
||
<script>
|
||
/*
|
||
const msgerForm = get(".msger-inputarea");
|
||
const msgerInput = get(".msger-input");
|
||
const msgerChat = get(".msger-chat");
|
||
*/
|
||
|
||
const msgerInput = $(".msger-input");
|
||
const msgerChat = $(".msger-chat");
|
||
|
||
|
||
// Icons made by Freepik from www.flaticon.com
|
||
const BOT_IMG = "https://image.flaticon.com/icons/svg/327/327779.svg";
|
||
const PERSON_IMG = "https://image.flaticon.com/icons/svg/145/145867.svg";
|
||
const BOT_NAME = "AI ChatBot";
|
||
const PERSON_NAME = "You";
|
||
|
||
|
||
/*
|
||
msgerForm.addEventListener("submit", event => {
|
||
event.preventDefault();
|
||
|
||
const msgText = msgerInput.value;
|
||
if (!msgText) return;
|
||
|
||
appendMessage(PERSON_NAME, PERSON_IMG, "right", msgText);
|
||
msgerInput.value = "";
|
||
botResponse(msgText);
|
||
});
|
||
*/
|
||
|
||
$("#textInput").keypress(function (e) {
|
||
if ((e.which == 13) && document.getElementById("textInput").value == "") {
|
||
event.preventDefault();
|
||
return;
|
||
}
|
||
if ((e.which == 13) && document.getElementById("textInput").value != "") {
|
||
|
||
event.preventDefault();
|
||
var msgText = msgerInput.val();
|
||
appendMessage(PERSON_NAME, PERSON_IMG, "right", msgText);
|
||
msgerInput.val("");
|
||
botResponse(msgText);
|
||
}
|
||
});
|
||
|
||
function appendMessage(name, img, side, text) {
|
||
// Simple solution for small apps
|
||
const msgHTML = '<div class="msg ' + side + '-msg">' + '<div class="msg-bubble">' +
|
||
'<div class="msg-info">' +
|
||
'<div class="msg-info-name">' + name + '</div>' +
|
||
'<div class="msg-info-time">' + formatDate(new Date()) + '</div>' +
|
||
'</div>'
|
||
|
||
+
|
||
'<div class="msg-text">' + text + '</div>' +
|
||
'</div>' +
|
||
'</div>';
|
||
|
||
/*
|
||
const msgHTML = '
|
||
<div class="msg ${side}-msg">
|
||
<div class="msg-img" style="background-image: url(${img})"></div>
|
||
|
||
<div class="msg-bubble">
|
||
<div class="msg-info">
|
||
<div class="msg-info-name">${name}</div>
|
||
<div class="msg-info-time">${formatDate(new Date())}</div>
|
||
</div>
|
||
|
||
<div class="msg-text">${text}</div>
|
||
</div>
|
||
</div>
|
||
';
|
||
*/
|
||
|
||
$(".msger-chat").append(msgHTML);
|
||
//msgerChat.insertAdjacentHTML("beforeend", msgHTML);
|
||
//msgerChat.scrollTop += 500;
|
||
$(".msger-chat")[0].scrollTop += 500;
|
||
}
|
||
|
||
function botResponse(rawText) {
|
||
|
||
// Bot Response
|
||
$.get("/get", {
|
||
msg: rawText
|
||
}).done(function (data) {
|
||
console.log(rawText);
|
||
console.log(data);
|
||
const msgText = data;
|
||
appendMessage(BOT_NAME, BOT_IMG, "left", msgText);
|
||
|
||
});
|
||
|
||
}
|
||
|
||
|
||
// Utils
|
||
/* function get(selector, root = document) {
|
||
return root.querySelector(selector);
|
||
}*/
|
||
|
||
function formatDate(date) {
|
||
const h = "0" + date.getHours();
|
||
const m = "0" + date.getMinutes();
|
||
|
||
return h.slice(-2) + ':' + m.slice(-2);
|
||
}
|
||
|
||
function fn_submit() {
|
||
|
||
if (document.getElementById("textInput").value != "") {
|
||
|
||
event.preventDefault();
|
||
var msgText = msgerInput.val();
|
||
appendMessage(PERSON_NAME, PERSON_IMG, "right", msgText);
|
||
msgerInput.val("");
|
||
botResponse(msgText);
|
||
}
|
||
|
||
}
|
||
</script>
|
||
|
||
</div>
|
||
</div>
|
||
<!-- //챗봇 -->
|
||
|
||
<!-- header 영역 -->
|
||
<header id="header" class="header main">
|
||
<!-- 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="문자ON 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>
|
||
</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">
|
||
<input type="text" id="id_text" class="id_text" maxlength="30" placeholder="아이디를 입력해주세요" onfocus="this.placeholder = ''" onblur="this.placeholder='아이디를 입력해주세요'">
|
||
<label for="id_text" class="label">아이디를 입력해주세요</label>
|
||
<input type="password" id="password_text" class="password_text" placeholder="비밀번호를 입력해주세요" onfocus="this.placeholder = ''" onblur="this.placeholder='비밀번호를 입력해주세요'">
|
||
<label for="password_text" 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 영역 -->
|
||
<div class="mask2"></div>
|
||
<!-- login 영역 -->
|
||
<!-- content 영역 -->
|
||
<div id="container" class="cont main">
|
||
<!-- visual 영역 -->
|
||
<div class="visual">
|
||
<div class="bxslider">
|
||
<div class="slide">
|
||
<div class="slideImg img1"></div>
|
||
</div>
|
||
<div class="slide">
|
||
<div class="slideImg img2"></div>
|
||
</div>
|
||
</div>
|
||
<div class="slideBtn">
|
||
<ul>
|
||
<li class="active"><button onclick="slideNum(0,this);" class="sildeRnd"></button></li>
|
||
<li><button onclick="slideNum(1,this);" class="sildeRnd"></button></li>
|
||
<li><button class="slideStart"></button></li>
|
||
<li><button class="slidePause"></button></li>
|
||
</ul>
|
||
</div>
|
||
</div><!--// visual 영역 -->
|
||
|
||
<!-- new_content1 //-->
|
||
<div class="banner_w">
|
||
<div class="sw_wrap">
|
||
<div class="swiper-container swiper2">
|
||
<div class="swiper-wrapper">
|
||
<div class="swiper-slide">
|
||
<div class="contWrap ct1">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">문자 대량전송</li>
|
||
<li class="cont1_ex">별다른 프로그램 설치없이<br>pc에서 바로 전송이 가능</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<div class="contWrap ct2">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">그림문자 맞춤제작</li>
|
||
<li class="cont1_ex">목적에 맞는 나만의 맞춤<br> 이미지로홍보효과 극대화</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<div class="contWrap ct3">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">주소록 등록 무료대행</li>
|
||
<li class="cont1_ex">주소록 직접 등록이 어려운<br>고객을 위해 엑셀, TXT 파일 등<br>무료 등록 대행</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<div class="contWrap ct4">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">080수신거부 무료 제공</li>
|
||
<li class="cont1_ex">광고, 선거 등에 필요한<br> 수신거부 번호 무료 제공</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="swiper-slide">
|
||
<div class="contWrap ct1">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">문자 대량전송</li>
|
||
<li class="cont1_ex">별다른 프로그램 설치없이<br>pc에서 바로 전송이 가능</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 버튼 -->
|
||
<div class="swiper-button-next"><img src="/publish/images/main/cont1_next.png"/></div>
|
||
<div class="swiper-button-prev"><img src="/publish/images/main/cont1_prev.png"/></div>
|
||
<!-- 페이징 -->
|
||
<div class="swiper-pagination"></div>
|
||
</div>
|
||
|
||
|
||
<!-- content1 영역 5개 이상
|
||
<div class="main_cont1">
|
||
<div class="inner">
|
||
<div id="slider-div" class="slider_div">
|
||
<div class="contWrap ct1">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">문자 대량전송</li>
|
||
<li class="cont1_ex">별다른 프로그램 설치없이<br>pc에서 바로 전송이 가능</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct2">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">그림문자 맞춤제작</li>
|
||
<li class="cont1_ex">목적에 맞는 나만의 맞춤<br> 이미지로홍보효과 극대화</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct3">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">주소록 등록 무료대행</li>
|
||
<li class="cont1_ex">주소록 직접 등록이 어려운<br>고객을 위해 엑셀, TXT 파일 등<br>무료 등록 대행</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct4">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">080수신거부 무료 제공</li>
|
||
<li class="cont1_ex">광고, 선거 등에 필요한<br> 수신거부 번호 무료 제공</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct1">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">문자 대량전송</li>
|
||
<li class="cont1_ex">별다른 프로그램 설치없이<br>pc에서 바로 전송이 가능</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="cont1_btnWrap">
|
||
<button class="cont1_prev"><img src="/publish/images/main/cont1_prev.png" alt=""></button>
|
||
<button class="cont1_next"><img src="/publish/images/main/cont1_next.png" alt=""></button>
|
||
</div>
|
||
</div>
|
||
</div><!--// content1 영역 -->
|
||
<!-- content1 영역 4개 시
|
||
<div class="main_cont1 show4">
|
||
<div class="inner">
|
||
<div class="contWrap ct1">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">1문자 대량전송</li>
|
||
<li class="cont1_ex">별다른 프로그램 설치없이<br>pc에서 바로 전송이 가능</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct2 on">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">2그림문자 맞춤제작</li>
|
||
<li class="cont1_ex">목적에 맞는 나만의 맞춤<br> 이미지로 홍보효과 극대화</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct3">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">3주소록 등록 무료대행</li>
|
||
<li class="cont1_ex">주소록 직접 등록이 어려운<br>고객을 위해 엑셀, TXT 파일 등<br>무료 등록 대행</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
<div class="contWrap ct4">
|
||
<a href="#" title="페이지 이동">
|
||
<ul class="slide_cont table_cell">
|
||
<li class="cont1_title">080수신거부 무료 제공</li>
|
||
<li class="cont1_ex">광고, 선거 등에 필요한<br> 수신거부 번호 무료 제공</li>
|
||
<li class="more">자세히보기</li>
|
||
</ul>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div><!--// content1 영역 -->
|
||
<div class="main_cont2">
|
||
<div class="inner">
|
||
<p class="tit_text">이런 문자 어때요?</p>
|
||
<div class="tabs">
|
||
<!-- Default tab_depth1 - 전체 / tab_depth2 - 인기그림문자 / tab_depth3 - BEST -->
|
||
<div class="tab_depth1">
|
||
<a href="#none" class="on">전체</a>
|
||
<a href="#none">기업</a>
|
||
<a href="#none">개인</a>
|
||
<div class="on_active">전체</div>
|
||
</div>
|
||
<div class="tab_depth2">
|
||
<a href="#none" class="on">인기 그림문자</a>
|
||
<a href="#none">인기 장문문자</a>
|
||
<a href="#none">인기 단문문자</a>
|
||
<a href="#none" class="tab_custom">인기 맞춤제작</a>
|
||
</div>
|
||
<button class="btn_custom"><img src="/publish/images/main/btn_imgicon.png" alt=""> 맞춤제작요청</button>
|
||
<div class="tab_depth3 tab_basic">
|
||
<a href="#none" class="on">BEST</a>
|
||
<a href="#none">요일</a>
|
||
<a href="#none">계절/날씨</a>
|
||
<a href="#none">선거</a>
|
||
<a href="#none">기념일데이</a>
|
||
<a href="#none">경조사</a>
|
||
<a href="#none">모임/행사</a>
|
||
<a href="#none">명절</a>
|
||
<a href="#none">연말연시</a>
|
||
<a href="#none">감사/축하</a>
|
||
<a href="#none">사랑/우정</a>
|
||
<a href="#none">격려/위로</a>
|
||
<a href="#none">유머/코믹</a>
|
||
<a href="#none">좋은글/명언</a>
|
||
<a href="#none">운세/별자리</a>
|
||
<a href="#none">종교</a>
|
||
</div>
|
||
<div class="tab_depth3 tab_other">
|
||
<a href="#none" class="on">BEST</a>
|
||
<a href="#none">전체</a>
|
||
<a href="#none">선거</a>
|
||
<a href="#none">부고/조문</a>
|
||
<a href="#none">초대장</a>
|
||
<a href="#none">개업/홍보</a>
|
||
<a href="#none">결혼/청첩장</a>
|
||
<a href="#none">감사/답례</a>
|
||
<a href="#none">돌잔치/백일</a>
|
||
<a href="#none">칠순/회갑연</a>
|
||
<a href="#none">명함</a>
|
||
</div>
|
||
</div>
|
||
<div class="tab_contwrap">
|
||
<button class="btn_prev btn_photo"><img src="/publish/images/main/btn_prev.png" alt=""></button>
|
||
<ul class="tab_con msg_photo active">
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template01.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template02.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template03.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template04.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template05.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template01.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template02.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template03.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template04.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_img"><img src="/publish/images/main/template05.jpg" alt=""></div>
|
||
<div class="area_img_text">연말연시</div>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<button class="btn_next btn_photo"><img src="/publish/images/main/btn_next.png" alt=""></button>
|
||
<button class="btn_prev btn_msg"><img src="/publish/images/main/btn_prev.png" alt=""></button>
|
||
<ul class="tab_con msg_text">
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p>스크롤 생겨야하는것만 생기게 찾아보고 디자인 찾아보고</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p>스크롤 생겨야하는것만 생기게 찾아보고 디자인 찾아보고</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p>스크롤 생겨야하는것만 생기게 찾아보고 디자인 찾아보고</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p>스크롤 생겨야하는것만 생기게 찾아보고 디자인 찾아보고</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p> 즐거운 화이트데이입니다. <br>
|
||
달달한 하루보내시라고, 화이트데이 사탕보냅니다. <br>
|
||
맛있게 드시고, 새콤달콤 행복한 하루보내세요~ <br>
|
||
*""* <br>
|
||
*◆○* <br>
|
||
*♡◎★* <br>
|
||
######## <br>
|
||
＼_____／</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p> 즐거운 화이트데이입니다. <br>
|
||
달달한 하루보내시라고, 화이트데이 사탕보냅니다. <br>
|
||
맛있게 드시고, 새콤달콤 행복한 하루보내세요~ <br>
|
||
*""* <br>
|
||
*◆○* <br>
|
||
*♡◎★* <br>
|
||
######## <br>
|
||
＼_____／</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p> 즐거운 화이트데이입니다. <br>
|
||
달달한 하루보내시라고, 화이트데이 사탕보냅니다. <br>
|
||
맛있게 드시고, 새콤달콤 행복한 하루보내세요~ <br>
|
||
*""* <br>
|
||
*◆○* <br>
|
||
*♡◎★* <br>
|
||
######## <br>
|
||
＼_____／</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="#">
|
||
<div class="area_tit_text">
|
||
화이트데이
|
||
</div>
|
||
<div class="area_in_text">
|
||
<p> 즐거운 화이트데이입니다. <br>
|
||
달달한 하루보내시라고, 화이트데이 사탕보냅니다. <br>
|
||
맛있게 드시고, 새콤달콤 행복한 하루보내세요~ <br>
|
||
*""* <br>
|
||
*◆○* <br>
|
||
*♡◎★* <br>
|
||
######## <br>
|
||
＼_____／</p>
|
||
</div>
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
<button class="btn_next btn_msg"><img src="/publish/images/main/btn_next.png" alt=""></button>
|
||
|
||
</div>
|
||
<button class="btn_more">더 많은 샘플보기</button>
|
||
</div>
|
||
</div>
|
||
<!-- content3 영역 -->
|
||
<div class="main_cont3">
|
||
<div class="inner">
|
||
<div class="main_service">
|
||
<h2><span class="text_deco"></span>자주찾는 서비스</h2>
|
||
<ul>
|
||
<li><a href="#"><i></i><span>요금안내</span></a></li>
|
||
<li><a href="#"><i></i><span>견적내기</span></a></li>
|
||
<li><a href="#"><i></i><span>충전하기</span></a></li>
|
||
<li><a href="#"><i></i><span>포인트교환</span></a></li>
|
||
<li><a href="#"><i></i><span>발신번호 등록</span></a></li>
|
||
<li><a href="#"><i></i><span>계산서/영수증</span></a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="main_notice">
|
||
<h2><span class="text_deco"></span>공지사항</h2>
|
||
<button class="plus_btn"><!--<img src="/publish/images/plus.png">--></button>
|
||
<div class="table">
|
||
<ul class="table_cell">
|
||
<li><a href="#" tltle="페이지 이동"><span class="text_deco2"></span> [업그레이드] 회원가입 및 발신번호등록 정책 변경</a></li>
|
||
<li><a href="#" tltle="페이지 이동"><span class="text_deco2"></span>[작업] 8월 6일 시스템 점검 안내</a></li>
|
||
<li><a href="#" tltle="페이지 이동"><span class="text_deco2"></span> [업그레이드] [Android/ IOS] 문자 앱 업데이트 안내</a></li>
|
||
<li><a href="#" tltle="페이지 이동"><span class="text_deco2"></span>[오픈] 실시간 채팅하기 기능 오픈</a></li>
|
||
<li><a href="#" tltle="페이지 이동"><span class="text_deco2"></span>[오픈] GNB 자주묻는 계정정보 노출 기능 오픈</a></li>
|
||
<li><a href="#" tltle="페이지 이동"><span class="text_deco2"></span>[알림] 문자 아르바이트 사기 피해 안내</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="service_center">
|
||
<h2><span class="text_deco"></span>고객센터</h2>
|
||
<div class="tablet table">
|
||
<div class="table_cell">
|
||
<div class="service_center_title">
|
||
<p>070-4786-0008</p>
|
||
<span>E-mail : help@iten.co.kr</span>
|
||
</div>
|
||
<div class="serive_info">
|
||
<p>월~금 : 09:30 ~ 18:30 / 점심시간 : 13:00 ~ 14:00<br>
|
||
토, 일요일 및 법정공휴일 휴무</p>
|
||
</div>
|
||
<ul class="serive_btn">
|
||
<li><button type="button" data-tooltip="chat_01">챗봇 문의</button></li>
|
||
<li><button>카카오톡 문의</button></li>
|
||
<li><button>원격지원</button></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div><!--// content3 영역 -->
|
||
</div><!--// content 영역 -->
|
||
<!-- footer 영역 -->
|
||
<footer id="footer" class="footer">
|
||
<div class="footer_top">
|
||
<div class="inner table">
|
||
<ul class="table_cell">
|
||
<li><a href="#">이용약관</a></li>
|
||
<li class="SortLine fwRg c_white"><a href="#">개인정보취급방침</a></li>
|
||
<li class="SortLine fwRg c_white"><a href="#">스팸관리정책</a></li>
|
||
<li class="SortLine"><a href="#">불법스팸예방안내</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
<div class="footer_body">
|
||
<div class="inner table">
|
||
<div class="table_cell">
|
||
<a href="#" class="footer_logo"><img src="/publish/images/CI_white.png" alt="문자온 CI"></a>
|
||
<div class="footer_info">
|
||
<p>주소 : 경기도 남양주시 다산중앙로 19번길 21 1027호, 1028호(블루웨일 지식산업센터 1차)</p>
|
||
<p>사업자번호 : 653-87-00858 ｜ 대표 : 유인식 ｜ 통신판매등록번호 : 제 2021-다산-0422 호</p>
|
||
<p>Copyright 2020 ⓒ MUNJAON co. Ltd, All rights reserved.</p>
|
||
</div>
|
||
<div class="footer_service_center">
|
||
<i></i>
|
||
<div>
|
||
<p>고객센터</p>
|
||
<span class="footer_service_num">070-4786-0008</span>
|
||
<span>E-mail : help@iten.co.kr</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer><!--// footer 영역 -->
|
||
</body></html>
|