@charset "utf-8";

	body {
		font-family: 'Pretendard', sans-serif;
	}

        /* ½ºÅ©·Ñ ½Ã ³ªÅ¸³ª´Â ¿ä¼ÒÀÇ Ãʱ⠻óÅ */
        .animate-on-scroll {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 1s ease-out, transform 1s ease-out;
        }

        /* ½ºÅ©·Ñ ½Ã ³ªÅ¸³ª´Â ÃÖÁ¾ »óÅ */
        .animate-on-scroll.is-visible {
            opacity: 1;
            transform: translateY(0);
        }

        .floating-button {
            position: fixed;
            bottom: 2rem;
            right: 2rem;
            z-index: 100;
            padding: 1rem 1.5rem;
            background-color: #6c46c0;
            color: white;
            border-radius: 9999px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
            transition: transform 0.3s ease;
        }
        
        .floating-button:hover {
            transform: scale(1.05);
        }

     

        .event-badge {
            position: absolute;
            top: -8px; /* À§Ä¡ Á¶Á¤ */
            right: -18px;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 20px;
            height: 20px;
            background-color: #fd6164;
            color: white;
            font-size: 0.75rem;
            font-weight: bold;
            border-radius: 9999px;
        }

        /* Ư¡ Ä«µå ¾Ö´Ï¸ÞÀÌ¼Ç ½ºÅ¸ÀÏ */
        .cta-button {
            background-color: #f97316;
            transition: all 0.3s ease;
        }
        .cta-button:hover {
            background-color: #ea580c;
            transform: translateY(-3px);
            box-shadow: 0 10px 20px -10px rgba(249, 115, 22, 0.5);
        }
        .section-card {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .section-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 30px -15px rgba(0, 0, 0, 0.1);
        }

        /* ±ÛÀÚ ¾Ö´Ï¸ÞÀÌ¼Ç ½ºÅ¸ÀÏ */
        .sequential-fade-container {
            position: relative;
            display: inline-block;
            height: 1.2em; /* ¾Ö´Ï¸ÞÀÌ¼Ç ´Ü¾î ³ôÀÌ °íÁ¤ */
        }

        .sequential-fade-word {
            position: absolute;
            top: 0;
            left: -100px;
			width:200px;
            opacity: 0;
            animation: fadeInOutAndDelay 9s infinite;
        }

        .sequential-fade-word:nth-child(2) {
            animation-delay: 3s;
        }
        
        .sequential-fade-word:nth-child(3) {
            animation-delay: 6s;
        }

        .speech-bubble::after {
            content: '';
            position: absolute;
            right:25px;
			left:auto;
            bottom: 100%;
			transform: none;
            border: 6px solid transparent;
            border-bottom-color: #3B3737; 
        } 

        @keyframes fadeInOutAndDelay {
            0% { opacity: 0; }
            11% { opacity: 1; }
            22% { opacity: 1; }
            33% { opacity: 0; }
            100% { opacity: 0; }
        }
        /* Ä¿½ºÅÒ ½ºÅ¸ÀÏ: ¸ð´ÞÀÌ Áß¾Ó¿¡ °íÁ¤µÇµµ·Ï ¼³Á¤ */
        .modal-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.7);
            z-index: 50;
            align-items: center;
            justify-content: center;
            transition: opacity 0.3s ease;
        }
        /* ¸ð´ÞÀÌ È°¼ºÈ­µÇ¾úÀ» ¶§¸¸ º¸À̵µ·Ï ¼³Á¤Çϴ Ŭ·¡½º */
        .modal-overlay.active {
            display: flex;
            opacity: 1;
        }
        

        /* ¹è°æ À̹ÌÁö ½ºÅ¸ÀÏ */
        #section-why-reading {
            background-image: url('/resources/img/main_childbg.jpg');
            background-size: cover;
            background-position: center;
        }
        
        #section-why-learn {
            background-image: url('/resources/img/main_whybg.jpg');
            background-size: cover;
            background-position: center;
        }

        #section-why-ele {
            background-image: url('/resources/img/main_pbg.jpg');
            background-size:cover;
            background-position: center;
        }

        #section-test {
            background-image: url('/resources/img/test_box1.png');
            background-size:cover;
            background-position: center;
        }  
        .section-curriculum {
            background-color: #f6f6f6;
            background-size:cover;
            background-position: center;
        }             
        
        /* À̺¥Æ® »ó¼¼ ŸÀÌƲ ¹è°æ À̹ÌÁö ½ºÅ¸ÀÏ */
        .section-2025_liveclass {
            background-image: url('/resources/img/img_teacher.png');
            background-repeat: no-repeat;
            background-size:contain;
            background-position: right bottom;
        } 
        /* ¸ð¹ÙÀÏ È­¸é¿¡¸¸ Àû¿ë */
        @media (max-width:768px)         {
            .section-2025_liveclass {
                background-size:120px 135px;
            }
        }

        /* ÅؽºÆ® °¡µ¶¼ºÀ» À§ÇÑ ¿À¹ö·¹ÀÌ */
        .overlay {
            background-color: rgba(0, 0, 0, 0.5); /* ¾îµÎ¿î ¹è°æ ¿À¹ö·¹ÀÌ */
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
        }

        /* °øÅë Æû ¿ä¼Ò ½ºÅ¸ÀÏ */
        .form-label {
            display: block;
            margin-bottom: 0.5rem;
            font-weight: 800; 
            color: #333;
        }

        .form-input, .form-select {
            width: 100%;
            border-radius: 0.5rem; /* rounded-lg */
            border: 1px solid #d1d5db; /* border-gray-300 */
            padding: 0.75rem 1rem;
            transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
            font-size: 1rem;
        }

        .form-input:focus, .form-select:focus {
            border-color: #FFC800;
            box-shadow: 0 0 0 3px rgba(255, 200, 0, 0.5);
            outline: none;
        }

        .btn {
            padding: 0.75rem 1rem;
            border-radius: 0.5rem; /* rounded-lg */
            font-weight: 600;
            transition: background-color 0.15s ease-in-out, opacity 0.15s ease-in-out;
            white-space: nowrap; /* ¹öÆ° ÅؽºÆ®°¡ Áٹٲ޵Ǵ °ÍÀ» ¹æÁö */
            cursor: pointer;
            letter-spacing: -0.5px;
        }


        /* À̺¥Æ® ºñÁÖ¾ó ½º¿ÍÀÌÆÛ */        
        .brand-gradient-text {
            background: linear-gradient(to right, #f97316, #ea580c);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        .cta-button {
            background-color: #f97316;
            transition: all 0.3s ease;
        }
        .cta-button:hover {
            background-color: #ea580c;
            transform: translateY(-3px);
            box-shadow: 0 10px 20px -10px rgba(249, 115, 22, 0.5);
        }
        .section-card {
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        .section-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 15px 30px -15px rgba(0, 0, 0, 0.1);
        }
        /* Swiper Custom Styles */
        .hero-swiper {
            width: 100%;
            height: 100%;
            --swiper-pagination-bullet-horizontal-gap: 8px; /* ¿©¹é È®´ë */
        }
        .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: transparent;
            /* Center slide text vertically */
            display: flex;
            justify-content: center;
            align-items: center;
        }
        /* Custom styles for pagination dots to match the theme */
        .hero-swiper .swiper-pagination-bullet {
            width: 15px;
            height: 15px;
            background-color: #fed7aa; /* orange-200 */
            opacity: 1;
            transition: background-color 0.3s ease;
        }
        .hero-swiper .swiper-pagination-bullet-active {
            background-color: #f97316; /* orange-500 */
        }
        .hero-swiper .swiper-pagination {
            bottom: 2rem !important; /* Tailwind 'bottom-8' equivalent */
        }