/* ─────────────────────────────────────────────────────────
   00. FONT / RESET / GLOBAL
   ───────────────────────────────────────────────────────── */

@font-face {
  font-family: 'Pretendard';
  src: local('Pretendard');
  font-display: swap;

}

@font-face{
  font-family:"Trap";
  src:url("./font/Trap-ExtraBold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html,
body{
  width:100%;
  min-height:100%;
  overflow-x:hidden;
  font-family:"Pretendard",sans-serif;
  background:#0b0b0b;
}

::-webkit-scrollbar{
  display:none;
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.32);
  z-index:2;
  pointer-events:none;
}

/* ─────────────────────────────────────────────────────────
   01. HEADER / NAV
   ───────────────────────────────────────────────────────── */
.top-logo{
  display:none !important;
}

/* =========================
   MOBILE HEADER BASE
========================= */
.mobile-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:99999;

  display:flex;
  align-items:center;
  justify-content:space-between;

  height:74px;
  padding:0 34px;

  background:transparent;
  border:0;
  box-shadow:none;
  backdrop-filter:none;

  opacity:1;
  transform:translateY(0);

  pointer-events:none;

  transition:
    opacity .35s ease,
    transform .35s ease,
    background .35s ease,
    backdrop-filter .35s ease,
    border-color .35s ease;
}

.mobile-header.is-hidden{
  opacity:0;
  transform:translateY(-14px);
}

.mobile-header.is-visible{
  opacity:1;
  transform:translateY(0);
}

.mobile-header.is-solid{
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(0,0,0,.04);
}

/* =========================
   LEFT / RIGHT POINTER FIX
========================= */
.mobile-logo,
.mobile-header-right{
  pointer-events:auto;
}

.mobile-logo img{
  width:110px;
  display:block;
}

.mobile-header-right{
  display:flex;
  align-items:center;
  gap:14px;
}

/* =========================
   CONTACT BUTTON
========================= */
.mobile-contact-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  height:38px;
  padding:0 22px;

  border-radius:999px;

  background:#b6ff00;
  color:#0b0b0b;

  font-size:.92rem;
  font-weight:700;
  letter-spacing:-.02em;
  text-decoration:none;

  transition:.25s ease;
}

.mobile-contact-btn:hover{
  transform:translateY(-1px);
}

/* =========================
   HAMBURGER (FIXED STRUCTURE)
   ❗ 핵심: flex + gap 제거
========================= */
.mobile-menu-btn{
  position:relative;
  width:42px;
  height:42px;

  border:0;
  border-radius:50%;

  display:flex;
  align-items:center;
  justify-content:center;

  background:rgba(255,255,255,.04);
  backdrop-filter:blur(10px);

  cursor:pointer;
  transition:.25s ease;
}

/* 줄 2개 완전 고정 */
.mobile-menu-btn span{
  position:absolute;
  left:50%;

  width:18px;
  height:2px;

  border-radius:999px;
  background:#fff;

  transform-origin:center;
  transition:.3s ease;
}

/* 기본 위치 */
.mobile-menu-btn span:first-child{
  transform:translate(-50%, -4px);
}

.mobile-menu-btn span:last-child{
  transform:translate(-50%, 4px);
}

/* =========================
   ACTIVE → X 변환
========================= */
.mobile-menu-btn.active span:first-child{
  transform:translate(-50%, 0) rotate(45deg);
}

.mobile-menu-btn.active span:last-child{
  transform:translate(-50%, 0) rotate(-45deg);
}

/* solid 상태 */
.mobile-header.is-solid .mobile-menu-btn{
  background:rgba(0,0,0,.05);
}

.mobile-header.is-solid .mobile-menu-btn span{
  background:#0b0b0b;
}

/* =========================
   MENU PANEL
========================= */
.mobile-menu{
  position:fixed;
  top:86px;
  right:34px;

  width:280px;
  z-index:99998;

  display:flex;
  flex-direction:column;

  padding:10px;

  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;

  background:rgba(12,12,16,.92);
  backdrop-filter:blur(20px);

  opacity:0;
  visibility:hidden;
  transform:translateY(-10px);

  transition:.28s cubic-bezier(.22,1,.3,1);
}

.mobile-menu.show{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.mobile-menu a{
  display:flex;
  align-items:center;
  justify-content:space-between;

  padding:15px 16px;

  border-radius:14px;

  color:rgba(255,255,255,.88);

  font-size:.96rem;
  font-weight:600;
  text-decoration:none;

  transition:.22s ease;
}

.mobile-menu a::after{
  content:"→";
  color:#b6ff00;
}

.mobile-menu a:hover{
  background:rgba(255,255,255,.06);
}

/* ─────────────────────────────────────────────────────────
   01-1. HEADER / NAV — RESPONSIVE
   ───────────────────────────────────────────────────────── */

@media (max-width:768px){

  .mobile-header{
    height:58px;
    padding:0 18px;
    padding-top:env(safe-area-inset-top);
  }

  .mobile-logo img{
    width:90px;
  }

  .mobile-header-right{
    gap:10px;
  }

  .mobile-contact-btn{
    height:28px;
    padding:0 14px;
    font-size:.78rem;
  }

  .mobile-menu-btn{
    width:34px;
    height:34px;
  }

  .mobile-menu-btn span{
    width:15px;
  }

  .mobile-menu{
    top:58px;
    left:14px;
    right:14px;

    width:auto;
    border-radius:18px;
  }

  .mobile-menu a{
    padding:14px;
    font-size:.9rem;
  }
}

/* ─────────────────────────────────────────────────────────
   02. FIXED ELEMENTS
   ───────────────────────────────────────────────────────── */

/* TOP LOGO */
.top-logo{
  position: fixed;
  top: 30px;
  left: 30px;
  z-index: 9999;
}

.top-logo img{
  width: 120px;
  display: block;
}

.floating-contact{
  position:fixed;
  right:1.8rem;
  bottom:1.8rem;
  z-index:9999;
}

.floating-contact img{
  width:4.8rem;
  display:block;
  transition:.35s ease;
}

.floating-contact:hover img{
  transform:translateY(-4px) scale(1.04);
}

.infos,
.hint,
.copy,
.loading,
canvas{
  display:none !important;
}
/* ─────────────────────────────────────────────────────────
   03. SECTION 1 — HERO
   ───────────────────────────────────────────────────────── */

.hero-shape-section{
  position:relative;
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#0b0b0b;
  color:#fff;
}

.hero-shape-inner{
  position:relative;
  z-index:5;
  width:min(1120px, calc(100% - 200px));
  min-height:750px;
}

.hero-shape-copy{
  position:absolute;
  left:0;
  top:45%;
  z-index:10;
  width:760px;
  transform:translateY(-48%);
}

.hero-shape-main{
  margin-bottom:24px;
  color:#b6ff00;
  font-family:"Trap","Inter",sans-serif;
  font-size:1.32rem;
  font-weight:700;
}

.hero-shape-title{
  margin:0;
  color:#fff;
  font-size:clamp(3rem, 4.3vw, 3.8rem);
  font-weight:600;
  line-height:1.4;
  letter-spacing:-.04em;
}

.hero-shape-title > span{
  display:block;
}

.hero-title-line{
  display:flex;
  align-items:center;
  gap:.22em;
  flex-wrap:nowrap;
}

.hero-word-pill{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:5.25em;
  height:1.22em;
  padding:0 .42em;
  overflow:hidden;
  border:1.5px solid rgba(182,255,0,.75);
  border-radius:999px;
  color:#b6ff00;
  font-size:1em;
  line-height:1;
  letter-spacing:-.04em;
  white-space:nowrap;
}

.hero-word-inner{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.18em;
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
  will-change:opacity, transform, filter;
  backface-visibility:hidden;
}

.hero-word-inner.is-show{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  filter:blur(0);
}

.hero-word-inner.is-leave{
  opacity:0;
  transform:translate3d(0,0,0) scale(.985);
  filter:blur(1.5px);
  transition:opacity .22s ease, transform .28s cubic-bezier(.22,1,.36,1), filter .22s ease;
}

.hero-word-inner.is-enter{
  animation:heroWordSoftChange .46s cubic-bezier(.22,1,.36,1) both;
}

.hero-word-dot{
  flex:0 0 auto;
  width:.68em;
  height:.68em;
  background:var(--hero-shape) center/contain no-repeat;
  animation:heroShapeSpin 10s linear infinite;
}

#heroWord,
.hero-fixed-word{
  display:inline-block;
  white-space:nowrap;
}

#heroWord{
  color:#b6ff00;
}

.hero-shape-desc{
  position:absolute;
  left:0;
  top:calc(46% + 175px);
  z-index:10;
  margin:0;
  color:rgba(255,255,255,.65);
  font-size:1.2rem;
  line-height:1.6;
  letter-spacing:-.03em;
}

/* ROTATOR */
.hero-rotator{
  --hero-depth:300px;
  position:absolute;
  right:0px;
  top:50%;
  z-index:4;
  width:435px;
  height:650px;
  perspective:1200px;
  transform:translateY(-48%) rotateZ(8deg);
}

.hero-rotator-card{
  position:relative;
  width:100%;
  height:100%;
  transform-style:preserve-3d;
  animation:heroCarouselSpin 9.5s linear infinite;
}

.hero-carousel-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:30px;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  box-shadow:0 36px 80px rgba(0,0,0,.92);
  opacity:.3;
  filter:brightness(.5);
  transform:rotateY(var(--hero-angle)) translateZ(var(--hero-depth));
  transition:opacity .45s ease, filter .45s ease;
  will-change:opacity, filter;
}

.hero-carousel-img.is-active{
  opacity:1;
  filter:brightness(1);
}

.hero-carousel-img.is-near{
  opacity:.4;
  filter:brightness(.6);
}

.hero-img-1{ --hero-angle:0deg; }
.hero-img-2{ --hero-angle:72deg; }
.hero-img-3{ --hero-angle:144deg; }
.hero-img-4{ --hero-angle:216deg; }
.hero-img-5{ --hero-angle:288deg; }

/* CTA */
.hero-shape-btn{
  --btn-left:40%;
  --btn-top:90%;
  --btn-size:140px;
  --btn-text-left:17px;
  --btn-text-top:47px;
  --btn-text-width:78px;
  --btn-text-size:1.34rem;
  --btn-arrow-right:20px;
  --btn-arrow-top:47px;
  --btn-arrow-size:23px;

  position:absolute;
  left:var(--btn-left);
  top:var(--btn-top);
  z-index:20;
  display:block;
  width:var(--btn-size);
  height:var(--btn-size);
  border-radius:50%;
  background:#b6ff00;
  color:#0b0b0b;
  text-decoration:none;
  transform:translate(-50%, -50%);
  transition:transform .35s cubic-bezier(.16,1,.3,1);
}

.hero-shape-btn:hover{
  transform:translate(-50%, -50%) scale(1.05);
}

.hero-shape-btn span{
  position:absolute;
  left:var(--btn-text-left);
  top:var(--btn-text-top);
  width:var(--btn-text-width);
  color:#0b0b0b;
  font-family:"Trap","Inter",sans-serif;
  font-size:var(--btn-text-size);
  font-weight:800;
  line-height:1.15;
  letter-spacing:-.02em;
}

.hero-shape-btn::after{
  display:none;
  content:none;
}

.hero-btn-arrow{
  position:absolute;
  right:var(--btn-arrow-right);
  top:var(--btn-arrow-top);
  width:var(--btn-arrow-size);
  animation:heroArrowMove 1.15s ease-in-out infinite;
}

/* KEYFRAMES */
@keyframes heroWordSoftChange{
  0%{ opacity:0; transform:scale(.985); filter:blur(1.5px); }
  100%{ opacity:1; transform:scale(1); filter:blur(0); }
}

@keyframes heroShapeSpin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}

@keyframes heroCarouselSpin{
  from{ transform:rotateY(0deg); }
  to{ transform:rotateY(-360deg); }
}

@keyframes heroArrowMove{
  0%,100%{ translate:0 0; }
  50%{ translate:5px 0; }
}

/* PC / NOTEBOOK */
@media (max-width:1440px){

    .hero-rotator {
        --hero-depth: 290px;
        right: 70px;
        width: 420px;
        height: 600px;
    }
    
  .hero-shape-inner{
    width:calc(100% - 250px);
  }

  .hero-shape-copy{
    width:720px;
  }

  .hero-shape-desc{
    top:calc(46% + 155px);
  }

  .hero-shape-btn{
        --btn-left: 40%;
        --btn-top: 85%;
        --btn-size: 130px;
        --btn-text-left: 17px;
        --btn-text-top: 47px;
        --btn-text-width: 78px;
        --btn-text-size: 1.2rem;
        --btn-arrow-right: 20px;
        --btn-arrow-top: 47px;
        --btn-arrow-size: 23px;
  }

  .hero-shape-title{font-size:clamp(2.7rem, 4vw, 3.8rem);
  }
  .hero-shape-desc{font-size: 1.1rem;}
  .hero-shape-main{font-size: 1.25rem;
  margin-bottom:20px;}


}

@media (max-width: 1300px) {
.hero-rotator{
            --hero-depth: 255px;
        right: 35px;
        width: 370px;
        height: 530px;}

    .hero-shape-btn {
--btn-left: 45%;
        --btn-top: 80%;
        --btn-size: 120px;
        --btn-text-left: 17px;
        --btn-text-top: 40px;
        --btn-text-width: 78px;
        --btn-text-size: 1.1rem;
        --btn-arrow-right: 20px;
        --btn-arrow-top: 40px;
        --btn-arrow-size: 23px;
    }}

/* 캡쳐 구간 유지 */
@media (max-width:1200px){
  .hero-shape-inner{
    width:calc(100% - 200px);
  }

  .hero-shape-copy{
    width:620px;
  }

  .hero-shape-title{
    line-height:1.32;
  }

  .hero-word-pill{
    width:5.35em;
    font-size:1em;
  }

  .hero-shape-desc{
    top:calc(45% + 150px);
    font-size:1.05rem;
  }

  .hero-rotator{
    --hero-depth:255px;
    right:0;
    width:370px;
    height:490px;
  }

  .hero-shape-btn{
        --btn-left:45%;
        --btn-top: 80%;
        --btn-size: 115px;
        --btn-text-left: 15px;
        --btn-text-top: 38px;
        --btn-text-width: 66px;
        --btn-text-size: 1.12rem;
        --btn-arrow-right: 18px;
        --btn-arrow-top: 38px;
        --btn-arrow-size: 19px;
  }
}


@media (max-width:1024px){
  .hero-shape-inner{
    width:calc(100% - 150px);
    min-height:660px;
  }

  .hero-shape-copy{
    width:580px;
  }

  .hero-shape-title{
    line-height:1.3;
  }

  .hero-word-pill{
    width:5.35em;
    font-size:1em;
  }

  .hero-shape-desc{
    top:calc(46% + 140px);
    font-size:.98rem;
  }
/*
  .hero-rotator{
    --hero-depth:235px;
    right:-150px;
    width:335px;
    height:445px;
  }
*/
  .hero-shape-btn{
        --btn-left: 50%;
        --btn-top: 90%;
        --btn-size: 105px;
        --btn-text-left: 15px;
        --btn-text-top: 36px;
        --btn-text-width: 58px;
        --btn-text-size: 1rem;
        --btn-arrow-right: 16px;
        --btn-arrow-top: 36px;
        --btn-arrow-size: 17px;
  }
}

/* MOBILE */
@media (max-width:768px){
  .hero-shape-btn{
    display:none;
  }

  .hero-shape-section{
    min-height:100svh;
    height:100svh;
    padding:0;
    align-items:center;
    justify-content:center;
  }

  .hero-shape-inner{
    width:calc(100% - 76px);
    min-height:calc(100svh - 58px);
    padding-top:48px;
    display:grid;
    grid-template-rows:auto minmax(270px, 42svh) auto;
    align-content:center;
    gap:clamp(8px, 1.4svh, 16px);
  }

  .hero-shape-copy{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    margin:0;
    transform:none;
  }

  .hero-shape-main{
    margin-bottom:clamp(8px, 1.2svh, 12px);
    font-size:clamp(.98rem, 3.1vw, 1rem);
  }

  .hero-shape-title{
    font-size:clamp(2rem, 8.5vw, 2.72rem);
    line-height:1.3;
    letter-spacing:-.045em;
  }

  .hero-title-line{
    align-items:center;
    gap:.16em;
    line-height:1.3;
  }

  .hero-fixed-word{
    font-size:1em;
    line-height:1.3;
  }

  .hero-word-pill{
    width:5.35em;
    height:1.22em;
    padding:0 .34em;
    font-size:1em;
    line-height:1;
    transform:none;
  }

  .hero-word-inner{
    font-size:1em;
    line-height:1;
  }

  .hero-rotator{
    --hero-depth:clamp(175px, 45vw, 210px);
    position:relative;
    right:auto;
    top:40px;
    width:min(330px, 85vw);
    height:min(500px, 56svh);
    margin:0 auto;
    perspective:900px;
    transform:translateX(18px) rotateZ(8deg);
  }

  .hero-shape-desc{
    position:relative;
    left:auto;
    top:auto;
    margin-top:20px;
    color:rgba(255,255,255,.9);
    line-height:1.6;
    font-weight:500;
  }

  .sw-campaign-tab, .sw-channel-tab{    height: 38px;
    padding: 0 1.5rem;
    border: 1px solid #e1e4eb;
    border-radius: 999px;
    background: #0b0b0b;
    color: #fff;
    font-family: inherit;
    font-size: .9rem;
    font-weight: 600;
    cursor: pointer;
    transition: .32s ease;}
}

@media (max-width:441px){
  .hero-shape-inner{
    min-height:calc(100svh - 58px);
    padding-top:10px;
    grid-template-rows:auto minmax(230px, 38svh) auto;
    gap:clamp(6px, 1.2svh, 12px);

    width: calc(100% - 36px);
  }

  .hero-shape-title{
    font-size:clamp(1.86rem, 8.3vw, 2.35rem);
    line-height:1.3;
  }

  .hero-word-pill{
    font-size:1em;
  }

  .hero-rotator{
    --hero-depth:clamp(132px, 39vw, 150px);
    width:min(217px, 64vw);
    height:min(340px, 56svh);
    transform:translateX(14px) rotateZ(10deg);
    padding-top: 10px;
  }

  .hero-shape-desc{
    top:auto;
    margin-top:8px;
    font-size:.87rem;
    line-height:1.63;
  }
}

@media (max-width:375px){
  .hero-rotator{
width: min(202px, 64vw);
        --hero-depth: clamp(132px, 37vw, 150px);
  }

  .hero-shape-desc{
    top:auto;
    margin-top:6px;
  }
}
/* ─────────────────────────────────────────────────────────
   04. SECTION 2 — INFLUENCER MATCHING
   ───────────────────────────────────────────────────────── */

.sw-section2{
  position:relative;
  z-index:30;
  padding:7rem 0 6.2rem;
  background:#fff;
  color:#0b0b0b;
  overflow:hidden;
}

.sw-section2-inner{
  width:min(1120px, 92vw);
  margin:0 auto;
  text-align:left;

  display:grid;
  grid-template-columns:40% 60%;
  grid-template-areas:
    "title filter"
    "desc media";
  align-items:center;
}

/* LEFT */
.hero-shape-section2{
  grid-area:auto;
  display:block;
  align-self:end;
  margin:0 0 -7rem 0;

  color:#b6ff00;
  font-family:"Trap","Inter",sans-serif;
  font-size:1.3rem;
  font-weight:700;
  line-height:1.2;
  text-align:left;
}

.sw-section2-title{
  grid-area:desc;
  align-self:center;

  margin:0 0 13rem 0;

  color:#0b0b0b;
  font-size:clamp(2.7rem, 4.3vw, 3.8rem);
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.02em;
  text-align:left;
}

.sw-sub-guide-wrap{
  grid-area:desc;

  display:flex;
  align-items:center;
  gap:1rem;

  margin-top:2.7rem;
}

.hero-shape-guide-icon{
  width:18px;
  height:18px;
  flex:0 0 auto;

  margin:-1.6rem .2rem 0 0;

  animation:spinGuide 5s linear infinite;
  transform-origin:center center;
}

