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

body{
/*    background:
	 linear-gradient(rgba(0,0,0,.8),rgba(0,0,0,.8)),
        url(img/bg2.jpg) center top repeat-y;
		background-size: 100%;*/
			 
		
}

@media print {
 body {
 display: none;
 }}
 
body{
  background:#000; color:#fff;
  font-family:"Noto Sans JP",sans-serif;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  background:url(img/bg-glitch.jpg);
  background-size:250px auto;
  background-repeat:repeat;
  opacity:.5;
  pointer-events:none;
  z-index:-1;
}

.pc{ display:inline;}
.mp{ display:none;}
.sp{display:none;}

img{
  max-width:100%;
  display:block;
}

a img:hover{opacity: 0.72;}

.inner{
  width:min(1000px,90%);
  margin:0 auto;
}

section{
  position:relative;
}

.main-visual{margin: 30px auto 0;max-width: 1100px; width: 100%;}
.main-visual img{width: 100%; 	/*border:2px solid #a5002d;*/
 display:block;
    width:100%;

    border:1px solid #ff0048;

    box-shadow:
    0 0 8px rgba(255,0,72,.6),
    0 0 20px rgba(255,0,72,.4);

    transition:.4s;}
	
	@media screen and (max-width:767px){
	.main-visual img{width: 96%; 
}}
	
	.main-visual img:hover{
    border-color:#ff4f9c;

    box-shadow:
    0 0 15px rgba(255,0,72,.8),
    0 0 30px rgba(255,0,72,.7),
    0 0 60px rgba(255,0,72,.4);

    transform:translateY(-3px);
}


#outline{ margin-top: 40px;
    padding:40px 0;
    background:
      linear-gradient(
        rgba(0,0,0,.45),
        rgba(0,0,0,.45)
      ),
      url(img/outline.jpg)
      center center / cover
      no-repeat;
}

.sec-title{
    display:flex;
    align-items:flex-end;
    gap:20px;
    margin-bottom:40px;font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}

.sec-title span{
    font-size:64px;
    line-height:1;
    font-weight:900;
}

.sec-title small{
    font-size:20px;
}



.outline-wrap{
    display:grid;
    grid-template-columns:500px 1fr;
    gap:40px;
    align-items:stretch;
}

.outline-info dl{
    display:grid;
    grid-template-columns:120px 1fr;
    gap:20px;
    margin-bottom:20px;
}

.outline-info dt{
    background:#8f0024;
    text-align:center;
    padding:12px;
    font-weight:700;
}

.outline-info dd{
    display:flex;
    align-items:center;
}



/* ==================================
SP
================================== */

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

#outline{
    padding:60px 0;
}

.sec-title{
    display:block;
    margin-bottom:30px;
}

.sec-title span{
    display:block;
    font-size:42px;
}

.sec-title small{
    display:block;
    margin-top:8px;
    font-size:20px; 
}

.outline-wrap{
    display:block;
}

.outline-img{
    margin-bottom:30px;
}

.outline-info dl{
    grid-template-columns:90px 1fr;
    gap:12px;
}

.outline-info dt{font-size: 13px;}


}

#cast{
    padding:40px 0;
    border-top:2px solid #a5002d;
    border-bottom:2px solid #a5002d;
}

.cast-wrap{ max-width: 1000px; margin: 0 auto;
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:60px;
}

#cast .sec-title{
    display:flex;
    align-items:flex-end;
    gap:20px;
    margin:0;
    flex-shrink:0;
}



.cast-logo img{
    height:55px;
    width:auto;
    display:block;
}

.cast-wrap .cast-logo:nth-of-type(1) img{height: 100px}


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

.cast-wrap{
    flex-direction:column;
    gap:25px;
}
}

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

#cast .sec-title span{
    font-size:42px;
}

.cast-logo img{
    height:40px;
}

.cast-name{
    font-size:24px;
}

}

#schedule{
    padding:100px 0;
	border-bottom:2px solid #a5002d;
}

