Files
sam-manage/resources/views/lab/strategy/tax.blade.php
hskwon e91789ff3d 사이드바 메뉴 버그 수정
- 테넌트 메뉴: session 대신 로그인 사용자의 tenant_id만 사용
- 메뉴 그룹 토글: 자식 있으면 기본 표시, localStorage 복원 로직 통일
- 프레젠테이션 페이지 CSS: 글로벌 선택자를 .presentation-container로 스코핑
2025-12-16 23:22:44 +09:00

872 lines
76 KiB
PHP

@extends('layouts.app')
@section('title', '장기적 세무전략')
@push('styles')
<style>
/* Custom Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.presentation-container {
width: 100%;
min-height: calc(100vh - 80px);
position: relative;
overflow: hidden;
background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
}
.slide {
width: 100%;
min-height: calc(100vh - 80px);
display: none;
align-items: flex-start;
justify-content: center;
padding: 40px;
position: absolute;
top: 0;
left: 0;
overflow-y: auto;
overflow-x: hidden;
}
.slide.active {
display: flex;
animation: slideInRight 0.5s ease-out;
}
.slide-content {
background: rgba(255, 255, 255, 0.98);
border-radius: 24px;
padding: 60px;
max-width: 1200px;
width: 100%;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.05);
animation: fadeIn 0.8s ease-out;
margin: auto 0;
border: 1px solid rgba(255, 255, 255, 0.2);
}
.presentation-container h1 { color: #2563eb; font-size: 3em; margin-bottom: 20px; text-align: center; font-weight: 800; }
.presentation-container h2 { color: #1e40af; font-size: 2.5em; margin-bottom: 30px; text-align: center; border-bottom: 3px solid #2563eb; padding-bottom: 15px; font-weight: 700; }
.presentation-container h3 { color: #2563eb; font-size: 1.8em; margin: 25px 0 15px 0; font-weight: 700; }
.presentation-container p, .presentation-container li { font-size: 1.2em; line-height: 1.8; color: #1e293b; margin-bottom: 15px; }
.presentation-container ul { margin-left: 30px; }
.company-info { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; margin: 30px 0; }
.info-card {
background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
color: white;
padding: 25px;
border-radius: 16px;
box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
animation: scaleIn 0.5s ease-out;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.info-card h4 { font-size: 1.3em; margin-bottom: 10px; border-bottom: 2px solid rgba(255, 255, 255, 0.3); padding-bottom: 8px; }
.comparison-table { width: 100%; border-collapse: collapse; margin: 25px 0; font-size: 1em; }
.comparison-table th, .comparison-table td { padding: 12px; border: 1px solid #ddd; text-align: left; }
.comparison-table thead tr { background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); color: white; }
.comparison-table tbody tr:nth-of-type(even) { background: #f3f3f3; }
.pricing-table { width: 100%; border-collapse: collapse; margin: 25px 0; font-size: 1.1em; box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); animation: slideInLeft 0.5s ease-out; }
.pricing-table thead tr { background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); color: white; text-align: left; }
.pricing-table th, .pricing-table td { padding: 15px; border: 1px solid #ddd; }
.pricing-table tbody tr { background: white; }
.pricing-table tbody tr:nth-of-type(even) { background: #f3f3f3; }
.pricing-table tbody tr:hover { background: #e8e8ff; }
.highlight { background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); color: white; padding: 5px 10px; border-radius: 8px; font-weight: 700; }
.navigation { position: fixed; bottom: 30px; right: 30px; display: flex; gap: 15px; z-index: 1000; }
.nav-btn {
background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
color: white;
border: none;
padding: 15px 30px;
border-radius: 9999px;
cursor: pointer;
font-size: 1.1em;
font-weight: 600;
box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
transition: all 0.3s ease;
}
.nav-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(37, 99, 235, 0.4); background: linear-gradient(135deg, #1d4ed8 0%, #1e3a8a 100%); }
.nav-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.slide-number {
position: fixed;
bottom: 30px;
left: 50%;
transform: translateX(-50%);
background: rgba(255, 255, 255, 0.95);
padding: 12px 24px;
border-radius: 9999px;
font-size: 1.1em;
color: #2563eb;
font-weight: 700;
z-index: 1000;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
border: 1px solid rgba(37, 99, 235, 0.1);
}
.feature-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 15px; margin: 20px 0; }
.feature-item { background: #f8fafc; padding: 20px; border-radius: 12px; border-left: 4px solid #2563eb; border: 1px solid #e2e8f0; border-left-width: 4px; }
.conclusion-box {
background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
color: white;
padding: 30px;
border-radius: 16px;
margin: 20px 0;
text-align: center;
box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
}
.conclusion-box p { color: white; }
.scenario-box {
padding: 25px;
border-radius: 16px;
margin: 20px 0;
border-left: 5px solid;
}
.scenario-box.blue { background: #dbeafe; border-left-color: #2563eb; }
.scenario-box.indigo { background: #e0e7ff; border-left-color: #1e40af; }
.scenario-box.amber { background: #fef3c7; border-left-color: #f59e0b; border: 1px solid #fde68a; }
.scenario-box h3 { margin-top: 0; color: #1e40af; font-weight: 700; }
.info-box {
margin-top: 30px;
padding: 25px;
background: #f1f5f9;
border-radius: 16px;
border-left: 5px solid #2563eb;
border: 1px solid #e2e8f0;
}
.info-box h3 { margin-top: 0; }
@keyframes slideInRight { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes slideInLeft { from { transform: translateX(-50px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes scaleIn { from { transform: scale(0.9); opacity: 0; } to { transform: scale(1); opacity: 1; } }
@media (max-width: 768px) {
.slide-content { padding: 30px; }
.presentation-container h1 { font-size: 2em; }
.presentation-container h2 { font-size: 1.8em; }
.presentation-container h3 { font-size: 1.4em; }
.presentation-container p, .presentation-container li { font-size: 1em; }
.navigation { bottom: 15px; right: 15px; }
.nav-btn { padding: 10px 20px; font-size: 0.9em; }
.slide-number { bottom: 15px; left: 50%; transform: translateX(-50%); padding: 8px 15px; font-size: 0.9em; }
.pricing-table, .comparison-table { font-size: 0.8em; }
.pricing-table th, .pricing-table td, .comparison-table th, .comparison-table td { padding: 8px; }
}
</style>
@endpush
@section('content')
<div class="presentation-container">
<!-- Slide 1: Cover -->
<div class="slide active">
<div class="slide-content">
<h1>장기적 세무전략</h1>
<h2 style="border: none; color: #2563eb;">통합 세무 관리 시스템 중장기 계획안</h2>
<div style="text-align: center; margin-top: 50px;">
<p style="font-size: 1.5em; color: #1e40af; font-weight: 600;">기획 · 디자인 · 백엔드 · 프론트엔드</p>
<p style="margin-top: 30px; color: #64748b;">2025 세무 자동화 솔루션 - 중장기 발전 계획</p>
</div>
</div>
</div>
<!-- Slide 2: Table of Contents -->
<div class="slide">
<div class="slide-content">
<h2>목차</h2>
<div style="margin-top: 40px;">
<div class="feature-item"><h3 style="margin: 0; font-size: 1.3em;">1-4. 프로젝트 개요</h3><p style="margin: 10px 0 0 0;">비전, 목표, 핵심 가치, 기대 효과</p></div>
<div class="feature-item"><h3 style="margin: 0; font-size: 1.3em;">5-8. 기획 관점</h3><p style="margin: 10px 0 0 0;">요구사항 정의, 사용자 시나리오, 기능 명세</p></div>
<div class="feature-item"><h3 style="margin: 0; font-size: 1.3em;">9-11. 디자인 관점</h3><p style="margin: 10px 0 0 0;">UI/UX 전략, 디자인 시스템, 사용자 경험</p></div>
<div class="feature-item"><h3 style="margin: 0; font-size: 1.3em;">12-14. 백엔드 관점</h3><p style="margin: 10px 0 0 0;">시스템 아키텍처, 데이터베이스 설계, API 설계</p></div>
<div class="feature-item"><h3 style="margin: 0; font-size: 1.3em;">15-16. 프론트엔드 관점</h3><p style="margin: 10px 0 0 0;">기술 스택, 컴포넌트 구조, 개발 로드맵</p></div>
</div>
</div>
</div>
<!-- Slide 3: Project Vision -->
<div class="slide">
<div class="slide-content">
<h2>프로젝트 비전</h2>
<div class="conclusion-box">
<h3 style="color: white; margin-top: 0;">세무 업무의 디지털 혁신</h3>
<p style="font-size: 1.3em;">복잡한 세무 업무를 자동화하고, 전략적 의사결정을 지원하는 통합 플랫폼</p>
</div>
<div style="margin-top: 30px;">
<h3>핵심 목표</h3>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" /></svg> 업무 자동화</h4><p>반복적인 세무 업무를 90% 이상 자동화</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg> 데이터 통합</h4><p>회계, 인사, 영업 데이터의 실시간 통합</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285z" /></svg> 리스크 관리</h4><p>세무 리스크 사전 감지 알림</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941" /></svg> 전략 수립</h4><p>데이터 기반 세무 전략 의사결정 지원</p></div>
</div>
</div>
<div style="margin-top: 30px;">
<h3>주요 타겟 사용자</h3>
<ul>
<li><strong>세무사/회계사:</strong> 전문가용 세무 관리 도구</li>
<li><strong>기업 재무팀:</strong> 내부 세무 업무 자동화</li>
<li><strong>중소기업:</strong> 간편한 세무 컴플라이언스 관리</li>
<li><strong>스타트업:</strong> 초기 세무 구조 설계 지원</li>
</ul>
</div>
</div>
</div>
<!-- Slide 4: Core Values -->
<div class="slide">
<div class="slide-content">
<h2>핵심 가치 제안</h2>
<div class="company-info">
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.02 48.02 0 0112 21c-2.773 0-5.491-.235-8.135-.698-1.717-.293-2.3-2.379-1.067-3.61L5 14.5" /></svg> 자동화</h4><p>세금 계산, 신고서 작성, 납부 관리 자동화</p><p style="font-size: 0.9em; margin-top: 10px; opacity: 0.9;">매월 80시간 업무 시간 절감</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.19 8.688a4.5 4.5 0 011.242 7.244l-4.5 4.5a4.5 4.5 0 01-6.364-6.364l1.757-1.757m13.35-.622l1.757-1.757a4.5 4.5 0 00-6.364-6.364l-4.5 4.5a4.5 4.5 0 001.242 7.244" /></svg> 통합성</h4><p>회계 시스템, ERP, 급여 시스템 연동</p><p style="font-size: 0.9em; margin-top: 10px; opacity: 0.9;">데이터 이중 입력 제거</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3" /></svg> 접근성</h4><p>클라우드 기반 언제 어디서나 접근</p><p style="font-size: 0.9em; margin-top: 10px; opacity: 0.9;">PC, 태블릿, 모바일 지원</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg> 정확성</h4><p>최신 세법 자동 반영 검증</p><p style="font-size: 0.9em; margin-top: 10px; opacity: 0.9;">인적 오류 95% 감소</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18v-5.25m0 0a6.01 6.01 0 001.5-.189m-1.5.189a6.01 6.01 0 01-1.5-.189m3.75 7.478a12.06 12.06 0 01-4.5 0m3.75 2.383a14.406 14.406 0 01-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 10-7.517 0c.85.493 1.509 1.333 1.509 2.316V18" /></svg> 인사이트</h4><p>AI 기반 세무 최적화 제안</p><p style="font-size: 0.9em; margin-top: 10px; opacity: 0.9;">절세 기회 자동 발견</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z" /></svg> 보안</h4><p>금융권 수준의 데이터 보안</p><p style="font-size: 0.9em; margin-top: 10px; opacity: 0.9;">암호화 접근 제어</p></div>
</div>
</div>
</div>
<!-- Slide 5: Planning - Requirements -->
<div class="slide">
<div class="slide-content">
<h2>기획: 기능 요구사항</h2>
<div style="margin-top: 30px;">
<h3>1. 세무 신고 관리</h3>
<ul>
<li>부가가치세 신고서 자동 작성 전송</li>
<li>법인세/소득세 예정/확정 신고 관리</li>
<li>원천세 신고 납부 스케줄링</li>
<li>지방세 통합 관리 (취득세, 재산세 )</li>
</ul>
</div>
<div style="margin-top: 30px;">
<h3>2. 세무 회계 처리</h3>
<ul>
<li>매입매출 전표 자동 분개 처리</li>
<li>계정과목 자동 매핑 학습</li>
<li>세무조정 항목 관리</li>
<li>손익계산서 재무상태표 생성</li>
</ul>
</div>
<div style="margin-top: 30px;">
<h3>3. 증빙 관리</h3>
<ul>
<li>전자세금계산서 발행 수신</li>
<li>현금영수증 카드매출 통합</li>
<li>증빙 스캔 OCR 자동 인식</li>
<li>증빙 보관 검색 시스템</li>
</ul>
</div>
</div>
</div>
<!-- Slide 6: User Scenarios -->
<div class="slide">
<div class="slide-content">
<h2>기획: 사용자 시나리오</h2>
<div class="scenario-box blue">
<h3>시나리오 1: 부가세 신고 프로세스</h3>
<ol style="color: #333;">
<li><strong>데이터 수집:</strong> ERP 회계 시스템에서 매입/매출 데이터 자동 수집</li>
<li><strong>검증:</strong> AI 기반 이상 거래 탐지 알림</li>
<li><strong>신고서 작성:</strong> 부가세 신고서 자동 생성 미리보기</li>
<li><strong>승인:</strong> 담당자 검토 전자서명</li>
<li><strong>전송:</strong> 국세청 홈택스 자동 전송</li>
<li><strong>납부:</strong> 계좌 연동 자동 납부 또는 납부서 출력</li>
</ol>
</div>
<div class="scenario-box indigo">
<h3>시나리오 2: 절세 전략 수립</h3>
<ol style="color: #333;">
<li><strong>현황 분석:</strong> 현재 세무 부담 비용 구조 분석</li>
<li><strong>시뮬레이션:</strong> 다양한 절세 시나리오 자동 시뮬레이션</li>
<li><strong>추천:</strong> AI 기반 최적 절세 방안 제시</li>
<li><strong>실행:</strong> 선택한 전략의 단계별 실행 가이드</li>
<li><strong>모니터링:</strong> 효과 추적 리포팅</li>
</ol>
</div>
</div>
</div>
<!-- Slide 7: Advanced Features -->
<div class="slide">
<div class="slide-content">
<h2>기획: 고급 기능</h2>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.02 48.02 0 0112 21c-2.773 0-5.491-.235-8.135-.698-1.717-.293-2.3-2.379-1.067-3.61L5 14.5" /></svg> AI 세무 어시스턴트</h4><p>자연어 질의응답으로 세무 문의 즉시 해결</p><p style="font-size: 0.9em; margin-top: 5px; color: #666;">"이번 달 부가세 예상액은?" 같은 질문에 즉시 답변</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg> 세무 대시보드</h4><p>실시간 세무 현황 KPI 모니터링</p><p style="font-size: 0.9em; margin-top: 5px; color: #666;">납부 일정, 세부담률, 공제 현황 한눈에 확인</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" /></svg> 리스크 알림</h4><p>세무 리스크 사전 감지 예방</p><p style="font-size: 0.9em; margin-top: 5px; color: #666;">신고 누락, 기한 임박, 이상 거래 자동 알림</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941" /></svg> 절세 시뮬레이터</h4><p>다양한 시나리오별 세금 영향 분석</p><p style="font-size: 0.9em; margin-top: 5px; color: #666;">투자, 채용, 구조조정 세무 영향 사전 검토</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.19 8.688a4.5 4.5 0 011.242 7.244l-4.5 4.5a4.5 4.5 0 01-6.364-6.364l1.757-1.757m13.35-.622l1.757-1.757a4.5 4.5 0 00-6.364-6.364l-4.5 4.5a4.5 4.5 0 001.242 7.244" /></svg> 외부 시스템 연동</h4><p>ERP, 급여, 회계 시스템 자동 연동</p><p style="font-size: 0.9em; margin-top: 5px; color: #666;">더존, 영림원, SAP, 더블린 주요 시스템 지원</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3" /></svg> 모바일 승인</h4><p>언제 어디서나 신고서 검토 승인</p><p style="font-size: 0.9em; margin-top: 5px; color: #666;">푸시 알림 생체인증 기반 전자서명</p></div>
</div>
<div class="scenario-box amber">
<h3 style="color: #92400e;">컴플라이언스 기능</h3>
<ul style="color: #78350f;">
<li><strong>세법 자동 업데이트:</strong> 개정 세법 자동 반영 영향 분석</li>
<li><strong>전자신고 통합:</strong> 홈택스, 위택스 전자신고 시스템 연동</li>
<li><strong>감사 추적:</strong> 모든 세무 처리 이력 완벽 기록 추적</li>
<li><strong>권한 관리:</strong> 역할 기반 접근 제어 승인 워크플로우</li>
</ul>
</div>
</div>
</div>
<!-- Slide 8: User Roles -->
<div class="slide">
<div class="slide-content">
<h2>기획: 사용자 권한 체계</h2>
<table class="comparison-table">
<thead><tr><th>역할</th><th>주요 권한</th><th>접근 범위</th></tr></thead>
<tbody>
<tr><td><strong>시스템 관리자</strong></td><td>전체 시스템 설정, 사용자 관리, 감사 로그 조회</td><td>전체</td></tr>
<tr><td><strong>세무 책임자</strong></td><td>신고서 최종 승인, 전략 수립, 리포트 생성</td><td>전체 세무 데이터</td></tr>
<tr><td><strong>세무 담당자</strong></td><td>신고서 작성, 증빙 처리, 세무조정</td><td>담당 업무 데이터</td></tr>
<tr><td><strong>회계 담당자</strong></td><td>전표 입력, 계정 관리, 증빙 등록</td><td>회계 데이터</td></tr>
<tr><td><strong>경영진</strong></td><td>대시보드 조회, 리포트 확인 (읽기 전용)</td><td>요약 데이터</td></tr>
<tr><td><strong>외부 세무사</strong></td><td>자문, 검토, 신고 대행 (제한적 접근)</td><td>위임받은 데이터</td></tr>
</tbody>
</table>
<div style="margin-top: 30px;">
<h3>워크플로우 승인 체계</h3>
<div style="background: #f1f5f9; padding: 20px; border-radius: 12px; margin: 15px 0; border: 1px solid #e2e8f0;">
<p><strong>1단계:</strong> 세무 담당자가 신고서 작성</p>
<p><strong>2단계:</strong> 회계 담당자가 데이터 검증</p>
<p><strong>3단계:</strong> 세무 책임자가 최종 승인</p>
<p><strong>4단계:</strong> 시스템 자동 전송 또는 경영진 통보</p>
</div>
</div>
</div>
</div>
<!-- Slide 9: UI/UX Strategy -->
<div class="slide">
<div class="slide-content">
<h2>디자인: UI/UX 전략</h2>
<div class="conclusion-box">
<h3 style="color: white; margin-top: 0;">디자인 철학</h3>
<p style="font-size: 1.2em;">"복잡한 세무를 단순하게, 전문성을 직관적으로"</p>
</div>
<div style="margin-top: 30px;">
<h3>핵심 디자인 원칙</h3>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg> 단순성</h4><p>복잡한 세무 프로세스를 단계별로 분해</p><p style="font-size: 0.9em; color: #666;">마법사(Wizard) 형태의 진행 방식</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg> 시각화</h4><p>숫자와 데이터를 직관적인 차트로 표현</p><p style="font-size: 0.9em; color: #666;">인포그래픽 중심의 대시보드</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" /></svg> 효율성</h4><p>최소 클릭으로 작업 완료</p><p style="font-size: 0.9em; color: #666;">자주 쓰는 기능 빠른 실행</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.53 16.122a3 3 0 00-5.78 1.128 2.25 2.25 0 01-2.4 2.245 4.5 4.5 0 008.4-2.245c0-.399-.078-.78-.22-1.128zm0 0a15.998 15.998 0 003.388-1.62m-5.043-.025a15.994 15.994 0 011.622-3.395m3.42 3.42a15.995 15.995 0 004.764-4.648l3.876-5.814a1.151 1.151 0 00-1.597-1.597L14.146 6.32a15.996 15.996 0 00-4.649 4.763m3.42 3.42a6.776 6.776 0 00-3.42-3.42" /></svg> 일관성</h4><p>통일된 디자인 언어 패턴</p><p style="font-size: 0.9em; color: #666;">학습 곡선 최소화</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 18.72a9.094 9.094 0 003.741-.479 3 3 0 00-4.682-2.72m.94 3.198l.001.031c0 .225-.012.447-.037.666A11.944 11.944 0 0112 21c-2.17 0-4.207-.576-5.963-1.584A6.062 6.062 0 016 18.719m12 0a5.971 5.971 0 00-.941-3.197m0 0A5.995 5.995 0 0012 12.75a5.995 5.995 0 00-5.058 2.772m0 0a3 3 0 00-4.681 2.72 8.986 8.986 0 003.74.477m.94-3.197a5.971 5.971 0 00-.94 3.197M15 6.75a3 3 0 11-6 0 3 3 0 016 0zm6 3a2.25 2.25 0 11-4.5 0 2.25 2.25 0 014.5 0zm-13.5 0a2.25 2.25 0 11-4.5 0 2.25 2.25 0 014.5 0z" /></svg> 접근성</h4><p>WCAG 2.1 AA 레벨 준수</p><p style="font-size: 0.9em; color: #666;">키보드 내비게이션 완벽 지원</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3" /></svg> 반응형</h4><p>모든 디바이스에서 최적 경험</p><p style="font-size: 0.9em; color: #666;">PC, 태블릿, 모바일 대응</p></div>
</div>
</div>
<div style="margin-top: 30px;">
<h3>컬러 시스템</h3>
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 15px; margin-top: 15px;">
<div style="background: #2563eb; color: white; padding: 20px; border-radius: 12px; text-align: center;"><p style="margin: 0; color: white; font-weight: 700;"><strong>Primary</strong></p><p style="margin: 5px 0 0 0; font-size: 0.9em; color: white;">#2563eb</p></div>
<div style="background: #10b981; color: white; padding: 20px; border-radius: 12px; text-align: center;"><p style="margin: 0; color: white; font-weight: 700;"><strong>Success</strong></p><p style="margin: 5px 0 0 0; font-size: 0.9em; color: white;">#10b981</p></div>
<div style="background: #f59e0b; color: white; padding: 20px; border-radius: 12px; text-align: center;"><p style="margin: 0; color: white; font-weight: 700;"><strong>Warning</strong></p><p style="margin: 5px 0 0 0; font-size: 0.9em; color: white;">#f59e0b</p></div>
<div style="background: #ef4444; color: white; padding: 20px; border-radius: 12px; text-align: center;"><p style="margin: 0; color: white; font-weight: 700;"><strong>Danger</strong></p><p style="margin: 5px 0 0 0; font-size: 0.9em; color: white;">#ef4444</p></div>
</div>
</div>
</div>
</div>
<!-- Slide 10: Design System -->
<div class="slide">
<div class="slide-content">
<h2>디자인: 디자인 시스템</h2>
<div style="margin-top: 30px;">
<h3>컴포넌트 라이브러리</h3>
<table class="comparison-table">
<thead><tr><th>컴포넌트</th><th>용도</th><th>변형</th></tr></thead>
<tbody>
<tr><td><strong>Button</strong></td><td>주요 액션 실행</td><td>Primary, Secondary, Outline, Text</td></tr>
<tr><td><strong>Card</strong></td><td>정보 그룹핑</td><td>Basic, Elevated, Outlined</td></tr>
<tr><td><strong>Table</strong></td><td>데이터 표시</td><td>Sortable, Filterable, Paginated</td></tr>
<tr><td><strong>Form</strong></td><td>데이터 입력</td><td>Input, Select, Datepicker, Autocomplete</td></tr>
<tr><td><strong>Modal</strong></td><td>팝업 대화상자</td><td>Alert, Confirm, Form</td></tr>
<tr><td><strong>Chart</strong></td><td>데이터 시각화</td><td>Line, Bar, Pie, Donut</td></tr>
</tbody>
</table>
</div>
<div style="margin-top: 30px;">
<h3>타이포그래피</h3>
<div style="background: #f1f5f9; padding: 20px; border-radius: 12px; border: 1px solid #e2e8f0;">
<p><strong>본문:</strong> Noto Sans KR (가독성 최적화)</p>
<p><strong>숫자:</strong> Roboto Mono ( 금액 표시)</p>
<p><strong>제목:</strong> Spoqa Han Sans (명확한 위계)</p>
</div>
</div>
<div style="margin-top: 30px;">
<h3>아이콘 시스템</h3>
<ul>
<li>Material Icons (기본 UI 아이콘)</li>
<li>Custom Tax Icons (세무 특화 아이콘)</li>
<li>일관된 24x24px 그리드 시스템</li>
<li>Outlined, Filled 스타일 제공</li>
</ul>
</div>
</div>
</div>
<!-- Slide 11: User Experience -->
<div class="slide">
<div class="slide-content">
<h2>디자인: 사용자 경험 설계</h2>
<div class="scenario-box blue">
<h3 style="color: #004085;">대시보드 레이아웃</h3>
<ul style="color: #333;">
<li><strong>상단:</strong> 주요 KPI 카드 (이번 납부 세액, 공제액, 세부담률)</li>
<li><strong>중단:</strong> 일정 타임라인 (다가오는 신고 납부 일정)</li>
<li><strong>하단:</strong> 상세 차트 (월별 세금 추이, 업종 비교)</li>
<li><strong>사이드:</strong> 빠른 실행 메뉴 알림 센터</li>
</ul>
</div>
<div class="scenario-box indigo">
<h3 style="color: #6a1b9a;">신고서 작성 UX</h3>
<ol style="color: #333;">
<li><strong>Step 1 - 기간 선택:</strong> 신고 대상 기간 신고 유형 선택</li>
<li><strong>Step 2 - 데이터 확인:</strong> 자동 수집된 데이터 검토 수정</li>
<li><strong>Step 3 - 계산 검증:</strong> 세액 계산 결과 미리보기</li>
<li><strong>Step 4 - 첨부 서류:</strong> 필요 서류 업로드 전자서명</li>
<li><strong>Step 5 - 최종 확인:</strong> 요약 정보 확인 제출</li>
</ol>
<p style="margin-top: 15px; color: #333;"><strong>진행 표시:</strong> 단계별 진행 상황 프로그레스 표시</p>
</div>
<div style="margin-top: 30px;">
<h3>피드백 알림 시스템</h3>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg> 성공 메시지</h4><p>작업 완료 명확한 확인 메시지</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z" /></svg> 경고 알림</h4><p>주의가 필요한 항목 강조 표시</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-red-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg> 오류 안내</h4><p>문제 발생 해결 방법 제시</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18v-5.25m0 0a6.01 6.01 0 001.5-.189m-1.5.189a6.01 6.01 0 01-1.5-.189m3.75 7.478a12.06 12.06 0 01-4.5 0m3.75 2.383a14.406 14.406 0 01-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 10-7.517 0c.85.493 1.509 1.333 1.509 2.316V18" /></svg> 도움말</h4><p>컨텍스트 기반 도움말 제공</p></div>
</div>
</div>
</div>
</div>
<!-- Slide 12: Backend Architecture -->
<div class="slide">
<div class="slide-content">
<h2>백엔드: 시스템 아키텍처</h2>
<div class="conclusion-box">
<h3 style="color: white; margin-top: 0;">마이크로서비스 아키텍처</h3>
<p style="font-size: 1.2em;">확장 가능하고 유지보수가 쉬운 분산 시스템</p>
</div>
<div style="margin-top: 30px;">
<h3>주요 서비스 구성</h3>
<div class="company-info">
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z" /></svg> 인증 서비스</h4><p>JWT 기반 인증 권한 관리</p><p style="font-size: 0.9em; margin-top: 5px;">OAuth 2.0, 2FA 지원</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg> 데이터 수집 서비스</h4><p>외부 시스템 데이터 수집 변환</p><p style="font-size: 0.9em; margin-top: 5px;">ETL 파이프라인</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.75 15.75V18m-7.5-6.75h.008v.008H8.25v-.008zm0 2.25h.008v.008H8.25V13.5zm0 2.25h.008v.008H8.25v-.008zm0 2.25h.008v.008H8.25V18zm2.498-6.75h.007v.008h-.007v-.008zm0 2.25h.007v.008h-.007V13.5zm0 2.25h.007v.008h-.007v-.008zm0 2.25h.007v.008h-.007V18zm2.504-6.75h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V13.5zm0 2.25h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V18zm2.498-6.75h.008v.008h-.008v-.008zm0 2.25h.008v.008h-.008V13.5zM8.25 6h7.5v2.25h-7.5V6zM12 2.25c-1.892 0-3.758.11-5.593.322C5.307 2.7 4.5 3.65 4.5 4.757V19.5a2.25 2.25 0 002.25 2.25h10.5a2.25 2.25 0 002.25-2.25V4.757c0-1.108-.806-2.057-1.907-2.185A48.507 48.507 0 0012 2.25z" /></svg> 계산 엔진</h4><p>세금 계산 시뮬레이션</p><p style="font-size: 0.9em; margin-top: 5px;">규칙 엔진 기반</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" /></svg> 신고서 생성</h4><p>각종 신고서 자동 작성</p><p style="font-size: 0.9em; margin-top: 5px;">PDF/XML 변환</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.19 8.688a4.5 4.5 0 011.242 7.244l-4.5 4.5a4.5 4.5 0 01-6.364-6.364l1.757-1.757m13.35-.622l1.757-1.757a4.5 4.5 0 00-6.364-6.364l-4.5 4.5a4.5 4.5 0 001.242 7.244" /></svg> 통합 서비스</h4><p>ERP 회계 시스템 연동</p><p style="font-size: 0.9em; margin-top: 5px;">API Gateway</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.02 48.02 0 0112 21c-2.773 0-5.491-.235-8.135-.698-1.717-.293-2.3-2.379-1.067-3.61L5 14.5" /></svg> AI 서비스</h4><p>자연어 처리 예측 분석</p><p style="font-size: 0.9em; margin-top: 5px;">TensorFlow/PyTorch</p></div>
</div>
</div>
<div style="margin-top: 30px;">
<h3>기술 스택</h3>
<table class="comparison-table">
<thead><tr><th>레이어</th><th>기술</th><th>목적</th></tr></thead>
<tbody>
<tr><td><strong>API Gateway</strong></td><td>Kong / AWS API Gateway</td><td>라우팅, 인증, 속도 제한</td></tr>
<tr><td><strong>Application</strong></td><td>Node.js (NestJS) / Python (FastAPI)</td><td>비즈니스 로직 처리</td></tr>
<tr><td><strong>Database</strong></td><td>PostgreSQL / MongoDB</td><td>관계형/문서형 데이터 저장</td></tr>
<tr><td><strong>Cache</strong></td><td>Redis</td><td>세션, 계산 결과 캐싱</td></tr>
<tr><td><strong>Message Queue</strong></td><td>RabbitMQ / Apache Kafka</td><td>비동기 처리, 이벤트 스트리밍</td></tr>
<tr><td><strong>Search</strong></td><td>Elasticsearch</td><td>전체 텍스트 검색, 로그 분석</td></tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- Slide 13: Database Design -->
<div class="slide">
<div class="slide-content">
<h2>백엔드: 데이터베이스 설계</h2>
<div style="margin-top: 30px;">
<h3>핵심 테이블 구조</h3>
<table class="comparison-table">
<thead><tr><th>테이블명</th><th>주요 필드</th><th>관계</th></tr></thead>
<tbody>
<tr><td><strong>companies</strong></td><td>id, name, business_number, tax_type</td><td>1:N users, tax_returns</td></tr>
<tr><td><strong>users</strong></td><td>id, email, role, company_id</td><td>N:1 companies</td></tr>
<tr><td><strong>tax_returns</strong></td><td>id, type, period, status, company_id</td><td>N:1 companies, 1:N items</td></tr>
<tr><td><strong>tax_items</strong></td><td>id, return_id, account, amount</td><td>N:1 tax_returns</td></tr>
<tr><td><strong>receipts</strong></td><td>id, type, date, amount, file_path</td><td>N:1 companies</td></tr>
<tr><td><strong>tax_rules</strong></td><td>id, name, formula, effective_date</td><td>독립 테이블</td></tr>
</tbody>
</table>
</div>
<div style="margin-top: 30px;">
<h3>데이터 보안 전략</h3>
<ul>
<li><strong>암호화:</strong> 민감 데이터 AES-256 암호화 (금액, 계좌번호 )</li>
<li><strong>접근 제어:</strong> Row-Level Security (RLS) 적용</li>
<li><strong>감사 로그:</strong> 모든 데이터 변경 이력 자동 기록</li>
<li><strong>백업:</strong> 일일 자동 백업 Point-in-Time Recovery 지원</li>
<li><strong>다중화:</strong> Master-Slave Replication으로 고가용성 확보</li>
</ul>
</div>
<div class="info-box">
<h3>성능 최적화</h3>
<ul>
<li>주요 쿼리 대상 컬럼에 인덱스 생성</li>
<li>자주 조회되는 집계 데이터 Materialized View 활용</li>
<li>파티셔닝: 연도별 세금 신고 데이터 분할</li>
<li>커넥션 풀링으로 DB 연결 관리 최적화</li>
</ul>
</div>
</div>
</div>
<!-- Slide 14: API Design -->
<div class="slide">
<div class="slide-content">
<h2>백엔드: API 설계</h2>
<div style="margin-top: 30px;">
<h3>RESTful API 엔드포인트</h3>
<table class="comparison-table">
<thead><tr><th>엔드포인트</th><th>메서드</th><th>설명</th></tr></thead>
<tbody>
<tr><td>/api/v1/auth/login</td><td>POST</td><td>사용자 로그인 JWT 발급</td></tr>
<tr><td>/api/v1/tax-returns</td><td>GET</td><td>세금 신고서 목록 조회</td></tr>
<tr><td>/api/v1/tax-returns</td><td>POST</td><td> 신고서 생성</td></tr>
<tr><td>/api/v1/tax-returns/:id</td><td>PUT</td><td>신고서 수정</td></tr>
<tr><td>/api/v1/tax-returns/:id/submit</td><td>POST</td><td>신고서 제출</td></tr>
<tr><td>/api/v1/receipts/upload</td><td>POST</td><td>증빙 파일 업로드 OCR 처리</td></tr>
<tr><td>/api/v1/dashboard/summary</td><td>GET</td><td>대시보드 요약 정보</td></tr>
<tr><td>/api/v1/ai/ask</td><td>POST</td><td>AI 세무 어시스턴트 질의</td></tr>
</tbody>
</table>
</div>
<div style="margin-top: 30px;">
<h3>API 보안 품질</h3>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16.5 10.5V6.75a4.5 4.5 0 10-9 0v3.75m-.75 11.25h10.5a2.25 2.25 0 002.25-2.25v-6.75a2.25 2.25 0 00-2.25-2.25H6.75a2.25 2.25 0 00-2.25 2.25v6.75a2.25 2.25 0 002.25 2.25z" /></svg> 인증/인가</h4><p>JWT Bearer Token 기반 인증</p><p style="font-size: 0.9em; color: #666;">역할 기반 접근 제어 (RBAC)</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" /></svg> 문서화</h4><p>OpenAPI 3.0 (Swagger) 자동 생성</p><p style="font-size: 0.9em; color: #666;">인터랙티브 API 문서</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" /></svg> 속도 제한</h4><p>Rate Limiting (100 req/min/user)</p><p style="font-size: 0.9em; color: #666;">DDoS 방어</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" /></svg> 입력 검증</h4><p>DTO 기반 자동 검증</p><p style="font-size: 0.9em; color: #666;">타입 안전성 보장</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg> 모니터링</h4><p>API 성능 오류율 추적</p><p style="font-size: 0.9em; color: #666;">Prometheus + Grafana</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16.023 9.348h4.992v-.001M2.985 19.644v-4.992m0 0h4.992m-4.993 0l3.181 3.183a8.25 8.25 0 0013.803-3.7M4.031 9.865a8.25 8.25 0 0113.803-3.7l3.181 3.182m0-4.991v4.99" /></svg> 버전 관리</h4><p>URL 기반 버저닝 (/v1/, /v2/)</p><p style="font-size: 0.9em; color: #666;">하위 호환성 보장</p></div>
</div>
</div>
</div>
</div>
<!-- Slide 15: Frontend Tech Stack -->
<div class="slide">
<div class="slide-content">
<h2>프론트엔드: 기술 스택</h2>
<div class="conclusion-box">
<h3 style="color: white; margin-top: 0;">현대적인 프론트엔드 아키텍처</h3>
<p style="font-size: 1.2em;">React 18 + TypeScript 기반 SPA</p>
</div>
<div style="margin-top: 30px;">
<h3>핵심 기술 스택</h3>
<table class="comparison-table">
<thead><tr><th>카테고리</th><th>기술</th><th>목적</th></tr></thead>
<tbody>
<tr><td><strong>프레임워크</strong></td><td>React 18</td><td>컴포넌트 기반 UI 구축</td></tr>
<tr><td><strong>언어</strong></td><td>TypeScript</td><td>타입 안전성, 개발 생산성</td></tr>
<tr><td><strong>상태 관리</strong></td><td>Zustand / React Query</td><td>전역 상태 서버 상태 관리</td></tr>
<tr><td><strong>라우팅</strong></td><td>React Router v6</td><td>SPA 페이지 라우팅</td></tr>
<tr><td><strong>UI 라이브러리</strong></td><td>Material-UI (MUI)</td><td>디자인 시스템 구현</td></tr>
<tr><td><strong>차트</strong></td><td>Recharts / Chart.js</td><td>데이터 시각화</td></tr>
<tr><td><strong> 관리</strong></td><td>React Hook Form</td><td> 검증 상태 관리</td></tr>
<tr><td><strong>스타일링</strong></td><td>Emotion / Styled Components</td><td>CSS-in-JS</td></tr>
<tr><td><strong>빌드 도구</strong></td><td>Vite</td><td>빠른 개발 서버 빌드</td></tr>
<tr><td><strong>테스트</strong></td><td>Vitest / Testing Library</td><td>유닛/통합 테스트</td></tr>
</tbody>
</table>
</div>
<div class="info-box">
<h3>개발 도구</h3>
<ul>
<li><strong>코드 품질:</strong> ESLint, Prettier, Husky (pre-commit hooks)</li>
<li><strong>번들 분석:</strong> Vite Bundle Analyzer로 최적화</li>
<li><strong>성능 모니터링:</strong> React DevTools, Lighthouse CI</li>
<li><strong>문서화:</strong> Storybook으로 컴포넌트 문서화</li>
</ul>
</div>
</div>
</div>
<!-- Slide 16: Component Structure -->
<div class="slide">
<div class="slide-content">
<h2>프론트엔드: 컴포넌트 구조</h2>
<div style="margin-top: 30px;">
<h3>폴더 구조</h3>
<div style="background: #f1f5f9; padding: 20px; border-radius: 12px; font-family: monospace; font-size: 0.9em; border: 1px solid #e2e8f0;">
<pre style="margin: 0; color: #333;">src/
├── components/ # 재사용 가능 컴포넌트
├── common/ # 공통 UI 컴포넌트 (Button, Input 등)
├── layout/ # 레이아웃 컴포넌트 (Header, Sidebar)
└── domain/ # 도메인 특화 컴포넌트
├── pages/ # 페이지 컴포넌트
├── Dashboard/
├── TaxReturn/
└── Settings/
├── hooks/ # 커스텀 React Hooks
├── services/ # API 호출 로직
├── stores/ # 상태 관리 (Zustand)
├── types/ # TypeScript 타입 정의
├── utils/ # 유틸리티 함수
└── assets/ # 정적 파일 (이미지, 폰트)</pre>
</div>
</div>
<div style="margin-top: 30px;">
<h3>주요 컴포넌트</h3>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 13.125C3 12.504 3.504 12 4.125 12h2.25c.621 0 1.125.504 1.125 1.125v6.75C7.5 20.496 6.996 21 6.375 21h-2.25A1.125 1.125 0 013 19.875v-6.75zM9.75 8.625c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125v11.25c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V8.625zM16.5 4.125c0-.621.504-1.125 1.125-1.125h2.25C20.496 3 21 3.504 21 4.125v15.75c0 .621-.504 1.125-1.125 1.125h-2.25a1.125 1.125 0 01-1.125-1.125V4.125z" /></svg> DashboardWidget</h4><p>대시보드 KPI 카드 차트</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.5 14.25v-2.625a3.375 3.375 0 00-3.375-3.375h-1.5A1.125 1.125 0 0113.5 7.125v-1.5a3.375 3.375 0 00-3.375-3.375H8.25m0 12.75h7.5m-7.5 3H12M10.5 2.25H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 00-9-9z" /></svg> TaxReturnWizard</h4><p>단계별 신고서 작성 마법사</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.25 12.75V12A2.25 2.25 0 014.5 9.75h15A2.25 2.25 0 0121.75 12v.75m-8.69-6.44l-2.12-2.12a1.5 1.5 0 00-1.061-.44H4.5A2.25 2.25 0 002.25 6v12a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18V9a2.25 2.25 0 00-2.25-2.25h-5.379a1.5 1.5 0 01-1.06-.44z" /></svg> ReceiptUploader</h4><p>증빙 파일 업로드 OCR</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.25 18L9 11.25l4.306 4.307a11.95 11.95 0 015.814-5.519l2.74-1.22m0 0l-5.94-2.28m5.94 2.28l-2.28 5.941" /></svg> TaxChart</h4><p>세무 데이터 시각화</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M14.857 17.082a23.848 23.848 0 005.454-1.31A8.967 8.967 0 0118 9.75v-.7V9A6 6 0 006 9v.75a8.967 8.967 0 01-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 01-5.714 0m5.714 0a3 3 0 11-5.714 0" /></svg> NotificationCenter</h4><p>알림 작업 센터</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.02 48.02 0 0112 21c-2.773 0-5.491-.235-8.135-.698-1.717-.293-2.3-2.379-1.067-3.61L5 14.5" /></svg> AIAssistant</h4><p>채팅 기반 세무 도우미</p></div>
</div>
</div>
<div style="margin-top: 30px;">
<h3>성능 최적화 전략</h3>
<ul>
<li><strong>Code Splitting:</strong> 페이지 단위 lazy loading으로 초기 로딩 속도 개선</li>
<li><strong>Memoization:</strong> React.memo, useMemo, useCallback 활용</li>
<li><strong>Virtual Scrolling:</strong> 대용량 테이블 렌더링 최적화</li>
<li><strong>이미지 최적화:</strong> WebP 포맷, lazy loading, responsive images</li>
<li><strong>캐싱:</strong> React Query로 서버 데이터 캐싱 재검증</li>
</ul>
</div>
</div>
</div>
<!-- Slide 17: Development Roadmap -->
<div class="slide">
<div class="slide-content">
<h2>개발 로드맵</h2>
<table class="pricing-table">
<thead><tr><th>단계</th><th>기간</th><th>주요 마일스톤</th><th>산출물</th></tr></thead>
<tbody>
<tr><td><strong>Phase 1: 기획</strong></td><td>4</td><td>요구사항 정의, 시스템 설계</td><td>PRD, 아키텍처 문서</td></tr>
<tr><td><strong>Phase 2: 디자인</strong></td><td>4</td><td>UI/UX 설계, 디자인 시스템 구축</td><td>Figma 프로토타입, 디자인 가이드</td></tr>
<tr><td><strong>Phase 3: MVP 개발</strong></td><td>12</td><td>핵심 기능 구현 (신고, 증빙, 대시보드)</td><td>Alpha 버전</td></tr>
<tr><td><strong>Phase 4: 통합 테스트</strong></td><td>4</td><td>외부 시스템 연동 테스트</td><td>Beta 버전</td></tr>
<tr><td><strong>Phase 5: 파일럿</strong></td><td>4</td><td>실사용자 테스트 피드백 수집</td><td>개선사항 리스트</td></tr>
<tr><td><strong>Phase 6: 정식 출시</strong></td><td>2</td><td>버그 수정 성능 최적화</td><td>v1.0 릴리스</td></tr>
</tbody>
</table>
<div class="scenario-box blue" style="margin-top: 30px;">
<h3>주요 기술 과제</h3>
<ul>
<li><strong>세법 규칙 엔진:</strong> 복잡한 세법 규칙의 유연한 모델링</li>
<li><strong>대용량 데이터 처리:</strong> 수백만 건의 거래 데이터 실시간 처리</li>
<li><strong>외부 시스템 통합:</strong> 다양한 ERP/회계 시스템 API 연동</li>
<li><strong>보안 컴플라이언스:</strong> 금융권 수준의 보안 요구사항 충족</li>
<li><strong>AI 모델 학습:</strong> 세무 데이터 기반 예측 모델 개발</li>
</ul>
</div>
<div class="scenario-box amber" style="margin-top: 20px;">
<h3 style="color: #92400e;">예상 리소스</h3>
<ul style="color: #78350f;">
<li><strong>기획:</strong> PM 1, 세무 도메인 전문가 1</li>
<li><strong>디자인:</strong> UI/UX 디자이너 2</li>
<li><strong>백엔드:</strong> 시니어 개발자 3, 주니어 개발자 2</li>
<li><strong>프론트엔드:</strong> 시니어 개발자 2, 주니어 개발자 2</li>
<li><strong>QA:</strong> 테스터 2</li>
<li><strong>DevOps:</strong> 인프라 엔지니어 1</li>
</ul>
</div>
</div>
</div>
<!-- Slide 18: Success Metrics -->
<div class="slide">
<div class="slide-content">
<h2>성공 지표</h2>
<div style="margin-top: 30px;">
<h3>📊 정량적 KPI</h3>
<table class="comparison-table">
<thead><tr><th>지표</th><th>목표치</th><th>측정 방법</th></tr></thead>
<tbody>
<tr><td><strong>업무 시간 절감</strong></td><td>80% 이상</td><td>신고 준비 소요 시간 Before/After 비교</td></tr>
<tr><td><strong>오류율 감소</strong></td><td>95% 이상</td><td>수정 신고 건수 감소율</td></tr>
<tr><td><strong>사용자 만족도</strong></td><td>NPS 50 이상</td><td>분기별 사용자 설문 조사</td></tr>
<tr><td><strong>시스템 가용성</strong></td><td>99.9% 이상</td><td>Uptime 모니터링</td></tr>
<tr><td><strong>API 응답 속도</strong></td><td>평균 200ms 이하</td><td>APM 도구 (New Relic/Datadog)</td></tr>
<tr><td><strong>월간 활성 사용자</strong></td><td>80% 이상</td><td>Google Analytics / Mixpanel</td></tr>
</tbody>
</table>
</div>
<div style="margin-top: 30px;">
<h3>🎯 정성적 목표</h3>
<div class="feature-list">
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-yellow-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18v-5.25m0 0a6.01 6.01 0 001.5-.189m-1.5.189a6.01 6.01 0 01-1.5-.189m3.75 7.478a12.06 12.06 0 01-4.5 0m3.75 2.383a14.406 14.406 0 01-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 10-7.517 0c.85.493 1.509 1.333 1.509 2.316V18" /></svg> 혁신성</h4><p>국내 최초 AI 기반 세무 자동화 플랫폼 구축</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16.5 18.75h-9m9 0a3 3 0 013 3h-15a3 3 0 013-3m9 0v-3.375c0-.621-.503-1.125-1.125-1.125h-.871M7.5 18.75v-3.375c0-.621.504-1.125 1.125-1.125h.872m5.007 0H9.497m5.007 0a7.454 7.454 0 01-.982-3.172M9.497 14.25a7.454 7.454 0 00.981-3.172M5.25 4.236c-.982.143-1.954.317-2.916.52A6.003 6.003 0 007.73 9.728M5.25 4.236V4.5c0 2.108.966 3.99 2.48 5.228M5.25 4.236V2.721C7.456 2.41 9.71 2.25 12 2.25c2.291 0 4.545.16 6.75.47v1.516M7.73 9.728a6.726 6.726 0 002.748 1.35m8.272-6.842V4.5c0 2.108-.966 3.99-2.48 5.228m2.48-5.492a46.32 46.32 0 012.916.52 6.003 6.003 0 01-5.395 4.972m0 0a6.726 6.726 0 01-2.749 1.35m0 0a6.772 6.772 0 01-3.044 0" /></svg> 시장 포지션</h4><p>중소기업 세무 솔루션 시장 점유율 Top 3</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19.128a9.38 9.38 0 002.625.372 9.337 9.337 0 004.121-.952 4.125 4.125 0 00-7.533-2.493M15 19.128v-.003c0-1.113-.285-2.16-.786-3.07M15 19.128v.106A12.318 12.318 0 018.624 21c-2.331 0-4.512-.645-6.374-1.766l-.001-.109a6.375 6.375 0 0111.964-3.07M12 6.375a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zm8.25 2.25a2.625 2.625 0 11-5.25 0 2.625 2.625 0 015.25 0z" /></svg> 파트너십</h4><p>주요 ERP/회계 시스템과 공식 파트너십 체결</p></div>
<div class="feature-item"><h4 class="flex items-center gap-2"><svg class="w-5 h-5 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285z" /></svg> 보안 인증</h4><p>ISO 27001, SOC 2 Type 2 인증 획득</p></div>
</div>
</div>
</div>
</div>
<!-- Slide 19: Risk & Mitigation -->
<div class="slide">
<div class="slide-content">
<h2>리스크 관리</h2>
<table class="comparison-table">
<thead><tr><th>리스크</th><th>영향</th><th>대응 전략</th></tr></thead>
<tbody>
<tr><td><strong>세법 변경</strong></td><td>높음</td><td>규칙 엔진 기반 설계로 신속 대응, 법률 자문 확보</td></tr>
<tr><td><strong>외부 시스템 장애</strong></td><td>중간</td><td>Fallback 메커니즘, 수동 입력 옵션 제공</td></tr>
<tr><td><strong>데이터 보안 침해</strong></td><td>매우 높음</td><td>다층 보안 체계, 정기 보안 감사, 침해 대응 계획 수립</td></tr>
<tr><td><strong>개발 일정 지연</strong></td><td>중간</td><td>Agile 방법론, 단계별 마일스톤 관리</td></tr>
<tr><td><strong>사용자 채택률 저조</strong></td><td>높음</td><td>직관적 UX, 충분한 교육 온보딩, 전담 지원팀</td></tr>
<tr><td><strong>AI 모델 정확도</strong></td><td>중간</td><td>Human-in-the-loop 검증, 점진적 자동화 확대</td></tr>
</tbody>
</table>
<div class="scenario-box amber" style="margin-top: 30px;">
<h3 style="color: #92400e;">규제 준수 전략</h3>
<ul style="color: #78350f;">
<li><strong>전자세금계산서법:</strong> 국세청 표준 XML 스키마 준수</li>
<li><strong>개인정보보호법:</strong> PIMS 인증 획득, 개인정보 암호화 저장</li>
<li><strong>전자금융거래법:</strong> 전자서명 공인인증서 연동</li>
<li><strong>회계 기준:</strong> K-IFRS 일반기업회계기준 준수</li>
</ul>
</div>
</div>
</div>
<!-- Slide 20: Conclusion -->
<div class="slide">
<div class="slide-content">
<h2>맺음말</h2>
<div class="conclusion-box">
<h3 style="color: white; margin-top: 0;">세무 업무의 새로운 패러다임</h3>
<p style="font-size: 1.3em;">자동화로 시간을 절약하고, AI로 인사이트를 발견하며, 통합으로 효율을 극대화하는 차세대 세무 솔루션</p>
</div>
<div style="margin-top: 40px;">
<h3>핵심 차별점</h3>
<div class="company-info">
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" /></svg> 완전 자동화</h4><p>데이터 수집부터 신고까지 End-to-End 자동화</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.75 3.104v5.714a2.25 2.25 0 01-.659 1.591L5 14.5M9.75 3.104c-.251.023-.501.05-.75.082m.75-.082a24.301 24.301 0 014.5 0m0 0v5.714c0 .597.237 1.17.659 1.591L19.8 15.3M14.25 3.104c.251.023.501.05.75.082M19.8 15.3l-1.57.393A9.065 9.065 0 0112 15a9.065 9.065 0 00-6.23.693L5 14.5m14.8.8l1.402 1.402c1.232 1.232.65 3.318-1.067 3.611A48.02 48.02 0 0112 21c-2.773 0-5.491-.235-8.135-.698-1.717-.293-2.3-2.379-1.067-3.61L5 14.5" /></svg> AI 기반</h4><p>머신러닝으로 패턴 학습 절세 전략 제안</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13.19 8.688a4.5 4.5 0 011.242 7.244l-4.5 4.5a4.5 4.5 0 01-6.364-6.364l1.757-1.757m13.35-.622l1.757-1.757a4.5 4.5 0 00-6.364-6.364l-4.5 4.5a4.5 4.5 0 001.242 7.244" /></svg> 완벽한 통합</h4><p>모든 주요 ERP/회계 시스템 네이티브 연동</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.5 1.5H8.25A2.25 2.25 0 006 3.75v16.5a2.25 2.25 0 002.25 2.25h7.5A2.25 2.25 0 0018 20.25V3.75a2.25 2.25 0 00-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3" /></svg> 언제 어디서나</h4><p>클라우드 기반으로 시간과 장소의 제약 없음</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.99 11.99 0 003 9.749c0 5.592 3.824 10.29 9 11.623 5.176-1.332 9-6.03 9-11.622 0-1.31-.21-2.571-.598-3.751h-.152c-3.196 0-6.1-1.248-8.25-3.285z" /></svg> 기업급 보안</h4><p>금융권 수준의 다층 보안 체계</p></div>
<div class="info-card"><h4 class="flex items-center gap-2"><svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 18v-5.25m0 0a6.01 6.01 0 001.5-.189m-1.5.189a6.01 6.01 0 01-1.5-.189m3.75 7.478a12.06 12.06 0 01-4.5 0m3.75 2.383a14.406 14.406 0 01-3 0M14.25 18v-.192c0-.983.658-1.823 1.508-2.316a7.5 7.5 0 10-7.517 0c.85.493 1.509 1.333 1.509 2.316V18" /></svg> 직관적 UX</h4><p>복잡한 세무를 누구나 쉽게 처리</p></div>
</div>
</div>
<div style="margin-top: 40px; text-align: center;">
<p style="font-size: 1.3em; color: #2563eb; font-weight: 700;"><strong>예상 효과</strong></p>
<p style="font-size: 1.1em; margin-top: 20px;">업무 시간 <span class="highlight">80% 절감</span> | 오류율 <span class="highlight">95% 감소</span> | 절세 기회 <span class="highlight">자동 발견</span></p>
</div>
<div class="info-box" style="margin-top: 40px;">
<h3 style="text-align: center;">Next Steps</h3>
<ol style="font-size: 1.1em; margin-top: 20px;">
<li>이해관계자 승인 예산 확보</li>
<li>개발팀 구성 킥오프 미팅</li>
<li>Phase 1 상세 요구사항 정의 착수</li>
<li>디자인 시스템 프로토타입 개발</li>
</ol>
</div>
</div>
</div>
<!-- Slide 21: Thank You -->
<div class="slide">
<div class="slide-content">
<h1 style="font-size: 4em; margin-bottom: 40px;">감사합니다</h1>
<div style="text-align: center;">
<p style="font-size: 1.5em; color: #2563eb; margin-bottom: 30px; font-weight: 700;">장기적 세무전략 - 중장기 계획안</p>
<div style="margin-top: 50px; padding: 30px; background: #f1f5f9; border-radius: 16px; border: 1px solid #e2e8f0;">
<h3>문의 피드백</h3>
<p style="margin-top: 20px;"> 계획안에 대한 의견이나 추가 논의가 필요하신 경우</p>
<p>프로젝트 팀으로 연락 주시기 바랍니다.</p>
</div>
</div>
</div>
</div>
</div>
<div class="slide-number">
<span id="currentSlide">1</span> / <span id="totalSlides">21</span>
</div>
<div class="navigation">
<button class="nav-btn" id="prevBtn" onclick="changeSlide(-1)"> 이전</button>
<button class="nav-btn" id="nextBtn" onclick="changeSlide(1)">다음 </button>
</div>
@endsection
@push('scripts')
<script>
let currentSlide = 1;
const totalSlides = 21;
let touchStartX = 0;
let touchEndX = 0;
document.getElementById('totalSlides').textContent = totalSlides;
function showSlide(n) {
const slides = document.querySelectorAll('.slide');
if (n > totalSlides) currentSlide = 1;
if (n < 1) currentSlide = totalSlides;
slides.forEach(slide => slide.classList.remove('active'));
if (slides[currentSlide - 1]) {
slides[currentSlide - 1].classList.add('active');
}
document.getElementById('currentSlide').textContent = currentSlide;
const prevBtn = document.getElementById('prevBtn');
const nextBtn = document.getElementById('nextBtn');
if (prevBtn) prevBtn.disabled = (currentSlide === 1);
if (nextBtn) nextBtn.disabled = (currentSlide === totalSlides);
}
function changeSlide(direction) {
currentSlide += direction;
showSlide(currentSlide);
}
document.addEventListener('keydown', function(event) {
if (event.key === 'ArrowLeft') {
changeSlide(-1);
} else if (event.key === 'ArrowRight' || event.key === ' ') {
event.preventDefault();
changeSlide(1);
}
});
document.addEventListener('touchstart', function(event) {
touchStartX = event.changedTouches[0].screenX;
});
document.addEventListener('touchend', function(event) {
touchEndX = event.changedTouches[0].screenX;
handleSwipe();
});
function handleSwipe() {
if (touchEndX < touchStartX - 50) changeSlide(1);
if (touchEndX > touchStartX + 50) changeSlide(-1);
}
showSlide(currentSlide);
</script>
@endpush