@charset "utf-8";

/* =========================================================
   GSAP 스크롤 애니메이션 전용 스타일 (Parallax 등)
   ========================================================= */

/* 패럴랙스 배경이 들어가는 섹션의 배경 컨테이너 설정 */
.section05_bg, .section06_bg, .section09_bg, .section11_bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden; /* 배경 이미지만 여기서 클리핑하여 섹션 밖으로 안 나가게 함 */
    z-index: -1;
}

/* 
  패럴랙스용 배경 이미지: 
  상하로 움직일 수 있는 공간 확보를 위해 위로 올리고 높이를 늘려줍니다.
*/
.parallax-bg-img {
    position: absolute;
    top: -15% !important; 
    height: 130% !important; 
    width: 100% !important;
    object-fit: cover;
    will-change: transform;
}

/* 꼭 필요한 고부하 애니메이션 요소에만 하드웨어 가속 적용 */
.parallax-bg-img,
.section01_img {
    will-change: transform;
}

/* 페이드 업 요소들은 깜빡임 방지를 위해 backface-visibility 설정 */
.section02_title, 
.section03_title, 
.section10_title,
.section11_title,
.section11_divider,
.problem_item,
.section03_card,
.s04_card,
.s11_card,
.s11_logo_item,
.video_item {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}