hightouch@charset "UTF-8";
/* normalize */
html {-ms-text-size-adjust: 100%;-webkit-text-size-adjust:100%;}body {margin:0;}main {display:block;}h1,h2,h3,h4,h5,h6 {font-weight:800;margin:0;padding:0;}hr {box-sizing:content-box;height:0;overflow:visible;}pre {font-family:monospace, monospace;font-size:1em;}a {background-color:transparent;}abbr[title] {border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong {font-weight:800;}code,kbd,samp {font-family:monospace, monospace;font-size:1em;}small {font-size:80%;}sub,sup {font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sub {bottom:-0.25em;}sup {top:-0.5em;}img {border-style:none;vertical-align: bottom;}button,input,optgroup,select,textarea {font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input {overflow:visible;}button,select {text-transform:none;}button,[type="button"],[type="reset"],[type="submit"] {-webkit-appearance:button;}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner {border-style:none;padding:0;}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring {outline:1px dotted ButtonText;}fieldset {padding:0.35em 0.75em 0.625em;}legend {box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress {vertical-align:baseline;}textarea {overflow:auto;}[type="checkbox"],[type="radio"] {box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button {height:auto;}[type="search"] {-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration {-webkit-appearance:none;}::-webkit-file-upload-button {-webkit-appearance:button;font:inherit;}details {display:block;}summary {display:list-item;}template {display:none;}[hidden] {display:none;}picture,figure{display:block;}button{background-color: transparent;border: none;cursor: pointer;outline: none;padding: 0;appearance: none;}iframe{vertical-align: bottom;}
* {box-sizing: border-box; margin: 0; padding: 0;word-wrap: break-word; overflow-wrap: break-word;}
::selection {background: #BEF;}
body::-webkit-scrollbar,.hamburger-menus::-webkit-scrollbar{display: none;}
shader-doodle {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
}

/*Initial setting*/
html, body {width:100%; height:100%;}
html { font-size: 62.5%; line-height:1.5;overflow-y: scroll; overflow-x: hidden;}
body , textarea, input {font-family:"M PLUS Rounded 1c", sans-serif; font-weight:700;}
body {
	position: relative;
	font-size: 1.6rem;
	position:relative;
	z-index:0;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-webkit-text-size-adjust: 100%;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing:grayscale;
	color:#544;
}
p {margin-bottom:1em;}
p:last-child {margin-bottom:0;}
a { color: #F09; cursor:pointer; text-decoration:underline rgba(255, 0, 153,.4);text-decoration-thickness: 3px;text-underline-offset: 2px;transition: .2s;}
a:hover { text-decoration-color:rgba(255, 0, 153,.7);}
a.img{text-decoration:none; text-underline-offset: 0; display:block; cursor:pointer;overflow: hidden;position: relative;}
a.img::before { content: ""; position: absolute; top: 0; left: -70%; z-index: 2; display: block; width: 50%; height: 100%; background: -webkit-linear-gradient(25deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.5) 100%); background: linear-gradient(25deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.5) 100%); -webkit-transform: skewX(25deg); transform: skewX(25deg);}
a.img:hover{transform: scale(1.1);} 
a.img:hover::before { -webkit-animation: shine .5s; animation: shine .5s;}
@-webkit-keyframes shine { 100% { left: 125%; }}
@keyframes shine { 100% { left: 125%; }}

 
ul,ol{list-style: none outside;}
img {max-width: 100%; width:100%; height: auto; vertical-align:top;user-select: none;-webkit-user-select: none;-webkit-user-drag: none;image-rendering: crisp-edges;}
svg {display:block; max-width: 100%; width:100%; height: 100%; fill:#FFF;}
svg.external-link{width:1.4rem; height:1.4rem;fill:#222; display:inline; margin-left: 3px; vertical-align:-2px;}
svg.hidden{height:0;}
h2 {text-align:center;}
h3 {font-size:300%;margin-bottom:.5em;font-feature-settings: "palt";
color:rgba(255,108,168,1);
text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF;
}
h3:not(:first-child) {margin-top:1.5em;}
.js-glitter {
  position: relative;
  transition: all 0.4s;
  display:inline-block;
}
h4 {font-size:150%;margin-bottom:.5em;font-feature-settings: "palt";color:#5294ff;text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF;}


.star {
  position: absolute;
  display: block;
  width: 10px; 
  height: 10px;
  background-image: url("/assets/img/star.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  animation: glitter 1s;
  pointer-events: none;
}
@keyframes glitter {
  0% { transform: scale(.3); opacity: 0;}
  50% { transform: scale(1.5); opacity: 1;}
  100% { transform: scale(0); opacity: 0;}
}


/*class setting*/
.flex{display:flex;flex-wrap:wrap;}
a.nolink {background:lightgray !important; color:white !important; border-color:lightgray !important;}
.graybutton{
    display: block;
    background: #BBB;
    border: 2px solid #BBB;
    color: #fff;
    font-size: 125%;
    padding: 0.35em 0.5em;
    border-radius: 5px;
    text-align:center;
}
#body,#footer,#page-top {opacity:0;}


/* ============= 背景アニメ ============= */
#glitter {
position: fixed;
z-index:1;
inset:0;
width:100%;
height:100%;
overflow:hidden;
}
.bgcontainer {
position: fixed;
background: rgba(225, 255, 255,.1);
width:100%;
height:100%;
z-index:-2;
inset: 0;
overflow:hidden;
}
#heart-bg{
  position: fixed;
  z-index:-1;
  width: 80%; 
  height: 80%;
  right:20%;
  bottom:20%;
  filter: blur(5px);
  background-image: url("/assets/img/heart-bg.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  transform: skew(0.95turn, 13deg);
  animation: heart 8s infinite ease-in-out alternate-reverse;
}
#light {
	position: fixed;width:100%; height:100%; inset:0;
}
#light span {
	opacity: 1;
	position: absolute;
	border-radius: 50%;
	width: 50vw;
	height: 50vw;
	filter: blur(10px);
	z-index:0;
  background: radial-gradient(circle,rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 1) 90%, rgba(255, 255, 255, 0) 100%);
}
.light1 {
	top: 30%;
	left: 50%;
	animation: spotlight1 8s infinite ease-in-out alternate-reverse;
}
.light2 {
	top: 20%;
	left: 0%;
	animation: spotlight2 8s infinite ease-in-out alternate-reverse;
}
.light3 {
	top: 60%;
	left: 60%;
	animation: spotlight3 8s infinite ease-in-out alternate-reverse;
}
@keyframes spotlight1 {
	40% {transform: translateY(60vh) translateX(3vh);}
	80% {transform: translateY(40vh) translateX(30vh);}
	100% {transform: translateY(-3vh) translateX(5vh);}
}
@keyframes spotlight2 {
	25% {transform: translateY(10vh) translateX(90vh);}
	50% {transform: translateY(90vh) translateX(20vh);}
	75% {transform: translateY(10vh) translateX(10vh);}
}
@keyframes spotlight3 {
	25% {transform: translateY(10vh) translateX(-90vh);}
	50% {transform: translateY(-90vh) translateX(-20vh);}
	75% {transform: translateY(10vh) translateX(-10vh);}
}
@keyframes heart {
	40% {transform: translateY(30vh) translateX(20vh);}
	80% {transform: translateY(20vh) translateX(50vh);}
	100% {transform: translateY(-10vh) translateX(10vh);}
}

/*opening*/
#opening{
width: 100%;
height: 100vh;
margin:0 auto;
position: absolute;
inset: 0;
z-index:1;
display:none;
flex-flow: column;
align-items: center;
justify-content: center;
overflow:hidden;
opacity:1;
}
#opening p {
position: absolute;
z-index: 1;
text-align:center;
width:50%;
height:auto;
animation: openinglogo 3.5s ease-out;
animation-delay: 0s;
animation-fill-mode: forwards;
}
#opening p img {
max-width:none;
}
@keyframes openinglogo {
  0% {
  opacity:1;
  }
  80% {
/*  transform: translateX(0%); */
  transform: scale(1);
  opacity:1;
  }
  95% {
/*  transform: translateX(150%); */
  transform: scale(.1);
  opacity:0;
  }
  100% {
  opacity:0;
  display:none;
  }
}
@media only screen and (max-width: 760px) {
#opening{
padding:50vw;
}
}

/* html */
html.scrollmenu-open {
width: 100%;
height: 100%;
overflow: hidden;
}

/*common class*/
.flex {
position: relative;
display: flex;
flex-wrap: wrap;
}
.flex-item {
}
.swiper-wrapper{user-select: none;-webkit-user-select: none;}
.line-through {text-decoration:line-through;}
.nowrap{white-space: nowrap;}
.small {font-size:clamp(1.2rem,85%,1.6rem);}
.center {text-align:center;}
@media (max-width: 760px){
.alignright{ float: none; margin-left: 0; }
.alignleft{ float: none; margin-right: 0;}
.small {font-size:clamp(1rem,85%,1.4rem);}
}
.precautions li { display: flex; align-items: baseline;}
.precautions li:before { content: "\203B"; margin-right: 2px; }
.animate{opacity:0;}
.anchor { padding-top: 70px; margin-top: -70px;}

/*body*/
#body {
position: relative;
z-index: auto;
inset: 0;
width:100%;
margin-left: auto;
margin-right: auto;
background: rgba(255, 255, 255, .5);
}
#body .section {
 position: relative;
 z-index:auto;
 width: 84%;
 margin-left: auto;
 margin-right: auto;
 margin-bottom:3em;
}

