@charset "utf-8";

/* ---main--- */
.aceSec {
    padding: 250px 0px 200px;
}

.youthSec {
    padding: 0px 0px 250px;
}

.innerWrap {
    max-width: 1420px;
    width: 90%;
    margin: 0 auto;
}


.change {
    display: flex;
    flex-wrap: wrap;
    /* justify-content: space-between; */
    gap: 15px;
}

.change .child {
    flex: 0 0 calc((100% - 45px)/4);
    margin-bottom: 40px;
}

.change p {
    text-align: left;
    padding: .5em 0 0 1em;
}

.aceSec .change p {
    font-size: 20px;
    /* color: #8e8e8e; */
}

/* ---------------------------ここからアーティスト画像切り替え ----------------------------*/
.bnr {
    display: inline-block;
    max-width: 320px;
    aspect-ratio: 320 / 650;
    overflow: hidden;
    cursor: pointer;
    border-radius: 8px;
}

.youthSec .bnr {
    aspect-ratio: 1/1;
}

.bnr img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity .3s;
    border-radius: inherit;
    vertical-align: middle;
}

.bnr:hover img {
    opacity: 0;
}


/* ACE */
.bnr_01 {
    background: url(../images/top/top_photo/top_art02.jpg) center / cover no-repeat;
}

.bnr_02 {
    background: url(../images/top/top_photo/top_art01.jpg) center / cover no-repeat;
}

.bnr_03 {
    background: url(../images/top/top_photo/top_art03.jpg) center / cover no-repeat;
}

/* .bnr_05 {
    background: url() center / cover no-repeat;
} */


/* YOUTH */
.bnr_04 {
    background: url(../images/artist/top/art_sakai.jpg) center / cover no-repeat;
}

/* .bnr_06 {
    background: url() center / cover no-repeat;
} */

/* .bnr_07 {
    background: url() center / cover no-repeat;
} */

/* .bnr_08 {
    background: url() center / cover no-repeat;
} */

/* -------------------ここまでアーティストの画像切り替え----------------------------- */

/* ---main--- */







/* ---responsible design for iPad pro--- */
@media screen and (max-width: 1024px) {}

/* ---responsible design for iPad pro--- */



/* ---responsible design for Smartphone--- */
@media screen and (max-width: 375px) {
    .aceSec {
        padding: 150px 0px 100px;
    }

    .youthSec {
        padding: 0px 0px 150px;
    }

    /* .innerWrap {
        width: 95%;
    } */

    h3 {
        margin-bottom: 60px;
    }


    .change {
        gap: 10px;
    }

    .change .child {
        flex: 0 0 calc((100% - 20px)/3);
        margin-bottom: 20px;
    }

    .change p {
        padding: .3em 0 0 0;
    }

    .aceSec .change p {
        font-size: 15px;
    }





}

/* ---responsible design for Smartphone--- */