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


/* ////////////////////////////////////////////////////////////////////////////////

	Common

//////////////////////////////////////////////////////////////////////////////// */
html {
	scroll-behavior: smooth;
}

/* a[target="_blank"]:not([class])::after {
	margin-left: 0.4em;
} */
img {
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}
ul { list-style: none;}

.anim {
	opacity: 0;
	transform: translateY(40px);
	transition: all .6s ease-out;
}
.anim.on {
	opacity: 1;
	transform: translateY(0);
}


body {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
	font-size: min(3.4vw, 16px);
	line-height: 1.8;
	letter-spacing: .05em;
	-webkit-text-size-adjust: 100%;
	color: #181818;
	margin-top: min(calc(30px + 10vw), 92px);
}
section {
	padding: min(8vw, 80px) 0;
}
section:first-child {
	padding-top: min(20vw, 180px);
}
section:last-child {
	padding-bottom: min(18vw, 160px);
}
.innerWrap {
	max-width: 1160px;
	margin: auto;
	padding: 0 min(5vw, 48px);
}
h2 {
	font-family: "Lato", sans-serif;
	font-size: min(7.4vw, 36px);
	font-weight: 900;
	margin-bottom: min(4vw, 40px);
}

.listDisc,
.listAsterisk {
	list-style: none;
	padding-left: 1.2em;
	font-size: min(3vw, 14px);
}
.listDisc > li,
.listAsterisk > li {
	text-indent: -1.2em;
	font-weight: normal;
	line-height: 1.4;
}
.listDisc > li + li,
.listAsterisk > li + li {
	margin-top: 0.3em;
}
.listDisc > li:before,
.listAsterisk > li:before {
	margin-right: 0.2em;
}
.listDisc > li:before {
	content: "・";
}
.listAsterisk > li:before {
	content: "※";
}
.textRed,
.listDisc > li.caution,
.listAsterisk > li.caution {
	color: #ff3e3e;
}

.comingSoonArea {
	/* padding: min(20vw, 200px) 0; */
	border: #181818 solid 1px;
	padding: min(14vw, 140px) min(6vw, 32px);
	border-radius: min(5vw, 30px);
}
.comingSoonArea p {
	font-family: "Lato", sans-serif;
	font-size: min(5.6vw, 28px);
	font-weight: 700;
	text-align: center;
}


@keyframes fadeIn {
	0% { opacity: 0;}
	100% { opacity: 1;}
}

@media screen and (min-width: 821px) {
	.sp {
		display: none !important;
	}
}
@media screen and (max-width: 820px) {
	.pc {
		display: none !important;
	}
}

/* ----------- HEADER ----------- */

header {
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
	padding: min(5vw, 30px) min(4vw, 40px);
	transition: all 0.6s ease-out;
	z-index: 1;

	opacity: 0;
	animation: fadeIn 1s ease-out 1s forwards;
}
/* header::before {
	position: absolute;
	left: min(4vw, 40px);
	bottom: 0;
	content: "";
	display: block;
	height: 1px;
	width: calc(100% - min(8vw, 80px));
	background-color: #181818;
	transition: opacity 0.6s ease-in;
} */
header.on {
	background-color: rgba(255, 255, 255, 0.6);
	padding: min(2vw, 20px);
}
/* header.on::before {
	opacity: 0;
} */

header .hdrLogo {
	width: min(28vw, 140px);
}
header .menuWrap {
	display: flex;
	align-items: center;
	gap: min(2vw, 12px);
	transition: all 0.4s;
}
header .menuWrap p {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	font-size: min(3.8vw, 18px);
	letter-spacing: 0.08em;
}

.menuButton {
	position: relative;
	display: block;
	width: 60px;
	height:30px;
}
.menuButton span {
	display: block;
	background: #181818;
	width: 100%;
	height: 2px;
	position: absolute;
	left: 0;
	transition: all 0.4s;
}
.menuButton span:first-child { top: 10px;}
.menuButton span:last-child { bottom: 10px;}

header > .menuWrap.active {
	opacity: 0;
}
.menuWrap.active .menuButton span:first-child {
	transform: translateY(4.5px) rotate(45deg);
}
.menuWrap.active .menuButton span:nth-child(2) {
	transform: translateY(-4.5px) rotate(-45deg);
}

