@charset "UTF-8";
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;-webkit-text-size-adjust:100%;}:where([hidden]:not([hidden='until-found'])){display:none!important}:where(html){-webkit-text-size-adjust:none;color-scheme:dark light}@supports not (min-block-size:100dvb){:where(html){block-size:100%}}@media (prefers-reduced-motion:no-preference){:where(html:focus-within){scroll-behavior:smooth}}:where(body){block-size:100%;block-size:100dvb;line-height:1.5;font-family:system-ui,sans-serif;-webkit-font-smoothing:antialiased}:where(input,button,textarea,select){font:inherit;color:inherit}:where(textarea){resize:vertical;resize:block}:where(button,label,select,summary,[role='button'],[role='option']){cursor:pointer}:where(:disabled){cursor:not-allowed}:where(label:has(>input:disabled),label:has(+input:disabled)){cursor:not-allowed}:where(button){border-style:solid}:where(a){text-underline-offset:.2ex}:where(ul,ol){list-style:none}:where(img,svg,video,canvas,audio,iframe,embed,object){display:block}:where(img,picture,svg){max-inline-size:100%;block-size:auto}:where(p,h1,h2,h3,h4,h5,h6){overflow-wrap:break-word}:where(h1,h2,h3){line-height:calc(1em + 0.5rem)}:where(hr){border:none;border-block-start:1px solid;color:inherit;block-size:0;overflow:visible}:where(:focus-visible){outline:2px solid var(--focus-color,Highlight);outline-offset:2px}:where(.visually-hidden:not(:focus,:active,:focus-within,.not-visually-hidden)){clip-path:inset(50%)!important;height:1px!important;width:1px!important;overflow:hidden!important;position:absolute!important;white-space:nowrap!important;border:0!important}

