/* === Base === */
.container{width:min(100%,1840px);margin-inline:auto;padding:0 20px}
.flexCol{flex-direction: column}
.muted{color:#718096}

/* 1) HERO */
.hero-video{padding:20px 0 10px; min-height: 700px;}
.hero-video .container{padding:0 12px}
.hero-video__frame{position:relative;border-radius:24px;overflow:hidden;width:100%}
.hero-video__el{width:100%;height:62vh;min-height:420px;object-fit:cover;display:block;filter:saturate(1.05) contrast(1.02)}
.hero-video__overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;text-shadow:0 8px 24px rgba(0,0,0,.5)}
.hero-video__title{font-size:clamp(24px,3.2vw,44px);font-weight:800;margin:0}
.hero-video__scroll{position:absolute;bottom:24px;left:0;right:0;display:flex;justify-content:center;opacity:.9}
.hero-video__scroll .arrow{display:inline-block;font-size:26px;border:1px solid rgba(255,255,255,.6);border-radius:999px;padding:6px 12px}

/* 2) SLOGAN */
.slogan{padding:40px 0 20px;position:relative;isolation:isolate}
.slogan_bg {
  background: url(/img/sloan_main_bg.png) no-repeat center / cover;
  justify-content: center;
}
.slogan::before{content:"";position:absolute;inset:auto 0 0 0;height:2px;background:linear-gradient(90deg,rgba(210,50,50,.2),rgba(180,180,180,.0) 60%)}
.slogan__inner{text-align:center;padding:30px 0 10px}
.slogan__cut{font-size:clamp(60px,10vw,160px);line-height:0.8;margin:0;background:url('../img/cut.jpg') center/cover no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:6px}
.slogan__kr{font-size:32px;font-weight:600;margin:14px 0 6px}
.slogan__en{font-size:24px;font-weight:400;color:rgba(0, 1, 66, 0.5)}

.main_slogan {
  width: 100%;
  max-width: 954px;
  margin-bottom: 79px;
  align-self: center;
  /*height: 226.810546875;*/
}


/* 3) EXPERT */
.expert{padding:80px 0;position:relative}
.expert::before{content:"";position:absolute;inset:0 0 auto 0;height:26px;border-top-left-radius:600px;border-top-right-radius:600px;border:3px solid #2b9cf0;border-bottom:none;pointer-events:none;transform:translateY(-24px)}
.expert__head{text-align:center;max-width:800px;margin:0 auto 24px}
.expert__icon{width:40px;height:40px;margin:0 auto 8px;opacity:.9}
.expert__media{border-radius:16px;overflow:hidden;max-width:920px;margin:0 auto 24px;border:1px solid #eee}
.expert__media img{display:block;width:100%;height:420px;object-fit:cover}
@media (max-width: 1024px) {
    .expert__media img{object-fit:contain}
}
.expert__points{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:920px;margin:0 auto}
.point strong{display:block;margin-bottom:6px}

/* 4) VALUES */
.values{padding:80px 0;background:radial-gradient(1200px 400px at 50% -200px,#f7f9fb 70%,transparent 71%)}
.values__head{max-width:920px;margin:0 auto 28px}
.values__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;
  width: fit-content;
  align-self: center;
}
.vcard{
  background:#fff;border:1px solid #edf2f7;border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.06);padding:40px;
  width: 460px;
  height: 460px;
  border-radius: 10px;
}
.vcard__icon{width:90px;height:90px;margin-bottom:10px}
.vcard h4{
  font-weight: 600;
  font-size: 24px;
  margin-bottom: 20px;
}
.vcard p{
  font-weight: 400;
  font-size: 16px;
  line-height: 150%;
}

.bg_group {
  background: linear-gradient(95.78deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.05) 100%), url("/img/Group.png");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  height: 1520px;
  justify-content: center;

}

.muted_black {
  color: black;
}

/* 5) CTA BAND */
.cta-band{
  background: url(/img/sloan_contact_bg.png) no-repeat center / cover;
  justify-content: center;
}
.cta-band__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:80px 0}
.btn{display:inline-flex;align-items:center;justify-content:center;border-radius:12px;padding:12px 18px;font-weight:700;border:1px solid transparent}
.btn--primary{background:#DD3636;color:#fff}
.btn--primary:hover{background:#DD3636;color:#fff}
.cont-title {
  font-weight: 700;
  font-size: 48px;
  line-height: 140%;
  color: white;
  margin-bottom: 40px;
}
.cont-sub {
  font-weight: 400;
  font-size: 18px;
  line-height: 160%;
  color:white;
  margin-bottom: 80px;
}

/* 6) PORTFOLIO */
.portfolio{position:relative;padding:40px 0 100px}
.portfolio{
  background: url(/img/portfol_bg.png) no-repeat center / cover;
  justify-content: center;
}
.portfolio__title{margin:0 0 12px 0}
.portfolio__waves{height:140px;background:url(/img/portfol_bg.png) center/cover no-repeat;opacity:.4}
.p-card{background:#fff;border-radius:20px;border:1px solid #e6e8ec;box-shadow:0 10px 30px rgba(0,0,0,.06);padding:20px;text-align:left;height:270px;display:flex;flex-direction:column;gap:10px}
.p-card__badge{align-self:flex-end;background:#111;color:#fff;border-radius:999px;padding:6px 12px;font-size:12px}
.p-card__logo{/*height:36px;width:auto*/}
.p-card__name{margin:6px 0 0 0;font-size:18px}
.p-card__desc{margin:0 0 auto 0;color:#4a5568}
.p-card__more{display:inline-flex;align-items:center;gap:6px;font-weight:700}

/* Responsive */
/*@media (max-width: 1024px){*/
/*  .values__grid{grid-template-columns:repeat(2,1fr)}*/
/*  .expert__points{grid-template-columns:1fr}*/
/*}*/
/*@media (max-width: 720px){*/
/*  .hero-video__el{height:46vh;min-height:340px}*/
/*  .cta-band__inner{flex-direction:column;align-items:flex-start}*/
/*  .values__grid{grid-template-columns:1fr}*/
/*}*/

.bottom_comp_logo_section {
    min-height: 400px;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}

/* 컨테이너 크기와 가운데 정렬(원하면 width 조정) */
.bottom-logo-swiper {
    width: min(100%, 1240px);
    margin-inline: auto;
    padding-block: 24px;
}

/* 연속 롤링의 핵심: easing을 linear로 강제 */
.bottom-logo-swiper .swiper-wrapper {
    transition-timing-function: linear !important;
    align-items: center;
    justify-content: center;
}

/* 각 로고 슬라이드: 자동폭 + 세로 가운데 */
.bottom-logo-swiper .swiper-slide {
    width: auto;                 /* 로고 이미지 너비만큼 */
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 로고 이미지 높이 제한(원하는 값으로 조정) */
.bottom-logo-swiper .swiper-slide img {
    /*height: 84px;                !* 필요 시 36~56px 사이로 조정 *!*/
    /*width: auto;*/
    max-width: 330px;
    display: block;
    filter: none;
}

/* 작은 화면에서 살짝 줄이기 */
@media (max-width: 720px){
    .bottom-logo-swiper .swiper-slide img { max-width: 280px; }
}

@media screen and (max-width: 1300px) {
    section {
        padding: 0 15px;
    }
}

@media screen and (max-width: 830px) {
    .slogan.bg_group {
        height: revert;
    }

    .values__grid {
        display: flex;
        flex-direction: column;
    }

    .vcard {
        width: revert;
        height: revert;
    }

}

.portfolio-swiper {
    width: 100%;
}