<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html lang="ko">
<head>
<link rel="stylesheet" href="/publish/css/jquery.mCustomScrollbar.css">
<script src="/publish/js/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="/publish/js/content.js"></script>
<script src="/publish/js/calendar.js"></script>
<script src="/publish/js/popup.js"></script>
<script src="/js/txtByteChk.js"></script>

<script type="text/javascript">
function fn_egov_inqire_notice(bbsId, nttId) {
	document.frm.nttId.value = nttId;
	document.frm.bbsId.value = bbsId;
	document.frm.method = "get";
	document.frm.action = "<c:url value='/web/cop/bbsWeb/selectBoardDetail.do'/>";
	document.frm.submit();
}

function fn_egov_inqire_news_notice(bbsId, nttId) {
	document.frm.nttId.value = nttId;
	document.frm.bbsId.value = bbsId;
	document.frm.method = "get";
	document.frm.action = "<c:url value='/web/cop/bbs/NewsDetail.do'/>";
	document.frm.submit();
}

function footerSiteLinkPageGo (){
	var site = $('#footerSite').val();
    if(site == ""){
		alert("사이트를 선택해 주세요")	    	
    }else{
    	window.open(site);	
    }
}   

function footerSiteLinkPageTwoGo (){
	var site = $('#footerSiteTwo').val();
    if(site == ""){
		alert("사이트를 선택해 주세요")	    	
    }else{
    	window.open(site);	
    }
} 

function fn_egov_list_tab(){
	if("block"==$('#sec2_01').css('display')){
		location.href='/web/cop/bbsWeb/selectBoardList.do?bbsId=BBSMSTR_000000000431'; //공지사항	
	}else{
		location.href='/web/cop/bbsWeb/selectBoardList.do?bbsId=BBSMSTR_000000000441'; //채용공고	
	}
} 

