Update index.html

index.html

@@ -78,6 +78,16 @@
             color: white;
         }
         
+        .tab.download-tab {
+            background: rgba(255, 193, 7, 0.2);
+            border: 1px solid rgba(255, 193, 7, 0.4);
+        }
+        
+        .tab.download-tab:hover {
+            background: rgba(255, 193, 7, 0.3);
+            border-color: rgba(255, 193, 7, 0.6);
+        }
+        
         .nav-right {
             display: flex;
             align-items: center;
@@ -316,6 +326,115 @@
             left: 100%;
         }
         
+        /* Download section styles */
+        .download-container {
+            max-width: 800px;
+            margin: 0 auto;
+            text-align: center;
+        }
+        
+        .download-card {
+            background: rgba(255, 255, 255, 0.95);
+            border-radius: 20px;
+            padding: 60px 40px;
+            box-shadow: 0 20px 60px rgba(0,0,0,0.3);
+            backdrop-filter: blur(10px);
+            position: relative;
+            overflow: hidden;
+            animation: fadeInUp 0.8s ease-out;
+        }
+        
+        .download-card::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            height: 5px;
+            background: linear-gradient(90deg, #ffc107, #ff9800);
+        }
+        
+        .download-icon {
+            font-size: 80px;
+            margin-bottom: 30px;
+            animation: bounce 2s infinite;
+        }
+        
+        @keyframes bounce {
+            0%, 100% {
+                transform: translateY(0);
+            }
+            50% {
+                transform: translateY(-20px);
+            }
+        }
+        
+        .download-title {
+            color: #333;
+            font-size: 32px;
+            font-weight: 700;
+            margin-bottom: 20px;
+        }
+        
+        .download-description {
+            color: #666;
+            font-size: 18px;
+            line-height: 1.6;
+            margin-bottom: 40px;
+        }
+        
+        .download-info {
+            background: rgba(255, 193, 7, 0.1);
+            border-radius: 15px;
+            padding: 20px;
+            margin-bottom: 40px;
+        }
+        
+        .download-info-item {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 10px;
+            color: #666;
+            font-size: 16px;
+            margin: 10px 0;
+        }
+        
+        .download-btn {
+            display: inline-block;
+            text-decoration: none;
+            color: #ffffff;
+            background: linear-gradient(135deg, #ffc107 0%, #ff9800 100%);
+            padding: 20px 50px;
+            border-radius: 50px;
+            font-size: 22px;
+            font-weight: 600;
+            transition: all 0.3s ease;
+            box-shadow: 0 5px 20px rgba(255, 152, 0, 0.4);
+            position: relative;
+            overflow: hidden;
+        }
+        
+        .download-btn::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -100%;
+            width: 100%;
+            height: 100%;
+            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent);
+            transition: left 0.6s ease;
+        }
+        
+        .download-btn:hover {
+            transform: translateY(-3px);
+            box-shadow: 0 8px 30px rgba(255, 152, 0, 0.6);
+        }
+        
+        .download-btn:hover::before {
+            left: 100%;
+        }
+        
         /* External link container */
         .external-container {
             background: rgba(255, 255, 255, 0.95);
@@ -609,6 +728,17 @@
         }
         
         /* Responsive */
