/* Premium Ad Section Style - Flexbox & Slider Fix */ .premium-ad-section { padding: 20px; background: #f1f3f5; border-radius: 12px; } /* 1. 고정형 그리드 (Flexbox로 변경하여 마지막 줄 꽉 채우기) */ .premium-ad-fixed-grid { display: flex; flex-wrap: wrap; gap: var(--banner-gap, 10px); margin-bottom: var(--banner-gap, 10px); } .premium-ad-fixed-grid .banner-unit-wrapper { /* 💡 [핵심] 기본 너비는 (100% / 컬럼수) - 간격 보정, 하지만 flex-grow: 1로 남는 공간 채움 */ flex: 1 0 calc((100% - (var(--banner-gap, 10px) * (var(--fixed-columns) - 1))) / var(--fixed-columns)); height: var(--banner-height, 80px); position: relative; overflow: hidden; /* 너무 작아지는 것 방지 (선택 사항) */ min-width: 150px; } /* 2. 슬라이드형 래퍼 */ .premium-ad-row { position: relative; margin-bottom: 20px; padding: 0 50px; } .premium-ad-slider { width: 100%; height: var(--banner-height, 80px); overflow: hidden; } .premium-ad-slider .banner-unit-wrapper { height: 100%; } .banner-unit-wrapper img { width: 100%; height: 100%; display: block; object-fit: contain; } .slider-controls .swiper-button-prev, .slider-controls .swiper-button-next { color: #555 !important; width: 30px; height: 30px; background-color: #fff; border: 1px solid #ddd; border-radius: 50%; display: flex; align-items: center; justify-content: center; z-index: 10; top: 50%; transform: translateY(-50%); margin-top: 0; box-shadow: 0 2px 5px rgba(0,0,0,0.1); } .slider-controls .swiper-button-prev:after, .slider-controls .swiper-button-next:after { font-size: 14px !important; font-weight: bold; } .slider-controls .swiper-button-prev { left: 0; } .slider-controls .swiper-button-next { right: 0; } .empty-banner { text-align: center; padding: 20px; color: #999; }