diff --git a/.superdesign/design_iterations/airoum_1_5.html b/.superdesign/design_iterations/airoum_1_5.html
index f504015..d63d947 100644
--- a/.superdesign/design_iterations/airoum_1_5.html
+++ b/.superdesign/design_iterations/airoum_1_5.html
@@ -157,6 +157,13 @@
         ::-webkit-scrollbar-thumb:hover {
             background: var(--pumpkin);
         }
+        html {
+            scroll-behavior: smooth;
+        }
+        /* Set scroll margin on sections to prevent them from being covered by the fixed nav */
+        section[id] {
+            scroll-margin-top: 5rem; /* 80px */
+        }
     </style>
 </head>
 <body class="bg-white">
@@ -170,8 +177,8 @@
                 <div class="flex justify-between items-center h-16 sm:h-20">
                     <!-- Logo -->
                     <div class="flex-shrink-0 flex items-center space-x-4">
-                        <img src="images/logo.png" alt="AIROUM Logo" class="h-10">
-                        <h1 class="text-2xl sm:text-3xl font-bold" style="color: var(--dark-green);">
+                        <img src="images/logo.png" alt="AIROUM Logo" class="h-8 sm:h-10">
+                        <h1 class="text-xl sm:text-3xl font-bold" style="color: var(--dark-green);">
                             AIROUM
                         </h1>
                     </div>
@@ -197,14 +204,11 @@
         </div>
         
         <!-- Mobile Menu -->
-        <div class="md:hidden glass transform -translate-y-full transition-transform duration-300" id="mobile-menu">
+        <div class="md:hidden glass overflow-hidden transition-all duration-300 ease-in-out" id="mobile-menu" style="max-height: 0px;">
             <div class="px-4 py-4 space-y-3">
                 <a href="#about" class="block px-4 py-2 text-gray-700 hover:text-[var(--pumpkin)]">회사소개</a>
                 <a href="#programs" class="block px-4 py-2 text-gray-700 hover:text-[var(--pumpkin)]">교육 프로그램</a>
-                <a href="#contact" class="block px-4 py-2 text-white rounded-full text-center" 
-                   style="background: var(--pumpkin);">
-                    문의·신청
-                </a>
+                <a href="#contact" class="block px-4 py-2 text-gray-700 hover:text-[var(--pumpkin)]">문의·신청</a>
             </div>
         </div>
     </nav>
@@ -224,11 +228,11 @@
         <div class="container mx-auto px-4 sm:px-6 lg:px-8 relative z-10 flex-grow flex flex-col justify-center">
             <!-- Slider Container -->
             <div id="hero-slider-container" class="relative w-full max-w-4xl mx-auto overflow-hidden">
-                <div id="hero-slider" class="flex transition-transform duration-700 ease-in-out">
+                <div id="hero-slider" class="flex items-center transition-transform duration-700 ease-in-out" style="min-height: 40vh;">
                     <!-- Slide 1: Hero Content -->
                     <div class="w-full flex-shrink-0">
                         <div class="text-center">
-                            <h1 class="text-4xl sm:text-5xl lg:text-6xl font-bold mb-6 animate-fade-in-up" style="color: var(--dark-green);">
+                            <h1 class="text-3xl sm:text-5xl lg:text-6xl font-bold mb-6 animate-fade-in-up" style="color: var(--dark-green);">
                                 생성형 AI 시대,<br>
                                 <span class="gradient-text">기술을 넘어 미래를</span><br>
                                 설계하는 사람을 키웁니다.
@@ -260,7 +264,7 @@
             
             <!-- CTA Buttons (Static) -->
             <div class="flex flex-col sm:flex-row gap-4 justify-center mt-8 animate-fade-in-up" style="animation-delay: 0.4s;">
-                <button class="magnetic-btn px-8 py-3 rounded-full text-white font-semibold transition-all" style="background: var(--pumpkin);">
+                <button class="magnetic-btn px-8 py-3 rounded-full text-white font-semibold transition-all hidden sm:block" style="background: var(--pumpkin);">
                     무료 상담 신청
                 </button>
                 <button class="magnetic-btn px-8 py-3 rounded-full font-semibold transition-all" style="border: 2px solid var(--dark-green); color: var(--dark-green);">
@@ -289,7 +293,7 @@
     </section>
     
     <!-- Why AIROUM Section -->
-    <section class="py-20 bg-gray-50" id="about">
+    <section class="py-20 bg-gray-50 scroll-mt-16 sm:scroll-mt-20" id="about">
         <div class="container mx-auto px-4 sm:px-6 lg:px-8">
             <div class="text-center mb-16 animate-on-scroll">
                 <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4" style="color: var(--dark-green);">
@@ -424,7 +428,7 @@
     </section>
     
     <!-- Programs Section -->
-    <section class="py-20" id="programs">
+    <section class="py-20 scroll-mt-16 sm:scroll-mt-20" id="programs">
         <div class="container mx-auto px-4 sm:px-6 lg:px-8">
             <div class="text-center mb-16 animate-on-scroll">
                 <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4" style="color: var(--dark-green);">
@@ -729,7 +733,7 @@
         
         <div class="container mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
             <div class="text-center text-white mb-12">
-                <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-6">
+                <h2 class="text-2xl sm:text-3xl lg:text-4xl font-bold mb-6">
                     생성형 AI는 단순한 유행이 아니라<br>
                     미래 교육의 기본값입니다.
                 </h2>
@@ -754,9 +758,9 @@
             </div>
             
             <!-- Contact Form -->
-            <div class="max-w-2xl mx-auto" id="contact">
+            <div class="max-w-2xl mx-auto scroll-mt-16 sm:scroll-mt-20" id="contact">
                 <div class="bg-white rounded-3xl p-8 sm:p-12 shadow-2xl">
-                    <h3 class="text-2xl sm:text-3xl font-bold text-center mb-8" style="color: var(--dark-green);">
+                    <h3 class="text-xl sm:text-2xl font-bold text-center mb-8" style="color: var(--dark-green);">
                         무료 상담 및 교육 문의
                     </h3>
                     
@@ -807,7 +811,7 @@
                             <path d="M16.273 12.845L7.376 0H0v24h7.726V11.156L16.624 24H24V0h-7.727v12.845z"/>
                         </svg>
                     </a>
-                    <a href="https://instagram.com/aiyi\_choi" class="text-white hover:text-[var(--pumpkin)] transition-colors">
+                    <a href="https://instagram.com/aiyi_choi" class="text-white hover:text-[var(--pumpkin)] transition-colors">
                         <span class="sr-only">Instagram</span>
                         <svg class="w-8 h-8" fill="currentColor" viewBox="0 0 24 24">
                             <path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zM5.838 12a6.162 6.162 0 1112.324 0 6.162 6.162 0 01-12.324 0zM12 16a4 4 0 110-8 4 4 0 010 8zm4.965-10.405a1.44 1.44 0 112.881.001 1.44 1.44 0 01-2.881-.001z"/>
@@ -821,6 +825,14 @@
             </div>
         </div>
     </footer>
+
+    <!-- Mobile Floating CTA -->
+    <div id="mobile-cta" class="md:hidden fixed bottom-0 left-0 right-0 p-4 bg-white/80 backdrop-blur-xl z-40 transition-transform duration-500" style="box-shadow: 0 -2px 10px rgba(0,0,0,0.1);">
+        <a href="#contact" class="w-full block text-center px-6 py-3 rounded-full text-white font-semibold transition-all" 
+           style="background: var(--pumpkin);">
+            무료 상담 및 교육 문의
+        </a>
+    </div>
     
     <!-- Scripts -->
     <script>
@@ -894,23 +906,30 @@
             document.querySelector('.scroll-progress').style.transform = `scaleX(${scrollPercent})`;
         });
         
-        // Navbar Background on Scroll
+        // Navbar Background on Scroll & Mobile Menu management
         const navbar = document.getElementById('navbar');
+        const mobileMenu = document.getElementById('mobile-menu');
+        const mobileMenuBtn = document.getElementById('mobile-menu-btn');
+
         window.addEventListener('scroll', () => {
             if (window.scrollY > 50) {
                 navbar.classList.add('bg-white', 'shadow-lg');
             } else {
                 navbar.classList.remove('bg-white', 'shadow-lg');
             }
+            // Close mobile menu on scroll
+            if (mobileMenu && !mobileMenu.classList.contains('-translate-y-full')) {
+                mobileMenu.classList.add('-translate-y-full');
+            }
         });
         
-        // Mobile Menu Toggle
-        const mobileMenuBtn = document.getElementById('mobile-menu-btn');
-        const mobileMenu = document.getElementById('mobile-menu');
-        
-        mobileMenuBtn.addEventListener('click', () => {
-            mobileMenu.classList.toggle('-translate-y-full');
-        });
+        if (mobileMenuBtn) {
+            mobileMenuBtn.addEventListener('click', () => {
+                if (mobileMenu) {
+                    mobileMenu.classList.toggle('-translate-y-full');
+                }
+            });
+        }
         
         // Smooth Scroll for Anchor Links
         document.querySelectorAll('a[href^="#"]').forEach(anchor => {
@@ -942,6 +961,24 @@
         document.querySelectorAll('.animate-on-scroll').forEach(el => {
             observer.observe(el);
         });
+
+        // Mobile CTA visibility
+        const mobileCta = document.getElementById('mobile-cta');
+        const contactSection = document.getElementById('contact');
+
+        const ctaObserver = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    mobileCta.classList.add('translate-y-full');
+                } else {
+                    mobileCta.classList.remove('translate-y-full');
+                }
+            });
+        }, { threshold: 0.1 });
+
+        if (contactSection) {
+            ctaObserver.observe(contactSection);
+        }
         
         // Parallax Effect
         const parallaxElements = document.querySelectorAll('.parallax-layer');
