/* 캐러셀 베이스 래퍼 - 모든 캐러셀에 적용 */ .base-carousel-wrapper, [class*="-carousel-wrapper"] { position: relative; max-width: 1200px; margin: 0 auto; padding: 0; } /* 캐러셀 베이스 내부 컨테이너 - 모든 캐러셀에 적용 */ .base-carousel-inner, [class*="-carousel-inner"] { overflow: hidden; position: relative; width: 100%; } /* 캐러셀 베이스 아이템 컨테이너 - 모든 캐러셀에 적용 */ .base-carousel-items, [class*="-carousel-items"] { display: flex !important; flex-direction: row !important; gap: 24px; transition: transform 0.3s ease; padding: 20px 0; width: max-content; } /* 캐러셀 베이스 네비게이션 버튼 - 모든 캐러셀에 적용 */ .base-carousel-nav-btn, [class*="-carousel-nav-btn"] { position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; background: white; border: none; border-radius: 50%; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; z-index: 10; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15); } .base-carousel-nav-btn:hover, [class*="-carousel-nav-btn"]:hover { background: #f8f9fa; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2); } .base-carousel-nav-btn i, [class*="-carousel-nav-btn"] i { color: #333; font-size: 16px; transition: color 0.3s ease; } .base-carousel-nav-btn:hover i, [class*="-carousel-nav-btn"]:hover i { color: #fa751e; } .base-carousel-prev, [class*="-carousel-prev"] { left: -20px; } .base-carousel-next, [class*="-carousel-next"] { right: -20px; } /* 반응형 조정 - 모든 캐러셀에 적용 */ @media (max-width: 1024px) { .base-carousel-wrapper, [class*="-carousel-wrapper"] { padding: 0 60px; } .base-carousel-prev, [class*="-carousel-prev"] { left: 10px; } .base-carousel-next, [class*="-carousel-next"] { right: 10px; } } @media (max-width: 768px) { .base-carousel-wrapper, [class*="-carousel-wrapper"] { padding: 0 20px; } .base-carousel-items, [class*="-carousel-items"] { gap: 16px; padding: 16px 0; } .base-carousel-nav-btn, [class*="-carousel-nav-btn"] { width: 36px; height: 36px; } .base-carousel-nav-btn i, [class*="-carousel-nav-btn"] i { font-size: 14px; } } /* =================================== 카테고리 네비게이션 스타일 =================================== */