#globalNav {
	display: none;
	position: fixed;
	top: min(3.5vw, 20px);
	right: min(3.5vw, 20px);
	z-index: 10;
}
.navWrap {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background-color: #fff;
	border: #181818 solid 1px;
	padding: min(14vw, 64px) min(4vw, 36px) min(4vw, 40px);
	width: min(75vw, 320px);
	min-height: min(80vw, 360px);
}
.navWrap .menuWrap {
	position: absolute;
	top: min(7vw, 32px);
	right: min(4vw, 24px);
	z-index: 10;
}
.navWrap .mainNav {
	display: flex;
	list-style: none;
	flex-direction: column;
}
.navWrap .mainNav a {
	color: #181818;
	font-size: min(7vw, 32px);
	line-height: 1.8;
	letter-spacing: 0.1em;
	text-decoration: none;
}
.navWrap .copy {
	font-size: min(2.6vw, 10px);
}

/* ----------- MAIN VISUAL ----------- */

.mainVisual {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100vw;
	height: calc(100vh - min(calc(30px + 10vw), 92px));
	padding-bottom: 10vh;
}
.mainVisual p {
	visibility: hidden;
	text-align: center;
	font-family: "Lato", sans-serif;
	font-size: 9.4vw;
	font-weight: 700;
	letter-spacing: 0.2em;
	line-height: 1.2;
}
.mainVisual p.ready {
  visibility: visible;
}
.mainVisual p span {
  opacity: 0;
  transition: opacity .8s cubic-bezier(0.12,0,0.39,0);
}
.mainVisual p span.show {
  opacity: 1;
}


.mainVisual .scroll {
	position: absolute;
	left: 50%;
	bottom: 30px;
	transform: translateX(-50%);
	font-family: "Lato", sans-serif;
	font-size: min(3.4vw, 16px);
	font-weight: 500;
	letter-spacing: 0.2em;
	line-height: 1.2;
	text-decoration: none;
	color: #181818;

	opacity: 0;
	animation: fadeIn 1s ease-out 1s forwards;
}

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

	.mainVisual {
		padding-bottom: 11vh;
	}
	.mainVisual p {
		font-size: 12.2vw;
		line-height: 1.3;
	}
	.mainVisual .scroll {
		bottom: 56px;
	}
}

/* ----------- SCHEDULE ----------- */

#schedule h2 {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#schedule h2 span:last-child {
	font-size: min(5.6vw, 28px);
}
.scheduleList {
	font-family: "Lato", sans-serif;
	font-weight: 700;
	background-color: #FCFCFC;
	border: #181818 solid 1px;
	border-radius: min(5vw, 30px);
	padding: min(4vw, 24px) min(6vw, 48px) min(5vw, 44px);
}
.scheduleList + .scheduleList {
	margin-top: min(4vw, 32px);
}
.scheduleList > li {
	display: flex;
	border-bottom: #181818 solid 1px;
	padding: min(3vw, 15px) 0;
}
.scheduleList > li.scheduleHead {
	text-align: center;
	font-size: min(2.8vw, 13px);
}
.scheduleList > li.scheduleHead .time {
	margin-right: min(3vw, 15px);
}

.scheduleList li .day {
	width: 120px;
}
.scheduleList li .time {
  width: 120px;
}
.scheduleList li .area {
	width: 120px;
}
.scheduleList li .venue {
	width: calc((100% - 360px - min(3vw, 15px))*0.65);
}
.scheduleList li .info {
	width: calc((100% - 360px - min(3vw, 15px))*0.35);
}

.scheduleList li:not(.scheduleHead) .day {
	justify-content: center;
	gap: min(1vw, 8px);
	line-height: 1;
}
.scheduleList li:not(.scheduleHead) .day span:first-child {
	font-size: min(6vw, 28px);
	font-weight: 800;
}
.scheduleList li:not(.scheduleHead) .day span:last-child {
	font-size: min(3vw, 14px);
	padding-top: 0.1em;
}
.scheduleList li:not(.scheduleHead) .time {
	justify-content: center;
	font-size: min(3vw, 14px);
	padding-left: min(3vw, 15px);
}
.scheduleList li:not(.scheduleHead) .area {
	justify-content: center;
	font-family: "Noto Sans JP", sans-serif;
	font-size: min(3.8vw, 18px);
}
.scheduleList li:not(.scheduleHead) .venue {
	font-family: "Noto Sans JP", sans-serif;
	font-size: min(3.8vw, 18px);
	padding-left: min(4vw, 20px);
}
.scheduleList li:not(.scheduleHead) .info {
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	font-family: "Noto Sans JP", sans-serif;
	font-size: min(2.8vw, 13px);
	font-weight: 400;
	padding-left: min(4vw, 20px);
}
.scheduleList li:not(.scheduleHead) .info a {
	color: #181818;
}

.scheduleList li .verticalArea > div {
	display: flex;
}
.scheduleList li:not(.scheduleHead) p {
	border-right: #181818 solid 1px;
	display: flex;
	align-items: center;
	min-height: 2.6em;
}
.scheduleList li:not(.scheduleHead) p:last-child {
	border-right: none !important;
}