diff --git a/.superdesign/design_iterations/airoum_1_6.html b/.superdesign/design_iterations/airoum_1_6.html
new file mode 100644
index 0000000..c6ea26e
--- /dev/null
+++ b/.superdesign/design_iterations/airoum_1_6.html
@@ -0,0 +1,846 @@
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>AIROUM - AI 교육의 새로운 기준</title>
+    
+    <!-- Tailwind CSS -->
+    <script src="https://cdn.tailwindcss.com"></script>
+    
+    <!-- Lucide Icons -->
+    <script src="https://unpkg.com/lucide@latest/dist/umd/lucide.min.js"></script>
+    
+    <style>
+        /* Custom Fonts */
+        @font-face {
+            font-family: 'GmarketSansMedium';
+            src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
+            font-weight: normal;
+            font-style: normal;
+        }
+        
+        @font-face {
+            font-family: 'Pretendard-Regular';
+            src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+            font-weight: 400;
+            font-style: normal;
+        }
+
+        /* Custom Properties */
+        :root {
+            --pumpkin: #F4762F;
+            --pumpkin-light: #F69258;
+            --pumpkin-dark: #DD580C;
+            --dark-green: #16332D;
+            --dark-green-light: #306F63;
+            --dark-green-darker: #0D1E1B;
+            --slate: #3C5751;
+            --slate-light: #5A8279;
+            --slate-dark: #243431;
+            --silver: #BCC4C2;
+            --white: #FEFEFE;
+            --black: #111827;
+            --gray-dark: #374151;
+            --gray: #6B7280;
+            --gray-light: #9CA3AF;
+        }
+
+        /* Base Styles */
+        body {
+            font-family: 'Pretendard-Regular', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+            color: var(--gray-dark) !important;
+            background-color: var(--white) !important;
+        }
+
+        h1, h2, h3, h4, h5, h6 {
+            font-family: 'GmarketSansMedium', sans-serif !important;
+            color: var(--dark-green) !important;
+            line-height: 1.2 !important;
+        }
+
+        /* Custom Animations */
+        @keyframes fadeInUp {
+            from {
+                opacity: 0;
+                transform: translateY(30px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        @keyframes slideInLeft {
+            from {
+                opacity: 0;
+                transform: translateX(-30px);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+
+        @keyframes float {
+            0%, 100% {
+                transform: translateY(0);
+            }
+            50% {
+                transform: translateY(-10px);
+            }
+        }
+
+        @keyframes pulse {
+            0%, 100% {
+                opacity: 1;
+            }
+            50% {
+                opacity: 0.5;
+            }
+        }
+
+        .animate-fadeInUp {
+            animation: fadeInUp 0.8s ease-out forwards;
+            opacity: 0;
+        }
+
+        .animate-slideInLeft {
+            animation: slideInLeft 0.6s ease-out forwards;
+            opacity: 0;
+        }
+
+        .animate-float {
+            animation: float 3s ease-in-out infinite;
+        }
+
+        .animate-pulse-slow {
+            animation: pulse 2s ease-in-out infinite;
+        }
+
+        /* Gradient Backgrounds */
+        .gradient-light {
+            background: linear-gradient(180deg, #FFFFFF 0%, #FAFBFB 100%);
+        }
+
+        .gradient-dark {
+            background: linear-gradient(135deg, var(--dark-green) 0%, var(--dark-green-light) 100%);
+        }
+
+        /* Button Styles */
+        .btn-primary {
+            background-color: var(--pumpkin) !important;
+            color: var(--white) !important;
+            padding: 1rem 2rem !important;
+            border-radius: 9999px !important;
+            font-weight: 500 !important;
+            transition: all 0.3s ease-out !important;
+            box-shadow: 0 4px 14px rgba(244, 118, 47, 0.25) !important;
+        }
+
+        .btn-primary:hover {
+            background-color: var(--pumpkin-dark) !important;
+            transform: translateY(-2px) !important;
+            box-shadow: 0 6px 20px rgba(244, 118, 47, 0.35) !important;
+        }
+
+        .btn-secondary {
+            background-color: transparent !important;
+            color: var(--dark-green) !important;
+            padding: 1rem 2rem !important;
+            border: 2px solid var(--silver) !important;
+            border-radius: 9999px !important;
+            font-weight: 500 !important;
+            transition: all 0.3s ease-out !important;
+        }
+
+        .btn-secondary:hover {
+            background-color: var(--dark-green-light) !important;
+            color: var(--white) !important;
+            border-color: var(--dark-green-light) !important;
+        }
+
+        /* Card Styles */
+        .card-elegant {
+            background: white;
+            border-radius: 1.5rem;
+            padding: 2rem;
+            transition: all 0.3s ease-out;
+            box-shadow: 0 4px 6px -1px rgba(22, 51, 45, 0.08),
+                        0 2px 4px -1px rgba(22, 51, 45, 0.04);
+        }
+
+        .card-elegant:hover {
+            transform: translateY(-4px);
+            box-shadow: 0 20px 25px -5px rgba(22, 51, 45, 0.10),
+                        0 10px 10px -5px rgba(22, 51, 45, 0.04);
+        }
+
+        /* Input Styles */
+        .input-elegant {
+            width: 100%;
+            padding: 1rem 1.5rem;
+            background-color: white;
+            border: 2px solid var(--silver);
+            border-radius: 1rem;
+            color: var(--gray-dark);
+            transition: all 0.2s ease-out;
+            box-shadow: inset 0 2px 4px rgba(22, 51, 45, 0.04);
+        }
+
+        .input-elegant:focus {
+            border-color: var(--dark-green-light);
+            outline: none;
+            box-shadow: inset 0 2px 4px rgba(22, 51, 45, 0.04),
+                        0 0 0 4px rgba(48, 111, 99, 0.1);
+        }
+
+        /* Slider Styles */
+        .slider-container {
+            position: relative;
+            overflow: hidden;
+        }
+
+        .slider-track {
+            display: flex;
+            transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+        }
+
+        .slider-button {
+            position: absolute;
+            top: 50%;
+            transform: translateY(-50%);
+            background: white;
+            border-radius: 50%;
+            width: 48px;
+            height: 48px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+            cursor: pointer;
+            transition: all 0.3s ease;
+            z-index: 10;
+        }
+
+        .slider-button:hover {
+            transform: translateY(-50%) scale(1.1);
+            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
+        }
+
+        /* Scroll Animations */
+        .scroll-animate {
+            opacity: 0;
+            transform: translateY(30px);
+            transition: all 0.8s ease-out;
+        }
+
+        .scroll-animate.active {
+            opacity: 1;
+            transform: translateY(0);
+        }
+
+        /* Header Scroll Effect */
+        .header-scrolled {
+            background-color: rgba(254, 254, 254, 0.95) !important;
+            backdrop-filter: blur(10px) !important;
+            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
+        }
+    </style>
+</head>
+<body>
+    <!-- Header -->
+    <header id="header" class="fixed top-0 left-0 right-0 z-50 transition-all duration-300">
+        <nav class="container mx-auto px-6 py-6">
+            <div class="flex items-center justify-between">
+                <!-- Logo -->
+                <div class="flex items-center">
+                    <h1 class="text-2xl font-bold" style="color: var(--pumpkin)">AIROUM</h1>
+                </div>
+                
+                <!-- Navigation -->
+                <div class="hidden md:flex items-center space-x-8">
+                    <a href="#about" class="text-gray-700 hover:text-pumpkin transition">회사소개</a>
+                    <a href="#programs" class="text-gray-700 hover:text-pumpkin transition">교육 프로그램</a>
+                    <a href="#contact" class="btn-primary">문의·신청</a>
+                </div>
+                
+                <!-- Mobile Menu Button -->
+                <button class="md:hidden" onclick="toggleMobileMenu()">
+                    <i data-lucide="menu" class="w-6 h-6"></i>
+                </button>
+            </div>
+        </nav>
+    </header>
+
+    <!-- Main Content -->
+    <main>
+        <!-- Hero Section with Slider -->
+        <section class="pt-24 pb-16 px-6">
+            <div class="container mx-auto max-w-6xl">
+                <div class="relative overflow-hidden rounded-3xl gradient-light" style="min-height: 500px;">
+                    <div class="slider-container">
+                        <div class="slider-track" id="heroSlider">
+                            <!-- Slide 1: Hero -->
+                            <div class="w-full flex-shrink-0 p-12 md:p-20 animate-fadeInUp">
+                                <div class="max-w-3xl">
+                                    <h2 class="text-4xl md:text-6xl mb-6 leading-tight">
+                                        생성형 AI 시대,<br>
+                                        기술을 넘어 미래를 설계하는<br>
+                                        <span style="color: var(--pumpkin)">사람을 키웁니다</span>
+                                    </h2>
+                                    <div class="w-20 h-1 mb-6 rounded-full" style="background-color: var(--pumpkin)"></div>
+                                    <p class="text-lg md:text-xl mb-8 text-gray-600 leading-relaxed">
+                                        에이로움은 'AI(인공지능)'와 '새로움'의 가치를 융합한 AI 교육 전문 연구소입니다.<br>
+                                        AI 개발자와 교육 전문가가 함께 만든 현장 중심 교육으로<br>
+                                        당신의 성장을 돕는 든든한 동반자가 되겠습니다.
+                                    </p>
+                                    <div class="flex flex-wrap gap-4">
+                                        <button class="btn-primary">무료 상담 신청</button>
+                                        <button class="btn-secondary">프로그램 보기</button>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Slide 2: CEO Introduction -->
+                            <div class="w-full flex-shrink-0 p-12 md:p-20">
+                                <div class="flex flex-col md:flex-row items-center gap-8">
+                                    <div class="w-48 h-48 rounded-full overflow-hidden shadow-xl">
+                                        <img src="https://images.unsplash.com/photo-1594744803329-e58b31de8bf5?w=400&h=400&fit=crop" 
+                                             alt="최아영 대표" class="w-full h-full object-cover">
+                                    </div>
+                                    <div class="flex-1 text-center md:text-left">
+                                        <h3 class="text-3xl mb-2">최아영 대표</h3>
+                                        <p class="text-xl mb-4" style="color: var(--dark-green-light)">AI 교육 기획 전문가</p>
+                                        <blockquote class="text-2xl mb-6 italic" style="color: var(--pumpkin)">
+                                            "AI로 아이들의 상상력에 날개를 달아줍니다"
+                                        </blockquote>
+                                        <p class="text-gray-600 leading-relaxed">
+                                            10년 이상의 교육 기획 경험과 AI 기술 전문성을 바탕으로<br>
+                                            실질적이고 혁신적인 AI 교육 프로그램을 개발하고 있습니다.
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Slider Controls -->
+                        <button class="slider-button left-4" onclick="previousSlide()">
+                            <i data-lucide="chevron-left" class="w-6 h-6"></i>
+                        </button>
+                        <button class="slider-button right-4" onclick="nextSlide()">
+                            <i data-lucide="chevron-right" class="w-6 h-6"></i>
+                        </button>
+                        
+                        <!-- Slider Indicators -->
+                        <div class="absolute bottom-6 left-1/2 transform -translate-x-1/2 flex gap-2">
+                            <button class="w-2 h-2 rounded-full bg-pumpkin transition-all duration-300" id="indicator-0"></button>
+                            <button class="w-2 h-2 rounded-full bg-gray-300 transition-all duration-300" id="indicator-1"></button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Why AIROUM Section -->
+        <section id="about" class="py-20 scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">왜 에이로움인가?</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+                    <!-- Value Card 1 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.1s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(244, 118, 47, 0.1)">
+                            <i data-lucide="zap" class="w-8 h-8" style="color: var(--pumpkin)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">실천형 교육</h3>
+                        <p class="text-lg mb-3" style="color: var(--pumpkin)">"배우고 바로 쓴다"</p>
+                        <p class="text-gray-600">이론 중심 교육을 넘어, 수업, 연수, 실무에 바로 적용할 수 있는 현장 밀착형 교육을 제공합니다.</p>
+                    </div>
+
+                    <!-- Value Card 2 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.2s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(48, 111, 99, 0.1)">
+                            <i data-lucide="map-pin" class="w-8 h-8" style="color: var(--dark-green-light)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">열린 교육</h3>
+                        <p class="text-lg mb-3" style="color: var(--dark-green-light)">"지역 격차 없는 기회"</p>
+                        <p class="text-gray-600">서울, 수도권에 집중된 교육 기회를 넘어, 지역 거점 센터를 통해 전국 어디서나 고품질 교육을 제공합니다.</p>
+                    </div>
+
+                    <!-- Value Card 3 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.3s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(244, 118, 47, 0.1)">
+                            <i data-lucide="share-2" class="w-8 h-8" style="color: var(--pumpkin)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">융합형 교육</h3>
+                        <p class="text-lg mb-3" style="color: var(--pumpkin)">"경계를 허무는 연결"</p>
+                        <p class="text-gray-600">진로 설계, 교과 프로젝트, 업무 실무까지 생성형 AI와 자연스럽게 연결하여 유기적으로 엮은 융합 교육을 운영합니다.</p>
+                    </div>
+
+                    <!-- Value Card 4 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.4s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(48, 111, 99, 0.1)">
+                            <i data-lucide="award" class="w-8 h-8" style="color: var(--dark-green-light)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">검증된 전문성</h3>
+                        <p class="text-lg mb-3" style="color: var(--dark-green-light)">"전문가들의 협업"</p>
+                        <p class="text-gray-600">AI 개발자와 교육 전문가가 협업하여 제작한 신뢰도 높은 커리큘럼과 현장에서 다듬어진 전문 강사진이 직접 수업합니다.</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Programs Section -->
+        <section id="programs" class="py-20 gradient-light scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">교육 프로그램</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <!-- Program Slider -->
+                <div class="relative">
+                    <div class="slider-container overflow-hidden">
+                        <div class="slider-track flex gap-6" id="programSlider">
+                            <!-- Program Card 1 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1522202176988-66273c2fd55f?w=400&h=300&fit=crop" 
+                                             alt="AI 진로·직업 프로젝트" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(244, 118, 47, 0.1); color: var(--pumpkin)">학생</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 진로·직업 프로젝트</h3>
+                                    <p class="text-gray-600 mb-4">생성형 AI로 흥미와 강점을 탐색하고 진로를 설계하는 수업</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 2 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1509062522246-3755977927d7?w=400&h=300&fit=crop" 
+                                             alt="AI 교과 연계 프로젝트" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(244, 118, 47, 0.1); color: var(--pumpkin)">학생</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 교과 연계 프로젝트</h3>
+                                    <p class="text-gray-600 mb-4">국어·사회·과학 등 교과 주제와 생성형 AI를 융합한 프로젝트 수업</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 3 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1531482615713-2afd69097998?w=400&h=300&fit=crop" 
+                                             alt="AI 윤리 교육" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">모두</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 윤리 교육</h3>
+                                    <p class="text-gray-600 mb-4">AI 시대에 필요한 디지털 윤리와 책임감을 배우는 시민 교육</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 4 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?w=400&h=300&fit=crop" 
+                                             alt="생성형 AI 실무 활용" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">교사·기업</span>
+                                    <h3 class="text-xl mt-3 mb-2">생성형 AI 실무 활용</h3>
+                                    <p class="text-gray-600 mb-4">텍스트·이미지·영상 등 생성형 AI 도구를 실습하는 실무 중심 교육</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 5 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1524178232363-1fb2b075b655?w=400&h=300&fit=crop" 
+                                             alt="교사·공무원 연수" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">교사·공무원</span>
+                                    <h3 class="text-xl mt-3 mb-2">교사·공무원 연수</h3>
+                                    <p class="text-gray-600 mb-4">현장 적용 중심의 워크숍형 AI 연수 프로그램</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 6 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1559526324-4b87b5e36e44?w=400&h=300&fit=crop" 
+                                             alt="AI 금융 활용 교육" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(244, 118, 47, 0.1); color: var(--pumpkin)">학생·일반인</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 금융 활용 교육</h3>
+                                    <p class="text-gray-600 mb-4">생성형 AI로 금융 정보를 탐색하고 자산을 관리하는 실습 교육</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 7 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1573166364524-d9dbfd8bbf83?w=400&h=300&fit=crop" 
+                                             alt="생성형 AI 강사 양성" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">강사</span>
+                                    <h3 class="text-xl mt-3 mb-2">생성형 AI 강사 양성</h3>
+                                    <p class="text-gray-600 mb-4">생성형 AI 교육 전문가로 성장하기 위한 실전 중심 양성 과정</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Program Slider Controls -->
+                    <button class="slider-button -left-6" onclick="programSliderPrev()">
+                        <i data-lucide="chevron-left" class="w-6 h-6"></i>
+                    </button>
+                    <button class="slider-button -right-6" onclick="programSliderNext()">
+                        <i data-lucide="chevron-right" class="w-6 h-6"></i>
+                    </button>
+                </div>
+            </div>
+        </section>
+
+        <!-- Target Audience Section -->
+        <section class="py-20 scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">이런 분들께 필요합니다</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+                    <div class="text-center scroll-animate" style="animation-delay: 0.1s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="book-open" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">AI 교육이 막막한 교사</h3>
+                        <p class="text-pumpkin font-medium mb-2">"수업에 바로 쓸 수 있는 실전 콘텐츠"</p>
+                        <p class="text-gray-600">를 제공합니다.</p>
+                    </div>
+                    
+                    <div class="text-center scroll-animate" style="animation-delay: 0.2s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="map" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">지역에서도 수준 높은 교육을 만들고 싶은 기획자</h3>
+                        <p class="text-pumpkin font-medium mb-2">"지역 거점 운영 모델과 검증된 커리큘럼"</p>
+                        <p class="text-gray-600">이 준비돼 있습니다.</p>
+                    </div>
+                    
+                    <div class="text-center scroll-animate" style="animation-delay: 0.3s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="presentation" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">AI 강사가 되고 싶은 분</h3>
+                        <p class="text-pumpkin font-medium mb-2">"실전형 양성과정"</p>
+                        <p class="text-gray-600">을 제공합니다.</p>
+                    </div>
+                    
+                    <div class="text-center scroll-animate" style="animation-delay: 0.4s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="sparkles" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">AI 시대를 살아갈 학생들</h3>
+                        <p class="text-pumpkin font-medium mb-2">"진로 설계와 아이디어 실현 기회"</p>
+                        <p class="text-gray-600">를 제공합니다.</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Track Record Section -->
+        <section class="py-20 gradient-light scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">교육 실적</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <!-- Partner Logos -->
+                <div class="flex flex-wrap justify-center items-center gap-8 mb-12">
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow"></div>
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow" style="animation-delay: 0.2s"></div>
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow" style="animation-delay: 0.4s"></div>
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow" style="animation-delay: 0.6s"></div>
+                </div>
+                
+                <!-- Statistics -->
+                <div class="grid md:grid-cols-3 gap-8 text-center">
+                    <div class="scroll-animate" style="animation-delay: 0.1s">
+                        <h3 class="text-5xl font-bold mb-2" style="color: var(--pumpkin)">
+                            <span class="counter" data-target="1000">0</span>+
+                        </h3>
+                        <p class="text-xl text-gray-700">수강생</p>
+                    </div>
+                    <div class="scroll-animate" style="animation-delay: 0.2s">
+                        <h3 class="text-5xl font-bold mb-2" style="color: var(--dark-green-light)">
+                            <span class="counter" data-target="50">0</span>+
+                        </h3>
+                        <p class="text-xl text-gray-700">협력기관</p>
+                    </div>
+                    <div class="scroll-animate" style="animation-delay: 0.3s">
+                        <h3 class="text-5xl font-bold mb-2" style="color: var(--pumpkin)">
+                            <span class="counter" data-target="98">0</span>%
+                        </h3>
+                        <p class="text-xl text-gray-700">만족도</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Closing Message -->
+        <section class="py-20 scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center max-w-3xl mx-auto">
+                    <h2 class="text-2xl md:text-3xl mb-6">마무리</h2>
+                    <div class="w-20 h-1 mx-auto mb-8 rounded-full" style="background-color: var(--pumpkin)"></div>
+                    <p class="text-xl mb-6 leading-relaxed text-gray-700">
+                        생성형 AI는 단순한 유행이 아니라<br>
+                        <span class="font-semibold" style="color: var(--dark-green)">미래 교육의 기본값입니다.</span>
+                    </p>
+                    <p class="text-lg mb-8 text-gray-600">
+                        에이로움이 그 시작이 되어드리겠습니다.
+                    </p>
+                    <div class="text-left max-w-md mx-auto">
+                        <p class="flex items-center mb-2">
+                            <i data-lucide="check" class="w-5 h-5 mr-2" style="color: var(--pumpkin)"></i>
+                            교육에 변화를 주고 싶다면
+                        </p>
+                        <p class="flex items-center">
+                            <i data-lucide="check" class="w-5 h-5 mr-2" style="color: var(--pumpkin)"></i>
+                            더 실천적인 AI 교육을 찾고 있다면
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Contact Section -->
+        <section id="contact" class="py-20 gradient-light scroll-animate">
+            <div class="container mx-auto px-6 max-w-2xl">
+                <div class="text-center mb-12">
+                    <h2 class="text-3xl md:text-4xl mb-4">궁금한 점이 있다면, 지금 바로 문의하세요</h2>
+                </div>
+                
+                <form class="card-elegant" onsubmit="handleSubmit(event)">
+                    <div class="space-y-6">
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">이름</label>
+                            <input type="text" class="input-elegant" placeholder="성함을 입력해주세요" required>
+                        </div>
+                        
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">연락처</label>
+                            <input type="tel" class="input-elegant" placeholder="010-0000-0000" required>
+                        </div>
+                        
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">이메일</label>
+                            <input type="email" class="input-elegant" placeholder="email@example.com" required>
+                        </div>
+                        
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">문의내용</label>
+                            <textarea rows="4" class="input-elegant" placeholder="문의하실 내용을 자유롭게 작성해주세요" required></textarea>
+                        </div>
+                        
+                        <button type="submit" class="btn-primary w-full">
+                            문의하기
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </section>
+    </main>
+
+    <!-- Footer -->
+    <footer class="py-12 bg-gray-50">
+        <div class="container mx-auto px-6 text-center">
+            <h3 class="text-xl font-bold mb-4" style="color: var(--dark-green)">에이로움 교육연구소</h3>
+            <p class="text-gray-600 mb-2">대표: 최아영 | 연락처: 010-5095-8821</p>
+            <p class="text-gray-600 mb-6">서울특별시 송파구 오금로 11길 55, 214-88호</p>
+            <div class="flex justify-center gap-4">
+                <a href="#" class="text-gray-600 hover:text-pumpkin transition">
+                    <span class="flex items-center gap-2">
+                        <i data-lucide="pen-square" class="w-5 h-5"></i>
+                        Blog
+                    </span>
+                </a>
+                <a href="#" class="text-gray-600 hover:text-pumpkin transition">
+                    <span class="flex items-center gap-2">
+                        <i data-lucide="instagram" class="w-5 h-5"></i>
+                        Instagram
+                    </span>
+                </a>
+            </div>
+        </div>
+    </footer>
+
+    <script>
+        // Initialize Lucide icons
+        lucide.createIcons();
+
+        // Hero Slider
+        let currentSlide = 0;
+        const heroSlider = document.getElementById('heroSlider');
+        const totalSlides = 2;
+
+        function updateSlider() {
+            heroSlider.style.transform = `translateX(-${currentSlide * 100}%)`;
+            
+            // Update indicators
+            for (let i = 0; i < totalSlides; i++) {
+                const indicator = document.getElementById(`indicator-${i}`);
+                if (i === currentSlide) {
+                    indicator.classList.add('bg-pumpkin', 'w-8');
+                    indicator.classList.remove('bg-gray-300', 'w-2');
+                } else {
+                    indicator.classList.remove('bg-pumpkin', 'w-8');
+                    indicator.classList.add('bg-gray-300', 'w-2');
+                }
+            }
+        }
+
+        function nextSlide() {
+            currentSlide = (currentSlide + 1) % totalSlides;
+            updateSlider();
+        }
+
+        function previousSlide() {
+            currentSlide = (currentSlide - 1 + totalSlides) % totalSlides;
+            updateSlider();
+        }
+
+        // Auto-slide every 5 seconds
+        setInterval(nextSlide, 5000);
+
+        // Program Slider
+        let programSlideIndex = 0;
+        const programSlider = document.getElementById('programSlider');
+        const programCards = programSlider.children.length;
+        const cardsPerView = window.innerWidth >= 1024 ? 3 : window.innerWidth >= 768 ? 2 : 1;
+
+        function programSliderNext() {
+            if (programSlideIndex < programCards - cardsPerView) {
+                programSlideIndex++;
+                updateProgramSlider();
+            }
+        }
+
+        function programSliderPrev() {
+            if (programSlideIndex > 0) {
+                programSlideIndex--;
+                updateProgramSlider();
+            }
+        }
+
+        function updateProgramSlider() {
+            const slideWidth = 100 / cardsPerView;
+            programSlider.style.transform = `translateX(-${programSlideIndex * slideWidth}%)`;
+        }
+
+        // Scroll Animations
+        const observerOptions = {
+            threshold: 0.1,
+            rootMargin: '0px 0px -100px 0px'
+        };
+
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.classList.add('active');
+                    
+                    // Counter animation for statistics
+                    if (entry.target.querySelector('.counter')) {
+                        const counters = entry.target.querySelectorAll('.counter');
+                        counters.forEach(counter => {
+                            const target = parseInt(counter.dataset.target);
+                            const increment = target / 100;
+                            let current = 0;
+                            
+                            const updateCounter = () => {
+                                current += increment;
+                                if (current < target) {
+                                    counter.textContent = Math.ceil(current);
+                                    requestAnimationFrame(updateCounter);
+                                } else {
+                                    counter.textContent = target;
+                                }
+                            };
+                            
+                            updateCounter();
+                        });
+                    }
+                }
+            });
+        }, observerOptions);
+
+        // Observe all scroll-animate elements
+        document.querySelectorAll('.scroll-animate').forEach(el => {
+            observer.observe(el);
+        });
+
+        // Header scroll effect
+        const header = document.getElementById('header');
+        window.addEventListener('scroll', () => {
+            if (window.scrollY > 100) {
+                header.classList.add('header-scrolled');
+            } else {
+                header.classList.remove('header-scrolled');
+            }
+        });
+
+        // Form submission
+        function handleSubmit(event) {
+            event.preventDefault();
+            alert('문의가 접수되었습니다. 빠른 시일 내에 연락드리겠습니다.');
+            event.target.reset();
+        }
+
+        // Mobile menu toggle
+        function toggleMobileMenu() {
+            // Implementation for mobile menu
+            console.log('Mobile menu toggle');
+        }
+
+        // Initialize on load
+        window.addEventListener('load', () => {
+            updateSlider();
+            updateProgramSlider();
+        });
+
+        // Handle resize
+        window.addEventListener('resize', () => {
+            updateProgramSlider();
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/gallery/airoum_1_5.html b/gallery/airoum_1_5.html
index f504015..d63d947 100644
--- a/gallery/airoum_1_5.html
+++ b/gallery/airoum_1_5.html
@@ -157,6 +157,13 @@
         ::-webkit-scrollbar-thumb:hover {
             background: var(--pumpkin);
         }
+        html {
+            scroll-behavior: smooth;
+        }
+        /* Set scroll margin on sections to prevent them from being covered by the fixed nav */
+        section[id] {
+            scroll-margin-top: 5rem; /* 80px */
+        }
     </style>
 </head>
 <body class="bg-white">
@@ -170,8 +177,8 @@
                 <div class="flex justify-between items-center h-16 sm:h-20">
                     <!-- Logo -->
                     <div class="flex-shrink-0 flex items-center space-x-4">
-                        <img src="images/logo.png" alt="AIROUM Logo" class="h-10">
-                        <h1 class="text-2xl sm:text-3xl font-bold" style="color: var(--dark-green);">
+                        <img src="images/logo.png" alt="AIROUM Logo" class="h-8 sm:h-10">
+                        <h1 class="text-xl sm:text-3xl font-bold" style="color: var(--dark-green);">
                             AIROUM
                         </h1>
                     </div>
@@ -197,14 +204,11 @@
         </div>
         
         <!-- Mobile Menu -->
-        <div class="md:hidden glass transform -translate-y-full transition-transform duration-300" id="mobile-menu">
+        <div class="md:hidden glass overflow-hidden transition-all duration-300 ease-in-out" id="mobile-menu" style="max-height: 0px;">
             <div class="px-4 py-4 space-y-3">
                 <a href="#about" class="block px-4 py-2 text-gray-700 hover:text-[var(--pumpkin)]">회사소개</a>
                 <a href="#programs" class="block px-4 py-2 text-gray-700 hover:text-[var(--pumpkin)]">교육 프로그램</a>
-                <a href="#contact" class="block px-4 py-2 text-white rounded-full text-center" 
-                   style="background: var(--pumpkin);">
-                    문의·신청
-                </a>
+                <a href="#contact" class="block px-4 py-2 text-gray-700 hover:text-[var(--pumpkin)]">문의·신청</a>
             </div>
         </div>
     </nav>
@@ -224,11 +228,11 @@
         <div class="container mx-auto px-4 sm:px-6 lg:px-8 relative z-10 flex-grow flex flex-col justify-center">
             <!-- Slider Container -->
             <div id="hero-slider-container" class="relative w-full max-w-4xl mx-auto overflow-hidden">
-                <div id="hero-slider" class="flex transition-transform duration-700 ease-in-out">
+                <div id="hero-slider" class="flex items-center transition-transform duration-700 ease-in-out" style="min-height: 40vh;">
                     <!-- Slide 1: Hero Content -->
                     <div class="w-full flex-shrink-0">
                         <div class="text-center">
-                            <h1 class="text-4xl sm:text-5xl lg:text-6xl font-bold mb-6 animate-fade-in-up" style="color: var(--dark-green);">
+                            <h1 class="text-3xl sm:text-5xl lg:text-6xl font-bold mb-6 animate-fade-in-up" style="color: var(--dark-green);">
                                 생성형 AI 시대,<br>
                                 <span class="gradient-text">기술을 넘어 미래를</span><br>
                                 설계하는 사람을 키웁니다.
@@ -260,7 +264,7 @@
             
             <!-- CTA Buttons (Static) -->
             <div class="flex flex-col sm:flex-row gap-4 justify-center mt-8 animate-fade-in-up" style="animation-delay: 0.4s;">
-                <button class="magnetic-btn px-8 py-3 rounded-full text-white font-semibold transition-all" style="background: var(--pumpkin);">
+                <button class="magnetic-btn px-8 py-3 rounded-full text-white font-semibold transition-all hidden sm:block" style="background: var(--pumpkin);">
                     무료 상담 신청
                 </button>
                 <button class="magnetic-btn px-8 py-3 rounded-full font-semibold transition-all" style="border: 2px solid var(--dark-green); color: var(--dark-green);">
@@ -289,7 +293,7 @@
     </section>
     
     <!-- Why AIROUM Section -->
-    <section class="py-20 bg-gray-50" id="about">
+    <section class="py-20 bg-gray-50 scroll-mt-16 sm:scroll-mt-20" id="about">
         <div class="container mx-auto px-4 sm:px-6 lg:px-8">
             <div class="text-center mb-16 animate-on-scroll">
                 <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4" style="color: var(--dark-green);">
@@ -424,7 +428,7 @@
     </section>
     
     <!-- Programs Section -->
-    <section class="py-20" id="programs">
+    <section class="py-20 scroll-mt-16 sm:scroll-mt-20" id="programs">
         <div class="container mx-auto px-4 sm:px-6 lg:px-8">
             <div class="text-center mb-16 animate-on-scroll">
                 <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4" style="color: var(--dark-green);">
@@ -729,7 +733,7 @@
         
         <div class="container mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
             <div class="text-center text-white mb-12">
-                <h2 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-6">
+                <h2 class="text-2xl sm:text-3xl lg:text-4xl font-bold mb-6">
                     생성형 AI는 단순한 유행이 아니라<br>
                     미래 교육의 기본값입니다.
                 </h2>
@@ -754,9 +758,9 @@
             </div>
             
             <!-- Contact Form -->
-            <div class="max-w-2xl mx-auto" id="contact">
+            <div class="max-w-2xl mx-auto scroll-mt-16 sm:scroll-mt-20" id="contact">
                 <div class="bg-white rounded-3xl p-8 sm:p-12 shadow-2xl">
-                    <h3 class="text-2xl sm:text-3xl font-bold text-center mb-8" style="color: var(--dark-green);">
+                    <h3 class="text-xl sm:text-2xl font-bold text-center mb-8" style="color: var(--dark-green);">
                         무료 상담 및 교육 문의
                     </h3>
                     
@@ -807,7 +811,7 @@
                             <path d="M16.273 12.845L7.376 0H0v24h7.726V11.156L16.624 24H24V0h-7.727v12.845z"/>
                         </svg>
                     </a>
-                    <a href="https://instagram.com/aiyi\_choi" class="text-white hover:text-[var(--pumpkin)] transition-colors">
+                    <a href="https://instagram.com/aiyi_choi" class="text-white hover:text-[var(--pumpkin)] transition-colors">
                         <span class="sr-only">Instagram</span>
                         <svg class="w-8 h-8" fill="currentColor" viewBox="0 0 24 24">
                             <path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zM5.838 12a6.162 6.162 0 1112.324 0 6.162 6.162 0 01-12.324 0zM12 16a4 4 0 110-8 4 4 0 010 8zm4.965-10.405a1.44 1.44 0 112.881.001 1.44 1.44 0 01-2.881-.001z"/>
@@ -821,6 +825,14 @@
             </div>
         </div>
     </footer>
+
+    <!-- Mobile Floating CTA -->
+    <div id="mobile-cta" class="md:hidden fixed bottom-0 left-0 right-0 p-4 bg-white/80 backdrop-blur-xl z-40 transition-transform duration-500" style="box-shadow: 0 -2px 10px rgba(0,0,0,0.1);">
+        <a href="#contact" class="w-full block text-center px-6 py-3 rounded-full text-white font-semibold transition-all" 
+           style="background: var(--pumpkin);">
+            무료 상담 및 교육 문의
+        </a>
+    </div>
     
     <!-- Scripts -->
     <script>
@@ -894,23 +906,30 @@
             document.querySelector('.scroll-progress').style.transform = `scaleX(${scrollPercent})`;
         });
         
-        // Navbar Background on Scroll
+        // Navbar Background on Scroll & Mobile Menu management
         const navbar = document.getElementById('navbar');
+        const mobileMenu = document.getElementById('mobile-menu');
+        const mobileMenuBtn = document.getElementById('mobile-menu-btn');
+
         window.addEventListener('scroll', () => {
             if (window.scrollY > 50) {
                 navbar.classList.add('bg-white', 'shadow-lg');
             } else {
                 navbar.classList.remove('bg-white', 'shadow-lg');
             }
+            // Close mobile menu on scroll
+            if (mobileMenu && !mobileMenu.classList.contains('-translate-y-full')) {
+                mobileMenu.classList.add('-translate-y-full');
+            }
         });
         
-        // Mobile Menu Toggle
-        const mobileMenuBtn = document.getElementById('mobile-menu-btn');
-        const mobileMenu = document.getElementById('mobile-menu');
-        
-        mobileMenuBtn.addEventListener('click', () => {
-            mobileMenu.classList.toggle('-translate-y-full');
-        });
+        if (mobileMenuBtn) {
+            mobileMenuBtn.addEventListener('click', () => {
+                if (mobileMenu) {
+                    mobileMenu.classList.toggle('-translate-y-full');
+                }
+            });
+        }
         
         // Smooth Scroll for Anchor Links
         document.querySelectorAll('a[href^="#"]').forEach(anchor => {
@@ -942,6 +961,24 @@
         document.querySelectorAll('.animate-on-scroll').forEach(el => {
             observer.observe(el);
         });
+
+        // Mobile CTA visibility
+        const mobileCta = document.getElementById('mobile-cta');
+        const contactSection = document.getElementById('contact');
+
+        const ctaObserver = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    mobileCta.classList.add('translate-y-full');
+                } else {
+                    mobileCta.classList.remove('translate-y-full');
+                }
+            });
+        }, { threshold: 0.1 });
+
+        if (contactSection) {
+            ctaObserver.observe(contactSection);
+        }
         
         // Parallax Effect
         const parallaxElements = document.querySelectorAll('.parallax-layer');