@media (min-width: 513px) and (max-width: 960px) {
#body .section {
 width: 92%;
}
}
.section-header {
display: block;
position: relative;
z-index: 1;
text-align: center;
margin-bottom: 2em;
}

#header {
position:sticky; 
top:0;
z-index:5;
opacity:0; width:100%;overflow: visible; background: linear-gradient(90deg, rgba(255, 219, 243, 1) 0%, rgba(230, 161, 255, 1) 50%, rgba(166, 213, 255, 1) 100%);}
#header-inner {position:relative; z-index:1; margin:0 auto; width: 84%;}
#header li {flex-basis:calc(80% / 5); padding:.3em; border-radius:.3em;}
#header li:nth-of-type(1){ padding:.25em;flex-basis: 13%;}
#header li:nth-of-type(1) a:hover {transform: scale(1.1);}
#header li:nth-of-type(1) a:after {display:none;}
#header li:nth-of-type(1) a img {height:auto;}


/* ============= メインビジュアル（mainvisual） ============= */
#mainvisual {
position: relative;
margin: 0 auto;
overflow: hidden;
z-index:1;
padding-top:100.26%;
}
#mainvisual h1{
position: absolute;
top:10%;
left:5.5%;
width:40%;
height:auto;
z-index:1;
margin:0;
}
#mainvisual .mv-img{
background:#FFF;
position: absolute;
width:100%;
height:auto;
top: 50%;
left: 100%;
transform: translate(-100%, -50%);
}
#mainvisual .mv-img img{
width:100%;
object-fit: cover;
object-position:0;
height:auto;
position:relative;
z-index:2;
}
#mainvisual .flex{
position: absolute;
top:68%;
left:3%;
width:44%;
height:auto;
z-index:1;
margin:0;
flex-wrap:nowrap !important;
justify-content:space-between;
}
#mainvisual .flex li{
width:48%;
}