var imgFilePath = []; // 최종 선택한 이미지 경로 저장 변수
$(document).ready(function (){
	
	$('.preiew_img').hide();
	$('.prePhoto').hide();
	
	//최초 화면 문자열 길이 체크해주기
	var strCon = $('#smsTxt').val();
	fnByteString(strCon);
	
	//문자 내용 입력시 바이트수 계산하기
	$('#smsTxt').keyup(function(e){
		
		var contents = $(this).val();
		fnByteString(contents);
		
	});//문자 바이트수 계산하기 끝
	
	
	//문자 바이트수 계산하기 함수
	function fnByteString(contents){
		
		var totalByte = 0; 
		var content = contents;
		$('#msgLeng').html("");
		$('#limitLeng').html("");
		var conLeng = conByteLeng(content);
		
		var photoSts = $('.delLi').length;
		if(photoSts > 0){
			
			$('#msgLeng').html(conLeng + " / ");
			$('#limitLeng').html("2000");
			$('.msg_com').html("그림");
			$('#msgType').val("6"); // 메세지 타입 설정
			document.getElementById("mmsSubject").disabled = false;
			
		}else{
			
			if(conLeng > 90){
				
				$('#msgLeng').html(conLeng + " / ");
				$('#limitLeng').html("2000");
				$('.msg_com').html("장문");
				$('#msgType').val("6"); // 메세지 타입 설정
				document.getElementById("mmsSubject").disabled = false;
				
			}else{
				
				$('#msgLeng').html(conLeng + " / ");
				$('#limitLeng').html("90");
				$('.msg_com').html("단문");
				$('#msgType').val("4"); // 메세지 타입 설정
				document.getElementById("mmsSubject").disabled = true;
				
			}
			
		}
		
		
		// 미리보기 데이터 입력해 주기 , 줄바꿈 문자 변환해주기
		var repContent = "";
		repContetnt = content.replace(/(?:\r\n|\r|\n)/g, '<br/>');
		$('.preview_auto').html(repContetnt);
		
		// 2000byte 초과시 메세지 알림
		if(conLeng > 2000){
			
			alert("문자 내용은 2000byte를 넘을 수 없습니다.");
			return false;
			
		}
		
	}
	
	
	//이미지 선택시 그림문자 처리
	var imgCnt = 1;
	$('.photoOnImg').click(function(){
		
		$('.preShort').hide();
		$('.prePhoto').show();
		
		if($('.msg_com').hasClass("msg_short") === true){
			
			$('.msg_com').removeClass("msg_short"); //단문/장문 클래스 삭제하고
			$('.msg_com').addClass("msg_photo"); // 그림문자용 클래스 삽입
			var contents = $('#smsTxt').val();
			fnByteString(contents);
			$('.msg_com').html("그림");
			$('#msgType').val("6"); // 메세지 타입 설정
			
			//제목 입력 항목 활성화
			document.getElementById("mmsSubject").disabled = false;
			
		}
		
		var imgSrc = $(this).attr("src");
		
		if(imgCnt > 3){
			
			alert("이미지는 3장만 선택할 수 있습니다.");
			return false;
			
		}else{
			
			//문자 내용 상단에 이미지 이름 영역 객체 추가해주기
			var imgPath = "Img0" + imgCnt + ".jpg";//"<img src=\"" + imgSrc + "\" />";
			var liPath = "<li class=\"delLi\"><p>" + imgPath + "</p><button type=\"button\" class=\"file_close\"><img class=\"delImg\" src=\"/publish/images/content/file_close.png\" alt=\"첨부파일 삭제\"></button></li>"
			$('.liOnImg').append(liPath);	
				
			//미리보기 보여주기
			$('.preiew_img').show();
			
			if(imgCnt == 1){
				
				var imgPath = "<div class=\"img_box preBoxF\"><img src=\"" + imgSrc + "\" /></div>";
				$('.preViewShort').append(imgPath);
				$('.photo_num_01').show();
				$('.photo_num_02').hide();
				$('.photo_num_03').hide();
				
			}else if(imgCnt == 2){
				
				var imgPath = "<div class=\"img_box preBoxF\"><img src=\"" + imgSrc + "\" /></div>";
				$('.preViewShort').append(imgPath);
				$('.photo_num_02').show();
					
			}else if(imgCnt == 3){
				
				var imgPath = "<div class=\"img_box preBoxF\"><img src=\"" + imgSrc + "\" /></div>";
				$('.preViewShort').append(imgPath);
				$('.photo_num_03').show();
				
			}
			
			//이미지 카운트 증가시키기
			imgCnt ++;
			
			// 배열에 선택한 이미지 경로 저장해주기
			imgFilePath.push(imgSrc);
			
		}
		
	});
	
	
	//그림문자 이미지 삭제 처리 - 동적으로 추가한 객체는 on 함수로 불러올 수 있다.
	$(document).on('click', '.delLi', function(){ 
	  
		var delImgPath = ""; //삭제하려는 이미지 경로 받아오기 
		var index = $(this).index(); // 현재 선택 된 객체 인덱스 번호 받아오기
		//선택한 내용의 이미지 li 객체 삭제
		$(this).remove();
		
		//미리보기 화면에서의 이미지 객체 삭제
		if(index == 0){
			
			//삭제하려는 이미지 경로 받아오기
			delImgPath = $('.preBoxF').eq(0).find("img").attr("src");
			
			//미리보기 이미지 객체 삭제
			$('.preBoxF').eq(0).remove();
			
		}else if(index == 1){
			
			//삭제하려는 이미지 경로 받아오기
			delImgPath = $('.preBoxF').eq(1).find("img").attr("src");
			
			$('.preBoxF').eq(1).remove();
			
		}else if(index == 2){
			
			//삭제하려는 이미지 경로 받아오기
			delImgPath = $('.preBoxF').eq(2).find("img").attr("src");
			
			$('.preBoxF').eq(2).remove();
			
		}
		
		// 삭제한 이미지 경로 배열에서 삭제해 주기
		for(var i=0; i < imgFilePath.length; i++){
			
			if(imgFilePath[i] === delImgPath){
				
				imgFilePath.splice(i, 1);
				i--;
			}
			
		}
		
		imgCnt--;
		
		//미리보기 포토 1,2,3 번 번호 표시 변경
		$('.photo_num_02').hide();
		$('.photo_num_03').hide();
		if(imgCnt > 2){
			
			$('.photo_num_01').show();
			$('.photo_num_02').show();
			
		}else if(imgCnt > 1){
			
			$('.photo_num_01').show();
			
		}else{
			
			//그림을 모두 삭제 했을때 단문으로 변경
			$('.preShort').show();
			$('.prePhoto').hide();
			
			$('.msg_com').removeClass("msg_photo");
			$('.msg_com').addClass("msg_short");
			$('#msgType').val("4"); // 메세지 타입 설정
			
			var contents = $('#smsTxt').val();
			fnByteString(contents);
			
		}
	}); 
	
	// 초기화 버튼 처리
	$('.btnReset').click(function(){
		
		$('.delLi').each(function(){
			
			$(this).remove();
			
		});
		
		$('.preBoxF').each(function(){
			
			$(this).remove();
			
		});
		
		//그림을 모두 삭제 했을때 단문으로 변경
		$('.preShort').show();
		$('.prePhoto').hide();
		
		$('.msg_com').removeClass("msg_photo");
		$('.msg_com').addClass("msg_short");
		$('#msgType').val("4"); // 메세지 타입 설정
		
		//메세지 내용 초기화
		$('#smsTxt').val("");
		fnByteString("");
		
	});
	
	$('.letterMsg').click(function(){
		
		var smsTxt = $(this).find('.msg_text').text();
		$('#smsTxt').val("");
		$('#smsTxt').val(smsTxt);
		fnByteString(smsTxt);
		
		
	});
	
	$('.tDep1_mType').click(function(){
		
		var mType = $(this).find('.on_active').text();
		var form = document.letterForm;
		
		
		if(mType == "전체"){
			
			form.memberType.value = "";
			
		}else if(mType == "기업"){
			
			form.memberType.value = "B";
			
		}else{
			
			form.memberType.value = "P";
			
		}
		
		//문자 리스트 불러오기
		fnLetterListAjax();
		
	});
	
	$('.tDep2_letType').click(function(){
		
		var letterType = $(this).find('.on').attr("value");
		var form = document.letterForm;
		
		form.letterType.value = letterType;
		
		//문자 리스트 불러오기
		fnLetterListAjax();
		
	});
	
	$('.tDep3_cateCode').click(function(){
		
		var cateCode = $(this).find('.on').attr("value");
		var form = document.letterForm;
		
		form.categoryCode.value = cateCode;
		
		//문자 리스트 불러오기
		fnLetterListAjax();
		
	});
	
	$('.tDep4_hashTag').click(function(){
		
		var hashTag = $(this).find('.on').attr("value");
		var form = document.letterForm;
		
		form.hashTag.value = hashTag;
		
		//문자 리스트 불러오기
		fnLetterListAjax();
		
	});
	
	
	
});


function fnLetterListAjax(){
	
	var sendData = $(document.letterForm).serializeArray();
	$("#letterLoad").load("/web/mjon/msgdata/selectLetterDataListAjax.do", sendData ,function(response, status, xhr){
		if(document.letterForm.searchKeyword.value == ''){
			$('.bottom_content .area_total_count').hide();
		}
	});
	
	
}

function fnSetCookiePopup( name, value, expiredays ) { // 쿠키설정
	  var todayDate = new Date();
	  todayDate.setDate( todayDate.getDate() + expiredays );
	  document.cookie = name + "=" + escape( value ) + "; path=/; expires=" + todayDate.toGMTString() + ";"
}

