/* =========================================================
   広告枠（Googleアドセンス）のスタイル
   対応する blade：resources/views/components/ad-slot.blade.php

   ・アドセンスの <ins> は display:block が必須ですが、
     blade に style 属性を書かない方針のため、ここで指定します
   ========================================================= */

.ad-slot {
    max-width: 1000px;
    margin: 24px auto;
    padding: 0 20px;
    text-align: center;
}

/* アドセンスの規定どおり、幅いっぱいのブロック要素にする */
.ad-slot .adsbygoogle {
    display: block;
    width: 100%;
}

/* ---------- スマートフォン・タブレット対応 ---------- */

@media screen and (max-width: 768px) {
    .ad-slot {
        margin: 20px auto;
        padding: 0 16px;
    }
}

@media screen and (max-width: 480px) {
    .ad-slot {
        margin: 16px auto;
        padding: 0 14px;
    }
}