.schedule-wrap{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:30px;
}

.schedule-box{
    border:1px solid #c7003a;
    background:rgba(0,0,0,.7);
}



.schedule-box h3{
    padding:15px 20px;

    font-family:"Times New Roman", serif;

    font-size:58px;
    font-weight:700;
    line-height:1;

    color:#fff;

    text-shadow:
        0 0 5px rgba(255,255,255,.8),
        0 0 10px rgba(255,50,100,.8),
        0 0 20px rgba(255,0,80,.8);

    background:linear-gradient(
        90deg,
        rgba(199,0,58,.55) 0%,
        rgba(199,0,58,.15) 100%
    );
}


.schedule-box h3 span{
    font-size:28px;
    margin-left:5px;
}

.schedule-box ul{
    list-style:none;
}

.schedule-box li{
    display:grid;
    grid-template-columns:220px 1fr;
    align-items:center;
    /*border-top:1px solid rgba(255,255,255,.1);*/
	 border-top:1px solid #c7003a;
}


.artist{
    padding:14px 18px;
    background:rgba(0,0,0,.55);
    font-size:20px;
    font-weight:700;
    font-family:YuMincho, "Yu Mincho",
        "Hiragino Mincho ProN", serif;
}

.artist-name{
    line-height:1.6;
}

.special-guest{
    margin-top:8px;
    padding-left:9px;
    border-left:2px solid #ff3157;
    color:#fff;
    font-family:"Noto Sans JP", sans-serif;
    font-size:13px;
    font-weight:500;
    line-height:1.5;
}

.special-guest span{
    display:block;
    margin-bottom:2px;
    color:#ff6b91;
    font-size:9px;
    font-weight:700;
    letter-spacing:.12em;
}

@media screen and (max-width:900px){
    .artist{
        padding:12px 15px;
        font-size:18px;
    }

    .special-guest{
        margin-top:6px;
        font-size:12px;
    }
}

.detail{
    display:flex;
    align-items:center;
    gap:10px;
    padding:14px 18px;
    flex-wrap:wrap;
}

.detail strong{
    font-size:34px;
    line-height:1;
    font-weight:700;
}

.detail span{
    font-size:16px;
    opacity:.9;
}

.detail em{
    font-style:normal;
    font-size:15px;
    opacity:.8;
}

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


.schedule-box li{
    grid-template-columns:1fr; 
}

.artist{
    padding:12px 15px;
    font-size:18px;
}

.detail{
    padding:12px 15px;
    gap:6px;
}

.detail strong{
    font-size:24px;
}

.detail span{
    font-size:13px;
}

.detail em{
    display:block;
    width:100%;
    font-size:12px;
}
}

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

#schedule{
    padding:60px 0;
}

.schedule-wrap{
    /*grid-template-columns:1fr;*/
    gap:20px;
}

.schedule-box h3{
    font-size:40px;
    padding:12px 15px;
}

.schedule-box h3 span{
    font-size:18px;
}


}




#ticket{
    padding:100px 0;
	border-bottom:2px solid #a5002d;
}

.ticket-wrap{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:24px;
}

.ticket-box{
    /*background:rgba(0,0,0,.65);*/
    border:1px solid rgba(255,0,100,.4);
    padding:10px 20px 20px;
}

.ticket-box:nth-of-type(1){ background: rgba(9,39,68,.65);}
.ticket-box:nth-of-type(2){ background: rgba(104,0,1,.65);}
.ticket-box:nth-of-type(3){ background: rgba(68,32,115,.65);}


.ticket-box h3{
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 0 25px;

    color:#fff;
    font-size:20px; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    font-weight:700;
}

.omenz h3{
    background:linear-gradient(
        90deg,
        #1b2d48,
        #314d79
    );
}

.mercuro h3{
    background:linear-gradient(
        90deg,
        #702327,
        #b34b52
    );
}