.scheduleList.black {
	background-color: #181818;
	color: #ffffff;
}
.scheduleList.black > li {
	border-bottom: #fff solid 1px;
}
.scheduleList.black li:not(.scheduleHead) p {
	border-right: #fff solid 1px;
}


.scheduleList li.comingSoon {
	justify-content: center;
	font-family: "Lato", sans-serif;
	font-size: min(5.6vw, 28px);
	font-weight: 700;
	padding: min(12vw, 120px) 0;
}

/* ----------- time なし ----------- */

.scheduleList > li.scheduleHead .day {
	margin-right: min(3vw, 15px);
}
.scheduleList li .venue {
	width: calc((100% - 240px - min(3vw, 15px)) * 0.65);
}
.scheduleList li .info {
	width: calc((100% - 240px - min(3vw, 15px)) * 0.35);
}

@media screen and (min-width: 821px) {


	.scheduleList > li:nth-child(2) {
		padding-top: min(6vw, 32px);
	}
	.scheduleList li .verticalArea {
		border-right: #181818 solid 1px;
		padding-right: min(3vw, 15px);
	}
	.scheduleList li .verticalArea > div:last-child {
		margin-top: min(2vw, 10px);
		border-top: #181818 solid 1px;
		padding-top: min(2vw, 10px);
	}


	.scheduleList.black li .verticalArea {
		border-right: #fff solid 1px;
	}
	.scheduleList.black li .verticalArea > div:last-child {
		border-top: #fff solid 1px;
	}

	.scheduleList li.comingSoon {
		border-bottom: none;
	}
}
@media screen and (max-width: 820px) {

	.scheduleList {
		background-color: transparent;
		padding: 0;
		border: none;
		border-radius: 0;
	}
	.scheduleList > li {
		background-color: #FCFCFC;
		flex-wrap: wrap;
		border: #181818 solid 1px;
		border-radius: min(5vw, 30px);
		padding: min(4vw, 32px) min(4vw, 48px) min(6vw, 56px);
	}
	.scheduleList > li + li {
			margin-top: min(4vw, 32px);
	}
	.scheduleList > li.scheduleHead {
		display: none;
	}
	.scheduleList li .verticalArea {
		display: flex;
    padding-bottom: 2vw;
		border-bottom: #181818 solid 1px;
    margin-bottom: 2vw;
    width: 100%;
	}
	.scheduleList li .verticalArea > div {
		/* width: 50%;
    flex-direction: column; */
		gap: 1em;
	}
	/* .scheduleList li .verticalArea > div:last-child {
		border-left: #181818 solid 1px;
	} */
	.scheduleList li:not(.scheduleHead) .day,
	.scheduleList li:not(.scheduleHead) .time {
		width: 100%;
	}
	.scheduleList li:not(.scheduleHead) .time {
		padding-left: 0;
	}
	.scheduleList li:not(.scheduleHead) .area {
		width: 20%;
		border-right: #181818 solid 1px;
	}
	.scheduleList li:not(.scheduleHead) .venue {
		width: 80%;
	}
	.scheduleList li:not(.scheduleHead) .info {
		width: 100%;
    border-top: #181818 solid 1px;
    margin-top: 3vw;
    padding-top: 3vw;
		padding-left: 0;
	}

	.scheduleList li p:not(.area) {
		border-right: none !important;
	}

	.scheduleList.black {
		background-color: transparent;
	}
	.scheduleList.black > li {
		background-color: #181818;
		border-bottom: #181818 solid 1px;
	}
	.scheduleList.black li .verticalArea {
		border-bottom: #fff solid 1px;
	}
	.scheduleList.black li:not(.scheduleHead) .area {
		border-right: #fff solid 1px;
	}
	.scheduleList.black li:not(.scheduleHead) .info {
    border-top: #fff solid 1px;
	}
	.scheduleList.black li .verticalArea > div:last-child {
		border-left: #fff solid 1px;
	}

	.scheduleList li.comingSoon {
		padding: min(14vw, 140px) 0 min(20vw, 200px);
		border: none;
		background-color: transparent;
	}
}


/* ----------- TICKET ----------- */

.ticketFee {
	border: #181818 solid 1px;
	border-radius: min(5vw, 30px);
	padding: min(5vw, 40px) min(6vw, 48px) min(7vw, 56px);
}
.ticketFee > p {
	font-size: min(3.8vw, 18px);
	font-weight: 700;
}
.ticketFee > p span {
	font-size: min(5vw, 24px);
}
.ticketFee .listAsterisk {
	margin-top: min(2vw, 24px);
}

