feat: 개인정보 처리방침 페이지 추가 (/privacy)
- 한국 개인정보보호법 형식의 처리방침 페이지 - 수집 항목, 이용 목적, 보유 기간, 제3자 제공 등 카카오 심사 요건 충족 - claim_form.html 동의 텍스트에 /privacy 링크 연결 - 적립 페이지 하단에 개인정보 처리방침 푸터 링크 추가 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
thug0bin
parent
d1a5964bb7
commit
62502c81b3
256
backend/templates/privacy.html
Normal file
256
backend/templates/privacy.html
Normal file
@ -0,0 +1,256 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="ko">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="theme-color" content="#6366f1">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||||
<meta name="apple-mobile-web-app-title" content="청춘약국">
|
||||
<link rel="manifest" href="/static/manifest.json">
|
||||
<link rel="apple-touch-icon" href="/static/icons/icon-192.png">
|
||||
<link rel="icon" type="image/png" sizes="192x192" href="/static/icons/icon-192.png">
|
||||
<title>개인정보 처리방침 - 청춘약국</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700&display=swap" rel="stylesheet">
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||||
background: #f5f7fa;
|
||||
min-height: 100vh;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.app-container {
|
||||
background: #ffffff;
|
||||
max-width: 420px;
|
||||
margin: 0 auto;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.header {
|
||||
background: linear-gradient(135deg, #6366f1 0%, #8b5cf6 100%);
|
||||
padding: 0 24px;
|
||||
height: 56px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
font-weight: 700;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
||||
.btn-back {
|
||||
color: rgba(255, 255, 255, 0.9);
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
text-decoration: none;
|
||||
letter-spacing: -0.2px;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #212529;
|
||||
margin: 28px 0 12px 0;
|
||||
letter-spacing: -0.3px;
|
||||
}
|
||||
|
||||
.section-title:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
color: #495057;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
font-weight: 400;
|
||||
letter-spacing: -0.2px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding-left: 20px;
|
||||
margin: 8px 0 12px 0;
|
||||
}
|
||||
|
||||
li {
|
||||
color: #495057;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
font-weight: 400;
|
||||
letter-spacing: -0.2px;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.info-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin: 12px 0;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.info-table th,
|
||||
.info-table td {
|
||||
border: 1px solid #e9ecef;
|
||||
padding: 10px 12px;
|
||||
text-align: left;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.info-table th {
|
||||
background: #f8f9fa;
|
||||
color: #495057;
|
||||
font-weight: 600;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.info-table td {
|
||||
color: #495057;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.effective-date {
|
||||
color: #868e96;
|
||||
font-size: 13px;
|
||||
margin-top: 32px;
|
||||
padding-top: 16px;
|
||||
border-top: 1px solid #e9ecef;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
.header {
|
||||
padding-top: env(safe-area-inset-top, 0px);
|
||||
height: calc(56px + env(safe-area-inset-top, 0px));
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="app-container">
|
||||
<div class="header">
|
||||
<div class="header-title">개인정보 처리방침</div>
|
||||
<a href="javascript:history.back()" class="btn-back">돌아가기</a>
|
||||
</div>
|
||||
|
||||
<div class="content">
|
||||
<p>청춘약국(이하 "약국")은 「개인정보 보호법」에 따라 고객의 개인정보를 보호하고 이와 관련한 고충을 신속하고 원활하게 처리할 수 있도록 다음과 같이 개인정보 처리방침을 수립·공개합니다.</p>
|
||||
|
||||
<div class="section-title">1. 수집하는 개인정보 항목 및 수집 방법</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<th>수집 방법</th>
|
||||
<th>수집 항목</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>직접 입력</td>
|
||||
<td>전화번호, 이름</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>카카오 로그인</td>
|
||||
<td>카카오 계정 식별자(ID), 닉네임, 프로필 이미지, 이메일, 이름</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>자동 수집</td>
|
||||
<td>구매 내역(품목명, 수량, 금액, 일시)</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="section-title">2. 개인정보의 수집 및 이용 목적</div>
|
||||
<ul>
|
||||
<li>마일리지 포인트 적립 및 관리</li>
|
||||
<li>고객 식별 및 본인 확인</li>
|
||||
<li>적립 내역 조회 서비스 제공</li>
|
||||
<li>구매 이력 기반 맞춤 서비스 제공</li>
|
||||
</ul>
|
||||
|
||||
<div class="section-title">3. 개인정보의 보유 및 이용 기간</div>
|
||||
<p>약국은 개인정보 수집 및 이용 목적이 달성된 후에는 해당 정보를 지체 없이 파기합니다. 단, 관계 법령에 의해 보존이 필요한 경우에는 해당 법령에서 정한 기간 동안 보관합니다.</p>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<th>보존 항목</th>
|
||||
<th>보존 기간</th>
|
||||
<th>근거 법령</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>거래 기록</td>
|
||||
<td>5년</td>
|
||||
<td>부가가치세법</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>회원 정보</td>
|
||||
<td>탈퇴 시까지</td>
|
||||
<td>개인정보 보호법</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="section-title">4. 개인정보의 제3자 제공</div>
|
||||
<p>약국은 고객의 개인정보를 제3자에게 제공하지 않습니다. 카카오 로그인은 본인 인증 목적으로만 사용되며, 약국에서 카카오에 고객 정보를 제공하지 않습니다.</p>
|
||||
|
||||
<div class="section-title">5. 개인정보의 파기 절차 및 방법</div>
|
||||
<ul>
|
||||
<li>전자적 파일: 복구 및 재생이 불가능한 기술적 방법으로 삭제</li>
|
||||
<li>종이 문서: 분쇄기로 분쇄하거나 소각</li>
|
||||
</ul>
|
||||
|
||||
<div class="section-title">6. 정보주체의 권리·의무 및 행사 방법</div>
|
||||
<p>고객은 언제든지 자신의 개인정보에 대해 다음과 같은 권리를 행사할 수 있습니다.</p>
|
||||
<ul>
|
||||
<li>개인정보 열람 요구</li>
|
||||
<li>오류 등이 있을 경우 정정 요구</li>
|
||||
<li>삭제 요구</li>
|
||||
<li>처리 정지 요구</li>
|
||||
</ul>
|
||||
<p>위 권리 행사는 약국에 직접 방문하시거나, 아래 연락처로 문의해주시기 바랍니다.</p>
|
||||
|
||||
<div class="section-title">7. 개인정보 보호 책임자</div>
|
||||
<table class="info-table">
|
||||
<tr>
|
||||
<th>상호</th>
|
||||
<td>청춘약국</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>책임자</th>
|
||||
<td>약국 대표</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>연락처</th>
|
||||
<td>약국 방문 또는 전화 문의</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="section-title">8. 개인정보 자동 수집 장치의 설치·운영 및 거부</div>
|
||||
<p>약국은 서비스 이용 과정에서 세션 쿠키를 사용하여 로그인 상태를 유지합니다. 쿠키는 브라우저 설정을 통해 거부할 수 있으나, 이 경우 자동 적립 기능 등 일부 서비스 이용이 제한될 수 있습니다.</p>
|
||||
|
||||
<div class="effective-date">
|
||||
시행일: 2026년 2월 25일
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
if ('serviceWorker' in navigator) {
|
||||
navigator.serviceWorker.register('/sw.js').catch(()=>{});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Reference in New Issue
Block a user