function fnGetCookie(name) { //쿠키정보 가져오기
	  var prefix = name + "=";
	  var cookieStartIndex = document.cookie.indexOf(prefix);
	  if (cookieStartIndex == -1) return null;
	  var cookieEndIndex = document.cookie.indexOf(";", cookieStartIndex + prefix.length);
	  if (cookieEndIndex == -1) cookieEndIndex = document.cookie.length;
	  return unescape(document.cookie.substring(cookieStartIndex + prefix.length, cookieEndIndex));
}

function fn_sendMsgData(){
	
	var form = document.msgForm;
	
	
	if(form.callFrom.value == ""){
		
		alert("발신번호를 입력해 주세요.");
		return false;
		
	}
	
	if(form.msgType.value == "6" && form.mmsSubject.value == ""){
		
		alert("제목을 입력해주세요.");
		return false;
		
	}
	
	if(imgFilePath.length == 0){ // 그림문자일 경우 내용이 없어도 됨 , 장문 문자일 경우만 문자내용 체크함
		
		if(form.smsTxt.value == ""){
			
			alert("문자 내용을 입력해 주세요.");
			return false;
			
		}
		
	}
	
	if(form.callTo.value == ""){
		
		alert("수신번호를 입력해 주세요.");
		return false;
		
	}
	
	
	if(confirm("문자를 전송하시겠습니까?")){
		
		form.imgFilePath.value = imgFilePath; // 저장한 이미지 경로 담아주기
		form.action="<c:url value='/web/mjon/msgdata/sendMsgData.do'/>";
		form.submit();
		
	}
	
}