.sw-section2-desc{
  margin:1rem auto 0;
  max-width:620px;

  color:#7a7979;
  font-size:1.14rem;
  font-weight:500;
  line-height:1.55;
  letter-spacing:-.015em;
  text-align:center;
}

.sw-section2-desc-2{
  margin:0;

  color:#0b0b0b;
  font-size:1.25rem;
  font-weight:500;
  line-height:1.5;
  text-align:left;
}

/* RIGHT AREA */
.sw-filter-box{
  grid-area:filter;

  width:100%;
  max-width:750px;
  margin:0 auto;

  border:0;
  border-radius:0;
  background:transparent;
 overflow:visible;
}

.sw-sub-guide,
.sw-filter-divider,
.sw-arrow-down{
  display:none !important;
}

/* MAIN CATEGORY */
.sw-main-category{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:3.8rem;

  min-height:46px;
  border-bottom:1px solid #e8ebef;
}

.sw-main-btn{
  position:relative;

  height:46px;
  padding:0;

  border:0;
  background:transparent;
  color:#9c9c9c;

  font-family:inherit;
  font-size:1.1rem;
  font-weight:600;
  letter-spacing:-.025em;
  white-space:nowrap;

  cursor:pointer;
  transition:.25s ease;
}

.sw-main-btn.active{
  color:#0b0b0b;
  font-weight:700;
}

.sw-main-btn.active::before{
  display:none !important;
}

.sw-main-btn.active::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-.5px;

  height:5px;
  background:#b6ff00;
}

/* SUB CATEGORY */
.sw-sub-box{
  padding:.9rem 0 0;
  min-height:auto;
  background:transparent;
   overflow:visible;
}

.sw-sub-group{
  display:none;
  justify-content:center;
  align-content:flex-start;
  flex-wrap:wrap;
  gap:7px;
}

.sw-sub-group.active{
  display:flex;
  animation:swSubFadeUp .35s cubic-bezier(.22,1,.3,1);
}

.sw-sub-btn{
  height:35px;
  padding:0 15px;

  border:1px solid #dfe4ea;
  border-radius:999px;
  background:#fff;
  color:#9c9c9c;

  font-family:inherit;
  font-size:1rem;
  font-weight:600;
  letter-spacing:-.02em;
  white-space:nowrap;

  cursor:pointer;
  transition:.25s ease;
    transform-origin:center center;
  will-change:transform;
}

.sw-sub-btn.active{
  border-color:#b6ff00;
  background:#b6ff00;
  color:#0b0b0b;
  font-weight:700;
}

/* RESULT */
.sw-selected-pill{
  grid-area:media;
  position:relative;

  width:100%;
  margin:3rem auto 0 !important;
  align-self:start;

  display:flex;
  align-items:center;
  justify-content:center;

  border:0;
  background:transparent;

  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  pointer-events:none;
  z-index:20;

  transition:
    opacity .32s ease,
    transform .38s cubic-bezier(.22,1,.3,1),
    visibility 0s linear .32s;
}

.sw-selected-pill.show{
  opacity:1;
  visibility:visible;
  transform:translateY(0);

  transition:
    opacity .32s ease,
    transform .38s cubic-bezier(.22,1,.3,1),
    visibility 0s;
}

.sw-selected-pill::before{
  display:none !important;
}

.sw-selected-pill-inner{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
}

.sw-target-icon{
  position:relative;

  width:24px;
  height:24px;
  flex:0 0 auto;

  background:transparent;
}

.sw-target-icon::before{
  display:none;
}

.sw-target-icon::after{
  content:"✦";
  position:absolute;
  inset:0;

  display:flex;
  align-items:center;
  justify-content:center;

  color:#b6ff00;
  font-size:1.6rem;
  line-height:1;
}

.sw-result-text{
  display:block;

  color:#0b0b0b;
  font-size:1.3rem;
  font-weight:700;
  line-height:1.45;
  letter-spacing:-.02em;
}

.sw-result-text strong{
  display:inline;

  color:#0b0b0b;
  font-weight:700;
  background:#b6ff00;

  padding:0 3px;
  border-radius:5px;
  line-height:1;
  letter-spacing:-.04em;
}

/* VIDEO */
.sw-video-slider{
  grid-area:media;
  position:relative;

  width:100%;
  height:520px;
  min-height:520px;
  margin-top:3rem;

  display:flex;
  align-items:center;
  justify-content:center;

  overflow:visible;
}

.sw-video-window{
  position:relative;

  width:100%;
  height:100%;

  overflow:visible;
  padding:0;
}

.sw-video-list{
  position:absolute;
  left:50%;
  top:50%;

  width:620px;
  height:460px;
  margin:0;

  translate:-50% -50%;
  transform:none;
}

.sw-video-card{
  position:absolute;
  left:50%;
  top:50%;

  width:240px;
  height:430px;

  overflow:hidden;
  border-radius:24px;
  background:#0b0b0b;

  transform:
    translate(calc(-50% + var(--x)), -50%)
    scale(var(--scale))
    rotate(var(--rotate));

  opacity:var(--opacity);
  filter:blur(10px) brightness(.62);
  box-shadow:none;

  transition:
    transform .38s ease,
    filter .38s ease,
    opacity .38s ease;
}

.sw-video-card:nth-child(1){ --x:-280px; --scale:.66; --rotate:-4deg; --opacity:.06; }
.sw-video-card:nth-child(2){ --x:-225px; --scale:.72; --rotate:3deg; --opacity:.1; }
.sw-video-card:nth-child(3){ --x:-165px; --scale:.8; --rotate:-3deg; --opacity:.2; }
.sw-video-card:nth-child(4){ --x:-90px; --scale:.9; --rotate:2deg; --opacity:.42; }
.sw-video-card:nth-child(5){ --x:0px; --scale:1; --rotate:0deg; --opacity:1; }
.sw-video-card:nth-child(6){ --x:90px; --scale:.9; --rotate:-2deg; --opacity:.42; }
.sw-video-card:nth-child(7){ --x:165px; --scale:.8; --rotate:3deg; --opacity:.2; }
.sw-video-card:nth-child(8){ --x:225px; --scale:.72; --rotate:-3deg; --opacity:.1; }
.sw-video-card:nth-child(9){ --x:280px; --scale:.66; --rotate:4deg; --opacity:.06; }

.sw-video-card.active{
  z-index:10;
  opacity:1;
  filter:blur(0) brightness(1);
  border:4px solid #b6ff00;

  transform:
    translate(calc(-50% + var(--x)), -50%)
    scale(1.1)
    rotate(0deg);
}

.sw-video-card.near{
  filter:blur(7px) brightness(.72);
}

.sw-card-thumb,
.sw-card-video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.sw-video-slider{
  flex-direction:column;
  height:580px;
  min-height:580px;
  margin-top:3rem;
}

.sw-video-window{
  height:520px;
  flex:0 0 520px;
}

.sw-video-caption{
    display: block;
    width: 100%;
    max-width: 520px;
    margin: 0rem auto 0;
    text-align: center;
    color: #8f8f8f;
    font-size: .95rem;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -.02em;
}

.sw-video-caption strong{
  color:#0b0b0b;
  font-weight:700;
}


.sw-target-icon{
  position:relative;
  width:19px;
  height:19px;
  flex:0 0 auto;

  background:url("./img/shape_5-2.png") center/contain no-repeat;

  animation:swTargetIconMove 1.1s ease-in-out infinite;
}

@keyframes swTargetIconMove{
  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(6px);
  }
}
.sw-target-icon::after{
  display:none;
}
.sw-result-text strong{
  color:#0b0b0b;
  font-weight:700;
}

.sw-result-text strong::before,
.sw-result-text strong::after {
  content: '';
  display: none;
}