#mainvisual.subpage {
padding-top:28.125%;
}

#catchcopy{padding:2.5em 0 0;}
#event-information {display:flex; justify-content:space-between; align-content:center; margin-top:3em;}
#event-information p {margin:0;}
#event-information p{flex-basis:40%;}
#event-information div{flex-basis:60%;}
#event-information div ul{margin-top:1em;}

/* ========== 最新情報 ========== */
#whatsnew_wrapper {position: relative; z-index: 2;}
#whatsnew{overflow:visible;margin-left:auto;margin-right:auto; border:none;}
#body #whatsnew.section{ border:none;padding:0;}
#whatsnew .swiper-wrapper {display:flex;}
#whatsnew .swiper-wrapper li {height: auto;}
#whatsnew .swiper-wrapper li a { display:block; background:#FFF; text-decoration:none;height: 100%;}
#whatsnew .swiper-wrapper li a:hover {transform: scale(1.1);}
#whatsnew .swiper-wrapper li a span {display:block;}
#whatsnew .swiper-wrapper li a span.date {background:#F09; color:#FFF; padding:0em .8em;}
#whatsnew .swiper-wrapper li a span.title {padding:.5em .6em .3em; font-size: clamp(1.6rem, 125%, 2rem); line-height:1.3;}
#whatsnew .swiper-wrapper li a span.text {padding:0 1em 1em; font-size: clamp(1.2rem, 85%, 1.6rem); line-height:1.4; color:#544;}
#whatsnew .swiper-slide { background: rgba(255, 255, 255, .8);}
#whatsnew .swiper-slide-duplicate {/*height:calc(90vw / 3 - 20px) !important;*/}
#whatsnew .swiper-button-next:after,#whatsnew .swiper-button-prev:after {content:"" !important; display:none;}
#whatsnew .swiper-button-prev {left: auto; right:10vw !important; top:auto; bottom:0 !important; width:2.5vh !important;}
#whatsnew .swiper-button-next {right:2vw !important; top:auto !important; bottom:0 !important; width:2.5vh !important;}
#whatsnew .swiper-button-prev img,#whatsnew .swiper-button-next img {filter: brightness(0) saturate(100%) invert(35%) sepia(100%) saturate(7480%) hue-rotate(316deg) brightness(100%) contrast(111%);}
#whatsnew .section-body {overflow:hidden;}
#whatsnew .more { position: relative; z-index: 2; font-size: clamp(1.6rem, 125%, 2rem); font-weight:900; line-height:1.3; text-align:center; margin-top:1.5em;}
#whatsnew .more a { display:inline-block; color:#F09; text-shadow: 1px 2px #FFF, 1px -2px #FFF, -1px 2px #FFF, -1px -2px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 2px 1px #FFF, 2px -1px #FFF, -2px 1px #FFF, -2px -1px #FFF; text-decoration:none; background: linear-gradient(90deg, rgba(255, 219, 243, 1) 0%, rgba(230, 161, 255, 1) 50%, rgba(166, 213, 255, 1) 100%); padding:.5em 3em; border-radius:2em; box-shadow: 3px 3px 0 rgba(200, 200, 200, .3);}
#whatsnew .more a:hover{transform: scale(1.1);}