.comingout h3{letter-spacing: -0.07em;
    background:linear-gradient(
        90deg,
        #58246d,
        #b34ca8
    );
}

.ticket-box dl{
    margin:0;
}
.ticket-box dt{
    float:left;
    clear:left;
    width:90px; /* 110px → 90px */
    margin-bottom:12px;
    padding-left:20px; /* 30px → 20px */
    color:#fff;
}

.ticket-box dd{
    margin:0 0 12px 110px; /* 140px → 110px */
    color:#fff;
    font-weight:700;
    text-align:right;
    font-size:24px;
}
.ticket-box dd span{
    font-size:16px;
    opacity:.8;
}

/* 1100px以下：カード幅を内容に合わせる */
@media screen and (max-width:1150px){

    .ticket-wrap{
        display:grid;
        grid-template-columns:repeat(2, minmax(0, 400px));
        justify-content:center;
        gap:24px 30px;
    }

    .ticket-box{
        box-sizing:border-box;
        width:100%;
        min-width:0;
    }

    .ticket-box:nth-child(3){
        grid-column:1 / -1;
        width:400px;
        max-width:100%;
        justify-self:center;
    }
}


/* 767px以下：縦1列、カード幅は最大400px */
@media screen and (max-width:767px){

    #ticket{
        padding:70px 0;
    }

    .ticket-wrap{
        grid-template-columns:minmax(0, 400px);
        gap:20px;
    }

    .ticket-box,
    .ticket-box:nth-child(3){
        grid-column:auto;
        width:100%;
        max-width:400px;
        justify-self:center;
    }

    .ticket-box{
        padding:0 20px 20px;
    }

    .ticket-box h3{
        height:50px;
        font-size:22px;
    }

    .ticket-box dt{
        width:100px;
    }

    .ticket-box dd{
        margin-left:110px;
    }
}

#sales{
    padding:100px 0;
	border-bottom:2px solid #a5002d;
}


/* =========================
   TICKET PURCHASE
========================= */
.ticket-purchase{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:30px;
    margin-top:35px;
}

.purchase-day{
    min-width:0;
    padding:22px;
    border:1px solid rgba(199,0,58,.65);
    background:rgba(0,0,0,.65);
}

.purchase-day h3{
    margin:0 0 18px;
    padding-bottom:12px;
    border-bottom:1px solid rgba(255,49,87,.5);
    color:#fff;
    font-family:"Times New Roman",serif;
    font-size:30px;
    line-height:1.2;
    text-shadow:0 0 10px rgba(255,0,80,.6);
}

.purchase-day h3 span{
    margin-left:5px;
    font-size:16px;
}

.purchase-links{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
}

.purchase-btn{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding:14px 16px;
    border:1px solid rgba(255,255,255,.2);
    color:#fff;
    text-decoration:none;
    transition:background .3s, border-color .3s, box-shadow .3s;
    box-sizing:border-box;
    min-width:0;
}

.purchase-btn.omenz{
    background:rgba(31,61,99,.65);
    border-color:rgba(80,130,190,.55);
}

.purchase-btn.mercuro{
    background:rgba(104,0,1,.65);
    border-color:rgba(200,65,75,.55);
}

.purchase-btn.comingout{
    background:rgba(68,32,115,.65);
    border-color:rgba(174,76,190,.55);
}

.purchase-btn:hover{
    border-color:#ff3157;
    box-shadow:0 0 14px rgba(255,0,60,.3);
    background-color:rgba(165,0,45,.4);
}

.purchase-artist{
    font-family:YuMincho, "Yu Mincho",
        "Hiragino Mincho ProN", serif;
    font-size:15px;
    font-weight:700;
    line-height:1.5;
    overflow-wrap:anywhere;
}

.purchase-label{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    gap:8px;
    padding:9px 12px;
    border:1px solid rgba(255,255,255,.5);
    font-size:12px;
    font-weight:700;
    white-space:nowrap;
}

.purchase-arrow{
    font-size:16px;
    transition:transform .3s;
}