</script>
</head>
<body>
    <div class="inner">
        <!-- send top -->
        <div class="send_top">
            <!-- tab button -->
            <ul class="tabType1">
                <li class="tab active"><button type="button" onclick="TabType1(this,'1');">단문 · 장문 · 그림 문자</button></li>
                <li class="tab"><button type="button" onclick="TabType1(this,'2');">대량 문자(엑셀·TXT)</button></li>
            </ul><!--// tab button -->
			<!-- tab content1 -->
			<form id="msgForm" name="msgForm" method="post">
				<input type="hidden" id="msgType" name="msgType" value="4" /><!-- 문자 종류 : 단문 - 4, 장문/그림 - 6 -->
				<input type="hidden" id="imgFilePath" name="imgFilePath" value="" /><!-- 선택 이미지 파일 경로 정보 , 로 구분 최대 3장까지 -->
	            <div class="top_content current" id="tab1_1">
	                <div class="heading">
	                    <h2>문자전송</h2>
	                    <ul class="send_price">
	                        <li><span class="type">단문</span><span class="price">8.2</span>원</li>
	                        <li class="price_line"><span class="type">장문</span><span class="price">24.6</span>원</li>
	                        <li class="price_line"><span class="type">그림</span><span class="price">57.3</span>원</li>
	                    </ul>
	                </div>
	                <div class="titBox">
	                    <p>- 90byte 초과 시, 장문으로 전환됩니다. 장문 문자는 최대 2,000byte까지 작성할 수  있습니다.</p>
						<p>- 포토문자 1건에 포토 최대 3장 첨부가능  [권장 사이즈 : 640 x 960픽셀 / 최대용량 : 10MB]</p>
	                    <p>- 광고성 메시지는 반드시 유의사항 확인 후 발송해 주시기 바랍니다. <span> [광고문자 유의사항 보기]</span></p>
	                    <button type="button"><i></i>사용안내</button>
	                </div>
	                <div class="send_general">
	                    <div class="send_left">
	                        <table class="tType1">
	                            <caption>일반 문자보내기 분류 번호 내용 등을 입력하는 표</caption>
	                            <colgroup>
	                                <col style="width: 100px;">
	                                <col style="width: auto;">
	                            </colgroup>
	                            <tbody>
	                                <tr>
	                                    <th scope="row">문자분류</th>
	                                    <td class="send_cf">
	                                        <input id="radio1" type="radio"name="send_clas" checked="checked">
	                                        <label for="radio1">일반</label>
	                                        <input id="radio2" type="radio" name="send_clas">
	                                        <label for="radio2">광고</label>
	                                    </td>
	                                </tr>
	                                <tr>
	                                    <th scope="row">발신번호</th>
	                                    <td class="put_num">
	                                        <label for="num" class="label"></label>
	                                        <input type="text" size="35" id="callFrom" name="callFrom" placeholder="010-1234-5678" onfocus="this.placeholder=''" onblur="this.placeholder='010-1234-5678'">
	                                        <button type="button" class="btnType btnType6">번호변경</button>
	                                    </td>
	                                </tr>
						<tr>
	                                    <th scope="row">제목</th>
	                                    <td>
	                                        <!-- 단문일 때 -->
								<label for="mmsSubject" class="label"></label>
								<input type="text" size="20" id="mmsSubject" name="mmsSubject" class="w100" placeholder=""  onfocus="this.placeholder=''" >
								<!-- 장문일 때 -->
								<!-- <input type="text" size="20" id="mmsSubject" name="mmsSubject" class="w100" placeholder="제목을 입력해주세요 (최대30byte, 발송관리용)" onfocus="this.placeholder=''" onblur="this.placeholder='제목을 입력해주세요 (최대30byte, 발송관리용)'"> -->
	                                    </td>
	                                </tr>
						<!-- 단문 -->
										<tr>
	                                        <th scope="row">내용</th>
	                                        <td class="putText">
	                                            <div class="clearfix">
	                                                <div class="put_left short">
	                                                	<ul class="liOnImg">
															<!-- <li id="onImg01"><p></p><button type="button" class="file_close"><img class="delImg" src="/publish/images/content/file_close.png" alt="첨부파일 삭제"></button></li>
															<li id="onImg02"><p></p><button type="button" class="file_close"><img class="delImg" src="/publish/images/content/file_close.png" alt="첨부파일 삭제"></button></li>
															<li id="onImg03"><p></p><button type="button" class="file_close"><img class="delImg" src="/publish/images/content/file_close.png" alt="첨부파일 삭제"></button></li> -->
														</ul>
	                                                    <label for="smsTxt" class="label"></label>
	                                                    <textarea id="smsTxt" name="smsTxt" class="put_text">
	해마다 찾아오는 봄이지만
	봄맞이 대청소라는 말처럼,
	새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
	    
	"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을 
	깨끗이 비워보는 겁니다.
	    
	새봄에 새마음으로 새롭게 시작해 보는 겁니다.
	
	해마다 찾아오는 봄이지만
	봄맞이 대청소라는 말처럼,
	새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
	    
	"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을 
	깨끗이 비워보는 겁니다.
	    
	새봄에 새마음으로 새롭게 시작해 보는 겁니다.
	
	해마다 찾아오는 봄이지만
	봄맞이 대청소라는 말처럼,
	새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
	    
	"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을 
	깨끗이 비워보는 겁니다.
	    
	새봄에 새마음으로 새롭게 시작해 보는 겁니다.
	                                                    </textarea>
	                                                    <div class="text_length">
															<div>
	                                                        	<p>
		                                                        	<span class="fwMd" id="msgLeng">0 /</span>
		                                                        	<span class="c_002c9a fwMd" id="limitLeng"> 90</span>byte
	                                                        	</p>
	                                                        	<span class="msg_com msg_short">단문</span>
	                                                        	<!-- <span class="msg_com msg_photo">그림</span> -->
															</div>
	                                                    </div>
	                                                </div>
	                                                <div class="put_right">
	                                                    <button type="button" class="btnType btnType7">특수문자</button>
	                                                    <button type="button" class="btnType btnType7">특정문구 일괄변환</button>
	                                                    <button type="button" class="btnType btnType7">내문자함</button>
	                                                    <button type="button" class="btnType btnType8" onclick="showPotoediter();">이미지 불러오기</button>
	                                                <div class="send_btnWrap">
	                                                    <button type="button" class="btnType btnType9">문자저장</button>
	                                                    <button type="button" class="btnType btnType9 btnReset">초기화</button>
	                                                </div>
	                                            </div>
	                                        </div>
	                                    </td>
	                                </tr>
                                <tr>
                                    <th scope="row">받는사람</th>
                                    <td class="send_list">
                                        <div class="list_left">
                                            <div class="add_num">
                                                <label for="" class="label"></label>
                                                <input type="text" id="callTo" name="callTo" placeholder="번호를 입력하세요." onfocus="this.placeholder=''" onblur="this.placeholder='번호를 입력하세요.'">
                                                <button type="button" class="btnType btnType6 addCallToF">번호추가</button>
                                                <span>* 중복번호는 한번만 발송됩니다.</span>
                                            </div>
								<div class="numOfCase">
									<p>총 <span>120</span>건 /</p>
									<p>중복 <span>9</span>건</p>
								</div>
                                            <div>
                                                <div class="listType list01">
													<div class="list_table list_head">
														<div class="cb_wrap">
															<label for="" class="label"></label>
															<input type="checkbox">
														</div>
														<div class="list_table_num">
															<p>번호</p>
															<img src="/publish/images/sortUp.png">
															<img src="/publish/images/sortDown.png">
														</div>
														<div class="list_table_name">
															<p>이름</p>
															<img src="/publish/images/sortUp.png">
															<img src="/publish/images/sortDown.png">
														</div>
													</div>
													<div class="list_table list_body">
														<div class="cb_wrap">
															<label for="" class="label"></label>
															<input type="checkbox">
														</div>
														<div class="list_table_num">
															<p>010-1234-5678</p>
														</div>
														<div class="list_table_name">
															<p>홍길동</p>
														</div>
													</div>
													<div class="list_table list_body">
														<div class="cb_wrap">
															<label for="" class="label"></label>
															<input type="checkbox">
														</div>
														<div class="list_table_num">
															<p>010-1234-5678</p>
														</div>
														<div class="list_table_name">
															<p>홍길동</p>
														</div>
													</div>
												</div>
                                                <div class="list_bottom">
                                                    <div class="remove_btnWrap">
                                                        <button type="button"><i></i>선택삭제</button>
                                                        <button type="button"><i></i>전체삭제</button>
                                                    </div>
													<!--
													<div class="add_btn">
														<button type="button" class="btnType btnType9">주소록에 저장</button>
													</div> -->
                                                </div>
                                            </div>
                                        </div>
                                        <div class="add_remove">
                                            <button type="button" class="add"><i></i>추가</button>
                                            <button type="button" class="remove"><i></i>삭제</button>
                                        </div>
                                        <div class="list_right">
								<div style="height: 90px;">
                                            	<div class="list_btnWrap">
                                            	    <button type="button" class="btnType 	btnType12">최근 전송내역</button>
                                            	    <button type="button" class="btnType 	btnType12">자주보내는 번호</button>
                                            	    <button type="button" class="btnType 	btnType12">그룹 보내기</button>
                                            	    <button type="button" class="btnType btnType13 	c1">주소록 불러오기</button>
                                            	    <button type="button" class="btnType btnType13 	c2">Txt파일 불러오기</button>
                                            	    <button type="button" class="btnType btnType13 	c3">액셀 불러오기</button>
                                            	</div>
								</div>
                                            <div>
                                                <div class="listType list02">
										<div class="list_table list_head">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>번호</p>
												<img src="/publish/images/sortUp.png">
												<img src="/publish/images/sortDown.png">
											</div>
											<div class="list_table_name">
												<p>이름</p>
												<img src="/publish/images/sortUp.png">
												<img src="/publish/images/sortDown.png">
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
										<div class="list_table list_body">
											<div class="cb_wrap">
												<label for="" class="label"></label>
												<input type="checkbox">
											</div>
											<div class="list_table_num">
												<p>010-1234-5678</p>
											</div>
											<div class="list_table_name">
												<p>홍길동</p>
											</div>
										</div>
									</div>
                                                <div class="list_bottom">
                                                    <div class="remove_btnWrap">
                                                        <button type="button"><i></i>선택삭제</button>
                                                        <button type="button"><i></i>전체삭제</button>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                                <tr>
                                    <th colspan="2" class="billingAmount">
                                        <div class="clearfix">
                                            <p>결제금액 :</p>
                                            <p class="price"><span>200,000</span>원<span>(부가세 포함)</span></p>
                                        </div>
                                        <button type="button"><i></i>계산하기</button>
                                    </th>
                                </tr>
                                <tr>
                                    <th scope="row">추천인 ID</th>
                                    <td class="check_num">
                                        <input id="radio5" type="radio"name="recom" checked="checked">
                                        <label for="radio5">없음</label>
                                        <input id="radio6" type="radio" name="recom">
                                        <label for="radio6">있음</label>
                                        <div>
                                            <label for="id" class="label"></label>
                                            <input type="text" size="20" id="id" placeholder="추천인 아이디 입력" onfocus="this.placeholder=''" onblur="this.placeholder='추천인 아이디 입력'">
                                            <button type="button" class="btnType btnType9">확인</button>
                                        </div>
                                    </td>
                                </tr>            
                            </tbody>
                        </table>
                    </div>
	                <div class="send_right">
                        <div class="phone">
							<div>
								<p><img src="/publish/images/search.png">미리보기</p>
								<div class="text_length2 clearfix preShort">
									<span class="msg_com msg_short">단문</span>
									<div>
										<span>글자크기</span>
										<button type="button"><img src="/publish/images/content/font_plus.png"></button>
										<button type="button"><img src="/publish/images/content/font_minus.png"></button>
									</div>
								</div>
								<div class="text_length2 clearfix prePhoto">
									<span class="msg_com msg_photo">포토</span>
									<ul class="photo_msg_num">
										<li class="photo_num_01" onclick="imgClick(0);"><a href="#none">1</a></li>
										<li class="photo_num_02" onclick="imgClick(1);"><a href="#none">2</a></li>
										<li class="photo_num_03" onclick="imgClick(2);"><a href="#none">3</a></li>
									</ul>
									<div>
										<span>글자크기</span>
										<button type="button"><img src="/publish/images/content/font_plus.png"></button>
										<button type="button"><img src="/publish/images/content/font_minus.png"></button>
									</div>
								</div>
								<!-- 텍스트 미리보기 -->
								<div class="text_preview">
									<div class="preiew_img preViewShort">
										<!-- <div class="img_box preBox01">
											<img src="/publish/images/content/photo_sample01.jpg">
										</div>
										<div class="img_box preBox02">
											<img src="/publish/images/content/photo_sample01.jpg">
										</div>
										<div class="img_box preBox03">
											<img src="/publish/images/content/excel.jpg">
										</div> -->
									</div>
									<div class="preview_auto">
										해마다 찾아오는 봄이지만
										봄맞이 대청소라는 말처럼,
										새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
										<br><br>
										"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
										깨끗이 비워보는 겁니다.
										해마다 찾아오는 봄이지만
										봄맞이 대청소라는 말처럼,
										새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
										<br><br>
										"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
										깨끗이 비워보는 겁니다.
										해마다 찾아오는 봄이지만
										봄맞이 대청소라는 말처럼,
										새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
										<br><br>
										"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
										깨끗이 비워보는 겁니다.
										해마다 찾아오는 봄이지만
										봄맞이 대청소라는 말처럼,
										새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
										<br><br>
										"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
										깨끗이 비워보는 겁니다.
									</div>
								</div>
								<!-- //텍스트 미리보기 -->
							</div>
						</div>
                            <p class="addText">※ 단말기 설정에 따라 다르게 보일 수 있습니다</p>
                            <div class="send_rev">
                                <div class="rev_radio">
                                    <input id="radio7" type="radio"name="reser" checked="checked">
                                    <label for="radio7">즉시</label>
                                    <input id="radio8" type="radio" name="reser">
                                    <label for="radio8">예약</label>
                                </div>
                                <div>
                                    <div class="rev_top">
                                        <span>날짜 :</span>
                                        <div class="calendar">
                                            <input type="text" title="예약 전송 시 날짜 선택" id="day"><button id="txtDate1" value="" title="캘린더 팝업 열기" onclick="fnPopUpCalendar(txtDate1,txtDate1,'yyyy/mm/dd')" class="text_box1 calInput"><img src="/publish/images/calendar/calendarIcon.png"></button>
                                        </div>
                                        <label for="" class="label">시 선택</label>
										<div class="selBox">
	                                       	<select class="selType1">
	                                       	    <option>00시</option>
	                                       	    <option>10시</option>
	                                       	    <option>20시</option>
	                                       	</select>
	                                       	<label for="" class="label">분 선택</label>
	                                       	<select class="selType1">
	                                       	    <option>00분</option>
	                                       	    <option>25분</option>
	                                       	    <option>50분</option>
	                                       	</select>
										</div>
                                    </div>
                                    <div class="rev_bottom">
                                        <input type="checkbox">
                                        <label for="">분할전송</label>
                                        <select class="selType1">
                                            <option>00시</option>
                                            <option>10시</option>
                                            <option>20시</option>
                                        </select>
                                        <label for="">건</label>
                                        <select class="selType1">
                                            <option>00분</option>
                                            <option>25분</option>
                                            <option>50분</option>
                                        </select>
                                        <label>간격</label>
                                    </div>
                                </div>
                            </div>
                            <div class="send_btn">
                                <button type="button" class="btnType btnType10">테스트 발송<img src="/publish/images/content/qmIcon.png"></button>
                                <button type="button" class="btnType btnType11" onclick="javascript:fn_sendMsgData(); return false;">발송하기</button>
                            </div>
		                </div>
		            </div>
		        </div><!--// tab content1 -->
	        </form>
			<!-- tab content2 -->
            <div class="top_content get_excel" id="tab1_2">
				<div class="heading">
                    <h2>엑셀문자</h2>
                    <ul class="send_price">
                        <li><span class="type">단문</span><span class="price">8.2</span>원</li>
                        <li class="price_line"><span class="type">장문</span><span class="price">24.6</span>원</li>
                        <li class="price_line"><span class="type">그림</span><span class="price">57.3</span>원</li>
                    </ul>
                </div>
                <div class="titBox">
                    <p>- 각각 다른 사람에게 다른 내용의 메시지를 한번에 보낼 수 있습니다. (최대 1만 건)</p>
                    <p>- 광고성 메시지는 반드시 유의사항 확인 후 발송해 주시기 바랍니다. <span> [광고문자 유의사항 보기]</span></p>
					<p>- 엑셀영역은 복사, 붙여넣기가 가능합니다.</p>
                    <button type="button"><i></i>사용안내</button>
                </div>
                <div class="send_general">
                    <div class="send_left">
                        <table class="tType1">
                            <caption>일반 문자보내기 분류 번호 내용 등을 입력하는 표</caption>
                            <colgroup>
                                <col style="width: 100px;">
                                <col style="width: auto;">
                            </colgroup>
                            <tbody>
                                <tr>
                                    <th scope="row">문자분류</th>
                                    <td class="send_cf">
                                        <input id="radio1" type="radio"name="send_clas" checked="checked">
                                        <label for="radio1">일반</label>
                                        <input id="radio2" type="radio" name="send_clas">
                                        <label for="radio2">광고</label>
                                    </td>
                                </tr>
                                <tr>
                                    <th scope="row">발신번호</th>
                                    <td class="put_num">
                                        <label for="num" class="label"></label>
                                        <input type="text" size="35" id="num" placeholder="010-1234-5678" onfocus="this.placeholder=''" onblur="this.placeholder='010-1234-5678'">
                                        <button type="button" class="btnType btnType6">번호변경</button>
                                    </td>
                                </tr>
								<tr>
                                    <th scope="row">제목</th>
                                    <td>
                                        <!-- 단문일 때 -->
										<!-- <label for="text" class="label"></label>
										<input type="text" size="20" id="text" class="w100" placeholder=""  onfocus="this.placeholder=''" disabled> -->
										<!-- 장문일 때 -->
										<input type="text" size="20" id="text" class="w100" placeholder="제목을 입력해주세요 (최대30byte, 발송관리용)" onfocus="this.placeholder=''" onblur="this.placeholder='제목을 입력해주세요 (최대30byte, 발송관리용)'">
                                        </td>
                                    </tr>
                                    <tr>
                                        <th scope="row">내용</th>
                                        <td class="putText">
                                            <div class="clearfix">
                                                <div class="put_left long">
                                                    <label for="textarea" class="label"></label>
                                                    <textarea id="textarea" class="put_text">
