@charset "UTF-8";
/* =========================================================
   ブランドロゴ表示（カテゴリの brand_logo）
   参考: https://macfan.book.mynavi.jp/brands/torras/
   ・ロゴは白い枠のボックス（独立エリア・全幅・左寄せ）
   ・その下に右寄せで小さく「Sponsored by ブランド名」
   ブランドページ上部／記事詳細の上部に表示する。
   ========================================================= */

.wd-brandlogo{
  margin:0;
}
/* ロゴのヘッダー領域はページ地色にして、白いスライダーと繋がって見えないようにする。
   SWELL fullWide の上パディング(32px)は不要なので消す（下は分離の余白として残す）。*/
.wd-brandlogo-fw{
  background:#f0f0f0;
  padding:0;
  margin-bottom:0;
}
/* 直後の fullWide（スライダー等）に SWELL が付ける -32px を打ち消し、食い込みを防ぐ */
.wd-brandlogo-fw + .swell-block-fullWide{
  margin-top:0 !important;
}
/* カテゴリアーカイブのロゴ帯（ヘッダー位置）*/
.wd-brandlogo-archive{
  background:#f0f0f0;
  margin-bottom:16px;
}

/* --- スポンサーページ：ヘッダー右上の共通バナーを非表示（バナー未設定でも隠す）--- */
.wd-sponsor .w-header > *:not(.wd-sponsor-banner){
  display:none !important;
}
.wd-sponsor-banner{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.wd-sponsor-banner img{
  display:block;
  max-width:100%;
  height:auto;
  max-height:90px;
}

/* ロゴのボックス（白背景）：ロゴ左・Sponsored右 の同じ行 */
.wd-brandlogo__box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:#fff;
  border:0;
  padding:18px 30px;
}
.wd-brandlogo__mark{
  display:flex;
  align-items:center;
}
.wd-brandlogo__box img,
.wd-brandlogo__img{
  display:block;
  width:auto;
  height:auto;
  max-height:48px;
  max-width:260px;
}

/* ロゴ右の「Sponsored by ブランド名」（同じ行・小さめ）*/
.wd-brandlogo__sponsored{
  flex:0 0 auto;
  margin:0;
  font-size:12px;
  color:#8a8a8a;
  letter-spacing:.02em;
  white-space:nowrap;
}
.wd-brandlogo__sponsored a{
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid currentColor;
}

/* 記事詳細：本文幅（全幅化しない）。背景は白。 */
.wd-brandlogo--single{
  background:#fff;
  padding-bottom:24px;
}
.wd-brandlogo--single .wd-brandlogo__box{
  padding:12px 16px;
}
.wd-brandlogo--single .wd-brandlogo__img{
  max-height:36px;
}

/* --- SP（スマホ）--- */
@media (max-width:600px){
  /* ロゴとSponsoredが1行に収まらないので縦積み（ロゴ上／Sponsored下・右寄せ）*/
  .wd-brandlogo__box{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
    padding:12px 14px;
  }
  .wd-brandlogo__img{
    max-height:32px;
    max-width:100%;
  }
  .wd-brandlogo__sponsored{
    align-self:flex-end;
    font-size:11px;
  }
}