<?php
require_once($_SERVER['DOCUMENT_ROOT'] . "/session.php");
?>

<!DOCTYPE html>
<html lang="ko">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>MVP 전자세금계산서 전략 - 6주 실행 계획</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
            min-height: 100vh;
            overflow-x: hidden;
        }

        .presentation-container {
            width: 100%;
            height: 100vh;
            position: relative;
            overflow: hidden;
        }

        .slide {
            width: 100%;
            height: 100vh;
            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.95);
            border-radius: 20px;
            padding: 60px;
            max-width: 1200px;
            width: 100%;
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
            animation: fadeIn 0.8s ease-out;
            margin: auto 0;
        }

        h1 {
            color: #f5576c;
            font-size: 3em;
            margin-bottom: 20px;
            text-align: center;
        }

        h2 {
            color: #f093fb;
            font-size: 2.5em;
            margin-bottom: 30px;
            text-align: center;
            border-bottom: 3px solid #f5576c;
            padding-bottom: 15px;
        }

        h3 {
            color: #f5576c;
            font-size: 1.8em;
            margin: 25px 0 15px 0;
        }

        h4 {
            color: #f093fb;
            font-size: 1.3em;
            margin: 15px 0 10px 0;
        }

        p, li {
            font-size: 1.2em;
            line-height: 1.8;
            color: #333;
            margin-bottom: 15px;
        }

        ul, ol {
            margin-left: 30px;
        }

        .week-card {
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
            color: white;
            padding: 30px;
            border-radius: 15px;
            margin: 20px 0;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
        }

        .week-card h3 {
            color: white;
            margin-top: 0;
            border-bottom: 2px solid rgba(255, 255, 255, 0.3);
            padding-bottom: 10px;
            margin-bottom: 20px;
        }

        .week-card p, .week-card li {
            color: white;
        }

        .task-list {
            background: #fce4ec;
            padding: 20px;
            border-radius: 10px;
            margin: 15px 0;
            border-left: 4px solid #f5576c;
        }

        .task-list h4 {
            margin-top: 0;
        }

        .deliverable-box {
            background: #fff3cd;
            border-left: 5px solid #ffc107;
            padding: 20px;
            border-radius: 10px;
            margin: 15px 0;
        }

        .deliverable-box h4 {
            color: #856404;
            margin-top: 0;
        }

        .deliverable-box p, .deliverable-box li {
            color: #856404;
        }

        .success-metrics {
            background: #d4edda;
            border-left: 5px solid #28a745;
            padding: 20px;
            border-radius: 10px;
            margin: 15px 0;
        }

        .success-metrics h4 {
            color: #155724;
            margin-top: 0;
        }

        .success-metrics p, .success-metrics li {
            color: #155724;
        }

        .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, #f093fb 0%, #f5576c 100%);
            color: white;
        }

        .comparison-table tbody tr:nth-of-type(even) {
            background: #f3f3f3;
        }

        .highlight-box {
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
            color: white;
            padding: 30px;
            border-radius: 15px;
            margin: 20px 0;
            text-align: center;
        }

        .highlight-box p {
            color: white;
        }

        .navigation {
            position: fixed;
            bottom: 30px;
            right: 30px;
            display: flex;
            gap: 15px;
            z-index: 1000;
        }

        .nav-btn {
            background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
            color: white;
            border: none;
            padding: 15px 30px;
            border-radius: 50px;
            cursor: pointer;
            font-size: 1.1em;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
            transition: all 0.3s ease;
        }

        .nav-btn:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
        }

        .home-btn {
            position: fixed;
            top: 30px;
            left: 30px;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            border: none;
            padding: 12px 25px;
            border-radius: 50px;
            cursor: pointer;
            font-size: 1em;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
            transition: all 0.3s ease;
            z-index: 1000;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            font-weight: 600;
        }

        .home-btn:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.4);
            background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
        }

        .slide-number {
            position: fixed;
            bottom: 30px;
            left: 30px;
            background: rgba(255, 255, 255, 0.9);
            padding: 10px 20px;
            border-radius: 25px;
            font-size: 1.1em;
            color: #f5576c;
            font-weight: bold;
            z-index: 1000;
        }

        @keyframes slideInRight {
            from {
                transform: translateX(100%);
                opacity: 0;
            }
            to {
                transform: translateX(0);
                opacity: 1;
            }
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
            }
            to {
                opacity: 1;
            }
        }

        @media (max-width: 768px) {
            .slide-content {
                padding: 30px;
            }

            h1 {
                font-size: 2em;
            }

            h2 {
                font-size: 1.8em;
            }

            h3 {
                font-size: 1.4em;
            }

            h4 {
                font-size: 1.1em;
            }

            p, li {
                font-size: 1em;
            }

            .navigation {
                bottom: 15px;
                right: 15px;
            }

            .nav-btn {
                padding: 10px 20px;
                font-size: 0.9em;
            }

            .slide-number {
                bottom: 15px;
                left: 15px;
                padding: 8px 15px;
                font-size: 0.9em;
            }

            .home-btn {
                top: 15px;
                left: 15px;
                padding: 10px 20px;
                font-size: 0.9em;
            }

            .comparison-table {
                font-size: 0.8em;
            }

            .comparison-table th,
            .comparison-table td {
                padding: 8px;
            }
        }
    </style>