해마다 찾아오는 봄이지만
봄맞이 대청소라는 말처럼,
새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
    
"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을 
깨끗이 비워보는 겁니다.
    
새봄에 새마음으로 새롭게 시작해 보는 겁니다.

해마다 찾아오는 봄이지만
봄맞이 대청소라는 말처럼,
새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
    
"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을 
깨끗이 비워보는 겁니다.
    
새봄에 새마음으로 새롭게 시작해 보는 겁니다.

해마다 찾아오는 봄이지만
봄맞이 대청소라는 말처럼,
새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
    
"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을 
깨끗이 비워보는 겁니다.
    
새봄에 새마음으로 새롭게 시작해 보는 겁니다.
                                                    </textarea>
                                                    <div class="text_length">
														<div>
                                                        	<p><span class="fwMd">15 /<span><span class="c_002c9a fwMd"> 2000</span>byte</p>
                                                        	<span class="msg_com msg_long">장문</span>
														</div>
                                                    </div>
                                                </div>
                                                <div class="put_right">
                                                    <button type="button" class="btnType btnType7">특수문자</button>
                                                    <button type="button" class="btnType btnType7">특정문구 일괄변환</button>
                                                    <button type="button" class="btnType btnType7">내문자함</button>
                                                    <button type="button" class="btnType btnType8" onclick="showPotoediter();">이미지 불러오기</button>
                                                <div class="send_btnWrap">
                                                    <button type="button" class="btnType btnType9">문자저장</button>
                                                    <button type="button" class="btnType btnType9">초기화</button>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>     
                            </tbody>
                        </table>
                    </div>
                    <div class="send_right">
                        <div class="phone">
					<div>
					<p><img src="/publish/images/search.png">미리보기</p>
					<div class="text_length2 clearfix">
						<span class="msg_com msg_long">장문</span>
						<div>
							<span>글자크기</span>
							<button type="button"><img src="/publish/images/content/font_plus.png"></button>
							<button type="button"><img src="/publish/images/content/font_minus.png"></button>
						</div>
					</div>
					<!-- 텍스트 미리보기 -->
					<div class="text_preview">
						<div class="preview_auto">
							해마다 찾아오는 봄이지만
							봄맞이 대청소라는 말처럼,
							새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
							<br><br>
							"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
							깨끗이 비워보는 겁니다.
							해마다 찾아오는 봄이지만
							봄맞이 대청소라는 말처럼,
							새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
							<br><br>
							"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
							깨끗이 비워보는 겁니다.
							해마다 찾아오는 봄이지만
							봄맞이 대청소라는 말처럼,
							새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
							<br><br>
							"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
							깨끗이 비워보는 겁니다.
							해마다 찾아오는 봄이지만
							봄맞이 대청소라는 말처럼,
							새 봄을 맞아 봄맞이 마음청소 한번하고 가실께요~ㅎㅎ
							<br><br>
							"새술은 새부대에"라는 말처럼 버리고 싶은 기억들을
							깨끗이 비워보는 겁니다.
						</div>
					</div>
					<!-- //텍스트 미리보기 -->
				</div>
			</div>
            <p class="addText">※ 단말기 설정에 따라 다르게 보일 수 있습니다</p>
        </div>
    </div>
	<!-- excel 대량 불러오기 -->
	<div class="excelWrap">
		<div>
			<div class="excel_selBox clearfix">
				<select class="selType1">
					<option>그룹선택</option>
					<option>그룹선택</option>
					<option>그룹선택</option>
				</select>
				<label for="" class="label">그룹 선택</label>
				<span>* 보내실 주소록 그룹을 선택하세요.</span>
				<button type="button" class="btnType btnType14"><i></i>번호입력형식안내</button>
			</div>
			<div class="excel_middle">
				<div class="select_btnWrap clearfix">
					<div>
						<button type="button"><i></i>전체선택(ctrl+A)</button>
						<button type="button"><i></i>삭제(Del)</button>
						<button type="button">복사(ctrl+C)</button>
						<button type="button">붙여넣기(ctrl+V)</button>
					</div>
					<div>
						<button type="button">주소록에 등록</button>
						<button type="button"><i></i>엑셀 업로드</button>
						<button type="button"><i></i>엑셀 다운로드</button>
					</div>
				</div>
			</div>
			<img src="/publish/images/content/excel.jpg" style="width: 100%;">
		</div>
	</div>
	<div class="send_general sec">
        <div class="send_left">
            <table class="tType1">
                <caption>일반 문자보내기 분류 번호 내용 등을 입력하는 표</caption>
                <colgroup>
                    <col style="width: 100px;">
                    <col style="width: auto;">
                </colgroup>
                <tbody>
                    <tr>
                        <th colspan="2" class="billingAmount">
                            <div class="clearfix">
                                <p>결제금액 :</p>
                                <p class="price"><span>200,000</span>원<span>(부가세 포함)</span></p>
                            </div>
                            <button type="button"><i></i>계산하기</button>
                        </th>
                    </tr>
                    <tr>
                        <th scope="row">추천인 ID</th>
                        <td class="check_num">
                            <input id="radio5" type="radio"name="recom" checked="checked">
                            <label for="radio5">없음</label>
                            <input id="radio6" type="radio" name="recom">
                            <label for="radio6">있음</label>
                            <div>
                                <label for="id" class="label"></label>
                                <input type="text" size="20" id="id" placeholder="추천인 아이디 입력" onfocus="this.placeholder=''" onblur="this.placeholder='추천인 아이디 입력'">
                                <button type="button" class="btnType btnType9">확인</button>
                            </div>
                        </td>
                    </tr>            
                </tbody>
            </table>
        </div>
        <div class="send_right">
            <div class="send_rev">
                <div class="rev_radio">
                    <input id="radio7" type="radio"name="reser" checked="checked">
                    <label for="radio7">즉시</label>
                    <input id="radio8" type="radio" name="reser">
                    <label for="radio8">예약</label>
                </div>
                <div>
                    <div class="rev_top">
                        <span>날짜 :</span>
                        <div class="calendar">
                            <input type="text" title="예약 전송 시 날짜 선택"id="day"><button id="txtDate1" value="" title="캘린더 팝업열기" onclick="fnPopUpCalendar(txtDate1,txtDate1,'yyyy/mm/dd'" class="text_box1 calInput"><img src="/publish/images/calendar/calendarIcon.png"></button>
                        </div>
                            <label for="" class="label">시 선택</label>
							<div class="selBox">
                               	<select class="selType1">
                               	    <option>00시</option>
                               	    <option>10시</option>
                               	    <option>20시</option>
                               	</select>
                               	<label for="" class="label">분 선택</label>
                               	<select class="selType1">
                               	    <option>00분</option>
                               	    <option>25분</option>
                               	    <option>50분</option>
                               	</select>
							</div>
                            </div>
                            <div class="rev_bottom">
                                <input type="checkbox">
                                <label for="">분할전송</label>
                                <select class="selType1">
                                    <option>00시</option>
                                    <option>10시</option>
                                    <option>20시</option>
                                </select>
                                <label for="">건</label>
                                <select class="selType1">
                                    <option>00분</option>
                                    <option>25분</option>
                                    <option>50분</option>
                                </select>
                                <label>간격</label>
                            </div>
                        </div>
                   	</div>
                    <div class="send_btn">
                        <button type="button" class="btnType btnType10">테스트 발송<img src="/publish/images/content/qmIcon.png"></button>
                        <button type="button" class="btnType btnType11">발송하기</button>
                    </div>
                </div>
           	</div>
		</div><!--// tab content2 -->
	</div><!--// send top -->