.purchase-btn:hover .purchase-arrow{
    transform:translate(2px,-2px);
}

/* タブレット・スマホ */
@media screen and (max-width:767px){

    .ticket-purchase{
        grid-template-columns:1fr;
        gap:20px;
        margin-top:25px;
    }

    .purchase-day{
        padding:18px 15px;
    }

    .purchase-day h3{
        font-size:26px;
        margin-bottom:14px;
    }

    .purchase-links{
        gap:8px;
    }

    .purchase-btn{
        padding:12px;
        gap:8px;
    }

    .purchase-artist{
        font-size:14px;
    }

    .purchase-label{
        padding:8px 9px;
        font-size:11px;
        gap:5px;
    }
}


#sales .sec-title{
    display:flex;
    align-items:flex-end;
    gap:20px;
    margin-bottom:40px;color:#fff;
}

#sales .sec-title span{
    font-size:64px;
    line-height:1;
    font-weight:900;
    color:#fff;
    /*text-shadow:
        0 0 5px rgba(255,255,255,.7),
        0 0 12px rgba(218,165,32,.7);*/
}

#sales .sec-title small{
    font-size:20px;
    /*color:#d9a928;
    font-weight:700;*/
    letter-spacing:.05em;
    padding-bottom:5px;
}

.sales-wrap{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
}

.sales-box{
    position:relative;
    overflow:hidden;

    border:1px solid #d6a52f;
    background:rgba(0,0,0,.72);

    box-shadow:
        0 0 10px rgba(218,165,32,.35),
        inset 0 0 20px rgba(218,165,32,.08);
}

.sales-box h3{
    margin:0; font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
    padding:18px 20px;

    text-align:center;
    font-size:22px;
    font-weight:700;
    color:#fff;

    background:linear-gradient(
        90deg,
        rgba(120,75,0,.9) 0%,
        rgba(210,145,0,.95) 50%,
        rgba(120,75,0,.9) 100%
    );

    border-bottom:1px solid #d6a52f;
}

.sales-main{
    min-height:100px;

    padding:20px 20px 20px 0px;

    text-align:center;
    font-size:22px;
    line-height:1.7;
    font-weight:700;
    color:#fff;
	font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
}


.sales-main .big-date{
    font-size:1.3em;
	
    font-weight:900;
    color:#f6d06b;
}
.sales-main .last-date{
    font-size:0.8em;
    font-weight:500;
}

.sales-main p {font-size: 15px;}

.sales-note{
    margin:0 20px 24px;
    padding-top:18px;

    border-top:1px solid rgba(218,165,32,.45);

    text-align:center;
    font-size:16px;
    line-height:1.6;
    color:#fff;
}
.sales-note br{display: none;}


/* SP */
@media screen and (max-width:1000px){
.sales-box h3{}
.sales-main br{display: none;}
.sales-note br{}


.sales-note br{display:none;}



.sales-wrap{
    grid-template-columns:1fr;
    gap:20px;
    max-width:500px;
    margin:0 auto;
    width:100%;
    box-sizing:border-box;
}

    .sales-box h3{
        padding:15px 12px;
        font-size:22px;
    }

    .sales-main{
        min-height:auto;
        padding:24px 15px;
        font-size:20px;
        line-height:1.7;
    }

    .sales-note{
        margin:0 15px 20px;
        padding-top:15px;
        font-size:15px;
    }

}

@media screen and (max-width:767px){
    #sales{
        padding:60px 0;
    }

    #sales .sec-title{
        display:block;
        margin-bottom:30px;
    }

    #sales .sec-title span{
        display:block;
        font-size:42px;
    }

    #sales .sec-title small{
        display:block;
        margin-top:8px;
        font-size:20px;
    }
}
@media screen and (max-width:600px){
.sales-wrap{
    max-width:300px;}
	.sales-main br{display:block;}
	.sales-note br{display:block;}

}



#credits{
    padding:100px 0;
	border-bottom:2px solid #a5002d;

}