.sw-arrow-down{
  display:block;
  margin:1rem 0 1.6rem;
  color:#c7cbd5;
  font-size:2rem;
  line-height:1;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   04-0. SECTION 2 RESPONSIVE — NOTEBOOK (1025px~1440px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (min-width:1025px) and (max-width:1440px){
  .sw-section2-inner{
    width:calc(100% - 250px);
    max-width:1190px;
    grid-template-columns:36% 64%;
    align-items:center;
  }

  .hero-shape-section2{
    font-size:1.25rem;
    margin:0 0 -6.2rem 0;
  }

  .sw-section2-title{
    font-size:clamp(3rem, 4vw, 3.8rem);
    line-height:1.2;
    margin:0 0 11.2rem 0;
  }

  .sw-sub-guide-wrap{
    margin-top:3rem;
  }

  .hero-shape-guide-icon{
    width:16px;
    height:16px;
    flex:0 0 auto;
    margin:-1.6rem 0 0 0;
  }

  .sw-section2-desc-2{
    font-size:1.1rem;
  }

  .sw-filter-box{
    max-width:720px;
  }

  .sw-selected-pill{
    margin:2.6rem auto 0 !important;
  }

  .sw-video-slider{
    flex-direction:column;
    height:500px;
    min-height:500px;
    margin-top:4.2rem;
  }

  .sw-video-window{
    height:100%;
    flex:initial;
  }

  .sw-video-list{
    position:absolute;
    left:50%;
    top:50%;
    translate:-50% -50%;
    width:590px;
    height:420px;
  }

  .sw-video-card{
    width:230px;
    height:395px;
  }
}


@media (min-width:1025px) and (max-width:1300px){
  .sw-section2-inner{
    width:calc(100% - 220px);
    grid-template-columns:36% 64%;
  }

  .hero-shape-section2{
    margin:0 0 -7.2rem 0;
  }

  .sw-section2-title{
    font-size:clamp(3rem, 4.2vw, 3.8rem);
    line-height:1.2;
    margin:0 0 9.8rem 0;
  }

  .sw-sub-guide-wrap{
    margin-top:4rem;
  }

  .sw-section2-desc-2{
    font-size:1.05rem;
  }

  .sw-filter-box{
    max-width:680px;
  }

  .sw-main-category{
    gap:3rem;
  }

  .sw-main-btn{
    font-size:1.02rem;
  }

  .sw-sub-btn{
    font-size:.94rem;
  }

  .sw-selected-pill{
    margin:2.3rem auto 0 !important;
  }

  .sw-video-slider{
    height:455px;
    margin-top:4rem;
  }

  .sw-video-window{
    height:100%;
    flex:initial;
  }

  .sw-video-list{
    width:560px;
    height:385px;
  }

  .sw-video-card{
    width:215px;
    height:400px;
  }

  .sw-video-card:nth-child(1){ --x:-250px; }
  .sw-video-card:nth-child(2){ --x:-205px; }
  .sw-video-card:nth-child(3){ --x:-150px; }
  .sw-video-card:nth-child(4){ --x:-82px; }
  .sw-video-card:nth-child(6){ --x:82px; }
  .sw-video-card:nth-child(7){ --x:150px; }
  .sw-video-card:nth-child(8){ --x:205px; }
  .sw-video-card:nth-child(9){ --x:250px; }
}

@media (min-width:1025px) and (max-width:1200px){
  .sw-section2-inner{
    width:calc(100% - 200px);
    grid-template-columns:40% 60%;
  }

  .hero-shape-section2{
    font-size:1.2rem;
    margin:0 0 -8.3rem 0;
  }

  .sw-section2-title{
    font-size:clamp(2.7rem, 4vw, 3.8rem);
    line-height:1.2;
    margin:0 0 8.8rem 0;
  }

  .sw-section2-desc-2{
    font-size:1rem;
    line-height:1.5;
  }

  .sw-filter-box{
    max-width:620px;
  }

  .sw-main-category{
    gap:2.4rem;
  }

  .sw-main-btn{
    font-size:.96rem;
  }

  .sw-sub-btn{
    height:33px;
    padding:0 13px;
    font-size:.88rem;
  }

  .sw-result-text{
    font-size:1.16rem;
  }

  .sw-selected-pill{
    margin:2.3rem auto 0 !important;
  }

  .sw-video-slider{
    height:430px;
    margin-top:3.7rem;
  }

  .sw-video-window{
    height:100%;
    flex:initial;
  }

  .sw-video-list{
    width:520px;
    height:360px;
  }

  .sw-video-card{
    width:220px;
    height:400px;
  }

  .sw-video-card:nth-child(1){ --x:-235px; }
  .sw-video-card:nth-child(2){ --x:-190px; }
  .sw-video-card:nth-child(3){ --x:-140px; }
  .sw-video-card:nth-child(4){ --x:-76px; }
  .sw-video-card:nth-child(6){ --x:76px; }
  .sw-video-card:nth-child(7){ --x:140px; }
  .sw-video-card:nth-child(8){ --x:190px; }
  .sw-video-card:nth-child(9){ --x:235px; }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   04-1. SECTION 2 RESPONSIVE — TABLET (≤1024px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:1024px){
  .sw-section2{
    min-height:100svh;
    padding:6rem 0 4rem;
    display:flex;
    align-items:center;
  }

  .sw-section2-inner{
    width:min(720px, 92vw);
    grid-template-columns:1fr;
    grid-template-areas:
      "title"
      "desc"
      "guide"
      "filter"
      "media";
    row-gap:0;
    text-align:center;
  }

  .hero-shape-section2{
    grid-area:title;
    margin:0 0 1rem 0;
    font-size:1.08rem;
    text-align:center;
  }

  .sw-section2-title{
    grid-area:desc;
    margin:0;
    line-height:1.2;
    text-align:center;
  }

  .sw-sub-guide-wrap{
    grid-area:guide;
    justify-content:center;
    align-items:center;
    gap:.5rem;
    margin-top:1.4rem;
  }

  .hero-shape-guide-icon{
    width:13px;
    height:13px;
    flex:0 0 auto;
    margin:0;
  }

  .sw-section2-desc-2{
    font-size:1.1rem;
    line-height:1.5;
    text-align:center;
  }

  .sw-section2-desc-2 br{
    display:none;
  }

  .sw-filter-box{
    grid-area:filter;
    width:100%;
    max-width:700px;
    margin:2rem auto 1.5rem;
    overflow:hidden;
  }

  .sw-main-category{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:0;
    width:100%;
    min-height:40px;
    overflow:visible;
    white-space:normal;
  }

  .sw-main-btn{
    width:100%;

    justify-self:center;
    text-align:center;

  }

  .sw-sub-box{
       padding:1.05rem 0 .45rem;
    overflow:hidden;
  }

  .sw-sub-group.active{
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:8px;
    overflow-x:auto;
    overflow-y:hidden;
    white-space:nowrap;
    padding-bottom:2px;
    -webkit-overflow-scrolling:touch;
  }
  .sw-sub-group.active{
    min-height:44px;
    align-items:center;
    padding-top:6px;
    padding-bottom:6px;
    overflow-y:visible;
  }
  .sw-sub-group.active::-webkit-scrollbar{
    display:none;
  }

  .sw-sub-btn{
    flex:0 0 auto;
  }

  .sw-selected-pill{
    justify-content:center;
    margin:1.6rem auto 0 !important;
  }

  .sw-video-slider{
    height:440px;
    margin-top:1.8rem !important;
    margin-bottom:0;
  }

  .sw-video-list{
    width:100%;
    height:410px;
  }

  .sw-video-card{
        width: 230px;
        height: 430px;
  }

  .sw-video-card:nth-child(3){ --x:-130px; }
  .sw-video-card:nth-child(4){ --x:-72px; }
  .sw-video-card:nth-child(6){ --x:72px; }
  .sw-video-card:nth-child(7){ --x:130px; }

  .sw-video-caption{
    max-width:520px;
    margin:.6rem auto 0;
    padding:0 12px;
    line-height:1.45;
    text-align:center;
  }
  

}

@media (min-width:1024px) and (max-width:767px){
  .sw-section-spacing{    padding-top: 100px !important;
    padding-bottom: 100px !important;}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   04-2. SECTION 2 RESPONSIVE — MOBILE (≤768px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:768px){
  .sw-section2{
    min-height:100svh;
    padding:4rem 0 1.6rem;
    display:flex;
    align-items:center;
  }

  .hero-shape-section2{
    font-size:.95rem;
    margin:0 0 .8rem 0;
  }

  .sw-section2-title{
    font-size:2.5rem;
    line-height:1.16;
    letter-spacing:-.035em;
  }

  .sw-sub-guide-wrap{
    margin-top:1rem;
    gap:.55rem;
  }

  .hero-shape-guide-icon{
    width:14px;
    height:14px;
  }

  .sw-section2-desc-2{
    font-size:.84rem;
    line-height:1.45;
  }

  .sw-filter-box{
    max-width:none;
    margin-top:1.45rem;
  }

  .sw-main-category{
    grid-template-columns:repeat(3, 1fr);
    min-height:41px;
  }

  .sw-main-btn{
    height:41px;
    font-size:.92rem;
  }

  .sw-main-btn.active::after{
    height:2px;
  }

  .sw-sub-box{
    padding:.85rem 0 0;
  }

  .sw-sub-group.active{
    justify-content:flex-start;
    flex-wrap:nowrap;
    gap:9px;
    overflow-x:auto;
    overflow-y:hidden;
    white-space:nowrap;
    padding-bottom:2px;
    -webkit-overflow-scrolling:touch;
  }

  .sw-sub-btn{
        height: 32.5px;
        padding: 0 16px;
        font-size: 0.9rem;
  }

  .sw-selected-pill{
    margin:1rem auto 0 !important;
    justify-content:center;
  }

  .sw-selected-pill-inner{
    gap:6px;
  }

  .sw-target-icon{
    width:15px;
    height:15px;
  }

  .sw-result-text{
    font-size:1.2rem;
    line-height:1.35;
    text-align:center;
  }

  .sw-video-slider{
    height:auto;
    min-height:0;
    margin-top:2.6rem !important;
    margin-bottom:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    overflow:visible;
  }

  .sw-video-window{
    position:relative;
    width:100%;
    height:318px;
    flex:0 0 318px;
    overflow:visible;
  }

  .sw-video-list{
    position:absolute;
    left:50%;
    top:50%;
    translate:-50% -50%;
    width:100%;
    height:306px;
  }

  .sw-video-card{
    width:154px;
    height:290px;
    border-radius:18px;
  }

  .sw-video-card:nth-child(1),
  .sw-video-card:nth-child(2),
  .sw-video-card:nth-child(8),
  .sw-video-card:nth-child(9){
    opacity:0;
    pointer-events:none;
  }

  .sw-video-card:nth-child(3){ --x:-126px; --scale:.66; --rotate:-4deg; --opacity:.14; }
  .sw-video-card:nth-child(4){ --x:-70px; --scale:.76; --rotate:2deg; --opacity:.32; }
  .sw-video-card:nth-child(5){ --x:0px; --scale:1; --rotate:0deg; --opacity:1; }
  .sw-video-card:nth-child(6){ --x:70px; --scale:.76; --rotate:-2deg; --opacity:.32; }
  .sw-video-card:nth-child(7){ --x:126px; --scale:.66; --rotate:4deg; --opacity:.14; }

  .sw-video-card.active{
    border:3px solid #b6ff00;
    transform:
      translate(calc(-50% + var(--x)), -50%)
      scale(1.04)
      rotate(0deg);
  }

  .sw-video-caption{
    width:100%;
    max-width:430px;
    margin:.35rem auto 0;
    padding:0 10px;
    font-size:.76rem;
    line-height:1.42;
    text-align:center;
  }
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   04-3. SECTION 2 RESPONSIVE — SMALL MOBILE (≤640px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:640px){
  .sw-section2{
    padding:3.7rem 0 1.4rem;
  }

  /*
  .sw-section2-inner{
    width:calc(100% - 32px);
    max-width:430px;
  }*/

  .hero-shape-section2{
    font-size:.88rem;
    margin-bottom:.7rem;
  }

  .sw-section2-title{
    font-size:1.82rem;
    line-height:1.16;
  }

  .sw-sub-guide-wrap{
    margin-top:.9rem;
  }

  .sw-section2-desc-2{
    font-size:.78rem;
    line-height:1.43;
  }

  .sw-filter-box{
    margin-top:1.2rem;
  }

  .sw-main-category{
    min-height:39px;
  }

  .sw-main-btn{
    height:39px;

  }

  .sw-sub-box{
    padding:.75rem 0 0;
  }


  .sw-selected-pill{
    margin-top:.0rem !important;
  }

  .sw-selected-pill-inner{
    gap:5px;
  }

 

  .sw-target-icon::after{
    font-size:1rem;
  }


  .sw-video-slider{
    margin-top:1.75rem !important;
  }

  .sw-video-window{
    height:305px;
    flex-basis:305px;
  }

  .sw-video-list{
    height:294px;
  }

  .sw-video-card{
    width:148px;
    height:278px;
    border-radius:17px;
  }

  .sw-video-card:nth-child(3){ --x:-118px; }
  .sw-video-card:nth-child(4){ --x:-66px; }
  .sw-video-card:nth-child(6){ --x:66px; }
  .sw-video-card:nth-child(7){ --x:118px; }

  .sw-video-caption{
    margin-top:.25rem;
    font-size:.72rem;
  }
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   04-4. SECTION 2 RESPONSIVE — MOBILE XS (≤441px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:441px){

  .sw-section2{
    padding:3.3rem 0 1.2rem;
  }

  .sw-section2-inner{
    width:calc(100% - 30px);
  }

  .hero-shape-section2{
    font-size:.95rem;
    margin-bottom:.65rem;
  }

  .sw-section2-title{
    font-size:1.66rem;
    line-height:1.22;
  }

  .sw-sub-guide-wrap{
    margin-top:.5rem;
    gap:.45rem;
    margin-left:-.5rem;
  }

  .hero-shape-guide-icon{
    width:12px;
    height:12px;
    margin:-.7rem 0 0 0;
  }

  .sw-section2-desc-2{
    font-size:.86rem;
    line-height:1.42;
  }

  .sw-section2-desc-2 br{
    display:block;
  }

  .sw-filter-box{
    margin-top:1.1rem;
  }

  .sw-main-category{
    min-height:37px;
    gap:15px;
  }

  .sw-main-btn{
    height:37px;
  }

  .sw-sub-group.active{
    gap:8px;

    padding-left:10px;
    padding-right:15px;

    overflow-x:auto;
    overflow-y:visible;
  }

  .sw-sub-box{
    padding:.4rem 0 0 .8rem;
  }

  .sw-selected-pill{
    margin-top:.65rem !important;
  }

  .sw-selected-pill-inner{
    gap:4px;
  }

  .sw-target-icon::after{
    font-size:.95rem;
  }

  .sw-video-slider{
    margin-top:1.65rem !important;
  }

  .sw-video-window{
    height:292px;
    flex-basis:340px;
  }

  .sw-video-list{
    height:300px;
  }

  .sw-video-card{
    width:160px;
    height:290px;
    border-radius:16px;
  }

  .sw-video-card:nth-child(3){ --x:-110px; }
  .sw-video-card:nth-child(4){ --x:-62px; }
  .sw-video-card:nth-child(6){ --x:62px; }
  .sw-video-card:nth-child(7){ --x:110px; }

  .sw-video-caption{
    margin-top:.2rem;
    font-size:.7rem;
    line-height:1.38;
  }
}

@media (max-width:441px){

  .sw-section2-title{
   font-size: 1.62rem;
        letter-spacing: -.02em;
        line-height: 1.3;
  }

  .sw-section2-desc{
    top:auto;
    margin-top:8px;
    line-height:1.55;
    letter-spacing:-0.01rem;
  }

  .sw-filter-box{
    width:100vw;
    max-width:none;

    margin-left:calc(50% - 50vw);
    margin-right:calc(50% - 50vw);

    padding:0;
  }

    .sw-video-card:nth-child(3){ --x:-126px; --scale:.46; --rotate:-4deg; --opacity:.14; }
  .sw-video-card:nth-child(4){ --x:-70px; --scale:.56; --rotate:2deg; --opacity:.32; }
  .sw-video-card:nth-child(5){ --x:0px; --scale:1; --rotate:0deg; --opacity:1; }
  .sw-video-card:nth-child(6){ --x:70px; --scale:.56; --rotate:-2deg; --opacity:.32; }
  .sw-video-card:nth-child(7){ --x:126px; --scale:.46; --rotate:4deg; --opacity:.14; }
}

@media (max-width:390px){

  .sw-video-card{
    width:190px;
    height:280px;
  }

  .sw-video-window{
    height:292px;
    flex-basis:320px;
  }

  .sw-result-text{
    font-size:1.1rem;
  }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   04-5. SECTION 2 — MOTION / KEYFRAMES
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@keyframes swKeywordSelect{

  0%{
    transform:scale(.97);
    opacity:.6;
  }

  45%{
    transform:scale(1.015);
    opacity:1;
  }

  100%{
    transform:scale(1);
    opacity:1;
  }
}


/* ─────────────────────────────────────────────────────────
   05. SECTION 3 — CAMPAIGN CASE
   ───────────────────────────────────────────────────────── */

.sw-section3{
  position:relative;
  z-index:30;
  padding:7rem 0 6.5rem;
  background:var(--sw-black, #070707);
  color:var(--sw-white, #fff);
  overflow:hidden;
}

.sw-section3-inner{
  position:relative;
  z-index:2;
  width:min(1120px, 92vw);
  margin:0 auto;
  text-align:center;
}

.sw-section3-title{
  color:#fff;
  font-size:2.5rem;
  font-weight:600;
  line-height:1.15;
  letter-spacing:-.03em;
}

.sw-section3 .sw-section2-desc{
  margin:1rem auto 0;
  max-width:620px;
  color:rgba(255,255,255,.52);
  font-size:1.14rem;
  line-height:1.55;
  text-align:center;
}

/* TABS */
.sw-campaign-tabs{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:.72rem;
  margin-top:2.6rem;
}

.sw-campaign-tab{
  flex:0 0 auto;
  height:41px;
  padding:0 1.5rem;
  border:1px solid rgba(255,255,255,.20);
  border-radius:999px;
  background:#fff;
  color:#101010;
  font-family:inherit;
  font-size:.95rem;
  font-weight:600;
  white-space:nowrap;
  cursor:pointer;
  transition:.32s ease;
}

.sw-campaign-tab.active{
  border-color:var(--sw-green, #b6ff00);
  background:var(--sw-green, #b6ff00);
  color:#0b0b0b;
  font-weight: 700;
}

/* GRID */
.sw-campaign-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:2.8rem;
  margin-top:2rem;
}

.sw-campaign-card{
  min-width:0;
  text-align:center;
}

.sw-campaign-video{
  position:relative;
  width:100%;
  aspect-ratio:9 / 16;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:1.2rem;
  background:#111;
  box-shadow:none;
}

.sw-campaign-video video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.sw-campaign-video::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:rgba(0,0,0,.50);
  opacity:1;
  transition:opacity .35s ease;
  pointer-events:none;
}

.sw-campaign-video.is-playing::before{
  opacity:0;
}

.sw-campaign-video::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg, rgba(0,0,0,0) 48%, rgba(0,0,0,.38) 100%);
  pointer-events:none;
}

.sw-campaign-badge{
  display:none;
  position:absolute;
  top:.7rem;
  left:.7rem;
  z-index:4;
  padding:.34rem .55rem;
  border-radius:.35rem;
  background:#b6ff00;
  color:#111;
  font-size:.72rem;
  font-weight:700;
}

.sw-campaign-play{
  position:absolute;
  left:50%;
  top:50%;
  z-index:3;
  width:3.25rem;
  height:3.25rem;
  border:1px solid rgba(255,255,255,.88);
  border-radius:50%;
  transform:translate(-50%, -50%);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:1rem;
  pointer-events:none;
  backdrop-filter:blur(4px);
}

.sw-campaign-video.is-playing .sw-campaign-play{
  opacity:0;
}

.sw-campaign-name{
  margin-top:1.2rem;
  color:#fff;
  font-size:1.1rem;
  font-weight:600;
  line-height:1.25;
  letter-spacing:-.01em;
}

.sw-campaign-brand{
  margin-top:.28rem;
  color:rgba(255,255,255,.52);
  font-size:.98rem;
  font-weight:500;
  line-height:1.7;
  letter-spacing:-.025em;
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   05-1. SECTION 3 RESPONSIVE — (≤1440px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:1440px){
  .sw-section3-inner{
    width:calc(100% - 250px);
    max-width:1190px;
  }

  .sw-section3-title{
    font-size:clamp(2.25rem, 3vw, 2.5rem);
  }

  .sw-campaign-grid{
    gap:2.1rem;
  }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   05-2. SECTION 3 RESPONSIVE — (≤1300px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:1300px){
  .sw-section3-inner{
    width:min(1180px,92vw);
  }

  .sw-campaign-grid{
    gap:1.6rem;
  }

  .sw-campaign-name{
    font-size:1.02rem;
  }

  .sw-campaign-brand{
    font-size:.92rem;
  }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   05-3. SECTION 3 RESPONSIVE — TABLET (≤1024px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:1024px){
  .sw-section3{
    padding:6rem 0 5.4rem;
  }

  .sw-section3-inner{
    width:min(1120px,92vw);
  }

  .sw-section3-title{
    font-size:2.25rem;
    line-height:1.2;
  }

  .sw-section3 .sw-section2-desc{
    margin-top:.85rem;
    font-size:1.1rem;
  }

  .sw-campaign-tabs{
    margin-top:2.2rem;
    gap:.6rem;
  }

  .sw-campaign-tab{
    height:38px;
    padding:0 1.15rem;
    font-size:.86rem;
  }

  .sw-campaign-grid{
    gap:2rem 1.4rem;
    margin-top:2rem;
  }

  .sw-campaign-video{
    border-radius:1rem;
  }

  .sw-campaign-grid{gap: 1.5rem;}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   05-4. SECTION 3 RESPONSIVE — MOBILE (≤768px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:768px){

  .sw-section3{
    padding:4.8rem 0 4.6rem;
    overflow:hidden;
  }

  .sw-section3-inner{
    width:calc(100% - 36px);
    max-width:none;
  }

  .sw-section3-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section3 .sw-section2-desc{
    margin-top:.7rem;
    font-size:.92rem;
    line-height:1.45;
  }

    .sw-campaign-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    gap:.55rem;

    padding:0 18px .45rem;
    margin-left:-18px;
    margin-right:-18px;

    -webkit-overflow-scrolling:touch;
  }

  .sw-campaign-tabs::-webkit-scrollbar{
    display:none;
  }

  .sw-campaign-tab{
    flex:0 0 auto;
    height:36px;
    padding:0 1rem;
    font-size:.78rem;
  }

    .sw-campaign-grid{
    display:flex;
    gap:0;

    overflow-x:auto;
    overflow-y:hidden;

    margin-top:1.8rem;

    padding:0 18px 1rem;
    margin-left:-18px;
    margin-right:-18px;

    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }

  .sw-campaign-grid::-webkit-scrollbar{
    display:none;
  }

  .sw-campaign-card{
    flex:0 0 82%; /* 다음 카드 살짝 보임 */
    max-width:320px;

    margin-right:1rem;

    scroll-snap-align:start;
  }

  .sw-campaign-card:last-child{
    margin-right:18px;
  }

  .sw-campaign-video{
    border-radius:1rem;
  }

  .sw-campaign-name{
    margin-top:1rem;
    font-size:1rem;
  }

  .sw-campaign-brand{
    font-size:.9rem;
  }
}

@media (max-width:768px){

  .sw-section-spacing {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

  .sw-section3{
    padding:4.8rem 0 4.6rem;
    overflow:hidden;
  }

  .sw-section3-inner{
    width:calc(100% - 50px) !important;
    max-width:none !important;
  }

  .sw-section3-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section3 .sw-section2-desc{
    margin-top:.7rem;
    font-size:.92rem;
    line-height:1.45;
  }

  .sw-campaign-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    gap:.55rem;
    margin-top:1.7rem;
    padding:0 18px .45rem;
    margin-left:-18px;
    margin-right:-18px;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }

  .sw-campaign-tabs::-webkit-scrollbar{
    display:none;
  }

  .sw-campaign-tab{
    height:36px;
    padding:0 1rem;
    font-size:.78rem;
    scroll-snap-align:start;
  }

  .sw-campaign-grid{
    display:flex;
    grid-template-columns:none;
    gap:0;
    margin-top:1.8rem;

    overflow-x:auto;
    overflow-y:hidden;
    margin-left:-18px;
    margin-right:-18px;
    padding:0 18px 1rem;

    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x mandatory;
    scroll-padding-left:18px;
  }

  .sw-campaign-grid::-webkit-scrollbar{
    display:none;
  }

  .sw-campaign-card{
    flex:0 0 82%;
    max-width:330px;
    margin-right:1rem;
    scroll-snap-align:start;
  }

  .sw-campaign-card:last-child{
    margin-right:18px;
  }

  .sw-campaign-video{
    border-radius:1.05rem;
  }

  .sw-campaign-play{
    width:2.8rem;
    height:2.8rem;
    font-size:.9rem;
  }

  .sw-campaign-name{
    margin-top:1rem;
    font-size:1rem;
  }

  .sw-campaign-brand{
    font-size:.9rem;
  }
}

@media (max-width:768px){

  .sw-campaign-tabs{
    animation:none !important;
    transition:none !important;
    transform:none !important;
    opacity:1 !important;
  }

  .sw-campaign-tab{
    animation:none !important;
    transition:none !important;
    transform:none !important;
    opacity:1 !important;
  }

}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   05-5. SECTION 3 RESPONSIVE — MOBILE XS (≤441px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:441px){
  .sw-section3{
    padding:4.3rem 0 4.2rem;
  }

  .sw-section3-inner{
    width:calc(100% - 32px);
  }

  .sw-section3-title{
    font-size:1.5rem;
  }

  .sw-section3 .sw-section2-desc{
    font-size:.86rem;
  }

  .sw-campaign-tab{
    height:34px;
    padding:0 .85rem;
    font-size:.74rem;
  }

  .sw-campaign-card{
    flex-basis:84%;
    max-width:300px;
    margin-right:.85rem;
  }

  .sw-campaign-name{
    font-size:.96rem;
  }

  .sw-campaign-brand{
    font-size:.84rem;
  }

  .sw-section2{
    padding-top: 70px !important;
    padding-bottom: 70px !important;
  }

  .sw-section3-inner {
    width: calc(100% - 36px) !important;}

    .sw-campaign-brand{        font-size: .82rem;}
  
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   05-6. SECTION 3 RESPONSIVE — MOBILE MIN (≤390px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:390px){
  .sw-campaign-card{
    flex-basis:86%;
    max-width:286px;
  }
}


/* ─────────────────────────────────────────────────────────
   06. SECTION 4 — SERVICE FEATURE
   ───────────────────────────────────────────────────────── */

.sw-section4{
  position:relative;
  z-index:30;
  background:#fff;
  color:#0b0b0b;
  padding:7.5rem 0;
  overflow:hidden;
}

.sw-section4-inner{
  width:min(1120px,92vw);
  margin:0 auto;
}

.sw-section4-head{
  text-align:center;
  margin:0 auto;
  padding:0;
}

.sw-section4-kicker{
  display:none !important;
}

.sw-section4-title{
  font-size:3.05rem;
  font-weight:800;
  line-height:1.12;
  letter-spacing:-.055em;
  text-align:center;
  color:#0b0b0b;
}

.sw-section4-desc{
  margin:1.45rem auto 0;
  color:#777;
  font-size:1.15rem;
  font-weight:600;
  line-height:1.5;
  letter-spacing:-.035em;
  text-align:center;
}

.sw-feature-row{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:32px;
  margin-top:5.4rem;
}

.sw-feature-item{
position: relative;
 min-height: 255px;
    padding: 58px 58px 38px;
    border: 1px solid #e5e5e5;
    border-radius: 24px;
    background: #fff;
    overflow: hidden;
    grid-template-columns: 1fr 138px;
    align-items: center;
    column-gap: 34px;
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .7s ease, transform .85s cubic-bezier(.22, 1, .3, 1), border-color .35s ease;
    height: 220px;
}

.sw-feature-item:hover{
  border-color:#dcdcdc;
}

.sw-feature-content{
  position:relative;
  z-index:2;
  align-self:stretch;

  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}

.sw-feature-num{
  display:block;
  margin:0 0 1.45rem 0;

  color:#0b0b0b;
  font-family:"Trap","Inter",sans-serif;
  font-size:4.35rem;
  font-weight:800;
  line-height:.78;
}

.sw-feature-content h3{
  margin:0;

  color:#0b0b0b;
  font-size:1.38rem;
  font-weight:800;
  line-height:1.25;
  letter-spacing:-.065em;
}

.sw-feature-content p{
    margin: 14px 0 0;
    color: #6d6d6d;
    font-size: 1.08rem;
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: -.03em;
    margin-top: .55rem;
}

.sw-feature-tag{
  position:relative;
  justify-self:center;
  align-self:center;

  width:112px;
  height:112px;

  display:flex;
  align-items:center;
  justify-content:center;

  animation:swFeatureFloat 2.8s ease-in-out infinite;
}

.sw-feature-item:nth-child(2) .sw-feature-tag{ animation-delay:.2s; }
.sw-feature-item:nth-child(3) .sw-feature-tag{ animation-delay:.4s; }
.sw-feature-item:nth-child(4) .sw-feature-tag{ animation-delay:.6s; }

.sw-feature-tag img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.sw-feature-tag span{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  justify-content:center;

  width:100%;
  height:100%;

  color:#0b0b0b;
  font-size:1rem;
  font-weight:700;
  line-height:1.25;
  letter-spacing:-.03em;
  text-align:center;
}

.sw-feature-tag:not(.is-lime) span{
  color:#b6ff00;
}

.sw-section4.is-active .sw-feature-item{
  opacity:1;
  transform:translateY(0);
}

.sw-section4.is-active .sw-feature-item:nth-child(1){transition-delay:.05s;}
.sw-section4.is-active .sw-feature-item:nth-child(2){transition-delay:.12s;}
.sw-section4.is-active .sw-feature-item:nth-child(3){transition-delay:.19s;}
.sw-section4.is-active .sw-feature-item:nth-child(4){transition-delay:.26s;}

@keyframes swFeatureFloat{
  0%,100%{
    transform:translateY(0);
  }
  50%{
    transform:translateY(-9px);
  }
}

/* =========================
SECTION 4
========================= */

.sw-section4{
  position:relative;
  z-index:30;
  background:#fff;
  color:#0b0b0b;
  overflow:hidden;
}

.sw-section4-inner{
  width:min(1180px,92vw);
  margin:0 auto;
}

/* 왼쪽 스티키 해제 */
.sw-section4-head{
  position:relative;
  top:auto;
  text-align:center;
  width:100%;
  max-width:none;
  margin:0 auto;
  padding:0;
}

/* 다른 섹션처럼 중앙 타이틀 */
.sw-section4-title{
  font-size: 2.5rem;
  font-weight: 700;
  line-height:1.2;
  letter-spacing:-.02em;
  color:#0b0b0b;
  text-align:center;
}

.sw-section4-desc{
  margin:1rem auto 0;
  max-width:620px;
  color:#7a7979;
  font-size:1.14rem;
  font-weight:500;
  line-height:1.55;
  letter-spacing:-.015em;
  text-align:center;
}

/* 카드 2개씩 2줄 */
.sw-feature-row{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:24px;
  margin-top:4.5rem;
}

.sw-feature-item:hover{
  border-color:#dedede;
}

.sw-feature-num{
  color:#0b0b0b;
  font-family:"Trap","Inter",sans-serif;
  font-size:3.6rem;
  font-weight:700;
  line-height:.9;
}

.sw-feature-content h3{
    color: #0b0b0b;
    font-size: 1.43rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: -.025em;
}


.sw-feature-tag{
  justify-self:end;
  width: 100px;
  height: 100px;
  top: -70%;
}

.sw-feature-tag img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.sw-section4.is-active .sw-feature-item{
  opacity:1;
  transform:translateY(0);
}

.sw-section4.is-active .sw-feature-item:nth-child(1){transition-delay:.05s;}
.sw-section4.is-active .sw-feature-item:nth-child(2){transition-delay:.12s;}
.sw-section4.is-active .sw-feature-item:nth-child(3){transition-delay:.19s;}
.sw-section4.is-active .sw-feature-item:nth-child(4){transition-delay:.26s;}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   17-4. SECTION 4 — MOTION ENHANCE
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* SECTION 4 */
.sw-section4 .sw-section4-head{
  opacity:0;
  transform:translateY(26px);
  transition:
    opacity .75s ease,
    transform .9s cubic-bezier(.16,1,.3,1);
}

.sw-section4.is-active .sw-section4-head{
  opacity:1;
  transform:translateY(0);
}

.sw-section4 .sw-feature-item{
  opacity:0;
  transform:translateY(34px);
  transition:
    opacity .75s ease,
    transform .95s cubic-bezier(.16,1,.3,1),
    border-color .35s ease;
}

.sw-section4.is-active .sw-feature-item{
  opacity:1;
  transform:translateY(0);
}

.sw-section4.is-active .sw-feature-item:nth-child(1){transition-delay:.06s;}
.sw-section4.is-active .sw-feature-item:nth-child(2){transition-delay:.16s;}
.sw-section4.is-active .sw-feature-item:nth-child(3){transition-delay:.26s;}
.sw-section4.is-active .sw-feature-item:nth-child(4){transition-delay:.36s;}

.sw-feature-num{
  transition:transform .7s cubic-bezier(.16,1,.3,1);
}

.sw-section4.is-active .sw-feature-num{
  animation:swNumSoftPop .72s cubic-bezier(.16,1,.3,1) both;
}

.sw-feature-tag img{
  transform:rotate(-6deg) scale(.92);
  transition:transform .9s cubic-bezier(.16,1,.3,1);
}

.sw-section4.is-active .sw-feature-tag img{
  transform:rotate(0deg) scale(1);
}

.sw-feature-tag{
  transition:transform .45s cubic-bezier(.16,1,.3,1);
}

.sw-feature-item:hover .sw-feature-tag{
  transform:rotate(4deg) scale(1.05);
}

@keyframes swNumSoftPop{
  0%{ transform:translateY(12px); opacity:.2; }
  100%{ transform:translateY(0); opacity:1; }
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   06-1. SECTION 4 RESPONSIVE
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* 1200 이하: PC 형태 유지하면서 살짝 압축 */
@media (max-width:1200px){
  .sw-section4-inner{
    width:min(1120px,92vw);
  }

  .sw-feature-row{
    gap:24px;
    margin-top:4.8rem;
  }

  .sw-feature-item{
    height:210px;
    padding:44px 42px 34px;
    column-gap:28px;
  }

  .sw-feature-num{
    font-size:3.7rem;
    margin-bottom:1.25rem;
  }

  .sw-feature-tag{
    top:auto;
    justify-self: end;
    width: 100px;
    height: 100px;
    top: -70%;
  }
  .sw-feature-row{
    gap:24px;
    margin-top:4.8rem;
  }

  .sw-feature-item{
    grid-template-columns:1fr 128px;
    min-height:240px;
    height:220px;
    padding:48px 46px 38px;
    column-gap:28px;
  }

  .sw-feature-num{
    font-size:3.9rem;
    margin-bottom:1.25rem;
  }

}

/* 1024 이하: 아이패드까지 2x2 유지 */
@media (max-width:1024px){
  .sw-section4{
    padding:6rem 0;
  }


  .sw-section4-title{
    font-size:2.25rem;
    line-height:1.2;
  }

  .sw-section4-desc{
    margin-top:1rem;
    font-size:1rem;
  }

  .sw-feature-row{
    grid-template-columns:repeat(2, 1fr);
    gap:18px;
    margin-top:3.8rem;
  }

  .sw-feature-item{
    grid-template-columns:1fr 72px;
    column-gap:16px;
    min-height: 180px;
    height: 160px;
 
    padding:30px 26px;
    border-radius:22px;
  }

  .sw-feature-num{
    font-size:2.6rem;
    margin-bottom:1rem;
  }

  .sw-feature-content h3{
    font-size:1.08rem;
    line-height:1.28;
    letter-spacing:-.04em;
  }

  .sw-feature-content p{
    margin-top:7px;
    font-size:.86rem;
    line-height:1.42;
  }

  .sw-feature-tag{
    width:78px;
    height:78px;
    justify-self:end;
    align-self:center;
    top:-70%;
  }

  .sw-feature-tag span{
    font-size:.78rem;
    line-height:1.18;
  }
}

/* 768 이하: 모바일부터 1줄 */
@media (max-width:768px){
  .sw-section4{
    padding:5rem 0;
  }

  .sw-section4-inner{
    width:calc(100% - 36px);
  }

  .sw-section4-title{
    font-size:2rem;
    line-height:1.18;
  }

  .sw-section4-desc{
    margin-top: .6rem;
    font-size: .92rem;
    line-height: 1.45;
  }

  .sw-feature-row{
    grid-template-columns:1fr;
    gap:14px;
    margin-top:2.8rem;
  }

  .sw-feature-item{
    grid-template-columns:1fr 62px;
    column-gap:14px;
    min-height: 180px;
    height: 160px;
    padding:24px 20px;
    border-radius:18px;
  }

  .sw-feature-num{
    font-size:2.9rem;
    margin-bottom:1.2rem;
  }

  .sw-feature-content h3{
    font-size:1rem;
  }

  .sw-feature-content p{
    margin-top:7px;
    line-height:1.4;
  }

 
  .sw-feature-tag span{
    font-size: .78rem;
    letter-spacing: -.03em;
  }

  .sw-feature-tag{top:-90%;}
}

/* 441 이하: 실제 모바일 보정 */
@media (max-width:441px){
  .sw-section4{
    padding:4.5rem 0;
  }

  .sw-section4-inner{
    width:calc(100% - 30px);
  }

  .sw-section4-title{
    font-size:1.66rem;
    line-height:1.22;
  }

  .sw-section4-desc{
    margin-top: .6rem;
    font-size: .86rem;
  }


  .sw-feature-row{
    gap:12px;
    margin-top:2.3rem;
  }

  .sw-feature-item{
    min-height:142px;
    padding:22px 18px;
  }

  .sw-feature-num{
    font-size:1.8rem;
    margin-bottom:.7rem;
  }

  .sw-feature-content h3{
    font-size:.96rem;
  }

  .sw-feature-content p{
    font-size:.85rem;
  }

  .sw-feature-tag{
    width:75px;
    height:75px;
    justify-self: end;
        align-self: center;
  }
  .sw-feature-item{32px 26px;}
  .sw-feature-content h3{letter-spacing: -.03em;}
}


/* ─────────────────────────────────────────────────────────
   07. SECTION 5 — CHANNEL
   ───────────────────────────────────────────────────────── */

.sw-section5{
  position:relative;
  z-index:30;
  background:#0b0b0b;
  color:#fff;
  overflow:hidden;
}

.sw-section5-inner{
  position:relative;
  width:min(1150px,92vw);
  margin:0 auto;
  text-align:center;
}

.sw-section5-title{
  font-size:2.5rem;
  font-weight:600;
  line-height:1.15;
  letter-spacing:-.02em;
  text-align:center;
}

.sw-section5-desc{
  margin-top:1rem;
  color:#7a7979;
  font-size:1.14rem;
  font-weight:500;
  line-height:1.5;
  letter-spacing:-.015em;
  text-align:center;
}

/* TABS */
.sw-channel-tabs{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:.85rem;
  margin-top:2.5rem;
}

.sw-channel-tab{
  flex:0 0 auto;
  height:45px;
  padding:0 1.5rem;
  border:1px solid #e1e4eb;
  border-radius:999px;
  background:#fff;
  color:#d1d1d1;
  font-family:inherit;
  font-size:.95rem;
  font-weight:600;
  white-space:nowrap;
  cursor:pointer;
  transition:.32s ease;
}

.sw-channel-tab.active{
  border-color:var(--sw-green);
  background:var(--sw-green);
  color:#0b0b0b;
}

/* STAGE */
.sw-channel-stage{
  position:relative;
  height:600px;
  margin-top:0;
}

/* BG STACK */
.sw-channel-stage::before,
.sw-channel-stage::after{
  content:"";
  position:absolute;
  top:50%;
  z-index:1;
  width:260px;
  height:430px;
  border-radius:26px;
  opacity:.24;
  filter:blur(9px) brightness(.82) saturate(.8);
  pointer-events:none;
}

.sw-channel-stage::before{
  left:31%;
  transform:translate(-50%,-50%) rotate(-7deg);
  background:url("./img/thumb_1.webp") center/cover no-repeat;
}

.sw-channel-stage::after{
  right:31%;
  transform:translate(50%,-50%) rotate(7deg);
  background:url("./img/thumb_2.webp") center/cover no-repeat;
}

/* CARD */
.sw-channel-card{
  position:absolute;
  top:50%;
  overflow:hidden;
  border-radius:25px;
  background:#0b0b0b;
  color:#fff;
  box-shadow:0 24px 70px rgba(20,25,40,.13);
  transform:translateY(-50%);
  opacity:0;
  pointer-events:none;
  transition:none;
}

body.is-section5-ready .sw-channel-card{
  transition:
    left .5s cubic-bezier(.22,1,.3,1),
    right .5s cubic-bezier(.22,1,.3,1),
    width .5s cubic-bezier(.22,1,.3,1),
    height .5s cubic-bezier(.22,1,.3,1),
    transform .5s cubic-bezier(.22,1,.3,1),
    opacity .4s ease,
    filter .4s ease;
}

.sw-channel-card img,
.sw-channel-card video{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.sw-channel-card.is-main{
  left:50%;
  transform:translate(-50%,-50%) scale(1.04);
  opacity:1;
  pointer-events:auto;
  z-index:8;
  filter:none;
  box-shadow:
    0 50px 120px rgba(0,0,0,.24),
    0 18px 40px rgba(0,0,0,.14);
}

.sw-channel-card.is-side,
.sw-channel-card.is-hidden{
  opacity:0 !important;
  pointer-events:none !important;
  z-index:0;
}

.sw-channel-card[data-type="vertical"]{
  width:270px;
  height:490px;
}

.sw-channel-card[data-type="feed"]{
  width:310px;
  height:500px;
  background:#fff;
  color:#0b0b0b;
}

.sw-channel-card[data-type="horizontal"],
.sw-channel-card[data-card="youtube"]{
  width:520px;
  height:auto;
  background:#fff;
  color:#0b0b0b;
}

/* APP TOP */
.sw-app-top{
  position:absolute;
  left:0;
  right:0;
  top:0;
  z-index:8;
  height:64px;
  padding:15px 16px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  background:linear-gradient(180deg, rgba(0,0,0,.46), rgba(0,0,0,0));
  color:#fff;
  text-align:left;
  border:0;
}

.sw-app-top > div{
  display:flex;
  align-items:center;
  gap:8px;
}

.sw-app-top img{
  width:22px;
  height:22px;
  border-radius:6px;
  object-fit:contain;
}

.sw-app-top strong{
  font-size:.88rem;
  font-weight:600;
  line-height:1;
}

.sw-app-top span{
  font-size:.72rem;
  font-weight:700;
  color:rgba(255,255,255,.85);
}

/* SIDE ACTION */
.sw-app-side{
  position:absolute;
  right:13px;
  top:50%;
  z-index:8;
  display:flex;
  flex-direction:column;
  gap:18px;
  transform:translateY(-50%);
}

.sw-side-action{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
  padding:0;
  margin:0;
  border:0;
  background:none;
  cursor:default;
}

.sw-side-action img{
  width:25px;
  height:25px;
  display:block;
  object-fit:contain;
  filter:
    drop-shadow(0 1px 2px rgba(0,0,0,.28))
    drop-shadow(0 2px 8px rgba(0,0,0,.22));
}

.sw-side-action em{
  font-style:normal;
  font-size:.68rem;
  font-weight:600;
  color:#fff;
  line-height:1;
}

.sw-app-bottom{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:8;
  padding:70px 16px 18px;
  background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.62) 58%, rgba(0,0,0,.78));
  text-align:left;
}

.sw-app-bottom strong{
  display:block;
  font-size:.78rem;
  font-weight:700;
}

.reels-caption{
  margin-top:8px;
  color:rgba(255,255,255,.82);
  font-size:.78rem;
  font-weight:500;
  line-height:1.35;

  display:-webkit-box;
  -webkit-line-clamp:1;
  -webkit-box-orient:vertical;
  overflow:hidden;

  white-space:normal;
}

.reels-caption.expanded{
  display:block;
  max-height:150px;
  overflow-y:auto;
  padding-right:6px;
  white-space:pre-line;
  -webkit-overflow-scrolling:touch;
}

.reels-caption.expanded::-webkit-scrollbar{
  display:none;
}

.reels-more{
  position:relative;
  z-index:20;
  display:inline-block;
  margin-top:7px;
  padding:0;
  border:0;
  background:none;
  color:rgba(255,255,255,.62);
  font-size:.74rem;
  font-weight:600;
  cursor:pointer;
}

/* FEED */
.sw-feed-top{
  position:absolute;
  left:0;
  right:0;
  top:0;
  z-index:8;
  height:46px;
  padding:10px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#fff;
  border-bottom:1px solid #eef0f4;
  color:#0b0b0b;
  text-align:left;
}

.sw-feed-top > div{
  display:flex;
  align-items:center;
  gap:10px;
}

.sw-feed-top img{
  width:22px;
  height:22px;
  border-radius:50%;
  object-fit:contain;
}

.sw-feed-top strong{
  font-size:.88rem;
  font-weight:700;
  line-height:1;
}

.sw-feed-top em{
  display:none;
}

.sw-feed-top > span{
  font-size:.7rem;
  font-weight:600;
  line-height:1;
}

.sw-feed-carousel{
  position:absolute;
  left:0;
  right:0;
  top:46px;
  bottom:120px;
  overflow:hidden;
  background:#0b0b0b;
}

.sw-feed-track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform .45s cubic-bezier(.22,1,.3,1);
}

.sw-feed-track img{
  flex:0 0 100%;
  width:100%;
  height:100%;
  object-fit:cover;
}

.sw-feed-count{
  position:absolute;
  top:12px;
  right:12px;
  z-index:5;
  padding:.28rem .48rem;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:.68rem;
  font-weight:700;
}

.sw-feed-dots{
  position:absolute;
  left:50%;
  bottom:13px;
  z-index:5;
  display:flex;
  gap:5px;
  transform:translateX(-50%);
}

.sw-feed-dots span{
  width:6px;
  height:6px;
  border-radius:50%;
  background:#d9dce3;
}

.sw-feed-dots span.active{
  background:#4f6cff;
}

.sw-feed-bottom{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  z-index:8;
  height:120px;
  padding:10px 14px 12px;
  background:#fff;
  color:#0b0b0b;
  text-align:left;
  overflow:hidden;
}

.sw-feed-bottom::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:36px;
  pointer-events:none;
  background:linear-gradient(
    to bottom,
    rgba(255,255,255,0),
    #fff
  );
}

.sw-feed-actions{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:7px;
}

.sw-feed-actions img{
  width:20px;
  height:20px;
  display:block;
  object-fit:contain;
}

.sw-feed-actions b{
  margin-left:auto;
  display:flex;
  align-items:center;
}

.sw-feed-actions b img{
  width:20px;
  height:20px;
}

.sw-feed-bottom strong{
  display:block;
  font-size:.78rem;
  font-weight:700;
  line-height:1.2;
  color:#0b0b0b;
}

.sw-feed-bottom p{
  position:relative;
  z-index:1;
  margin-top:5px;
  max-height:84px;
  padding-right:6px;
padding-bottom:36px;
  color:#7a7979;
  font-size:.78rem;
  font-weight:500;
  line-height:1.42;
  overflow-y:auto;
  white-space:pre-line;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}

.sw-feed-bottom p::-webkit-scrollbar{
  display:none;
}

/* YOUTUBE LONG - 16:9 + BOTTOM */

.sw-channel-card[data-card="youtube"]{
  border-radius:28px;
  overflow:hidden;
  background:#fff;
  color:#0b0b0b;
}

.sw-channel-card[data-card="youtube"] .sw-app-top{
  display:flex;
  background:linear-gradient(180deg, rgba(0,0,0,.42), rgba(0,0,0,0));
  border:0;
}

.sw-youtube-video{
  position:relative;
  width:100%;
  aspect-ratio:16 / 9;
  background:#0b0b0b;
  overflow:hidden;
}

.sw-youtube-video video{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  background:#0b0b0b;
}

.sw-youtube-time{
  position:absolute;
  right:10px;
  bottom:9px;
  z-index:4;
  padding:.2rem .38rem;
  border-radius:4px;
  background:rgba(0,0,0,.78);
  color:#fff;
  font-size:.68rem;
  font-weight:700;
}

/* 하단 정보영역 - 제목 + 아이디만 */
.sw-youtube-bottom{
  position:relative;
  z-index:8;
  height:90px;
  padding:14px 18px 15px;

  background:#fff;
  color:#0b0b0b;
  text-align:left;
  overflow:hidden;
}

.sw-youtube-title{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;

  overflow:hidden;
  text-overflow:ellipsis;

  color:#0b0b0b;
  font-size:.9rem;
  font-weight:700;
  line-height:1.3;
}

.sw-youtube-meta{
  margin-top:7px;
  padding:0;
  border:0;
}

.sw-youtube-channel{
  display:block;
  color:#8f95a1;
  font-size:.76rem;
  font-weight:600;
  line-height:1.2;
}

/* 기존 설명 영역 숨김 */
.sw-youtube-desc{
  display:none !important;
}

.sw-youtube-bottom::after{
  display:none !important;
}
/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   07-2. SECTION 5 — BLOG CARD
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.sw-channel-card[data-card="blog"]{
  width:310px;
  height:500px;
  background:#fff;
  color:#0b0b0b;
  overflow:hidden;
}

/* 상단 네이버 헤더 */

.sw-blog-header{
  position:absolute;
  top:0;
  left:0;
  right:0;
  z-index:10;

  height:48px;
  padding:0 20px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  background:#4ec857;
  color:#fff;
}

.sw-blog-header strong{
  font-size:1rem;
  font-weight:800;
  color:#fff;
  line-height:1;
}

.sw-blog-header span{
  font-size:.78rem;
  font-weight:600;
  color:rgba(255,255,255,.92);
  line-height:1;
}

/* iframe 영역 */

.sw-blog-frame{
  position:absolute;
  left:0;
  right:0;
  top:64px;
  bottom:0;

  overflow:hidden;
  background:#fff;
}

.sw-blog-frame iframe{
  width:100%;
  height:100%;
  border:0;
  background:#fff;
}

/* REVIEW */
.sw-review-strip{
  position:absolute;
  left:16px;
  right:16px;
  bottom:74px;
  z-index:9;
  display:flex;
  gap:6px;
}

.sw-review-strip img{
  width:48px;
  height:48px;
  border-radius:10px;
  object-fit:cover;
}

.sw-channel-card[data-card="review"] video{
  transform:scale(1.02);
}

.sw-channel-card[data-card="review"] .sw-app-bottom{
  background:linear-gradient(
    180deg,
    rgba(0,0,0,0),
    rgba(0,0,0,.35) 65%,
    rgba(0,0,0,.55)
  );
}

/* COMMON */
.sw-section-spacing{
  padding-top:160px;
  padding-bottom:160px;
}

/* 950 이하: 섹션3과 동일하게 탭 가로 스크롤 */
@media (max-width:950px){
  .sw-channel-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    gap:.55rem;
    padding:0 15px .4rem;
    margin-left:-15px;
    margin-right:-15px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }

  .sw-channel-tabs::-webkit-scrollbar{
    display:none;
  }

  .sw-channel-tab{
    flex:0 0 auto;
    white-space:nowrap;
    scroll-snap-align:start;
  }
}

/* TABLET */
@media (max-width:1024px){
  .sw-channel-stage::before{
    left:29%;
  }

  .sw-channel-stage::after{
    right:29%;
  }
}

/* MOBILE */
@media (max-width:768px){

  .sw-feed-top strong {
    font-size: .78rem;
    font-weight: 700;
    line-height: 1;
}

  .sw-section-spacing{
    padding-top:96px;
    padding-bottom:96px;
  }

  .sw-section5-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section5-desc{
    margin-top:.7rem;
    font-size:.92rem;
  }

  .sw-channel-tabs{
    margin-top:1.6rem;
  }

  .sw-channel-tab{
    height:38px;
    padding:0 1rem;
    font-size:.78rem;
  }

  .sw-channel-stage{
    height:430px;
    margin-top:.8rem;
  }

  .sw-channel-stage::before,
  .sw-channel-stage::after{
    width:190px;
    height:320px;
    opacity:.16;
    filter:blur(8px) brightness(.8) saturate(.78);
  }

  .sw-channel-stage::before{
    left:22%;
  }

  .sw-channel-stage::after{
    right:22%;
  }

  .sw-channel-card[data-type="vertical"]{
    width:min(78vw,300px);
    height:min(134vw,520px);
  }

  .sw-channel-card[data-type="feed"]{
    width:min(84vw,330px);
    height:min(126vw,500px);
  }

  .sw-channel-card[data-type="horizontal"],
  .sw-channel-card[data-card="youtube"]{
    width:min(92vw,390px);
  }

  .sw-channel-card.is-main{
    transform:translate(-50%,-50%) scale(1);
  }

  .sw-youtube-bottom{
    height:56px;
    padding:8px 12px;
  }

  .sw-youtube-bottom strong{
    font-size:.78rem;
    line-height:1.15;
  }

  .sw-youtube-bottom p{
    margin-top:2px;
    font-size:.66rem;
    line-height:1.2;
  }
}

/* SMALL MOBILE */
@media (max-width:480px){
  .sw-section-spacing{
    padding-top:82px;
    padding-bottom:82px;
  }

  .sw-section5-title{
    font-size:1.55rem;
  }

  .sw-channel-stage{
    height:370px;
    margin-top:.45rem;
  }

  .sw-channel-stage::before,
  .sw-channel-stage::after{
    width:170px;
    height:305px;
    opacity:.15;
  }

  .sw-channel-stage::before{
    left:24%;
  }

  .sw-channel-stage::after{
    right:24%;
  }

  .sw-channel-card[data-type="vertical"]{
    width:260px;
    height:420px;
  }

  .sw-channel-card[data-type="feed"]{
    width:286px;
    height:430px;
  }

  .sw-channel-card[data-type="horizontal"],
  .sw-channel-card[data-card="youtube"]{
    width:min(94vw,330px);
  }

  .sw-youtube-bottom{
    height:46px;
    padding:6px 10px;
  }

  .sw-youtube-bottom strong{
    font-size:.72rem;
    line-height:1.1;
  }

  .sw-youtube-bottom p{
    margin-top:1px;
    font-size:.6rem;
    line-height:1.15;
  }

  .sw-app-side{
    right:10px;
    gap:14px;
  }

  .sw-side-action img{
    width:28px;
    height:28px;
  }

  .sw-feed-carousel{
    bottom:82px;
  }

  .sw-feed-bottom{
        height: 120px;
        padding: 9px 12px;
  }

  .sw-feed-actions{
    gap:11px;
    margin-bottom:6px;
  }

  .sw-feed-actions img,
  .sw-feed-actions b img{
    width:19px;
    height:19px;
  }

  .sw-feed-bottom strong{
    font-size:.74rem;
  }

  .sw-feed-bottom p{
    font-size:.64rem;
  }
}


/* SECTION 5 - 인스타 피드 본문 스크롤 */

.sw-channel-card[data-card="feed"] .sw-feed-bottom p{
  max-height:140px;
  overflow-y:auto;
  padding-right:6px;
  white-space:pre-line;
  line-height:1.35;
  -webkit-overflow-scrolling:touch;
}

.sw-channel-card[data-card="feed"] .sw-feed-bottom p::-webkit-scrollbar{
  width:4px;
}

.sw-channel-card[data-card="feed"] .sw-feed-bottom p::-webkit-scrollbar-thumb{
  background:rgba(0,0,0,.2);
  border-radius:999px;
}

/* ─────────────────────────────────────────────────────────
   08. SECTION 6 — PACKAGE
   ───────────────────────────────────────────────────────── */

.sw-section6{
  position:relative;
  z-index:30;
  padding:7rem 0 6.5rem;
  background:#f7f7f7;
  color:#0b0b0b;
  overflow:hidden;
}

.sw-section6-inner{
  width:min(900px,92vw);
  margin:0 auto;
  text-align:center;
}

.sw-section6-title{
  font-size:2.5rem;
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.02em;
}

.sw-package-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:2rem;
  margin-top:4rem;
}

.sw-package-card{
  display:flex;
  flex-direction:column;
  padding:2.4rem 2rem;
  border:1px solid #e5e5e5;
  border-radius:1.1rem;
  background:#fff;
  color:#0b0b0b;
  text-align:left;

  opacity:0;
  transform:translateY(20px);
  will-change:transform, opacity;

  transition:
    opacity .72s ease,
    transform .88s cubic-bezier(.22,1,.3,1),
    box-shadow .45s ease,
    border-color .45s ease;
}

.sw-section6.is-active .sw-package-card{
  opacity:1;
  transform:translateY(0);
}

.sw-section6.is-active .sw-package-card:nth-child(1){
  transition-delay:.08s;
}

.sw-section6.is-active .sw-package-card:nth-child(2){
  transition-delay:.18s;
}

@media (hover:hover){
  .sw-package-card:hover{
    transform:translateY(-8px) scale(1.035) !important;
    box-shadow:
      0 26px 60px rgba(20,25,40,.09),
      0 8px 20px rgba(20,25,40,.05);
    border-color:#e7ebf0;
    z-index:5;
  }
}

.sw-package-badge{
  width:fit-content;
  max-width:max-content;
  align-self:flex-start;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:.5rem .78rem .4rem;
  border-radius:5rem;

  font-family:"Trap","Inter",sans-serif;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.03rem;
  line-height:1;

  background:#0b0b0b;
  color:#fff;
}

.sw-package-badge1{
  background:#b6ff00;
  color:#0b0b0b;
}

.sw-package-badge2{
  background:#0b0b0b;
  color:#b6ff00;
}

.sw-package-card h3{
  margin-top:1.3rem;
  font-size:1.8rem;
  font-weight:700;
  line-height:1.2;
  letter-spacing:-.02em;
}

.sw-package-card > p{
  margin-top:.65rem;
  color:#8b9099;
  font-size:.95rem;
  font-weight:500;
  line-height:1.5;
}

.sw-package-card ul{
  flex:1;
  margin-top:1rem;
  list-style:none;
}

.sw-package-card li{
  position:relative;
  padding:.8rem 0 .8rem 1.5rem;
  border-bottom:1px solid #ededed;

  font-size:1rem;
  font-weight:500;
  line-height:1.45;
}

.sw-package-card li:last-child{
  border-bottom:none;
}

.sw-package-card li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:.8rem;
  color:#0b0b0b;
  font-weight:700;
}

/* RECOMMEND BOX */
.sw-package-recommend{
  margin-top:1rem;
  padding:1.35rem 1.45rem;
  border-radius:.9rem;
  background:#f5f6f8;
}

.sw-package-recommend2{
  background:rgba(182,255,0,.12);
}

.sw-package-recommend strong{
  position:relative;
  display:flex;
  align-items:center;
  gap:.55rem;

  margin-bottom:.55rem;
  color:#0b0b0b;
  font-size:1rem;
  font-weight:700;
  letter-spacing:-.02em;
}

.sw-package-recommend strong::before{
  content:"✦";
  width:1.25rem;
  height:1.25rem;
  flex:0 0 auto;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  border-radius:50%;
  background:#0b0b0b;
  color:#b6ff00;

  font-size:.75rem;
  font-weight:900;
  line-height:1;
}

.sw-package-recommend2 strong::before{
  background:#b6ff00;
  color:#0b0b0b;
}

.sw-package-recommend p{
  margin:0;
  color:#7a7979;
  font-size:.98rem;
  font-weight:500;
  line-height:1.5;
  letter-spacing:-.01em;
}

/* BUTTON */
.sw-package-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.48em;

  margin-top:3rem;
  padding:1.2em 2.8em;

  border:none;
  border-radius:999px;

  background:#0b0b0b;
  color:#b6ff00;

  font-size:1.02rem;
  font-weight:700;
  line-height:1;
  text-decoration:none;
  cursor:pointer;

  transition:.3s ease;
}

.sw-package-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 34px rgba(23,24,39,.18);
}

.sw-package-btn::after{
  content:"→";
  display:inline-block;
  position:relative;
  top:-.01em;

  font-size:1em;
  font-weight:600;
  line-height:1;

  transform-origin:center;
  animation:ctaArrowMove 1.8s ease-in-out infinite;
}

.sw-package-note{
  margin-top:1.4rem;
  color:#b4b8c0;
  font-size:.8rem;
  font-weight:500;
}

/* PACKAGE CTA ARROW MOTION */
@keyframes ctaArrowMove{
  0%,100%{
    transform:translateX(0);
  }

  50%{
    transform:translateX(5px);
  }
}

/* ─────────────────────────────────────────────────────────
   08-1. SECTION 6 — RESPONSIVE
   ───────────────────────────────────────────────────────── */

@media (max-width:1024px){
  .sw-section6{
    padding:6rem 0 5.5rem;
  }

  .sw-section6-inner{
    width:min(1120px,92vw);
  }

  .sw-section6-title{
    font-size:2.1rem;
  }

  .sw-package-grid{
    gap:1.3rem;
    margin-top:3rem;
  }

  .sw-package-card{
    padding:2rem 1.5rem;
  }

  .sw-package-card h3{
    font-size:1.55rem;
  }

  .sw-package-card li{
    font-size:.92rem;
  }

  .sw-package-recommend{
    padding:1.15rem 1.2rem;
  }

  .sw-package-recommend p{
    font-size:.88rem;
  }
}

@media (max-width:768px){
  .sw-section6{
    padding:4.8rem 0 4.5rem;
  }

  .sw-section6-inner{
    width:calc(100% - 36px);
  }

  .sw-section6-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-package-grid{
    grid-template-columns:1fr;
    gap:1rem;
    margin-top:2.2rem;
  }

  .sw-package-card{
    padding:1.55rem 1.2rem;
    border-radius:16px;
  }

  .sw-package-badge{
    font-size:.68rem;
  }

  .sw-package-card h3{
    margin-top:1rem;
    font-size:1.28rem;
  }

  .sw-package-card > p{
    margin-top:.5rem;
    font-size:.82rem;
    line-height:1.45;
  }

  .sw-package-card ul{
    margin-top:.85rem;
  }

  .sw-package-card li{
    padding:.72rem 0 .72rem 1.3rem;
    font-size:.82rem;
    line-height:1.45;
  }

  .sw-package-card li::before{
    top:.72rem;
  }

  .sw-package-recommend{
    margin-top:1.1rem;
    padding:1rem;
    border-radius:.8rem;
  }

  .sw-package-recommend strong{
    gap:.48rem;
    margin-bottom:.48rem;
    font-size:.8rem;
  }

  .sw-package-recommend strong::before{
    width:1.1rem;
    height:1.1rem;
    font-size:.68rem;
  }

  .sw-package-recommend p{
    padding-left:1.58rem;
    font-size:.74rem;
    line-height:1.45;
  }

  .sw-package-btn{
    width:100%;
    max-width:300px;
    height:50px;
    margin-top:2rem;
    padding:0 24px;
    font-size:.86rem;
  }

  .sw-package-note{
    margin-top:1rem;
    font-size:.7rem;
    line-height:1.45;
  }
}

@media (max-width:441px){
  .sw-section6{
    padding:4.2rem 0 4rem;
  }

  .sw-section6-inner{
    width:calc(100% - 30px);
  }

  .sw-section6-title{
    font-size:1.62rem;
  }

  .sw-package-grid{
    gap:.85rem;
    margin-top:1.8rem;
  }

  .sw-package-card{
    padding:1.8rem 1.8rem;
    border-radius:15px;
  }

  .sw-package-card h3{
    font-size:1.5rem;
  }

  .sw-package-card > p{
    font-size:.78rem;
  }

  .sw-package-card li{
padding: .66rem 0 .66rem 1.22rem;
        font-size: .88rem;
        letter-spacing: -0.02em;
  }

  .sw-package-card li::before{
    top:.66rem;
  }

  .sw-package-recommend{
    padding:.9rem;
  }

  .sw-package-recommend strong{
    font-size:.9rem;
  }

  .sw-package-recommend p{
    padding-left:0;
    font-size:.8rem;
     letter-spacing: -0.02em;
  }

  .sw-package-btn{
max-width: 100%;
        height: 53px;
        font-size: 1rem;
  }
}
/* ─────────────────────────────────────────────────────────
   09. SECTION 7 — PROCESS
   ───────────────────────────────────────────────────────── */

.sw-section7{
  position:relative;
  z-index:30;
  background:#fff;
  color:#0b0b0b;
  overflow:hidden;
}

.sw-section7-inner{
  width:min(1120px,92vw);
  margin:0 auto;
  text-align:center;
}

.sw-section7-title{
  font-size:2.5rem;
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.02em;
}

.sw-section7-desc{
  margin-top:1rem;
  color:#7a7979;
  font-size:1.14rem;
  font-weight:500;
  line-height:1.5;
  letter-spacing:-.015em;
}

.sw-process-layout{
  width:100%;
  display:grid;
  grid-template-columns:200px 44px minmax(0,1fr) 44px 200px;
  align-items:center;
  gap:1rem;
  margin-top:4rem;
  opacity:0;
  transform:translateY(18px);
  filter:none !important;
  transition:opacity .7s ease, transform .85s cubic-bezier(.22,1,.3,1);
}

.sw-section7.is-active .sw-process-layout{
  opacity:1;
  transform:translateY(0);
}

.sw-brand-action{
  position:relative;
  min-height:360px;
  padding:2rem 1.35rem;
  border-radius:1.1rem;
  background:#0b0b0b;
  color:#fff;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  transform:none;
  animation:none !important;
}

.sw-step-dot{
  display:none !important;
}

.sw-brand-action h3{
  margin-top:1.3rem;
  font-size:1.36rem;
  font-weight:600;
  letter-spacing:-.04em;
}

.sw-brand-action p{
  margin-top:.95rem;
  padding-top:.95rem;
  border-top:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.72);
  font-size:.98rem;
  font-weight:500;
  line-height:1.5;
  letter-spacing:-.03em;
}

.sw-action-icon{
  position:relative;
  width:4.7rem;
  height:4.7rem;
  border:2px solid rgba(182,255,0,.72);
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(182,255,0,.02);
}

.sw-action-icon img{
  width:35px;
  height:34px;
  object-fit:contain;
  filter:drop-shadow(0 0 10px rgba(182,255,0,.16));
}

/* OUTER ARROW */
.sw-process-arrow{
  align-self:center;
  justify-self:center;
  width:13px;
  height:10px;
  margin:0;
  background:none;
  border:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0;
}

.sw-process-arrow::before{
  display:none;
}

.sw-process-arrow img{
  width:100%;
  height:auto;
  display:block;
  opacity:.9;
}

/* SHELLWE BOX */
.sw-shellwe-box{
  min-width:0;
  padding:4rem 1.8rem;
  border:1px solid #e4e7ec;
  border-radius:1.3rem;
  background:#fff;
  transform:none;
  animation:none !important;
  box-shadow:0 18px 46px rgba(20,25,40,.035), 0 2px 6px rgba(20,25,40,.01);
}

.sw-shellwe-box > strong{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.6rem;
  color:#0b0b0b;
  font-size:1.36rem;
  font-weight:700;
  letter-spacing:-.02em;
}

.sw-shellwe-box > strong img{
  width:18px;
  height:18px;
  object-fit:contain;
  animation:swRotate 5s ease-in-out infinite;
}

/* 2,3,4 */
.sw-shellwe-flow{
  min-width:0;
  margin-top:1.8rem;
  padding:0;
  display:grid;
  grid-template-columns:1fr 40px 1fr 40px 1fr;
  align-items:center;
  gap:.75rem;
  transform:none;
  animation:none !important;
}

.sw-shellwe-step{
  min-width:0;
  min-height:9.3rem;
  padding:2rem .85rem;
  border:1px dashed #d9dde5;
  border-radius:1rem;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.75rem;
  text-align:center;
}

.sw-shellwe-icon{
  width:3.8rem;
  height:3.8rem;
  border-radius:999px;
  background:#0b0b0b;
  display:flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

.sw-shellwe-icon img{
  width:1.6rem;
  height:1.8rem;
  object-fit:contain;
  display:block;
}

.sw-shellwe-icon1 img{
  width:1.8rem;
  height:1.9rem;
}

.sw-shellwe-step span{
  display:none !important;
}

.sw-shellwe-step h4{
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0;
  color:#0b0b0b;
  font-size:1.06rem;
  font-weight:700;
  letter-spacing:-.025em;
  line-height:1.3;
  text-align:center;
}

.sw-shellwe-step p{
  display:none;
}

/* INNER ARROW */
.sw-flow-line{
  align-self:center;
  justify-self:center;
  width:11px;
  height:10px;
  margin:0;
  background:none;
  border:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:0;
}

.sw-flow-line::before{
  display:none;
}

.sw-flow-line img{
  width:100%;
  height:auto;
  display:block;
  opacity:.9;
}

/* NOTE */
.sw-process-note{
  width:min(570px,100%);
  margin:3rem auto 0;
  padding:.95rem 1.25rem;
  border:1px solid #e4e7ec;
  border-radius:999px;
  background:#fafbfc;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:1rem;
  box-shadow:none;
}

.sw-process-note strong{
  position:relative;
  padding-left:1.65rem;
  color:#0b0b0b;
  font-size:.94rem;
  font-weight:700;
  letter-spacing:-.03em;
  white-space:nowrap;
}

.sw-process-note strong::before{
  content:"✓";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:1.15rem;
  height:1.15rem;
  border-radius:50%;
  background:#111;
  color:#b6ff00;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.7rem;
  font-weight:900;
}

.sw-process-note span{
  padding-left:1rem;
  border-left:1px solid #e1e4ea;
  color:#7a7979;
  font-size:.94rem;
  font-weight:500;
  line-height:1.45;
  text-align:left;
  letter-spacing:-.01em;
}

.sw-brand-touch{
  display:none !important;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   09-1. SECTION 7 RESPONSIVE — (≤1200px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:1200px){
  .sw-section7-inner{
    width:min(980px, calc(100% - 72px));
  }

  .sw-process-layout{
    grid-template-columns:170px 30px minmax(0,1fr) 30px 170px;
    gap:.65rem;
    margin-top:3.4rem;
  }

  .sw-brand-action{
    min-height:315px;
    padding:1.7rem 1rem;
  }

  .sw-action-icon{
    width:4.15rem;
    height:4.15rem;
  }

  .sw-action-icon img{
    width:30px;
    height:30px;
  }

  .sw-brand-action h3{
    font-size:1.16rem;
  }

  .sw-brand-action p{
    font-size:.84rem;
  }

  .sw-shellwe-box{
    padding:3.2rem 1.2rem;
  }

  .sw-shellwe-box > strong{
    font-size:1.18rem;
  }

  .sw-shellwe-flow{
    grid-template-columns:1fr 28px 1fr 28px 1fr;
    gap:.5rem;
  }

  .sw-shellwe-step{
    min-height:8.3rem;
    padding:1.5rem .55rem;
  }

  .sw-shellwe-icon{
    width:3.25rem;
    height:3.25rem;
  }

  .sw-shellwe-step h4{
    font-size:.94rem;
  }
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   09-2. SECTION 7 RESPONSIVE — TABLET (≤1024px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:1024px){
  .sw-section7-inner{
    width:min(720px, calc(100% - 56px));
  }

  .sw-section7-title{
    font-size:2.05rem;
  }

  .sw-section7-desc{
    margin-top:.8rem;
    font-size:.98rem;
  }

  .sw-process-layout{
    grid-template-columns:1fr;
    gap:.8rem;
    margin-top:2.8rem;
  }

  .sw-brand-action{
    min-height:0;
    width:100%;
    padding:1.35rem 2.7rem;
    border-radius:1.1rem;
    display:grid;
    grid-template-columns:4.1rem 1fr;
    align-items:center;
    text-align:left;
  }

  .sw-action-icon{
    grid-column:1;
    grid-row:1 / span 2;
    width:3rem;
    height:3rem;
  }

  .sw-action-icon img{
    width:26px;
    height:26px;
  }

  .sw-brand-action h3{
    grid-column:2;
    margin:0;
    font-size:1.16rem;
    line-height:1.3;
    text-align:left;
  }

  .sw-brand-action p{
    grid-column:2;
    margin-top:.45rem;
    padding-top:0;
    border-top:0;
    font-size:.86rem;
    line-height:1.45;
    text-align:left;
  }

  .sw-brand-action p br{
    display:none;
  }

  .sw-process-arrow{
    width:10px;
    height:34px;
    margin:0 auto;
  }

  .sw-process-arrow img{
    width:100%;
    transform:rotate(90deg);
  }

  .sw-shellwe-box{
    width:100%;
    padding:1.8rem 1.35rem;
    border-radius:1.1rem;
  }

  .sw-shellwe-box > strong{
    font-size:1.2rem;
  }

  .sw-shellwe-flow{
    width:100%;
    margin-top:1.25rem;
    display:flex;
    flex-direction:column;
    gap:.6rem;
  }

  .sw-shellwe-step{
    width:100%;
    min-height:0;
    padding:1rem 1.15rem;
    display:grid;
    grid-template-columns:3.15rem 1fr;
    column-gap:.9rem;
    align-items:center;
    justify-content:initial;
    text-align:left;
  }

  .sw-shellwe-icon{
    grid-column:1;
    width:3.1rem;
    height:3.1rem;
  }

  .sw-shellwe-icon img{
    width:1.4rem;
    height:1.4rem;
  }

  .sw-shellwe-step h4{
    grid-column:2;
    justify-content:flex-start;
    font-size:1.1rem;
    text-align:left;
  }

  .sw-flow-line{
    width:10px;
    height:30px;
    margin:0 auto;
  }

  .sw-flow-line img{
    width:100%;
    transform:rotate(90deg);
  }

  .sw-process-note{
    width:100%;
    margin-top: 3rem;
    border-radius: 100px;
  }
  .sw-shellwe-step h4 br{
    display:none;
  }
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   09-3. SECTION 7 RESPONSIVE — MOBILE (≤768px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:768px){
  .sw-section7-inner{
    width:calc(100% - 36px);
  }

  .sw-section7-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section7-desc{
    margin-top:.7rem;
    font-size:.88rem;
    line-height:1.45;
  }

  .sw-process-layout{
    gap:.55rem;
    margin-top:2rem;
  }

  .sw-brand-action{
    padding:1rem 1.05rem;
    border-radius:1rem;
    grid-template-columns:3.6rem 1fr;
    column-gap:1rem;
  }

  .sw-action-icon{
    width:3.6rem;
    height:3.6rem;
  }

  .sw-action-icon img{
    width:27px;
    height:27px;
  }

  .sw-brand-action h3{
    font-size:1.1rem;
    line-height:1.25;
  }

  .sw-brand-action p{
    margin-top: -.2rem;
    font-size: .86rem;
    line-height:1.35;
  }

  .sw-process-arrow{
    width:18px;
    height:32px;
  }

  .sw-shellwe-box{
    padding:1rem;
    border-radius:1rem;
  }

  .sw-shellwe-box > strong{
    font-size:.88rem;
    gap:.45rem;
  }

  .sw-shellwe-box > strong img{
    width:15.5px;
    height:15.5px;
  }

  .sw-shellwe-flow{
    margin-top:.85rem;
    gap:.5rem;
  }

  .sw-shellwe-step{
    padding:.85rem 1rem;
    grid-template-columns:2.7rem 1fr;
    column-gap:.8rem;
    border-radius:.85rem;
  }

 
  .sw-shellwe-icon img{
    width:1.5rem;
    height:1.5rem;

  }

  .sw-shellwe-step h4{
    font-size:.92rem;
    line-height:1.45;
  }



  .sw-process-note{
    width:100%;
    margin-top:1.6rem;
    padding:.95rem;

    border-radius:3rem;
    text-align:center;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
  }

  .sw-process-note strong{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;

    width:100%;
    margin:0;
    padding-left:0;   /* 기존값 제거 */

    color:#0b0b0b;
    font-size:.85rem;
    font-weight:700;
    line-height:1.2;
            letter-spacing: -.03em;
  }

  .sw-process-note strong::before{
    position:static;  /* 절대위치 제거 */
    transform:none;
    margin:0;
    flex-shrink:0;
  }

  .sw-process-note span{
    display:block;
    width:100%;

    margin:0;
    padding:0;
    border:0;

    text-align:center;
    font-size:.85rem;
    line-height:1.45;
        letter-spacing: -.03em;
  }

  .sw-process-note strong::before{width: .9rem;
        height: .9rem;
        margin-top: -1.5px;}


}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   09-4. SECTION 7 RESPONSIVE — MOBILE XS (≤441px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:441px){
  .sw-section7-title{
    font-size:1.5rem;
  }

  .sw-section7-desc{
    font-size:.86rem;
  }

  .sw-brand-action{
    grid-template-columns:3.25rem 1fr;
    column-gap:.85rem;
  }

  .sw-action-icon{
    width:3rem;
    height:3rem;
  }

  .sw-action-icon img{
    width:22px;
    height:22px;
  }

.sw-shellwe-icon img {
  width: 1.2rem;
  height: 1.2rem;}

    .sw-shellwe-icon {
 width: 2.2rem;
        height: 2.2rem;
    }
    .sw-brand-action h3{
      font-size:1.05rem;
      line-height:1.25;
    }
  
    .sw-brand-action p{
      margin-top: -.2rem;
      font-size: .84rem;
      line-height:1.35;
    }
    .sw-shellwe-step h4{margin-left: 0 !important;}

    .sw-shellwe-step{        column-gap: .4rem;}
  
}

@keyframes swRotate{
  0%{ transform:rotate(0deg); }
  50%{ transform:rotate(180deg); }
  100%{ transform:rotate(360deg); }
}


/* ─────────────────────────────────────────────────────────
   10. SECTION 8 — KPI
   ───────────────────────────────────────────────────────── */

.sw-section8 {
  position: relative;
  z-index: 30;
  overflow: hidden;
}

.sw-section8-inner {
  width: min(1120px, 92vw);
  margin: 0 auto;
  text-align: center;
}

.sw-section8-kpi {
    background: #0b0b0b;
    color: #fff;
    padding: 160px 0 160px;
}

.sw-section8-title {
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.02em;
  text-align: center;
}

.sw-section8-desc {
  margin-top: 1rem;
  font-size: 1.02rem;
  font-weight: 500;
  color: rgba(255,255,255,.52);
}

/* KPI */

.sw-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin-top: 4rem;
}

.sw-kpi-item{
    position: relative;
    padding: 2rem 1rem;
    border-radius: 1.2rem;
    background: rgba(15, 15, 15, .42);
    border: 1px solid rgba(255, 255, 255, .25);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(8px);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04), 0 18px 40px rgba(0, 0, 0, .18);
}
/*
.sw-kpi-item::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 1.15rem;
  width: 28px;
  height: 2px;
  border-radius: 999px;
  background: rgba(255,255,255,.22);
  transform: translateX(-50%);
}
*/
.sw-kpi-item strong {
  display: block;
font-size: 2.7rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.025em;
    color: #fff;
    margin-top: 0.7rem;
}

.sw-kpi-item p {

  font-size: .95rem;
  font-weight: 600;
  color: #b6ff00;
}

.sw-kpi-item p{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

.sw-kpi-icon{
  width:13px;
  height:13px;
  display:block;
  object-fit:contain;
  animation:swKpiIconSpin 7s linear infinite;
  transform-origin:center;
}

@keyframes swKpiIconSpin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(360deg); }
}


@media (max-width:1024px) and (min-width:769px){

.sw-kpi-item{font-size: .85rem;}
.sw-kpi-item strong{font-size: 2rem;}

}


/* MOBILE */

@media (max-width: 768px) {
  .sw-section8-kpi {
    padding: 92px 0 76px;
  }

  .sw-section8-title {
    font-size: 1.75rem;
    line-height: 1.25;
  }

  .sw-section8-desc {
    font-size: .9rem;
    line-height: 1.5;
  }

  .sw-kpi-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: .8rem;
    margin-top: 3rem;
  }

  .sw-kpi-item {
    padding: 1.45rem .7rem 1.85rem;
    border-radius: 1rem;
  }

  .sw-kpi-item strong {
    font-size: 2.05rem;
    letter-spacing: -0.02em;
  }

  .sw-kpi-item p {
    margin-top: .75rem;
    font-size: .8rem;
  }

  .sw-kpi-item::after {
    bottom: .95rem;
    width: 22px;
  }
}

.sw-section8-kpi{
  position: relative;
  overflow: hidden;

  background-image:
radial-gradient(
      circle at center,
      rgba(0,0,0,.22) 0%,
      rgba(0,0,3,.72) 85%
    ),

    linear-gradient(
      180deg,
      rgba(0,0,0,.28),
      rgba(0,0,0,.38)
    ),

    url('./img/PPL_A.jpg');

  background-size: 100% 100%, 100% 100%, cover;
  background-position: center;
  background-repeat: no-repeat;

  color:#fff;
}

@media (max-width: 441px) {
.sw-section8-inner {width: calc(100% - 50px);
}
.sw-kpi-item strong {font-size: 1.9rem;}}


/* ─────────────────────────────────────────────────────────
   11. SECTION 9 — FAQ
   ───────────────────────────────────────────────────────── */

.sw-section9{
  position:relative;
  z-index:30;
  background:#f7f7f7;
  color:#0b0b0b;
}

.sw-section9-inner{
  width:min(980px,92vw);
  margin:0 auto;
}

.sw-section9-title{
  text-align:center;
  font-size:2.5rem;
  font-weight:700;
  line-height:1.15;
  letter-spacing:-.02em;
}

.sw-section9-desc{
  margin-top:1rem;
  text-align:center;
  color:#7a7979;
  font-size:1.14rem;
  font-weight:500;
  line-height:1.5;
  letter-spacing:-.015em;
}

.sw-faq-list{
  margin-top:4rem;
}

.sw-faq-item{
  border-bottom:1px solid #e5e7eb;
}

.sw-faq-item{
 border-bottom:1px solid rgba(0,0,0,.22);
}

.sw-faq-question{
  width:100%;

  display:flex;
  align-items:center;
  gap:1rem;

  padding:1.8rem 0;

  border:none;
  background:none;

  cursor:pointer;
  text-align:left;
}

.sw-faq-q{
  width:28px;
  height:28px;
  flex:0 0 28px;

  display:flex;
  align-items:center;
  justify-content:center;

  border-radius:.45rem;

  background:#0b0b0b;
  color:#b6ff00;

  font-size:.82rem;
  font-weight:700;
}

.sw-faq-question strong{
    flex: 1;
    color: #0b0b0b;
    font-size: 22px;
    font-weight: 700;
    line-height: 1.45;
    letter-spacing: -.02em;
}

/* PLUS ICON */

.sw-faq-question i{
  position:relative;

  width:18px;
  height:18px;
  flex:0 0 18px;

  font-size:0;
  color:transparent;
  font-style:normal;
}

.sw-faq-question i::before,
.sw-faq-question i::after{
  content:"";
  position:absolute;

  left:50%;
  top:50%;

  background:#9c9c9c;
  border-radius:999px;

  transition:.25s ease;
}

.sw-faq-question i::before{
  width:20px;
  height:2px;

  transform:translate(-50%, -50%);
}

.sw-faq-question i::after{
  width:2px;
  height:20px;

  transform:translate(-50%, -50%);
}

.sw-faq-item.active .sw-faq-question i::after{
  opacity:0;
}

/* ANSWER */

.sw-faq-answer{
  max-height:0;
  overflow:hidden;

  transition:max-height .42s cubic-bezier(.22,1,.3,1);
}

.sw-faq-item.active .sw-faq-answer{
  max-height:260px;
}

.sw-faq-answer p{
    padding: 0 1.8rem 1.8rem 44px;
    /* color: rgba(0, 0, 0, .62); */
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.7;
    letter-spacing: -.01em;
    word-break: keep-all;
}

/* TABLET */

@media (max-width:1024px){

  .sw-faq-list{
    margin-top:3rem;
  }

  .sw-faq-question strong{
    font-size:1.05rem;
  }

  .sw-faq-answer p{
    font-size:.95rem;
  }
}

/* MOBILE */

@media (max-width:768px){

  .sw-faq-list{
    margin-top:2.2rem;
  }

  .sw-faq-question{
    gap:.75rem;
    padding:1.25rem 0;
  }

  .sw-faq-q{
        width: 24px;
        height: 20px;
        flex-basis: 20px;
        border-radius: .3rem;
        font-size: .7rem;
  }

  .sw-faq-question strong{
    font-size:.92rem;
    line-height:1.45;
    word-break:keep-all;
  }

  .sw-faq-answer p{
    padding:0 0 1.35rem 36px;

    font-size:.8rem;
    line-height:1.65;

    word-break:keep-all;
  }
}

@media (max-width:441px){

  .sw-faq-question{
    gap:.65rem;
  }

  .sw-faq-question strong{
    font-size:1.01rem;
  }

  .sw-faq-answer p{
    font-size: .9rem;
        padding: 0 0 1.35rem 0;
  }

  .sw-faq-question i::before{
  width:16px;
  height:2px;

  transform:translate(-50%, -50%);
}

.sw-faq-question i::after{
  width:2px;
  height:16px;

  transform:translate(-50%, -50%);
}
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   10-1. SECTION 8 — BRAND LOGO SLIDER
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.sw-brand-logo-area {
    background: #fff;
    color: #fff;
    padding: 60px 0 150px;
}

.sw-brand-logo-title{
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(0, 0, 0, .32);
  color: #0b0b0b;
  font-size: .8rem;
  font-family: "Trap", "Inter", sans-serif;

}

.sw-logo-slider {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin-top: 2rem;
}

/* 좌우 잘림 방지용 마스크 제거 */
.sw-logo-slider::before,
.sw-logo-slider::after {
  display: none;
}

.sw-logo-list {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  width: max-content;
  animation: swBrandLogoSlide 28s linear infinite;
}

.sw-logo-box{
  width: 132px;
  height: 54px;

  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0 1.2rem;

  border: 1px solid rgba(255,255,255,.12);
  border-radius: .5rem;

  background: #fff;

  flex: 0 0 auto;
}

.sw-logo-box img{
  width: 100%;
  height: 100%;

  object-fit: contain;

  transition: opacity .3s ease;
}

.sw-logo-box:hover img{
  opacity: .9;
}
@keyframes swBrandLogoSlide {
  0% {
    transform: translateX(0);
  }

  100% {
    transform: translateX(calc(-50% - 1rem));
  }
}

@media (max-width:768px){
.sw-brand-logo-area {
    padding: 60px 0 70px;
}
}
/* ─────────────────────────────────────────────────────────
   12. CTA SECTION
   ───────────────────────────────────────────────────────── */

.sw-section-cta{
  position:relative;
  z-index:30;

  overflow:hidden;

  background:#0b0b0b;
  color:#fff;

  padding:80px 20px;
}

.sw-section-cta-inner{
  position:relative;
  z-index:2;

  width:min(1150px, 92vw);
  margin:0 auto;

  text-align:center;
}

/* CONTENT */

.sw-section-cta-title{
    font-size: 2.5rem;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: -0.03em;
    color: #fff;
}

.sw-section-cta-desc{
  margin-top:0.5rem;

  font-size:1.14rem;
  font-weight:500;
  line-height:1.6;
  letter-spacing:-0.02em;

  color:rgba(255,255,255,.58);
}

/* BUTTON */

.sw-section-cta-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .48em;
    margin-top: 1rem;
    padding: 1.05em 2.2em;
    border: none;
    border-radius: 999px;
    background: #fff;
    color: #000;
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: .3s ease;
    box-shadow: 0 10px 24px rgba(255, 255, 255, .08);
}

.sw-section-cta-btn:hover{
  transform:translateY(-2px);

  box-shadow:
    0 18px 40px rgba(255,255,255,.12);
}

/* MOBILE */

@media (max-width:768px){

  .sw-section-cta{
    padding:100px 22px;
  }

  .sw-section-cta-inner{
    text-align:center;
  }

  .sw-section-cta-title{
    font-size:2.3rem;
    line-height:1.18;
  }

  .sw-section-cta-desc{
    margin-top:1rem;

    font-size:.95rem;
    line-height:1.6;
  }

  .sw-section-cta-btn{
    width:100%;
    max-width:320px;

    height:60px;

    margin-top:2.3rem;

    border-radius:18px;

    font-size:.96rem;
  }

  .sw-section-cta-bg img{
    object-position:center;
    opacity:.28;
  }

  .sw-section-cta::after{
    background:
      linear-gradient(
        180deg,
        rgba(5,5,5,.88) 0%,
        rgba(5,5,5,.58) 34%,
        rgba(5,5,5,.48) 60%,
        rgba(5,5,5,.92) 100%
      );
  }
}

.sw-section-cta-bg img{
  object-position: 77% center;
}


.sw-section8,
.sw-section9{
  position: relative;

  transform: translateZ(0);
  backface-visibility: hidden;
}

.sw-section9{
  margin-top:-1px;
}

/* ─────────────────────────────────────────────────────────
   13. COMMON SPACING / FINAL OVERRIDE
   ───────────────────────────────────────────────────────── */

.sw-section-spacing {
  padding-top: 160px;
  padding-bottom: 160px;
}

@media (max-width: 768px) {
  .sw-section-spacing {
    padding-top: 80px;
    padding-bottom: 80px;
  }


  .sw-arrow-down {
    display: block;
    margin: 0.6rem 0 0;
  font-size: 1.5rem;}
}

.sw-final-title{
  opacity:0;
  transform:translateY(34px);
  filter:blur(10px);

  transition:
    opacity 1s cubic-bezier(.22,1,.36,1),
    transform 1s cubic-bezier(.22,1,.36,1),
    filter 1s cubic-bezier(.22,1,.36,1);
}

.sw-final-title.is-show{
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}

#section2,
#section3,
#section4,
#section5,
#section6,
#section7,
#section8,
#section9,
footer{
  content-visibility:auto;
  contain-intrinsic-size:900px;
}


/* ─────────────────────────────────────────────────────────
   14. MOBILE FIT — SECTION 3/4/5/6/9/CTA
   ───────────────────────────────────────────────────────── */

@media (max-width:768px){

  /* COMMON */
  .sw-section3-inner,
  .sw-section5-inner,
  .sw-section6-inner,
  .sw-section9-inner{
    width:calc(100% - 36px);
    max-width:520px;
  }

    /* COMMON */
  .sw-section9-inner{
    width:calc(100% - 70px);
    max-width:520px;
  }


  .sw-section2-desc,
  .sw-section5-desc,
  .sw-section9-desc{
    font-size:.86rem;
    line-height:1.5;
    word-break:keep-all;
  }

  /* SECTION 3 */
  .sw-campaign-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    margin-top:1.5rem;
    padding:0 18px .35rem;
    margin-left:-18px;
    margin-right:-18px;
    gap:.5rem;
    -webkit-overflow-scrolling:touch;
  }

  .sw-campaign-tab{
    flex:0 0 auto;
    height:34px;
    padding:0 .9rem;
    font-size:.74rem;
    white-space:nowrap;
  }

  .sw-campaign-grid{
    display:flex;
    overflow-x:auto;
    gap:1rem;
    margin-top:1.8rem;
    padding:0 18px 1rem;
    margin-left:-18px;
    margin-right:-18px;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
  }

  .sw-campaign-card{
    flex:0 0 72%;
    max-width:235px;
    scroll-snap-align:start;
  }

  .sw-campaign-video{
    border-radius:14px;
  }

  .sw-campaign-name{
    font-size:.86rem;
  }

  .sw-campaign-brand{
    font-size:.75rem;
  }

  .sw-campaign-tab{
    transition:none !important;
  }


  /* SECTION 5 */
  .sw-channel-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    margin-top:1.5rem;
    padding:0 18px .35rem;
    margin-left:-18px;
    margin-right:-18px;
    gap:.5rem;
    -webkit-overflow-scrolling:touch;
  }

  .sw-channel-tab{
    flex:0 0 auto;
    height:34px;
    padding:0 .9rem;
    font-size:.74rem;
    white-space:nowrap;
  }

  .sw-channel-stage{
    height:410px;
    margin-top:1.8rem;
  }

  .sw-channel-card.is-main[data-type="vertical"]{
    width:min(68vw,230px);
    height:min(108vw,370px);
  }

  .sw-channel-card.is-main[data-type="horizontal"]{
    width:min(84vw,310px);
    height:min(47vw,174px);
  }

  .sw-channel-card.is-main[data-type="square"]{
    width:min(72vw,270px);
    height:min(72vw,270px);
  }

  .sw-channel-card.is-side{
    width:180px;
    height:290px;
    opacity:.18;
  }

  .sw-channel-card.is-left{
    left:-38%;
  }

  .sw-channel-card.is-right{
    right:-38%;
  }

  .sw-channel-guide{
    margin-top:.8rem;
    font-size:.72rem;
  }

  

  
  /* CTA */
  .sw-section-cta{
    padding:76px 20px;
  }

  .sw-section-cta-inner{
    width:calc(100% - 8px);
    text-align:center;
  }

  .sw-section-cta-title{
    font-size:1.65rem;
    line-height:1.28;
    word-break:keep-all;
  }

  .sw-section-cta-desc{
    margin-top:.8rem;
    font-size:.86rem;
    line-height:1.55;
    word-break:keep-all;
  }

  .sw-section-cta-btn{
    width:100%;
    max-width:290px;
    height:50px;
    margin-top:1.8rem;
    border-radius:999px;
    font-size:.86rem;
  }

  .sw-section-cta-bg img{
    object-fit:cover;
    object-position:center;
    opacity:.24;
  }
}

@media (max-width:441px){.sw-section2-desc{font-size: .9rem;}}

@media (max-width:390px){
  .sw-section3-inner,
  .sw-section4-inner,
  .sw-section5-inner,
  .sw-section6-inner,
  .sw-section9-inner{
    width:calc(100% - 50px);
  }

  .sw-campaign-card{
    flex-basis:78%;
  }

  .sw-feature-row{
    gap:.6rem;
  }

  .sw-feature-item{
    min-height:136px;
    padding:.95rem .75rem;
  }

  .sw-channel-stage{
    height:390px;
  }

  .sw-channel-card.is-main[data-type="vertical"]{
    width:220px;
    height:350px;
  }

  .sw-channel-card.is-left{
    left:-44%;
  }

  .sw-channel-card.is-right{
    right:-44%;
  }
}

/* ─────────────────────────────────────────────────────────
   15. SITE INTRO LOADING
   ───────────────────────────────────────────────────────── */

/* 전체 화면 블랙 배경 */
body.is-loading::before{
  content:"";
  position:fixed;
  inset:0;

  z-index:2147483646;

  background:rgba(0,0,0,.98);

  pointer-events:auto;
}

/* 가운데 intro */

.hero-loading-spinner{
  width:100%;
  height:100%;
  position:relative;
}

.hero-loading-spinner img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
}

