dbs289
/
LifeCenter


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
							<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:include page="${data._INCLUDE}/header.jsp"></jsp:include>
<script>
$( function(){
    $( "div.accept-wrap span.detail" ).on( "click", function(){
        var $this = $( this );
        $this.closest( "li" ).find( "div.content-wrap" ).fadeIn( 400 );
    });
    
    $( "div.content-wrap button.ok" ).on( "click", function(){
        $( this ).closest( "div.content-wrap" ).hide().prev( "a" ).find( "input[type='checkbox']" ).prop( "checked", true );
        checkComplete();
    });
    
    $( "div.accept-wrap input[type='checkbox']" ).on( "change", function(){
        checkComplete();
    })
});

function checkComplete(){
    var totalLen = $( "div.accept-wrap input[type='checkbox']" ).length;
    var checkLen = $( "div.accept-wrap input[type='checkbox']:checked" ).length;
    
    if( totalLen == checkLen ){
        $( "#accept-complete" ).removeClass( "not-accept" ).prop( "disabled", false );
    } else {
        $( "#accept-complete" ).addClass( "not-accept" ).prop( "disabled", true );
    }
}
</script>
<style>
<!--
 /* Font Definitions */
 @font-face    {font-family:"Cambria Math";    panose-1:2 4 5 3 5 4 6 3 2 4;}
 @font-face    {font-family:"Arial Unicode MS";    panose-1:2 11 6 4 2 2 2 2 2 4;}
@font-face    {font-family:"Malgun Gothic";    panose-1:2 11 5 3 2 0 0 2 0 4;}
@font-face    {font-family:함초롬바탕;    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:함초롬돋움;    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:휴먼명조;    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:HYGothic-Medium;    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:"\@Malgun Gothic";}
@font-face    {font-family:"\@Arial Unicode MS";    panose-1:2 11 6 4 2 2 2 2 2 4;}
@font-face    {font-family:"\@휴먼명조";    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:"\@HYGothic-Medium";    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:"\@함초롬바탕";    panose-1:0 0 0 0 0 0 0 0 0 0;}
@font-face    {font-family:"\@함초롬돋움";    panose-1:0 0 0 0 0 0 0 0 0 0;}
 /* Style Definitions */
 p.MsoNormal, li.MsoNormal, div.MsoNormal{margin:0in;text-autospace:none;word-break:break-all;font-size:11.0pt;font-family:"Malgun Gothic",sans-serif;}
p.a, li.a, div.a{mso-style-name:바탕글; margin:0in;text-align:justify;text-justify:inter-ideograph;line-height:103%;text-autospace:none;  word-break:break-all;font-size:10.0pt;font-family:"함초롬바탕",serif;color:black;}
.MsoChpDefault    {font-family:"Malgun Gothic",sans-serif;}
 /* Page Definitions */
 @page WordSection1    {size:595.25pt 841.85pt;    margin:99.2pt 85.0pt 85.0pt 85.0pt;}
div.WordSection1    {page:WordSection1;padding:20px 10px;border-top:1px solid #DBDBDB;}
 /* List Definitions */
 ol    {margin-bottom:0in;}
ul    {margin-bottom:0in;}
div.WordSection1 *{font-size:13px !important;}
div.WordSection1 table td {width:auto !important;}
-->
p.a a{padding:0 !important;margin:0 !important;
    border: 0 !important;
    box-shadow:0 0 0 0 !important;
    display: inline-block !important;
    position: inherit !important;margin-bottom:0 !important;}
</style>
<body>
<form action="/mobile/accept/insert" method="post" id="acceptForm">
    <div id="sub">
        <div class="container">
            <div class="header">
                <div class="previous">
<!--                     <a href="./menu">이전</a> -->
                </div>
                <div class="title">이용약관 및 개인정보처리방침<br/><span style="font-size:14px;">(Terms of service and Privacy Policy)</span>
</div>
            </div>
            <div class="alert">※ 서비스 이용을 원하시면 이용약관, 개인정보처리방침에 대한 내용을 확인하신 후 동의해 주시기 바랍니다.<br/>(If you wish to use the service, please confirm and agree to the terms of service and privacy policy.)</div>
            <div class="accept-wrap">
                <ul class="list">
                    <c:forEach var="al" items="${acceptList}" varStatus="lStatus">
                        <li>
                            <a href="javascript:;" class="" style="text-align:right;display: inline-block;width: 100%;">
                                <input type="checkbox" name="acceptIdx" value="${al.acceptIdx}" id="accept${lStatus.index}" />
                                <label for="accept${lStatus.index}" style="float:left;text-align:left;width:70%;word-break:keep-all;"><span></span>
                                    <c:out value="${al.title}"/>
                                    <c:if test="${al.necessaryYn eq 'Y'}"> (필수)</c:if>
                                    <c:if test="${al.necessaryYn ne 'Y'}"> (선택)</c:if>
                                </label>
                                <span class="detail">보기(View)</span>
                            </a>
                            <div class="content-wrap" style="display:none;">
                                <div class="relative">
                                    <div class="title"><c:out value="${al.title}"/> <span class="close" onclick="$(this).closest('.content-wrap').hide();"></span></div>
                                    <div class="content"><c:out value="${al.content}" escapeXml="false"/></div>
                                
                                    <button type="button" class="ok">
                                        <span class="check">약관을 충분히 이해했으며 동의 합니다</span>
                                    </button>
                                </div>
                            </div>
                        </li>
                    </c:forEach>
                </ul>
            </div>
        </div>
    </div>


    <div class="btn_group">
        <ul>
            <li style="font-size:0;height:60px;">
                <button type="submit" id="accept-complete" class="confirm not-accept" style="height:60px;line-height:20px;" disabled>
                    <span class="check">모두 동의하였으며 계속 진행합니다.<br/>(All agree and continue.)</span>
                </button>
            </li>
        </ul>
    </div>
</form>
</body>
</html>