@charset "utf-8";

:root {
	--tickets01-cl01: #FF8645;
	--tickets01-cl02: #FFF7F2;
	--tickets02-cl01: #0B8CDB;
	--tickets02-cl02: #F2FAFF;
	--tickets03-cl01: #22B85D;
	--tickets03-cl02: #F0FCF5;
	--tickets04-cl01: #9877E0;
	--tickets04-cl02: #F8F5FF;
	--tickets05-cl01: #00B9C4;
	--tickets05-cl02: #F0FCFC;
	--tickets00-cl-fin: #8d8d8d;
}

#tickets {
	padding-top: 50px;
}
#tickets.element-box {
	width: 100%;
}
/* _____ 835px 以上 _____ */
@media (min-width: 835px) {
	#tickets {
		padding-top: 130px;
	}
	#tickets.element-box {
		max-width: 900px;
	}
}



.tickets-top-txt {
	text-align: center;
	font-weight: bold;
	margin-bottom: 20px;
}
/* _____ 835px 以上 _____ */
@media (min-width: 835px) {
	.tickets-top-txt {
		font-size: 20px;
		margin-bottom: 40px;
	}
}



.tickets-navi {
	font-size: 0;
	padding-bottom: 16px;
	text-align: center;
}
.tickets-navi-title {
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 8px;
}
.tickets-navi-title .note {
	font-weight: 500;
	font-size: 12px;
}
.tickets-navi a {
	border-radius: 8px;
	font-size: 14px;
	padding: 10px 15px;
	background-color: #fff;
	color: #fff;
	position: relative;
	display: table;
	text-decoration: none;
	margin: auto;
	margin-bottom: 16px;
}
.tickets-navi a:last-child {
	margin-bottom: 0;
}
.tickets-navi a span {
	display: table-cell;
  vertical-align: middle;
}
.tickets-navi .tickets01 {background-color: var(--tickets01-cl01);}
.tickets-navi .tickets02 {background-color: var(--tickets02-cl01);}
.tickets-navi .tickets03 {background-color: var(--tickets03-cl01);}
.tickets-navi .tickets04 {background-color: var(--tickets04-cl01);}
.tickets-navi .tickets05 {background-color: var(--tickets05-cl01);}
/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.tickets-navi a {
		width: 75%;
		max-width: 470px;
		margin: auto;
		margin-bottom: 10px;
	}
	.tickets-navi a:last-child {
		margin-bottom: 0px;
	}
}
/* _____ 835px 以上 _____ */
@media (min-width: 835px) {
	.tickets-navi {
		font-size: 0;
		padding-bottom: 24px;
	}
	.tickets-navi-title {
		font-size: 20px;
		padding-bottom: 8px;
	}
	.tickets-navi-title .note {
		font-size: 13px;
	}
	.tickets-navi a {
		padding: 16px 10px;
		font-size: 16px;
		width: 530px;
		transition: .3s ease-out;
	}
	.tickets-navi a:hover {
		opacity: .5;
	}
}



.prive-box {
	width: 90%;
	margin: auto;
}
/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.prive-box {
		max-width: 650px;
	}
}



.prive-box {
	text-align: center;
	font-size: 0;
	margin-top: 30px;
	font-weight: bold;
}
.prive-box p {
	font-size: 20px;
	margin-bottom: 8px;
}

/* _____ 835px 以上 _____ */
@media (min-width: 835px) {
	.prive-box p {
		font-size: 28px;
		margin-bottom: 16px;
	}
}



.tickets-bg {
	margin: 30px auto 45px;
	padding: 15px 0;
	background-color: rgba(255, 255, 255, .7);
}
.tickets-bg .main-tickets {
	text-align: center;
	font-size: 20px;
	font-weight: bold;
	margin-bottom: 15px;
}
.item-box {
	width: 90%;
	margin: auto;
}
.item-box:last-child {
	margin-bottom: 0;
}
.item {
	padding: 20px 0;
}
.tickets-bg .tickets-title {
	color: #fff;
	font-weight: bold;
	font-size: 16px;
	padding: 15px;
}
.tickets-bg #tickets01 .tickets-title {background-color: var(--tickets01-cl01);}
.tickets-bg #tickets02 .tickets-title {background-color: var(--tickets02-cl01);}
.tickets-bg #tickets03 .tickets-title {background-color: var(--tickets03-cl01);}
.tickets-bg #tickets04 .tickets-title {background-color: var(--tickets04-cl01);}
.tickets-bg #tickets05 .tickets-title {background-color: var(--tickets05-cl01);}
#tickets01 .item {border: var(--tickets01-cl01) 2px solid;border-top: none;}
#tickets02 .item {border: var(--tickets02-cl01) 2px solid;border-top: none;}
#tickets03 .item {border: var(--tickets03-cl01) 2px solid;border-top: none;}
#tickets04 .item {border: var(--tickets04-cl01) 2px solid;border-top: none;}
#tickets05 .item {border: var(--tickets05-cl01) 2px solid;border-top: none;}
.item {
	background-color: #fff;
}
#tickets01 div.wrap.bg {background-color: var(--tickets01-cl02);}
#tickets02 div.wrap.bg {background-color: var(--tickets02-cl02);}
#tickets03 div.wrap.bg {background-color: var(--tickets03-cl02);}
#tickets04 div.wrap.bg {background-color: var(--tickets04-cl02);}
#tickets05 div.wrap.bg {background-color: var(--tickets05-cl02);}

