.countdown {
	background-image: url(../img/countdown/countdown-bg.webp);
	background-position: center top min(7.7rem, 6.016vw);
	background-repeat: no-repeat;
	background-size: cover;
}

@media screen and (max-width: 768px) {
	.countdown {
		background-image: url(../img/countdown/countdown-bg_sp.webp);
		background-position: center top 14.667vw;
	}
}

/* ---------------------------------------------------
  gnav
--------------------------------------------------- */
.gnav {
	position: fixed;
}

/* ---------------------------------------------------
  header
--------------------------------------------------- */
.header {
	margin-top: min(7.7rem, 6.016vw);
	margin-bottom: min(5.5rem, 4.297vw);
	color: rgb(var(--wht));
}

.header__title {
	margin-bottom: min(2.9rem, 2.266vw);
	padding: min(4.8rem, 3.75vw) 0;
	line-height: 0.8;
	font-family: var(--zain);
	font-size: min(3.2rem, 2.5vw);
	font-weight: 800;
	text-align: center;
	overflow-x: hidden;
	position: relative;
}

.header__title::before,
.header__title::after {
	background: rgb(var(--wht));
	width: calc(50% - min(10.4rem, 8.125vw));
	height: 2px;
	position: absolute;
	top: 48%;
	transform: translateY(-50%);
	content: "";
}

.header__title::before {
	left: 0;
}

.header__title::after {
	right: 0;
}

.countdown__title {
	margin-bottom: min(4.2rem, 3.281vw);
	text-align: center;
	position: relative;
}

.countdown__title--inner {
	display: inline-block;
	position: relative;
}

.countdown__title img {
	width: min(50.8rem, 39.688vw);
}

.countdown__date {
	margin-bottom: min(2.5rem, 1.953vw);
	line-height: 1;
	font-size: min(2.4rem, 1.875vw);
	display: flex;
	justify-content: center;
	align-items: center;
}

.countdown__date--category {
	background: rgb(var(--nvy));
	margin-left: 0.5em;
	width: min(8rem, 6.25vw);
	height: min(2.5rem, 1.953vw);
	font-size: min(1.6rem, 1.25vw);
	font-weight: 500;
	border: solid 1px rgb(var(--wht));
	border-radius: min(2.5rem, 1.953vw);
	display: flex;
	justify-content: center;
	align-items: center;
}

.countdown__time {
	margin-bottom: min(9rem, 7.031vw);
	line-height: 1;
	font-size: min(1.8rem, 1.406vw);
	display: flex;
	justify-content: center;
	align-items: center;
}

.countdown__time--title {}

.countdown__time--detail {
	margin: 0 1em 0 0.5em;
}