#gmap {z-index:auto !important;}
#gmap p{background:#f4a; color:#FFF; padding:.5em 1em; margin-bottom:0;position: relative; z-index: 2;}
#gmap a{color:#FFF; text-decoration: underline rgba(255, 255, 255, .8);}
#gmap iframe{position:relative; z-index:2;}

#menu {position:relative; z-index:auto !important;}
#menu:after { content:""; position:absolute;  background-image:url(/assets/img/ribbon.svg); background-position:0 50%; background-size: contain; background-repeat:no-repeat;width:100vw;height:150%;top:50%;left:50%;z-index:-1;transform: translate(-50%,-20%);transform-origin: center;}
#menu ul {display:flex; justify-content:center; flex-wrap:wrap; gap:2em 3%;}
#menu li {flex-basis:calc(100% / 5 - 2.5%);}
#menu li a {position:relative; z-index:2;}

#body #detail {width:92%; margin-bottom:3em;padding:1.5em 0;}
#detail:before{content:"";position:absolute;background-image:url(/assets/img/detail-bg.svg); background-position:50% 50%; background-size: contain; background-repeat:no-repeat;width:100%;inset:0;z-index:0;}
#detail-lead {width:88%;margin:0 auto 2em;position: relative;z-index:1; }
#detail-closing {width:75%; margin:0 auto;position: relative;z-index:1;}

#youtube.section {padding-top: 52%;position: relative; z-index:2; inset:0; margin-bottom:0;}
#youtube iframe {width:100%;height: 100%; border: none;vertical-align: bottom; position: absolute; inset:0;}

#sns-links {display:flex; justify-content:center; gap:2em; position:relative;z-index:2 !important;}
#sns-links li {flex-basis:36%;}

#sponsorship {background:rgb(255, 196, 0); color:#fff;padding:.5em 1em; margin-top:2em;}
#sponsorship dl {width:84vw;margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between;}
#sponsorship dt {flex-basis:20%; display:grid; place-content:center;white-space:nowrap;
background:rgba(255, 106, 0,.3); padding:.15em 0; margin:.1em 0;}
#sponsorship dd {flex-basis:80%; padding:.15em 0; padding-left:.5em; margin:.1em 0;}


/* ============= チケット（ticket） ============= */
#body.ticket h3 { line-height:1; margin-bottom: .5em;letter-spacing:0;}
#ticket-price {padding:3em 0 0; position:relative; z-index:auto;}
#ticket-price h3 span {display:inline-block; font-size:1.4rem; margin-left:.5em; margin-bottom:0;}
#ticket-price .flex-item:nth-of-type(1) h3 {color:#FF7BAD;}
#ticket-price .flex-item:nth-of-type(2) h3 {color:#C784D9;}
#ticket-price .flex {justify-content:space-between; gap 4%;}
#ticket-price .flex-item {flex-basis:48%; display: flex; flex-wrap: wrap; align-content: space-between;}
table.price{font-size:clamp(1.6rem,1.8vw,2rem);border-spacing: 5px; margin:-5px; width:100%;}
.price th {text-align:center;}
.price td {text-align:right; white-space: nowrap;}
.price th,.price td{background:rgba(235,235,235,.8);padding:.5em .5em; border-radius:.25em;}
.price td:nth-of-type(3){font-size:clamp(1.6rem,1.8vw,2rem);}
#ticket-price .flex-item:nth-of-type(1) th {background:#FF7BAD; color:#FFF; font-weight:900;}
#ticket-price .flex-item:nth-of-type(2) th{background:#C784D9; color:#FFF; font-weight:900;}
p.buytickets {display:block; margin:2em auto 0; position:relative; z-index:2;}