/* 상단 문구 */
.hero-loading-label{
  color:#b6ff00;

  font-size:.62rem;
  font-weight:700;

  letter-spacing:.18em;
  text-transform:uppercase;

  opacity:.92;
}

/* SHALLWE LOGO */
.hero-loading-logo{
  margin-top:1.15rem;
}

.hero-loading-logo img{
  width:180px;

  display:block;

  filter:brightness(0) invert(1);

  opacity:.98;
}

/* 라인 */
.hero-loading-bar{
  position:relative;

  width:180px;
  height:1px;

  margin-top:1.4rem;

  overflow:hidden;

  background:rgba(255,255,255,.08);
}

/* 흐르는 라인 */
.hero-loading-bar::after{
  content:"";

  position:absolute;
  top:0;
  left:-40%;

  width:40%;
  height:100%;

  background:#b6ff00;

  box-shadow:
    0 0 10px rgba(182,255,0,.55);

  animation:heroLoadingMove 1.05s linear infinite;
}

@keyframes heroLoadingMove{
  0%{
    left:-40%;
  }

  100%{
    left:100%;
  }
}

/* ─────────────────────────────────────────────────────────
   16. MOBILE RESPONSIVE REFINEMENT — SEC 3/5/7
   ───────────────────────────────────────────────────────── */