.countdown__note {
	background: rgb(var(--wht));
	margin: 0 auto;
	width: min(48rem, 37.5vw);
	height: min(8rem, 6.25vw);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.countdown__note--text {
	color: rgb(var(--nvy));
	font-size: min(1.6rem, 1.25vw);
}

.countdown__note .note {
	color: rgb(var(--blk));
}

@media screen and (max-width: 768px) {
	.header {
		margin-top: 0;
		margin-bottom: 13.333vw;
		padding-top: 14.667vw;
	}

	.header__title {
		margin-bottom: 0;
		padding: 8.533vw 0;
		font-size: 6.4vw;
	}

	.header__title::before,
	.header__title::after {
		width: calc(50% - 18.667vw);
	}

	.countdown__title {
		margin-bottom: 8vw;
	}

	.countdown__title img {
		width: 80vw;
	}

	.countdown__date {
		margin-bottom: 6.933vw;
		font-size: 5.333vw;
	}

	.countdown__date--category {
		width: 21.333vw;
		height: 6.667vw;
		font-size: 4.267vw;
		border-radius: 6.667vw;
	}

	.countdown__time {
		margin-bottom: 8.533vw;
		line-height: 1.8;
		font-size: 4.267vw;
		text-align: center;
		display: block;
	}

	.countdown__time--detail {
		margin: 0;
	}

	.countdown__note {
		padding: 4vw 5.333vw;
		width: 85.333vw;
		height: auto;
	}

	.countdown__note--text {
		margin-bottom: 2.4vw;
		font-size: 4.267vw;
		text-align: center;
	}
}

/*
	decoration - countdown
------------------------------ */
.countdown__title::before {
	background-image: url(..//img/countdown/decoration01.webp);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	width: min(50.7rem, 39.609vw);
	height: min(18.5rem, 14.453vw);
	position: absolute;
	top: max(-1.6rem, -1.25vw);
	right: 63.125vw;
	content: "";
}

.countdown__title--inner::before,
.countdown__title--inner::after {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	content: "";
}

.countdown__title--inner::before {
	background-image: url(../img/ribbon01.webp);
	width: min(12.3rem, 9.609vw);
	height: min(9.8rem, 7.656vw);
	bottom: max(-4.4rem, -3.438vw);
	left: max(-9.7rem, -7.578vw);
}

.countdown__title--inner::after {
	background-image: url(../img/ribbon02.webp);
	width: min(11.3rem, 8.828vw);
	height: min(12.1rem, 9.453vw);
	top: max(-2.1rem, -1.641vw);
	right: max(-15.5rem, -12.109vw);
}

@media screen and (max-width: 768px) {
	.countdown__title::before {
		display: none;
	}

	.countdown__title--inner::before {
		width: 18.667vw;
		height: 15.467vw;
		bottom: -12vw;
		left: -8.8vw;
	}

	.countdown__title--inner::after {
		width: 15.467vw;
		height: 16.533vw;
		top: -8vw;
		right: -8vw;
	}
}

/* ---------------------------------------------------
  main
--------------------------------------------------- */
.main {
	color: rgb(var(--wht));
	overflow-x: hidden;
}

.main__kv {
	margin: 0 auto min(4.8rem, 3.75vw);
	width: min(80rem, 62.5vw);
	position: relative;
}

.main__kv img {
	position: relative;
	z-index: 2;
}

.main__lead {
	margin: 0 auto min(10.1rem, 7.891vw);
	width: min(80rem, 62.5vw);
	color: rgb(var(--wht));
	font-size: min(1.8rem, 1.406vw);
	text-align: center;
	position: relative;
}

@media screen and (max-width: 768px) {
	.main__kv {
		margin: 0 auto 10.667vw;
		width: 100%;
	}

	.main__lead {
		margin-bottom: 13.333vw;
		width: 100%;
		font-size: 4.267vw;
	}
}

/*
	decoration - main
------------------------------ */
.main__kv::before,
.main__kv::after {
	background: url(../img/countdown/decoration01.webp) center no-repeat;
	background-size: cover;
	position: absolute;
	z-index: 1;
	content: "";
}

.main__kv::before {
	width: min(45.4rem, 35.469vw);
	height: min(16.6rem, 12.969vw);
	right: max(-35.3rem, -27.578vw);
}

.main__kv::after {
	width: min(32.3rem, 25.234vw);
	height: min(11.8rem, 9.219vw);
	bottom: max(-21.2rem, -16.563vw);
	left: max(-9.2rem, -7.188vw);
}

.main__lead::before,
.main__lead::after {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	content: "";
}

.main__lead::before {
	background-image: url(../img/ribbon03.webp);
	width: min(13.5rem, 10.547vw);
	height: min(12.8rem, 10vw);
	top: max(-9.1rem, -7.109vw);
	left: max(-12.1rem, -9.453vw);
}

.main__lead::after {
	background-image: url(../img/ribbon04.webp);
	width: min(12.4rem, 9.688vw);
	height: min(11.1rem, 8.672vw);
	right: max(-11.2rem, -8.75vw);
	bottom: max(-9.3rem, -7.266vw);
}

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

	.main__kv::before,
	.main__kv::after,
	.main__lead::before,
	.main__lead::after {
		display: none;
	}
}

/* ---------------------------------------------------
  performer
--------------------------------------------------- */
.performer {
	margin: 0 auto min(9rem, 7.031vw);
	width: min(100rem, 78.125vw);
}

.performer__title {
	margin-bottom: min(4rem, 3.125vw);
	font-size: min(2.4rem, 1.875vw);
	text-align: center;
	overflow-y: hidden;
	position: relative;
}

.performer__title::before,
.performer__title::after {
	background: rgb(var(--wht));
	width: 50%;
	height: 2px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	content: "";
}

.performer__title::before {
	left: max(-7.5rem, -5.859vw);
}

.performer__title::after {
	right: max(-7.5rem, -5.859vw);
}

.performer__list {
	display: flex;
	flex-wrap: wrap;
	position: relative;
}

.performer__list--item {
	margin-bottom: min(5rem, 3.906vw);
}

.half .performer__list--item {
	width: min(47rem, 36.719vw);
}

.half .performer__list--item:not(:nth-child(even)) {
	margin-right: min(6rem, 4.688vw);
}

.trisection .performer__list--item {
	width: min(30rem, 23.438vw);
}

.trisection .performer__list--item:not(:nth-child(3n)) {
	margin-right: min(5rem, 3.906vw);
}

.performer__image {
	margin-bottom: min(2.5rem, 1.953vw);
	position: relative;
	z-index: 2;
}

.performer__content {
	position: relative;
	z-index: 2;
}

.performer__content--name {
	font-size: min(2.2rem, 1.719vw);
	font-weight: 500;
}

.performer__content--detail {
	font-size: min(1.6rem, 1.25vw);
}

@media screen and (max-width: 768px) {
	.performer {
		margin-bottom: 13.333vw;
		width: 85.333vw;
	}

	.performer__title {
		margin-bottom: 4.8vw;
		font-size: 5.333vw;
	}

	.performer__title::before {
		left: -16vw;
	}

	.performer__title::after {
		right: -16vw;
	}

	.performer__list {
		display: block;
	}

	.performer__list--item {
		margin-bottom: 8vw;
	}

	.half .performer__list--item,
	.trisection .performer__list--item {
		width: 100%;
	}

	.half .performer__list--item:not(:nth-child(even)),
	.trisection .performer__list--item:not(:nth-child(3n)) {
		margin-right: 0;
	}

	.performer__image {
		margin-bottom: 5.333vw;
	}

	.performer__content--name {
		margin-bottom: 3.2vw;
		line-height: 1.5;
		font-size: 5.867vw;
	}

	.performer__content--detail {
		font-size: 4.267vw;
	}
}

/*
	decoration - performer
------------------------------ */
.half.performer__list::before,
.half.performer__list::after,
.trisection.performer__list::before {
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: absolute;
	content: "";
}

.half.performer__list::after,
.trisection.performer__list::before {
	background-image: url(../img/countdown/decoration02.webp);
	width: min(42.4rem, 33.125vw);
	height: min(8.2rem, 6.406vw);
	left: min(81.5rem, 63.672vw);
}

.half.performer__list::before {
	background-image: url(../img/countdown/decoration01.webp);
	width: min(64.2rem, 50.156vw);
	height: min(23.4rem, 18.281vw);
	top: min(55rem, 42.969vw);
	right: min(58.3rem, 45.547vw);
}

.half.performer__list::after {
	top: min(11rem, 8.594vw);
}

.trisection.performer__list::before {
	top: max(-19rem, -14.844vw);
}

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

	.half.performer__list::before,
	.half.performer__list::after,
	.trisection.performer__list::before {
		display: none;
	}
}