#ticket-price ul {margin-top:1em; display:flex; flex-wrap:wrap; }
#ticket-price li {white-space: nowrap; }

#tickets #sales-schedule {font-size:100%;}
#tickets #sales-schedule dl {
position:relative;
    display: flex;
    flex-wrap: wrap;
    font-size: clamp(1.6rem,1.8vw,2rem);
    width: 100%;
    gap:2px;
    color: #333;
}
#tickets #sales-schedule dt {
border-radius:.2em;
    flex-basis: 35%;
    background: rgba(255, 255, 255, 1);
    padding: 1rem 1.5rem;
  display: grid;
  place-content: center;
}
#tickets #sales-schedule dd {
border-radius:.2em;
    flex-basis: calc(65% - 2px);
    background: rgba(255, 255, 255, 1);
    padding: 1rem 2rem;
}
.soldout {position:relative;}
.soldout:before{
content:"";
position:absolute;
width:100%;
height:100%;
inset:0;
background-color:rgba(255,255,255,.8);
background-image:
radial-gradient(#7bded9 50%, transparent 50%);
background-size: 3px 3px;
}
.soldout:after{
content:"予定枚数終了";
position:absolute;
display: grid;
place-content: center;
inset:0;
width:100%;
height:100%;
font-size:clamp(4rem,5vw,5rem);
color:#7bded9;
font-weight:900;
text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF;}

.mesh {position:relative;}
.mesh:before{
content:"";
position:absolute;
width:100%;
height:100%;
inset:0;
background-color:rgba(255,255,255,.8);
background-image:
radial-gradient(#c7c7c7 50%, transparent 50%);
background-size: 3px 3px;
}


/* ============= チケット販売スケジュール（ticket-schedule） ============= */
#ticket-schedule {}
#ticket-schedule h3 {text-align:center;}
#ticket-schedule .flex-item:nth-of-type(1) h3 {color:#FF7BAD;}
#ticket-schedule .flex-item:nth-of-type(2) h3 {color:#C784D9;}
#ticket-schedule .flex {justify-content:space-between; gap 8%;}
#ticket-schedule .flex-item {flex-basis:46%;}


/* ============= Light Up！公演について（lightup） ============= */
#lightup.section {}
#lightup h3 {text-align:center; margin-bottom:1em !important;}
#lightup div {background:rgba(255,255,255,.7); padding:1.5em; border-radius:1em; margin-bottom:1.5em;}
#lightup div ul { font-size:125%;}
#lightup .flex{justify-content:space-between;}
#lightup .flex table{justify-content:space-between; width:48.5%;}
#lightup table{font-size:clamp(1.6rem,1.8vw,2rem);border-spacing: 5px;}
#lightup table caption {border-radius:.25em;margin:0 5px;}
#lightup table:nth-of-type(1) caption {background-color:#ff99be;}
#lightup table:nth-of-type(2) caption {background-color:#ffcc00;}
#lightup th {background-color:#84addb; color:#FFF; text-align:center;}
#lightup td {background-color:#fff; text-align:center;}
#lightup th,#lightup td{padding:.5em .5em; border-radius:.25em;border:2px #84addb solid;}
#lightup td span {font-size:75%; display:block;text-align:left;}
#lightup table.tokutei td {padding:.5em 1em;}
#lightup table.notice tr:nth-of-type(1) {font-size:75%;}
#lightup table.notice tr:nth-of-type(2) th {width:24%;}
#lightup table.notice tr:nth-of-type(2) td {width:38%;}
#lightup table.notice tr:nth-of-type(3) {background-color:#FFF;}




#lightup li {margin-bottom:.3em;}


/* ============= カレンダー（calendar） ============= */
#body.schedule h3 {line-height:1.3; margin-bottom: .25em;letter-spacing:0;}
#calendar {width:100% !important;padding:3em 0 0 8vw; padding-top:3em;z-index:2 !important; overflow-x: scroll; -ms-overflow-style: none; scrollbar-width: auto;}
#calendar ol {display:flex;padding:0 8vw 0 0;}
#calendar ol li:first-of-type span.day,#calendar ol li.holiday span.day {color:rgba(255,0,10,1);}
#calendar ol li:last-of-type span.day { color: rgba(0, 175, 255, 1);}
#calendar h4:not(:first-of-type) {margin-top:1.5em;}
#calendar ol {min-width:800px;}
#calendar ol li {flex-basis:calc(100% / 7); height:5.5em; position:relative; display: grid; place-content:center; font-weight:bold; color:rgb(255, 99, 203); background:#FFF; margin:3px; border-radius:5px; box-shadow: 3px 3px 0 rgba(200, 200, 200, .3); font-size:clamp(1.1rem,1.4vw,1.6rem); padding-top:1.25em;}
#calendar ol.week { height:1.6em; margin-bottom:5px;}
#calendar ol.week li { height:1.6em; color:#000; background:rgb(235,235,235); padding-top:0;}
#calendar ol.week li.sunday {background:rgba(255,0,10,1);}
#calendar ol.week li:last-of-type {background-color: rgba(0, 175, 255, 1);}
#calendar li span.day { display: block; position: absolute; top: 5px; left: 5px; font-size: 125%; font-family: "Arial", sans-serif; line-height:1; letter-spacing: 0; color:#666; z-index:3;}
#calendar li span.day span.month { font-size: 80%; vertical-align: text-top;}
#calendar li span.holiday { display: inline-block; position: absolute; font-size: 1.2rem;  text-align:center; color: rgba(255, 255, 255, 1); background: rgba(255, 0, 0, .7); right: 3px; top: 5px;padding:0 5px;text-shadow:none;}
#calendar li span.name { color:#FFF; background:rgb(255, 191, 0); border-radius:.2em; padding:0 .5em; display:block; text-align:center; z-index:2; white-space:nowrap;}
#calendar li span.date-type1 { color:rgb(54, 198, 255); display:block; text-align:center; z-index:2;}
#calendar li span.date-type2 { color:rgb(255, 69, 202); display:block; text-align:center; z-index:2;}
#calendar ul {margin-top:1em;}

#calendar::-webkit-scrollbar,#calendar::scrollbar,{display: block; width: 5px; height: 8px; background-color: #aaa;}
#calendar::-webkit-scrollbar-thumb { background: #000;}


#body.schedule div.content {background:rgba(255,255,255,.7); padding:1.5em; font-size:125%; border-radius:1em; margin-bottom:1.5em;}

#body.schedule div.content table {font-size:125%; margin:-8px; border-spacing:8px; margin-bottom:.5em;}
#body.schedule div.content th, #body.schedule div.content td { border-radius:.5em; padding:1em 1.5em;}
#body.schedule tr:nth-of-type(1) {background:rgba(255, 99, 203, .6);}
#body.schedule tr:nth-of-type(2) {background:rgba(66, 135, 245, .6);}

#body.schedule div.content ol {display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-bottom:1em;}
#body.schedule div.content ol li {display:grid; place-content:center; background:rgba(74, 180, 255,.5); padding:1em; border-radius:.5em;}
#body.schedule div.content ol li.lightup span { position:relative; z-index:1;}
#body.schedule span.lightup { display:block; position:absolute !important; right:5px; top:-5px; font-size:200%; opacity:.6; z-index:0;}
#body.schedule div.content ol li.lightup { position:relative; background:rgb(255, 229, 79); padding-right:2em;}


/* ============= 会場マップ（hallmap） ============= */
#body.hallmap p.announce{font-size:125%;text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF;}
#kaijomap { padding-top: 3em; margin-bottom:1em !important;}
#kaijomap h3{ margin-bottom:0; }
#kaijomap p { position:relative; z-index:2;}

#stage {background:rgba(255,255,255,.7); padding:2em; border-radius:1em; margin-bottom:1.5em;}
#stage .flex {gap:3%;}
#stage .flex p.image {flex-basis:40%; margin-bottom:0;}
#stage .flex p.announce {flex-basis:57%;}

#singer { margin-top:2em;}
#singer .flex {gap:3%;}
#singer .flex li {flex-basis:calc(94% / 3);}
#singer .flex p {margin:0; text-align:center;}
#singer .flex p.image {}
#singer .flex p.name {background:rgba(210, 128, 255,.8);padding:.5em 1em 0;}
#singer .flex p.text {background:rgba(210, 128, 255,.8);padding:0 1em .5em;}

#workshop {background:rgba(255,255,255,.7); padding:2em; border-radius:1em; margin-bottom:1.5em;}
#workshop .flex {gap:3%;}
#workshop .flex-item {flex-basis:calc(97% / 2);display: flex; flex-wrap: wrap; align-content: space-between;}
#workshop .flex-item p.image {width:100%;}

#toolarea {background:rgba(255,255,255,.7); padding:2em; border-radius:1em; margin-bottom:1.5em;}
#toolarea .section-header {display:flex; justify-content:left; align-items:center;}
#toolarea .section-header h3,#toolarea .section-header ul {margin:0;}
#toolarea .section-header ul {margin-left:1em;}
#toolarea .flex {gap:3%;}
#toolarea .flex p {flex-basis:calc(97% / 2);display: flex; flex-wrap: wrap; align-content: space-between;}
#toolarea .flex p.announce {flex-basis:100%;}

#hallmap-closing {position:relative;}
#hallmap-closing p {position:relative; z-index:1;}
#hallmap-closing .image{ positon:absolute; z-index:0; margin:0 auto;transform: rotate(-3deg) translateY(-7%);}


/* ============= グッズ（goods） ============= */
.comingsoon {font-size:300%; padding:15vw 0; margin:0 auto; text-align:center; color:rgb(31, 224, 157);text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF;}


/* ============= 注意事項（precautions） ============= */
#body.precaution .section dd {min-height: 0px; }
#body.precaution .section dt:before{display:inline-block; content:"Q"; margin-right:0.5em; font-weight: bold;background:#D15CFF; color:#fff; border-radius:50%; padding:0.2em 0.6em; text-align:center;}
#body.precaution .section dt.active:before{color:#531;}
#body.precaution .section dt{background:#FFF; border-radius:1em;  padding:0.5em; margin-bottom:0.5em; cursor:pointer; position:relative;z-index:2;-ms-user-select: none;-webkit-user-select: none;-moz-user-select: none; font-size:125%;    box-shadow: 3px 3px 0 rgba(200, 200, 200, .3);}
#body.precaution .section dt:hover{background:#D15CFF; color:#fff;-moz-transition: color 0.15s linear , background 0.3s linear;-webkit-transition: color 0.15s linear , background 0.3s linear;transition: color 0.15s linear , background 0.3s linear;}
#body.precaution .section dt:hover:before{background:#fff; color:#D15CFF;}
#body.precaution .section dt.active{ background:#D15CFF; color:#fff;}
#body.precaution .section dt.active:before{background:#fff; color:#D15CFF;}
#body.precaution .section dd{padding:2em; margin-top:-2em; margin-bottom:1em;background:transparent; position:relative;z-index:2;}
#body.precaution .speechbubble {
  position: relative;
  display: block;
  margin-left: 10px;
  padding: 1em 1em 1em 3.5em;
  border-radius: 1em;
  background-color: #badeff;
  text-align: left;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  box-shadow: 3px 3px 0 rgba(144, 174, 214, .3);
}
#body.precaution .speechbubble::before {
  content: "A";
  display:block;
  position: absolute;
  top:13px;
  left:2rem;
  margin-right:0.5em; font-weight: bold;background:#D15CFF; color:#fff; border-radius:50%; padding:0.2em 0.6em; text-align:center;
}
#body.precaution .speechbubble::after {
  content: "";
  position: absolute;
  top: 35%;
  left: 0;
  border-style: solid;
  border-width: 0 20px 20px 0;
  border-color: transparent #badeff transparent transparent;
  translate: -100% calc(-50% + 2px);
  transform: skew(0, 10deg);
  transform-origin: right;
}
#body.precaution #section-header {padding-top:3em;}
#body.precaution h2 {font-size:300%;text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF; margin-bottom:1.6rem; color:#FC0;}
#body.precaution p.announce{font-size:125%;text-shadow: 1px 3px #FFF, 1px -3px #FFF, -1px 3px #FFF, -1px -3px #FFF, 2px 2px #FFF, 2px -2px #FFF, -2px 2px #FFF, -2px -2px #FFF, 3px 1px #FFF, 3px -1px #FFF, -3px 1px #FFF, -3px -1px #FFF;}
#body.precaution .photoshoot h4 { margin-bottom: .1em;}
#body.precaution .photoshoot ul {background:#FFF; border:none; margin-bottom:1.5em;border-radius:0.5em; padding:1.5em; margin-top:1em;}
#body.precaution .photoshoot .speechbubble {padding-top:2em; padding-bottom:2em;}
#body.precaution .photoshoot table{font-size:clamp(1.6rem,1.8vw,2rem);border-spacing: 5px; margin:-5px; width:100%; margin-bottom:.5em;}
#body.precaution .photoshoot th,#body.precaution .photoshoot td{padding:.5em .5em; border-radius:.25em;}
#body.precaution .photoshoot th {text-align:center;background-color:#84addb; color:#FFF;}
#body.precaution .photoshoot td {text-align:center;background-color:#fff;}


