/* バナーウィジェット用スタイル — hba-lightbox と分離 */
.hba-banner-widget{box-sizing:border-box;margin:0 auto;max-width:100%;display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:flex-start;--hba-banner-gap:20px;--hba-banner-cols:3}
.hba-banner-widget a{display:block;text-decoration:none;color:inherit;flex:1 1 calc((100% - (var(--hba-banner-cols) - 1) * var(--hba-banner-gap)) / var(--hba-banner-cols));max-width:calc((100% - (var(--hba-banner-cols) - 1) * var(--hba-banner-gap)) / var(--hba-banner-cols));border-radius:6px;overflow:hidden;margin:0}
.hba-banner-widget a img{display:block;width:100%;height:auto;transition:transform .18s ease,box-shadow .18s ease,opacity .18s ease;transform-origin:center center}
.hba-banner-widget a:hover img,.hba-banner-widget a:focus img{transform:scale(1.03);box-shadow:0 10px 24px rgba(0,0,0,0.16);opacity:0.98}
.hba-banner-widget .caption{display:block;text-align:center;padding:8px 6px;font-size:14px;color:#333}

/* モバイル: 縦に積む */
@media (max-width:860px){
  .hba-banner-widget{flex-direction:column;max-width:100%;gap:10px;padding:0 12px}
  .hba-banner-widget a{flex:1 1 auto;width:100%;max-width:none}
}

/* hba-lightbox セレクタとの干渉を避ける */
.hba-banner-widget .hba-lightbox-thumb img{border-radius:6px}

/* 補助: ウィジェット領域内で中央寄せするユーティリティ */
.hba-banner-widget--center{margin-left:auto;margin-right:auto}