#credits .sec-title span{
    font-size:42px;
    line-height:1;
    font-weight:900;
}

#credits .sec-title small{}

#credits .sec-title a{ color: #fff; text-decoration: underline;}
#credits .sec-title a:hover{ color: #FFAAAB;}

.credits-wrap{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px 18px;

    padding:30px;

    background:rgba(0,0,0,.65);
    border-top:1px solid #a00028;
    border-bottom:1px solid #a00028;
}

.credits-wrap p{
    margin:0;
    color:#fff;
    font-size:15px;
    line-height:1.8;
    white-space:nowrap;
}

.credits-wrap p:not(:last-child)::after{
    content:"｜";
    color:#a00028;
    margin-left:18px;
}




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

    #credits{
        padding:60px 0;
    }

    .credits-wrap{
        display:block;
        padding:20px;
    }
	
	#credits .sec-title small{font-size: 15px;}


    .credits-wrap p{ font-size:13px;
        white-space:normal;
        padding:8px 0;
        border-bottom:1px solid rgba(255,255,255,.1);
    }

    .credits-wrap p:not(:last-child)::after{
        content:none;
    }
	
}


/* =========================
   NOTICE
========================= */
#notice{
    padding:100px 0;
    border-bottom:2px solid #a5002d;
}

#notice .inner{
    width:100%;
    max-width:1000px;
    margin:0 auto;
    padding:0 20px;
    box-sizing:border-box;
}

.notice-title{
    margin:0 0 40px;
    text-align:center;
    color:#fff;
}

.notice-title span{
    display:block;
    margin-bottom:10px;
    font-family:Georgia, "Times New Roman", serif;
    font-size:38px;
    letter-spacing:.12em;
    text-shadow:0 0 10px rgba(255,0,60,.8);
}

.notice-title small{
    display:block;
    font-size:15px;
    font-weight:500;
    letter-spacing:.08em;
}

.notice-box{
    padding:35px 40px;
    background:rgba(0,0,0,.78);
    border:1px solid rgba(255,0,80,.35);
    box-shadow:0 0 18px rgba(165,0,45,.12);
    color:#fff;
}

.notice-box h3{
    margin:0 0 20px;
    padding:0 0 12px 14px;
    border-bottom:1px solid rgba(255,49,87,.45);
    border-left:3px solid #ff3157;
    color:#fff;
    font-size:19px;
    line-height:1.6;
}

#notice .notice-box ul{
    margin:0 0 38px;
    padding-left:1.5em;
   
}

#notice .notice-box li{
    display:list-item; list-style-type:disc;
    margin-bottom:16px;
    padding-left:4px;
    color:#eee7eb;
    font-size:14px;
    line-height:1.4;
    overflow-wrap:anywhere;
}

#notice .notice-box li::marker{
    color:#ff3157;
}
.notice-box li:last-child{
    margin-bottom:50px;
}

/* SP */
@media screen and (max-width:767px){

    #notice{
        padding:70px 0;
    }

    #notice .inner{
        padding:0 15px;
    }

    .notice-title{
        margin-bottom:28px;
    }

    .notice-title span{
        font-size:30px;
    }

    .notice-title small{
        font-size:13px;
    }

    .notice-box{
        padding:25px 18px;
    }

    .notice-box h3{
        margin-bottom:16px;
        font-size:17px;
    }

    .notice-box ul{
        padding-left:1.3em;
        margin-bottom:30px;
    }

    .notice-box li{
        margin-bottom:14px;
        font-size:13px;
        line-height:1.9;
    }
}



@media screen and (min-width: 700px) and (max-device-width: 3000px) 
{}


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

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

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

@media screen and (max-width: 991px) {
.pc{ display:none;}
.mp{ display: inline-block;}
}

@media screen and (max-width:767px) {
.sp{ display:inline-block;}
}

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

@media screen and (max-width: 638em) {

.mp{ display:none;}

}