
/* section
-------------------------------*/
.sec_wrap{padding-bottom: 12vw;}
@media only screen and (max-width: 835px){
    .sec_wrap{padding-bottom: 25vw;}
}
.in_page{padding: 12vw 0;}
@media only screen and (max-width: 835px){
    .in_page{padding: 30vw 0 20vw;}
}
.sec_tit {margin-bottom: clamp(20px, 5.2vw, 68px);
    .main_tit{--tit_h: min(170px, 15vw); --tit_u: calc(var(--tit_h) / 60); height: var(--tit_h); filter: url(#title_noise) drop-shadow(calc(var(--tit_u) * 3) calc(var(--tit_u) * 3) calc(var(--tit_u) * 5) rgba(0, 0, 0, 0.3));}
    /* スクロールで縮小しながらフェードイン（FVのKV・ロゴと同じ動き。scroll_in は js/script.js の scroll reveal で付与） */
    .main_tit{opacity: 0; scale: 1.15; transition: opacity 1.6s cubic-bezier(.22, 1, .36, 1), scale 1.6s cubic-bezier(.22, 1, .36, 1);
        &.scroll_in{opacity: 1; scale: 1;}
    }
    .main_tit[src$="faq_title.svg"]{--tit_u: calc(var(--tit_h) / 56); height: calc(var(--tit_h) * 70 / 56); margin-bottom: calc(var(--tit_h) * -14 / 56);}
    img{display: block;}
    img[src$="ttl_line.svg"]{width: 100%; height: 1px;}
}
#sns .sec_tit {
    img{margin-inline: auto;}
}
.svg_filters {position: absolute; width: 0; height: 0; overflow: hidden;}
/* ボタン */
.btn_wrap {margin-top: min(80px, 5.24vw);
    .btn {position: relative; isolation: isolate; display: inline-flex; align-items: center; justify-content: center; width: min(430px, 35.19vw); height: min(79px, 6.45vw); color: #fff; text-decoration: none; transition: 0.2s;
        &::before , &::after {position: absolute; z-index: -1; display: block; content: ""; top: 0; bottom: 0; border: 1px solid #D9D9D9; border-radius: 999px; pointer-events: none;}
        &::before {left: 0; right: min(11px, 0.94vw); background: #000000B2;}
        &::after {left: min(11px, 0.94vw); right: 0;}
        &:hover {opacity: 0.7;}
    }
    .btn_txt {display: flex; align-items: center; width: 100%; gap: min(23px, 1.88vw); font-size: clamp(14px, 2.42vw, 30px); font-weight: 700; line-height: 1; letter-spacing: 0; white-space: nowrap;
        &::before , &::after {display: block; content: ""; flex: 1; height: 1px; background: #D9D9D9;}
    }
}
.btn_wrap.comment_modal{margin-top: 0; margin-bottom: 3em;
    .btn{width: min(350px, 30vw); height: min(50px, 4vw); padding: 0;}
    .btn_txt{font-size: clamp(14px, 1.96vw, 24px);}
}
@media only screen and (max-width: 835px){
    .btn_wrap {margin-top: min(38px, 8.23vw); 
        .btn {width: 100%; height: min(58px, 12.34vw);
            &::before {right: min(8px, 1.8vw);}
            &::after {left: min(8px, 1.8vw);}
        }
        .btn_txt {gap: min(14px, 3.09vw); font-size: clamp(14px, 4.37vw, 20px);}
    }
    .btn_wrap.comment_modal {
        .btn {width: min(220px, 58.67vw); height: min(36px, 9.6vw);}
        .btn_txt {gap: min(10px, 2.67vw); font-size: 14px;}
    }
}


/* fv
-------------------------------*/
.fv {position: relative; height: calc(38.5vw * 782 / 557); margin-bottom: 12vw;
    .fv_bg{position: relative; height: 100%;
        .chain02{position: absolute; bottom: -25%;; left: 50%; transform: translateX(-50%);}
        .chain03{position: absolute; bottom: -5%; left: 50%; transform: translateX(-50%);}
    }
    .fv_inner {position: absolute; top: 0; left: 50%; transform: translateX(-50%); display: flex; align-items: center; justify-content: center; width: 100%; gap: 2vw;
        .fv_logo {width: 30vw;}
        .fv_kv {width: 37vw; flex-shrink: 0; margin-top: 1.5vw;
            img {height: auto;}
        }
        img {display: block; width: 100%;}
    }
}
@media only screen and (max-width: 835px){
    .fv {height: calc(100vw * 782 / 557); margin: min(58px, 13vw) 0 13vw;
        .fv_inner .fv_kv {width: 100%; margin-top: 0;}
    }
}

/* tickets
-------------------------------*/
#tickets {
    .sec_inner {container-type: inline-size;}
    .tix_list {--u: calc(32cqw / 272); display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(var(--u) * 25) 2cqw;
        li {position: relative; isolation: isolate; padding: calc(var(--u) * 6) calc(var(--u) * 28) calc(var(--u) * 23); background: #000000B2; text-align: left;
            &::after {position: absolute; z-index: -1; display: block; content: ""; inset: 0; border-style: solid; border-width: 1px; border-image: url(../images/parts/tix_frame.svg) 1 / 1px repeat; pointer-events: none;}
            &::before {position: absolute; z-index: -1; display: block; content: ""; inset: calc(var(--u) * 6); border: 1px solid #D9D9D9; pointer-events: none;}
            p {margin: 0;}
            .place {position: relative; padding: calc(var(--u) * 13) 0 0 calc(var(--u) * 16.5); font-size: max(14px, calc(var(--u) * 30)); font-weight: 700; line-height: 1; letter-spacing: 0; white-space: nowrap;
                &::before {position: absolute; top: 0; left: 0; display: block; content: ""; width: 3px; height: calc(var(--u) * 41); background: #fff;}
            }
            .date , .venue {font-size: max(14px, calc(var(--u) * 18)); line-height: 1.1; letter-spacing: 0; margin-top: calc(var(--u) * 10);}
            .date {margin-top: calc(var(--u) * 11.5); white-space: nowrap;
                span {display: inline-block; margin-right: calc(var(--u) * 9); padding: 0 calc(var(--u) * 9); border: 1px solid #fff; line-height: calc(var(--u) * 19);}
            }
            .tix_btn {display: block; margin-top: calc(var(--u) * 11.7); transition: 0.2s;
                img {display: block; width: 100%; height: auto;}
                &:hover {opacity: 0.7;}
            }
        }
    }
}
@media only screen and (max-width: 835px){
    .tour_page #tickets {
        .tix_list {--card_w: min(48.5cqw, 420px); --u: calc(var(--card_w) / 272); grid-template-columns: repeat(2, var(--card_w)); gap: calc(var(--u) * 25) 3cqw; justify-content: center;
            li {padding-inline: calc(var(--u) * 16);
                .place {font-size: max(14px, calc(var(--u) * 28));}
                .date , .venue {font-size: max(14px, calc(var(--u) * 18));}
                .date {white-space: normal;
                    span {margin-right: 0.4em; padding: 0.05em 0.4em 0; line-height: 1.3;}
                }
            }
        }
    }
}

@media only screen and (min-width: 836px){
    main:not(.tour_page) #tickets {
        .tix_list {grid-template-columns: 1fr;
            li {display: grid; grid-template-columns: 1fr calc(var(--u) * 216); column-gap: calc(var(--u) * 28); align-items: start; padding-right: calc(var(--u) * 48);
                .tix_btn {grid-column: 2; grid-row: 1 / span 3; position: relative; top: calc(var(--u) * 8.5); align-self: center; margin-top: 0;}
            }
        }
    }
}
@media only screen and (max-width: 835px){
    main:not(.tour_page) #tickets {
        .tix_list {--card_w: min(100cqw, 420px); --u: calc(var(--card_w) / 272); grid-template-columns: var(--card_w); gap: calc(var(--u) * 25) 3cqw; justify-content: center;
            li {padding-inline: calc(var(--u) * 28);
                .place {font-size: min(30px, 7.5vw);}
                .date {white-space: nowrap;
                    span {margin-right: calc(var(--u) * 9); padding: 0 calc(var(--u) * 9); line-height: calc(var(--u) * 19);}
                }
            }
        }
    }
}

/* creative
-------------------------------*/
#creative{
    .staff_list{
        .staff_txt{font-size: min(18px, 2vw);; line-height: 1.5em; font-weight: 600;
            .role{font-size: min(16px, 1.8vw); line-height: 1.5em; color: #A17D77;}
        }
    }
    .list_blank{margin-bottom: min(60px, 8vw);}
}
@media only screen and (max-width: 835px){
    #creative{
        .staff_list{
            .staff_txt{font-size: 14px;
                .role{font-size: 13px;}
            }
        }
    }
}

/* news
-------------------------------*/
#news {
    .news_list {
        li {margin-bottom: min(33px, 2.69vw);
            &:last-child {margin-bottom: 0;}
        }
        .news_box {--cut: min(16px, 1.34vw); position: relative; isolation: isolate; display: flex; align-items: center; width: calc(100% - min(39px, 3.22vw)); min-height: min(136px, 11.15vw); padding: min(23px, 1.88vw) min(131px, 10.75vw) min(23px, 1.88vw) min(39px, 3.22vw); color: #fff; text-align: left; text-decoration: none;
            &::before {position: absolute; z-index: -1; display: block; content: ""; inset: 0; border: 1px solid #D9D9D9; background: linear-gradient(to bottom right, transparent calc(50% - 1px), #D9D9D9 calc(50% - 1px) calc(50% + 1px), transparent calc(50% + 1px)) left top / var(--cut) var(--cut) no-repeat border-box, #000000B2; clip-path: polygon(var(--cut) 0, 100% 0, 100% 100%, 0 100%, 0 var(--cut)); pointer-events: none;}
            &::after {position: absolute; z-index: -1; display: block; content: ""; inset: 0 max(-7px, -0.54vw) max(-7px, -0.54vw) 0; border-right: 1px solid #D9D9D9; border-bottom: 1px solid #D9D9D9; pointer-events: none;}
            .news_arrow {position: absolute; top: 50%; left: calc(100% - min(56px, 4.57vw)); display: block; width: min(95px, 7.79vw); height: auto; max-width: none; transform: translateY(-50%); transition: transform 0.3s var(--easeOutCubic);}
            &:hover .news_arrow {transform: translate(min(10px, 0.81vw), -50%);}
            &.disactive {pointer-events: none;
                .news_arrow {display: none;}
            }
        }
        .title_block {display: flex; flex: 1; align-items: center; min-width: 0; text-align: left;
            p {margin: 0;}
            .news_meta {flex-shrink: 0; width: min(143px, 11.69vw);}
            .date {font-size: clamp(16px, 1.75vw, 24px); line-height: 1; letter-spacing: 0; white-space: nowrap;
                span{font-size: clamp(14px, 1.5vw, 20px); line-height: 1;}
            }
            .place {height: min(31px, 2.55vw); margin-top: min(7px, 0.54vw); border: 1px solid #fff; font-size: clamp(14px, 1.48vw, 18px); font-weight: 700; line-height: min(29px, 2.39vw); letter-spacing: 0.02em; text-align: center; white-space: nowrap;}
            .content_tit {flex: 1; max-width: min(720px, 58.9vw); margin-left: min(28px, 2.28vw); line-height: 1.85; letter-spacing: 0.04em;}
        }
    }
}
@media only screen and (max-width: 835px){
    #news {
        .news_list {
            li {margin-bottom: min(19px, 4.11vw);}
            .news_box {--cut: min(12px, 2.57vw); display: block; width: calc(100% - min(20px, 4.37vw)); min-height: 0; padding: min(19px, 4.11vw) min(50px, 10.8vw) min(19px, 4.11vw) min(19px, 4.11vw);
                &::after {inset: min(5px, 1.03vw) max(-5px, -1.03vw) max(-5px, -1.03vw) min(5px, 1.03vw);}
                .news_arrow {left: calc(100% - min(35px, 7.46vw)); width: min(55px, 11.83vw);}
                &:hover .news_arrow {transform: translate(min(7px, 1.54vw), -50%);}
            }
            .title_block {display: block;
                .news_meta {display: flex; align-items: center; gap: min(12px, 2.57vw); width: auto;}
                .date {font-size: min(17px, 4vw);}
                .place {width: min(115px, 26vw); height: min(26px, 6.2vw); margin-top: 0; font-size: min(13px, 3.2vw); line-height: min(24px, 5.7vw);}
                .content_tit {max-width: none; margin: min(12px, 2.57vw) 0 0; font-size: min(15px, 3.8vw); line-height: 1.7;}
            }
        }
        .news_more {margin-top: min(38px, 8.23vw); padding-right: min(20px, 4.37vw);
            .more_btn {width: min(288px, 61.71vw); height: min(58px, 12.34vw);
                &::before {right: min(8px, 1.8vw);}
                &::after {left: min(8px, 1.8vw);}
            }
            .more_btn_txt {gap: min(14px, 3.09vw); font-size: min(20px, 4.37vw); line-height: 1;}
        }
    }
}

/* single-news
-------------------------------*/
#news {
    .news_list {
        .news_box{
            &.is_single {width: 100%; margin-bottom: 1vw; padding-right: min(19px, 4.11vw);
                .content_tit {max-width: none;}
            }
        }
        .news_content{position: relative; isolation: isolate; padding: min(23px, 1.88vw) min(19px, 4.11vw) min(23px, 1.88vw) min(39px, 3.22vw); border: 1px solid #D9D9D9; background: #000000B2; text-align: left;
            &::after {position: absolute; z-index: -1; display: block; content: ""; inset: -1px max(-8px, calc(-0.54vw - 1px)) max(-8px, calc(-0.54vw - 1px)) -1px; border-right: 1px solid #D9D9D9; border-bottom: 1px solid #D9D9D9; pointer-events: none;}
            h3{font-size: clamp(16px , 2.5vw , 20px); line-height: calc(var(--base_font_size) * 1.7); font-weight: 700; margin-bottom: 0.7em; margin-top: 3em; border-bottom: 1px dashed #84837f; padding-left: 1.2em; position: relative;
                &::before { position: absolute; display: block; content: "■"; left: 0;}
                &:first-of-type{margin-top: 0;}
            }
            h4{border: 1px solid #84837f; font-weight: 700; display: inline-block; padding: 0.3em 0.5em 0; margin-top: 1em; margin-bottom: 0.5em;}
            p + h4{margin-top: 0.2em;}
            h5{padding-left: 1.1em; margin-top: 1em; margin-bottom: 0.2em; position: relative; font-weight: 700;
                &::before { position: absolute; display: block; content: "▶︎"; left: 0; width: 0.4em; height: 0.2em;}
            }
            strong{font-weight: 800; color: var(--c_link_color);}
            a{background-color: transparent; font-weight: 700; text-decoration: underline; color: var(--c_link_color);}
        }
    }
}
@media only screen and (max-width: 835px){
    #news {
        .news_list {
            .news_box{
                &.is_single {margin-bottom: 4vw;}
            }
            .news_content {padding: min(19px, 4.11vw);
                &::after {inset: calc(min(5px, 1.03vw) - 1px) max(-6px, calc(-1.03vw - 1px)) max(-6px, calc(-1.03vw - 1px)) calc(min(5px, 1.03vw) - 1px);}
            }
        }
    }
}

/* about
-------------------------------*/
#about {
    --line_gap: min(6px, 0.5vw);
    .sec_tit {margin-bottom: min(26px, 2.2vw);}
    .about_tit_wrap {position: relative; z-index: 1; margin-bottom: calc((var(--line_gap) + 4px) * -1); text-align: left;}
    .about_tit {--slant: 0.45em; display: inline-block; margin: 0; padding: 0.18em calc(var(--slant) + 0.15em) 0.04em; background: #5E0E10; font-size: clamp(14px, 4.4vw, 70px); font-weight: 500; line-height: 1.1; letter-spacing: 0.01em; white-space: nowrap; clip-path: polygon(var(--slant) 0, 100% 0, calc(100% - var(--slant)) 100%, 0 100%);}
    .about_body {position: relative; background: #00000099;
        &::before , &::after {position: absolute; left: 0; right: 0; display: block; content: ""; height: calc(var(--line_gap) + 4px); border-style: solid; pointer-events: none;}
        &::before {top: 0; border-width: 3px 0 1px; border-image: url(../images/parts/tix_frame.svg) 1 / 3px 0 1px repeat;}
        &::after {bottom: 0; border-width: 1px 0 3px; border-image: url(../images/parts/tix_frame.svg) 1 / 1px 0 3px repeat;}
        &:has(+ .about_tit_wrap){margin-bottom: 2vw;}
    }
    .about_txt {padding: calc(var(--line_gap) + 2px + min(48px, 3.4vw)) min(53px, 3.8vw) calc(var(--line_gap) + min(76px, 5.4vw)); border-style: solid; border-width: 0 1px; border-image: url(../images/parts/tix_frame.svg) 1 / 0 1px repeat; font-size: clamp(14px, 2vw, 20px); line-height: 2em; letter-spacing: 0; text-align: left;}
    .about_accent {position: absolute; z-index: 1; right: max(5%, calc(50% - 650px)); bottom: max(-8px, -0.8vw); display: block; width: min(266px, 18vw); height: auto;}
}
@media only screen and (max-width: 835px){
    #about {
        --line_gap: 4px;
        .sec_tit {margin-bottom: min(16px, 3.4vw);}
        .about_tit {--slant: 0.4em; font-size: min(28px, 5.3vw);}
        .about_txt {padding: calc(var(--line_gap) + min(28px, 6vw)) min(20px, 4.4vw) calc(var(--line_gap) + min(44px, 9.4vw)); font-size: clamp(14px, 3.9vw, 15px); line-height: 1.85;}
        .about_accent {bottom: -6px; width: min(150px, 36vw);}
    }
}

/* faqs　sns 共通グラデ背景
-------------------------------*/
.under_bg_wrap{position: relative;
    &::before {position: absolute;z-index: -1;display: block;content: "";inset: 0;background: linear-gradient(to bottom, #56433C40, #BA592870);mix-blend-mode: color;pointer-events: none;}
}
.under_bg_wrap.kasou{
    &::before {background: linear-gradient(to bottom, #ffffff00, #56433C40, #BA592870);}
}

/* faqs
-------------------------------*/
#faqs {
    .faq_list {display: flex; flex-direction: column; gap: min(28px, 2.4vw); margin: 0; text-align: left;
        .faq_item {border: 1px solid #BFBFBF;
            .faq_q, .faq_a {display: flex; align-items: flex-start; gap: min(18px, 1.6vw); margin: 0; padding: min(22px, 1.9vw) min(32px, 2.8vw); font-weight: 600;
                .faq_icon {flex-shrink: 0; display: block; width: min(30px, 2.5vw); height: auto;}
                .faq_txt {flex: 1; min-width: 0; margin: 0; padding-top: 0.16em; font-weight:normal;}
            }
            .faq_q {background: #000000B2; font-size: clamp(14px, 1.6vw, 20px); line-height: 1.4em;}
            .faq_a {background: #BFBFBF; color: #000; font-size: clamp(14px, 1.3vw, 16px); line-height: 1.8em;}
            
        }
    }
}
@media only screen and (max-width: 835px){
    #faqs {
        .faq_list {gap: min(16px, 3.6vw);
            .faq_item{
                .faq_q, .faq_a {gap: min(12px, 2.8vw); padding: min(14px, 3.4vw) min(16px, 3.8vw);
                    .faq_icon {width: min(24px, 5.8vw);}
                }
                .faq_q {font-size: clamp(14px, 4.1vw, 16px); line-height: 1.4em;}
                .faq_a {font-size: 14px; line-height: 1.8em;}
                
            }
        }
    }
}

/* sns
-------------------------------*/
#sns {
    .sns_list {--u: min(1px, 100vw / 1220); display: flex; justify-content: center; align-items: center; gap: calc(var(--u) * 35); margin: 0; padding: 0; list-style: none;
        &::before , &::after {flex-shrink: 0; display: block; content: ""; width: calc(var(--u) * 116); aspect-ratio: 116 / 16; background: url(../images/parts/sns_line.svg) no-repeat center / contain;}
        &::before {margin-right: calc(var(--u) * -10);}
        &::after {margin-left: calc(var(--u) * -10);}
        li {flex-shrink: 0;
            .sns_link {display: block; width: calc(var(--u) * 77); transition: 0.2s;
                img {display: block; width: 100%; height: auto;}
                &:hover {opacity: 0.7;}
            }
        }
    }
}
@media only screen and (max-width: 835px){
    #sns {
        .sns_list {--u: min(0.8px, 100vw / 800); gap: calc(var(--u) * 25);
            li .sns_link {width: calc(var(--u) * 92);}
        }
    }
}



/*-------------------------------
    TOURページ
-------------------------------*/
.tour_page{
    .sec_tit{
        img{margin-inline: auto;}
    }
    .sec_wrap{padding-bottom: 16vw;}
    #about.sec_wrap{padding-bottom: 0;}
    #faqs.sec_wrap{padding-top: 16vw;}
    #sns.sec_wrap{padding-bottom: 10vw;}
    @media only screen and (max-width: 835px){
        .sec_wrap{padding-bottom: 25vw;}
        #faqs.sec_wrap{padding-top: 25vw;}
    }


/* tour_top
-------------------------------*/
.tour_top {--noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    position: relative; padding: min(80px, 8vw) 0; margin-bottom: 10vw;
    &::before {position: absolute; z-index: 0; display: block; content: ""; inset: 0; background: #9D452721; mix-blend-mode: color; pointer-events: none;}
    &::after {position: absolute; z-index: 1; display: block; content: ""; inset: 10px 0; background: var(--noise) 0 0 / 200px 200px; background-blend-mode: overlay; pointer-events: none;
        -webkit-mask: linear-gradient(#000 0 0) top / 100% 1px no-repeat, linear-gradient(#000 0 0) bottom / 100% 1px no-repeat;
        mask: linear-gradient(#000 0 0) top / 100% 1px no-repeat, linear-gradient(#000 0 0) bottom / 100% 1px no-repeat;
    }
    .tour_top_wrap {position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center;}
    .tour_logo {width: min(750px, 47.5vw);
        img {display: block; width: 100%; height: auto;}
    }
    .text_block {display: flex; flex-direction: column; align-items: center;
        p {margin: 0; font-weight: 700; line-height: 1.2; letter-spacing: 0;}
        .place {font-size: min(112px, 9.33vw);}
        .venue {margin-top: min(16px, 1.33vw); padding: 0.1em 0.4em; border: 1px solid #ffffffB2; font-size: min(56px, 4.67vw); white-space: nowrap;}
        .date {margin-top: min(16px, 1.33vw); font-size: min(76px, 6.33vw); white-space: nowrap;
            span {font-size: min(76px, 6.33vw); line-height: 1.2;}
        }
    }
}
@media only screen and (max-width: 835px){
    .tour_top {padding: 10vw 0; margin: min(100px, 15vw) 0 22vw;
        .tour_logo {width: 70vw;}
        .text_block {margin-top: 4vw;
            .place {font-size: 12vw;}
            .venue {margin-top: 2.5vw; font-size: 4.8vw;}
            .date {margin-top: 2vw; font-size: 9vw;
                span {font-size: 9vw; line-height: 1.2;}
            }
        }
    }
}

/* tickets
-------------------------------*/
#tickets {
    .tix_list{display: flex; flex-wrap: wrap; justify-content: center;
        li{width: calc((100% - 4cqw) / 3);}
    }
}
@media only screen and (max-width: 835px){
    #tickets {
        .tix_list li{width: var(--card_w);}
    }
}
/* tour_tickets
-------------------------------*/
#tour_tickets {
    .text_block {display: flex; flex-direction: column; align-items: center;
        p {margin: 0; font-weight: 700; line-height: 1.2; letter-spacing: 0; white-space: nowrap;}
        .date {font-size: min(90px, 7.5vw);
            span {font-size: min(56px, 4.67vw); line-height: 1.2;}
        }
        .venue {margin-top: min(10px, 0.83vw); font-size: min(46px, 3.83vw);}
        .tix_url {margin-top: min(24px, 2vw); color: #A17D77; font-size: min(30px, 2.5vw); font-weight: 400; text-decoration: underline;}
    }
    .tix_btn_wrap {margin: min(56px, 4.67vw) auto 0; max-width:900px;
        .btn {position: relative; isolation: isolate; display: flex; align-items: center; justify-content: center; padding: 1.2em; margin-inline: auto; background: #D9D9D9; border-radius: 999px; color: #000; text-decoration: none; transition: 0.2s; margin-bottom: 1em;
            &:last-of-type{margin-bottom: 0;}
            &::before {position: absolute; z-index: -1; display: block; content: ""; inset: min(6px, 0.8vw); border: 1px solid #000; border-radius: 999px; pointer-events: none;}
            &::after {position: absolute; top: 50%; right: min(25px, 3vw); display: block; content: ""; width: min(30px, 2.5vw); aspect-ratio: 22 / 30; background: url(../images/parts/arrow_blk.svg) center / contain no-repeat; transform: translateY(-50%);}
            &:hover {opacity: 0.7;}
        }
        .btn_txt {font-size: min(40px, 3.33vw); font-weight: 700; line-height: 1; letter-spacing: 0; white-space: nowrap;}
    }
}
@media only screen and (max-width: 835px){
    #tour_tickets {
        .text_block {
            .date {font-size: 9vw;
                span {font-size: 5.6vw; line-height: 1.2;}
            }
            .venue {margin-top: 1.5vw; font-size: 5vw;}
            .tix_url {margin-top: 3vw; font-size: max(14px, 3.6vw);}
        }
        .tix_btn_wrap {margin-top: 8vw;
            .btn {height: 15vw;
                &::before {inset: 1.5vw;}
                &::after {right: 6vw; width: 3.6vw;}
            }
            .btn_txt {font-size: 5vw;}
        }
    }
}

/* cast
-------------------------------*/
#cast{
    /* 欧文（Abhaya Libre）は和文より字面が小さいため、英語表記のみ拡大 */
    --fs_scale: 1;
    :lang(en){--fs_scale: 1.15;}
    ul{display: flex; flex-wrap: wrap; justify-content: center; row-gap: min(50px, 3.5vw);
        li{width: min(470px, 32.6vw); line-height: 1.3; letter-spacing: 0; text-align: center;}
        &.narrow li{width: min(315px, 21.9vw);}
        &.column li{width: 100%;}
        li.is_full{width: 100%;}
        li.is_left{margin-right: min(470px, 32.6vw);}
        .role{margin: 0 0 min(10px, 0.7vw); font-size: calc(min(25px, 1.75vw) * var(--fs_scale)); font-weight: 400; line-height: 1.3;}
        .name{margin: 0; font-size: calc(min(40px, 2.8vw) * var(--fs_scale)); font-weight: 600; line-height: 1.3;}
        .role:lang(en), .name:lang(en){line-height: 0.9;}
    }
    .cast_list{display: flex; flex-direction: column; gap: min(100px, 6.6vw);
        .s_text{font-size: 0.9em; line-height: 1.7em;
        &.eng{font-size: 1.4em;
        @media only screen and (max-width: 835px){font-size: 1em;}}}
    }
    .creator_wrap{margin-top: min(150px, 10.4vw);
        .creator_tit{margin-bottom: min(80px, 5.6vw); font-size: min(50px, 3.5vw); font-weight: 800; line-height: 1.2; letter-spacing: 0;}
        .creator_list{row-gap: min(45px, 3.1vw);
            li{width: 100%;}
            .role{font-weight: 400;}
            .name{font-weight: 600; letter-spacing: 0.04em;}
        }
    }
}
@media only screen and (max-width: 835px){
    #cast{
        ul{row-gap: 6vw;
            li{width: 45vw;}
            &.narrow li{width: 36vw;}
            &.column li{width: 100%;}
            li.is_left{margin-right: 45vw;}
            .role{margin-bottom: 1vw; font-size: calc(clamp(11px, 3vw, 17px) * var(--fs_scale));}
            .name{font-size: calc(clamp(16px, 5.2vw, 24px) * var(--fs_scale));}
        }
        .cast_list{gap: 11vw;}
        .creator_wrap{margin-top: 18vw;
            .creator_tit{margin-bottom: 9vw; font-size: min(26px, 6.4vw);}
            .creator_list{row-gap: 5vw;
                li{width: 100%;}
            }
        }
    }
}


}


/* comment modal
-------------------------------*/
.comment_modal{
    .modal_inner{width: min(800px, 90vw);}
    .comment_box{max-height: 80vh; padding: min(60px, 6vw); background: #000000E6; border: 1px solid #D9D9D9; color: #fff; text-align: center; overflow-y: auto; overscroll-behavior: contain;
        .part{display: block; font-size: min(16px, 1.8vw); line-height: 1.5em; color: #A17D77; letter-spacing: 0.2em;}
        .name{margin-top: 0.4em; font-size: min(28px, 3vw); font-weight: 700; line-height: 1.5em;}
        .txt{margin-top: min(30px, 4vw); font-size: min(16px, 1.8vw); line-height: 2em; text-align: left;}
    }
}
@media only screen and (max-width: 835px){
    .comment_modal{
        .comment_box{padding: 40px 20px;
            .part{font-size: 13px;}
            .name{font-size: 20px;}
            .txt{margin-top: 20px; font-size: 14px;}
        }
    }
}