<!-- send bottom -->
<div class="send_bottom">
	<!-- tab button -->
<ul class="tabType2">
	<li class="tab active"><button type="button" onclick="TabType2(this,'1');">문자 샘플</button></li>
	<li class="tab"><button type="button" onclick="TabType2(this,'2');">그림문자 샘플</button></li>
	<li class="tab"><button type="button" onclick="TabType2(this,'3');">지도/약도 추가</button></li>
	<li class="tab"><button type="button" onclick="TabType2(this,'4');">내 문자함</button></li>
</ul>
<!--// tab button -->
<form id="letterForm" name="letterForm" method="post">
	<input type="hidden" id="letterType" name="letterType" value="<c:out value='${letterVO.letterType}'/>"/>
	<input type="hidden" id="memberType" name="memberType" value="<c:out value='${letterVO.memberType}'/>"/>
	<input type="hidden" id="categoryCode" name="categoryCode" value="<c:out value='${letterVO.categoryCode}'/>"/>
	<input type="hidden" id="hashTag" name="hashTag" value="<c:out value='${letterVO.hashTag}'/>"/>
	<input name="pageIndex" type="hidden" value="<c:out value='${letterVO.pageIndex}' default='1' /> "/>

	<div class="search_sample">
		<input type="text" id="searchKeyword" name="searchKeyword" value="<c:out value='${letterVO.searchKeyword}'/>" placeholder="문자샘플 검색하기" onfocus="this.placeholder=''" onblur="this.placeholder='문자샘플 검색하기'">
		<button><img src="/publish/images/search02.png" alt=""></button>
	</div>
	<!-- tab content1 -->
	<div class="bottom_content current" id="tab2_1">
		<div class="area_tabs">
			<div class="top_tab">
				<!-- <div class="tab_depth1 tDep1_mType">
					<a href="#none" class="on" value="">전체</a>
					<a href="#none" value="B">기업</a>
					<a href="#none" value="P">개인</a>
					<div class="on_active">전체</div>
				</div> -->
				<div class="tab_depth2 tDep2_letType">
					<a href="#none" class="on" value="S">단문문자</a>
					<a href="#none" value="L">장문문자</a>
				</div>
				<select name="pageUnit" id="pageUnit">
					<option value="10">2줄보기</option>
					<option value="20">4줄보기</option>
					<option value="30">6줄보기</option>
				</select>
			</div>
			<div class="bottom_tab">
				<div class="tab_depth3 tDep3_cateCode">
					<a href="#none" class="on" value="all">All</a>
					<c:forEach var="cateList" items="${cateCodeList}" varStatus="status">
						<c:if test="${cateList.cateDepth eq '2'}">
							<a href="#none" value="<c:out value='${cateList.cateNo}'/>"><c:out value="${cateList.cateNm}"/></a>
						</c:if>
					</c:forEach>
				</div>
				<div class="tab_depth4 tDep4_hashTag">
					<a href="#none" class="on" value="봄인사">#봄인사</a>
					<a href="#none" value="좋은글">#좋은글</a>
					<a href="#none" value="초대/답례">#초대/답례</a>
				</div>
				<div class="customReq">
					<button type="button"><i></i>맞춤제작 요청</button>
				</div>
			</div>
		</div>
		<div id="letterLoad">
			<%-- <ul class="area_tabcontent msg_sample ">
				<c:forEach var="letterList" items="${resultLetterList}" varStatus="status">
					<li class="letterMsg">
						<p class="tit_text"><c:out value="${letterList.letterSj}"/>화이트데이</p>
						<div class="msg_cont">
							<div class="msg_text"><c:out value="${letterList.letterCn}"/></div>
						</div>
						<p class="info_text">0 / <span class="limit_text">90</span>byte</p>
					</li>
				</c:forEach>
			</ul> --%>
			<!-- pagination -->
			<!-- 페이지 네비게이션 시작 -->
			<%-- <c:if test="${!empty resultLetterList}">
			   <ul class="pagination">
			       <ui:pagination paginationInfo = "${paginationInfo}"  type="imageWeb" jsFunction="linkPage" />
			   </ul>
		    </c:if> --%>
			<!-- pagination -->
		</div>
	</div><!--// tab content1 -->
