@charset "utf-8";
#bg1{
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	height: 100lvh;
	background-image: url("../img/bg/bg_venue.jpg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: 50% 100%;
	z-index: -1;
}

/* event */
#event{
	position: relative;
	margin:  0 auto;
	padding: 40px 0 60px 0;
}
#event h2{margin: 0 auto 40px auto;}
#event .areaWrap{
	position: relative;
	margin: 0 auto;
	width: 90%;
	max-width: 800px;
	text-align: center;
}
#event .areaWrap .area{
	position: relative;
	margin: 0 auto;
	font-size: 180%;
	line-height: 1em;
	color: #FFEF00;
}
#event .areaWrap .area span{
	display: block;
	font-size: 60%;
}
#event .areaWrap .kikan{
	position: relative;
	margin: 10px auto 0 auto;
	font-size: 120%;
}

#event .detail{
	position: relative;
	margin: 15px auto 0 auto;
	padding: 30px 15px;
	width: calc(100% - 64px);
	max-width: 800px;
	outline: solid 2px #ffffff;
	background-color: rgba(0,0,0,0.5);
	text-align: center;
}
#event .detail .shop{
	position: relative;
	margin: 0 auto;
	font-size: 120%;
}
#event .detail .shop a{color: #ffffff;font-size: 80%;}
#event .detail h3{
	position: relative;
	margin: 30px auto 5px auto;
	font-size: 86%;
	color: #FFEF00;
}
#event .detail .text{
	position: relative;
	margin: 0 auto;
	font-size: 86%;
}
#event .detail .host{
	position: relative;
	margin: 40px auto 0 auto;
}
#event .detail .caution.access{margin: 10px auto 0 auto;}
#event .detail .caution.access p{font-size: 90%;}

#event .detail .map{
	position: relative;
	margin: 20px auto 0 auto;
	height: 240px;
	width: 100%;
	outline: solid 2px #FFEF00;
}
#event .detail .map iframe{
	position: relative;
	max-width: 100%;
	height: 240px;
	vertical-align:bottom;
}

/* buy */
#event #buy{
	position: relative;
	margin: 0 auto;
	padding-top: 60px;
	font-size: 100%;
}
#event #buy h2{
	margin: 20px auto 30px auto;
	width: 90%;
	max-width: 560px;
}
#event #buy h3{
	position: relative;
	margin: 20px auto 5px auto;
}
#event #buy .ticket7{
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 450px;
	display: block;
	opacity: 0.4;
	pointer-events: none;
}
#event #buy .margin.text{padding-bottom: 20px;}

/* release */
#event #release{
	position: relative;
	margin: 0 auto;
	padding-top: 60px;
}
#event #release h2{margin: 0 auto 30px auto;}
#event #release dl{position: relative;}
#event #release dl dt{
	position: relative;
	margin: 0 auto;
	padding: 7px 0;
	font-size: 90%;
	line-height: 1em;
	background-image: url("../img/bg/bg_yellow.png");
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-size: cover;
	text-align: center;
	color: #000000;
}
#event #release dl dd{
	position: relative;
	margin: 0 auto;
	text-align: center;
	padding: 10px 0 20px 0;
	font-size: 96%;
}
#event #release dl dd .btn{cursor: pointer;}

#event .areaWrap .area.ev{line-height: 1.6em;}
#event .areaWrap .photo{
	position: relative;
	margin: 30px auto 60px auto;
	width: calc(100% - 4px);
	max-width: 800px;
	outline: solid 2px #ffffff;
	background-color: rgba(0,0,0,0.5);
}
#event .areaWrap .photo .Img{
	position: relative;
	margin: 0;
	width: 100%;
	font-size: 60%;
}
#event .areaWrap .photo .Txt{
	position: relative;
	margin: 0;
	padding: 20px;
	width: calc(100% - 40px);
	text-align: left;
}
#event #point{margin: 0 auto;}
#event #point h2{margin: 0 auto;}
#event #point ul{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 20px);
}
#event #point ul li{
	position: relative;
	margin: 0;
	width: 100%;
}
#event #point ul li .Img{
	position: relative;
	margin: 0;
	z-index: 10;
}
#event #point ul li .Txt{
	position: relative;
	margin: 0;
}
#event #point ul li .Txt p{
	position: relative;
	margin: 0;
	background-color: rgba(49,30,80,0.7);
	padding: 20px 20px 20px 50px;
	transform: translateX(-40px);
	width: calc(100% - 40px);
}
#event #point ul li:nth-child(1) .Img{width: 20%;}
#event #point ul li:nth-child(1) .Txt{width: 80%;}
#event #point ul li:nth-child(2) .Img{width: 40%;}
#event #point ul li:nth-child(2) .Txt{width: 60%;}
#event #point ul li:nth-child(2) .Txt p{padding: 20px 50px 20px 20px;transform: translateX(20px);}
#event #point ul li:nth-child(3) .Img{width: 20%;}
#event #point ul li:nth-child(3) .Txt{width:80%;}

#event #release.ev{margin: 0 auto 60px auto; width: calc(100% - 40px);max-width: 760px;}
#event #release.ev dl{background-color: rgba(0,0,0,0.5);}
#event #release dl dd p{padding-top: 10px;}
#event #release dl dd .scraptantei{
	position: relative;
	margin: 0 auto;
	max-width: 400px;
}
#event #release dl dd .scraptantei p{font-size: 70%;}
#event .table{background-color: rgba(0,0,0,0.5);}
#event .btn_ticCaution{cursor: default;}
#event .ticCautiond{
	position: relative;
	margin: 0 auto;
	padding: 10px 15px;
	outline: solid 1px #FFEF00;
	outline-offset: -1px;
	background-color: rgba(0,0,0,0.5);
}
#event .ticCautiond p, #event .ticCautiond div{
	position: relative;
	margin: 0 auto 5px auto;
	padding-left: 1em;
	font-size: 90%;
	line-height: 1.6em;
	color: #ffffff;
}
#event .ticCautiond p a{color: #ffffff;}
#event .ticCautiond p::before{
	position: absolute;
	top:0;
	left: 0;
	content: '・';
}
#event .ticCautiond div{padding-left: 1em;}
#event .lead{
	position: relative;
	margin: 30px auto 0 auto;
	width: calc(100% - 40px);
	text-align: center;
}
#event .lead.l01{margin: 0 auto 30px auto;}

