@charset "UTF-8";
@media screen and (min-width: 810px){
    #spthumbnail_01:hover .play_btn{width: 115px; height: 115px;}
    #spthumbnail_02:hover .play_btn{width: 115px; height: 115px;}
    #spthumbnail_03:hover .play_btn{width: 115px; height: 115px;}
    #spthumbnail_04:hover .play_btn{width: 115px; height: 115px;}
    #spthumbnail_05:hover .play_btn{width: 115px; height: 115px;}

    #thumbnail_top:hover .play_btn{width: 115px; height: 115px;}
    #thumbnail_top:hover .play_btn{width: 115px; height: 115px;}
    #thumbnail_middle:hover .play_btn{width: 115px; height: 115px;}
    #thumbnail_bottom:hover .play_btn{width: 115px; height: 115px;}

    .aiin-css-tpl-sb-heart-s .aiin-icon.btn-box:hover{transform: scale(1.1);}

    .sns .flex .item:hover{transform: translateY(10px);}
}
@media screen and (min-width: 1150px){
    .select_txt ul li .kijitsu_flex .img{ width: 30%;}
    .select_txt ul li .kijitsu_flex .week{font-size: 2.5rem;}
    .select_txt ul li .kijitsu_flex .day{font-size: 4.8rem;}
    .select_txt ul li .kijitsu_flex .time{font-size: 2rem;}
    .intro .box p{font-size: 2rem;}
    .kijitsumae .kensaku { width: 650px;}
}
@media screen and (max-width: 850px){
    .character ul li{width: 48%;}
}
@media screen and (max-width: 768px){
    .w-1100{padding: 0 15px;}
    .sv .flex .item{width: 100%;}
    .sv .flex .item:first-of-type{margin-bottom: 30px;}
    .intro .box h1{font-size: 3rem;}
    .intro .box h1::before{width: 20%; height: 85%;}
    .intro .box h1::after{width: 20%; height: 85%;}
    .fv .sp{display: block;}
    .fv .pc{display: none;}
    .sv .sp{display: block;}
    .sv .pc{display: none;}
    .kijitsumae .kensaku .pc{display: none;}
    .kijitsumae .kensaku .sp{display: block;}
    .kijitsumae .kensaku{width: 55vw;}

    .social_box{margin-bottom: 50px;}
    .tab-content{margin: 0 auto;}
    .tab-buttons{gap: 10px 5px;}
    .tab-btn{font-size: 1.6rem; padding: 10px 10px; font-size: 1.2rem;}
    .tab-btn::after{width: 8px; height: 8px; right: 10px;}
    .fv .fv_swiper .pc{display: none;}
    .fv .fv_swiper .sp{display: block;}
    
}
@media screen and (max-width: 650px){
    h2{font-size: 2.5rem;}
    .ttl_txt{font-size: 1.4rem; text-align: start; padding: 0 20px;}
    .kijitsumae .ttl_txt{text-align: center;}
    .kijitsumae .ttl_txt br{display: block;}
    .kijitsumae  .kensaku br{display: block;}
    .kijitsumae .kensaku span{font-size: 9.5vw;}

    .select_txt .area_txt{font-size: 1.8rem;}
    .select_btn{width: 70px;}
    .select_btn::after{width: 12px; height: 12px; top: 50%; }
    .kijitsumae .human{display: none;}
     /* kijitsumae */
    .select_txt ul li .kijitsu_flex{flex-wrap: wrap; justify-content: center;}
    .select_txt ul li .kijitsu_flex .img{width: 75%; margin: 0 auto; padding-bottom: 10px;}
    .select_txt ul li .kijitsu_flex .day-time_area{width: 100%;}
    .select_txt ul li .kijitsu_flex .img .sp{display: block;}
    .select_txt ul li .kijitsu_flex .img .pc{display: none;}
    .select_form{margin-bottom: 0;}
    #select_search{width: 100%; font-size: 16px;}
    #select_search option{font-size: 16px;}
    .select_txt h3{font-size: 2rem;}
    .select_txt ul li .place{font-size: 1.6rem; letter-spacing: -0.06em; min-height: 65px;}
    .select_txt ul li .place span{font-size: 1.2rem; letter-spacing: 0.1em;}

    /* movie */
    .special{font-size: 3rem;}
    .movie h3{font-size: 2rem; margin-bottom: 30px;}
    .movie .movie_wrap p{font-size: 1.4rem;}
    .play_btn{width: 40px; height: 40px;}

    .movie .box{padding: 12% 15px 15px 15px;}
    .movie h2{top: -20px; font-size: 5rem;}
}
@media screen and (max-width: 560px){
    .sv .flex{margin-top: 20px;}
    .pd-top{padding-top: 30px;}
    .pd-bottom{padding-bottom: 30px;}
    .select_txt ul li .kijitsu_flex .img{width: 100%;}
    .select_txt ul li .kijitsu_flex .time{font-size: 3vw;}
    .select_txt h3 br{display: block;}
    .select_btn{font-size: 1.4rem;}
    .select_txt ul li .place{padding: 5px;}
    .select_txt ul li .kijitsu_flex .day{font-size: 7.2vw;}
    .select_txt h3 span{display: inline-block; margin-bottom: 5px;}
    .kijitsumae .kensaku{width: 80vw;}
    /* intro */
    .intro .box h1{font-size: 2.2rem;}
    .intro .box h1::before{width: 30%; height: 100%; left: -33%; top: 20%;}
    .intro .box h1::after{width: 30%; height: 100%; right: -33%; top: 20%;}
    .intro .box .txt-img{width: 100%;}
    .intro .box p{font-size: 1.2rem;}
    .intro .illust.right{width: 15%; top: 32%;}
    .intro .illust.left{width: 15%; top: 32%;}

    .character ul li{width: 100%;}

    .movie .movie_wrap p{text-align: start;}
    .movie .main-slider{margin-bottom: 20px;}
    .movie .click{width: 90%;}

    /* sns */
    .sns .flex .item{width: 100%; margin-bottom: 20px;}
    .sns .flex .item:last-of-type{margin-bottom: 0;}
    .sns h3{line-height: 1.2; margin-bottom: 20px;}
    .sns h3 br{display: block;}
    .sns h3 span{font-size: 1.4rem;}
    .sns h3::after {bottom: -10px; width: 30px; height: 10px;}
    footer p{font-size: 1.2rem;}
    footer .add-tel p:first-of-type{padding-bottom: 2px;}
}
@media screen and (max-width: 450px){
    .intro .box h1 br.sp{display: block;}
    .movie h3 br{ display: block;}
    .movie .movie_wrap{margin-bottom: 20px;}
    .character ul li .txt{margin-bottom: 15px;}
    .fv .circle{bottom: -1.7vw;}
    .movie h2 {top: -14px; font-size: 11vw;}
}
@media screen and (max-width: 390px){
    .select_txt ul li .place{font-size: 4.2vw;}
    .select_txt ul li .kijitsu_flex .day{font-size: 6.2vw;}
    .select_txt ul li .kijitsu_flex .week{font-size: 2.2vw;}
    .select_txt ul li .place{min-height: 50px;}
    .fv .circle{bottom: -2vw;}
}
@media screen and (max-width: 320px){}