html{font-size:62.5%;}
body{font-size:14px; font-size:1.4rem; font-family:'Noto Sans JP',system-ui, "Hiragino Sans", "YuGothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS Gothic",sans-serif;  font-optical-sizing: auto; font-style: normal; letter-spacing:0.05em; line-height:1.5; text-align:center; background:#fff; -webkit-text-size-adjust:100%; color:#3f2a22; max-height: 100%; box-sizing:content-box; margin:0;}

img {width:100%; max-width:100%; height:auto;}
img[src$=".svg"] {width: 100%;}

/*Layout*/
a{color:#3f2a22; text-decoration:none; opacity: 1; transition: 0.5s; -webkit-transition:0.5s; text-decoration:none;}
a img:hover,a.line2:hover{opacity: 0.7; transition: 0.5s; -webkit-transition:0.5s;}
a.line:hover{text-decoration:underline;}
a.line2{text-decoration:underline;}

br.pc{display:none;}
br.smp{display:block;}
@media only screen and (min-width:540px) {
br.smp{display:none;}
}
@media only screen and (min-width:740px) {
br.pc{display:block;}
}

body{}
h3{position:relative; margin-bottom:8px; font-family: "Poppins", sans-serif; font-weight:600; font-size:3.2rem; color:#409dc6; letter-spacing:0; line-height:1.2;}
h3 span{display:block; font-family: "Noto Sans JP", sans-serif; font-size:1.2rem; color:#31444d; font-weight:400;}
h3.englishtitle{background:#31444d; color:#fff; padding:10px;}
@media only screen and (min-width:760px) {
h3{font-size:4.0rem;}
h3 span{font-size:1.4rem;}
}

.btn a{position:relative; display:block; background:#ffdf10; width:100%; padding:0 20px; border-radius:50px; margin:16px auto; height:40px; line-height:40px; font-weight:700; font-size:clamp(1.6rem, 1.516rem + 0.37vw, 1.7rem); text-align:left;}
.btn
.btn a:hover{background:#c0a912;}
.btn a:after{content:""; position:absolute; top:12px; right:15px; background:url("../lib/icon-arrow.png") no-repeat; background-size:cover; width:16px; height:16px;}
.btn .coming{position:relative; display:block; background:#ccc; color:#fff; width:100%; padding:0 20px; border-radius:50px; margin:16px auto; height:40px; line-height:40px; font-weight:700; font-size:clamp(1.6rem, 1.516rem + 0.37vw, 1.7rem); text-align:center;}
.btn a.btn2{height:48px; line-height:1.1; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between;}
.btn a.btn2 span{display:block; width:100%; font-size:.8em; font-weight:400; width:100%;}
.btn a.btn2:after{top:16px;}

#english .coming{font-family:'Noto Sans JP',system-ui, "Hiragino Sans", "YuGothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS Gothic",sans-serif; }


#english{margin-top:60px; font-family: "Poppins", sans-serif;}

header{position:relative; background:#f6f2ef; padding:12px;}
header #fvimage{position:relative;}
header .fvtitle{position:absolute; top:8vw; left:0; width:90%; overflow:hidden;}
@media only screen and (min-width:769px) {
header{padding:1vw;}
header .fvtitle{max-width:840px; top:initial; bottom:0%; left:0; right:0; margin:0 auto;}
}

.information{margin:30px 20px;}
.information ul{padding:6px 20px 20px; text-align:left; overflow-y:scroll; /*height:160px;*/}
.information ul::-webkit-scrollbar {width:4px;}
.information ul::-webkit-scrollbar-track {background-color: #fff; border-radius: 100px;}
.information ul::-webkit-scrollbar-thumb {background-color: #409dc6; border-radius: 100px;}
.information ul li{margin-bottom:8px; padding-bottom:8px;}
.information ul li.soon{font-family: "Noto Sans JP", sans-serif;}
.information ul li .date{display:block; font-family: "Poppins", sans-serif; letter-spacing:0; font-weight:300; font-size:1.3rem;}

.information ul li a{text-decoration:underline!important;}
.information ul li a:hover{opacity:.7;}
@media only screen and (min-width:760px) {
.information{margin:50px auto 0; max-width:980px; width:90%;}
.information .box{display:flex; gap:0 40px; justify-content:center; align-items:center;}
.information h3{text-align:right;}
.information ul{border-left:2px solid #409dc6; padding-bottom:0;}
}
@media only screen and (min-width:1100px) {
.information{width:100%;}
}

.ticket{margin:50px 0 0; padding:50px 20px 100px; background:#f6f2ef;}
.ticket p.ticket-type{margin:20px 0;}
.ticket p.ticket-type span{font-size:.85em;}
.ticket .ticketbox{margin: 0 10px; padding:20px 0; border-bottom:1.5px solid #3f2a22;}
.ticket .ticketbox.last{border:none;}
.ticket .ticketbox h5{font-weight:900; font-size:1.7rem; margin-bottom:16px;}
#english .ticket .ticketbox h5{font-weight:700; font-size:1.6rem;}
.ticket .ticketbox ul li{display:flex; gap:8px; justify-content:center; width:40%; max-width:220px; margin:0 auto 8px;}
#english .ticket .ticketbox ul li{max-width:288px;}
.ticket .ticketbox ul li .type{display:block; padding:2px 0; text-align:center; font-size:1.4rem; font-weight:500; width:50%; background:#fff;}
.ticket .ticketbox ul li .price{font-size:1.6rem; font-weight:500; flex:1; text-align:right;}
#english .ticket .ticketbox ul li .price{font-size:1.5rem;}
.ticket .ticketbox ul li .price .sml{font-size:.8em; font-weight:400;}
#english .ticket .inbound .btn a span{font-family:'Noto Sans JP',system-ui, "Hiragino Sans", "YuGothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS Gothic",sans-serif; }

.ticket ul.note{margin:8px 20px 30px; font-size:13px; text-align:left;}
.ticket ul.note li{text-indent: -1em; padding-left: 1em;}
.ticket ul.note li a{text-decoration:underline;}
.ticket ul.note li:before{content:"※";}
#english .ticket ul.note li:before{content:"*";}

.ticket .advance{background:#fff; margin:40px 20px 0; border-bottom:4px solid #409dc6;}
.ticket .advance h4{color:#409dc6; border-top:4px solid #409dc6; border-bottom:4px solid #409dc6; margin:0; font-size:2.1rem;}
.ticket .advance .orderbox{padding:20px; text-align:left;}
.ticket .advance .orderbox .period{display:block; max-width:100px; padding:2px 0; margin-bottom:4px; text-align:center; background:#c5e1ee;}
.ticket .advance .orderbox .order{font-weight:800; font-size:1.7rem; letter-spacing:0;}
.ticket .advance .orderbox .order span{font-size:.8em;}
.ticket .advance .orderbox .ticketdate2{font-size:1.4rem; line-height:1.6; margin-top:4px;}
.ticket .advance .orderbox .ticketdate2 span{font-size:.8em;}
.ticket .advance .notebox{display:inline-block; margin:0 20px 16px; padding:8px 10px; border:1px solid #3f2a22; font-size:1.3rem; text-align:left; letter-spacing:0; line-height:1.6; }
.ticket .advance .notebox a{text-decoration:underline;}
.ticket .advance .orderbox .btn{width:100%; max-width:380px; margin:0 auto;}
.ticket .advance .orderbox .inbound{background:#fff; border:1px solid #409dc6; padding:10px 10px 0 10px;}
.ticket .advance .orderbox .inbound p{font-weight:700; font-size:1.7rem; text-align:center;}

.ticket .ticketblock h4{font-size:2.1rem; padding:16px 0;}
.ticket .ticketblock .ticketdate{margin-top:16px; font-weight:800; font-size:1.7rem;}
.ticket .ticketblock .ticketdate span{font-size:.8em;}

.ticket .ticketsv{background:#fff; border:1px solid rgba(92, 74, 67, 0.873); margin:20px; padding:20px; text-align:left; border-radius:18px; max-width:840px;}
#english .ticket .ticketsv{max-width:940px;}
.ticket .ticketsv h4{color:#409dc6; padding-bottom:8px; border-top:none; border-bottom:2px solid #409dc6; margin:0 0 16px; font-size:1.7rem; text-align:center;}
.ticket .ticketsv p{margin-bottom:16px; line-height:1.6; line-break:strict; text-align:justify; word-break:break-all; text-justify:inter-character; text-justify:inter-character; word-wrap:break-word; overflow-wrap:break-word; line-break:strict;}
#english .ticket .ticketsv p{word-break:normal;text-align:left;}
.ticket .ticketsv .welfarebox{margin-bottom:20px;}
.ticket .ticketsv ul li{text-indent: -1em; padding-left: 1em;}
.ticket .ticketsv ul li:before{content:"※";}
#english .ticket .ticketsv ul li:before{content:"*";}

.ticket .history{ margin:40px 20px 0; text-align:left; max-width:840px;}
#english .ticket .history{max-width:940px;}
.ticket .history .historytitle{font-weight:600; padding-bottom:2px; margin-bottom:2px; border-bottom:1px solid #000;}
.ticket .history ul{list-style:disc; margin:10px 0 0 20px;}
.ticket .history ul li a{display:inline-block; margin-right:8px;}
.ticket .history ul li a{text-decoration:underline;}
#english .ticket .history ul li{font-family:'Noto Sans JP',system-ui, "Hiragino Sans", "YuGothic","メイリオ",Meiryo,"ＭＳ Ｐゴシック","MS Gothic",sans-serif; }


@media only screen and (min-width:760px) {
.ticket .advance{text-align:left; margin-bottom:0;}
.ticket h4.mtitle{display:flex; gap:16px; padding:12px 0; justify-content:center; margin-top:40px;}
#english .ticket h4.mtitle{align-items:center;}
.ticket h4 .venue{margin:0;}
.ticket .advance .orderbox{position:relative;}
.ticket .advance h4{ text-align:center;}
.ticket .advance .orderbox .btn{/*position:absolute; top:20px; right:20px;*/ min-width:auto; max-width:270px; text-align:left; margin:0;}
.ticket .advance .orderbox .inbound p{text-align:left;}
.ticket .advance .orderbox .inbound .btn{position:relative; width:100%; max-width:100%; display:flex; gap:0 20px;}
.ticket .advance .orderbox .inbound .btn a{display:block; width:calc(100% / 3);}
.ticket .advance .notebox{margin:0 0 0 20px;}
}
@media only screen and (min-width:840px) {
#english .ticket{letter-spacing:0;}
#english .ticket .box{max-width:980px;}
.ticket h4.mtitle{display:flex; gap:16px; padding:12px 0; justify-content:center; margin-top:40px;}
#english .ticket h4.mtitle{margin:0 auto;}
.ticket h4 .venue{margin:0;}
.ticket .tickettype{display:flex; gap:0; margin:16px auto; width:95%; max-width:880px;}
.ticket .ticketbox ul li{width:100%;}
.ticket .tickettype{width:100%;}
.ticket .ticketbox{width:38%; border-right:2px solid #3f2a22; border-bottom:none; margin:0 8px 0 0; padding:0 8px 0 0;}
.ticket .ticketbox:first-child,.ticket .ticketbox:last-child{width:31%;}
.ticket .ticketbox h5{font-size:1.6rem; letter-spacing:0}
#english .ticket .tickettype{align-items:stretch; max-width:100%;}
#english .ticket .ticketbox ul li{max-width:248px;}
#english .ticket .ticketbox ul li .type{font-size:1.3rem;}
#english .ticket .ticketbox ul li .price{font-size:1.4rem;}
}
@media only screen and (min-width:860px) {
.ticket .ticketsv{margin:20px auto;}
#english .ticket .ticketsv{margin:20px;}
.ticket .history{margin:20px auto;}
#english .ticket .history{ margin:40px 20px 0; text-align:left;}
}
@media only screen and (min-width:980px) {
.ticket .box{max-width:880px; margin:0 auto;}
.ticket .ticketbox h5{font-size:1.7rem;}
}
@media only screen and (min-width:1020px) {
#english .ticket .ticketsv{margin:20px auto; letter-spacing:.0;}
#english .ticket .history{margin:20px auto;}
}
@media only screen and (min-width:1100px) {
}

.seatmap{padding:50px 20px 20px;}
.seatmap .seatmapareatype{margin-top:16px; max-width:840px;}
.seatmap .seatmapimage{max-width:500px; margin:0 auto 20px;}
.seatmap .seatmapareatype ul li{display:flex; gap:4px 8px; align-items:center; font-size:1.6rem; font-weight:700; max-width:840px; width:100%; margin:8px auto 0;}
#english .seatmap .seatmapareatype{max-width:980px;}
#english .seatmap .seatmapareatype ul li{font-size:1.4rem;}
.seatmap .seatmapareatype ul li:before{content:""; width:30px; height:16px;}
.seatmap .seatmapareatype ul li.arena:before{ background:#409dc6;}
.seatmap .seatmapareatype ul li.stand-a:before{ background:#5d89a6;}
.seatmap .seatmapareatype ul li.stand-b:before{ background:#7faf7d;}

.seatmap .seat2 ul li{display:flex; gap:4px 8px; flex-wrap:wrap; align-items:center; font-size:1.6rem; font-weight:700; width:100%; margin:8px auto 0;}
#english .seatmap .seatmapareatype ul li{max-width:980px;}
.seatmap .seat2 ul li p{width:100%; font-size:1.3rem; font-weight:400; padding-left:36px; text-align:left;}
.seatmap .seat2 ul li:before{content:""; width:30px; height:16px;}
.seatmap .seat2 ul li.seated-area:before{ background:#f7d66a;}
.seatmap .seat2 ul li.wheelchair-area:before{ background:#f29e63;}
.seatmap .seatmapareatype ul li .price{flex:1; text-align:right;}

@media only screen and (min-width:760px) {
.seatmap .seatmapareatype{margin:16px auto 0;}
.seatmap .seatmapareatype .seat3 ul{display:flex; gap:10px;}
.seatmap .seatmapareatype .seat3 ul li:first-child{width:105%;}
.seatmap .seat2 ul li:before{margin-top:6px;}
.seatmap .seat2 ul li{width:100%; align-items:flex-start; margin-top:8px;}
.seatmap .seat2 ul li.price{flex:auto;}
.seatmap .seat2 ul li p{width:61.2%; padding:0; margin-left:16px;}
#english .seatmap .seatmapareatype ul li{gap:4px; letter-spacing:0;}
#english .seatmap .seat2 ul li p{width:50%;}
}

@media only screen and (min-width:880px) {
#english .seatmap .seat2 ul li p{width:61%;}
}
@media only screen and (min-width:920px) {
#english .seatmap .seat2 ul li p{width:61.5%;}
}

#popupnews{padding:5vw 15px;max-height:initial; background:#fff; text-align:left; height:100%; line-height:1.6;}
#popupnews h1{margin-bottom:16px; padding-bottom:8px; font-size:clamp(1.7rem, 1.627rem + 0.36vw, 1.9rem); font-weight:700; color:#409dc6; text-align:left; border-bottom:2px solid #409dc6;}
#popupnews h1.imgtitle{border:none; max-width:760px; margin:0 auto;}
#popupnews h3{max-width:800px; margin:0 auto;}
#popupnews h3.type2{margin-bottom:16px; color:#409dc6; text-align:center;}
#popupnews p{margin:0 auto; margin-bottom:16px;  padding-left:10px; font-size:clamp(1.4rem, 1.364rem + 0.18vw, 1.5rem); max-width:800px;}
#popupnews p.right{text-align:right;}
#popupnews p.ticketinfo strong{margin-top:4px; display:inline-block; width:140px;}
#popupnews .date{text-align:right; font-size:12px; font-size:1.2rem; margin-top:16px; margin-bottom:32px;}
#popupnews .artist span:before{content:"●";}
#popupnews .artist span{display:block; font-weight:600;}
#popupnews .artist ul{margin-bottom:8px; display:flex; gap:16px; flex-wrap:wrap; font-family: "Poppins", sans-serif; font-weight:500; letter-spacing:0;}
#popupnews .artist ul li{width:calc(100% / 2 - 8px);}
#popupnews .artist ul li img{margin-bottom:2px;}
#popupnews .artist ul li.soon{}
#popupnews .artist p{margin:16px 0 30px 0px; padding:0; font-family: "Poppins", sans-serif; font-weight:500; letter-spacing:0; font-size:1.4rem; text-align:center;}
#popupnews ul{margin-left:0;}
#popupnews ul.first li{margin-bottom:8px; text-indent: -1em; padding-left: 1em;}
#popupnews ul.popticket li{margin-bottom:8px;}
#popupnews ul.popticket li li{margin-bottom:0;}
#popupnews ul.first li span:before{content:"●";}
#popupnews ul.first li span{display:block; font-weight:600;}
#popupnews ul.popticket{margin-left:10px;}
#popupnews ul.popticket ul{margin-left:20px;}
#popupnews ul.popticket li:before{content:"・";}
#popupnews ul.popticket li li:before{content:"∟";}]
#popupnews .map{text-align:center;}
#popupnews .map img{max-width:600px; margin:0 auto;}

#popupnews .back{max-width:800px; margin:0 auto; margin:16px 0; font-size:13px;}
#popupnews .border{max-width:800px; margin:0 auto; margin-top:16px; padding:16px; border:1px solid #000;}
#popupnews .ticket{margin-top:30px; }
#popupnews .ticket,#popupnews .ticket p{text-align:center; font-weight:600; font-size:1.9rem; color:#cc0000;}
#popupnews .contact{margin-top:30px; padding-top:30px;}
#popupnews a{text-decoration:underline;}
#popupnews .btn a{height:60px; line-height:60px; max-width:500px; text-decoration:none;}
#popupnews .btn a:hover{opacity:.7;}
#popupnews .btn a:after{top:38%;}

@media only screen and (min-width:760px) {
#popupnews .artist ul li{width:calc(100% / 3 - 12px);}
}

.movieyet{margin:40px auto; max-width:700px;}
.movieyet p{margin-top:4px:}

.movie{position:relative; aspect-ratio: 16 / 9; width: 90%; margin:0 auto; height: auto;}
.movie iframe {position: absolute; left: 0; top: 0; height: 100%; width: 100%;}

footer{padding:40px 20px 30px; font-size:1.3rem; font-weight:400; text-align:center; font-weight:400;text-align:left; background:#104359; color:#fff;}
footer a{color:#fff;}
footer p{margin-bottom:4px;}
footer .copy{margin-top:30px; font-size:1.2rem; font-size:1.2rem; letter-spacing:0; }
@media only screen and (min-width:760px) {
footer .box{display:flex; gap:0 32px; justify-content:center;}
footer{font-size:1.4rem; text-align:center;}
footer p{margin-bottom:4px;}
}

/*fadein*/
.fadeUpTrigger,.fadeDownTrigger,.fadeLeftTrigger,.fadeRightTrigger{opacity: 0;}
.fadeUp{animation-name:fadeUpAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeUpAnime{
from {opacity: 0; transform: translateY(20px);}
to {opacity: 1; transform: translateY(0);}
}

.fadeDown{animation-name:fadeDownAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeDownAnime{
from {opacity: 0; transform: translateY(-100px);}
to {opacity: 1; transform: translateY(0);}
}

.fadeLeft{animation-name:fadeLeftAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0; }
@keyframes fadeLeftAnime{
from {opacity: 0; transform: translateX(-100px);}
to {opacity: 1; transform: translateX(0);}
}

.fadeRight{animation-name:fadeRightAnime; animation-duration:1.5s; animation-fill-mode:forwards; opacity:0;}
@keyframes fadeRightAnime{
from {opacity: 0; transform: translateX(100px);}
to {opacity: 1; transform: translateX(0);}
}

/*TOP PAGE*/
#pagetop {
	position:fixed;
	bottom:20px;
	right:10px;
	font-size:1.3rem;
	font-weight:700;
	z-index:999;
}
#pagetop a {
	margin-bottom:8px;
	background:#3988ab;
	text-decoration: none;
	color: #fff;
	padding:10px 20px;
	text-align: center;
	display: block;
	border-radius: 3px;
	font-family: "Poppins", sans-serif;
}
#pagetop a:hover {
	text-decoration: none;
	background:#61afd2;
}