#body.precaution dd table{margin-bottom:1.25em;}


/* footer */
#footer {
position:relative;
overflow:visible;
z-index:auto;
}
#footer-menu-wrapper{
display: grid;
grid-template-columns: repeat(2, 1fr);
width: 80%;
padding:30px 0 50px;
max-width: 1280px;
margin: 0 auto;
}

/* footer-sns */
ul#footer-sns{
display: flex;
justify-content: center;
align-content: center;
flex-wrap: wrap;
padding: 10px 0;
position:relative;
z-index:5;
}
#footer-sns li {
flex-basis:30px;
margin:0 2%;
}
#footer-sns li a {
display:block
}
#footer-sns svg {
width: 100%;
height: 30px;
fill: #000;
}
#footer-sns a:hover svg {
fill: #F47;
filter: drop-shadow( 0px 0px 1px #FFF ) drop-shadow( 0px 0px 2px #FFF ) drop-shadow( 0px 0px 3px #FFF ) drop-shadow( 0px 0px 5px rgba(255,255,255,.5) ) drop-shadow( 0px 0px 8px rgba(255,255,255,.5) );
transition: .3s;
}


/* copyright */
#copyright {
font-weight:normal;
text-align: center;
font-size: clamp(1rem,2.1vw,1.3rem);
}


