@charset "utf-8";
/* CSS Document */

#subpage { width: 100%; background: #000; }
#subpage section { width: 960px; margin: 0 auto; }
#subpage section p { margin-bottom: 50px; position: relative; }
#song { padding-left: 25px; }
#song span { background: #F00; color: #FFF; font-size: 10px; position: absolute; top: 0; right: 0; padding: 0 5px; }

.cen { text-align: center; }
.bands { width: 960px; margin: 0 auto 50px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; }
.bands li { padding: 5px; }

.other { text-align: center; color: #808080; font-size: 16px; letter-spacing: 0.1em; margin-bottom: 15px !important; }

.shopLink { margin-bottom: 10px !important; }
.shopLink a { display: block; width: 100%; padding: 10px 10px 10px 30px; border: 1px solid #FFF; box-sizing: border-box; color: #FFF; text-decoration: none; }
.shopLink a:first-line { font-size: large; }
.shopLink span { display: block; border-top: 1px dashed #FFF; margin-top: 15px; padding-top: 5px !important; }
.shopLink a:hover { background: #333; }

.top_img{
    margin-top:180px;
    text-align:center;
}
.top_img img{
    width:1000px;
}
.sub_contents{
    color:#fff;
    font-size:18px;
    width:75%;
    margin:0 auto 50px auto;
}
.banner{
    width:70%;
    text-align:center;
    margin:0 auto 50px auto;
}
.banner img{
    width:100%;
}
.banner_txt{
    font-weight:bold;
    text-align:left;
}
.coming{
    color:#fff;
    font-size:25px;
    text-align:center;
    width:100%;
}
.framebox{
    width:95%;
    border:solid 1px #ccc;
    padding:20px;
}
.framebox a{
    color:#fff;
    text-decoration:none;
    display:block;
}

.ind{
    font-size:24px;
}
.cau{
    font-size:16px;
}
.cau2{
    color:red;
    font-size:16px;
}
.reve_banner{
    background:url(../img/funtour/reve_banner_off.png) no-repeat;
    width:600px;
    height:167px;
}
.reve_banner:hover .change_img{
    opacity:1;
    background:url(../img/funtour/reve_banner.png) no-repeat;
    width:600px;
    height:167px;
}
.liar_banner{
    background:url(../img/funtour/liar_banner_off.png) no-repeat;
    width:600px;
    height:167px;
}
.liar_banner:hover .change_img{
    opacity:1;
    background:url(../img/funtour/liar_banner_on.png) no-repeat;
    width:600px;
    height:167px;
}
.app_banner{
    background:url(../img/funtour/app_banner_off.png) no-repeat;
    width:600px;
    height:167px;
}
.app_banner:hover .change_img{
    opacity:1;
    background:url(../img/funtour/app_banner_on.png) no-repeat;
    width:600px;
    height:167px;
}
.kyoh_banner{
    background:url(../img/funtour/kyoh_banner_off.png) no-repeat;
    width:600px;
    height:167px;
}
.kyoh_banner:hover .change_img{
    opacity:1;
    background:url(../img/funtour/kyoh_banner_on.png) no-repeat;
    width:600px;
    height:167px;
}
.change_img{
    opacity:0;
	transition: 0.5s ease;
}
.reve_banner a{
    display:block;
    width:600px;
    height:167px;
}
.sp{
    display:none;
}
.shopLinks{
    border:solid 1px #ccc;
    padding:20px;
    margin-bottom:20px;
}
.shopLinks .line{
    display: block;
    border-top: 1px dashed #FFF;
    margin-top: 15px;
    padding-top: 5px !important;
}
.j_image{
    width:1000px;
    margin:auto;
    overflow:hidden;
}
.j_image li {
    width:350px;
    float:left;
    margin:5px;
}
.j_image li img{
    width:100%;
}

@media (max-width: 768px){
    body {
        background: #000 url(../../common/img/bg.jpg) 30% 0 no-repeat;
        text-align: center;
        font-size: 12px;
        line-height: 1.7;
        color: #333;
        font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    }
    .sp{
        display:block;
    }
    .pc{
        display:none;
    }
    .top_img img{
        width:95%;
    }
    #subpage section {
        width: 100%;
        margin: 0 auto;
    }
    #subpage section img{
        width: 95%;
    }
    .sub_contents{
        color:#fff;
        font-size:16px;
        width:90%;
        margin:0 auto 50px auto;
    }
    .banner{
        width:95%;
        text-align:center;
        margin:0 auto 50px auto;
    }
    .cau{
        font-size:13px;
    }
    .framebox{
        width:100%;
        border:solid 1px #ccc;
    }
    .j_image{
        width:100%;
        margin:auto;
        overflow:hidden;
    }
    .j_image li {
        width:100%;
        float:left;
    }
    .j_image li img{
        width:100%;
    }
}