@media (max-width:768px){


  /* SECTION 5 - 상품 영역 */
  .sw-section5-inner{
    width:calc(100% - 36px);
    max-width:520px;
  }

  .sw-section5-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section5-desc{
    margin-top:.7rem;
    font-size:.9rem;
    line-height:1.45;
  }

  .sw-channel-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    gap:.55rem;
    margin-top:1.6rem;
    padding:0 18px .35rem;
    margin-left:-18px;
    margin-right:-18px;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }

  .sw-channel-tabs::-webkit-scrollbar{
    display:none;
  }

  .sw-channel-tab{
    flex:0 0 auto;
    height:38px;
    padding:0 1rem;
    font-size:.78rem;
    white-space:nowrap;
    scroll-snap-align:start;
  }

  .sw-channel-stage{
    height:500px;
    margin-top:2rem;
  }

  .sw-channel-stage::before,
  .sw-channel-stage::after{
    width:170px;
    height:300px;
    opacity:.14;
    filter:blur(8px) brightness(.8) saturate(.78);
  }

  .sw-channel-stage::before{
    left:22%;
  }

  .sw-channel-stage::after{
    right:22%;
  }

  .sw-channel-card[data-type="vertical"]{
    width:260px;
    height:430px;
  }

  .sw-channel-card[data-type="feed"]{
    width:286px;
    height:430px;
  }

  .sw-channel-card[data-type="horizontal"]{
    width:315px;
    height:220px;
  }

  .sw-channel-card.is-main{
    transform:translate(-50%,-50%) scale(1);
  }

  .sw-app-top{
    height:58px;
    padding:13px 14px;
  }

  .sw-app-top strong{
    font-size:.78rem;
  }

  .sw-app-side{
    right:10px;
    gap:14px;
  }

  .sw-side-action img{
    width:24px;
    height:24px;
  }

  .sw-app-bottom{
    padding:58px 13px 15px;
  }

  .sw-app-bottom strong{
    font-size:.8rem;
  }

  .sw-app-bottom p{
    font-size:.68rem;
  }

  .sw-youtube-bottom{
    padding:11px 13px;
  }

  .sw-youtube-bottom strong{
    font-size:.8rem;
  }

  .sw-youtube-bottom p{
    font-size:.66rem;
  }
  .sw-channel-tab,
  .sw-channel-tab.active{
    flex:0 0 auto;

    min-width:auto;
    width:auto;

    transform:none !important;
    transition:
      background .25s ease,
      color .25s ease,
      border-color .25s ease;

    font-weight:600;
  }

  /* SECTION 7 - 모바일 프로세스 */
  .sw-section7-inner{
    width:calc(100% - 36px);
    max-width:520px;
  }

  .sw-section7-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section7-desc{
    margin-top:.7rem;
    font-size:.88rem;
    line-height:1.45;
  }

  .sw-process-layout{
    grid-template-columns:1fr;
    gap:.6rem;
    margin-top:2rem;
  }

  .sw-process-arrow{
    display:flex;
    align-items:center;
    justify-content:center;
    width:18px;
    height:18px;
    margin:.15rem auto;
    opacity:.32;
  }

  .sw-process-arrow img,
  .sw-process-arrow svg{
    width:100%;
    height:100%;
    display:block;
    object-fit:contain;
  }

  .sw-shellwe-box{
    width:100%;
    padding:1.3rem;
    border-radius:1rem;
  }

  .sw-shellwe-box > strong{
    font-size:1.1rem;
  }

 
  .sw-shellwe-step span{
    width:1.55rem;
    height:1.55rem;
    margin:0 auto .42rem;
    font-size:.72rem;
  }

  .sw-shellwe-step h4{
    width: 100%;
    min-width: 0;
    display: block;
    margin-left: 20px;
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.04em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .sw-shellwe-step p{
    width:100%;
    margin:.28rem 0 0;
    display:block;
    font-size:.58rem;
    line-height:1.28;
    letter-spacing:-.04em;
    text-align:center;
    white-space:normal;
    word-break:keep-all;
  }

  .sw-shellwe-step p br{
    display:none ;
  }

}