</head>
<body>
    <!-- Home Button -->
    <a href="electronicTaxInvoice_index.php" class="home-btn">
        <span>🏠</span>
        <span>전략선택</span>
    </a>

    <div class="presentation-container">
        <!-- Slide 1: Cover -->
        <div class="slide active">
            <div class="slide-content">
                <h1>MVP 전자세금계산서 발행 전략</h1>
                <h2 style="border: none; color: #f093fb;">6주 실행 계획</h2>
                <div style="text-align: center; margin-top: 50px;">
                    <p style="font-size: 1.5em; color: #f5576c;">즉시 실행 가능한 핵심 세금계산서 발행 솔루션</p>
                    <p style="margin-top: 30px; color: #666;">바로빌 API 기반 빠른 구현</p>
                    <div class="highlight-box" style="margin-top: 50px;">
                        <p style="font-size: 1.3em;"><strong>목표:</strong> 6주 안에 실무에서 사용 가능한 세금계산서 발행 시스템 MVP 완성</p>
                    </div>
                </div>
            </div>
        </div>

        <!-- Slide 2: MVP Philosophy -->
        <div class="slide">
            <div class="slide-content">
                <h2>MVP 철학 및 범위</h2>

                <div class="highlight-box">
                    <h3 style="color: white; margin-top: 0;">핵심 원칙</h3>
                    <p style="font-size: 1.2em;">"가산세 제로와 자동화로 세무 리스크 최소화"</p>
                </div>

                <div style="margin-top: 30px;">
                    <h3>🎯 MVP 목표</h3>
                    <ul>
                        <li>발급·전송 자동화율 85% → 95%로 향상</li>
                        <li>지연/미전송 건수 월별 0건 목표</li>
                        <li>반려→정정 소요시간 단축 (3시간 → 30분)</li>
                        <li>바로빌 API 기반 빠른 구현</li>
                    </ul>
                </div>

                <div style="margin-top: 30px;">
                    <h3>✅ MVP 핵심 기능</h3>
                    <ul>
                        <li><strong>세금계산서 발급:</strong> 정발행, 전자서명, 국세청 전송</li>
                        <li><strong>임시저장/검증:</strong> 필수필드 검증, 금액 검증</li>
                        <li><strong>발급 현황 조회:</strong> 발급내역, 전송상태 실시간 추적</li>
                        <li><strong>수정/취소:</strong> 수정사유코드 기반 수정발급</li>
                        <li><strong>가산세 알림:</strong> 발급기한 알림, 지연 위험 대시보드</li>
                    </ul>
                </div>

                <div style="margin-top: 30px;">
                    <h3>🚫 MVP 범위 밖 (Phase 2)</h3>
                    <ul>
                        <li>역발행/위수탁 워크플로우</li>
                        <li>대량발급 엑셀/CSV 업로드</li>
                        <li>모바일 앱</li>
                        <li>ERP 연동 커넥터</li>
                        <li>홈택스 신고보조 파일 생성</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 3: Week 1-2 Plan -->
        <div class="slide">
            <div class="slide-content">
                <h2>Week 1-2: 바로빌 연동 및 기반 구축</h2>

                <div class="week-card">
                    <h3>🏗️ Week 1-2 목표</h3>
                    <p>바로빌 샌드박스 연동 및 핵심 스키마 구축</p>
                </div>

                <div class="task-list">
                    <h4>📋 기획 (Week 1-2)</h4>
                    <ul>
                        <li><strong>Week 1:</strong> MVP 기능 명세 및 데이터 모델
                            <ul>
                                <li>발급 프로세스 플로우 정의</li>
                                <li>가산세 리스크 포인트 정리</li>
                                <li>바로빌 API 명세 분석</li>
                                <li>상태 머신 (State Machine) 설계</li>
                            </ul>
                        </li>
                        <li><strong>Week 2:</strong> 테스트 시나리오 작성
                            <ul>
                                <li>발급 테스트 케이스 20개</li>
                                <li>수정/취소 시나리오</li>
                                <li>반려 처리 시나리오</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>🎨 디자인 (Week 1-2)</h4>
                    <ul>
                        <li><strong>Week 1:</strong> 디자인 시스템 구축
                            <ul>
                                <li>컬러 팔레트 (녹색 계열 - 세무 전문성)</li>
                                <li>기본 컴포넌트 (입력폼, 테이블)</li>
                                <li>와이어프레임 5개 화면</li>
                            </ul>
                        </li>
                        <li><strong>Week 2:</strong> 핵심 화면 디자인
                            <ul>
                                <li>세금계산서 발급 폼</li>
                                <li>발급현황 대시보드</li>
                                <li>전송상태 타임라인</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>⚙️ 백엔드 (Week 1-2)</h4>
                    <ul>
                        <li><strong>Week 1:</strong> 바로빌 샌드박스 연동
                            <ul>
                                <li>바로빌 API 키 발급</li>
                                <li>인증서 등록 API 연동</li>
                                <li>PHP 8.2 프로젝트 초기화</li>
                                <li>MySQL 8.0 데이터베이스 설정 (SAM 프로젝트 DB)</li>
                            </ul>
                        </li>
                        <li><strong>Week 2:</strong> 핵심 DB 스키마 구축
                            <ul>
                                <li>tenants, certificates 테이블</li>
                                <li>tax_invoices, parties 테이블</li>
                                <li>line_items, events 테이블</li>
                                <li>상태 머신 구현</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>💻 프론트엔드 (Week 1-2)</h4>
                    <ul>
                        <li><strong>Week 1:</strong> 프로젝트 설정
                            <ul>
                                <li>기존 jQuery/Bootstrap 활용</li>
                                <li>공통 레이아웃 구성</li>
                                <li>Ajax 통신 설정</li>
                            </ul>
                        </li>
                        <li><strong>Week 2:</strong> 기본 화면 구현
                            <ul>
                                <li>대시보드 레이아웃</li>
                                <li>테이블 컴포넌트</li>
                                <li>폼 검증 라이브러리</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="deliverable-box">
                    <h4>📦 Week 1-2 산출물</h4>
                    <ul>
                        <li>MVP 기능 명세서 + 상태 머신 (기획)</li>
                        <li>디자인 시스템 + 와이어프레임 (디자인)</li>
                        <li>바로빌 연동 + DB 스키마 (백엔드)</li>
                        <li>프로젝트 기반 + 레이아웃 (프론트엔드)</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 4: Week 3-4 Plan -->
        <div class="slide">
            <div class="slide-content">
                <h2>Week 3-4: 발급/전송/조회 핵심 기능 구현</h2>

                <div class="week-card">
                    <h3>⚡ Week 3-4 목표</h3>
                    <p>세금계산서 발급·전송·조회·수정·취소 API 완성</p>
                </div>

                <div class="task-list">
                    <h4>📋 기획 (Week 3-4)</h4>
                    <ul>
                        <li><strong>Week 3:</strong> 리포트 MVP 설계
                            <ul>
                                <li>발급현황 리포트 템플릿</li>
                                <li>미전송/지연 건 알림 로직</li>
                                <li>반려사유 매핑 테이블</li>
                            </ul>
                        </li>
                        <li><strong>Week 4:</strong> QA 준비
                            <ul>
                                <li>통합 테스트 시나리오</li>
                                <li>버그 트래킹 시스템</li>
                                <li>사용자 가이드 초안</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>🎨 디자인 (Week 3-4)</h4>
                    <ul>
                        <li><strong>Week 3:</strong> 나머지 화면 디자인
                            <ul>
                                <li>수정/취소 마법사</li>
                                <li>리포트 대시보드</li>
                                <li>오류검증 패널</li>
                            </ul>
                        </li>
                        <li><strong>Week 4:</strong> 디자인 QA
                            <ul>
                                <li>프론트엔드 구현 리뷰</li>
                                <li>반응형 디자인 검증</li>
                                <li>UX 개선사항 반영</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>⚙️ 백엔드 (Week 3-4)</h4>
                    <ul>
                        <li><strong>Week 3:</strong> 발급/전송 API 구현
                            <ul>
                                <li>문서 작성/임시저장 API</li>
                                <li>전자서명 & 발급 API</li>
                                <li>국세청 전송 API (자동/수동)</li>
                                <li>전송결과 폴링/웹훅 처리</li>
                            </ul>
                        </li>
                        <li><strong>Week 4:</strong> 수정/취소/조회 API
                            <ul>
                                <li>수정발급 API (사유코드 기반)</li>
                                <li>발급취소 API</li>
                                <li>발급현황 조회 API</li>
                                <li>리포트 생성 API</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>💻 프론트엔드 (Week 3-4)</h4>
                    <ul>
                        <li><strong>Week 3:</strong> 발급 화면 구현
                            <ul>
                                <li>세금계산서 작성 폼</li>
                                <li>필수필드 실시간 검증</li>
                                <li>공급자/수취자 선택</li>
                                <li>품목 입력 테이블</li>
                            </ul>
                        </li>
                        <li><strong>Week 4:</strong> 조회/수정 화면
                            <ul>
                                <li>발급현황 테이블</li>
                                <li>전송상태 타임라인</li>
                                <li>수정/취소 마법사</li>
                                <li>리포트 대시보드</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="deliverable-box">
                    <h4>📦 Week 3-4 산출물</h4>
                    <ul>
                        <li>테스트 시나리오 + 사용자 가이드 (기획)</li>
                        <li>전체 화면 디자인 완료 (디자인)</li>
                        <li>발급·전송·조회·수정·취소 API (백엔드)</li>
                        <li>세금계산서 발급 + 조회 화면 (프론트엔드)</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 5: Week 5-6 Plan -->
        <div class="slide">
            <div class="slide-content">
                <h2>Week 5-6: 통합 테스트 및 베타 런칭</h2>

                <div class="week-card">
                    <h3>🚀 Week 5-6 목표</h3>
                    <p>2개 테넌트 베타, 지연 알림/재전송 안정화, 운영전환</p>
                </div>

                <div class="task-list">
                    <h4>📋 기획 (Week 5-6)</h4>
                    <ul>
                        <li><strong>Week 5:</strong> 2개 테넌트 베타 테스트
                            <ul>
                                <li>실제 사업자로 샌드박스 테스트</li>
                                <li>발급·전송·조회 E2E 테스트</li>
                                <li>버그 우선순위 관리</li>
                            </ul>
                        </li>
                        <li><strong>Week 6:</strong> 운영전환 준비
                            <ul>
                                <li>최종 테스트 및 검수</li>
                                <li>릴리스 노트 작성</li>
                                <li>운영가이드/감사로그 정비</li>
                                <li>Phase 2 백로그 정리</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>🎨 디자인 (Week 5-6)</h4>
                    <ul>
                        <li><strong>Week 5:</strong> 디자인 QA
                            <ul>
                                <li>크로스 브라우저 테스트</li>
                                <li>모바일 반응형 검증</li>
                                <li>접근성 체크</li>
                            </ul>
                        </li>
                        <li><strong>Week 6:</strong> 마케팅 자료
                            <ul>
                                <li>제품 스크린샷</li>
                                <li>데모 시나리오</li>
                                <li>UI 개선사항 문서화</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>⚙️ 백엔드 (Week 5-6)</h4>
                    <ul>
                        <li><strong>Week 5:</strong> 지연 알림 및 재전송 안정화
                            <ul>
                                <li>발급기한 알림 스케줄러 (T-2, T-1)</li>
                                <li>NTS_REJECTED 재전송 로직</li>
                                <li>인증서 만료 사전 알림</li>
                                <li>에러 핸들링 개선</li>
                            </ul>
                        </li>
                        <li><strong>Week 6:</strong> 프로덕션 배포
                            <ul>
                                <li>프로덕션 환경 설정</li>
                                <li>백업 및 모니터링</li>
                                <li>API 문서화</li>
                                <li>보안 점검</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="task-list">
                    <h4>💻 프론트엔드 (Week 5-6)</h4>
                    <ul>
                        <li><strong>Week 5:</strong> 버그 수정 및 최적화
                            <ul>
                                <li>통합 테스트 버그 수정</li>
                                <li>성능 최적화</li>
                                <li>로딩 상태 및 에러 처리</li>
                            </ul>
                        </li>
                        <li><strong>Week 6:</strong> 최종 점검 및 배포
                            <ul>
                                <li>브라우저 호환성 검증</li>
                                <li>배포 및 모니터링</li>
                                <li>사용자 매뉴얼 배포</li>
                            </ul>
                        </li>
                    </ul>
                </div>

                <div class="deliverable-box">
                    <h4>📦 Week 5-6 산출물</h4>
                    <ul>
                        <li>베타 테스트 리포트 + 릴리스 노트 (기획)</li>
                        <li>마케팅 자료 + UI 문서 (디자인)</li>
                        <li>프로덕션 API + 모니터링 (백엔드)</li>
                        <li>배포된 프로덕션 웹앱 (프론트엔드)</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 6: Success Metrics -->
        <div class="slide">
            <div class="slide-content">
                <h2>성공 지표 및 완료 기준</h2>

                <div class="highlight-box">
                    <h3 style="color: white; margin-top: 0;">MVP 완료 정의</h3>
                    <p style="font-size: 1.2em;">"2개 테넌트가 실제 세금계산서를 발급하고 국세청 전송까지 성공적으로 완료"</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>공동/금융인증서 등록 성공</td>
                                <td>2개 테넌트 인증서 등록 확인</td>
                            </tr>
                            <tr>
                                <td><strong>세금계산서 발급</strong></td>
                                <td>정발행 + 전자서명 성공</td>
                                <td>샌드박스 환경 10건 발급</td>
                            </tr>
                            <tr>
                                <td><strong>국세청 전송</strong></td>
                                <td>발급 즉시 자동 전송</td>
                                <td>NTS_ACCEPTED 상태 확인</td>
                            </tr>
                            <tr>
                                <td><strong>수정발급</strong></td>
                                <td>수정사유코드 기반 수정</td>
                                <td>5건 수정발급 테스트</td>
                            </tr>
                            <tr>
                                <td><strong>발급취소</strong></td>
                                <td>발급당일 취소 가능</td>
                                <td>3건 취소 테스트</td>
                            </tr>
                            <tr>
                                <td><strong>가산세 알림</strong></td>
                                <td>T-2, T-1 자동 알림</td>
                                <td>이메일 알림 발송 확인</td>
                            </tr>
                        </tbody>
                    </table>
                </div>

                <div class="success-metrics" style="margin-top: 30px;">
                    <h4>📊 정량적 목표</h4>
                    <ul>
                        <li><strong>발급 성공률:</strong> 95% 이상</li>
                        <li><strong>전송 성공률:</strong> 98% 이상</li>
                        <li><strong>API 응답 속도:</strong> 평균 1초 이하</li>
                        <li><strong>Critical 버그:</strong> 0건</li>
                        <li><strong>베타 테스트:</strong> 2개 테넌트 실사용 가능</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 7: Technical Stack -->
        <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>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><strong>PHP 8.2</strong></td>
                                <td>최신 PHP 기능 활용 및 성능 향상</td>
                            </tr>
                            <tr>
                                <td><strong>MySQL 8.0</strong></td>
                                <td>SAM 프로젝트 전용 데이터베이스</td>
                            </tr>
                            <tr>
                                <td><strong>PDO</strong></td>
                                <td>준비된 문장으로 SQL 인젝션 방지</td>
                            </tr>
                            <tr>
                                <td><strong>바로빌 API</strong></td>
                                <td>전자세금계산서 발급/전송 전문 서비스</td>
                            </tr>
                        </tbody>
                    </table>
                </div>

                <div style="margin-top: 30px;">
                    <h3>💻 프론트엔드 스택</h3>
                    <table class="comparison-table">
                        <thead>
                            <tr>
                                <th>기술</th>
                                <th>선택 이유</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><strong>jQuery</strong></td>
                                <td>기존 프로젝트 표준, 빠른 개발</td>
                            </tr>
                            <tr>
                                <td><strong>Bootstrap</strong></td>
                                <td>기존 UI 라이브러리, 일관성 유지</td>
                            </tr>
                            <tr>
                                <td><strong>DataTables</strong></td>
                                <td>발급현황 테이블 표시</td>
                            </tr>
                            <tr>
                                <td><strong>jQuery Validation</strong></td>
                                <td>폼 검증 간소화</td>
                            </tr>
                        </tbody>
                    </table>
                </div>

                <div style="margin-top: 30px;">
                    <h3>🛠️ 개발 도구</h3>
                    <ul>
                        <li><strong>버전 관리:</strong> Git + .auto-commit.sh</li>
                        <li><strong>디자인:</strong> 기존 시스템 UI 패턴 활용</li>
                        <li><strong>테스트:</strong> 바로빌 샌드박스 환경</li>
                        <li><strong>배포:</strong> Apache + mod_rewrite</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 8: Database Design -->
        <div class="slide">
            <div class="slide-content">
                <h2>데이터베이스 설계 (MVP 범위)</h2>

                <div style="margin-top: 30px;">
                    <h3>📊 핵심 테이블 (6개)</h3>
                    <table class="comparison-table">
                        <thead>
                            <tr>
                                <th>테이블명</th>
                                <th>주요 필드</th>
                                <th>용도</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><strong>tenants</strong></td>
                                <td>id, name, bizno, tax_policy</td>
                                <td>테넌트 기본정보</td>
                            </tr>
                            <tr>
                                <td><strong>certificates</strong></td>
                                <td>id, tenant_id, type, valid_from, valid_to, kms_key_ref, status</td>
                                <td>인증서 관리</td>
                            </tr>
                            <tr>
                                <td><strong>tax_invoices</strong></td>
                                <td>id, tenant_id, issue_key, type, supply_amt, vat, total, write_date, state, nts_receipt_no</td>
                                <td>세금계산서 메인</td>
                            </tr>
                            <tr>
                                <td><strong>parties</strong></td>
                                <td>id, tenant_id, role, bizno, corp_name, ceo, addr, email, tel</td>
                                <td>공급자/수취자</td>
                            </tr>
                            <tr>
                                <td><strong>line_items</strong></td>
                                <td>id, invoice_id, item_name, qty, unit_price, supply_amt, vat</td>
                                <td>품목 상세</td>
                            </tr>
                            <tr>
                                <td><strong>events</strong></td>
                                <td>id, invoice_id, event_type, payload, created_at, actor</td>
                                <td>이벤트 로그</td>
                            </tr>
                        </tbody>
                    </table>
                </div>

                <div style="margin-top: 30px; background: #fce4ec; padding: 20px; border-radius: 10px;">
                    <h4>🔗 상태 머신 (State Machine)</h4>
                    <ul>
                        <li><strong>DRAFT:</strong> 임시저장</li>
                        <li><strong>READY_TO_ISSUE:</strong> 검증완료</li>
                        <li><strong>SIGNED:</strong> 전자서명완료</li>
                        <li><strong>ISSUED:</strong> 발급완료</li>
                        <li><strong>SENT_NTS:</strong> 국세청전송</li>
                        <li><strong>NTS_ACCEPTED:</strong> 접수완료</li>
                        <li><strong>NTS_REJECTED:</strong> 반려</li>
                        <li><strong>CANCELLED:</strong> 발급취소</li>
                        <li><strong>MODIFIED:</strong> 수정발급</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 9: Phase 2 Roadmap -->
        <div class="slide">
            <div class="slide-content">
                <h2>Phase 2 계획 (MVP 이후)</h2>

                <div class="highlight-box">
                    <h3 style="color: white; margin-top: 0;">MVP 성공 후 확장 로드맵</h3>
                    <p style="font-size: 1.2em;">사용자 피드백 기반 점진적 기능 확장</p>
                </div>

                <div style="margin-top: 30px;">
                    <h3>📈 Phase 2 목표 (4주)</h3>
                    <ul>
                        <li><strong>대량발급:</strong> 엑셀/CSV 업로드로 여러 건 동시 발급</li>
                        <li><strong>역발행 워크플로우:</strong> 매입자발행 승인 프로세스</li>
                        <li><strong>위수탁 발급:</strong> 수탁사업자 정보 포함 발급</li>
                        <li><strong>향상된 리포트:</strong> 월별 발급·수정·취소 현황 상세</li>
                    </ul>
                </div>

                <div style="margin-top: 30px;">
                    <h3>🔮 Phase 3 목표 (8주)</h3>
                    <ul>
                        <li><strong>모바일 앱:</strong> 현장 발급/조회</li>
                        <li><strong>ERP 연동:</strong> 더존/영림원 커넥터</li>
                        <li><strong>홈택스 신고보조:</strong> 부가세 신고서 자동 작성</li>
                        <li><strong>AI 오류 예측:</strong> 발급 전 오류 사전 감지</li>
                    </ul>
                </div>

                <div class="success-metrics" style="margin-top: 30px;">
                    <h4>🎯 장기 비전</h4>
                    <p>중소기업을 위한 <strong>완전 자동화 세금계산서 플랫폼</strong></p>
                    <ul>
                        <li>발급·전송 자동화율 95% 이상</li>
                        <li>지연/미전송 건수 0건 유지</li>
                        <li>가산세 리스크 완전 제로화</li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Slide 10: Final Summary -->
        <div class="slide">
            <div class="slide-content">
                <h2>6주 MVP 요약</h2>

                <div class="highlight-box">
                    <h3 style="color: white; margin-top: 0;">핵심 메시지</h3>
                    <p style="font-size: 1.3em;">"가산세 제로를 향한 6주 여정"</p>
                </div>

                <div style="margin-top: 40px;">
                    <h3>✅ 최종 체크리스트</h3>
                    <table class="comparison-table">
                        <thead>
                            <tr>
                                <th>주차</th>
                                <th>핵심 산출물</th>
                                <th>검증 방법</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td><strong>Week 1-2</strong></td>
                                <td>바로빌 연동 + DB 스키마</td>
                                <td>샌드박스 API 호출 성공</td>
                            </tr>
                            <tr>
                                <td><strong>Week 3-4</strong></td>
                                <td>발급·전송·조회·수정·취소 API</td>
                                <td>10건 발급 + 전송 성공</td>
                            </tr>
                            <tr>
                                <td><strong>Week 5-6</strong></td>
                                <td>2개 테넌트 베타 + 운영전환</td>
                                <td>실제 사업자 발급 성공</td>
                            </tr>
                        </tbody>
                    </table>
                </div>

                <div style="margin-top: 40px; text-align: center;">
                    <p style="font-size: 1.3em; color: #f5576c;"><strong>성공 지표</strong></p>
                    <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; margin-top: 30px;">
                        <div class="task-list">
                            <p style="font-size: 1.5em; color: #f5576c; font-weight: bold; margin: 0;">95%</p>
                            <p style="font-size: 1em; margin: 5px 0 0 0;">자동화율 목표</p>
                        </div>
                        <div class="task-list">
                            <p style="font-size: 1.5em; color: #f5576c; font-weight: bold; margin: 0;">0건</p>
                            <p style="font-size: 1em; margin: 5px 0 0 0;">지연/미전송</p>
                        </div>
                        <div class="task-list">
                            <p style="font-size: 1.5em; color: #f5576c; font-weight: bold; margin: 0;">30분</p>
                            <p style="font-size: 1em; margin: 5px 0 0 0;">반려→정정</p>
                        </div>
                        <div class="task-list">
                            <p style="font-size: 1.5em; color: #f5576c; font-weight: bold; margin: 0;">2개</p>
                            <p style="font-size: 1em; margin: 5px 0 0 0;">베타 테넌트</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Slide 11: 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: #f5576c; margin-bottom: 30px;">MVP 전자세금계산서 발행 전략 - 6주 실행 계획</p>
                    <div class="highlight-box" style="margin-top: 50px;">
                        <h3 style="color: white; margin-top: 0;">함께 만들어가는 가산세 제로</h3>
                        <p style="font-size: 1.2em;">빠르고 확실한 시작으로 세무 리스크 최소화</p>
                    </div>
                    <div style="margin-top: 50px; padding: 30px; background: #fce4ec; border-radius: 15px;">
                        <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">11</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>

    <script>
        let currentSlide = 1;
        const totalSlides = 11;
        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');
            });

            slides[currentSlide - 1].classList.add('active');
            document.getElementById('currentSlide').textContent = currentSlide;

            document.getElementById('prevBtn').disabled = (currentSlide === 1);
            document.getElementById('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>
</body>
</html>