diff --git a/gallery/airoum_1_6.html b/gallery/airoum_1_6.html
new file mode 100644
index 0000000..c6ea26e
--- /dev/null
+++ b/gallery/airoum_1_6.html
@@ -0,0 +1,846 @@
+<!DOCTYPE html>
+<html lang="ko">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>AIROUM - AI 교육의 새로운 기준</title>
+    
+    <!-- Tailwind CSS -->
+    <script src="https://cdn.tailwindcss.com"></script>
+    
+    <!-- Lucide Icons -->
+    <script src="https://unpkg.com/lucide@latest/dist/umd/lucide.min.js"></script>
+    
+    <style>
+        /* Custom Fonts */
+        @font-face {
+            font-family: 'GmarketSansMedium';
+            src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
+            font-weight: normal;
+            font-style: normal;
+        }
+        
+        @font-face {
+            font-family: 'Pretendard-Regular';
+            src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
+            font-weight: 400;
+            font-style: normal;
+        }
+
+        /* Custom Properties */
+        :root {
+            --pumpkin: #F4762F;
+            --pumpkin-light: #F69258;
+            --pumpkin-dark: #DD580C;
+            --dark-green: #16332D;
+            --dark-green-light: #306F63;
+            --dark-green-darker: #0D1E1B;
+            --slate: #3C5751;
+            --slate-light: #5A8279;
+            --slate-dark: #243431;
+            --silver: #BCC4C2;
+            --white: #FEFEFE;
+            --black: #111827;
+            --gray-dark: #374151;
+            --gray: #6B7280;
+            --gray-light: #9CA3AF;
+        }
+
+        /* Base Styles */
+        body {
+            font-family: 'Pretendard-Regular', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
+            color: var(--gray-dark) !important;
+            background-color: var(--white) !important;
+        }
+
+        h1, h2, h3, h4, h5, h6 {
+            font-family: 'GmarketSansMedium', sans-serif !important;
+            color: var(--dark-green) !important;
+            line-height: 1.2 !important;
+        }
+
+        /* Custom Animations */
+        @keyframes fadeInUp {
+            from {
+                opacity: 0;
+                transform: translateY(30px);
+            }
+            to {
+                opacity: 1;
+                transform: translateY(0);
+            }
+        }
+
+        @keyframes slideInLeft {
+            from {
+                opacity: 0;
+                transform: translateX(-30px);
+            }
+            to {
+                opacity: 1;
+                transform: translateX(0);
+            }
+        }
+
+        @keyframes float {
+            0%, 100% {
+                transform: translateY(0);
+            }
+            50% {
+                transform: translateY(-10px);
+            }
+        }
+
+        @keyframes pulse {
+            0%, 100% {
+                opacity: 1;
+            }
+            50% {
+                opacity: 0.5;
+            }
+        }
+
+        .animate-fadeInUp {
+            animation: fadeInUp 0.8s ease-out forwards;
+            opacity: 0;
+        }
+
+        .animate-slideInLeft {
+            animation: slideInLeft 0.6s ease-out forwards;
+            opacity: 0;
+        }
+
+        .animate-float {
+            animation: float 3s ease-in-out infinite;
+        }
+
+        .animate-pulse-slow {
+            animation: pulse 2s ease-in-out infinite;
+        }
+
+        /* Gradient Backgrounds */
+        .gradient-light {
+            background: linear-gradient(180deg, #FFFFFF 0%, #FAFBFB 100%);
+        }
+
+        .gradient-dark {
+            background: linear-gradient(135deg, var(--dark-green) 0%, var(--dark-green-light) 100%);
+        }
+
+        /* Button Styles */
+        .btn-primary {
+            background-color: var(--pumpkin) !important;
+            color: var(--white) !important;
+            padding: 1rem 2rem !important;
+            border-radius: 9999px !important;
+            font-weight: 500 !important;
+            transition: all 0.3s ease-out !important;
+            box-shadow: 0 4px 14px rgba(244, 118, 47, 0.25) !important;
+        }
+
+        .btn-primary:hover {
+            background-color: var(--pumpkin-dark) !important;
+            transform: translateY(-2px) !important;
+            box-shadow: 0 6px 20px rgba(244, 118, 47, 0.35) !important;
+        }
+
+        .btn-secondary {
+            background-color: transparent !important;
+            color: var(--dark-green) !important;
+            padding: 1rem 2rem !important;
+            border: 2px solid var(--silver) !important;
+            border-radius: 9999px !important;
+            font-weight: 500 !important;
+            transition: all 0.3s ease-out !important;
+        }
+
+        .btn-secondary:hover {
+            background-color: var(--dark-green-light) !important;
+            color: var(--white) !important;
+            border-color: var(--dark-green-light) !important;
+        }
+
+        /* Card Styles */
+        .card-elegant {
+            background: white;
+            border-radius: 1.5rem;
+            padding: 2rem;
+            transition: all 0.3s ease-out;
+            box-shadow: 0 4px 6px -1px rgba(22, 51, 45, 0.08),
+                        0 2px 4px -1px rgba(22, 51, 45, 0.04);
+        }
+
+        .card-elegant:hover {
+            transform: translateY(-4px);
+            box-shadow: 0 20px 25px -5px rgba(22, 51, 45, 0.10),
+                        0 10px 10px -5px rgba(22, 51, 45, 0.04);
+        }
+
+        /* Input Styles */
+        .input-elegant {
+            width: 100%;
+            padding: 1rem 1.5rem;
+            background-color: white;
+            border: 2px solid var(--silver);
+            border-radius: 1rem;
+            color: var(--gray-dark);
+            transition: all 0.2s ease-out;
+            box-shadow: inset 0 2px 4px rgba(22, 51, 45, 0.04);
+        }
+
+        .input-elegant:focus {
+            border-color: var(--dark-green-light);
+            outline: none;
+            box-shadow: inset 0 2px 4px rgba(22, 51, 45, 0.04),
+                        0 0 0 4px rgba(48, 111, 99, 0.1);
+        }
+
+        /* Slider Styles */
+        .slider-container {
+            position: relative;
+            overflow: hidden;
+        }
+
+        .slider-track {
+            display: flex;
+            transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+        }
+
+        .slider-button {
+            position: absolute;
+            top: 50%;
+            transform: translateY(-50%);
+            background: white;
+            border-radius: 50%;
+            width: 48px;
+            height: 48px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+            cursor: pointer;
+            transition: all 0.3s ease;
+            z-index: 10;
+        }
+
+        .slider-button:hover {
+            transform: translateY(-50%) scale(1.1);
+            box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
+        }
+
+        /* Scroll Animations */
+        .scroll-animate {
+            opacity: 0;
+            transform: translateY(30px);
+            transition: all 0.8s ease-out;
+        }
+
+        .scroll-animate.active {
+            opacity: 1;
+            transform: translateY(0);
+        }
+
+        /* Header Scroll Effect */
+        .header-scrolled {
+            background-color: rgba(254, 254, 254, 0.95) !important;
+            backdrop-filter: blur(10px) !important;
+            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
+        }
+    </style>
+</head>
+<body>
+    <!-- Header -->
+    <header id="header" class="fixed top-0 left-0 right-0 z-50 transition-all duration-300">
+        <nav class="container mx-auto px-6 py-6">
+            <div class="flex items-center justify-between">
+                <!-- Logo -->
+                <div class="flex items-center">
+                    <h1 class="text-2xl font-bold" style="color: var(--pumpkin)">AIROUM</h1>
+                </div>
+                
+                <!-- Navigation -->
+                <div class="hidden md:flex items-center space-x-8">
+                    <a href="#about" class="text-gray-700 hover:text-pumpkin transition">회사소개</a>
+                    <a href="#programs" class="text-gray-700 hover:text-pumpkin transition">교육 프로그램</a>
+                    <a href="#contact" class="btn-primary">문의·신청</a>
+                </div>
+                
+                <!-- Mobile Menu Button -->
+                <button class="md:hidden" onclick="toggleMobileMenu()">
+                    <i data-lucide="menu" class="w-6 h-6"></i>
+                </button>
+            </div>
+        </nav>
+    </header>
+
+    <!-- Main Content -->
+    <main>
+        <!-- Hero Section with Slider -->
+        <section class="pt-24 pb-16 px-6">
+            <div class="container mx-auto max-w-6xl">
+                <div class="relative overflow-hidden rounded-3xl gradient-light" style="min-height: 500px;">
+                    <div class="slider-container">
+                        <div class="slider-track" id="heroSlider">
+                            <!-- Slide 1: Hero -->
+                            <div class="w-full flex-shrink-0 p-12 md:p-20 animate-fadeInUp">
+                                <div class="max-w-3xl">
+                                    <h2 class="text-4xl md:text-6xl mb-6 leading-tight">
+                                        생성형 AI 시대,<br>
+                                        기술을 넘어 미래를 설계하는<br>
+                                        <span style="color: var(--pumpkin)">사람을 키웁니다</span>
+                                    </h2>
+                                    <div class="w-20 h-1 mb-6 rounded-full" style="background-color: var(--pumpkin)"></div>
+                                    <p class="text-lg md:text-xl mb-8 text-gray-600 leading-relaxed">
+                                        에이로움은 'AI(인공지능)'와 '새로움'의 가치를 융합한 AI 교육 전문 연구소입니다.<br>
+                                        AI 개발자와 교육 전문가가 함께 만든 현장 중심 교육으로<br>
+                                        당신의 성장을 돕는 든든한 동반자가 되겠습니다.
+                                    </p>
+                                    <div class="flex flex-wrap gap-4">
+                                        <button class="btn-primary">무료 상담 신청</button>
+                                        <button class="btn-secondary">프로그램 보기</button>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <!-- Slide 2: CEO Introduction -->
+                            <div class="w-full flex-shrink-0 p-12 md:p-20">
+                                <div class="flex flex-col md:flex-row items-center gap-8">
+                                    <div class="w-48 h-48 rounded-full overflow-hidden shadow-xl">
+                                        <img src="https://images.unsplash.com/photo-1594744803329-e58b31de8bf5?w=400&h=400&fit=crop" 
+                                             alt="최아영 대표" class="w-full h-full object-cover">
+                                    </div>
+                                    <div class="flex-1 text-center md:text-left">
+                                        <h3 class="text-3xl mb-2">최아영 대표</h3>
+                                        <p class="text-xl mb-4" style="color: var(--dark-green-light)">AI 교육 기획 전문가</p>
+                                        <blockquote class="text-2xl mb-6 italic" style="color: var(--pumpkin)">
+                                            "AI로 아이들의 상상력에 날개를 달아줍니다"
+                                        </blockquote>
+                                        <p class="text-gray-600 leading-relaxed">
+                                            10년 이상의 교육 기획 경험과 AI 기술 전문성을 바탕으로<br>
+                                            실질적이고 혁신적인 AI 교육 프로그램을 개발하고 있습니다.
+                                        </p>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        
+                        <!-- Slider Controls -->
+                        <button class="slider-button left-4" onclick="previousSlide()">
+                            <i data-lucide="chevron-left" class="w-6 h-6"></i>
+                        </button>
+                        <button class="slider-button right-4" onclick="nextSlide()">
+                            <i data-lucide="chevron-right" class="w-6 h-6"></i>
+                        </button>
+                        
+                        <!-- Slider Indicators -->
+                        <div class="absolute bottom-6 left-1/2 transform -translate-x-1/2 flex gap-2">
+                            <button class="w-2 h-2 rounded-full bg-pumpkin transition-all duration-300" id="indicator-0"></button>
+                            <button class="w-2 h-2 rounded-full bg-gray-300 transition-all duration-300" id="indicator-1"></button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Why AIROUM Section -->
+        <section id="about" class="py-20 scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">왜 에이로움인가?</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+                    <!-- Value Card 1 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.1s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(244, 118, 47, 0.1)">
+                            <i data-lucide="zap" class="w-8 h-8" style="color: var(--pumpkin)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">실천형 교육</h3>
+                        <p class="text-lg mb-3" style="color: var(--pumpkin)">"배우고 바로 쓴다"</p>
+                        <p class="text-gray-600">이론 중심 교육을 넘어, 수업, 연수, 실무에 바로 적용할 수 있는 현장 밀착형 교육을 제공합니다.</p>
+                    </div>
+
+                    <!-- Value Card 2 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.2s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(48, 111, 99, 0.1)">
+                            <i data-lucide="map-pin" class="w-8 h-8" style="color: var(--dark-green-light)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">열린 교육</h3>
+                        <p class="text-lg mb-3" style="color: var(--dark-green-light)">"지역 격차 없는 기회"</p>
+                        <p class="text-gray-600">서울, 수도권에 집중된 교육 기회를 넘어, 지역 거점 센터를 통해 전국 어디서나 고품질 교육을 제공합니다.</p>
+                    </div>
+
+                    <!-- Value Card 3 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.3s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(244, 118, 47, 0.1)">
+                            <i data-lucide="share-2" class="w-8 h-8" style="color: var(--pumpkin)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">융합형 교육</h3>
+                        <p class="text-lg mb-3" style="color: var(--pumpkin)">"경계를 허무는 연결"</p>
+                        <p class="text-gray-600">진로 설계, 교과 프로젝트, 업무 실무까지 생성형 AI와 자연스럽게 연결하여 유기적으로 엮은 융합 교육을 운영합니다.</p>
+                    </div>
+
+                    <!-- Value Card 4 -->
+                    <div class="card-elegant text-center scroll-animate" style="animation-delay: 0.4s">
+                        <div class="w-16 h-16 mx-auto mb-4 rounded-full flex items-center justify-center" 
+                             style="background-color: rgba(48, 111, 99, 0.1)">
+                            <i data-lucide="award" class="w-8 h-8" style="color: var(--dark-green-light)"></i>
+                        </div>
+                        <h3 class="text-xl mb-2">검증된 전문성</h3>
+                        <p class="text-lg mb-3" style="color: var(--dark-green-light)">"전문가들의 협업"</p>
+                        <p class="text-gray-600">AI 개발자와 교육 전문가가 협업하여 제작한 신뢰도 높은 커리큘럼과 현장에서 다듬어진 전문 강사진이 직접 수업합니다.</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Programs Section -->
+        <section id="programs" class="py-20 gradient-light scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">교육 프로그램</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <!-- Program Slider -->
+                <div class="relative">
+                    <div class="slider-container overflow-hidden">
+                        <div class="slider-track flex gap-6" id="programSlider">
+                            <!-- Program Card 1 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1522202176988-66273c2fd55f?w=400&h=300&fit=crop" 
+                                             alt="AI 진로·직업 프로젝트" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(244, 118, 47, 0.1); color: var(--pumpkin)">학생</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 진로·직업 프로젝트</h3>
+                                    <p class="text-gray-600 mb-4">생성형 AI로 흥미와 강점을 탐색하고 진로를 설계하는 수업</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 2 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1509062522246-3755977927d7?w=400&h=300&fit=crop" 
+                                             alt="AI 교과 연계 프로젝트" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(244, 118, 47, 0.1); color: var(--pumpkin)">학생</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 교과 연계 프로젝트</h3>
+                                    <p class="text-gray-600 mb-4">국어·사회·과학 등 교과 주제와 생성형 AI를 융합한 프로젝트 수업</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 3 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1531482615713-2afd69097998?w=400&h=300&fit=crop" 
+                                             alt="AI 윤리 교육" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">모두</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 윤리 교육</h3>
+                                    <p class="text-gray-600 mb-4">AI 시대에 필요한 디지털 윤리와 책임감을 배우는 시민 교육</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 4 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1517245386807-bb43f82c33c4?w=400&h=300&fit=crop" 
+                                             alt="생성형 AI 실무 활용" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">교사·기업</span>
+                                    <h3 class="text-xl mt-3 mb-2">생성형 AI 실무 활용</h3>
+                                    <p class="text-gray-600 mb-4">텍스트·이미지·영상 등 생성형 AI 도구를 실습하는 실무 중심 교육</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 5 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1524178232363-1fb2b075b655?w=400&h=300&fit=crop" 
+                                             alt="교사·공무원 연수" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">교사·공무원</span>
+                                    <h3 class="text-xl mt-3 mb-2">교사·공무원 연수</h3>
+                                    <p class="text-gray-600 mb-4">현장 적용 중심의 워크숍형 AI 연수 프로그램</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 6 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1559526324-4b87b5e36e44?w=400&h=300&fit=crop" 
+                                             alt="AI 금융 활용 교육" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(244, 118, 47, 0.1); color: var(--pumpkin)">학생·일반인</span>
+                                    <h3 class="text-xl mt-3 mb-2">AI 금융 활용 교육</h3>
+                                    <p class="text-gray-600 mb-4">생성형 AI로 금융 정보를 탐색하고 자산을 관리하는 실습 교육</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+
+                            <!-- Program Card 7 -->
+                            <div class="w-full md:w-1/2 lg:w-1/3 flex-shrink-0">
+                                <div class="card-elegant h-full">
+                                    <div class="h-48 rounded-lg overflow-hidden mb-4">
+                                        <img src="https://images.unsplash.com/photo-1573166364524-d9dbfd8bbf83?w=400&h=300&fit=crop" 
+                                             alt="생성형 AI 강사 양성" class="w-full h-full object-cover">
+                                    </div>
+                                    <span class="text-sm font-medium px-3 py-1 rounded-full" 
+                                          style="background-color: rgba(48, 111, 99, 0.1); color: var(--dark-green-light)">강사</span>
+                                    <h3 class="text-xl mt-3 mb-2">생성형 AI 강사 양성</h3>
+                                    <p class="text-gray-600 mb-4">생성형 AI 교육 전문가로 성장하기 위한 실전 중심 양성 과정</p>
+                                    <button class="text-pumpkin font-medium hover:underline">자세히보기 →</button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    
+                    <!-- Program Slider Controls -->
+                    <button class="slider-button -left-6" onclick="programSliderPrev()">
+                        <i data-lucide="chevron-left" class="w-6 h-6"></i>
+                    </button>
+                    <button class="slider-button -right-6" onclick="programSliderNext()">
+                        <i data-lucide="chevron-right" class="w-6 h-6"></i>
+                    </button>
+                </div>
+            </div>
+        </section>
+
+        <!-- Target Audience Section -->
+        <section class="py-20 scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">이런 분들께 필요합니다</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
+                    <div class="text-center scroll-animate" style="animation-delay: 0.1s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="book-open" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">AI 교육이 막막한 교사</h3>
+                        <p class="text-pumpkin font-medium mb-2">"수업에 바로 쓸 수 있는 실전 콘텐츠"</p>
+                        <p class="text-gray-600">를 제공합니다.</p>
+                    </div>
+                    
+                    <div class="text-center scroll-animate" style="animation-delay: 0.2s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="map" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">지역에서도 수준 높은 교육을 만들고 싶은 기획자</h3>
+                        <p class="text-pumpkin font-medium mb-2">"지역 거점 운영 모델과 검증된 커리큘럼"</p>
+                        <p class="text-gray-600">이 준비돼 있습니다.</p>
+                    </div>
+                    
+                    <div class="text-center scroll-animate" style="animation-delay: 0.3s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="presentation" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">AI 강사가 되고 싶은 분</h3>
+                        <p class="text-pumpkin font-medium mb-2">"실전형 양성과정"</p>
+                        <p class="text-gray-600">을 제공합니다.</p>
+                    </div>
+                    
+                    <div class="text-center scroll-animate" style="animation-delay: 0.4s">
+                        <div class="w-24 h-24 mx-auto mb-4 rounded-full flex items-center justify-center gradient-light">
+                            <i data-lucide="sparkles" class="w-12 h-12" style="color: var(--dark-green)"></i>
+                        </div>
+                        <h3 class="text-lg font-semibold mb-2">AI 시대를 살아갈 학생들</h3>
+                        <p class="text-pumpkin font-medium mb-2">"진로 설계와 아이디어 실현 기회"</p>
+                        <p class="text-gray-600">를 제공합니다.</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Track Record Section -->
+        <section class="py-20 gradient-light scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center mb-16">
+                    <h2 class="text-3xl md:text-4xl mb-4">교육 실적</h2>
+                    <div class="w-20 h-1 mx-auto rounded-full" style="background-color: var(--pumpkin)"></div>
+                </div>
+                
+                <!-- Partner Logos -->
+                <div class="flex flex-wrap justify-center items-center gap-8 mb-12">
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow"></div>
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow" style="animation-delay: 0.2s"></div>
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow" style="animation-delay: 0.4s"></div>
+                    <div class="w-32 h-16 bg-gray-200 rounded-lg animate-pulse-slow" style="animation-delay: 0.6s"></div>
+                </div>
+                
+                <!-- Statistics -->
+                <div class="grid md:grid-cols-3 gap-8 text-center">
+                    <div class="scroll-animate" style="animation-delay: 0.1s">
+                        <h3 class="text-5xl font-bold mb-2" style="color: var(--pumpkin)">
+                            <span class="counter" data-target="1000">0</span>+
+                        </h3>
+                        <p class="text-xl text-gray-700">수강생</p>
+                    </div>
+                    <div class="scroll-animate" style="animation-delay: 0.2s">
+                        <h3 class="text-5xl font-bold mb-2" style="color: var(--dark-green-light)">
+                            <span class="counter" data-target="50">0</span>+
+                        </h3>
+                        <p class="text-xl text-gray-700">협력기관</p>
+                    </div>
+                    <div class="scroll-animate" style="animation-delay: 0.3s">
+                        <h3 class="text-5xl font-bold mb-2" style="color: var(--pumpkin)">
+                            <span class="counter" data-target="98">0</span>%
+                        </h3>
+                        <p class="text-xl text-gray-700">만족도</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Closing Message -->
+        <section class="py-20 scroll-animate">
+            <div class="container mx-auto px-6 max-w-6xl">
+                <div class="text-center max-w-3xl mx-auto">
+                    <h2 class="text-2xl md:text-3xl mb-6">마무리</h2>
+                    <div class="w-20 h-1 mx-auto mb-8 rounded-full" style="background-color: var(--pumpkin)"></div>
+                    <p class="text-xl mb-6 leading-relaxed text-gray-700">
+                        생성형 AI는 단순한 유행이 아니라<br>
+                        <span class="font-semibold" style="color: var(--dark-green)">미래 교육의 기본값입니다.</span>
+                    </p>
+                    <p class="text-lg mb-8 text-gray-600">
+                        에이로움이 그 시작이 되어드리겠습니다.
+                    </p>
+                    <div class="text-left max-w-md mx-auto">
+                        <p class="flex items-center mb-2">
+                            <i data-lucide="check" class="w-5 h-5 mr-2" style="color: var(--pumpkin)"></i>
+                            교육에 변화를 주고 싶다면
+                        </p>
+                        <p class="flex items-center">
+                            <i data-lucide="check" class="w-5 h-5 mr-2" style="color: var(--pumpkin)"></i>
+                            더 실천적인 AI 교육을 찾고 있다면
+                        </p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <!-- Contact Section -->
+        <section id="contact" class="py-20 gradient-light scroll-animate">
+            <div class="container mx-auto px-6 max-w-2xl">
+                <div class="text-center mb-12">
+                    <h2 class="text-3xl md:text-4xl mb-4">궁금한 점이 있다면, 지금 바로 문의하세요</h2>
+                </div>
+                
+                <form class="card-elegant" onsubmit="handleSubmit(event)">
+                    <div class="space-y-6">
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">이름</label>
+                            <input type="text" class="input-elegant" placeholder="성함을 입력해주세요" required>
+                        </div>
+                        
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">연락처</label>
+                            <input type="tel" class="input-elegant" placeholder="010-0000-0000" required>
+                        </div>
+                        
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">이메일</label>
+                            <input type="email" class="input-elegant" placeholder="email@example.com" required>
+                        </div>
+                        
+                        <div>
+                            <label class="block text-sm font-medium mb-2" style="color: var(--dark-green)">문의내용</label>
+                            <textarea rows="4" class="input-elegant" placeholder="문의하실 내용을 자유롭게 작성해주세요" required></textarea>
+                        </div>
+                        
+                        <button type="submit" class="btn-primary w-full">
+                            문의하기
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </section>
+    </main>
+
+    <!-- Footer -->
+    <footer class="py-12 bg-gray-50">
+        <div class="container mx-auto px-6 text-center">
+            <h3 class="text-xl font-bold mb-4" style="color: var(--dark-green)">에이로움 교육연구소</h3>
+            <p class="text-gray-600 mb-2">대표: 최아영 | 연락처: 010-5095-8821</p>
+            <p class="text-gray-600 mb-6">서울특별시 송파구 오금로 11길 55, 214-88호</p>
+            <div class="flex justify-center gap-4">
+                <a href="#" class="text-gray-600 hover:text-pumpkin transition">
+                    <span class="flex items-center gap-2">
+                        <i data-lucide="pen-square" class="w-5 h-5"></i>
+                        Blog
+                    </span>
+                </a>
+                <a href="#" class="text-gray-600 hover:text-pumpkin transition">
+                    <span class="flex items-center gap-2">
+                        <i data-lucide="instagram" class="w-5 h-5"></i>
+                        Instagram
+                    </span>
+                </a>
+            </div>
+        </div>
+    </footer>
+
+    <script>
+        // Initialize Lucide icons
+        lucide.createIcons();
+
+        // Hero Slider
+        let currentSlide = 0;
+        const heroSlider = document.getElementById('heroSlider');
+        const totalSlides = 2;
+
+        function updateSlider() {
+            heroSlider.style.transform = `translateX(-${currentSlide * 100}%)`;
+            
+            // Update indicators
+            for (let i = 0; i < totalSlides; i++) {
+                const indicator = document.getElementById(`indicator-${i}`);
+                if (i === currentSlide) {
+                    indicator.classList.add('bg-pumpkin', 'w-8');
+                    indicator.classList.remove('bg-gray-300', 'w-2');
+                } else {
+                    indicator.classList.remove('bg-pumpkin', 'w-8');
+                    indicator.classList.add('bg-gray-300', 'w-2');
+                }
+            }
+        }
+
+        function nextSlide() {
+            currentSlide = (currentSlide + 1) % totalSlides;
+            updateSlider();
+        }
+
+        function previousSlide() {
+            currentSlide = (currentSlide - 1 + totalSlides) % totalSlides;
+            updateSlider();
+        }
+
+        // Auto-slide every 5 seconds
+        setInterval(nextSlide, 5000);
+
+        // Program Slider
+        let programSlideIndex = 0;
+        const programSlider = document.getElementById('programSlider');
+        const programCards = programSlider.children.length;
+        const cardsPerView = window.innerWidth >= 1024 ? 3 : window.innerWidth >= 768 ? 2 : 1;
+
+        function programSliderNext() {
+            if (programSlideIndex < programCards - cardsPerView) {
+                programSlideIndex++;
+                updateProgramSlider();
+            }
+        }
+
+        function programSliderPrev() {
+            if (programSlideIndex > 0) {
+                programSlideIndex--;
+                updateProgramSlider();
+            }
+        }
+
+        function updateProgramSlider() {
+            const slideWidth = 100 / cardsPerView;
+            programSlider.style.transform = `translateX(-${programSlideIndex * slideWidth}%)`;
+        }
+
+        // Scroll Animations
+        const observerOptions = {
+            threshold: 0.1,
+            rootMargin: '0px 0px -100px 0px'
+        };
+
+        const observer = new IntersectionObserver((entries) => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.classList.add('active');
+                    
+                    // Counter animation for statistics
+                    if (entry.target.querySelector('.counter')) {
+                        const counters = entry.target.querySelectorAll('.counter');
+                        counters.forEach(counter => {
+                            const target = parseInt(counter.dataset.target);
+                            const increment = target / 100;
+                            let current = 0;
+                            
+                            const updateCounter = () => {
+                                current += increment;
+                                if (current < target) {
+                                    counter.textContent = Math.ceil(current);
+                                    requestAnimationFrame(updateCounter);
+                                } else {
+                                    counter.textContent = target;
+                                }
+                            };
+                            
+                            updateCounter();
+                        });
+                    }
+                }
+            });
+        }, observerOptions);
+
+        // Observe all scroll-animate elements
+        document.querySelectorAll('.scroll-animate').forEach(el => {
+            observer.observe(el);
+        });
+
+        // Header scroll effect
+        const header = document.getElementById('header');
+        window.addEventListener('scroll', () => {
+            if (window.scrollY > 100) {
+                header.classList.add('header-scrolled');
+            } else {
+                header.classList.remove('header-scrolled');
+            }
+        });
+
+        // Form submission
+        function handleSubmit(event) {
+            event.preventDefault();
+            alert('문의가 접수되었습니다. 빠른 시일 내에 연락드리겠습니다.');
+            event.target.reset();
+        }
+
+        // Mobile menu toggle
+        function toggleMobileMenu() {
+            // Implementation for mobile menu
+            console.log('Mobile menu toggle');
+        }
+
+        // Initialize on load
+        window.addEventListener('load', () => {
+            updateSlider();
+            updateProgramSlider();
+        });
+
+        // Handle resize
+        window.addEventListener('resize', () => {
+            updateProgramSlider();
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
