/**
 * Advertisement Styles
 *
 * GAM広告・BottomBanner・Infinity-Page広告などの
 * 広告関連スタイルを管理するファイル
 *
 * @package madameFIGARO.jp
 */

/* ==========================================================================
   GAM Ad Slot Styles
   ========================================================================== */

/* 将来的に以下のスタイルをapp.cssやインラインスタイルから移行可能:
 * - .gam-ad-slot-wrapper
 * - .gam-ad-slot
 * - .gam-ad-slot-pc
 * - .gam-ad-slot-sp
 * - .ad-slot-*
 * - .GAM__footerBnr
 */

@media screen and (min-width: 821px) {
  body .b-ad {
    padding: 0;
  }
  body .b-ad:has(iframe) {
    padding: 20px 0;
  }
}

@media screen and (max-width: 820px) {
  body .b-ad {
    padding: 0;
  }
  body .b-ad:has(iframe) {
    padding: 0 0 2.66667vw;
  }
}

/* ==========================================================================
   Full-Width Ad in 4-Column Grid
   ========================================================================== */

/* 4カラムグリッド内で全幅表示する広告用クラス */
.b-4col__item--full-width {
  width: 100% !important;
}

/* 広告コンテナを中央配置 */
.b-4col__item--full-width .b-ad {
  margin: 0 auto;
}

/* ==========================================================================
   gam-ad-slot
   ========================================================================== */

.wrapper{
  overflow: hidden;
}

.gam-ad-slot {
  margin: 40px auto !important;
}

@media screen and (min-width: 821px) {
  /* header */
  .b-ad .adbnnerWraper .adBnr > div {
    margin-left: 50% !important;
    transform: translate(-50%, 0) !important;
  }
  
  .gam-ad-slot > div {
    margin-left: 50% !important;
    transform: translate(-50%, 0) !important;
  }

  .gam-ad-slot iframe {
    margin: 0 !important;
  }
}