giftcon_dev/resources/views/web/auth/register_terms.blade.php

940 lines
55 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@extends('web.layouts.auth')
@section('title', '회원가입 약관동의 | PIN FOR YOU')
@section('meta_description', '회원가입 약관동의 단계입니다.')
@section('canonical', url('/auth/register/terms'))
@section('h1', '약관 동의')
@section('desc', '필수 약관에 동의하시면 다음 단계(본인인증)로 진행합니다.')
@section('card_aria', '회원가입 Step1 - 약관 동의')
@section('show_cs_links', true)
@section('auth_content')
<div class="terms-wrap">
{{-- 진행 단계 --}}
<div class="terms-steps" aria-label="진행 단계">
<div class="terms-step">가입정보확인</div>
<div class="terms-step is-active">약관/인증 확인</div>
<div class="terms-step">가입정보입력</div>
</div>
{{-- <form id="regTermsForm" class="terms-form" method="POST" action="{{ route('web.auth.register.terms.submit') }}" novalidate>--}}
<form id="regTermsForm" class="terms-form" method="POST" action="" novalidate>
@csrf
{{-- 전체 동의 --}}
<div class="terms-card terms-card--all">
<label class="chk">
<input type="checkbox" id="agree_all">
<span class="chk-ui" aria-hidden="true"></span>
<span class="chk-text">
<span class="chk-title">전체 동의</span>
<span class="chk-sub">필수 선택 항목을 모두 포함합니다.</span>
</span>
</label>
</div>
{{-- 약관 리스트 --}}
<div class="terms-card">
{{-- [필수] 이용약관 --}}
<div class="terms-row">
<label class="chk">
<input type="checkbox" name="agree_terms" id="agree_terms" value="1" required>
<span class="chk-ui" aria-hidden="true"></span>
<span class="chk-text">
<span class="badge badge--req">필수</span>
<span class="terms-label">이용약관 동의</span>
</span>
</label>
<button type="button" class="terms-view" data-toggle="t_terms">내용보기</button>
</div>
<div class="terms-body" id="t_terms" hidden>
<div class="terms-scroll">
<h4>이용약관</h4>
<div class="terms-legal">
<h5> 1 (목적)</h5>
<p> 약관은 ㈜플러스메이커(이하 "회사") 제공하는 핀포유(이하 “사이트”) 관련 제반 서비스 (이하 "서비스") 이용조건 절차에 관한 회사와 회원간의 권리 의무 책임사항, 기타 필요한 사항을 규정함을 목적으로 합니다.</p>
<h5> 2 (약관의 효력 변경)</h5>
<p> 약관은 서비스 화면이나 기타의 방법으로 이용고객에게 공지함으로써 효력을 발생합니다.</p>
<p> 사이트는 약관의 내용을 변경할 있으며, 변경된 약관은 제①항과 같은 방법으로 공지 또는 통지함으로써 효력을 발생합니다.</p>
<h5> 3 (용어의 정의)</h5>
<p> 약관에서 사용하는 용어의 정의는 다음과 같습니다.</p>
<p> 회원 : 사이트와 서비스 이용계약을 체결하거나 이용자 아이디(ID) 부여받은 개인을 말합니다.</p>
<p> 아이디(ID) : 회원의 식별과 서비스 이용을 위하여 회원이 정하고 사이트가 승인하는 이메일 형식을 말합니다</p>
<p> 비밀번호 : 회원이 부여 받은 아이디(ID) 일치된 회원임을 확인하고, 회원 자신의 비밀을 보호하기 위하여 회원이 정한 영문자와 숫자, 특수문자의 조합을 말합니다.</p>
<p> 회원탈퇴 : 사이트 또는 회원이 서비스 이용계약을 취소하는 것을 말합니다.</p>
<h5> 4 (회원가입)</h5>
<p> 사이트에서 제공하는 절차에 맞춰 이용약관 동의 본인인증 절차를 완료한 , 가입 양식에 따라 회원정보를 기입함으로서 회원가입을 신청합니다.</p>
<p> 사이트는 신청자에 대하여 제3항, 제4항의 경우를 예외로 하여 회원 등록합니다..</p>
<p> 사이트는 다음에 해당하는 경우에 회원 등록을 제한사유가 해소될 때까지 유보할 있습니다.</p>
<ul>
<li>. 서비스 관련 설비에 여유가 없는 경우</li>
<li>. 기술상 지장이 있는 경우</li>
<li>. 기타 사이트가 필요하다고 인정되는 경우</li>
</ul>
<p> 사이트는 신청자가 다음에 해당하는 경우에는 회원 등록을 거부할 있습니다.</p>
<ul>
<li>. 다른 개인(사이트) 명의를 사용하여 신청한 경우</li>
<li>. 이용자 정보를 허위로 기재하여 신청한 경우</li>
<li>. 사회의 안녕질서 또는 미풍양속을 저해할 목적으로 신청한 경우</li>
<li>. 기타 사이트 소정의 이용신청요건을 충족하지 못하는 경우</li>
</ul>
<h5> 5 (회원 탈퇴 이용정지)</h5>
<p> 회원은 사이트에 언제든지 탈퇴를 요청할 있으며 사이트는 요청사항을 명확히 확인한 즉시 회원탈퇴를 처리합니다</p>
<p> 회원이 다음 호의 사유에 해당하는 경우, 사이트는 회원자격을 제한 정지시킬 있습니다.</p>
<ol>
<li>회원 가입 허위 정보를 기재한 경우</li>
<li>타인 명의 또는 전자결제 수단을 도용 또는 의심되는 경우</li>
<li>사이트가 제공하는 관련 서비스 프로그램에 대한 허가되지 않은 접근 시도 변경을 시도하는 경우</li>
<li>기타 사이트가 필요하다고 인정되는 경우</li>
</ol>
<p> 회원 자격 제한 정지가 이루어진 경우 회원은 고객센터 상담을 통해 사유 해결 방안에 대해 확인할 있습니다.</p>
<h5> 6 (이용자정보의 변경)</h5>
<p>회원은 회원가입 기재했던 회원정보가 변경되었을 경우에는, 사이트 개인정보 확인 페이지를 통해 으로 수정하여야 하며 변경하지 않음으로 인하여 발생되는 모든 문제의 책임은 회원에게 있습니다.</p>
<h5> 7 (사이트의 의무)</h5>
<p> 사이트는 법령과 약관이 금지하거나 공서양속에 반하는 행위를 하지 않으며 약관이 정하는 바에 따라 지속적이고, 안정적으로 재화․용역을 제공하는데 최선을 다하여야 합니다.</p>
<p> 사이트는 서비스 제공과 관련하여 취득한 회원의 개인정보를 회원의 동의없이 타인에게 누설, 공개 또는 배포할 없으며, 서비스관련 업무 이외의 상업적 목적으로 사용할 없습니다. , 다음 호의 1 해당하는 경우는 예외입니다.</p>
<ul>
<li>. 전기통신기본법 법률의 규정에 의해 국가기관의 요구가 있는 경우</li>
<li>. 범죄에 대한 수사상의 목적이 있거나 정보통신윤리 위원회의 요청이 있는 경우</li>
<li>. 기타 관계법령에서 정한 정차에 따른 요청이 있는 경우</li>
</ul>
<p> 사이트는 약관에서 정한 바에 따라 지속적, 안정적으로 서비스를 제공할 의무가 있습니다.</p>
<h5> 8 (회원의 의무)</h5>
<p> 회원은 서비스 이용 다음 호의 행위를 하지 않아야 합니다.</p>
<ul>
<li>. 다른 회원의 ID를 부정하게 사용하는 행위</li>
<li>. 서비스에서 얻은 정보를 사이트의 사전승낙 없이 회원의 이용 이외의 목적으로 복제하거나 이를 변경, 출판 방송 등에 사용하거나 타인에게 제공하는 행위</li>
<li>. 사이트의 저작권, 타인의 저작권 기타 권리를 침해하는 행위</li>
<li>. 공공질서 미풍양속에 위반되는 내용의 정보, 문장, 도형 등을 타인에게 유포하는 행위</li>
<li>. 범죄와 결부된다고 객관적으로 판단되는 행위</li>
<li>. 기타 관계법령에 위배되는 행위</li>
</ul>
<p> 회원은 관계법령, 약관에서 규정하는 사항, 서비스 이용 안내 주의 사항을 준수하여야 합니다.</p>
<p> 회원은 내용별로 사이트가 서비스 공지사항에 게시하거나 별도로 공지한 이용 제한 사항을 준수하여야 합니다.</p>
<h5> 9 (회원 아이디(ID) 비밀번호 관리에 대한 회원의 의무)</h5>
<p> 아이디(ID) 비밀번호에 대한 모든 관리는 회원에게 책임이 있습니다. 회원에게 부여된 아이디(ID) 비밀번호의 관리소홀, 부정사용에 의하여 발생하는 모든 결과에 대한 전적인 책임은 회원에게 있습니다.</p>
<p> 자신의 아이디(ID) 부정하게 사용된 경우 또는 기타 보안 위반에 대하여, 회원은 반드시 사이트에 사실을 통보해야 합니다.</p>
<h5> 10 (서비스 이용료)</h5>
<p> 사이트를 통해 상품 구매 휴대폰소액결제 서비스를 이용해 결제하는 경우 회사가 정한 규정에 따라 서비스 이용료가 부과됩니다.</p>
<h5> 11 (서비스 제한 정지)</h5>
<p> 사이트는 전시, 사변, 천재지변 또는 이에 준하는 국가비상사태가 발생하거나 발생할 우려가 있는 경우와 전기통신사업법에 의한 기간통신 사업자가 전기통신서비스를 중지하는 기타 불가항력적 사유가 있는 경우에는 서비스의 전부 또는 일부를 제한하거나 정지할 있습니다.</p>
<p> 사이트는 제1항의 규정에 의하여 서비스의 이용을 제한하거나 정지할 때에는 사유 제한기간 등을 지체없이 회원에게 알려야 합니다.</p>
<h5> 12 (정보의 변경)</h5>
<p>회원이 주소, 비밀번호 고객정보를 변경하고자 하는 경우에는 홈페이지의 회원정보 변경 서비스를 이용하여 변경할 있습니다.</p>
<h5> 13 (면책조항)</h5>
<p> 회사는 다음 호에 해당하는 경우에는 책임을 지지 않습니다.</p>
<ol>
<li>전시, 사변, 천재지변 또는 이에 준하는 국가 비상 사태 불가항력적인 경우</li>
<li>회원의 고의 또는 과실로 인하여 손해가 발생한 경우</li>
<li>전기통신사업법에 의한 기간 통신사업자가 제공하는 전기통신서비스 장애로 인한 경우</li>
</ol>
<p> 회사는 회원의 귀책 사유로 인한 서비스 이용의 장애에 대하여 책임을 지지 아니합니다.</p>
<h5> 14 (관할법원)</h5>
<p> 회사의 요금체계 서비스 이용과 관련하여 분쟁이 발생될 경우, 회사의 본사 소재지를 관할하는 법원을 관할 법원으로 하여 이를 해결합니다.</p>
<p> 서비스 이용과 관련하여 회사와 회원 간의 소송에는 대한민국 법을 적용합니다.</p>
<h5>[부칙]</h5>
<p>(시행일) 약관은 2019 01월부터 시행합니다.</p>
</div>
</div>
</div>
<div class="terms-divider"></div>
{{-- [필수] 개인정보 --}}
<div class="terms-row">
<label class="chk">
<input type="checkbox" name="agree_privacy" id="agree_privacy" value="1" required>
<span class="chk-ui" aria-hidden="true"></span>
<span class="chk-text">
<span class="badge badge--req">필수</span>
<span class="terms-label">개인정보 수집·이용 동의</span>
</span>
</label>
<button type="button" class="terms-view" data-toggle="t_privacy">내용보기</button>
</div>
<div class="terms-body" id="t_privacy" hidden>
<div class="terms-scroll">
<h4>개인정보 수집·이용 동의</h4>
<div class="terms-legal">
<h5>1. 개인정보의 처리 목적</h5>
<p>
주식회사 플러스메이커(이하 “회사”라 ) 운영하는 “핀포유”는 개인정보를 다음의 목적을 위해 처리합니다.
처리한 개인정보는 다음의 목적 이외의 용도로는 사용되지 않으며 이용 목적이 변경될 시에는 사전동의를 구할 예정입니다.
</p>
<ul>
<li><strong>(1) 홈페이지 회원가입 관리</strong> : 회원 가입의사 확인, 회원자격 유지·관리, 서비스 부정이용 방지, 각종 고지·통지, 고충처리, 분쟁 조정을 위한 기록 보존</li>
<li><strong>(2) 민원사무 처리</strong> : 민원인의 신원 확인, 민원사항 확인, 사실조사를 위한 연락·통지, 처리결과 통보</li>
</ul>
<h5>2. 개인정보의 항목 수집방법</h5>
<p><strong>(1) 개인정보 수집 항목</strong></p>
<p> 회사는 회원가입, 상담, 기타 부가 서비스 제공 등을 위해 아래와 같은 개인정보를 수집하고 있습니다.</p>
<ul>
<li>이름, 생년월일, 성별, 전화번호, 이메일, 아이디, 비밀번호, 개인식별값(CI, DI)</li>
</ul>
<p> 또한 서비스 이용과정이나 사업 처리 과정에서 아래와 같은 정보들이 생성되어 수집될 있습니다.</p>
<ul>
<li>접속 IP 정보, 쿠키, 서비스 이용 접속기록</li>
</ul>
<p><strong>(2) 개인정보 수집방법</strong></p>
<ul>
<li>홈페이지(회원가입, 문의상담), 서면양식</li>
<li>제휴사로부터의 제공</li>
</ul>
<h5>3. 개인정보의 처리 보유 기간</h5>
<p>
회사는 법령에 따른 개인정보 보유·이용기간 또는 정보주체로부터 개인정보를 수집 시에 동의 받은 개인정보 보유·이용기간 내에서 개인정보를 처리·보유합니다.
또한, 정보통신망 이용촉진 정보보호 등에 관한 법률에 따라 1년간 “핀포유”를 이용하지 아니한 회원의 개인정보는 파기하거나 별도 분리되어 보관됩니다.
그럼에도 회원이 보유기간을 별도로 지정하거나, 법률에 근거하여 보존할 필요가 있는 경우는 기존과 같이 안전 관리를 다하여 보관합니다.
</p>
<p><strong>(1) 홈페이지 회원가입 관리, 민원사무 처리, 재화 또는 서비스 제공</strong></p>
<p>
마케팅 광고의 활용과 관련한 개인정보는 수집·이용에 관한 동의일로부터 지체 없이 파기까지 이용목적을 위하여 보유·이용됩니다.
</p>
<p><strong>(2) 관계법령에 따른 보관</strong></p>
<p>
상법, 전자상거래 등에서의 소비자보호에 관한 법률 관계법령의 규정에 의하여 보존할 필요가 있는 경우 회사는 관계법령에서 정한 일정한 기간 동안 회원정보를 보관합니다.
경우 회사는 보관하는 정보를 보관의 목적으로만 이용합니다.
</p>
<ul>
<li><strong>통신비밀보호법</strong> : 로그기록, IP (수사기관 요청 제공) / <strong>3개월</strong></li>
<li><strong>전자상거래 등에서의 소비자보호에 관한 법률</strong> : 회원의 불만 또는 분쟁처리에 관한 기록(회원 식별정보, 분쟁처리 기록 ) / <strong>3</strong></li>
<li><strong>전자상거래 등에서의 소비자보호에 관한 법률</strong> : 대금결제 재화 등의 공급에 관한 기록(회원 식별정보, 계약/청약철회 기록 ) / <strong>5</strong></li>
<li><strong>부가가치세법</strong> : 장부, 세금계산서, 수입세금계산서, 영수증 (과세표준과 세액 신고자료) / <strong>5</strong></li>
<li><strong>전자금융거래법</strong> : 전자금융거래에 관한 기록, 상대방에 관한 정보 / <strong>5</strong></li>
</ul>
<h5>4. 개인정보의 제3자 제공에 관한 사항</h5>
<p>
회사는 회원의 동의가 있거나 법령의 규정에 의한 경우를 제외하고는 어떠한 경우에도 [개인정보 처리방침]에서 고지한 범위를 넘어 회원의 개인정보를 이용하거나
타인 또는 타기업/기관에 제공하지 않습니다.
</p>
<p>
회원의 개인정보를 제공하는 경우에는 개인정보를 제공받는 , 개인정보 이용 목적, 제공 항목, 보유 이용기간을 개별적으로 고지한 사전 동의를 구합니다.
</p>
<p>다만, 다음의 경우에는 회원의 동의 없이 개인정보를 제공할 있습니다.</p>
<ol>
<li>서비스 제공에 따른 요금 정산을 위하여 필요한 경우</li>
<li>통계작성, 학술연구 또는 시장조사를 위하여 개인을 식별할 없는 형태로 제공하는 경우</li>
<li>법령에 특별한 규정이 있는 경우</li>
</ol>
<p> 회사는 아래와 같은 경우 이용자의 동의 하에 개인정보를 제3자에게 제공할 있습니다.</p>
<ol>
<li>물품구매, 유료컨텐츠 이용 등의 배송 정산을 위해 이용자의 이름, 전화번호 등이 해당 유료컨텐츠 제공자, 제휴 업자에게 제공될 있습니다.</li>
<li>각종 이벤트 행사에 참여한 회원의 개인정보가 해당 이벤트의 주최자에게 제공될 있습니다.</li>
</ol>
<p>
회사는 회원에게 제공되는 서비스의 질을 향상시키기 위해 여러 분야의 전문 컨텐츠 사업자 혹은 비즈니스 사업자와 함께 제휴를 맺을 있습니다.
</p>
<h5>5. 개인정보처리 위탁</h5>
<p>
1. 회사는 서비스 향상을 위해서 아래와 같이 개인정보를 위탁하고 있으며, 관계 법령에 따라 위탁계약 개인정보가 안전하게 관리될 있도록 필요한 사항을 규정하고 있습니다.
</p>
<p><strong>회사의 개인정보 위탁처리 기관 위탁업무 내용(요약)</strong></p>
<ul>
<li><strong>㈜LG U+</strong> : 신용카드 결제, 가상계좌 결제, SMS 발송 (회원탈퇴 또는 위탁계약 종료 시까지 / 법령 기준)</li>
<li><strong>㈜다날</strong> : 결제(신용카드/가상계좌/휴대폰/계좌이체/상품권 결제), 상품권 발급 (회원탈퇴 또는 위탁계약 종료 시까지 / 법령 기준)</li>
<li><strong>㈜더즌</strong> : 가상계좌, 계좌출금, 계좌성명조회 (회원탈퇴 또는 위탁계약 종료 시까지 / 법령 기준)</li>
<li><strong>로움아이티</strong> : 로그인톡 인증 서비스 (별도 저장하지 않음 / 본인인증 업체 보유 정보)</li>
<li><strong>()케이티엠하우스</strong> : 휴대폰번호, 상품권명 (회원 탈퇴 또는 위탁계약 종료 )</li>
</ul>
<h5>6. 정보주체의 권리·의무 행사방법</h5>
<p>이용자는 개인정보주체로서 다음과 같은 권리를 행사할 있습니다.</p>
<p><strong>(1)</strong> 정보주체는 회사에 대해 언제든지 다음 호의 개인정보 보호 관련 권리를 행사할 있습니다.</p>
<ol>
<li>개인정보 열람요구</li>
<li>오류 등이 있을 경우 정정 요구</li>
<li>삭제요구</li>
<li>처리정지 요구</li>
</ol>
<p>
<strong>(2)</strong> 제1항에 따른 권리 행사는 회사에 대해 개인정보 보호법 시행령 제41조제1항 서식에 따라 서면, 전자우편, 모사전송(FAX) 등을 통하여 하실 있으며
회사는 이에 대해 지체 없이 조치하겠습니다.
</p>
<p><strong>(3)</strong> 정보주체가 정정 또는 삭제를 요구한 경우에는 회사는 완료할 때까지 당해 개인정보를 이용하거나 제공하지 않습니다.</p>
<p><strong>(4)</strong> 대리인을 통하여 권리 행사를 하실 있으며, 경우 위임장을 제출하셔야 합니다.</p>
<p><strong>(5)</strong> 개인정보 열람 처리정지 요구는 법령에 의해 제한될 있습니다.</p>
<p><strong>(6)</strong> 다른 법령에서 수집 대상으로 명시된 개인정보는 삭제를 요구할 없습니다.</p>
<p><strong>(8)</strong> 회사는 정보주체 권리 행사 요구를 자가 본인이거나 정당한 대리인인지를 확인합니다.</p>
<h5>7. 개인정보 자동수집 장치의 설치, 운영 거부에 관한 사항</h5>
<p>
회사는 ‘쿠키(cookie) 등을 운용합니다. 쿠키란 웹사이트 서버가 이용자의 브라우저에 보내는 작은 텍스트 파일로서 이용자의 컴퓨터 하드디스크에 저장됩니다.
회사는 다음과 같은 목적을 위해 암호화된 쿠키를 사용합니다.
</p>
<p><strong>(1) 쿠키 사용 목적</strong></p>
<p>
회원과 비회원의 접속 빈도나 방문 시간 등을 분석, 이용자의 취향과 관심분야를 파악 자취 추적,
각종 이벤트 참여 정도 방문 회수 파악 등을 통한 타겟 마케팅 개인 맞춤 서비스 제공.
</p>
<p><strong>(2) 쿠키 설정 거부 방법</strong></p>
<p>
브라우저 옵션을 통해 쿠키 허용/확인/거부를 선택할 있습니다.
(: 인터넷 익스플로어) 도구 &gt; 인터넷 옵션 &gt; 개인정보
(, 쿠키 설치를 거부하였을 경우 서비스 제공에 어려움이 있을 있습니다.)
</p>
<h5>8. 개인정보 파기</h5>
<p>회사는 원칙적으로 개인정보 수집 이용목적이 달성된 후에는 해당 정보를 지체없이 파기합니다.</p>
<p><strong>(1) 파기절차</strong></p>
<p>
회원이 입력한 정보는 목적 달성 별도 DB로 옮겨져 내부 방침 관련 법령에 의한 정보보호 사유에 따라 일정 기간 저장된 파기됩니다.
법률에 의한 경우가 아니고서는 다른 목적으로 이용되지 않습니다.
</p>
<p><strong>(2) 파기방법</strong></p>
<ul>
<li>전자적 파일형태로 저장된 개인정보는 기록을 재생할 없는 기술적 방법을 사용하여 삭제합니다.</li>
</ul>
<h5>9. 개인정보 보호책임자</h5>
<p>
회사는 귀하가 좋은 정보를 안전하게 이용할 있도록 최선을 다하고 있습니다.
개인정보를 보호하는데 있어 귀하께 고지한 사항들에 반하는 사고가 발생할 경우 개인정보보호책임자가 책임을 집니다.
</p>
<p>
이용자 비밀번호의 보안유지책임은 이용자 자신에게 있습니다.
회사는 비밀번호에 대해 어떠한 방법으로도 이용자에게 직접적으로 질문하는 경우는 없으므로 타인에게 비밀번호가 유출되지 않도록 주의하시기 바랍니다.
</p>
<p>
회사가 기술적인 보완조치를 했음에도 해킹 네트워크 위험성으로 인해 발생하는 예기치 못한 사고로 인한 정보의 훼손 분쟁에 관해서는 책임이 없습니다.
</p>
<p> 개인정보 보호책임자 담당자 연락처는 아래와 같습니다.</p>
<ul>
<li><strong>소속</strong> : 대표이사</li>
<li><strong>전화번호</strong> : 1833-4856</li>
<li><strong>성명</strong> : 송병수</li>
<li><strong>이메일</strong> : Bestplusmakerr@gmail.com</li>
</ul>
<h5>10. 정보주체의 권익침해에 대한 구제방법</h5>
<p>아래의 기관은 당사와 별개의 기관입니다. 도움이 필요하시면 문의하여 주시기 바랍니다.</p>
<ul>
<li><strong>개인정보 침해신고센터(한국인터넷진흥원)</strong> : privacy.kisa.or.kr / 118 / 서울시 송파구 중대로 135</li>
<li><strong>개인정보 분쟁조정위원회</strong> : www.kopico.go.kr / 1833-6972 / 정부서울청사 4</li>
<li><strong>대검찰청 사이버수사과</strong> : 1301 / www.spo.go.kr</li>
<li><strong>경찰청 사이버안전국</strong> : 182 / http://cyberbureau.police.go.kr</li>
</ul>
<h5>11. 개인정보 처리방침 고지의 의무</h5>
<p>
개인정보처리방침은 시행일로부터 적용되며, 법령 방침에 따른 변경내용의 추가, 삭제 정정이 있는 경우에는
변경사항의 시행 7 전부터 공지사항을 통하여 고지할 것입니다.
</p>
<p> 방침은 2019 1 21일부터 시행됩니다.</p>
</div>
</div>
</div>
<div class="terms-divider"></div>
{{-- [필수] 14 --}}
<div class="terms-row">
<label class="chk">
<input type="checkbox" name="agree_age" id="agree_age" value="1" required>
<span class="chk-ui" aria-hidden="true"></span>
<span class="chk-text">
<span class="badge badge--req">필수</span>
<span class="terms-label"> 14 이상입니다</span>
<span class="terms-sub"> 14 미만은 회원가입이 제한됩니다.</span>
</span>
</label>
</div>
<div class="terms-divider"></div>
{{-- [선택] 마케팅 --}}
<div class="terms-row">
<label class="chk">
<input type="checkbox" name="agree_marketing" id="agree_marketing" value="1">
<span class="chk-ui" aria-hidden="true"></span>
<span class="chk-text">
<span class="badge badge--opt">선택</span>
<span class="terms-label">마케팅 정보 수신 동의</span>
<span class="terms-sub">할인/이벤트 혜택 안내를 받을 있어요.</span>
</span>
</label>
<button type="button" class="terms-view" data-toggle="t_marketing">내용보기</button>
</div>
<div class="terms-body" id="t_marketing" hidden>
<div class="terms-scroll">
<h4>마케팅 정보 수신 동의 (선택)</h4>
<div class="terms-legal">
<p>
회사는 이벤트/혜택 안내 마케팅 정보 제공을 위해 아래와 같이 개인정보를 이용하고,
문자(SMS) 등으로 안내를 발송할 있습니다. 동의는 선택 사항이며, 동의하지 않아도 서비스 이용이 가능합니다.
</p>
<h5>1. 수신 내용</h5>
<ul>
<li>이벤트/프로모션, 할인 혜택, 쿠폰, 신규 서비스 / 상품안내, 맞춤형 혜택 안내(이용 이력 기반 추천 포함 가능)</li>
</ul>
<h5>2. 수신 채널</h5>
<ul>
<li>SMS(문자)</li>
<li>이메일</li>
</ul>
<h5>3. 이용 항목</h5>
<ul>
<li>휴대폰번호, 이메일, 서비스 이용 정보(혜택 제공 목적 최소한)</li>
</ul>
<h5>4. 보유 이용기간</h5>
<p>
동의일로부터 <strong>회원 탈퇴 또는 동의 철회 시까지</strong> 보유·이용합니다.
, 관계 법령에 따라 보존할 필요가 있는 경우 해당 기간 동안 보관될 있습니다.
</p>
<h5>5. 동의 철회(수신 거부)</h5>
<p>
마케팅 정보 수신은 언제든지 철회할 있습니다.
(: 마이페이지 &gt; 설정/수신동의 변경, 고객센터 요청 )
철회 후에도 서비스 관련 필수 안내(가입/인증/결제/보안/공지 ) 발송될 있습니다.
</p>
</div>
</div>
</div>
</div>
<div class="terms-help" id="terms_help" hidden>
필수 약관에 동의해 주세요.
</div>
<div class="terms-actions">
<button type="submit" class="terms-btn terms-btn--primary" id="terms_next_btn" disabled>
동의하고 다음
</button>
<a class="terms-btn" href="{{ route('web.auth.register') }}">이전</a>
</div>
<p class="terms-note">
다음 단계에서 PASS 본인인증을 진행합니다.
</p>
</form>
</div>
{{-- 페이지 전용 스타일(이쁘게) --}}
<style>
.terms-wrap{display:flex;flex-direction:column;gap:14px}
.terms-steps{
display:flex;
gap:10px;
align-items:center;
justify-content:space-between;
}
.terms-step{
flex:1;
text-align:center;
padding:10px 12px;
border-radius:999px; /* ✅ badge */
font-size:12.5px;
font-weight:800;
letter-spacing:-0.2px;
margin-top: 10px;
margin-bottom: 50px;
/* 기본(비활성) */
color: rgba(136, 105, 105, 0.78);
border:1px solid rgba(255,255,255,.14);
background:rgba(255,255,255,.06);
box-shadow:
inset 0 1px 0 rgba(255,255,255,.10),
0 10px 22px rgba(0,0,0,.14);
opacity:.78;
position:relative;
overflow:hidden;
}
/* ✅ 비활성도 살짝 그라데이션 느낌(은은하게) */
.terms-step::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(135deg,
rgba(47,107,255,.18),
rgba(74,163,255,.14),
rgba(47,210,255,.12)
);
opacity:.55;
pointer-events:none;
}
/* ✅ 활성: 선명한 그라데이션 */
.terms-step.is-active{
opacity:1;
color:#fff;
border-color:rgba(120,180,255,.50);
background:linear-gradient(135deg, #2f6bff 0%, #4aa3ff 55%, #2fd2ff 100%);
box-shadow:
0 18px 38px rgba(47,107,255,.28),
0 10px 20px rgba(47,210,255,.14);
}
/* shine 효과 (활성만) */
.terms-step.is-active::after{
content:"";
position:absolute;
top:-40%;
left:-45%;
width:55%;
height:180%;
transform:rotate(18deg);
background:linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
opacity:.55;
animation: termsStepShine 2.8s ease-in-out infinite;
pointer-events:none;
}
@keyframes termsStepShine{
0% { transform: translateX(-30%) rotate(18deg); opacity:.20; }
45% { opacity:.70; }
100% { transform: translateX(240%) rotate(18deg); opacity:.20; }
}
/* 모바일에서 글자 길어서 깨질 때 대비 */
@media (max-width: 420px){
.terms-step{
font-size:12px;
padding:10px 10px;
}
}
.terms-form{display:flex;flex-direction:column;gap:12px}
.terms-card{border:1px solid rgba(255,255,255,.12);border-radius:16px;
background:rgba(255,255,255,.04);box-shadow:0 12px 30px rgba(0,0,0,.18);
overflow:hidden}
.terms-card--all{padding:14px 14px}
.terms-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
padding:14px 14px}
.terms-divider{height:1px;background:rgba(255,255,255,.10);margin:0 14px}
.terms-legal h5 { margin:14px 0 6px; font-size:12.5px; opacity:.95; }
.terms-legal p { margin:0 0 8px; }
.terms-legal ul, .terms-legal ol { margin:6px 0 10px; padding-left:18px; }
.terms-legal li { margin:2px 0; opacity:.85; line-height:1.65; }
/* custom checkbox */
.chk{display:flex;gap:10px;align-items:flex-start;cursor:pointer;user-select:none}
.chk input{position:absolute;opacity:0;pointer-events:none}
.chk-ui{width:20px;height:20px;border-radius:6px;flex:0 0 20px;margin-top:2px;
border:1px solid rgba(255,255,255,.22);
background:rgba(0,0,0,.15);
box-shadow:inset 0 0 0 1px rgba(0,0,0,.2)}
.chk input:checked + .chk-ui{
border-color:rgba(255,255,255,.35);
background:rgba(255,255,255,.92);
}
.chk input:checked + .chk-ui::after{
content:"";display:block;width:10px;height:6px;border-left:2px solid #111;border-bottom:2px solid #111;
transform:rotate(-45deg);margin:5px 0 0 4px
}
.chk-text{display:flex;flex-direction:column;gap:4px;line-height:1.3}
.chk-title{font-weight:800}
.chk-sub{opacity:.72;font-size:12px}
.terms-label{font-weight:800}
.terms-sub{opacity:.72;font-size:12px}
.badge{display:inline-flex;align-items:center;justify-content:center;
padding:2px 8px;border-radius:999px;font-size:11px;font-weight:800;width:max-content}
.badge--req{background:rgba(255,90,90,.18);border:1px solid rgba(255,90,90,.35)}
.badge--opt{background:rgba(120,180,255,.16);border:1px solid rgba(120,180,255,.30);opacity:.9}
/* "내용보기" 버튼 */
.terms-view{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);
color:inherit;border-radius:10px;padding:8px 10px;font-size:12px;cursor:pointer;opacity:.92;
transition:transform .08s ease, opacity .08s ease, background .08s ease}
.terms-view:hover{opacity:1;background:rgba(255,255,255,.10)}
.terms-view:active{transform:scale(.98)}
/* 내용 영역: div + 스크롤 */
.terms-body{padding:0 14px 14px}
.terms-scroll{border:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.16);
border-radius:12px;padding:12px;max-height:180px;overflow:auto}
.terms-scroll h4{margin:0 0 10px;font-size:13px}
.terms-scroll p,.terms-scroll li{opacity:.85;line-height:1.65;font-size:12.5px}
.terms-scroll ul{margin:8px 0 0;padding-left:18px}
/* 안내/버튼 */
.terms-help{padding:10px 12px;border-radius:12px;background:rgba(255,90,90,.12);
border:1px solid rgba(255,90,90,.25);opacity:.95;font-size:12.5px}
.terms-actions{display:flex;gap:10px;margin-top:4px}
.terms-btn{flex:1;text-align:center;border-radius:14px;padding:12px 12px;
border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:inherit;
text-decoration:none;cursor:pointer;font-weight:800}
.terms-btn--primary{background:rgba(255,255,255,.92);color:#111;border-color:rgba(255,255,255,.55)}
.terms-btn[disabled]{opacity:.45;cursor:not-allowed}
.terms-note{margin:0;opacity:.7;font-size:12.5px;line-height:1.5}
/* Primary 버튼: 기본(비활성) = 밋밋 / 활성 = 블루톤 튀게 */
#terms_next_btn.terms-btn--primary{
position: relative;
overflow: hidden;
transform: translateZ(0);
transition: transform .12s ease, box-shadow .12s ease, filter .12s ease, opacity .12s ease;
}
/* 비활성(disabled)이어도 "버튼처럼" 보이게 */
#terms_next_btn.terms-btn--primary:disabled{
opacity: 1 !important;
cursor: not-allowed;
background: rgba(255,255,255,.88) !important; /* 밝은 버튼 */
border-color: rgba(0,0,0,.10) !important;
color: #7a7a7a !important; /* 검은 글자 */
text-shadow: 0 1px 0 rgba(255,255,255,.25); /* 살짝 또렷 */
box-shadow: 0 10px 22px rgba(0,0,0,.10) !important;
}
/* disabled일 때 shine 제거 */
#terms_next_btn.terms-btn--primary:disabled::before{
content: none !important;
}
/* 활성 상태 */
#terms_next_btn.terms-btn--primary:not(:disabled){
background: linear-gradient(135deg, #2f6bff 0%, #4aa3ff 55%, #2fd2ff 100%);
color: #fff;
border-color: rgba(120,180,255,.55);
box-shadow:
0 14px 30px rgba(47,107,255,.28),
0 6px 14px rgba(74,163,255,.18);
}
/* shine 효과 */
#terms_next_btn.terms-btn--primary:not(:disabled)::before{
content:"";
position:absolute;
top:-30%;
left:-40%;
width:60%;
height:160%;
background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), transparent);
transform: rotate(18deg);
opacity:.55;
animation: termsShine 2.6s ease-in-out infinite;
pointer-events:none;
}
@keyframes termsShine{
0% { transform: translateX(-30%) rotate(18deg); opacity:.25; }
45% { opacity:.65; }
100% { transform: translateX(220%) rotate(18deg); opacity:.25; }
}
/* hover/active */
#terms_next_btn.terms-btn--primary:not(:disabled):hover{
transform: translateY(-1px);
box-shadow:
0 18px 40px rgba(47,107,255,.34),
0 8px 18px rgba(74,163,255,.22);
filter: saturate(1.08);
}
#terms_next_btn.terms-btn--primary:not(:disabled):active{
transform: translateY(0);
filter: saturate(1.0);
}
</style>
{{-- 페이지 전용 JS --}}
<script>
(function () {
const form = document.getElementById('regTermsForm');
const btn = document.getElementById('terms_next_btn');
const help = document.getElementById('terms_help');
const all = document.getElementById('agree_all');
const reqIds = ['agree_terms', 'agree_privacy', 'agree_age'];
const optIds = ['agree_marketing'];
const reqEls = reqIds.map(id => document.getElementById(id));
const optEls = optIds.map(id => document.getElementById(id));
const allEls = [...reqEls, ...optEls];
function requiredOk() {
return reqEls.every(el => el && el.checked);
}
function syncAllState() {
const checked = allEls.filter(el => el && el.checked).length;
all.checked = (checked === allEls.length);
all.indeterminate = (checked > 0 && checked < allEls.length);
}
function syncButton() {
const ok = requiredOk();
btn.disabled = !ok;
if (help) help.hidden = ok;
}
// 공통 메시지(모달 우선)
async function showAlert(msg, title='안내') {
if (window.showMsg) return await window.showMsg(msg, { type:'alert', title });
alert(msg);
return true;
}
// iframe 모달 오픈/닫기 (외부 클릭으로 닫히지 않게)
function openIframeModal(popupName = 'danal_authtel_popup', w = 420, h = 750) {
// 이미 떠 있으면 제거 후 다시
const old = document.getElementById(popupName);
if (old) old.remove();
const wrap = document.createElement('div');
wrap.id = popupName;
// ✅ step0(전화번호 입력 페이지) 이동 URL
const backUrl = @json(route('web.auth.register'));
wrap.innerHTML = `
<div class="danal-modal-dim" style="position:fixed;top:0;left:0;width:100%;height:100%;z-index:200000;background:#000;opacity:.55"></div>
<div class="danal-modal-box" style="position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:${w}px;height:${h}px;background:#fff;border-radius:10px;z-index:200001;overflow:hidden;">
<!-- ✅ 헤더 + 닫기버튼 -->
<div style="height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;background:rgba(0,0,0,.06);border-bottom:1px solid rgba(0,0,0,.08);">
<div style="font-weight:800;font-size:13px;color:#111;">PASS 본인인증</div>
<button type="button" id="${popupName}_close"
aria-label="인증창 닫기"
style="width:34px;height:34px;border-radius:10px;border:1px solid rgba(0,0,0,.12);background:#fff;cursor:pointer;font-size:18px;line-height:1;color:#111;">
×
</button>
</div>
<iframe id="${popupName}_iframe" name="${popupName}_iframe"
style="width:100%;height:calc(100% - 44px);border:none"></iframe>
</div>
`;
document.body.appendChild(wrap);
// 실제 닫기(제거)만 하는 함수
function removeModal() {
const el = document.getElementById(popupName);
if (el) el.remove();
}
async function askCancelAndGo() {
const msg = "인증을 중단합니다.\n처음부터 다시 진행 하시겠습니까?";
// ✅ 시스템 confirm (레이어/모달 z-index 영향을 안 받음)
if (window.confirm(msg)) {
// iframe 강제 종료(선택)
const ifr = document.getElementById(popupName + '_iframe');
if (ifr) ifr.src = 'about:blank';
// 모달 제거
const el = document.getElementById(popupName);
if (el) el.remove();
// Step0로 이동
window.location.href = @json(route('web.auth.register'));
}
}
// 닫기 버튼 핸들러
const closeBtn = wrap.querySelector('#' + popupName + '_close');
if (closeBtn) {
closeBtn.addEventListener('click', askCancelAndGo);
}
// ✅ 바깥 클릭으로 닫히지 않게 유지(기존 정책)
// wrap.querySelector('.danal-modal-dim').addEventListener('click', (e)=>e.preventDefault());
// ✅ ESC 키로도 “중단” 처리 (선택)
const escHandler = (e) => {
if (e.key === 'Escape') askCancelAndGo();
};
window.addEventListener('keydown', escHandler);
// 외부에서 호출 가능하게 유지
window.closeIframe = function () {
window.removeEventListener('keydown', escHandler);
removeModal();
};
return popupName + '_iframe';
}
function postToIframe(url, targetName, fieldsObj) {
const temp = document.createElement('form');
temp.method = 'POST';
temp.action = url;
temp.target = targetName;
// 라라벨 CSRF
const csrf = document.createElement('input');
csrf.type = 'hidden';
csrf.name = '_token';
csrf.value = "{{ csrf_token() }}";
temp.appendChild(csrf);
// fields(JSON 문자열로)
const fields = document.createElement('input');
fields.type = 'hidden';
fields.name = 'fields';
fields.value = JSON.stringify(fieldsObj || {});
temp.appendChild(fields);
document.body.appendChild(temp);
temp.submit();
temp.remove();
}
// 다날 결과 메시지 수신 (iframe -> parent)
window.addEventListener('message', async (ev) => {
const d = ev.data || {};
if (d.type !== 'danal_result') return;
// 모달 닫기
if (typeof window.closeIframe === 'function') window.closeIframe();
await showAlert(d.message || (d.ok ? '본인인증이 완료되었습니다.' : '본인인증에 실패했습니다.'), d.ok ? '인증 완료' : '인증 실패');
if (d.redirect) {
window.location.href = d.redirect;
}
});
// 전체 동의
all.addEventListener('change', function () {
allEls.forEach(el => { if (el) el.checked = all.checked; });
syncButton();
syncAllState();
});
// 개별 변경
allEls.forEach(el => {
if (!el) return;
el.addEventListener('change', function () {
syncButton();
syncAllState();
});
});
// 내용 보기 토글(스크롤 div)
document.querySelectorAll('[data-toggle]').forEach(btn2 => {
btn2.addEventListener('click', function () {
const id = btn2.getAttribute('data-toggle');
const panel = document.getElementById(id);
if (!panel) return;
const willOpen = panel.hidden === true;
panel.hidden = !willOpen;
btn2.textContent = willOpen ? '닫기' : '내용보기';
});
});
// 초기
syncButton();
syncAllState();
// 제출: (기존 기능 유지) 약관 저장 + 다날 시작으로 변경
form.addEventListener('submit', async function (e) {
e.preventDefault();
if (!requiredOk()) {
await showAlert('필수 약관에 동의해 주세요.', '안내');
syncButton();
return;
}
btn.disabled = true;
try {
// AJAX로 약관 저장 + 다날 준비값 받기
const body = {
agree_terms: document.getElementById('agree_terms')?.checked ? '1' : '',
agree_privacy: document.getElementById('agree_privacy')?.checked ? '1' : '',
agree_age: document.getElementById('agree_age')?.checked ? '1' : '',
agree_marketing: document.getElementById('agree_marketing')?.checked ? '1' : '',
};
const res = await fetch(form.action, {
method: 'POST',
credentials: 'same-origin',
headers: {
'Content-Type': 'application/json',
'X-CSRF-TOKEN': "{{ csrf_token() }}",
'Accept': 'application/json',
},
body: JSON.stringify(body),
});
const data = await res.json().catch(() => ({}));
if (!res.ok || data.ok === false) {
await showAlert(data.message || '처리 중 오류가 발생했습니다. 잠시 후 다시 시도해 주세요ff.', '오류');
return;
}
// 서버가 danal_ready를 내려주면 iframe 모달 실행
if (data.reason === 'danal_ready' && data.popup && data.popup.url) {
const targetName = openIframeModal('danal_authtel_popup', 420, 750);
postToIframe(data.popup.url, targetName, data.popup.fields || {});
return;
}
// (혹시) 준비중/리다이렉트 방식일 때 fallback
if (data.redirect) {
window.location.href = data.redirect;
return;
}
await showAlert('약관 동의가 저장되었습니다.', '완료');
} catch (err) {
await showAlert('네트워크 오류가 발생했습니다. 잠시 후 다시 시도해 주세요.', '오류');
} finally {
btn.disabled = false;
}
});
})();
</script>
@endsection