@media (max-width:441px){

  .sw-section3-inner,
  .sw-section5-inner,
  .sw-section7-inner{
    width:calc(100% - 32px);
  }



  .sw-campaign-grid{
    gap:1.15rem .72rem;
  }

  .sw-campaign-tab,
  .sw-channel-tab{
    height:34px;
    padding:0 .85rem;
    font-size:.74rem;
  }

  .sw-channel-stage{
    height:455px;
  }

  .sw-channel-stage::before,
  .sw-channel-stage::after{
    width:150px;
    height:270px;
  }

  .sw-channel-stage::before{
    left:22%;
  }

  .sw-channel-stage::after{
    right:22%;
  }

  .sw-channel-card[data-type="vertical"]{
    width:250px;
    height:415px;
  }

  .sw-channel-card[data-type="feed"]{
    width:278px;
    height:420px;
  }

  .sw-channel-card[data-type="horizontal"]{
    width:310px;
    height:214px;
  }


  .sw-shellwe-step h4{
    font-size:1rem;
  }

  .sw-shellwe-step p{
    font-size:.54rem;
    line-height:1.25;
  }
  .sw-action-icon{    width: 3.1rem;
    height: 3.1rem;}
    .sw-process-arrow img {
      width: 100%;
      transform: rotate(90deg) !important;
  }

  .sw-shellwe-box > strong {
    font-size: 1.1rem;
}

.sw-shellwe-step p br{
    display:none ;
  }

  .sw-shellwe-flow{gap: .2rem;}
  .sw-shellwe-flow{margin-top: 1rem;;}

    .sw-flow-line img{transform: rotate(90deg) !important;}      

}

