@charset "UTF-8";


@media (max-width: 1400px) {


}

@media (max-width: 1200px) {
  .container {padding:0 1rem;}
  .benefits__inner {padding:0 1rem;} 

  .benefits__detail {justify-content: space-between;}
  .benefits__icon {position:relative; height:90px;}

  .carrier-products__inner { padding: 0 20px; }

}

@media (max-width: 1100px) {

}

@media (max-width: 1024px) {

    :root {--active-width:600px;--card-width:180px;} 
    .utility-nav {margin-left:40px; gap:20px;} 
    .main-nav {gap:30px; font-size:18px;} 
    .hero-controls {width:600px;} 
    .hero-card__copy {padding-left:20px; padding-right:20px;} 
    .hero-card__title {font-size:18px; } 

    .quick-menu__container { padding: 0 20px; }

    .benefits__card {padding:2rem 1.5rem; height:350px;}
    .benefits .benefits__card-title span {font-size:1.5rem; }
    .benefits__detail {left:2rem; right:auto; top: 125px; }
    .benefits__bottom {left:2rem; right:auto; bottom: 28px; }
    .benefits .benefits__description {font-size:.9rem; letter-spacing:-1px;}
    .benefits .benefits__note {font-size:.8rem;}
    .benefits .benefits__value,
    .benefits__value--amount span,
    .benefits .benefits__value--pink,
    .benefits .benefits__card-title span {font-size:1.4rem;}
    .benefits .benefits__value--amount {font-size:2rem;}

    .carrier-products__inner { padding: 0 20px; }
    .carrier-products__grid { gap: 12px; }
    .carrier-product { padding: 24px 20px; }
    .carrier-product .carrier-product__name { font-size: 23px; line-height: 30px; }
    .carrier-product .carrier-product__feature { font-size: 14px; }
    .carrier-product .carrier-product__badge { min-height: 36px; padding: 6px 8px; font-size: 15px; }
    .carrier-product__price > strong { font-size: 29px; }
    .carrier-product__price > span { font-size: 16px; }
    .carrier-product__cta { font-size: 14px; }

}

@media (max-width:900px) {

    .benefits { padding: 70px 0; }
    .section-heading:not(.section-heading--compact) .section-title {font-size:1.8rem;}
    .section-heading:not(.section-heading--compact) .section-subtitle {margin-top:.5rem; font-size:.9rem;}
    .benefits__grid { grid-template-columns: 1fr; gap: 10px; margin-top: 32px; }
    .benefits__card {height:auto; padding:2rem; border-radius: 20px; }
    .benefits .benefits__card-title span {display:inline;}
    .benefits .benefits__mobile-mark { display: inline; }
    .benefits__detail {position:relative; top:auto; left:auto; right:auto; margin-top:.0; height:auto;}
    .benefits .benefits__description { margin-top: 3px; font-size: 14px;}
    .benefits__icon {height:80px;}
    .benefits__bottom { display: none; }
    .benefits__mobile-button { display: flex; margin-top: 10px; font-size: 14px; }

}