+        @media (max-width: 1400px) {
+            .tabs {
+                gap: 20px;
+            }
+            
+            .tab {
+                font-size: 13px;
+                padding: 7px 14px;
+            }
+        }
+        
         @media (max-width: 1200px) {
             .nav-container {
                 padding: 15px 20px;
@@ -620,6 +750,7 @@
             
             .tabs {
                 gap: 15px;
+                flex-wrap: wrap;
             }
             
             .tab {
@@ -708,7 +839,7 @@
             }
             
             .container {
-                padding-top: 220px;
+                padding-top: 250px;
             }
             
             .news-container {
@@ -730,6 +861,27 @@
             .section-title {
                 font-size: 24px;
             }
+            
+            .download-card {
+                padding: 40px 20px;
+            }
+            
+            .download-icon {
+                font-size: 60px;
+            }
+            
+            .download-title {
+                font-size: 24px;
+            }
+            
+            .download-description {
+                font-size: 16px;
+            }
+            
+            .download-btn {
+                font-size: 18px;
+                padding: 16px 40px;
+            }
         }
     </style>
 </head>
@@ -742,6 +894,7 @@
                 <a href="#home" class="tab active" data-tab="home">K-AI 커뮤니티 서밋 2025</a>
                 <a href="#news" class="tab" data-tab="news">News</a>
                 <a href="#success" class="tab" data-tab="success">성과</a>
+                <a href="#download" class="tab download-tab" data-tab="download">📥 발표자료 다운로드</a>
                 <a href="#heatmap" class="tab" data-tab="heatmap">히트맵리더보드</a>
                 <a href="#korean" class="tab" data-tab="korean">코리안리더보드</a>
                 <a href="#best" class="tab" data-tab="best">베스트AI</a>
@@ -793,6 +946,44 @@
             </main>
         </div>
         
+        <!-- Download Tab -->
+        <div id="download" class="tab-content">
+            <header class="header">
+                <h1>📥 발표자료 다운로드</h1>
+                <p>K-AI 커뮤니티 서밋 2025 발표자료</p>
+            </header>
+            
+            <div class="download-container">
+                <div class="download-card">
+                    <div class="download-icon">📚</div>
+                    <h2 class="download-title">K-AI 커뮤니티 서밋 2025<br>발표자료 모음</h2>
+                    <p class="download-description">
+                        K-AI 커뮤니티 서밋 2025에서 발표된 모든 자료를 한 번에 다운로드하실 수 있습니다.<br>
+                        최신 AI 기술 트렌드와 혁신적인 사례들을 확인해보세요.
+                    </p>
+                    
+                    <div class="download-info">
+                        <div class="download-info-item">
+                            <span>📁</span>
+                            <span>파일명: 0723.zip</span>
+                        </div>
+                        <div class="download-info-item">
+                            <span>📊</span>
+                            <span>포함 내용: 발표 슬라이드, 데모 자료, 참고 문서</span>
+                        </div>
+                        <div class="download-info-item">
+                            <span>📅</span>
+                            <span>업데이트: 2025년 7월 23일</span>
+                        </div>
+                    </div>
+                    
+                    <a href="0723.zip" download class="download-btn">
+                        <span>📥 발표자료 다운로드</span>
+                    </a>
+                </div>
+            </div>
+        </div>
+        
         <!-- OpenFree AI Success Stories Tab -->
         <div id="success" class="tab-content">
             <header class="header">
@@ -1240,189 +1431,4 @@
                 <!-- News Card 12 - 나머지 기사들 -->
                 <div class="news-card">
                     <a href="https://brunch.co.kr/@seawolf/31" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);">
-                            <span class="news-icon">📊</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">AI가 프리미엄 PPT 생성, 무료 Open Gamma</h3>
-                            <p class="news-description">누구나 쉽게 전문적인 프레젠테이션을 만들 수 있는 AI 기반 PPT 생성 도구를 소개합니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 6 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/31" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #ffecd2 0%, #fcb69f 100%);">
-                            <span class="news-icon">🎙️</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">누구나 5분만에 전문 팟캐스트를 만들 수 있는 AI</h3>
-                            <p class="news-description">AI 기술을 활용하여 전문적인 팟캐스트 콘텐츠를 빠르고 쉽게 제작하는 방법을 알아봅니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 7 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/28" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #ff9a9e 0%, #fecfef 100%);">
-                            <span class="news-icon">🌾</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">한국 농수산물 도매가격 예측 고급 AI 시스템 연구</h3>
-                            <p class="news-description">AI를 활용한 농수산물 가격 예측 시스템의 개발과 실제 적용 사례를 살펴봅니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 8 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/27" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #a1c4fd 0%, #c2e9fb 100%);">
-                            <span class="news-icon">🔮</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">AI가 인간의 삶과 경제, 미래를 예측하고 시각화</h3>
-                            <p class="news-description">빅데이터와 AI를 활용한 미래 예측 기술의 현재와 발전 가능성을 탐구합니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 9 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/26" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #d299c2 0%, #fef9d7 100%);">
-                            <span class="news-icon">🤖</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">Agentic AI 시대: MCP vs MCO 분석</h3>
-                            <p class="news-description">자율적으로 작동하는 AI 에이전트 시스템의 두 가지 주요 접근법을 비교 분석합니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 10 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/24" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #89f7fe 0%, #66a6ff 100%);">
-                            <span class="news-icon">🧬</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">생명의 코드를 다시 쓰다: Protein Genesis</h3>
-                            <p class="news-description">AI를 활용한 단백질 구조 예측과 생성 기술의 혁명적인 발전을 소개합니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 11 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/23" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #fddb92 0%, #d1fdff 100%);">
-                            <span class="news-icon">⭐</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">허깅페이스가 선정한 2024년 글로벌 AI 스타 12선</h3>
-                            <p class="news-description">2024년 AI 분야에서 주목받은 혁신적인 프로젝트와 연구자들을 만나봅니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-                
-                <!-- News Card 12 -->
-                <div class="news-card">
-                    <a href="https://brunch.co.kr/@seawolf/21" target="_blank" class="news-link">
-                        <div class="news-thumbnail" style="background-image: linear-gradient(135deg, #9890e3 0%, #b1f4cf 100%);">
-                            <span class="news-icon">🐾</span>
-                        </div>
-                        <div class="news-content">
-                            <h3 class="news-title">고양이도 발로 코딩한다는 'MOUSE' AI 서비스</h3>
-                            <p class="news-description">누구나 쉽게 코딩할 수 있도록 돕는 혁신적인 AI 코딩 어시스턴트를 소개합니다.</p>
-                            <div class="news-source">
-                                <span>📍</span>
-                                <span>Brunch</span>
-                            </div>
-                        </div>
-                    </a>
-                </div>
-            </div>
-        </div>
-    </div>
-    
-    <!-- Footer -->
-    <footer class="footer">
-        <div class="footer-info">
-            (주) 비드래프트 | 대표 김민식 | 주소: 서울특별시 강남구 학동로 165 | 사업자 등록번호: 879-87-03063
-        </div>
-    </footer>
-    
-    <script>
-        // Tab switching functionality
-        document.querySelectorAll('.tab').forEach(tab => {
-            tab.addEventListener('click', (e) => {
-                e.preventDefault();
-                const targetTab = tab.getAttribute('data-tab');
-                
-                // Update active tab
-                document.querySelectorAll('.tab').forEach(t => t.classList.remove('active'));
-                tab.classList.add('active');
-                
-                // Show corresponding content
-                document.querySelectorAll('.tab-content').forEach(content => {
-                    content.classList.remove('active');
-                });
-                document.getElementById(targetTab).classList.add('active');
-            });
-        });
-        
-        // Home button functionality
-        document.querySelector('.home-btn').addEventListener('click', (e) => {
-            e.preventDefault();
-            document.querySelector('.tab[data-tab="home"]').click();
-        });
-        
-        // Add dynamic particles on mouse move
-        document.addEventListener('mousemove', (e) => {
-            if (Math.random() > 0.95) {
-                const particle = document.createElement('div');
-                particle.className = 'particle';
-                particle.style.width = Math.random() * 20 + 10 + 'px';
-                particle.style.height = particle.style.width;
-                particle.style.left = e.clientX + 'px';
-                particle.style.top = e.clientY + 'px';
-                particle.style.animationDuration = Math.random() * 3 + 2 + 's';
-                document.querySelector('.particles').appendChild(particle);
-                
-                setTimeout(() => particle.remove(), 5000);
-            }
-        });
-    </script>
-</body>
-</html>
+                        <div class="news-thumbnail" style