@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Thin.woff2') format('woff2');
    font-weight: 100;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraLight.woff2') format('woff2');
    font-weight: 200;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Light.woff2') format('woff2');
    font-weight: 300;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Regular.woff2') format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Medium.woff2') format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-SemiBold.woff2') format('woff2');
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Bold.woff2') format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-ExtraBold.woff2') format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/pretendard@1.0/Pretendard-Black.woff2') format('woff2');
    font-weight: 900;
    font-display: swap;
}

* {margin:0; padding:0; font:inherit; color:inherit; font-family: 'Pretendard';letter-spacing: 0;}
*, :after, :before {box-sizing:border-box;}
html, body {height:100%; position:relative;}
img, picture, video, canvas, svg {max-width:100%; height:auto;}
button {background:none; border:0; cursor:pointer;}
a {text-decoration:none;}
table {border-collapse:collapse; border-spacing:0;}
ul, ol {list-style:none;}
section {padding: 85px 0;}
section.hero {padding: 170px 0 118px;}
.wrap {width:1200px; margin:0 auto;}
.container {width:1200px; margin:0 auto;}

/* Hero Section */
.hero {width: 100%; position: relative; overflow: hidden; margin-top: 0; z-index: 1;}
.hero-slider {position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.hero-slide {position: absolute; width: 100%; height: 100%; opacity:0; transition: opacity 1s ease-in-out;}
.hero-slide.active {opacity: 1;}
.hero-image {width: 100%; height: 100%;}
.hero-slide:nth-child(1) .hero-image {background:url('/rtImagesNEW3/main/banner_260226_img01.png') no-repeat; background-size: cover; background-position: center;}
.hero-slide:nth-child(2) .hero-image {background:url('/rtImagesNEW3/main/banner_260226_img02.png') no-repeat; background-size: cover; background-position: center;}
.hero-slide:nth-child(3) .hero-image {background:url('/rtImagesNEW3/main/banner_260226_img03.png') no-repeat; background-size: cover; background-position: center;}
.hero-content {position: relative; z-index: 10;  display: flex; align-items: center; justify-content: space-between;}
.hero-left {color: #fff;}
.hero-slogan {margin-bottom:90px;}
.slogan-line1, .slogan-line2 {font-size: 35px; font-weight: 400; line-height: 1.4; margin: 0;}
.slogan-line2 {font-weight:600;}
.carousel-controls {display: flex; align-items: center; gap: 0.5rem;}
.carousel-btn {color: #fff; width: 14px; height: 14px; cursor: pointer; transition: background 0.3s; display: flex; align-items: center; justify-content: center; position: relative;}
.carousel-pause {width: 20px; height: 20px; border: 2px solid #eaeaea; transition: background 0.3s; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative;}
.carousel-btn.next-btn {transform: rotate(180deg);}
.carousel-pause .pause-icon {width: 6px; filter: brightness(0) invert(1); object-fit: contain; display: block;}
.carousel-pause .play-icon {width: 8px; filter: brightness(0) invert(1); object-fit: contain; display: block; margin-left: 2px;}
.carousel-pause:hover {background: rgba(255, 255, 255, 0.1);}
.carousel-indicator {color: rgba(255, 255, 255, 0.6);font-size: 16px; font-weight: 400; width: 70px; padding-right: 5px; text-align: right;}
.carousel-indicator .current-slide {font-weight: 500; color: #fff;}
.carousel-indicator .total-slides {font-weight: 400; color: rgba(255, 255, 255, 0.6);}
.user-info-box {background: rgba(0, 0, 0, 0.4); padding: 15px 20px; border-radius: 10px; color: #fff; width: 430px;}
.welcome-text {font-size: 20px; font-weight: 600; margin-bottom: 15px; color: #fff;}
.status-cards {display: flex; gap: 0.75rem; margin-bottom: 1rem;}
.status-card {flex: 1; background: #fff; border-radius:10px; padding: 16px; text-decoration: none; color: #000; display: flex; flex-direction: column; align-items: center; transition: transform 0.2s, box-shadow 0.2s;}
a.status-card:hover {transform: translateY(-2px) !important; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);}
.status-number {font-size: 35px; font-weight: 600; color: #814e99; margin-bottom: 8px;}
.status-label {font-size: 16px; color: #000; font-weight: 600;}
.status-note {font-size: 14px; color: #d0d0d0; margin: 0; text-align: left;}

/* Main Navigation */
section.main-nav {padding:0;}
.main-nav .wrap {position: relative;}
.main-nav-container {width: 1200px; margin: 0; display: flex; justify-content: center; align-items: stretch; position: absolute; top: -50%; left: 0; background: #fff; transform: translate(0%, -50%); z-index: 1; border-radius: 10px; padding: 30px 0;box-shadow: 0 0px 10px rgb(204, 204, 204, 0.9);}
.main-nav-item {display: flex; align-items: center; justify-content: center; color: #000;  flex: 1; position: relative; gap: 7px; transition: transform 0.3s ease;}
.main-nav-item:nth-child(3) {gap: 2px;}
.main-nav-item img {height: 34px;}

.nav-text {font-size: 18px; font-weight: 700; white-space: nowrap;}
.main-nav-item:nth-child(5) .nav-text {letter-spacing: 0.1rem;}
.main-nav-item:hover {  transform: translateY(-3px) !important;}


/* Customer Service Section */
.customer-service {padding: 111px 0 70px; background-color: #fff;}
.service-container {margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px;}
.service-card {background-color: #fff; padding: 30px 40px; border-radius: 10px; position: relative;}
.service-card:nth-child(1) {background-color: #fff6ed;}
.service-card:nth-child(2) {background-color: #f1fff0;}
.service-card:nth-child(3) {background-color: #fcf5ff;}
.service-icon {position: absolute; top: 27px; right: 27px;}
.service-card:nth-child(1) .service-icon img {height: 52px;}
.service-icon img {height: 60px;}
.service-title {font-size: 22px; font-weight: 700; margin-bottom: 7px; color: #000;}
.service-desc {font-size: 18px; color: #666; font-weight: 600;}
.service-phone {font-size: 25px; font-weight: 700; color: #000; margin: 25px 0 12px; border-top: 1px solid #ddd; padding-top: 23px;}
.service-card:nth-child(1) .service-phone {color: #ff8106;}
.service-card:nth-child(2) .service-phone {color: #009f00;}
.service-card:nth-child(3) .service-phone {color: #814e99;}
.service-hours {font-size:14px; color: #999; margin-bottom: 5px; font-weight: 500;}
.service-note {font-size: 14px; color: #999; font-weight: 500;}

/* Course Section */
.course-section {padding-top: 0;}
.course-header {display: flex; justify-content: space-between; align-items: center; margin-bottom: 29px; }
.course-tabs {display: flex; gap: 10px;}
.tab {padding: 15px 22px;background: #fff;font-size: 18px;font-weight: 600;color: #000;cursor: pointer;transition: all 0.3s;border-radius: 50px;border: 1px solid #ddd;}
.tab.active {color: #fff;border-color: #814e99;background: #814e99;}
.tab:hover {color: #fff;border-color: #814e99;background: #814e99;}
.course-grid {display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; margin-bottom: 30px;}
.course-grid:not(.active-tabpanel) {display: none;}
.course-search {position: relative; display: flex; align-items: center; gap: 0.5rem;}
.course-search .sr-only {display: none;}
.course-search input {padding: 14px 35px 14px 11px;font-size: 14px;width: 240px;position: relative;background: #fff;border: none;font-weight: 600;border-bottom: 1px solid #ddd;}

/* ºê¶ó¿ìÀú ±âº» °Ë»ö Çʵå X ¹öÆ° ¼û±â±â */
.course-search input[type="search"]::-webkit-search-cancel-button {-webkit-appearance: none; appearance: none; display: none;}
.course-search input[type="search"]::-ms-clear {display: none;}
.course-search input[type="search"]::-ms-reveal {display: none;}
.search-icon, .close-icon {position: absolute; width: 100%; height: 100%; object-fit: contain; transition: opacity 0.2s ease, visibility 0.2s ease;}
.search-btn {background: none; border: none; cursor: pointer; position: absolute; right: 11px; top: 50%; transform: translateY(-50%); width: 14px; height: 14px; display: flex; align-items: center; justify-content: center; z-index: 1; transition: opacity 0.2s ease, visibility 0.2s ease;}
.search-btn img {width: 100%; height: 100%; object-fit: contain;}
.course-card {background-color: #fff; box-shadow: 5px 5px 10px rgba(204, 204, 204, 0.9); border-radius: 10px; overflow: hidden; transition: box-shadow 0.3s;}
.course-image {width: 100%; height: 165px; overflow: hidden;}
.course-image img {height: 100%; object-fit: cover; width: 100%;transition: all 0.5s ease;}
.course-card:hover .course-image img {transform: scale(1.1);}
.course-title {font-size: 17px; font-weight: 700; color: #000; line-height: 1.5;}
.course-info {font-size: 15px; color: #666; padding: 16px 0 25px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px;}
.course-flex {display: flex; align-items: center; gap: 6px; font-weight: 600;}
.course-info img {width: 16px; margin-top: -2.5px;}
.course-info .course-duration img {margin-top: -3.5px;}
.course-actions {display: flex; gap: 10px;}
.course-txt-box {padding: 23px 21px;border: 2px solid #fff;transition: all 0.3s ease;border-radius: 0 0 10px 10px;border-top: 0;}
.course-card:hover .course-txt-box {border: 2px solid #814e99;border-top: 0;}
.btn-preview, .btn-enroll {flex: 1; padding: 11px; border-radius: 10px; font-size: 16px; cursor: pointer; transition: all 0.3s; font-weight: 500;}
.btn-preview {background-color: #e7e7e7; color: #000;}
.btn-preview:hover {background-color: #f0f0f0;}
.btn-enroll {background-color: #814e99; color: #fff;transition: all 0.3s ease;}
.btn-enroll:hover {background-color: #623b75;}
.course-more {text-align: center; margin-top: 50px;}
.more-link {text-decoration: none; font-size: 16px; width: 300px; display: flex; align-items: center; justify-content: center; margin: 0 auto; border: 1px solid #ddd; border-radius: 5px; padding: 17px 0; gap: 20px; font-weight: bold;transition: all 0.3s ease;}
.more-link:hover {background: #f0f0f0;border: 1px solid #f0f0f0;}
.more-link img {width: 11px;}
.M_sec01 {
        padding-bottom: 60px !important;    padding-top: 60px !important;background: #fcf5ff;
}
.M_sec01 .left_wrap {

    background: #fff;
    padding: 40px;border-radius: 20px;
}

.M_sec01 .left_wrap p.nttxt {
    color: #814e99 !important;
}