.ticketTrade {
	margin: min(4vw, 40px) 0;
	overflow: hidden;
}
.ticketTrade > dt {
	position: relative;
	width: min(90%, 480px);
	margin: auto;
	padding: min(4vw, 24px) min(6vw, 48px);
	border-radius: 100vw;
	background-color: #181818;
	color: #fff;
	text-align: center;
	transition: all 0.4s ease-in-out;
}
.ticketTrade.open dt {
	border-top-left-radius: min(5vw, 30px);
	border-top-right-radius: min(5vw, 30px);
	border-bottom-left-radius: 0;
	border-bottom-right-radius: 0;
	width: 100%;
}
.ticketTrade > dt img {
	position: absolute;
	top: 50%;
	right: min(5vw, 56px);
	width: min(2vw, 10px);
	transform: rotate(90deg) translateX(-80%);
	transition: all 0.4s ease-in-out;
}
.ticketTrade.open > dt img {
	transform: rotate(-90deg) translateX(80%);
}
.ticketTrade dd {
	padding: min(5vw, 40px) min(6vw, 48px) min(7vw, 56px);
	border: #181818 solid 1px;
}
.ticketTrade dd .txt + .txt {
	margin-top: 1em;
}
.ticketTrade dd .innerDetail {
	border: #181818 solid 1px;
	padding: min(4vw, 32px) min(4vw, 40px);
	margin-top: min(4vw, 24px);
}
.ticketTrade dd .innerDetail li {
	border-left: 5px solid;
	padding-left: min(2vw, 10px);
}
.ticketTrade dd .innerDetail li + li {
	margin-top: min(3vw, 20px);
}
.ticketTrade dd .innerDetail li .ttl {
	font-weight: 600;
	margin-bottom: min(1vw, 5px);
}
.ticketTrade dd .innerDetail li a {
	color: #181818;
	word-break: break-all;
}

.ticketType {
	border: #181818 solid 1px;
	border-radius: min(5vw, 30px);
	/* padding: min(5vw, 40px) min(6vw, 48px); */
	padding-bottom: min(1vw,16px);
}
.ticketType dt {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: min(3.8vw, 18px);
	font-weight: 700;
	padding: min(5vw, 40px) min(6vw, 48px) min(4vw, 24px);
}
.ticketType dt img {
	width: min(2vw, 10px);
	transform: rotate(90deg) translateY(30%);
	transition: all 0.4s ease-in-out;
}
.ticketType dt.open img {
	transform: rotate(-90deg) translateY(-30%);
}
.ticketType dd {
	display: flex;
	padding-top: min(4vw, 20px);
	border-top: #181818 solid 1px;
	padding-top: min(4vw, 20px);
	margin: 0 min(6vw, 48px) min(4vw, 24px);

}
.ticketType dd > div {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.ticketType dd > div + div {
	margin-left: min(4vw, 24px);
	border-left: #181818 solid 1px;
	padding-left: min(4vw, 24px);
}
.ticketType dd > div:nth-child(1) {
	align-items: flex-start;
	gap: min(2vw, 8px);
}
.ticketType dd > div:nth-child(1) p:first-child {
	font-size: min(3vw, 14px);
	font-weight: 600;
	background-color: #D9D9D9;
	display: inline-block;
	padding: 0.2em 1em;
}
.ticketType dd > div:nth-child(1) p:last-child {
	font-weight: 400;
}
.ticketType dd > div:nth-child(2) {
	flex-grow: 1;
}
.ticketType dd > div:nth-child(2) p {
	font-size: min(3.8vw, 18px);
	font-weight: 600;
}
.ticketType dd .btnWrap a {
	display: flex;
	align-items: center;
	gap: 0.8em;
	width: fit-content;
	background-color: #181818;
	color: #fff;
	text-decoration: none;
	border-radius: 100vw;
	padding: 1em 2em;
}
.ticketType dd .btnWrap a img {
	width: 0.6em;
}

@media screen and (max-width: 820px) {
	.ticketType dd {
		flex-direction: column;
	}
	.ticketType dd > div + div {
		margin-left: 0;
		border-left: none;
		padding-left: 0;
		margin-top: min(4vw, 24px);
		border-top: #ccc solid 1px;
		padding-top: min(4vw, 24px);
	}
	.ticketType dd .btnWrap {
		align-items: center;
	}
}


/* ----------- FOOTER ----------- */

footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: min(5vw, 40px) min(5vw, 40px) min(6vw, 56px);
}
footer .ftrLogo {
	width: min(28vw, 140px);
}
footer .copy {
	font-size: min(2.6vw, 10px);
}