@charset "utf-8";

#inc05{padding-top:380px;background-color:#fff;overflow:hidden}
#inc05 .group-cont .marquee-container{--gap:35px;--x:-2827px;position:relative;display:flex;flex-direction:column;gap:30px}
#inc05 .group-cont .marquee-container::before, #inc05 .group-cont .marquee-container::after{position:absolute;content:'';width:710px;height:230px;top:50%;transform:translateY(-50%);z-index:1;pointer-events:none}
#inc05 .group-cont .marquee-container::before{left:0;background:linear-gradient(to right,rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%  )}
#inc05 .group-cont .marquee-container::after{right:0;background:linear-gradient(to left,rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%  )}
#inc05 .group-cont .marquee-wrapper{display:flex;gap:var(--gap)}
#inc05 .group-cont .marquee-wrapper ul{display:flex;gap:var(--gap)}
#inc05 .group-cont .marquee-wrapper ul li{flex-shrink:0;display:flex;align-items:center;justify-content:center;background-color:#fff;box-shadow:6px 6px 8px rgba(0,0,0,0.05);border-radius:8px;width:283px;height:83px}
#inc05 .group-cont .marquee-wrapper.to-left{animation:marquee 70s linear infinite}
#inc05 .group-cont .marquee-wrapper.to-right{animation:marquee 70s linear infinite reverse}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(calc(var(--x) - var(--gap)))}}

#inc05 .group-cont .banner-container{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;padding-top:305px;padding-bottom:120px}
#inc05 .group-cont .banner-container .link-banner{overflow:hidden;position:relative;padding:90px 60px 70px;border-radius:8px;color:#fff}
#inc05 .group-cont .banner-container .link-banner::before{z-index:1;position:absolute;content:'';inset:0%;width:100%;height:100%;background-color:rgba(0,0,0,0.2)}
#inc05 .group-cont .banner-container .link-banner img{z-index:0;position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease-in-out}
#inc05 .group-cont .banner-container .link-banner > *{position:relative;z-index:2}
#inc05 .group-cont .banner-container .link-banner h3{font-size:40px;font-weight:600;white-space:pre-line}
#inc05 .group-cont .banner-container .link-banner h4{display:flex;justify-content:flex-end;align-items:center;gap:10px;font-size:18px;font-weight:600}
#inc05 .group-cont .banner-container .link-banner h4 svg{flex-shrink:0}
#inc05 .group-cont .banner-container .link-banner:hover img{transform:scale(1.1)}

/* 반응형 [s] */
@media (max-width:1800px){
#inc05{padding-top:180px}
#inc05 .group-title h2{padding:0 20px}
#inc05 .group-cont .banner-container{padding:180px 20px 100px}
}
@media (max-width:1600px){
#inc05 .group-cont .banner-container .link-banner h3{font-size:35px}
}
@media (max-width:1400px){
#inc05 .group-cont .marquee-container{--gap:20px;--x:-2320px;gap:var(--gap)}
#inc05 .group-cont .marquee-container::before, #inc05 .group-cont .marquee-container::after{width:300px;height:170px}
#inc05 .group-cont .marquee-wrapper ul li{width:240px;height:75px}
#inc05 .group-cont .marquee-wrapper ul li img{transform:scale(0.8)}
#inc05 .group-cont .banner-container .link-banner{padding:80px 45px 60px}
#inc05 .group-cont .banner-container .link-banner h3{font-size:30px}
}
@media (max-width:1200px){
#inc05{padding-top:100px}
#inc05 .group-cont .banner-container{padding:100px 20px 80px}
#inc05 .group-cont .banner-container .link-banner{padding:70px 40px 50px}
#inc05 .group-cont .banner-container .link-banner h3{font-size:25px}
#inc05 .group-cont .banner-container .link-banner h4 svg{width:22px;height:22px}
}
@media (max-width:1024px){
#inc05 .group-cont .marquee-container{--gap:10px;--x:-1835px}
#inc05 .group-cont .marquee-container::before, #inc05 .group-cont .marquee-container::after{width:150px}
#inc05 .group-cont .marquee-wrapper ul li{width:195px;height:68px}
#inc05 .group-cont .marquee-wrapper ul li img{transform:scale(0.6)}
#inc05 .group-cont .banner-container{grid-template-columns:repeat(1,1fr)}
#inc05 .group-cont .banner-container .link-banner{padding:60px 30px 50px}
}
@media (max-width:768px){
#inc05{padding-top:70px}
#inc05 .group-cont .marquee-container{--x:-1610px}
#inc05 .group-cont .marquee-wrapper.to-left{animation:marquee 50s linear infinite}
#inc05 .group-cont .marquee-wrapper.to-right{animation:marquee 50s linear infinite reverse}
#inc05 .group-cont .marquee-wrapper ul li{width:170px;height:60px}
#inc05 .group-cont .banner-container{padding:70px 20px 50px}
#inc05 .group-cont .banner-container .link-banner h3{font-size:22px}
#inc05 .group-cont .banner-container .link-banner h4{gap:6px;font-size:16px}
#inc05 .group-cont .banner-container .link-banner h4 svg{width:20px;height:20px}
}
@media (max-width:480px){
#inc05{padding-top:60px}
#inc05 .group-cont .marquee-container{--x:-1340px}
#inc05 .group-cont .marquee-container::before, #inc05 .group-cont .marquee-container::after{width:60px}
#inc05 .group-cont .marquee-wrapper ul li{width:140px;height:55px}
#inc05 .group-cont .marquee-wrapper ul li img{transform:scale(0.45)}
#inc05 .group-cont .banner-container{padding:60px 20px 0}
#inc05 .group-cont .banner-container .link-banner{padding:50px 30px 40px}
#inc05 .group-cont .banner-container .link-banner::before{background-color:rgba(0,0,0,0.35)}
#inc05 .group-cont .banner-container .link-banner h3{font-size:18px}
#inc05 .group-cont .banner-container .link-banner h4{font-size:14px}
#inc05 .group-cont .banner-container .link-banner h4 svg{width:18px;height:18px}
}
/* 반응형 [e] */