.tickets-bg div.wrap.bg {
	margin-bottom: 16px;
	padding: 20px 0;
}
.tickets-bg div.wrap.bg:last-child {
	margin-bottom: 0;
}
.wrap {
	width: 95%;
	margin: auto;
}
.item .contents {
	font-weight: normal;
}
.item .price {
	font-weight: bold;
}
.wrap.note01 a {
	text-decoration: underline;
}
/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.tickets-bg div.wrap.bg {
		font-size: 14px;
	}
	.item-box {
		margin-bottom: 25px;
		max-width: 650px;
	}
	.tickets-bg .item .price.wrap.bg {
		font-size: 16px;
	}
	.tickets-bg .item .price.wrap.bg span {
		font-size: 14px;
	}
	.item .detail ul li {
		/* padding-left: 5.3em;
		text-indent: -5.3em; */
	}
	.item .detail ul li ~ li {
		margin-top: 0.5em;
	}
	.item .notice {
		font-size: 12px;
	}
	.wrap .wrap {
		width: 90%;
		margin: auto;
	}
}
.tickets-bg div.wrap.bg.fin {
	margin-top: 20px;
}
.tickets-bg div.wrap.bg.fin .txt-cancel {
	text-decoration: line-through;
	color: #999;
}
/* _____ 835px 以上 _____ */
@media (min-width: 835px) {
	.tickets-bg {
		margin: 60px auto 90px;
		padding: 30px 0;
	}
	.tickets-bg .main-tickets {
		font-size: 28px;
		margin-bottom: 30px;
	}
	.item-box {
		max-width: 800px;
		margin-bottom: 50px;
	}
	.tickets-bg .tickets-title {
		font-size: 24px;
		padding: 30px;
	}
	.item {
		padding: 50px 0;
	}
	.tickets-bg div.wrap.bg {
		margin-bottom: 16px;
		padding: 20px 0;
	}
	.item .price {
		font-size: 20px;
	}
	.item .price span {
		font-size: 16px;
	}
	.wrap {
		width: 90%;
	}
	.wrap.note01 a:hover {
		text-decoration: none;
	}
}

.novelty .title {
	font-weight: bold;
	margin-top: 20px;
}
.novelty-item {
	display: grid;
	align-items: baseline;
	grid-template-columns: auto 1fr;
	gap: 0.5em;
	line-height: 2.2;
	font-weight: 500;
}
.novelty-item:before {
	content: "";
	width: 0.75em;
	height: 0.75em;
	background-color: #333;
}
.novelty-img {
	padding: 5px 0;
}
.novelty-img.grid {
	font-size: 0;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 10px;
	width: 100%;
}
.novelty .border {
	display: inline-block;
	border: 1px solid;
	padding: 5px;
	margin: 5px 0;
}
.novelty .border .note01.txt-indent02 {
	padding-left: 2em;
}
#tickets02 .novelty .border p {
	font-size: 14px;
}
.novelty-spec {
	font-weight: bold;
	margin: 10px 0 5px;
}
.novelty-spec-list {
	font-size: 12px;
}
.novelty-spec-list li {
	margin: 10px 0;
}
@media (min-width: 835px) {
	.novelty-img.grid {
		grid-template-columns: 1fr 1fr 1fr 1fr;
		gap: 16px;
		max-width: 560px;
	}
	.novelty-spec {
		margin: 20px 0 10px;
	}
	.novelty-spec-list {
		font-size: 14px;
	}
	.novelty-img-popup {
		transition: .3s ease-out;
	}
	.novelty-img-popup:hover {
		opacity: .5;
	}
}



