

/* frame */
.frame{position: fixed;width: 100%;height: 100dvh;top: 0;left: 0;z-index: 9996;pointer-events: none;border: 12px solid #fff;
    &:after{position: absolute;content: "";width: 100%;height: 100%;top: 0;left: 0;border: 5px solid #000;}
    .deco{position: absolute;width: 80px;
        &.top_l{top: 0;left: 0;transform: scale(-1, 1);}
        &.top_r{top: 0;right: 0;transform: scale(1, 1);}
        &.bottom_l{bottom: 0;left: 0;transform: scale(-1, -1);}
        &.bottom_r{bottom: 0;right: 0;transform: scale(1, -1);}
    }
}
@media only screen and (max-width: 835px){
    .frame{border: 6px solid #fff;
        &:after{border: 2px solid #000;}
        .deco{position: absolute;width: 40px;
            &.top_r{width: 80px;}
        }
    }
}

/* side bg */
.left_bg{position: fixed;top: 0;left: 0;width: min(480px,28vw);height: 100dvh;z-index: -1;pointer-events: none; display: flex;
    .anime_txt_hor{display: flex;flex-direction: column;width: 50%;overflow: hidden;
        img{animation: ver_move_t 60s linear infinite;width: 100%;}
        &.left{}
        &.right{position: relative;transform: scale(1, -1);left: -6px;z-index: -1;opacity:.7;}
    }
}
.right_bg{position: fixed;top: 50%;right: 24px;width: min(10px);z-index: -1;pointer-events: none;transform: translateY(-50%);}
@media only screen and (max-width: 835px){
    .left_bg{width: min(160px,30vw);
        .anime_txt_hor{
            &.left{display: none;}
            &.right{width: 100%;}
        }
    }
    .right_bg{right: 14px;width: 7px;}
}

/* anime txt */
.anime_txt{display: flex;width: 100%;overflow: hidden;background-color: #fff;pointer-events: none;border-top: 4px solid #000;margin-top: calc(var(--base_distance)*1);padding-top: 0.7em;
    p{flex: 0 0 auto;width: auto;white-space: nowrap;font-family: var(--f_01);color: #000;font-size: min(140px, 20vw);font-weight: 800;line-height: 0.95;margin: 0;padding-right: .5em;animation: hor_move_l 36s linear infinite;
        span{margin-right: -0.4em;}
    }
}


/* section wrap */
.section_wrap{margin-bottom: calc(var(--base_distance) * 1.2);}


/* h tit */
.h_tit_box{width: 100%;text-align: center;margin-bottom: calc(var(--base_distance) * 0.4);position: relative;opacity: 0;filter: blur(10px);transform: translateY(32px) scale(.96);transition: opacity .9s var(--easeOutQuint), transform .9s var(--easeOutQuint), filter .9s var(--easeOutQuint);will-change: opacity, transform, filter;
    .h_tit{font-size: min(140px,24vw);font-weight: 800;color: #000;line-height: 0.8em;display: inline-block;opacity: 1;will-change: opacity, transform, filter;
        .char{display: inline-block;opacity: 0;filter: blur(10px);transform: translateY(18px) scale(.9);}
    }
    .h_tit_txt{font-size: min(24px,4.6vw);font-weight: 900;color: #000;font-family: var(--f_noto);background-color: #D8D8D3;border: 1px solid #000;position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);padding: 0.1em 1em 0.2em;opacity: 0;will-change: opacity, transform, filter;}

    &.load_open, &.scroll_in{opacity: 1;filter: blur(0);transform: translateY(0) scale(1);
        .h_tit .char{animation: h_tit_char_reveal .56s cubic-bezier(0.22, 1, 0.36, 1) calc(var(--i) * .05s + .24s) both;}
        .h_tit_txt{animation: h_tit_txt_reveal .62s cubic-bezier(0.22, 1, 0.36, 1) .3s both;}
    }

    &.two{
        .h_tit{font-size: min(140px,12vw);}
        .h_tit_txt{font-size: min(24px,3.8vw);}
    }
}
.cmn_in_page_main{
    .h_tit_box{margin-bottom: calc(var(--base_distance) * 0.8);}
}
@keyframes h_tit_char_reveal {
    0% {opacity: 0;filter: blur(10px);transform: translateY(18px) scale(.9);}
    100% {opacity: 1;filter: blur(0);transform: translateY(0) scale(1);}
}
@keyframes h_tit_txt_reveal {
    0% {opacity: 0;filter: blur(10px);transform: translate(-50%, -50%) scale(.92);}
    100% {opacity: 1;filter: blur(0);transform: translate(-50%, -50%) scale(1);}
}
@media only screen and (max-width: 835px){
    .h_tit_box{
        &.two{
            .h_tit{font-size: 16vw;}
            .h_tit_txt{}
        }
    }
}


/* btn */
.btn_outer{position: relative;margin: 0 auto;margin-top: calc(var(--base_distance) * 0.4); width:min(500px,100%);
    .btn{position: relative;display: block;width: 100%;background-color: #386557;color: #fff;padding: 1.4em 2em;text-align: left;font-size: 20px;font-weight: 700;border-left: 2px solid #000;border-right: 2px solid #000;transition: 0.3s;
        &:after{position: absolute;content: "";background-image: url(../images/parts/arrow.svg);background-position: center;background-repeat: no-repeat;background-size: contain;width: min(40px);height: min(40px);top: 50%;right: 2em;transform: translateY(-50%);filter: brightness(1);transition: 0.3s;}
        &:hover{filter: brightness(1.15);
            &:after{right: 1.7em;}
        }
        &.back{text-align: right;
            &:after{right: initial; left: 2em;transform: translateY(-50%) scale(-1, 1);}
            &:hover{filter: brightness(1.15);
                &:after{left: 1.7em;}
            }
        }
        
        .bg{position: absolute;width: 100%;height: 100%;top: 0;left: 0;z-index: 9996;pointer-events: none;
            .deco{position: absolute;width: 15px;
                &.top_l{top: 0;left: 0;transform: scale(-1, 1);}
                &.top_r{top: 0;right: 0;transform: scale(1, 1);}
                &.bottom_l{bottom: 0;left: 0;transform: scale(-1, -1);}
                &.bottom_r{bottom: 0;right: 0;transform: scale(1, -1);}
            }
        }
    }
}
@media only screen and (max-width: 835px){
    .btn_outer{
        .btn{padding: 1.2em 1em;font-size: 16px;
            &:after{width: 30px;height: 30px;right: 1.2em;}
        }
    }
}


/*----------------------------------------
    top page
------------------------------------------*/

/* fv */
#fv{display: flex;gap:min(2vw,48px);width: min(1600px,90%);margin: 0 auto;padding-top: 60px;margin-bottom: 60px;position: relative;
    .kv{width: 46%;position: relative;z-index: 4;}
    .fv_content{width: calc(54% - min(2vw,48px));padding-bottom: 2.4vw;position: relative;z-index: 2;
        .content_inner{position: sticky;top: 140px;}
        .logo{width: 92%;margin: 0 auto 2.2vw;}
        .top_catch{width: 92%;margin: 0 auto 2.2vw;
            img{width: 100%;}
        }
        .date_block{display: flex;gap:2vw;margin: 0 auto;margin-bottom: 0;width: 92%;
            .date{width: 100%;
                img{width: 100%;}
            }
        }
        .top_bnr{
            .cmn_link_btn_a{text-align: left;padding: 24px 38px 24px 20px;}
            div{
                &:not(:last-of-type){margin-bottom: 1.2vw;}
            }
        }
    }
}
@media only screen and (max-width: 835px){
    #fv{flex-direction: column;width: 100%;padding-top: 18vw;margin-bottom: 12vw;
        .kv{width: 100%;}
        .fv_content{width: 96%;z-index: 5;margin-top: -37vw;margin-inline:auto;padding: 0;
            .content_inner{position: relative;top: initial;}
            .logo{width: 90%;margin-bottom: 7vw;}
            .top_catch{width: 90%;margin-bottom: 10vw;}
            .date_block{flex-direction: column;width: 100%;margin: 0 auto;gap:5vw;
                .date{width: 100%;}
            }
        }
    }
}
/* fv animation */
#fv{
    .kv {opacity:0;}
    .fv_content{
        .logo{opacity:0;}
        .top_catch{opacity:0;}
        .date_block{opacity:0;}
    }
}
#fv.load_open {
    .kv {animation: fv_item_reveal 1.6s var(--easeOutQuint) 1.8s forwards;}
    .fv_content{
        .logo{animation: fv_item_reveal 1.6s var(--easeOutQuint) 1.9s forwards;}
        .top_catch{animation: fv_item_reveal 1.6s var(--easeOutQuint) 2.0s forwards;}
        .date_block{animation: fv_item_reveal 1.6s var(--easeOutQuint) 2.1s forwards;}
    }
}
@keyframes fv_item_reveal {
    0% {opacity: 0; filter: blur(14px); transform: translateY(-18px) scale(1.2);}
    100% {opacity: 1; filter: blur(0); transform: translateY(0) scale(1);}
}