/* チケットカレンダー */
.sTicket ul li{background-image: none !important;}
.ticAPI{position: relative;margin: 0 auto;width: 100%;padding: 0;background-color: #ffffff;}
.ticket_api{margin: 0 auto;padding: 0;width: 100%; background-color: #FFEF00;}
.ticketWrap{ margin: 0 auto; background-color: transparent !important;  padding:20px 0 0 0; font-size: .12rem !important; color:#232323;}
.ticketWrap .swiper-wrapper{padding: 0;}
.ticketWrap .naviBox {margin:  0 53px 0 53px;}
.ticketWrap .naviBox .prevBtn{top: 20px;left: 0; background-color: #ffffff; opacity: 1;}
.ticketWrap .naviBox .nextBtn{top: 20px;right: 0; background-color: #ffffff; opacity: 1;}
.ticketWrap .naviBox .prevBtn:hover, .ticketWrap .naviBox .nextBtn:hover{opacity: 1;}
.ticketWrap .naviBox ul li{margin: 0 1px !important;border: none;}
.ticketWrap .naviBox ul li .scheduleBox{color:#232323;}
.ticketWrap .naviBox ul li.cr .scheduleBox {background: #234A99; color:#ffffff !important;}
.ticketWrap .naviBox ul li.cr .scheduleBox span span{color:#ffffff !important;}
.ticketWrap .detailsWrap {padding-top: 20px;min-height: 190px;}
.ticketWrap .detailsBox .tit {background-color: #234A99;font-size: .14rem !important;color:#ffffff !important;}
.ticketWrap .detailsBox .tit p{margin: 0 !important;}
.ticketWrap .detailsBox .tit01 {font-size: .18rem !important;}
.ticketWrap .detailsBox .details h4 {max-width: 100% !important; margin: 30px 0; color:#000000 !important;border-bottom: 2px solid #000000; background-image: none;font-size: .13rem !important;text-align: center;font-weight: 700;}
.ticketWrap .detailsBox .details a.scrap {color: #004C97; font-size: .12rem;font-weight: normal;}
.ticketWrap .detailsBox .details a.scrap:after {border-top: solid 1px #004C97;border-right: solid 1px #004C97; width: 5px; height: 5px;margin: -3px 0 0 0px;}
.ticketWrap .detailsBox .details ul li .scheduleBox.present {background: #ffffff; border: solid 1px #b3b3b3;color: #2a2a2a;}
.ticketWrap .detailsBox .details ul li .scheduleBox.sold {background: #b3b3b3; color:#969696; border: solid 1px #b3b3b3;}
.ticketWrap .detailsBox .details ul li .scheduleBox.few {background: #fbfdc2; border: solid 1px #b3b3b3;color: #2a2a2a;}
.ticket_api .note {margin: 0 auto !important;color:#232323; padding: 20px; background-color: #ffffff;}
.ticket_api .note a {color:#cf1009;}
.ticketWrap .detailsBox .details .ticketBox .ticketItem p {color:#232323;}
.ticketWrap .detailsBox .details ul li .scheduleBox .time {font-size: .13rem;}
.ticketWrap .detailsBox .details ul li .scheduleBox .state {font-size: .12rem;}
._scheduler_container{margin-bottom: 0;padding-bottom: 10px;color: #1b262c !important;}
._scheduler_container h3{color: #1b262c !important;}
.ticketWrap .detailsBox .details .other_events a{width: 93%;}

/* ----- pc ----- */
@media screen and (min-width: 641px) {
	#bg1{background-position: 50% 80%;}
	
	/* event */
	#event{padding: 60px 0 80px 0;}
	#event h2{margin: 0 auto 60px auto;}
	#event .areaWrap .shop{font-size: 100%;}
	#event .areaWrap .shop a{font-size: 86%;}

	#event .detail{
		margin: 25px auto 0 auto;
		padding: 50px 80px;
	}
	#event .detail .shop{font-size: 100%;}
	#event .detail h3{
		margin: 40px auto 5px auto;
		font-size: 76%;
	}
	#event .detail .text{
		font-size: 80%;
		line-height: 1.7em;
	}
	#event .detail .host{margin: 50px auto 0 auto;}
	#event .detail .map{
		margin: 40px auto 50px auto;
		height: 380px;
	}
	#event .detail .map iframe{height: 380px;}

	/* release */
	#event #release{padding-top: 100px;}
	#event #release h2{max-width: 500px; margin: 0 auto 40px auto;}
	#event #release dl dt{padding: 8px 0;}
	#event #release dl dd{padding: 20px 0 40px 0;}

	#event .areaWrap .photo .Txt{
		padding: 40px;
		width: calc(100% - 80px);
	}
	
	#event #point{margin: 100px auto 70px auto;}
	#event #point ul li{width: 70%;}
	#event #point ul li:nth-child(1){margin: -40px 0 0 -12%;}
	#event #point ul li:nth-child(2){margin: -120px -15% 0 0;}
	#event #point ul li:nth-child(3){margin: -40px 0 0 -12%;}

	#event #release.ev{margin: 0 auto 120px auto; }
	#event .lead{font-size: 90%;}
}