/*
Theme Name: SHUWA
Description: SHUWAのワードプレステーマ
Version: 1.0
*/

/* =============================================
フッターに使用している広告リスト
============================================= */
.ad {
    margin: 6rem 0;
}

.ad__ttl {
    margin: 0 auto 3.6rem;
    color: #000000;
    font-size: 1.4rem;
    line-height: 1.9;
}

.ad__ttl span {
    font-size: 3.6rem;
    line-height: 1;
}

.ad ul {
    padding: 0 1rem;

    gap: 1.5rem 0;
}

.ad__list {
    width: 100%;
}

.ad__list a {
    display: block;
}

.ad__list img {
    width: 100%;
}

@media screen and (min-width: 768px) {
    .ad ul {
        max-width: 708px;
        margin: 0 auto;
        padding: 0;

        gap: 2rem 0;
    }

    .ad__list {
        width: calc(50% - 2rem);
        margin: 0 1rem;
    }

    .ad li:first-of-type, .ad li:nth-of-type(2) {
        margin: 0 auto 1rem;
    }
}

@media screen and (min-width: 992px) {
    .ad__ttl {
        margin: 0 auto 5.1rem;
        font-size: 1.6rem;
    }

    .ad__ttl span {
        font-size: 4rem;
    }

    .ad ul {
        max-width: 980px;
        padding: 0 6.3rem;
    }
}

@media screen and (min-width: 1200px) {
    .ad {
        margin: 12rem 0;
    }

    .ad ul {
        padding: 0;

        gap: 3rem 0;
    }

    .ad__list {
        width: calc(100% / 3 - 2rem);
    }
}

@media (hover: hover) {
    .ad__list a {
        transition-duration: .5s;
    }

    .ad__list a:hover {
        transform: scale(1.05, 1.05);
        transition-duration: .5s;
    }
}