@charset "utf-8";

#inc04{overflow:hidden;padding:130px 0 155px;background-color:rgba(37,32,92,0.04)}
#inc04 .mo{display:none}
#inc04 .group-title{padding-bottom:85px}
#inc04 .group-title .tit--l{color:#111 !important}

#inc04 .group-cont{display:flex;justify-content:space-between;gap:75px;padding:93px 62px 96px;border-radius:20px;background-color:#fff}
#inc04 .fl-l{display:flex;flex-direction:column;align-items:flex-start}
#inc04 .fl-l h3{padding-bottom:40px;font-family:var(--sub-font);font-size:33px;font-weight:700;line-height:1.3;white-space:pre-line;color:#111827}
#inc04 .fl-l h3 b{font-weight:700;color:var(--primary)}
#inc04 .fl-l p{padding-bottom:48px;font-size:17px;font-weight:500;line-height:1.6;white-space:pre-line;word-break:keep-all;color:#303842}
#inc04 .fl-l .btn--primary{max-width:180px;width:100%}
#inc04 .fl-l .btn--primary .txt{gap:20px}

#inc04 .fl-r{max-width:724px;width:100%;aspect-ratio:724 / 402}
#inc04 .fl-r .swiper-container{width:100%;height:100%;border-radius:16px}
#inc04 .fl-r .swiper-slide img{width:100%;height:100%;object-fit:cover}
#inc04 .fl-r .swiper-slide .overlay{position:absolute;inset:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:7px;padding:40px 42px;background:linear-gradient(to bottom, rgba(37,32,92,0) 50%, var(--secondary) 100%)}
#inc04 .fl-r .swiper-slide .overlay h4{font-size:32px;font-weight:700;color:#fff}
#inc04 .fl-r .swiper-slide .overlay p.desc{font-size:17px;font-weight:600;line-height:1.5;word-break:keep-all;color:rgba(255,255,255,0.9)}
#inc04 .fl-r .swiper-navigation{position:absolute;top:35px;right:35px;z-index:2;display:flex;gap:13px}
#inc04 .fl-r .swiper-navigation button{all:unset;display:flex;align-items:center;justify-content:center;width:48px;aspect-ratio:1;border-radius:100px;border:2px solid rgba(235,237,243,0.5);color:rgba(255,255,255,0.8);cursor:pointer;transition:background-color 0.3s, border-color 0.3s, color 0.3s}
#inc04 .fl-r .swiper-navigation button:hover{background-color:#fff;border-color:#ebedf3;color:#145CE6}

/* 반응형 [s] */
@media (max-width:1600px){
#inc04{padding:110px 0 130px}
#inc04 .group-title{padding-bottom:70px}
}
@media (max-width:1400px){
#inc04{padding:100px 20px 110px}
#inc04 [data-aos=fade-right], #inc04 [data-aos=fade-left]{transform:translate3d(0,0,0)}
#inc04 [data-aos=fade-right].aos-animate, #inc04 [data-aos=fade-left].aos-animate{transform:translate3d(0,0,0)}
#inc04 .group-title{padding-bottom:40px}
#inc04 .group-cont{flex-direction:column;gap:30px;padding:38px 20px 25px}
#inc04 .fl-l{align-items:center;text-align:center}
#inc04 .fl-l h3{padding-bottom:22px;font-size:28px}
#inc04 .fl-l p{max-width:380px;padding-bottom:20px;font-size:16px;white-space:normal}
#inc04 .fl-r{max-width:100%;width:100%;aspect-ratio:724 / 320}
#inc04 .fl-r .swiper-slide .overlay h4{font-size:28px}
}
@media (max-width:1200px){
#inc04{padding:80px 20px 90px}
#inc04 .group-title{padding-bottom:40px}
#inc04 .fl-l h3{font-size:24px}
#inc04 .fl-r{aspect-ratio:724 / 280}   
}
@media (max-width:1024px){
#inc04{padding:80px 20px}
#inc04 .group-title{padding-bottom:35px}
#inc04 .group-cont{padding:32px 20px 25px}
#inc04 .fl-l h3{padding-bottom:15px;font-size:22px}
#inc04 .fl-l p{padding-bottom:15px}
#inc04 .fl-r .swiper-container{border-radius:10px}
#inc04 .fl-r .swiper-slide .overlay h4{font-size:24px}
#inc04 .fl-r .swiper-slide .overlay p.desc{font-size:16px}
#inc04 .fl-r .swiper-navigation{top:25px;right:25px;gap:8px}
#inc04 .fl-r .swiper-navigation button{width:42px}
}
@media (max-width:768px){
#inc04{padding:60px 20px}
#inc04 .group-title{padding-bottom:25px}
#inc04 .group-cont{padding:30px 20px;gap:24px}
#inc04 .fl-l h3{padding-bottom:10px;font-size:20px}
#inc04 .fl-l p{font-size:15px;line-height:1.5}
#inc04 .fl-l .btn--primary{max-width:none;width:auto}
#inc04 .fl-r{height:300px}
#inc04 .fl-r .swiper-slide .overlay{padding:30px;background:linear-gradient(to bottom, rgba(37,32,92,0) 30%, var(--secondary) 100%)}
#inc04 .fl-r .swiper-slide .overlay h4{font-size:20px}
#inc04 .fl-r .swiper-navigation{top:20px;right:20px;gap:6px}
#inc04 .fl-r .swiper-navigation button{width:36px}
#inc04 .fl-r .swiper-navigation button svg{width:20px;height:20px}
}
@media (max-width:480px){
#inc04 .mo{display:block}
#inc04 .group-title .tit--l{white-space:normal !important}
#inc04 .fl-l h3{font-size:18px}
#inc04 .fl-l p{max-width:none;font-size:14px}
#inc04 .fl-r .swiper-slide .overlay{padding:20px}
#inc04 .fl-r .swiper-slide .overlay h4{font-size:18px}
#inc04 .fl-r .swiper-slide .overlay p.desc{font-size:14px}
}
/* 반응형 [e] */