/* 메인 "수강생 특전" 이벤트 배너 (main_event_banner.php)
   원본 GIF(4004x1110) 비율을 그대로 유지하도록 모든 치수를 배너 너비 기준(cqw)으로 지정.
   1cqw = 배너 너비의 1% → 화면 크기가 바뀌어도 이미지처럼 비율대로 축소/확대됨 */

.section_01.evt_banner {
    container-type: inline-size;
}

.evt_banner .evt_inner {
    position: relative;
    aspect-ratio: 4004 / 1110;
    background-color: #c8dced;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 88.85 88.85'%3E%3Cpath fill='%23d0e1f0' d='M40 21h9v47h-9zM21 40h47v9H21z'/%3E%3C/svg%3E");
    background-size: 2.219cqw 2.219cqw;
    background-position: 1.19cqw 0.47cqw;
    overflow: hidden;
    font-family: 'Pretendard', sans-serif;
    letter-spacing: -0.02em;
    word-break: keep-all;
}

.evt_banner .evt_text {
    position: absolute;
    top: 0;
    left: 17.01cqw;
    width: 43.21cqw;
    padding-top: 2.9cqw;
    text-align: center;
}

.evt_banner .evt_sub {
    margin: 0;
    font-size: 1.69cqw;
    font-weight: 600;
    line-height: 1.2;
    color: #2a3468;
}

/* 노란 그라데이션 + 남색 외곽선: 본문은 외곽선, ::after 가 그 위에 그라데이션 채움 */
.evt_banner .evt_title {
    position: relative;
    margin: 0.3cqw 0 0;
    font-size: 6.25cqw;
    font-weight: 900;
    line-height: 1;
    letter-spacing: 0.02em;
    color: #2a3468;
    -webkit-text-stroke: 0.36cqw #2a3468;
}

.evt_banner .evt_title::after {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, #ffc300 15%, #ffdf00 85%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-stroke: 0;
}

.evt_banner .evt_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: 1.5cqw;
    margin: 0.55cqw 0 0;
    padding: 0.65cqw 0.8cqw;
    list-style: none;
    counter-reset: evt;
    background: #2a3468;
    border-radius: 0.3cqw;
}

.evt_banner .evt_list li {
    counter-increment: evt;
    font-size: 1.14cqw;
    font-weight: 700;
    line-height: 1.35;
    color: #fff;
}

.evt_banner .evt_list li::before {
    content: counter(evt) ". ";
}

.evt_banner .evt_point {
    margin: 0.5cqw 0 0;
    font-size: 1.3cqw;
    font-weight: 700;
    line-height: 1.3;
    color: #f08a00;
}

.evt_banner .evt_desc {
    margin: 0.1cqw -3cqw 0;
    font-size: 1.16cqw;
    font-weight: 400;
    line-height: 1.4;
    color: #282828;
}

/* 오른쪽 금색 리본: 원본 GIF처럼 0.5초 간격으로 어두운/밝은 이미지 교차 */
.evt_banner .evt_ribbon {
    position: absolute;
    top: 0;
    left: 61.69cqw;
    width: 20cqw;
}

.evt_banner .evt_ribbon img {
    display: block;
    width: 100%;
}

.evt_banner .evt_ribbon .evt_ribbon_on {
    position: absolute;
    inset: 0;
    animation: evtRibbonBlink 1s steps(1, end) infinite;
}

@keyframes evtRibbonBlink {
    0% { opacity: 0; }
    50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
    .evt_banner .evt_ribbon .evt_ribbon_on {
        animation: none;
        opacity: 1;
    }
}