</form>
<!--// tab content2 -->
<div class="bottom_content" id="tab2_2">
	<div class="area_tabs">
		<div class="top_tab">
			<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>
			</div>
			<select name="" id="">
				<option value="">2줄보기</option>
				<option value="">4줄보기</option>
				<option value="">6줄보기</option>
			</select>
		</div>
		<div class="bottom_tab">
			<div class="tab_depth3">
				<a href="#none" class="on">All</a>
				<c:forEach var="cateList" items="${cateCodeList}" varStatus="status">
					<c:if test="${cateList.cateDepth eq '2'}">
						<a href="#none"><c:out value="${cateList.cateNm}"/></a>
					</c:if>
					<!-- <a href="#none">요일</a>-->
				</c:forEach>
			</div>
			<div class="tab_depth4">
				<a href="#none" class="on">#봄인사</a>
				<a href="#none">#좋은글</a>
				<a href="#none">#초대/답례</a>
			</div>
		</div>
	</div>
	<ul class="area_tabcontent photo_sample">
	
		<c:forEach var="photoList" items="${resultPhoList}" varStatus="status">
			<li class="hover_photo">
				<c:set var="strImgPath" value="${photoList.fileStreCours}/${photoList.streFileNm}.${photoList.fileExtsn}"/>
				<div class="hover_cont"><img src="${strImgPath}" alt=""></div>
				<p class="tit_text"><%-- <c:out value="${photoList.letterSj}"/> --%>제목</p>
				<div class="photo_cont">
					<img class="photoOnImg" src="<c:url value='${strImgPath}'/>" alt="">
				</div>
			</li>	
		</c:forEach>
	</ul>
	<!-- pagination -->
	<!-- 페이지 네비게이션 시작 -->
	<c:if test="${!empty resultPhoList}">
	   <ul class="pagination">
	       <ui:pagination paginationInfo = "${paginationInfo}"  type="imageWeb" jsFunction="linkPage" />
	   </ul>
    </c:if>
	<!-- pagination -->
</div><!--// tab content2 -->
<!--tab content3 -->
<div style="background-color: wheat;" class="bottom_content" id="tab2_3"></div><!--// tab content3 -->
<!-- tab content4 -->
<div style="background-color: blueviolet;" class="bottom_content" id="tab2_4"></div><!--// tab content4 -->

	</div>
</div>
</body>
</html>