@media (max-width:780px) {
    :root { --active-width: calc(100vw - 40px); --card-width: 150px; --card-height: 340px; --gap: 10px; } 
    .top-banner { height: 44px; } 
    .top-banner__inner {font-size:.85rem; gap:6px; padding:0 10px; } 
    .top-banner__inner img { width: 32px; height: 30px; } 
    .top-banner__close { flex-shrink: 0; margin-left: 4px; } 
    .header__top {height:3.5rem;}
    .header__top .logo a img {width:7rem;}
    .utility-nav { display: none; } 
    .consult-button {height:38px; font-size:.9rem; padding:0 15px; border-radius:10px; }
    .header__bottom { height: 54px; gap: 15px; } 
    .main-nav {gap:1rem; overflow-x:auto; white-space:nowrap; font-size:1rem; scrollbar-width:none;} 
    .main-nav::-webkit-scrollbar { display: none; } 
    .header__bottom { gap: 16px; }
    .main-nav { flex: 1; overflow: hidden; padding: 12px 0; }
    .main-nav__track { gap: 0; }


    .menu-toggle { flex-shrink: 0; } .hero { padding-top: 18px; } 
    .hero-card { border-radius: 20px; } 
    .hero-swiper {height:300PX;}
    .hero-swiper .swiper-slide {height:100%;}
    .hero-card.is-active .hero-card__copy { padding: 25px; } 
    .hero-card.is-active .hero-card__title span {font-size: clamp(26px, 4vw, 30px); } 
    .hero-card.is-active .hero-card__description {font-size:.9rem; white-space: normal; } 
    .hero-card.is-active .hero-card__image {width:13rem; right: 14px; bottom: 12px; } 
    .hero-card__title {font-size: 16px; }
    .hero-card__copy { padding: 23px 16px; } 
    .hero-card__description { white-space: normal; font-size: 12px; } 
    .hero-controls {height: 65px;} 
    .all-menu:not([hidden]) { flex-wrap: wrap; font-size:1rem; gap: 20px; }

    .quick-menu { padding: 20px 0 24px; }
    .quick-menu__swiper { overflow: hidden; }
    .quick-menu .quick-menu__track { display: flex; gap: 0; }
    .quick-menu .quick-menu__item { width: 100px; flex-shrink: 0; }
    .quick-menu__label { font-size: 15px; }


    .situation-benefits { display: block; padding: 80px 12px 70px; border-radius: 0; }
    .situation-benefits__selector { text-align: center; }
    .section-heading--compact {text-align:center;}
    .section-heading--compact .section-title { font-size: clamp(26px, 8.2vw, 32px); line-height: 38px; letter-spacing: -.8px; }
    .section-heading--compact .section-subtitle { margin-top: 16px; font-size: 18px; line-height: 24px; }
    .situation-benefits__tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 8px 0; }
    .situation-benefits__tab { justify-content: center; height: 70px; padding: 8px 4px; font-size: 18px; line-height: 26px; letter-spacing: -.5px; text-align: center; }
    .situation-benefits .situation-benefits__tab-desktop, .situation-benefits .situation-benefits__tab-arrow { display: none; }
    .situation-benefits .situation-benefits__tab-mobile { display: inline; }
    .situation-benefits__results { margin-top: 20px; }
    .situation-benefits__panel { min-height: 448px; padding: 30px 32px 28px; border-radius: 22px; }
    .situation-benefits__result-title > span { display: block; }
    .situation-benefits__cta { margin-top: 12px; font-size: 14px; }

    .carrier-products__inner { padding: 0 12px; }
    .carrier-products__grid { grid-template-columns: 1fr; gap: 16px; margin-top: 28px; }
    .carrier-product { min-height: 0; padding: 28px 28px 26px; }
    .carrier-product .carrier-product__name { font-size: 26px; line-height: 32px; }
    .carrier-product__notes { min-height: 0; }
    .carrier-products__swiper { margin-top:28px; }
    .carrier-products__swiper .carrier-product { padding:24px 16px; }
    .carrier-products__swiper .carrier-product__name { font-size:22px; line-height:29px; }
    .carrier-products__swiper .carrier-product__feature { gap:5px; font-size:13px; }
    .carrier-products__swiper .carrier-product__badge { padding:6px 8px; min-height:36px; font-size:14px; line-height:22px; }
    .carrier-products__swiper .carrier-product__price > strong { font-size:28px; }
    .carrier-products__swiper .carrier-product__price > span { font-size:16px; }
    .carrier-products__swiper .carrier-product__cta { font-size:14px; }
    .carrier-products__navigation { gap:8px; margin-top:12px; }
    .carrier-products__prev, .carrier-products__next { width:38px; height:38px; }



}

@media (max-width:600px) {
    .quick-menu .quick-menu__item {width:5rem;}
    .quick-menu__icon {width:5rem; height:5rem;}
    .hero-swiper {height:270px;}
    .hero-card.is-active .hero-card__image {width:11rem;}
}


@media (max-width:500px) {
    .header__top .logo a img {width:6rem;}
    .quick-menu .quick-menu__item {width:4rem;}
    .quick-menu__icon {width:4rem; height:4rem;}

    .benefits__card {padding:2rem 1.5rem;}
    .benefits .benefits__value,
    .benefits__value--amount span,
    .benefits .benefits__value--pink,
    .benefits .benefits__card-title span {font-size:1.3rem;}
    .benefits .benefits__value--amount {font-size:1.8rem;}

}


@media (max-width:470px) {
    .hero-card.is-active .hero-card__image {bottom:0; width:10rem;}
    .hero-card.is-active .hero-card__title span {font-size:1.4rem;}

    .section-heading:not(.section-heading--compact) .section-title { font-size: 22px; }
    .benefits .benefits__card-title { font-size: 17px; letter-spacing: -.7px; }
    .benefits__icon {height:75px; top:6px;}
    .benefits .benefits__description { font-size: 12px; }

    .situation-benefits__tab { font-size: 16px; }
    .situation-benefits__panel { padding-left: 20px; padding-right: 20px; }
    .situation-benefits .situation-benefits__result-title { font-size: 23px; }
    .situation-benefits .situation-benefits__description { font-size: 14px; }

    .carrier-product { padding-left: 20px; padding-right: 20px; }
    .carrier-product .carrier-product__badge { font-size: 16px; padding-left: 10px; padding-right: 10px; }


    

}
@media (max-width:390px) {



}
    
@media (max-width:360px) {


}
@media (max-width:345px) {

}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; } }

/* 상품 슬라이드: 601~1024px 2.5개 / 600px 이하 1.5개 */
@media (max-width:1024px) {
  .carrier-products__swiper .swiper-wrapper { display:flex; gap:0; }
  .carrier-products__navigation { display:flex; }
}
@media (max-width:600px) {
  .carrier-products__swiper .carrier-product { min-height:480px; padding:24px 16px; }
  .carrier-products__swiper .carrier-product__feature { font-size:13px; gap:5px; }
  .carrier-products__swiper .carrier-product__badge { font-size:14px; padding:6px 8px; }
  .carrier-products__swiper .carrier-product__price > strong { font-size:28px; }
  .carrier-products__swiper .carrier-product__price > span { font-size:16px; }
}
