@charset "UTF-8";

* {
    margin: 0;
    padding: 0;
}

body {
    font-family: "franklin-gothic-urw", sans-serif;
    font-style: normal;
    color: black;
}

.inner {
    overflow: hidden;
}

ul {
    list-style: none;
}

a {
    text-decoration: none;
    transition-property: opacity;
    transition-duration: 0.3s;
}

a:hover {
    opacity: 0.7;
}

img {
    width: 100%;
}


.main_box {
    width: 880px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
}



/*
////////////////////////////////////////////////////////////////////////////////

$$ ビルボード周辺

////////////////////////////////////////////////////////////////////////////////
*/
.logo_img {
    width: 500px;
    margin: 10px auto 30px;
}

.billboard_img {
    margin: 0px auto 40px;
}

/*
////////////////////////////////////////////////////////////////////////////////

$$ 各セクション

////////////////////////////////////////////////////////////////////////////////
*/

.article_ttl {
    font-size: 30px;
    text-align: center;
    margin-bottom: 32px;
}

p {
    width: 660px;
    font-size: 14px;
    margin: 0 auto 48px;
    line-height: 2.0;
}

.p_beginning {
    margin-bottom: 100px;
}

.cate_img_01 {
    margin-bottom: 50px;
}

.cate_ttl_01 {
    width: 580px;
    margin: 0 auto 40px;
}

.cate_ttl_02 {
    width: 600px;
    margin: 0 auto 40px;
}

.cate_ttl_03 {
    width: 520px;
    margin: 0 auto 40px;
}

.detail_ttl_01 {
    width: 500px;
    margin: 0 auto 22px;
}

.detail_img_01 {
    margin-bottom: 3px;
}

.detail_img_02 {
    margin-bottom: 50px;
}

.detail_btn_01 {
    width: 420px;
    margin: 0 auto 140px;
}

.series_ttl_01 {
    width: 470px;
    margin: 0 auto 35px;
}


/*スライダー*/

.sub_box_01 {
    width: 880px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 120px;
}

.sub_box_01 li {
    margin: 0 5px 10px;
}

.sub_box_01 li img {
    width: 215px;
}

.slick-list {
    margin: 0 0 0 -5px;
}

.slick-prev,
.slick-next {
    width: 30px;
    height: 30px;
    z-index: 9999;
}

.slick-prev:before,
.slick-next:before {
    color: #555555;
    opacity: 0.8;
    font-size: 30px;
}

.slick-next {
    right: -38px !important;
    top: 110px !important;
}

.slick-prev {
    left: -38px !important;
    top: 110px !important;
}

/* フッター */
.footer-copyright {
    width: 100%;
    background-color: #006dad;
    padding: 25px 0;
    margin: 0;
    text-align: center;
}

.footer-copyright__text {
    font-size: 12px;
    letter-spacing: 0.05rem;
    text-align: center;
    color: #ffffff;
}





.br_pc {
    display: block;
}

.br_sp {
    display: none;
}


.display_pc {
    display: block !important;
}

.display_sp {
    display: none !important;
}




/*
////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////

$$ Media Queries for smartphone

////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
*/

@media screen and (max-width: 768px) {


    .main_box {
        width: 100vw;
    }



    /*
////////////////////////////////////////////////////////////////////////////////

$$ ビルボード周辺

////////////////////////////////////////////////////////////////////////////////
*/
    .logo_img {
        width: 100vw;
        margin: 4vw auto 6vw;
    }

    .billboard_img {
        margin: 0px auto 8vw;
    }

    /*
////////////////////////////////////////////////////////////////////////////////

$$ 各セクション

////////////////////////////////////////////////////////////////////////////////
*/

    .article_ttl {
        font-size: 6vw;
        margin-bottom: 32px;
    }

    p {
        width: 90vw;
        font-size: 3vw;
        margin: 0 auto 10vw;
        line-height: 1.7;
    }

    .p_beginning {
        margin-bottom: 15vw;
    }

    .cate_img_01 {
        margin-bottom: 10vw;
    }

    .cate_ttl_01 {
        width: 93vw;
        margin: 0 auto 8vw;
    }

    .cate_ttl_02 {
        width: 93vw;
        margin: 0 auto 8vw;
    }

    .cate_ttl_03 {
        width: 87vw;
        margin: 0 auto 8vw;
    }

    .detail_ttl_01 {
        width: 94vw;
        margin: 0 auto 6vw;
    }

    .detail_img_01 {
        margin-bottom: 0vw;
    }

    .detail_img_02 {
        margin-bottom: 8vw;
    }

    .detail_btn_01 {
        width: 80vw;
        margin: 0 auto 18vw;
    }

    .series_ttl_01 {
        width: 80vw;
        margin: 20vw auto 3vw;
    }


    /*スライダー*/

    .sub_box_01 {
        width: 100%;
        margin-top: 5vw;
        margin-bottom: 12vw;
    }

    .sub_box_01 li {
        text-align: center;
        margin: 0 0 10px;
    }

    .sub_box_01 li img {
        width: 64vw;
        margin: 0 auto;
    }

    .slick-list {
        margin: 0 0 0 0;
    }


    .slick-prev,
    .slick-next {
        width: 10vw;
        height: 10vw;
        z-index: 9999;
    }

    .slick-prev:before,
    .slick-next:before {
        color: #555555;
        opacity: 0.8;
        font-size: 10vw;
    }

    .slick-next {
        right: 3vw !important;
        top: 33vw !important;
    }

    .slick-prev {
        left: 3vw !important;
        top: 33vw !important;
    }

    .slick-dots {
        bottom: -11vw !important;
    }


    /* フッター */
    .footer-copyright {
        width: 100vw;
        padding: 5vw 0 6vw;
        margin-top: 15vw;
    }

    .footer-copyright__text {
        font-size: 3vw;
        letter-spacing: 0.05rem;
    }






    .br_pc {
        display: none;
    }

    .br_sp {
        display: block;
    }


    .display_pc {
        display: none !important;
    }

    .display_sp {
        display: block !important;
    }




}