/*page-top*/
#page-top {
display:none;
position: fixed;
z-index:2;
right: 15px;
bottom: 15px;
background: #f39;
padding: 10px;
border-radius: 50%;
box-shadow: 0 0 5px rgba(100,50,75,.5);
width:50px;
height:50px;
}
#page-top:hover {
background: rgba( 255, 200, 240,.9);
}
#page-top span {
position: relative;
display:block;
opacity: 0;
animation-iteration-count: infinite;
animation-duration: 2.0s;
animation-name: scroll;
}
#page-top span::before,#page-top span::after{
position: absolute;
display:block;
content: "";
border-bottom:3px solid #FFF;
left:0;
top:50%;
width:50%;
transform: rotate(-45deg) translateX(25%);
}
#page-top:hover span::before,#page-top:hover span::after {
border-color: #F39;
}
#page-top span::after {
left:auto;
right:0;
transform: rotate(45deg) translateX(-25%);
}
#page-top span:nth-of-type(1) { animation-delay:.5s; top: 10px; }
#page-top span:nth-of-type(2) { animation-delay: .2s; top: 20px; }
@keyframes scroll { 0% {opacity: 0;} 50% {opacity: 1;} 100% {opacity: 0;} }

/*modal-window*/
.modal-open{ cursor: pointer; text-decoration:underline;}
.modal-container{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	background: rgba(0,0,0,50%);
	padding: 40px 20px;
	overflow: auto;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
    box-sizing: border-box;
    z-index:101;
}
.modal-container:before{
	content: "";
	display: inline-block;
	vertical-align: middle;
	height: 100%;
}
.modal-container.active{
	opacity: 1;
	visibility: visible;
}
.modal-body{
	position: relative;
	display: inline-block;
	vertical-align: middle;
	max-width: 500px;
	width: 90%;
}
.modal-close{
	position: absolute;
	display: flex;
    align-items: center;
    justify-content: center;
	top: -40px;
	right: -40px;
	width: 40px;
	height: 40px;
	font-size: 40px;
	color: #fff;
	cursor: pointer;
}
.modal-content{
	background: #fff;
	text-align: left;
	padding: 30px;
	height: 525px;
}
.modal-content iframe{ width: 100%; border: none; height: 100%;}