MCDI \uc815\uc218 \uc2dc\uc2a4\ud15c \uc138\ubbf8\ub098 \ucd08\uccad<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, sans-serif;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n color: #333;\r\n line-height: 1.6;\r\n }\r\n\r\n .container {\r\n max-width: 500px;\r\n margin: 0 auto;\r\n background: white;\r\n min-height: 100vh;\r\n }\r\n\r\n \/* \ud5e4\ub354 *\/\r\n .header {\r\n background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);\r\n color: white;\r\n padding: 30px 20px;\r\n text-align: center;\r\n }\r\n\r\n .badge {\r\n display: inline-block;\r\n background: rgba(255,255,255,0.2);\r\n padding: 5px 15px;\r\n border-radius: 20px;\r\n font-size: 12px;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .header h1 {\r\n font-size: 24px;\r\n font-weight: bold;\r\n margin: 10px 0;\r\n line-height: 1.3;\r\n }\r\n\r\n .header .subtitle {\r\n font-size: 14px;\r\n opacity: 0.9;\r\n margin-top: 5px;\r\n }\r\n\r\n \/* \ud0c0\uc774\uba38 *\/\r\n .timer-section {\r\n background: linear-gradient(to right, #f093fb 0%, #f5576c 100%);\r\n color: white;\r\n padding: 20px;\r\n text-align: center;\r\n }\r\n\r\n .timer-title {\r\n font-size: 14px;\r\n margin-bottom: 10px;\r\n opacity: 0.95;\r\n }\r\n\r\n .timer {\r\n display: flex;\r\n justify-content: center;\r\n gap: 10px;\r\n }\r\n\r\n .timer-box {\r\n background: rgba(255,255,255,0.2);\r\n border-radius: 10px;\r\n padding: 10px 15px;\r\n min-width: 60px;\r\n }\r\n\r\n .timer-box .number {\r\n font-size: 28px;\r\n font-weight: bold;\r\n display: block;\r\n }\r\n\r\n .timer-box .label {\r\n font-size: 11px;\r\n opacity: 0.9;\r\n }\r\n\r\n \/* \uce74\uc6b4\ud130 *\/\r\n .counter-section {\r\n background: #ff6b6b;\r\n color: white;\r\n padding: 15px 20px;\r\n text-align: center;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n }\r\n\r\n .counter-info {\r\n font-size: 14px;\r\n }\r\n\r\n .counter-number {\r\n font-size: 24px;\r\n font-weight: bold;\r\n }\r\n\r\n \/* \uc774\ubca4\ud2b8 \uc815\ubcf4 *\/\r\n .event-info {\r\n padding: 30px 20px;\r\n background: #f8f9fa;\r\n }\r\n\r\n .info-card {\r\n background: white;\r\n border-radius: 15px;\r\n padding: 20px;\r\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\r\n margin-bottom: 20px;\r\n }\r\n\r\n .info-item {\r\n display: flex;\r\n align-items: center;\r\n margin: 15px 0;\r\n padding: 10px;\r\n background: #f8f9fa;\r\n border-radius: 10px;\r\n }\r\n\r\n .info-icon {\r\n width: 40px;\r\n height: 40px;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: white;\r\n font-size: 18px;\r\n margin-right: 15px;\r\n flex-shrink: 0;\r\n }\r\n\r\n .info-content h3 {\r\n font-size: 13px;\r\n color: #666;\r\n margin-bottom: 3px;\r\n }\r\n\r\n .info-content p {\r\n font-size: 15px;\r\n font-weight: 600;\r\n color: #333;\r\n }\r\n\r\n \/* \uc2ac\ub77c\uc774\ub4dc *\/\r\n .slider-section {\r\n padding: 20px;\r\n background: white;\r\n }\r\n\r\n .section-title {\r\n font-size: 20px;\r\n font-weight: bold;\r\n margin-bottom: 15px;\r\n text-align: center;\r\n color: #333;\r\n }\r\n\r\n .slider {\r\n position: relative;\r\n width: 100%;\r\n height: 250px;\r\n overflow: hidden;\r\n border-radius: 15px;\r\n box-shadow: 0 4px 15px rgba(0,0,0,0.1);\r\n }\r\n\r\n .slide {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0;\r\n transition: opacity 0.5s ease-in-out;\r\n }\r\n\r\n .slide.active {\r\n opacity: 1;\r\n }\r\n\r\n .slide img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n .slider-dots {\r\n text-align: center;\r\n margin-top: 15px;\r\n }\r\n\r\n .dot {\r\n display: inline-block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n background: #ddd;\r\n margin: 0 5px;\r\n cursor: pointer;\r\n transition: all 0.3s;\r\n }\r\n\r\n .dot.active {\r\n background: #667eea;\r\n width: 25px;\r\n border-radius: 5px;\r\n }\r\n\r\n \/* \ube44\ub514\uc624 *\/\r\n .video-section {\r\n padding: 30px 20px;\r\n background: #f8f9fa;\r\n }\r\n\r\n .video-wrapper {\r\n position: relative;\r\n padding-bottom: 56.25%;\r\n height: 0;\r\n overflow: hidden;\r\n border-radius: 15px;\r\n box-shadow: 0 4px 15px rgba(0,0,0,0.1);\r\n }\r\n\r\n .video-wrapper iframe {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n \/* \ub4f1\ub85d \ud3fc *\/\r\n .form-section {\r\n padding: 30px 20px;\r\n background: white;\r\n }\r\n\r\n .form-group {\r\n margin-bottom: 20px;\r\n }\r\n\r\n .form-group label {\r\n display: block;\r\n font-size: 14px;\r\n font-weight: 600;\r\n margin-bottom: 8px;\r\n color: #333;\r\n }\r\n\r\n .form-group input {\r\n width: 100%;\r\n padding: 15px;\r\n border: 2px solid #e0e0e0;\r\n border-radius: 10px;\r\n font-size: 15px;\r\n transition: all 0.3s;\r\n }\r\n\r\n .form-group input:focus {\r\n outline: none;\r\n border-color: #667eea;\r\n box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);\r\n }\r\n\r\n .submit-btn {\r\n width: 100%;\r\n padding: 18px;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n color: white;\r\n border: none;\r\n border-radius: 12px;\r\n font-size: 18px;\r\n font-weight: bold;\r\n cursor: pointer;\r\n transition: transform 0.2s;\r\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\r\n }\r\n\r\n .submit-btn:hover {\r\n transform: translateY(-2px);\r\n }\r\n\r\n .submit-btn:active {\r\n transform: translateY(0);\r\n }\r\n\r\n .submit-btn:disabled {\r\n background: #ccc;\r\n cursor: not-allowed;\r\n transform: none;\r\n }\r\n\r\n \/* \ubaa8\ub2ec *\/\r\n .modal {\r\n display: none;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0,0,0,0.7);\r\n z-index: 1000;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .modal.show {\r\n display: flex;\r\n }\r\n\r\n .modal-content {\r\n background: white;\r\n padding: 30px;\r\n border-radius: 20px;\r\n text-align: center;\r\n max-width: 90%;\r\n animation: modalSlideIn 0.3s ease-out;\r\n }\r\n\r\n @keyframes modalSlideIn {\r\n from {\r\n transform: translateY(-50px);\r\n opacity: 0;\r\n }\r\n to {\r\n transform: translateY(0);\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .modal-icon {\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 50%;\r\n margin: 0 auto 20px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 30px;\r\n }\r\n\r\n .modal-icon.success {\r\n background: #d4edda;\r\n color: #28a745;\r\n }\r\n\r\n .modal-icon.error {\r\n background: #f8d7da;\r\n color: #dc3545;\r\n }\r\n\r\n .modal h2 {\r\n font-size: 22px;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .modal p {\r\n color: #666;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .modal-btn {\r\n padding: 12px 30px;\r\n background: #667eea;\r\n color: white;\r\n border: none;\r\n border-radius: 8px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n }\r\n\r\n \/* \ud2b9\uc9d5 \uc139\uc158 *\/\r\n .features {\r\n padding: 30px 20px;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n color: white;\r\n }\r\n\r\n .feature-item {\r\n background: rgba(255,255,255,0.1);\r\n border-radius: 15px;\r\n padding: 20px;\r\n margin-bottom: 15px;\r\n backdrop-filter: blur(10px);\r\n }\r\n\r\n .feature-item h3 {\r\n font-size: 16px;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .feature-item p {\r\n font-size: 14px;\r\n opacity: 0.9;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"container\">\r\n \r\n <div class=\"header\">\r\n <div class=\"badge\">Proyek Dukungan Teknologi Pemerintah Korea<\/div>\r\n <h1>MCDI Membuka Masa Depan<br>Seminar sistem pemurnian air<\/h1>\r\n <p class=\"subtitle\">Sistem pemurnian air 100 ton per hari | Instalasi percontohan di Lao Cai<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"timer-section\">\r\n <div class=\"timer-title\">\u23f0 Waktu tersisa hingga acara<\/div>\r\n <div class=\"timer\">\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"days\">00<\/span>\r\n <span class=\"label\">Hari<\/span>\r\n <\/div>\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"hours\">00<\/span>\r\n <span class=\"label\">jam<\/span>\r\n <\/div>\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"minutes\">00<\/span>\r\n <span class=\"label\">menit<\/span>\r\n <\/div>\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"seconds\">00<\/span>\r\n <span class=\"label\">lilin<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"counter-section\">\r\n <div class=\"counter-info\">\r\n <div>\ud83d\udd25 Terbatas untuk 50 orang pertama<\/div>\r\n <\/div>\r\n <div class=\"counter-info\">\r\n <div>sisa: <span class=\"counter-number\" id=\"remaining\">50<\/span>jumlah orang<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"event-info\">\r\n <div class=\"info-card\">\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83d\udcc5<\/div>\r\n <div class=\"info-content\">\r\n <h3>Jadwal acara<\/h3>\r\n <p>Senin, 3 November 2025<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83d\udd50<\/div>\r\n <div class=\"info-content\">\r\n <h3>Waktu acara<\/h3>\r\n <p>Jam 5 sore - 8 malam<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83d\udccd<\/div>\r\n <div class=\"info-content\">\r\n <h3>Tempat acara<\/h3>\r\n <p>Lao Cai (Vietnam)<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83c\udf81<\/div>\r\n <div class=\"info-content\">\r\n <h3>Detail acara<\/h3>\r\n <p>Seminar + Makan Malam Sistem Bebas O2&B<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"features\">\r\n <div class=\"section-title\" style=\"color: white;\">\ud83d\udca7 Fitur Sistem Pemurnian Air MCDI<\/div>\r\n <div class=\"feature-item\">\r\n <h3>\u2705 100 ton air dapat dimurnikan per hari<\/h3>\r\n <p>Pasokan air yang stabil melalui pemurnian air berkapasitas besar<\/p>\r\n <\/div>\r\n <div class=\"feature-item\">\r\n <h3>\u2705 Desain yang dioptimalkan untuk Vietnam<\/h3>\r\n <p>Sistem yang disesuaikan dengan kondisi lokal dan kualitas air<\/p>\r\n <\/div>\r\n <div class=\"feature-item\">\r\n <h3>\u2705 Dukungan O2&B gratis<\/h3>\r\n <p>Pelatihan operasi dan manajemen gratis disediakan<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"slider-section\">\r\n <div class=\"section-title\">Galeri Sistem<\/div>\r\n <div class=\"slider\">\r\n <div class=\"slide active\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581092918056-0c4c3acd3789?w=800\" alt=\"\uc815\uc218 \uc2dc\uc2a4\ud15c 1\">\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581092162384-8987c1d64718?w=800\" alt=\"\uc815\uc218 \uc2dc\uc2a4\ud15c 2\">\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581092160562-40aa08e78837?w=800\" alt=\"\uc815\uc218 \uc2dc\uc2a4\ud15c 3\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"slider-dots\">\r\n <span class=\"dot active\" onclick=\"currentSlide(0)\"><\/span>\r\n <span class=\"dot\" onclick=\"currentSlide(1)\"><\/span>\r\n <span class=\"dot\" onclick=\"currentSlide(2)\"><\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"video-section\">\r\n <div class=\"section-title\">\ud83c\udfa5 Video Pengenalan Teknologi MCDI<\/div>\r\n <div class=\"video-wrapper\">\r\n \r\n <iframe \r\n src=\"https:\/\/www.youtube.com\/embed\/dQw4w9WgXcQ\" \r\n frameborder=\"0\" \r\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" \r\n allowfullscreen>\r\n <\/iframe>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"form-section\">\r\n <div class=\"section-title\">\ud83d\udcdd Daftar untuk berpartisipasi<\/div>\r\n <form id=\"registrationForm\" action=\"\">\r\n <div class=\"form-group\">\r\n <label for=\"company\">Nama Perusahaan\/Lembaga *<\/label>\r\n <input type=\"text\" id=\"company\" name=\"company\" required placeholder=\"Masukkan nama perusahaan atau organisasi Anda\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label for=\"position\">Judul *<\/label>\r\n <input type=\"text\" id=\"position\" name=\"position\" required placeholder=\"Silakan masukkan judul Anda\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label for=\"name\">nama *<\/label>\r\n <input type=\"text\" id=\"name\" name=\"name\" required placeholder=\"Silakan masukkan nama Anda\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label for=\"contact\">kontak *<\/label>\r\n <input type=\"tel\" id=\"contact\" name=\"contact\" required placeholder=\"Silakan masukkan informasi kontak Anda\">\r\n <\/div>\r\n <button type=\"submit\" class=\"submit-btn\" id=\"submitBtn\">\r\n \u2705 Daftar untuk berpartisipasi\r\n <\/button>\r\n <input type=\"hidden\" name=\"trp-form-language\" value=\"id\"\/><\/form>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"modal\" id=\"modal\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-icon\" id=\"modalIcon\">\u2713<\/div>\r\n <h2 id=\"modalTitle\">Pendaftaran selesai!<\/h2>\r\n <p id=\"modalMessage\">Pendaftaran untuk seminar telah selesai.<\/p>\r\n <button class=\"modal-btn\" onclick=\"closeModal()\">memeriksa<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ \ud0c0\uc774\uba38\r\n const eventDate = new Date('2025-11-03T17:00:00').getTime();\r\n\r\n function updateTimer() {\r\n const now = new Date().getTime();\r\n const distance = eventDate - now;\r\n\r\n const days = Math.floor(distance \/ (1000 * 60 * 60 * 24));\r\n const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) \/ (1000 * 60 * 60));\r\n const minutes = Math.floor((distance % (1000 * 60 * 60)) \/ (1000 * 60));\r\n const seconds = Math.floor((distance % (1000 * 60)) \/ 1000);\r\n\r\n document.getElementById('days').textContent = String(days).padStart(2, '0');\r\n document.getElementById('hours').textContent = String(hours).padStart(2, '0');\r\n document.getElementById('minutes').textContent = String(minutes).padStart(2, '0');\r\n document.getElementById('seconds').textContent = String(seconds).padStart(2, '0');\r\n\r\n if (distance < 0) {\r\n document.getElementById('days').textContent = '00';\r\n document.getElementById('hours').textContent = '00';\r\n document.getElementById('minutes').textContent = '00';\r\n document.getElementById('seconds').textContent = '00';\r\n }\r\n }\r\n\r\n setInterval(updateTimer, 1000);\r\n updateTimer();\r\n\r\n \/\/ \uc2ac\ub77c\uc774\ub354\r\n let currentSlideIndex = 0;\r\n const slides = document.querySelectorAll('.slide');\r\n const dots = document.querySelectorAll('.dot');\r\n\r\n function showSlide(index) {\r\n slides.forEach(slide => slide.classList.remove('active'));\r\n dots.forEach(dot => dot.classList.remove('active'));\r\n \r\n slides[index].classList.add('active');\r\n dots[index].classList.add('active');\r\n }\r\n\r\n function currentSlide(index) {\r\n currentSlideIndex = index;\r\n showSlide(index);\r\n }\r\n\r\n function autoSlide() {\r\n currentSlideIndex = (currentSlideIndex + 1) % slides.length;\r\n showSlide(currentSlideIndex);\r\n }\r\n\r\n setInterval(autoSlide, 4000);\r\n\r\n \/\/ \ub4f1\ub85d \ub370\uc774\ud130 \uc800\uc7a5 (localStorage \uc0ac\uc6a9)\r\n function getRegistrations() {\r\n const data = localStorage.getItem('registrations');\r\n return data ? JSON.parse(data) : [];\r\n }\r\n\r\n function saveRegistration(data) {\r\n const registrations = getRegistrations();\r\n registrations.push({\r\n ...data,\r\n timestamp: new Date().toISOString()\r\n });\r\n localStorage.setItem('registrations', JSON.stringify(registrations));\r\n updateCounter();\r\n }\r\n\r\n function updateCounter() {\r\n const registrations = getRegistrations();\r\n const remaining = Math.max(0, 50 - registrations.length);\r\n document.getElementById('remaining').textContent = remaining;\r\n \r\n const submitBtn = document.getElementById('submitBtn');\r\n if (remaining === 0) {\r\n submitBtn.disabled = true;\r\n submitBtn.textContent = '\u274c \uc815\uc6d0 \ub9c8\uac10';\r\n }\r\n }\r\n\r\n \/\/ \ud3fc \uc81c\ucd9c\r\n document.getElementById('registrationForm').addEventListener('submit', function(e) {\r\n e.preventDefault();\r\n \r\n const registrations = getRegistrations();\r\n if (registrations.length >= 50) {\r\n showModal('error', '\ub4f1\ub85d \ub9c8\uac10', '\uc8c4\uc1a1\ud569\ub2c8\ub2e4. \uc815\uc6d0\uc774 \ub9c8\uac10\ub418\uc5c8\uc2b5\ub2c8\ub2e4.');\r\n return;\r\n }\r\n\r\n const formData = {\r\n company: document.getElementById('company').value,\r\n position: document.getElementById('position').value,\r\n name: document.getElementById('name').value,\r\n contact: document.getElementById('contact').value\r\n };\r\n\r\n saveRegistration(formData);\r\n showModal('success', '\ub4f1\ub85d \uc644\ub8cc!', `${formData.name}\ub2d8\uc758 \ucc38\uac00 \ub4f1\ub85d\uc774 \uc644\ub8cc\ub418\uc5c8\uc2b5\ub2c8\ub2e4.<br>\ud589\uc0ac \ub2f9\uc77c\uc5d0 \ubd59\uaca0\uc2b5\ub2c8\ub2e4!`);\r\n \r\n this.reset();\r\n });\r\n\r\n \/\/ \ubaa8\ub2ec\r\n function showModal(type, title, message) {\r\n const modal = document.getElementById('modal');\r\n const modalIcon = document.getElementById('modalIcon');\r\n const modalTitle = document.getElementById('modalTitle');\r\n const modalMessage = document.getElementById('modalMessage');\r\n\r\n modalIcon.className = `modal-icon ${type}`;\r\n modalIcon.textContent = type === 'success' ? '\u2713' : '\u2715';\r\n modalTitle.textContent = title;\r\n modalMessage.innerHTML = message;\r\n\r\n modal.classList.add('show');\r\n }\r\n\r\n function closeModal() {\r\n document.getElementById('modal').classList.remove('show');\r\n }\r\n\r\n \/\/ \ucd08\uae30\ud654\r\n updateCounter();\r\n\r\n \/\/ \ub4f1\ub85d \ub370\uc774\ud130 \ucf58\uc194 \ud655\uc778 (\uac1c\ubc1c\uc6a9)\r\n console.log('\ub4f1\ub85d \ub370\uc774\ud130 \ud655\uc778:', getRegistrations());\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>MCDI \uc815\uc218 \uc2dc\uc2a4\ud15c \uc138\ubbf8\ub098 \ucd08\uccad \ud83c\uddf0\ud83c\uddf7 \ud55c\uad6d\uc815\ubd80 \uae30\uc220\uc9c0\uc6d0 \uc0ac\uc5c5 \ubbf8\ub798\ub97c \uc5ec\ub294 MCDI\uc815\uc218 \uc2dc\uc2a4\ud15c \uc138\ubbf8\ub098 1\uc77c 100\ud1a4 \uc815\uc218 \uc2dc\uc2a4\ud15c | \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 \u23f0 \ud589\uc0ac\uae4c\uc9c0 \ub0a8\uc740 \uc2dc\uac04 00 \uc77c 00 \uc2dc\uac04 00 \ubd84 00 \ucd08 \ud83d\udd25 \uc120\ucc29\uc21c 50\uba85 \ud55c\uc815 \uc794\uc5ec: 50\uba85 \ud83d\udcc5 \ud589\uc0ac \uc77c\uc815 2025\ub144 11\uc6d4 3\uc77c (\uc6d4) \ud83d\udd50 \ud589\uc0ac \uc2dc\uac04 \uc624\ud6c4 5\uc2dc ~ 8\uc2dc \ud83d\udccd \ud589\uc0ac […]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"wf_page_folders":[],"class_list":["post-3630","page","type-page","status-publish","format-standard","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/pages\/3630","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/comments?post=3630"}],"version-history":[{"count":0,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/pages\/3630\/revisions"}],"wp:attachment":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/media?parent=3630"}],"wp:term":[{"taxonomy":"wf_page_folders","embeddable":true,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/wf_page_folders?post=3630"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\r\n\t\t\t\t\t