/* top cast */
#top_cast{background: #000000d4;color: var(--c_bg_color);padding: calc(var(--base_distance) * 1) 0;position: relative;margin-bottom: calc(var(--base_distance) * 1.2);z-index: 3;
    .btn_outer{position: relative;z-index: 4;}
    &[data-scroll="reveal"]{
        .top_cast_list{opacity: 0;transform: translateY(5%);}
        &.scroll_in{
            .top_cast_list{opacity: 1;transform: translateY(0%);transition:.6s;transition-delay: .6s;}
        }
    }
}
.top_cast_list{padding-top: 0;margin-bottom: 0;position: relative;z-index: 3;
    .tit{text-align: center;margin-bottom: 24px;
        span{display: inline-block;/* background: var(--c_bg_color); */color: #AAAAAA;line-height: 1em;font-weight: 700;padding: 1em 2em 0.7em;border-bottom: 1px solid #AAAAAA;}font-family: var(--font_base_setting);
        &:not(:first-of-type){margin-top: 60px;}
    }
    ul{display: flex;justify-content: center;gap:24px;;
        &:not(:last-of-type){margin-bottom: 24px;}
        li{font-size: 20px;font-weight: 600;line-height: 1.2em;
            .part{font-size: 13px;line-height: 1em;font-weight: normal;margin-right: 8px;color: #74D0B3;}
            .min{font-size: 13px;line-height: 1em;font-weight: normal;}
        }
    }
    .list_blank{padding-bottom:20px;}
    .other{text-align: center;}
}
@media screen and (max-width: 835px) {
    #top_cast{}
    .top_cast_list{
        .tit{
            &:not(:first-of-type){margin-top: 40px;}
        }
        ul{flex-wrap: wrap;text-align: center;gap:10px 18px;
            li{font-size: 16px;line-height: 1.2em;
                .part{font-size: 11px;line-height: 1em;margin-right: initial;display: block;margin-bottom: 0.5em;}
                .min{font-size: 12px;line-height: 1em;}
            }
            &.staff{justify-content: center;
                li{
                    &.main{width: 100%;}
                }
            }
            &:not(.staff){
                li{
                    .part{display: block;margin-bottom: 8px;}
                }
            }
        }
    }
}


/* news */
#top_news{margin-bottom: calc(var(--base_distance) * 1.6);}
.news_list{
    .news_item{
        a{position: relative; background-color: #C9C9C480;color:#000;padding: 1.8em 4em 1.8em 1.6em;transition: .3s;text-align: left;display: flex;align-items: center;border-bottom: 1px solid;width: 100%;
            &:after{position: absolute;content: "";background-image: url(../images/parts/arrow.svg);background-position: center;background-repeat: no-repeat;background-size: contain;width: min(40px);height: min(40px);top: 50%;right: 1.5em;transform: translateY(-50%);filter: brightness(0);transition: 0.3s;}
            .date{width: 8em;display: block;font-size: 14px;font-weight: 500;}
            .title{width: calc(100% - 8em);display: block;font-size: 16px;font-weight: 500;}

            &:hover{background-color: #000;
                .date{color: #fff;}
                .title{color: #fff;}
                &:after{filter: brightness(1);right: 1.2em;}
            }

            &.disactive{pointer-events: none;
                &:after{display: none;}
            }
        }
    }
}
@media screen and (max-width: 835px) {
    #top_news{
        .btn_outer{width: 100%;}
    }
    .news_list{
        .news_item{
            a{padding: 1.8em 4em 1.8em 1em;flex-direction: column;
                &:after{width: 30px;height: 30px;right: 1em;}
                .date{width: 100%;}
                .title{width: 100%; font-size: 14px;}
            }
        }
    }
}


/* single */
.single{color: #000;background-color: #C9C9C480;
    .title_block{border-bottom: 1px solid #413445;padding: 30px;
        .date{font-size: 14px;line-height: 1.2em;margin-bottom: 10px;}
        .news_title{font-size: 24px;line-height: 1.6em;font-weight: bold;}
    }
    .text_block{padding: 30px;}
}
@media screen and (max-width: 768px) {
    .single{padding: 1em;
        .title_block{padding: 12px;
            .news_title{font-size: 18px;line-height: 1.4em;}
        }
        .text_block{padding: 20px 12px 12px;}
    }
}


/* movie */
#top_movie{margin-bottom: calc(var(--base_distance) * 1.2);}
.movie_block{position: relative;background-color: #000;
    .ob01{transition:.5s;}
    .ob02{transition:.5s;}
    .movie{position: relative;overflow: hidden;display: block;
        .frame{--frame-padding:100px;position: absolute;width: calc(100% - var(--frame-padding));height: calc(100% - var(--frame-padding));top: 50%;left: 50%;transform: translate(-50%, -50%);border: 1px solid #CCCCC7;z-index: 3;
            span {display: block;width: 100%;
                &:before{position: absolute;content: "";width: 30px;height: 30px;background: #CCCCC7;clip-path: polygon(0 0, 0% 100%, 100% 0);top:-1px;left: 0px;}
                &:after{position: absolute;content: "";width: 30px;height: 30px;background: #CCCCC7;clip-path: polygon(0 0, 0% 100%, 100% 0);top: -1px;right: -1px;transform: scale(-1,1);}
                &:nth-of-type(2){
                    &:before{transform: scale(1,-1);top: initial;bottom: -1px;transform-origin: center;}
                    &:after{transform: scale(-1,-1);top: initial;bottom: -1px;transform-origin: center;}
                }
            }
        }
        .thumb{position: relative;transition:.3s;
            img{width: 100%;opacity: 0.3;}
            &:before{position: absolute;content: "";background-image: url(../images/parts/overlay.png);background-position: center;background-repeat: no-repeat;background-size: cover;width: 100%;height: 100%;top: 50%;left: 50%;transform: translate(-50%, -50%);opacity: 0.8;}
        }
        .icon_play{position: absolute;width: 100%;height: 100%;aspect-ratio: 1/1;top: 50%;left: 50%;translate:-50% -50%;object-fit: contain;z-index: 4;transition:.4s;
            img{width: 100%;object-fit: contain;object-position: 50%;height: 100%;}
        }
    }
    &:hover{
        .ob01{transform: translate(-40%, -40%)scale(1.3);transition:.5s;}
        .ob02{transform: translate(40%, 40%)scale(1.3);transition:.5s;}
        .movie{
            .thumb{transform: scale(1.02);transition:.3s;filter: brightness(1.2);}
            .icon_play{scale: 1.07;transition:.4s;}
        }
    }
}
@media screen and (max-width: 835px) {
    .movie_block{
        .movie{aspect-ratio: 16/9;
            .frame{--frame-padding:20px;border-width: 1px;
                span{
                    &:before{width: 10px;height: 10px;left: -1px;}
                    &:after{width: 10px;height: 10px;right: -1px;}
                }
            }
            .thumb{height: 100%;
                img{height: 100%;object-fit: cover;}
            }
        }
    }
}


/* about */
.about_wrap{
    .about{text-align: center;color: #000;letter-spacing: .04em;
        &:not(:last-of-type){margin-bottom: 60px;}
        .tit{text-align: center;font-weight: bold;margin-bottom: 24px;
            span{display: inline-block;padding: 4px 16px;border-top: 1px solid #000;border-bottom: 1px solid #000;}
        }
        .text{line-height: 2.3em;font-weight: bold;
            p{
                &:not(:last-of-type){margin-bottom: 1em;}
            }
        }
    }
}
@media screen and (max-width: 768px) {
    .about_wrap{
        .about{text-align: left;
            &:not(:last-of-type){margin-bottom: 40px;}
        }
    }
}


/* cast */
.wrap_tit{background: #492752;color: #fff;text-align: center;padding: 0.3em 1em;font-weight: bold;font-size: min(40px,8vw);line-height: 1em;letter-spacing: 0;margin-bottom: 1.2em;}

.cast_wrap{
    &:not(:last-of-type){margin-bottom: calc(var(--base_distance) * 1.4);}
}
.cast_list{margin-bottom: calc(var(--base_distance) * 0.6);
    ul{display: flex;justify-content: center;
        &:not(:last-of-type){margin-bottom: calc(var(--base_distance) * 0.4);}
        .cast{text-align: center;cursor: pointer;
            .cast_img{margin-bottom: 20px;overflow:hidden;
                img{width: 100%;transition: .3s;}
            }
            .name_block{color: var(--c_theme_color);
                .part{font-size: 14px;line-height: 1em;font-weight: bold;margin-bottom: 10px;color: #386557;
                    &.min{font-size: 12px;}
                }
                .name{font-size: 20px;line-height: 1.2em;font-weight: bold;
                    &.min{font-size: 16px;}
                }
            }
            &:hover{
                .cast_img{
                    img{transform: scale(1.1);transition: .3s;}
                }
            }
        }
    }
    .list_blank{padding-bottom: 30px;}
}

.hunter_modal{
    .modal_bg{background: #000;backdrop-filter: blur(40px);
        &:before{position: absolute;content: "";background: url(../images/bg/bg.webp) no-repeat center;background-size:cover;width: 100%;height: 100%;top: 50%;left: 50%;transform: translate(-50%, -50%);opacity: 0.4;}
    }
    .modal_inner{width: 100%;height: 100%;}
    .modal_content{width: 100%;display: flex;align-items: center;height: 100%;justify-content: center;margin: 0 auto;
        .logo_wrap{width: 30%;
            .logo{width: 60%;margin: 0 auto;
                img{width: 100%;}
            }
        }
        .visual_wrap{width: 40%;
            .visual{opacity: 0;filter: blur(30px);transition:1s;
                img{width: 100%;object-fit: contain;max-height: 90vh;}
            }
        }
        .text_wrap{width: 30%;padding: 0 2%;
            .name_block{text-align: center;color: #fff;
                .part{font-size: clamp(12px,2vw,14px);line-height: 1.4em;margin-bottom: 10px;}
                .name{font-size: clamp(28px,3.6vw,50px);font-weight: 600;line-height: 1em;
                    .min{font-size: 0.5em;line-height: 2em;display: block;}
                }
            }
        }
    }
    &.visible{
        .modal_content{
            .visual_wrap{
                .visual{opacity: 1;filter: blur(0px);transition:1s;transition-delay: .4s;}
            }
        }
    }
}

.ensemble{margin-bottom: calc(var(--base_distance) * 1);
    ul{display: flex;flex-wrap: wrap;gap:16px;justify-content: center;font-weight: bold;margin-bottom: 30px;color: var(--c_theme_color);
        li{display: inline-block;}
    }
}

.other_box { text-align: center; font-weight: bold; color: var(--c_theme_color);
    p { font-size: 22px; line-height: 1.6em; margin-bottom: 0.8em; font-weight: bold;}
    ul{
        li{
            h3.castname {font-size: 14px;line-height: 1em;font-weight: bold; margin-bottom: 10px;
            }
            .actname { font-size: 20px; line-height: 1.2em; font-weight: bold;
            }
        }
    }
}


.staff_list{color: var(--c_theme_color);/* font-family: var(--f_noto); */
    li{
        .part{font-size: 14px;font-weight: bold;line-height: 1em;margin-bottom:10px;color: #386557;}
        .name{font-size: 18px;line-height: 1.3em;font-weight: bold;
            img{display: inline-block;margin-right: 10px;}
            .min{font-size: 12px;line-height: 1em;}
        }
        &.main{
            .name{font-size: 30px;line-height: 1.5em;
                .min{font-size: 16px;line-height: 1em;}
            }
        }
    }
    ul{justify-content: flex-start;row-gap:30px;
        &:not(:last-of-type){margin-bottom: 30px;}
        &.column{
            li{
                &:not(:last-of-type){margin-bottom: 30px;}
            }
        }
    }
    .list_border{border-bottom: 1px solid var(--c_theme_color);margin: 40px 0;}
    .list_blank{padding-bottom: 40px;}
}
@media screen and (max-width: 768px) {
    .cast_list{
        ul{row-gap: 30px;
            &:not(:last-of-type){/* margin-bottom: 30px; */}
            .cast{
                .cast_img{margin-bottom: 14px;}
                .name_block{
                    .part{margin-bottom: 6px;}
                    .name{
                        .min{display: block;}
                    }
                }
            }
        }
        .list_blank{padding-bottom: 18px;}
    }
    .staff_list{
        li{
            &.main{
                .name{
                    .min{font-size: 13px;line-height: 1.5em;display: block;}
                }
            }
        }
    }

    .hunter_modal{
        .modal_bg{
            &:before{background: url(../images/bg/bg_sp.webp) no-repeat center;}
        }
        .modal_content{flex-direction: column;align-items: center;row-gap:20px;
            .logo_wrap{display: none;}
            .visual_wrap{width: 100%;text-align: center;
                .visual{
                    img{margin: 0 auto;max-height: 60vh;}
                }
            }
            .text_wrap{width: 100%;}
        }
    }
    
.other_box { 
    p { font-size: 18px; line-height: 1.6em; margin-bottom: 0.8em; font-weight: bold;}
    ul{
        li{
            h3.castname {margin-bottom: 6px;
            }
        }
    }
    
}
}


/* schedule & tickets */
#schedule{color: var(--c_theme_color);
    .sche_list{background-color: #C9C9C480;padding: min(30px, 4vw);
        .schedule{text-align: center;/* font-family: var(--f_noto); */
            .tit{font-size: 30px;line-height: 1em;font-weight: bold;margin-bottom: 20px;}
            .date{margin-bottom: 20px;font-size: 18px;line-height: 1em;font-weight: bold;
                .access{display: inline-block;margin-left: 0;text-decoration: underline;color: #000;}
            }
            &:not(:last-of-type){margin-bottom: 40px;}
        }
    }
    .schedule_wrap{margin-bottom: 60px;}
}
@media screen and (max-width: 768px) {    
    #schedule{
        .sche_list{
            .schedule{
                .tit{font-size: 20px;line-height: 1.3em;margin-bottom: 10px;}
                .date{line-height: 1.4em;font-size: 16px;
                    .access{display: block;}
                }
                .sch_img{
                    img{width: 100%;}
                }
            }
        }
    }
}


/* Tickets
-------------------------------*/
#tickets{color: var(--c_theme_color);text-align: left;
    .notes_txt{padding: 30px;position: relative;font-weight: bold;font-size: 14px;line-height: 1.4em;border-top: 1px solid var(--c_theme_color);border-bottom: 1px solid var(--c_theme_color);margin-bottom: 50px;
        /* &:before{position: absolute;content: "";background: url(../images/svg/icon_notice.svg) no-repeat center; background-size:contain;width: 45px;height: 40px;top: 50%;transform: translateY(-50%);left: 30px;} */
        a{text-decoration: underline;}
    }
    ul{
        &.cmn_list_kome,&.cmn_list_circle{/* font-family: var(--f_noto); */
            li{
                a{text-decoration: underline;}
            }
        }
    }
    .tk_tit{margin-top: 50px;margin-bottom: 10px;font-size: 30px;line-height: 1.2em;position: relative;padding-left: 1.2em;font-weight: bold;
        &:before{position: absolute;content: "";background: var(--c_theme_color);width: 30px;height: 30px;top:.03em;left: 0;border-radius: 100vmax;}
    }
    .tk_block{margin-bottom: 30px;padding: 4%;background: var(--c_bg_color);border: 1px solid var(--c_theme_color);/* font-family: var(--f_noto); */
        .tk_tit{margin-top: 0;
            &:before{top: .14em;}
        }
        .block_tit{font-weight: bold;font-size: 20px;line-height: 1.4em;margin-bottom: 16px;
            .min{font-size: .7em;line-height: 1em;}
        }
        .tit{font-weight: bold;margin-bottom: 0.6em;}
        .tk_date{font-size: 20px;line-height: 1.4em;margin-bottom: 14px;}
        .tk_btn_wrap{
            &:has(.tit){padding: 4%;border: 1px solid var(--c_theme_color);}
            p{font-size: 14px;line-height: 1.4em;}
        }
        &.reverse{background: var(--c_theme_color);color: var(--c_bg_color);
            .tk_tit{
                &:before{background: var(--c_bg_color);}
            }
            .tk_btn_wrap{background: var(--c_bg_color);color: var(--c_theme_color);}
        }
        &.general{padding: 0;border: none;background-color: #C9C9C480;
            .tk_tit{margin: 0;padding: 10px;background: var(--c_theme_color);color: #fff;text-align: center;font-size: clamp(17px,2vw,20px);line-height: 1.2em;
                &:before{content: none;}
            }
            .tk_date{margin: 0;padding: 30px;text-align: center;font-weight: bold;font-size: clamp(18px,2.4vw,24px);line-height: 1.4em;position: relative;
                &::after{content: "";position: absolute;height: 1px;background: var(--c_theme_color);bottom: 0;left: 50%;transform: translateX(-50%);width: calc(100% - 60px);}
            }
            .tk_btn_wrap{
                &:has(.tit){padding: 30px 50px 40px;border: none;}
            }
            &.pre{margin-top: 50px;}
            .tk_notes{margin: 0;padding: 20px 50px;font-size: 14px;line-height: 1.6em;position: relative;
                &::after{content: "";position: absolute;height: 1px;background: var(--c_theme_color);bottom: 0;left: 50%;transform: translateX(-50%);width: calc(100% - 60px);}
            }
            .tk_items{padding: 20px 30px 30px;display: flex;flex-direction: column;gap: 20px;}
            .tk_item{padding: 20px 30px;background-color: #D8D8D3B3;
                .block_tit{color: #5C2D5E;font-size: 1.2em;line-height: 1.4em;margin-bottom: 8px;}
                .tk_entry{font-weight: bold;font-size: １えｍ;line-height: 1.4em;margin-bottom: 12px;}
                .btn_outer{margin-bottom: 10px;width: 100%;}
                .cmn_list_kome{font-size: 12px;line-height: 1.5em;}
            }
            &.resale{margin-top: 50px;
                p{margin-bottom: .8em;
                    &:last-child{margin-bottom: 0;}
                }
                a{text-decoration: underline;}
            }
            .tk_resale_items{padding: 0 50px 40px;}
            .tk_resale_item{padding-top: 30px;
                .tit{font-size: 16px;margin-bottom: 1em;}
                .cmn_list_circle{font-size: 14px;line-height: 1.6em;margin-bottom: .8em;}
            }
            &.caution{margin-top: 50px;}
            .tk_caution_list{margin: 0;padding: 20px 50px 40px;font-size: 14px;line-height: 1.8em;
                a{text-decoration: underline;}
            }
        }
        &.disactive{pointer-events: none;opacity: .6;padding: 18px;background: #666;filter: grayscale(1);
            .block_tit{font-size: 18px;line-height: 1.4em;margin-bottom: 6px;}
            .tit{margin-bottom: 4px;}
            .tk_date{font-size: 16px;line-height: 1.4em;margin-bottom: 6px;}
            .cmn_link_btn_a{background: #888;color: #666;padding: 16px;}
            .tk_btn_wrap{
                &:has(.tit){padding: 10px;}
                p{font-size: 12px;line-height: 1.4em;}
            }
            ul{
                &.cmn_list_kome,&.cmn_list_circle{font-size: 12px;line-height: 1.3em;}
            }
        }
    }
    .price_list{/* border: 1px solid var(--c_theme_color); */margin-bottom: .3em;background-color: #C9C9C480;
        &_wrap{margin-bottom: 50px;}
        .tit{background: var(--c_theme_color);text-align: center;font-weight: bold;color: #fff;font-size: clamp(17px,2vw,20px);line-height: 1.2em;padding: 10px;}
        .price{padding: 30px;font-size: 30px;font-weight: 700;line-height: 1em;position: relative;
            &:not(:last-of-type){
                &::before{content: "";position: absolute;height: 1px;background: var(--c_theme_color);bottom: 0;left: 50%;transform: translateX(-50%);width: calc(100% - 60px);}
            }
            .seat{font-size: 20px; font-weight: bold;}
            .tax{font-size: 14px;line-height: 1.2em;font-weight: bold;}
            .cmn_list_kome{font-size: 14px;line-height: 1.7em;font-weight: 500;}
        }
    }
    .tk_content{font-family: var(--f_noto);
        .cmn_write_box{
            img{margin-left: 0;}
        }
    }
    .contact_wrap{background-color: #C9C9C480;padding: 40px 50px;text-align: left;font-size: 14px;line-height: 1.6em;
        .tit{margin-right: 1em;}
        .text{
            a{text-decoration: underline;}
        }
    }
    .btn_outer{margin-top:0;
        .btn{font-size: min(20px, 1.4vw);}
    }
}
@media screen and (max-width: 768px) {    
    #tickets{
        .notes_txt{padding: 12px;margin-bottom: 24px;
            /* &:before{left: 0;width: 34px;height: 30px;} */
        }
        .price_list{font-size: 18px;line-height: 1.4em;margin-bottom: 24px;
            .price{padding: 24px 12px;font-size: 20px;
                &:not(:last-of-type){
                    &::before{width: calc(100% - 24px);}
                }
                .seat{font-size: 16px;}
            }
        }
        .tk_tit{font-size: 22px;line-height: 1.2em;
            &:before{width: 20px;height: 20px;top: 0.05em;}
        }
        .tk_block{padding: 5%;
            .block_tit{font-size: 18px;line-height: 1.4em;margin-bottom: .5em;}
            .tit{line-height: 1.2em;}
            .tk_date{font-size: 16px;line-height: 1.4em;}
            .tk_btn_wrap{
                &:has(.tit){padding:5%;}
                p{font-size: 12px;line-height: 1.4em;}
            }
            &.general{padding: 0;
                .tk_date{padding: 12px;
                    &::after{width: calc(100% - 24px);}
                }
                .tk_btn_wrap{
                    &:has(.tit){padding: 20px 12px 12px;}
                }
                .tk_notes{padding: 16px 12px 16px 12px;
                    &::after{width: calc(100% - 24px);}
                }
                .tk_items{padding: 12px;gap: 16px;}
                .tk_item{padding: 16px;
                    .block_tit{font-size: 16px;}
                }
                .tk_resale_items{padding: 0 12px 12px;}
                .tk_resale_item{padding-top: 20px;}
                .tk_caution_list{padding: 16px 12px 12px 12px;}
            }
        }
        .contact_wrap{padding: 20px;
            .tit{display: block;margin-right: 0;}
            .text + .text{margin-top: .8em;}
        }
        .btn_outer{
            .btn{font-size: 14px;}
        }
    }
}


/* sns */
.sns_area{
    .sns_tit{font-family: var(--f_01);color: #000;font-size: min(80px,12vw);font-weight: 800;line-height: 1.5em;margin-bottom: 0.3em;}
    ul{display: flex;justify-content: center;gap: min(20px,4vw);
        li{width: min(120px,14vw);
            a{display: block;
                &:hover{
                    img{transform: scale(1.08);}
                }
                img{width: 100%; height: auto;transition: transform 0.3s var(--easeInOutCubic);}
            }
        }
    }
}