/* ---------------------------------------------------
  stff
--------------------------------------------------- */
.staff {
	margin: 0 auto;
	padding-bottom: min(10rem, 7.813vw);
	width: min(100rem, 78.125vw);
	position: relative;
}

.staff__list {
	margin: 0 auto min(9rem, 7.031vw);
	width: min(68rem, 53.125vw);
	font-size: min(1.2rem, 0.938vw);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.staff__list--item::after {
	margin: 0 0.25em;
	content: "／";
}

.staff__list--item:nth-child(5):after,
.staff__list--item:last-of-type:after {
	margin: 0;
	content: "";
}

@media screen and (max-width: 768px) {
	.staff {
		padding-bottom: 18.133vw;
		width: 100%;
	}

	.staff__list {
		margin-bottom: 13.333vw;
		width: 85.333vw;
		font-size: 3.2vw;
	}

	.staff__list--item:nth-child(3):after,
	.staff__list--item:nth-child(5):after,
	.staff__list--item:last-of-type:after {
		margin: 0;
		content: "";
	}

	.staff .note {
		margin: 0 auto;
		width: 85.333vw;
	}
}

/*
	decoration - staff
------------------------------ */
.staff::before {
	background-image: url(../img/countdown/decoration01.webp);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	width: min(64.2rem, 50.156vw);
	height: min(23.4rem, 18.281vw);
	position: absolute;
	top: min(3.3rem, 2.578vw);
	left: min(47.4rem, 37.031vw);
	content: "";
}

@media screen and (max-width: 768px) {
	.staff::before {
		display: none;
	}
}