\r\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\n \r\n \r\n MCDI \uc815\uc218 \uc2dc\uc2a4\ud15c \uc138\ubbf8\ub098 \ucd08\uccad<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Noto Sans KR', -apple-system, BlinkMacSystemFont, sans-serif;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n color: #333;\r\n line-height: 1.6;\r\n }\r\n\r\n .container {\r\n max-width: 500px;\r\n margin: 0 auto;\r\n background: white;\r\n min-height: 100vh;\r\n }\r\n\r\n \/* \ud5e4\ub354 *\/\r\n .header {\r\n background: linear-gradient(135deg, #1e3c72 0%, #2a5298 100%);\r\n color: white;\r\n padding: 30px 20px;\r\n text-align: center;\r\n }\r\n\r\n .badge {\r\n display: inline-block;\r\n background: rgba(255,255,255,0.2);\r\n padding: 5px 15px;\r\n border-radius: 20px;\r\n font-size: 12px;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .header h1 {\r\n font-size: 24px;\r\n font-weight: bold;\r\n margin: 10px 0;\r\n line-height: 1.3;\r\n }\r\n\r\n .header .subtitle {\r\n font-size: 14px;\r\n opacity: 0.9;\r\n margin-top: 5px;\r\n }\r\n\r\n \/* \ud0c0\uc774\uba38 *\/\r\n .timer-section {\r\n background: linear-gradient(to right, #f093fb 0%, #f5576c 100%);\r\n color: white;\r\n padding: 20px;\r\n text-align: center;\r\n }\r\n\r\n .timer-title {\r\n font-size: 14px;\r\n margin-bottom: 10px;\r\n opacity: 0.95;\r\n }\r\n\r\n .timer {\r\n display: flex;\r\n justify-content: center;\r\n gap: 10px;\r\n }\r\n\r\n .timer-box {\r\n background: rgba(255,255,255,0.2);\r\n border-radius: 10px;\r\n padding: 10px 15px;\r\n min-width: 60px;\r\n }\r\n\r\n .timer-box .number {\r\n font-size: 28px;\r\n font-weight: bold;\r\n display: block;\r\n }\r\n\r\n .timer-box .label {\r\n font-size: 11px;\r\n opacity: 0.9;\r\n }\r\n\r\n \/* \uce74\uc6b4\ud130 *\/\r\n .counter-section {\r\n background: #ff6b6b;\r\n color: white;\r\n padding: 15px 20px;\r\n text-align: center;\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n }\r\n\r\n .counter-info {\r\n font-size: 14px;\r\n }\r\n\r\n .counter-number {\r\n font-size: 24px;\r\n font-weight: bold;\r\n }\r\n\r\n \/* \uc774\ubca4\ud2b8 \uc815\ubcf4 *\/\r\n .event-info {\r\n padding: 30px 20px;\r\n background: #f8f9fa;\r\n }\r\n\r\n .info-card {\r\n background: white;\r\n border-radius: 15px;\r\n padding: 20px;\r\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\r\n margin-bottom: 20px;\r\n }\r\n\r\n .info-item {\r\n display: flex;\r\n align-items: center;\r\n margin: 15px 0;\r\n padding: 10px;\r\n background: #f8f9fa;\r\n border-radius: 10px;\r\n }\r\n\r\n .info-icon {\r\n width: 40px;\r\n height: 40px;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n color: white;\r\n font-size: 18px;\r\n margin-right: 15px;\r\n flex-shrink: 0;\r\n }\r\n\r\n .info-content h3 {\r\n font-size: 13px;\r\n color: #666;\r\n margin-bottom: 3px;\r\n }\r\n\r\n .info-content p {\r\n font-size: 15px;\r\n font-weight: 600;\r\n color: #333;\r\n }\r\n\r\n \/* \uc2ac\ub77c\uc774\ub4dc *\/\r\n .slider-section {\r\n padding: 20px;\r\n background: white;\r\n }\r\n\r\n .section-title {\r\n font-size: 20px;\r\n font-weight: bold;\r\n margin-bottom: 15px;\r\n text-align: center;\r\n color: #333;\r\n }\r\n\r\n .slider {\r\n position: relative;\r\n width: 100%;\r\n height: 250px;\r\n overflow: hidden;\r\n border-radius: 15px;\r\n box-shadow: 0 4px 15px rgba(0,0,0,0.1);\r\n }\r\n\r\n .slide {\r\n position: absolute;\r\n width: 100%;\r\n height: 100%;\r\n opacity: 0;\r\n transition: opacity 0.5s ease-in-out;\r\n }\r\n\r\n .slide.active {\r\n opacity: 1;\r\n }\r\n\r\n .slide img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n\r\n .slider-dots {\r\n text-align: center;\r\n margin-top: 15px;\r\n }\r\n\r\n .dot {\r\n display: inline-block;\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n background: #ddd;\r\n margin: 0 5px;\r\n cursor: pointer;\r\n transition: all 0.3s;\r\n }\r\n\r\n .dot.active {\r\n background: #667eea;\r\n width: 25px;\r\n border-radius: 5px;\r\n }\r\n\r\n \/* \ube44\ub514\uc624 *\/\r\n .video-section {\r\n padding: 30px 20px;\r\n background: #f8f9fa;\r\n }\r\n\r\n .video-wrapper {\r\n position: relative;\r\n padding-bottom: 56.25%;\r\n height: 0;\r\n overflow: hidden;\r\n border-radius: 15px;\r\n box-shadow: 0 4px 15px rgba(0,0,0,0.1);\r\n }\r\n\r\n .video-wrapper iframe {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n }\r\n\r\n \/* \ub4f1\ub85d \ud3fc *\/\r\n .form-section {\r\n padding: 30px 20px;\r\n background: white;\r\n }\r\n\r\n .form-group {\r\n margin-bottom: 20px;\r\n }\r\n\r\n .form-group label {\r\n display: block;\r\n font-size: 14px;\r\n font-weight: 600;\r\n margin-bottom: 8px;\r\n color: #333;\r\n }\r\n\r\n .form-group input {\r\n width: 100%;\r\n padding: 15px;\r\n border: 2px solid #e0e0e0;\r\n border-radius: 10px;\r\n font-size: 15px;\r\n transition: all 0.3s;\r\n }\r\n\r\n .form-group input:focus {\r\n outline: none;\r\n border-color: #667eea;\r\n box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);\r\n }\r\n\r\n .submit-btn {\r\n width: 100%;\r\n padding: 18px;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n color: white;\r\n border: none;\r\n border-radius: 12px;\r\n font-size: 18px;\r\n font-weight: bold;\r\n cursor: pointer;\r\n transition: transform 0.2s;\r\n box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);\r\n }\r\n\r\n .submit-btn:hover {\r\n transform: translateY(-2px);\r\n }\r\n\r\n .submit-btn:active {\r\n transform: translateY(0);\r\n }\r\n\r\n .submit-btn:disabled {\r\n background: #ccc;\r\n cursor: not-allowed;\r\n transform: none;\r\n }\r\n\r\n \/* \ubaa8\ub2ec *\/\r\n .modal {\r\n display: none;\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background: rgba(0,0,0,0.7);\r\n z-index: 1000;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .modal.show {\r\n display: flex;\r\n }\r\n\r\n .modal-content {\r\n background: white;\r\n padding: 30px;\r\n border-radius: 20px;\r\n text-align: center;\r\n max-width: 90%;\r\n animation: modalSlideIn 0.3s ease-out;\r\n }\r\n\r\n @keyframes modalSlideIn {\r\n from {\r\n transform: translateY(-50px);\r\n opacity: 0;\r\n }\r\n to {\r\n transform: translateY(0);\r\n opacity: 1;\r\n }\r\n }\r\n\r\n .modal-icon {\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 50%;\r\n margin: 0 auto 20px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 30px;\r\n }\r\n\r\n .modal-icon.success {\r\n background: #d4edda;\r\n color: #28a745;\r\n }\r\n\r\n .modal-icon.error {\r\n background: #f8d7da;\r\n color: #dc3545;\r\n }\r\n\r\n .modal h2 {\r\n font-size: 22px;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .modal p {\r\n color: #666;\r\n margin-bottom: 20px;\r\n }\r\n\r\n .modal-btn {\r\n padding: 12px 30px;\r\n background: #667eea;\r\n color: white;\r\n border: none;\r\n border-radius: 8px;\r\n font-size: 16px;\r\n cursor: pointer;\r\n }\r\n\r\n \/* \ud2b9\uc9d5 \uc139\uc158 *\/\r\n .features {\r\n padding: 30px 20px;\r\n background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);\r\n color: white;\r\n }\r\n\r\n .feature-item {\r\n background: rgba(255,255,255,0.1);\r\n border-radius: 15px;\r\n padding: 20px;\r\n margin-bottom: 15px;\r\n backdrop-filter: blur(10px);\r\n }\r\n\r\n .feature-item h3 {\r\n font-size: 16px;\r\n margin-bottom: 8px;\r\n }\r\n\r\n .feature-item p {\r\n font-size: 14px;\r\n opacity: 0.9;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"container\">\r\n \r\n <div class=\"header\">\r\n <div class=\"badge\">Proyek Dukungan Teknologi Pemerintah Korea<\/div>\r\n <h1>MCDI Membuka Masa Depan<br>Seminar sistem pemurnian air<\/h1>\r\n <p class=\"subtitle\">Sistem pemurnian air 100 ton per hari | Instalasi percontohan di Lao Cai<\/p>\r\n <\/div>\r\n\r\n \r\n <div class=\"timer-section\">\r\n <div class=\"timer-title\">\u23f0 Waktu tersisa hingga acara<\/div>\r\n <div class=\"timer\">\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"days\">00<\/span>\r\n <span class=\"label\">Hari<\/span>\r\n <\/div>\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"hours\">00<\/span>\r\n <span class=\"label\">jam<\/span>\r\n <\/div>\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"minutes\">00<\/span>\r\n <span class=\"label\">menit<\/span>\r\n <\/div>\r\n <div class=\"timer-box\">\r\n <span class=\"number\" id=\"seconds\">00<\/span>\r\n <span class=\"label\">lilin<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"counter-section\">\r\n <div class=\"counter-info\">\r\n <div>\ud83d\udd25 Terbatas untuk 50 orang pertama<\/div>\r\n <\/div>\r\n <div class=\"counter-info\">\r\n <div>sisa: <span class=\"counter-number\" id=\"remaining\">50<\/span>jumlah orang<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"event-info\">\r\n <div class=\"info-card\">\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83d\udcc5<\/div>\r\n <div class=\"info-content\">\r\n <h3>Jadwal acara<\/h3>\r\n <p>Senin, 3 November 2025<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83d\udd50<\/div>\r\n <div class=\"info-content\">\r\n <h3>Waktu acara<\/h3>\r\n <p>Jam 5 sore - 8 malam<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83d\udccd<\/div>\r\n <div class=\"info-content\">\r\n <h3>Tempat acara<\/h3>\r\n <p>Lao Cai (Vietnam)<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"info-item\">\r\n <div class=\"info-icon\">\ud83c\udf81<\/div>\r\n <div class=\"info-content\">\r\n <h3>Detail acara<\/h3>\r\n <p>Seminar + Makan Malam Sistem Bebas O2&B<\/p>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"features\">\r\n <div class=\"section-title\" style=\"color: white;\">\ud83d\udca7 Fitur Sistem Pemurnian Air MCDI<\/div>\r\n <div class=\"feature-item\">\r\n <h3>\u2705 100 ton air dapat dimurnikan per hari<\/h3>\r\n <p>Pasokan air yang stabil melalui pemurnian air berkapasitas besar<\/p>\r\n <\/div>\r\n <div class=\"feature-item\">\r\n <h3>\u2705 Desain yang dioptimalkan untuk Vietnam<\/h3>\r\n <p>Sistem yang disesuaikan dengan kondisi lokal dan kualitas air<\/p>\r\n <\/div>\r\n <div class=\"feature-item\">\r\n <h3>\u2705 Dukungan O2&B gratis<\/h3>\r\n <p>Pelatihan operasi dan manajemen gratis disediakan<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"slider-section\">\r\n <div class=\"section-title\">Galeri Sistem<\/div>\r\n <div class=\"slider\">\r\n <div class=\"slide active\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581092918056-0c4c3acd3789?w=800\" alt=\"\uc815\uc218 \uc2dc\uc2a4\ud15c 1\">\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581092162384-8987c1d64718?w=800\" alt=\"\uc815\uc218 \uc2dc\uc2a4\ud15c 2\">\r\n <\/div>\r\n <div class=\"slide\">\r\n <img decoding=\"async\" src=\"https:\/\/images.unsplash.com\/photo-1581092160562-40aa08e78837?w=800\" alt=\"\uc815\uc218 \uc2dc\uc2a4\ud15c 3\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"slider-dots\">\r\n <span class=\"dot active\" onclick=\"currentSlide(0)\"><\/span>\r\n <span class=\"dot\" onclick=\"currentSlide(1)\"><\/span>\r\n <span class=\"dot\" onclick=\"currentSlide(2)\"><\/span>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"video-section\">\r\n <div class=\"section-title\">\ud83c\udfa5 Video Pengenalan Teknologi MCDI<\/div>\r\n <div class=\"video-wrapper\">\r\n \r\n <iframe \r\n src=\"https:\/\/www.youtube.com\/embed\/dQw4w9WgXcQ\" \r\n frameborder=\"0\" \r\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture\" \r\n allowfullscreen>\r\n <\/iframe>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"form-section\">\r\n <div class=\"section-title\">\ud83d\udcdd Daftar untuk berpartisipasi<\/div>\r\n <form id=\"registrationForm\" action=\"\">\r\n <div class=\"form-group\">\r\n <label for=\"company\">Nama Perusahaan\/Lembaga *<\/label>\r\n <input type=\"text\" id=\"company\" name=\"company\" required placeholder=\"Masukkan nama perusahaan atau organisasi Anda\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label for=\"position\">Judul *<\/label>\r\n <input type=\"text\" id=\"position\" name=\"position\" required placeholder=\"Silakan masukkan judul Anda\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label for=\"name\">nama *<\/label>\r\n <input type=\"text\" id=\"name\" name=\"name\" required placeholder=\"Silakan masukkan nama Anda\">\r\n <\/div>\r\n <div class=\"form-group\">\r\n <label for=\"contact\">kontak *<\/label>\r\n <input type=\"tel\" id=\"contact\" name=\"contact\" required placeholder=\"Silakan masukkan informasi kontak Anda\">\r\n <\/div>\r\n <button type=\"submit\" class=\"submit-btn\" id=\"submitBtn\">\r\n \u2705 Daftar untuk berpartisipasi\r\n <\/button>\r\n <input type=\"hidden\" name=\"trp-form-language\" value=\"id\"\/><\/form>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"modal\" id=\"modal\">\r\n <div class=\"modal-content\">\r\n <div class=\"modal-icon\" id=\"modalIcon\">\u2713<\/div>\r\n <h2 id=\"modalTitle\">Pendaftaran selesai!<\/h2>\r\n <p id=\"modalMessage\">Pendaftaran untuk seminar telah selesai.<\/p>\r\n <button class=\"modal-btn\" onclick=\"closeModal()\">memeriksa<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ \ud0c0\uc774\uba38\r\n const eventDate = new Date('2025-11-03T17:00:00').getTime();\r\n\r\n function updateTimer() {\r\n const now = new Date().getTime();\r\n const distance = eventDate - now;\r\n\r\n const days = Math.floor(distance \/ (1000 * 60 * 60 * 24));\r\n const hours = Math.floor((distance % (1000 * 60 * 60 * 24)) \/ (1000 * 60 * 60));\r\n const minutes = Math.floor((distance % (1000 * 60 * 60)) \/ (1000 * 60));\r\n const seconds = Math.floor((distance % (1000 * 60)) \/ 1000);\r\n\r\n document.getElementById('days').textContent = String(days).padStart(2, '0');\r\n document.getElementById('hours').textContent = String(hours).padStart(2, '0');\r\n document.getElementById('minutes').textContent = String(minutes).padStart(2, '0');\r\n document.getElementById('seconds').textContent = String(seconds).padStart(2, '0');\r\n\r\n if (distance < 0) {\r\n document.getElementById('days').textContent = '00';\r\n document.getElementById('hours').textContent = '00';\r\n document.getElementById('minutes').textContent = '00';\r\n document.getElementById('seconds').textContent = '00';\r\n }\r\n }\r\n\r\n setInterval(updateTimer, 1000);\r\n updateTimer();\r\n\r\n \/\/ \uc2ac\ub77c\uc774\ub354\r\n let currentSlideIndex = 0;\r\n const slides = document.querySelectorAll('.slide');\r\n const dots = document.querySelectorAll('.dot');\r\n\r\n function showSlide(index) {\r\n slides.forEach(slide => slide.classList.remove('active'));\r\n dots.forEach(dot => dot.classList.remove('active'));\r\n \r\n slides[index].classList.add('active');\r\n dots[index].classList.add('active');\r\n }\r\n\r\n function currentSlide(index) {\r\n currentSlideIndex = index;\r\n showSlide(index);\r\n }\r\n\r\n function autoSlide() {\r\n currentSlideIndex = (currentSlideIndex + 1) % slides.length;\r\n showSlide(currentSlideIndex);\r\n }\r\n\r\n setInterval(autoSlide, 4000);\r\n\r\n \/\/ \ub4f1\ub85d \ub370\uc774\ud130 \uc800\uc7a5 (localStorage \uc0ac\uc6a9)\r\n function getRegistrations() {\r\n const data = localStorage.getItem('registrations');\r\n return data ? JSON.parse(data) : [];\r\n }\r\n\r\n function saveRegistration(data) {\r\n const registrations = getRegistrations();\r\n registrations.push({\r\n ...data,\r\n timestamp: new Date().toISOString()\r\n });\r\n localStorage.setItem('registrations', JSON.stringify(registrations));\r\n updateCounter();\r\n }\r\n\r\n function updateCounter() {\r\n const registrations = getRegistrations();\r\n const remaining = Math.max(0, 50 - registrations.length);\r\n document.getElementById('remaining').textContent = remaining;\r\n \r\n const submitBtn = document.getElementById('submitBtn');\r\n if (remaining === 0) {\r\n submitBtn.disabled = true;\r\n submitBtn.textContent = '\u274c \uc815\uc6d0 \ub9c8\uac10';\r\n }\r\n }\r\n\r\n \/\/ \ud3fc \uc81c\ucd9c\r\n document.getElementById('registrationForm').addEventListener('submit', function(e) {\r\n e.preventDefault();\r\n \r\n const registrations = getRegistrations();\r\n if (registrations.length >= 50) {\r\n showModal('error', '\ub4f1\ub85d \ub9c8\uac10', '\uc8c4\uc1a1\ud569\ub2c8\ub2e4. \uc815\uc6d0\uc774 \ub9c8\uac10\ub418\uc5c8\uc2b5\ub2c8\ub2e4.');\r\n return;\r\n }\r\n\r\n const formData = {\r\n company: document.getElementById('company').value,\r\n position: document.getElementById('position').value,\r\n name: document.getElementById('name').value,\r\n contact: document.getElementById('contact').value\r\n };\r\n\r\n saveRegistration(formData);\r\n showModal('success', '\ub4f1\ub85d \uc644\ub8cc!', `${formData.name}\ub2d8\uc758 \ucc38\uac00 \ub4f1\ub85d\uc774 \uc644\ub8cc\ub418\uc5c8\uc2b5\ub2c8\ub2e4.<br>\ud589\uc0ac \ub2f9\uc77c\uc5d0 \ubd59\uaca0\uc2b5\ub2c8\ub2e4!`);\r\n \r\n this.reset();\r\n });\r\n\r\n \/\/ \ubaa8\ub2ec\r\n function showModal(type, title, message) {\r\n const modal = document.getElementById('modal');\r\n const modalIcon = document.getElementById('modalIcon');\r\n const modalTitle = document.getElementById('modalTitle');\r\n const modalMessage = document.getElementById('modalMessage');\r\n\r\n modalIcon.className = `modal-icon ${type}`;\r\n modalIcon.textContent = type === 'success' ? '\u2713' : '\u2715';\r\n modalTitle.textContent = title;\r\n modalMessage.innerHTML = message;\r\n\r\n modal.classList.add('show');\r\n }\r\n\r\n function closeModal() {\r\n document.getElementById('modal').classList.remove('show');\r\n }\r\n\r\n \/\/ \ucd08\uae30\ud654\r\n updateCounter();\r\n\r\n \/\/ \ub4f1\ub85d \ub370\uc774\ud130 \ucf58\uc194 \ud655\uc778 (\uac1c\ubc1c\uc6a9)\r\n console.log('\ub4f1\ub85d \ub370\uc774\ud130 \ud655\uc778:', getRegistrations());\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>MCDI \uc815\uc218 \uc2dc\uc2a4\ud15c \uc138\ubbf8\ub098 \ucd08\uccad \ud83c\uddf0\ud83c\uddf7 \ud55c\uad6d\uc815\ubd80 \uae30\uc220\uc9c0\uc6d0 \uc0ac\uc5c5 \ubbf8\ub798\ub97c \uc5ec\ub294 MCDI\uc815\uc218 \uc2dc\uc2a4\ud15c \uc138\ubbf8\ub098 1\uc77c 100\ud1a4 \uc815\uc218 \uc2dc\uc2a4\ud15c | \ub77c\uc624\uae4c\uc774 \uc2dc\ubc94\uc124\uce58 \u23f0 \ud589\uc0ac\uae4c\uc9c0 \ub0a8\uc740 \uc2dc\uac04 00 \uc77c 00 \uc2dc\uac04 00 \ubd84 00 \ucd08 \ud83d\udd25 \uc120\ucc29\uc21c 50\uba85 \ud55c\uc815 \uc794\uc5ec: 50\uba85 \ud83d\udcc5 \ud589\uc0ac \uc77c\uc815 2025\ub144 11\uc6d4 3\uc77c (\uc6d4) \ud83d\udd50 \ud589\uc0ac \uc2dc\uac04 \uc624\ud6c4 5\uc2dc ~ 8\uc2dc \ud83d\udccd \ud589\uc0ac […]<\/p>","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"wf_page_folders":[],"class_list":["post-3630","page","type-page","status-publish","format-standard","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/pages\/3630","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/comments?post=3630"}],"version-history":[{"count":0,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/pages\/3630\/revisions"}],"wp:attachment":[{"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/media?parent=3630"}],"wp:term":[{"taxonomy":"wf_page_folders","embeddable":true,"href":"https:\/\/hcbiopharm.net\/id\/wp-json\/wp\/v2\/wf_page_folders?post=3630"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}