.curr {
    position: relative;
    overflow: hidden;
    max-width: 1200px;
    margin: 0 auto; /* 가운데 정렬 */
}
.curr img.curr-1 {
    position: absolute;
    top: 27%;
    left: 28.5%;
    opacity: 0; /* 초기 상태 숨김 */
    transform: translateX(-200px); /* 초기 위치 */
    transition: all 1s ease-out; /* CSS transition으로 변경 */
}
.curr img.curr-2 {
    position: absolute;
    top: 36.5%;
    left: 42.5%;
    opacity: 0; /* 초기 상태 숨김 */
    transform: translateX(-200px); /* 초기 위치 */
    transition: all 1s ease-out; /* CSS transition으로 변경 */
}
.curr img.curr-3 {
    position: absolute;
    top: 47%;
    left: 50%;
    opacity: 0; /* 초기 상태 숨김 */
    transform: translateX(-200px); /* 초기 위치 */
    transition: all 1s ease-out; /* CSS transition으로 변경 */
}
.curr img.curr-4 {
    position: absolute;
    top: 64.5%;
    left: 50%;
    opacity: 0; /* 초기 상태 숨김 */
    transform: translateX(-200px); /* 초기 위치 */
    transition: all 1s ease-out; /* CSS transition으로 변경 */
}
.curr img.curr-5 {
    position: absolute;
    top: 82%;
    left: 50%;
    opacity: 0; /* 초기 상태 숨김 */
    transform: translateX(-200px); /* 초기 위치 */
    transition: all 1s ease-out; /* CSS transition으로 변경 */
}
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateX(-200px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* 반응형 이미지 크기 조정 */
.curr img.curr-1 {max-width: 25.6%;}
.curr img.curr-2 {max-width: 26.7%;}
.curr img.curr-3 {max-width: 41.3%;}
.curr img.curr-4 {max-width: 45.9%;}
.curr img.curr-5 {max-width: 45.2%;}
.curr img.curr-1,
.curr img.curr-2,
.curr img.curr-3,
.curr img.curr-4,
.curr img.curr-5 {
    height: auto; /* 비율 유지 */
    width: auto; /* 자동 너비 */
}

/* 태블릿 크기에서 이미지 크기 조정 */
@media (max-width: 1024px) {
    /* .curr img.curr-1,
    .curr img.curr-2,
    .curr img.curr-3,
    .curr img.curr-4,
    .curr img.curr-5 {
        max-width: 12%;
    } */
}

/* 모바일에서 이미지 크기 조정 */
@media (max-width: 767px) {
    /* .curr img.curr-1,
    .curr img.curr-2,
    .curr img.curr-3,
    .curr img.curr-4,
    .curr img.curr-5 {
        max-width: 10%;
    } */
    
    /* 모바일에서 위치도 미세 조정 */
    .curr img.curr-1 {
        top: 25%;
        left: 30%;
    }
    
    .curr img.curr-2 {
        top: 35%;
        left: 42%;
    }
    
    .curr img.curr-3 {
        top: 46%;
        left: 50%;
    }
    
    .curr img.curr-4 {
        top: 63%;
        left: 50%;
    }
    
    .curr img.curr-5 {
        top: 80%;
        left: 50%;
    }
}

/* 애니메이션 활성화 클래스 */
.curr img.curr-1.animate,
.curr img.curr-2.animate,
.curr img.curr-3.animate,
.curr img.curr-4.animate,
.curr img.curr-5.animate {
    opacity: 1;
    transform: translateX(0);
}