.tickets-link {
	text-align: center;
	margin-bottom: 30px;
}
.tickets-link a {
	display: inline-block;
	color: #fff;
	font-weight: bold;
	border-radius: 8px;
	padding: 10px 15px;
}
#tickets01 .tickets-link a {background-color: var(--tickets01-cl01);}
#tickets02 .tickets-link a {background-color: var(--tickets02-cl01);}
#tickets03 .tickets-link a {background-color: var(--tickets03-cl01);}
#tickets04 .tickets-link a {background-color: var(--tickets04-cl01);}
#tickets05 .tickets-link a {background-color: var(--tickets05-cl01);}

#tickets01 .tickets-link.fin a, #tickets02 .tickets-link.fin a, #tickets03 .tickets-link.fin a, #tickets04 .tickets-link.fin a, #tickets05 .tickets-link.fin a {background-color: var(--tickets00-cl-fin);pointer-events: none;}

@media (min-width: 835px) {
	.tickets-link a {
		font-size: 20px;
		padding: 16px 24px;
		position: relative;
	}
	.tickets-link a span {
		position: relative;
		z-index: 1;
	}
	#tickets .ripple:before, #tickets .ripple:after {
		z-index: 0;
	}
	.tickets-link a:hover {
		text-decoration: none;
	}
	#tickets01 .tickets-link.fin .ripple:before, #tickets01 .tickets-link.fin .ripple:after, #tickets02 .tickets-link.fin .ripple:before, #tickets02 .tickets-link.fin .ripple:after, #tickets03 .tickets-link.fin .ripple:before, #tickets03 .tickets-link.fin .ripple:after, #tickets04 .tickets-link.fin .ripple:before, #tickets04 .tickets-link.fin .ripple:after, #tickets05 .tickets-link.fin .ripple:before, #tickets05 .tickets-link.fin .ripple:after {
		background-color: unset;
	}

	#tickets01 .tickets-link .ripple:before, #tickets01 .tickets-link .ripple:after {background-color: var(--tickets01-cl01);}
	#tickets02 .tickets-link .ripple:before, #tickets02 .tickets-link .ripple:after {background-color: var(--tickets02-cl01);}
	#tickets03 .tickets-link .ripple:before, #tickets03 .tickets-link .ripple:after {background-color: var(--tickets03-cl01);}
	#tickets04 .tickets-link .ripple:before, #tickets04 .tickets-link .ripple:after {background-color: var(--tickets04-cl01);}
	#tickets05 .tickets-link .ripple:before, #tickets05 .tickets-link .ripple:after {background-color: var(--tickets05-cl01);}
}
.seating-chart p {
	font-weight: bold;
}
.seating-chart img {
	padding: 5px 0;
	max-width: 460px;
	width: 100%;
}


.tickets-notice {
	max-width: 800px;
	width: 90%;
	margin: auto;
}
.tickets-notice h3 {
	padding: 20px 0 5px;
	border-bottom: 2px #333333 solid;
	font-weight: bold;
}
.tickets-notice .note01.top {
	padding-top: 15px;
}
.tickets-notice .note01 {
	font-size: 14px;
	padding-top: 10px;
	line-height: 1.8;
	letter-spacing: 0;
}
.tickets-notice .main01 {
	padding-top: 20px;
}
.tickets-notice .note01 a {
	text-decoration: underline;
}
/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.tickets-notice {
		width: 90%;
		margin: auto;
		max-width: 650px;
	}
}
@media (min-width: 835px) {
	.tickets-notice h3 {
		padding: 40px 0 10px;
		border-bottom: 4px #333333 solid;
	}
	.tickets-notice .note01.top {
		padding-top: 30px;
	}
	.tickets-notice .note01 {
		font-size: 16px;
		padding-top: 15px;
		line-height: 2;
		letter-spacing: .2px;
	}
	.tickets-notice .main01 {
		font-size: 20px;
		padding-top: 40px;
	}
}



.tickets-btn {
	position: fixed;
	width: 128px;
	height: 84px;
	bottom: 15px;
	right: 15px;
	font-size: 0;
}
.tickets-btn.on {
	position: absolute;
	bottom: 60px;
	right: 15px;
}
/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.tickets-btn {
		position: fixed;
		width: 80px;
		height: 51px;
	}
}
@media (min-width: 835px) {
	.tickets-btn.on {
		position: absolute;
		bottom: 90px;
		right: 15px;
	}
	.tickets-notice a:hover {
		text-decoration: none;
	}

}


/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.mfp-content {
		width: 60%;
		margin: auto;
	}
}

.novelty-img.grid.tickets0103-novelty {
	max-width: 592px;
}

.tickets-novelty02,.tickets-novelty03 {
	max-width: 280px;
	width: 100%;
}
/* _____ 834px 以下 _____ */
@media not (min-width: 835px) {
	.tickets-novelty02,.tickets-novelty03 {
		width: 70%;
	}
}