@media screen and (max-width:820px){

  /* SECTION 5 */
  .sw-section5 .sw-section5-inner{
    width:calc(100% - 50px) !important;
    max-width:none !important;
  }

  .sw-section5 .sw-section5-title{
    font-size:1.75rem;
    line-height:1.25;
  }

  .sw-section5 .sw-section5-desc{
    margin-top:.7rem;
    font-size:.92rem;
    line-height:1.45;
  }

  .sw-section5 .sw-channel-tabs{
    display:flex;
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    overflow-y:hidden;
    gap:.55rem;
    margin-top:1.6rem;
    padding:0 18px .4rem;
    margin-right:-18px;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    animation:none !important;
    transform:none !important;
  }

  .sw-section5 .sw-channel-tabs::-webkit-scrollbar{
    display:none;
  }



  .sw-section5 .sw-channel-stage{
    height:480px;
    margin-top:1.4rem;
  }

  .sw-section5 .sw-channel-stage::before,
  .sw-section5 .sw-channel-stage::after{
    width:170px;
    height:305px;
    opacity:.15;
  }

  .sw-section5 .sw-channel-stage::before{ left:24%; }
  .sw-section5 .sw-channel-stage::after{ right:24%; }

  .sw-section5 .sw-channel-card[data-type="vertical"]{
    width:260px;
    height:420px;
  }

  .sw-section5 .sw-channel-card[data-type="feed"]{
    width:286px;
    height:430px;
  }

  .sw-section5 .sw-channel-card[data-type="horizontal"],
  .sw-section5 .sw-channel-card[data-card="youtube"]{
    width:min(92vw,390px);
    height:300px;
    border-radius:22px;
  }

  .sw-section5 .sw-channel-card.is-main{
    left:50%;
    transform:translate(-50%,-50%) scale(1);
  }

  /* FEED */
  .sw-section5 .sw-feed-top{
    height:46px;
  }

  .sw-section5 .sw-feed-carousel{
    top:46px;
    bottom:130px;
  }

  .sw-section5 .sw-feed-bottom{
    height:130px;
    padding:10px 12px 12px;
    overflow:hidden;
  }

  .sw-section5 .sw-feed-bottom p{
    height:62px;
    max-height:none;
    overflow-y:auto;
    padding-bottom:34px;
    font-size:.68rem;
    line-height:1.45;
    white-space:pre-line;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .sw-section5 .sw-feed-bottom p::-webkit-scrollbar{
    display:none;
  }

  /* YOUTUBE LONG */
  .sw-section5 .sw-youtube-video{
    width:100%;
    aspect-ratio:16 / 9;
  }

  .sw-section5 .sw-youtube-video video{
    object-fit:contain;
  }

  .sw-section5 .sw-youtube-bottom{
    height:146px;
    padding:14px 16px 16px;
    overflow:hidden;
  }

  .sw-section5 .sw-youtube-title,
  .sw-section5 .sw-youtube-bottom strong{
    max-height:34px;
    font-size:.81rem;
    line-height:1.28;
    white-space:normal;
  }

  .sw-section5 .sw-youtube-meta{
    margin-top:6px;
  }

  .sw-section5 .sw-youtube-channel{
    font-size:.68rem;
  }

  .sw-section5 .sw-youtube-desc,
  .sw-section5 .sw-youtube-bottom p{
    margin-top:-5px;
    height:52px;
    max-height:none;
    overflow-y:auto;
    padding-bottom:24px;
    font-size:.66rem;
    line-height:1.42;
    white-space:pre-line;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .sw-section5 .sw-youtube-desc::-webkit-scrollbar,
  .sw-section5 .sw-youtube-bottom p::-webkit-scrollbar{
    display:none;
  }

  /* SECTION 7 */
  .sw-section7 .sw-shellwe-step{
    min-width:0;
  }


}


@media screen and (max-width:441px){

  .sw-section3 .sw-section3-inner,
  .sw-section5 .sw-section5-inner{
    width:calc(100% - 32px);
  }

 
  .sw-section3 .sw-campaign-grid{
    gap:.2rem;
  }

  .sw-section3 .sw-campaign-tab,
  .sw-section5 .sw-channel-tab{
    height:34px;
    padding:0 1.2rem;
    font-size:.9rem;
  }

  .sw-section5 .sw-channel-stage{
    height:465px;
    margin-top:10px;
  }

  .sw-section5 .sw-channel-card[data-type="vertical"]{
    width:260px;
    height:440px;
    border-radius:20px;
  }

  .sw-section5 .sw-channel-card[data-type="feed"]{
    width:260px;
    height:440px;
    border-radius:20px;
  }

  

  .sw-section5 .sw-feed-carousel{
    bottom:132px;
  }

  .sw-section5 .sw-feed-bottom{
    height:132px;
  }

  .sw-section5 .sw-feed-bottom p{
    height:64px;
    font-size:.66rem;
    line-height:1.45;
    padding-bottom:36px;
  }

  .sw-section5 .sw-youtube-bottom{
    height:146px;
  }

  .sw-section5 .sw-youtube-desc,
  .sw-section5 .sw-youtube-bottom p{
    height:52px;
  }

  .sw-section5 .sw-section5-desc{
    margin-top:.7rem;
    font-size:.86rem;
  }

  .sw-campaign-name{
    margin-top:.7rem;
  }

  .sw-section5 .sw-channel-card[data-type="horizontal"], .sw-section5 .sw-channel-card[data-card="youtube"] {
        width: min(92vw, 390px);
        height: 285px;
        border-radius: 20px;

  }

    .sw-section5 .sw-channel-card[data-card="youtube"].is-main{
    transform:translate(-50%, -65%) scale(1) !important;
  }

}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   15-1. FINAL CENTER LOADING SPINNER
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.site-loading-intro{
  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;

  width:100vw;
  height:100vh;
  height:100dvh;

  transform:none;

  z-index:2147483647 !important;

  display:flex !important;
  align-items:center;
  justify-content:center;

  background:transparent;
  opacity:0;
  pointer-events:none;
  transition:opacity .28s ease;
}

body.is-loading .site-loading-intro{
  opacity:1;
}

body:not(.is-loading) .site-loading-intro{
  display:none !important;
}

.hero-loading-text,
.hero-loading-dots,
.hero-loading-label,
.hero-loading-logo,
.hero-loading-bar{
  display:none !important;
}

.hero-loading-spinner{
  position:relative;
  width:72px;
  height:72px;
  flex:0 0 72px;
}

.hero-loading-spinner img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  transform-origin:center;
}

.spinner-green{
  animation:spinnerGreen 1s linear infinite;
}

.spinner-white{
  animation:spinnerWhite 1s linear infinite;
}

@keyframes spinnerGreen{
  0%{ opacity:1; transform:rotate(0deg); }
  25%{ opacity:0; transform:rotate(90deg); }
  50%{ opacity:1; transform:rotate(180deg); }
  75%{ opacity:0; transform:rotate(270deg); }
  100%{ opacity:1; transform:rotate(360deg); }
}

@keyframes spinnerWhite{
  0%{ opacity:0; transform:rotate(0deg); }
  25%{ opacity:1; transform:rotate(90deg); }
  50%{ opacity:0; transform:rotate(180deg); }
  75%{ opacity:1; transform:rotate(270deg); }
  100%{ opacity:0; transform:rotate(360deg); }
}

.sw-section-cta-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;

  margin-top:1.5rem;

  padding:1.2em 2.8em;

  border:none;
  border-radius:999px;

  background:#b6ff00;
  color:#0b0b0b;

  font-size:1.02rem;
  font-weight:700;
  line-height:1;

  text-decoration:none;
  cursor:pointer;

  transition:.3s ease;
}

.sw-section-cta-btn:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(182,255,0,.28);
}

.sw-section-cta-btn::after{
  content:"→";
  display:inline-block;
  margin-left:.35em;
  animation:ctaArrowMove 1.8s ease-in-out infinite;
}

@keyframes ctaArrowMove{
  0%,100%{
    transform:translateX(0);
  }

  50%{
    transform:translateX(5px);
  }
}
/* HERO WORD - SMOOTH NO LAG */

body.is-loading .hero-word-inner{
  opacity:0;
}

body:not(.is-loading) .hero-word-inner{
  opacity:1;
}

/* ─────────────────────────────────────────────────────────
   17. COLOR SYSTEM & SECTION ISOLATION
   ───────────────────────────────────────────────────────── */

:root{
  --sw-black:#070707;
  --sw-white:#ffffff;
  --sw-green:#b6ff00;
  --sw-gray:#8a8a8a;
  --sw-line-dark:rgba(255,255,255,.16);
  --sw-line-light:rgba(0,0,0,.09);
}

/* 공통 : 반전 섹션 안에서는 플랫하게 */
.sw-section3,
.sw-section4,
.sw-section5{
  isolation:isolate;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   17-1. SECTION 4 — DESIGN OVERRIDE
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


.sw-section4-inner{
  position:relative;

  z-index:2;
}

.sw-section4-title{
  color:#090909;
}


.sw-feature-row{
  margin-top:3.8rem;
  gap:1.1rem;
}


.sw-feature-item:nth-child(2)::after{ border-radius:50%; transform:rotate(0); }
.sw-feature-item:nth-child(3)::after{ border-radius:0; transform:rotate(45deg); }
.sw-feature-item:nth-child(4)::after{ border-radius:999px; width:24px; height:12px; top:2.25rem; }

.sw-feature-item:hover{
  border-color:rgba(182,255,0,.95);
  background:#fff;
}


.sw-feature-content{
  padding:0;
  padding-right:3.5rem;
}

.sw-feature-content h3{
  color:#090909;
  font-size:1.42rem;
}


/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   17-2. SECTION 4 — SHAPE FLOAT ANIMATION
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

.sw-feature-tag{
  animation:swShapeFloat 4.5s ease-in-out infinite;
}

.sw-feature-item:nth-child(2) .sw-feature-tag{
  animation-delay:.6s;
}

.sw-feature-item:nth-child(3) .sw-feature-tag{
  animation-delay:1.2s;
}

.sw-feature-item:nth-child(4) .sw-feature-tag{
  animation-delay:1.8s;
}

@keyframes swShapeFloat{
  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-4px);
  }
}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   17-3. RESPONSIVE OVERRIDE
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@media (max-width:1024px){
  .sw-campaign-grid{

    gap:2rem 1.6rem;
  }

  .sw-feature-item{
    padding:34px 26px;
  }

  .sw-feature-content{
    padding-right:2.8rem;
  }
}

@media (max-width:768px){
  .sw-section3::before,
  .sw-section5::before{
    background-size:auto, 46px 46px, 46px 46px;
  }

  .sw-campaign-tabs,
  .sw-channel-tabs{
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    padding:0 18px .45rem;
    margin-left:0px;
    margin-right:-18px;
  }

  .sw-campaign-tab,
  .sw-channel-tab{
    flex:0 0 auto;
    height:38px;
    padding:0 1rem;
    font-size:.78rem;
  }

  .sw-campaign-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:1.5rem .85rem;
    margin-top:1.1rem;
  }

  .sw-campaign-name{
    font-size:1rem;
  }

  .sw-campaign-brand{
    font-size:.9rem;
  }

  .sw-section4::after{
    font-size:7rem;
    right:-.2em;
    bottom:-.12em;
  }

  .sw-feature-row{
    margin-top:2.3rem;
  }


  .sw-feature-item::before{
    width:34px;
    height:34px;
    right:.9rem;
    top:.9rem;
  }

  .sw-feature-item::after{
    width:14px;
    height:14px;
    right:1.5rem;
    top:1.5rem;
  }

  .sw-feature-item:nth-child(4)::after{
    width:18px;
    height:9px;
    top:1.62rem;
  }


  .sw-feature-content{
    padding-right:0;
  }
  .sw-feature-item{        padding: 30px 26px;}

 

}

@media (max-width:441px){
  .sw-campaign-grid{
    gap:1.35rem .7rem;
  }

  .sw-campaign-video{
    border-radius:20px;
  }

  .sw-campaign-play{
    width:2.6rem;
    height:2.6rem;
    font-size:.82rem;
  }

  .sw-feature-item{
    display:block !important;
  }

  .sw-feature-content h3{    font-size: 1.2rem;
  }

  .sw-feature-item {
    padding: 26px 22px;
    min-height: 140px;
    height: 145px;
}


  .sw-campaign-brand{
    font-size:.82rem;
  }



}


/* SECTION 7 */
.sw-section7 .sw-scroll-feature-copy{
  opacity:0;
  transform:translateY(26px);
  transition:
    opacity .75s ease,
    transform .9s cubic-bezier(.16,1,.3,1);
}

.sw-section7.is-active .sw-scroll-feature-copy{
  opacity:1;
  transform:translateY(0);
}

.sw-section7 .sw-scroll-feature-card{
  opacity:0;
  transform:translateY(36px) scale(.96);
  transition:
    opacity .75s ease,
    transform .95s cubic-bezier(.16,1,.3,1),
    border-color .35s ease,
    background .35s ease;
}

.sw-section7.is-active .sw-scroll-feature-card{
  opacity:1;
  transform:translateY(0) scale(1);
}

.sw-section7.is-active .sw-scroll-feature-card:nth-of-type(1){transition-delay:.08s;}
.sw-section7.is-active .sw-scroll-feature-card:nth-of-type(2){transition-delay:.2s;}
.sw-section7.is-active .sw-scroll-feature-card:nth-of-type(3){transition-delay:.32s;}

.sw-section7 .sw-process-arrow{
  opacity:0;
  transform:translateX(-12px);
  transition:
    opacity .55s ease,
    transform .75s cubic-bezier(.16,1,.3,1);
}

.sw-section7.is-active .sw-process-arrow{
  opacity:.42;
  transform:translateX(0);
}

.sw-section7 .sw-step-dot,
.sw-section7 .sw-shellwe-step span{
  transform:scale(.7);
  opacity:0;
  transition:
    opacity .45s ease,
    transform .6s cubic-bezier(.16,1,.3,1);
}

.sw-section7.is-active .sw-step-dot,
.sw-section7.is-active .sw-shellwe-step span{
  transform:scale(1);
  opacity:1;
}

.sw-section7.is-active .sw-shellwe-step:nth-child(1) span{transition-delay:.2s;}
.sw-section7.is-active .sw-shellwe-step:nth-child(2) span{transition-delay:.3s;}
.sw-section7.is-active .sw-shellwe-step:nth-child(3) span{transition-delay:.4s;}

.sw-section7 .sw-action-icon{
  transform:translateY(10px) scale(.92);
  opacity:.6;
  transition:
    opacity .65s ease,
    transform .8s cubic-bezier(.16,1,.3,1);
}

.sw-section7.is-active .sw-action-icon{
  transform:translateY(0) scale(1);
  opacity:1;
}

@media (max-width:768px){
  .sw-section4 .sw-feature-item,
  .sw-section7 .sw-scroll-feature-card{
    transform:translateY(24px);
  }

  .sw-feature-item:hover .sw-feature-tag{
    transform:none;
  }
}

@media (prefers-reduced-motion:reduce){
  .sw-section4 *,
  .sw-section7 *{
    animation:none !important;
    transition:none !important;
    transform:none !important;
  }
}


/* ─────────────────────────────────────────────────────────
   18. SCROLL SNAP
   ───────────────────────────────────────────────────────── */

html{
  scroll-behavior:smooth;
  scroll-snap-type:y proximity;
}

#section1,
#section2{
  scroll-snap-align:start;
  scroll-snap-stop:always;
}

#section3,
#section4,
#section5,
#section6,
#section7,
#section8,
#section9{
  scroll-snap-align:start;
}

@media (max-width:768px){
  html{
    scroll-snap-type:none;
  }
}

/* ─────────────────────────────────────────────────────────
   19. SECTION 4/7 — MOTION UNIFY
   ───────────────────────────────────────────────────────── */

/* SECTION 4 제목은 모션 제거 */
.sw-section4 .sw-section4-head{
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
}

/* SECTION 4 박스만 올라오기 */
.sw-section4 .sw-feature-item{
  opacity:0;
  transform:translateY(28px);
  transition:
    opacity .7s ease,
    transform .85s cubic-bezier(.22,1,.3,1),
    border-color .35s ease;
}

.sw-section4.is-active .sw-feature-item{
  opacity:1;
  transform:translateY(0);
}

.sw-section4.is-active .sw-feature-item:nth-child(1){transition-delay:.05s;}
.sw-section4.is-active .sw-feature-item:nth-child(2){transition-delay:.13s;}
.sw-section4.is-active .sw-feature-item:nth-child(3){transition-delay:.21s;}
.sw-section4.is-active .sw-feature-item:nth-child(4){transition-delay:.29s;}


/* SECTION 7 제목은 모션 제거 */
.sw-section7 .sw-section7-title,
.sw-section7 .sw-section7-desc{
  opacity:1 !important;
  transform:none !important;
  transition:none !important;
}

/* SECTION 7 전체 레이아웃 기본값 */
.sw-section7 .sw-process-layout{
  opacity:1 !important;
  transform:none !important;
}

/* SECTION 7 박스/요소만 올라오기 */
.sw-section7 .sw-brand-action,
.sw-section7 .sw-shellwe-box,
.sw-section7 .sw-brand-touch{
  opacity:0;
  transform:translateY(28px);
  transition:
    opacity .7s ease,
    transform .85s cubic-bezier(.22,1,.3,1);
}

.sw-section7.is-active .sw-brand-action,
.sw-section7.is-active .sw-shellwe-box,
.sw-section7.is-active .sw-brand-touch{
  opacity:1;
  transform:translateY(0);
}

.sw-section7.is-active .sw-brand-action:nth-of-type(1){
  transition-delay:.05s;
}

.sw-section7.is-active .sw-shellwe-box{
  transition-delay:.13s;
}

.sw-section7.is-active .sw-brand-action:nth-of-type(2){
  transition-delay:.21s;
}

.sw-section7.is-active .sw-brand-touch{
  transition-delay:.29s;
}

.sw-section7 .sw-process-arrow{
  opacity:0;
  transform:translateY(18px);
  transition:
    opacity .55s ease,
    transform .75s cubic-bezier(.22,1,.3,1);
}

.sw-section7.is-active .sw-process-arrow{
  opacity:1;
  transform:translateY(0);
}

.sw-section7.is-active .sw-process-arrow:nth-of-type(1){
  transition-delay:.1s;
}

.sw-section7.is-active .sw-process-arrow:nth-of-type(2){
  transition-delay:.18s;
}

/* ─────────────────────────────────────────────────────────
   20. SECTION 3/5 — TAB MOTION SAFE
   ───────────────────────────────────────────────────────── */

.sw-campaign-tab,
.sw-channel-tab{
  height: 41px;
  padding: 0 1.5rem;
  border: 1px solid #e1e4eb;
  border-radius: 999px;
  background: #0b0b0b;
  color: #fff;
  font-family: inherit;
  font-size: .95rem;
  font-weight: 600;
  cursor: pointer;
  transition: .32s ease;
}

.sw-section3:not(.is-active) .sw-campaign-tab:nth-child(1),
.sw-section5:not(.is-active) .sw-channel-tab:nth-child(1){
  transform:translateX(18px);
}

.sw-section3:not(.is-active) .sw-campaign-tab:nth-child(2),
.sw-section5:not(.is-active) .sw-channel-tab:nth-child(2){
  transform:translateX(10px);
}

.sw-section3:not(.is-active) .sw-campaign-tab:nth-child(3),
.sw-section5:not(.is-active) .sw-channel-tab:nth-child(3){
  transform:scale(.94);
}

.sw-section3:not(.is-active) .sw-campaign-tab:nth-child(4),
.sw-section5:not(.is-active) .sw-channel-tab:nth-child(4){
  transform:translateX(-10px);
}

.sw-section3:not(.is-active) .sw-campaign-tab:nth-child(5),
.sw-section5:not(.is-active) .sw-channel-tab:nth-child(5){
  transform:translateX(-18px);
}

.sw-section3:not(.is-active) .sw-campaign-tab:nth-child(6),
.sw-section5:not(.is-active) .sw-channel-tab:nth-child(6){
  transform:translateX(-24px);
}

.sw-section5:not(.is-active) .sw-channel-tab:nth-child(7){
  transform:translateX(-30px);
}

.sw-section3.is-active .sw-campaign-tab,
.sw-section5.is-active .sw-channel-tab{
  opacity:1 !important;
  transform:none;
}


/* ─────────────────────────────────────────────────────────
   21. FLOATING CONTACT BUTTON
   ───────────────────────────────────────────────────────── */

.floating-contact{
  position:fixed;
  right:15px;
  bottom:10px;
  z-index:9999;
}

.floating-contact img{
  width:70px;
  display:block;
  transition:.3s ease;
}

.floating-contact:hover img{
  transform:translateY(-6px) scale(1.05);
}

@media (max-width:441px){
  .floating-contact img{
  width:65px;

}}

.floating-contact{
  animation:contactFloat 3.2s ease-in-out infinite;
}

.floating-contact img{
  display:block;
  transition:transform .25s ease;
}

.floating-contact:hover img{
  transform:scale(1.06);
}

@keyframes contactFloat{
  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-7px);
  }
}

/* ─────────────────────────────────────────────────────────
   22. FOOTER
   ───────────────────────────────────────────────────────── */

.site-footer{
  position:relative;
  z-index:30;

  background:#f5f5f5;
  border-top:1px solid #e5e7eb;

  padding:58px 40px 42px;

  color:#6b7280;
  overflow:hidden;
}

.footer-inner{
  position:relative;
  z-index:2;

  width:min(1150px,100%);
  margin:0 auto;
}

/* LOGO */

.footer-logo{
  width:96px;
  display:block;

  margin-bottom:30px;

  filter:brightness(0);
  opacity:.92;
}

/* INFO */

.footer-info{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.footer-info p{
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    font-weight: 400;
    color: #7d7d7d;
    letter-spacing: -0.01em;
}

.footer-info a{
color:  #7d7d7d;
    font-weight: 600;
    text-decoration: none;
}

.footer-info .is-strong{
font-weight: 600;
    color: #0b0b0b;
}

.footer-info a.footer-mail {
font-weight: 600;
    color: #0b0b0b;
}

.footer-links {
  position: relative;
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 24px;
  padding-top: 16px; /* 라인과 텍스트 간격 */
}

.footer-links::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: rgba(0, 0, 0, 0.08); /* 아주 은은한 라인 */
}



/* LINKS */

.footer-links{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;

  margin-top:24px;
}

.footer-links a,
.footer-links span{
  font-size:13px;
  font-weight:600;
  letter-spacing:-0.03em;

  color:#0b0b0b;
  text-decoration:none;
}

.footer-bar{font-weight: 400 !important;   opacity: 0.6;   }

/* COPY */

.footer-copy{
  margin-top:12px;

  font-size:12px;
  line-height:1.6;
  letter-spacing:-0.01em;

  color:#9b9b9b;
}

/* MOBILE */

/* FOOTER MOBILE */

@media (max-width:768px){
  .site-footer{
    padding:44px 22px 38px;
  }

  .footer-logo{
    width:104px;
    margin-bottom:22px;
  }

  .footer-info p{
    font-size:12px;
    line-height:1.6;
  }

  .footer-links{
    margin-top:24px;
    gap:9px;
  }

  .footer-links a,
  .footer-links span{
    font-size:13px;
  }

  .footer-copy{
    font-size:11px;
    line-height:1.5;
  }

  .floating-contact{
    right:12px;
    bottom:14px;
  }


}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   06-2. SECTION 4 RESPONSIVE — MOBILE ICON FIX (≤768px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@media (max-width:768px){

  .sw-feature-item{
    position:relative !important;
    display:block !important;
    padding-right:110px !important;
  }

  .sw-feature-tag{
    position:absolute !important;
    right:20px !important;
    top:50% !important;
    transform:translateY(-50%) !important;

    justify-self:auto !important;
    align-self:auto !important;
  }


}

@media (max-width:441px){

  .sw-feature-item{
    padding-right:0px !important;
  }

  .sw-feature-tag{
    right:18px !important;
    width:75px !important;
    height:75px !important;
  }
}

@media (max-width:390px){

  .sw-feature-item{
    padding-right:0px !important;
  }

  .sw-feature-tag{
    right:18px !important;
    width:70px !important;
    height:70px !important;
  }
  .sw-feature-tag span{        font-size: .7rem;
    letter-spacing: -.02em;}
}

@media (max-width:370px){
.sw-feature-content p {
  font-size: .76rem;
}}

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
   07-3. SECTION 5 RESPONSIVE — TAB SCROLL (≤950px)
   - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

@media (max-width:950px){

  .sw-channel-tabs{
    justify-content:flex-start;

    flex-wrap:nowrap;

    overflow-x:auto;
    overflow-y:hidden;

    gap:.55rem;

    padding:0 1.2rem .4rem;
    margin-left:-1.2rem;
    margin-right:-1.2rem;

    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }

  .sw-channel-tabs::-webkit-scrollbar{
    display:none;
  }

  .sw-channel-tab{
    flex:0 0 auto;
    scroll-snap-align:start;
    white-space:nowrap;
  }
  .sw-channel-tabs{
    padding-left:15px;
    padding-right:15px;
    margin-left:-15px;
    margin-right:-15px;
  }
}


/* =========================================================
   COMMON TITLE / DESC — SECTION 3 ~ FAQ
   반드시 CSS 맨 마지막에 추가
========================================================= */

/* TITLE */
.sw-section3-title,
.sw-section4-title,
.sw-section5-title,
.sw-section6-title,
.sw-section7-title,
.sw-section8-title,
.sw-section9-title{
  font-size:2.5rem !important;
  font-weight:700 !important;
  line-height:1.15 !important;
  letter-spacing:-.02em !important;
  text-align:center !important;
}

/* DESC / SUB TITLE */
.sw-section3 .sw-section2-desc,
.sw-section4-desc,
.sw-section5-desc,
.sw-section7-desc,
.sw-section8-desc,
.sw-section9-desc{
  margin:1rem auto 0 !important;
  max-width:620px !important;
  font-size:1.14rem !important;
  font-weight:500 !important;
  line-height:1.5 !important;
  letter-spacing:-.015em !important;
  text-align:center !important;
}

/* 색상만 섹션 배경에 맞게 */
.sw-section3 .sw-section2-desc,
.sw-section8-desc{
  color:rgba(255,255,255,.52) !important;
}

.sw-section4-desc,
.sw-section5-desc,
.sw-section7-desc,
.sw-section9-desc{
  color:#7a7979 !important;
}

/* TABLET */
@media (max-width:1024px){
  .sw-section3-title,
  .sw-section4-title,
  .sw-section5-title,
  .sw-section6-title,
  .sw-section7-title,
  .sw-section8-title,
  .sw-section9-title{
    font-size:2.1rem !important;
  }

  .sw-section3 .sw-section2-desc,
  .sw-section4-desc,
  .sw-section5-desc,
  .sw-section7-desc,
  .sw-section8-desc,
  .sw-section9-desc{
    font-size:1rem !important;
    line-height:1.5 !important;
  }
}

/* MOBILE */
@media (max-width:768px){
  .sw-section3-title,
  .sw-section4-title,
  .sw-section5-title,
  .sw-section6-title,
  .sw-section7-title,
  .sw-section8-title,
  .sw-section9-title{
    font-size:1.75rem !important;
    line-height:1.3 !important;
    letter-spacing:-.02em !important;
  }

  .sw-section3 .sw-section2-desc,
  .sw-section4-desc,
  .sw-section5-desc,
  .sw-section7-desc,
  .sw-section8-desc,
  .sw-section9-desc{
    margin-top:.75rem !important;
    font-size:.9rem !important;
    line-height:1.45 !important;
  }
}

/* 441 이하 */
@media (max-width:441px){
  .sw-section3-title,
  .sw-section4-title,
  .sw-section5-title,
  .sw-section6-title,
  .sw-section7-title,
  .sw-section8-title,
  .sw-section9-title{
    font-size:1.62rem !important;
  }

  .sw-section3 .sw-section2-desc,
  .sw-section4-desc,
  .sw-section5-desc,
  .sw-section7-desc,
  .sw-section8-desc,
  .sw-section9-desc{
    font-size:.9rem !important;
  }
}


/* =========================================================
   MOBILE SCROLL MOTION
   SECTION 4 / SECTION 7
========================================================= */

@media (max-width:768px){

  /* SECTION 4 */
  .sw-section4 .sw-feature-item{
    opacity:0 !important;
    transform:translateY(28px) scale(.99) !important;

    transition:
      opacity .75s ease,
      transform .95s cubic-bezier(.22,1,.3,1) !important;
  }

  .sw-section4 .sw-feature-item.motion-in{
    opacity:1 !important;
    transform:translateY(0) scale(1) !important;
  }

  .sw-section4 .sw-feature-tag.motion-float{
    animation:swMobileSoftFloat 3.4s ease-in-out infinite;
  }


/* SECTION 7 - 박스별 스크롤 모션 */
@media (max-width:768px){

  .sw-section7 .sw-brand-action,
  .sw-section7 .sw-process-service,
  .sw-section7 .sw-process-arrow,
  .sw-section7 .sw-process-note{
    opacity:0 !important;
    transform:translateY(22px) scale(.99) !important;
    filter:blur(2px);
    transition:
      opacity .7s ease,
      transform .85s cubic-bezier(.22,1,.3,1),
      filter .7s ease !important;
  }

  .sw-section7 .sw-brand-action.motion-in,
  .sw-section7 .sw-process-service.motion-in,
  .sw-section7 .sw-process-arrow.motion-in,
  .sw-section7 .sw-process-note.motion-in{
    opacity:1 !important;
    transform:translateY(0) scale(1) !important;
    filter:blur(0);
  }
}
}

@keyframes swMobileSoftFloat{

  0%,100%{
    translate:0 0;
  }

  50%{
    translate:0 -5px;
  }
}


.mobile-br{
  display:none;
}

@media (max-width:768px){
  .mobile-br{
    display:inline;
  }
}

/* ===== HERO SPIN FIX ===== */

@keyframes spinGuide{
  0%{
    transform:rotate(0deg);
  }
  100%{
    transform:rotate(360deg);
  }
}

.hero-shape-guide-icon{
  animation:spinGuide 5s linear infinite !important;
}

.sw-app-bottom--image{
  padding:0;
  background:transparent;
  overflow:hidden;
}

.sw-app-bottom--image img{
  width:100%;
  height:auto;
  display:block;
  object-fit:cover;
  border-radius:0;
}