@charset "utf-8";

/* CMモーダル */
.cmmodal {
	position: fixed;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	text-align: center;
	z-index: 1500;
	overflow-y: auto;
	background-color: rgba(255,255,255,.8)
}
.bgcm {
    position: absolute;
	left: 50%;
	top: 50%;
	width: calc(100% - 10px);
	transform: translate(-50%, -50%);
    z-index: 1501;
 }
.closecm{
	position: fixed;
	top:0;
	right: 0;
	width: 70px;
}

/* catch */
#catch{
	position: relative;
	padding: 10px 5px 10px 10px;
	background-image: url("../img/bg_catch.png");
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-size: 100% auto;
}

.closed{
	position: relative;
	margin: 0 auto;
	padding: 10px 20px;
	background-color: #002D68;
	color: #ffffff;
	text-align: center;
}

/* ヘッダー */
header{
	position: relative;
	margin: 0 auto ;
	display: block;
	width: 100%;
}
header #keyvisual{
	position: relative;
	margin: 0 auto ;
	display: block;
	background-image: url("../img/main.jpg");
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-size: contain;
	padding-top: 141.406%;
	width: 100%;
}

/* photo */
#photo{
	position: relative;
	padding: 3px 0;
}
#photo .photoWrap{
	position: relative;
	margin: 0 auto ;
}
#photo .slick-slide{margin: 0 2px; background-color: transparent;}

.eventtic{
	position: relative;
	margin: 0 auto;
	background-color: #ffffff;
	padding: 10px 0 0 0;
	text-align: center;
}
.eventtic img{
	position: relative;
	margin: 10px auto;
	width: calc(100% - 60px);
	border: solid 2px #1151a8;
}
.eventtic a{text-decoration: underline;}

/* ストーリー */
#story{
	position: relative;
	margin:0 auto;
	padding: 20px 0 0 0;
	background-image: url("../img/bg_story.jpg");
	background-repeat: no-repeat;
	background-position: 95% 0;
	background-size: auto calc(100% - 40px);
}
#story::after{
	position: absolute;
	content: '';
	display: block;
	bottom:-200px;
	left: 0;
	width: 100%;
	height: 250px;
	background: -webkit-linear-gradient(bottom, rgba(255,255,255,0), #ffffff);
	background: -o-linear-gradient(bottom,  rgba(255,255,255,0),  #ffffff);
	background: linear-gradient(to bottom,  #ffffff, rgba(255,255,255,0));
}
#story .storyWrap{
	position: relative;
	margin:-40px auto 0 auto;
	padding: 0 0 60px 0;
	background-image:  url("../img/bg_aboutgame.png"),  url("../img/bg_story01.png");
	background-repeat: no-repeat, no-repeat;
	background-position:0 100%, 50% 0;
	background-size: 29% auto, cover;
	z-index: 1;
}
#story p{
	position: relative;
	padding: 60px 20px 0 20px;
	line-height: 2em;
	text-align: center;
	font-size: .15rem;
}
#story .more{
	opacity: 0;
	height: 0;
	overflow: hidden;
	transition: all .3s ease-out;
}
#story .more p{padding: 10px 20px 0 20px;}
#story .more.disp{opacity: 1;height: auto;}
#story .btn_more{
	position: relative;
	margin: 30px auto;
	text-align: center;
	padding: 7px 0;
	z-index: 20;
	width: 150px;
	background-color: #ffffff;
	color: #46a3ef;
	font-weight: 700;
	border-radius: 100px;
	line-height: 1em;
}
#story .btn_more::after{
	position: absolute;
	top:0;
	right: 10px;
	content: '';
	display: block;
	width: 10px;
	height: 100%;
	background-image: url("../img/arrow.png");
	background-repeat: no-repeat;
	background-position:50% 50%;
	background-size: contain;
	transition: all .3s ease-out;
}
#story .btn_more.attClose::after{transform: scale(1,-1);}

/* 特徴 */
#aboutgame{
	position: relative;
	margin:-30px auto 0 auto;
	padding: 25px 0 20px 0;
	background-image:url("../img/bg_ttl_faq_list.png");
	background-repeat: no-repeat;
	background-position: 10% 0;
	background-size: 19% auto;
}
#aboutgame .aboutgame{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 40px);
	text-align: center;
}
#aboutgame .escape{
	position: relative;
	margin: 30px auto 0 auto;
}
#aboutgame .escape .ttl{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 10px);
	z-index: 30;
}
#aboutgame .escape .aboutImage{
	position: relative;
	margin: -20px auto 0 auto;
	width: calc(100% - 60px);
}
#aboutgame .escape p{
	position: relative;
	margin: 0 20px 0 auto;
	width: 60%;
}

/* 特徴 */
#event{
	position: relative;
	margin: 0 auto;
	padding: 20px 0 0 0;
	z-index: 3;
}
#event::after{
	position: absolute;
	content: '';
	display: block;
	top: -110px;
	left: -50px;
	width: 63%;
	height: 100%;
	background-image: url("../img/bg_event.png");
	background-repeat: no-repeat;
	background-position:0 0;
	background-size: contain;
}
#event ul{
	position: relative;
	margin: -10px auto 0 auto;
	padding: 0;
}
#event ul li{
	position: relative;
	padding: 0;
	margin: 0;
	overflow: visible;
}
#event ul li .pointImg{
	position: relative;
	margin: 0 0 0 auto;
	width: calc(100% - 62px);
}
#event ul li:nth-child(2) .pointImg{width: calc(100% - 50px);margin: -10px auto 0 0;}
#event ul li:nth-child(3) .pointImg{width: calc(100% - 20px);}
#event ul li .pointTxt{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 15px);
}
#event ul li .pointTxt .ttl{
	position: relative;
	padding: 10px 15px;
	color: #1151a8;
	font-weight: 900;
	font-size: .18rem;
	background-image: url("../img/bg_ttlpoint.png");
	background-repeat: no-repeat;
	background-position:0 100%;
	background-size: auto 60%;
}
#event ul li:nth-child(1) .pointTxt .ttl{margin: -30px 0 0 0;}
#event ul li:nth-child(2) .pointTxt .ttl{text-align: right;background-position:100% 100%;margin: -30px 0 0 0;}
#event ul li:nth-child(3) .pointTxt .ttl{margin: -20px 0 0 0;}
#event ul li .pointTxt .txt{
	position: relative;
	margin: 0;
	padding: 0 15px;
}

/* about */
#about{
	position: relative;
	margin: 0 auto;
}
#about .aboutWrap{
	position: relative;
	margin: 0 auto;
	padding: 15px 0 150px 0;
	background-image: url("../img/bg_banner.png");
	background-repeat: no-repeat;
	background-position:50% 100%;
	background-size: 220% auto;
}
#about ul{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 40px);
}
#about ul li{
	position: relative;
	margin: 0 auto;
	padding: 20px 0 0 0;
}
#about ul li img{width: 100%;}
#about ul li.btn{
	margin: 0;
	width: calc(50% - 5px);
}

/* キャラクター */
#charactor{
	position: relative;
	margin: -90px auto 0 auto;
}
#charactor .contetsWrap{width: 100%;}
#charactor .chara{
	position: relative;
	margin:-2px auto 0 auto;
	padding: 0;
	width: 100%;
}
#charactor .chara .slick-slide{margin: 0 !important;background-color: transparent;}
#charactor .chara .slick-slide div{
    position: relative;
    width: 100%;
    margin: 0 auto;
}
#charactor .chara .slick-dots{width: calc(100% - 20px);margin: 20px auto 0 auto; text-align: center;padding: 0;}
#charactor .chara .slick-dots li{ width: calc(33% - 10px);margin: 0 5px;height: auto !important;}
#charactor .chara .slick-dotted.slick-slider{margin-bottom: 0;}
#apDotsC{
	position: relative;
	bottom: 0;
	left: 0;
    width: 100%;
}
#charactor .slick-disabled{display: none !important;}

/* プレイ形式 */
#play{
	position: relative;
	margin: 40px auto 0 auto;
	padding-bottom: 80px;
	background-image: url("../img/bg_point01.png"), url("../img/bg_point02.png");
	background-repeat: no-repeat, no-repeat;
	background-position: 0 0, 100% 62%;
	background-size: 50% auto, 64% auto;
}
#play ul{
	position: relative;
	margin:-40px auto 0 auto;
	width: 100%;
	border: none;
	padding: 0;
}
#play ul li{
	position: relative;
	padding: 0;
	margin: 0;
	width: calc(32% - 2px) !important;
}
#play ul li:nth-child(2){margin: 55px 0 0 0;}
#play ul li:nth-child(3){margin: 95px 0 0 0;}
#play ul li:nth-child(4){margin: -55px 0 0 0;}
#play ul li:nth-child(6){margin: 40px 0 0 0;}
#play .btn_howto{
	position: relative;
	display: block;
	margin: 30px auto 0 auto;
	width: calc(100% - 40px);
}

/* ニュース */
#news{
    position: relative;
	margin: -60px auto 0 auto;
	padding-bottom: 40px;
}
#news .newsWrap{position: relative;margin: 0 auto;}
#news .newsBox{
	position: relative;
	margin:  0 auto;
	width: calc(100% - 80px);
	background-color: #ffffff;
	border: solid 1px #01c0fa;
	padding: 20px;
	z-index: 10;
}
#news .newsBox ul{
	position: relative;
	margin:0 auto;
	height: 180px;
    overflow: hidden;
}
#news .newsBox ul li{
	position: relative;
	margin:0 auto 10px auto;
    padding: 0 0 5px 0;
	color: #141f00;
	line-height: 1.6em;
	border-bottom: solid 1px #00bef9;
}
#news .newsBox ul li .date{
	color: #0eac8c;
	font-weight: 700;
}
#news .newsBox ul li a{font-weight: 500;}


/* チケット */
#ticket{
	position: relative;
	margin:0 auto;
}
#ticket .price{
	position: relative;
	margin: -135px auto 0 auto;
	padding: 180px 0 60px 0;
/*	background-image: url("../img/bg_ticket-2.png"), url("../img/bg_ticket.png");
	background-repeat: no-repeat, no-repeat;
	background-position: -20px 0, calc(100% + 20px) 100%;
	background-size: 54% auto, 60% auto;*/
	background-image: url("../img/bg_ticket-2.png");
	background-repeat: no-repeat;
	background-position: -20px 0;
	background-size: 54% auto;
	z-index: 11;
}
#ticket .price ul {
	position: relative;
	width: calc(100% - 40px);
	margin: 0 auto;
	opacity: 0;
	height: 0;
	overflow: hidden;
	transition: all .3s ease-out;
}
#ticket .price ul.disp{opacity: 1;height: auto;margin: -15px auto 0 auto; border: solid 1px #82BBEA; padding: 40px 0 20px 0;}
#ticket .price ul li{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 40px);
}
#ticket .price ul li{
	position: relative;
	padding: 0 0 5px 1.2em;
}
#ticket .price ul li::before{
	position: absolute;
	content: '※';
	left: 0;
}
#ticket .btn_ticcaution{
	position: relative;
	margin: 20px auto 0 auto;
	text-align: center;
	padding: 9px 0;
	z-index: 20;
	width: 260px;
	background-color: #82BBEA;
	color: #ffffff;
	font-weight: 700;
	border-radius: 100px;
	line-height: 1em;
}
#ticket .btn_ticcaution::after{
	position: absolute;
	top:0;
	right: 10px;
	content: '';
	display: block;
	width: 10px;
	height: 100%;
	background-image: url("../img/arrow01.png");
	background-repeat: no-repeat;
	background-position:50% 50%;
	background-size: contain;
	transition: all .3s ease-out;
}
#ticket .btn_ticcaution.attClose::after{transform: scale(1,-1);}
#ticket .priceBox{
	position: relative;
	margin: 20px auto 0 auto;
}
#ticket .priceBox .table{
	position: relative;
	margin: 0 auto;
	width: calc(100% - 40px);
	display: none;
}
#ticket .priceBox .table table{
	position: relative;
	margin: 0 auto;
	border-collapse: collapse !important;
	border-spacing:1px;
	border: solid 1px #18305a;
}
#ticket .priceBox .table.active{display: block;}
#ticket .priceBox table th{
	width: 15%;
	text-align: center;
	vertical-align: middle;
	line-height: 1.4em;
	padding: 5px;
	font-size: .12rem;
	border: solid 1px #18305a;
	background-color:#b4c6df;
}
#ticket .priceBox table th.trans{background-color: #18305a;color: #ffffff;}
#ticket .priceBox table td{
	width: 25%;
	margin: 10px;
	text-align: center;
	padding: 7px 0;
	font-size: .12rem;
	border: solid 1px #18305a;
	vertical-align: middle;
	background-color:#ffffff;
}
#ticket .priceBox table td span{font-size: .22rem;font-weight: 900;}
#ticket .priceBox table tbody tr:nth-child(even) td{background-color: #f4f5f8;}
#ticket .priceBox table tbody tr:nth-child(even) th{background-color: #a1b4d0;}
#ticket .caution{
	position: relative;
	margin:0 auto;
	width: calc(100% - 40px);
}
#ticket .price h4{
	position: relative;
	margin: 0 auto;
	text-align: center;
	font-weight: 900;
	padding-bottom: 5px;
	font-size: .15rem;
}
#ticket .caution.etic{
	opacity: 1;
	height: auto;
	padding-top: 10px;
}
#ticket .caution.etic a{text-decoration: underline;}
#ticket .u22{
	position: relative;
	margin: 30px auto 0 auto;
	text-align: center;
	background-color: #ffffff;
	border: solid 1px;
	padding: 20px;
	width: calc(100% - 80px);
}
#ticket .u22 img{
	margin: -35px auto 20px auto;
	width: 120px;
}
#ticket .u22 p{text-align: left;}
#ticket .u22 a{text-decoration: underline;}

#ticket .release{
	position: relative;
	margin: 0 auto;
	padding: 0 0 40px 0;
}
#ticket .release ul{
	position: relative;
	margin: 20px auto 0 auto;
	background-color: #ffffff;
	border: solid 1px #18305a;
	padding: 30px 20px;
	width: calc(100% - 80px);
}
#ticket .release ul li{
	position: relative;
	margin: 0 auto;
	text-align: center;
}
#ticket .release ul li .ttlS{
	position: relative;
	margin: 0 auto 20px auto;
	font-weight:700;
	padding-bottom: 15px;
	background-image: url("../img/bg_schedule01.png");
	background-repeat: no-repeat;
	background-position: 50% 100%;
	background-size: auto 34px;
}
#ticket .release .scraptantei{
	position: relative;
	margin: 0 auto 50px auto;
	display: block;
	text-align: center;
	font-size: .13rem;
}
#ticket .release .ttlBnr{
	font-weight: 700;
	margin: 20px auto 5px auto;
}
#ticket .release .bnr_scrap{
	position: relative;
	display: block;
	margin:0 auto;
}

/* covid19*/
#covid19{
	position: relative;
	margin: 0 auto 40px auto;
}
#covid19 h3{
	color: #ffffff;
	width: calc(100% - 80px);
	padding:25px 0  30px 0;
	text-align: center;
	font-weight: 900;
	font-size: .16rem;
	background-image: url("../img/bg_ttl_covid.png");
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: 100% 70%;
	text-shadow:1px 1px 0 #18305a, -1px -1px 0 #18305a,
              -1px 1px 0 #18305a, 1px -1px 0 #18305a,
              0px 1px 0 #18305a,  0-1px 0 #18305a,
              -1px 0 0 #18305a, 1px 0 0 #18305a;
	z-index: 20;
}
#covid19 p{
	position: relative;
	width: calc(100% - 80px);
	padding:0;
	margin:  0 auto;
	z-index: 19;
	text-align: center;
}
#covid19 p a{text-decoration: underline;}
#covid19 .btn_covid19 img{
	position: absolute;
	width: 10px;
	height:auto;
	top: calc(50% - 10px);
	transform: translateY(-50%) rotate(-90deg);
	right: 20px;
}

/* チケットカレンダー */
.ticAPI{position: relative;margin: 0 auto;padding: 0;}
.ticAPI iframe{position: relative;margin: 0; padding: 0; width: 100%; height: 420px;}
#ticket_api{margin: 0;padding: 0;color: #000000;width: 100%; background-color: #84d1fd;}
.ticketWrap{ margin: 0 auto; background-color: transparent !important;  padding:20px 0 0 0; font-size: .12rem !important; }
.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 .scheduleBox{color:#000000;}
.ticketWrap .naviBox ul li.cr .scheduleBox {background: #377399; color:#ffffff !important;}
.ticketWrap .naviBox ul li.cr .scheduleBox span span{color:#ffffff !important;}
.ticketWrap .detailsWrap {padding-top: 20px;}
.ticketWrap .detailsBox .tit {background-color: #26a0c3;font-size: .14rem !important;}
.ticketWrap .detailsBox .tit p{margin: 0 !important;}
.ticketWrap .detailsBox .tit01 {font-size: .18rem !important;}
.ticketWrap .detailsBox .details h4 {margin: 30px 0 0 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: #6d4a6d; font-size: .12rem;font-weight: normal;}
.ticketWrap .detailsBox .details a.scrap:after {border-top: solid 1px #e10000;border-right: solid 1px #6d4a6d; width: 5px; height: 5px;margin: -3px 0 0 0px;}
.ticketWrap .detailsBox .details ul li {margin-bottom: 0 !important;}
.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;}

/* schedule */
#schedule{
    position: relative;
    margin: 20px auto 0 auto;
}
#schedule ul{
	position: relative;
	margin: 25px auto 0 auto;
	width: calc(100% - 40px);
}
#schedule ul li{
	position: relative;
	margin: 0 auto 55px auto;
	background-color: #EEEEEE;
	padding: 40px 0 0 0;
	box-shadow: -8px 8px 0px -1px #D4DEE5;
	background-image: url("../img/top_shcedule_gray.png");
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-size: 100% auto;
	border-left: solid 1px #18305a;
	border-right: solid 1px #18305a;
	border-bottom: solid 1px #18305a;
	overflow: visible;
}
#schedule ul li .areaWrap{
	position: relative;
	margin: 0 auto;
}
#schedule ul li .areaWrap::before{
	position: absolute;
	width: 48%;
	height: 110px;
	left: -60px;
	top: -80px;
	content: '';
	display: block;
	background-image: url("../img/bg_shcedule_gray.png");
	background-repeat: no-repeat;
	background-position: 50% 0;
	background-size: 100% auto;
}
#schedule ul li .area{
	position: relative;
	margin: 0 auto;
	font-weight: 900;
	font-size: .16rem;
	text-align: center;
	padding: 3px 0 10px 0;
	opacity: .4;
}
#schedule ul li .kikan{
	position: relative;
	padding: 0;
	opacity: .4;
}
#schedule ul li .kikan p{
	position: relative;
	margin: 0 auto;
	padding: 15px 0 ;
	text-align: center;
	font-size: .14rem;
}
#schedule ul li .kikan p span{
	font-size: .17rem;
	font-weight: 700;
}
#schedule ul li .kikan p.ttl{
	background-color: #84d1fd;
	border-radius: 100px;
	color: #ffffff;
	font-weight: 700;
	padding: 2px 0;
	width: 8em;
	font-size: .13rem;
}
#schedule ul li .btn_sAccess{
	position: relative;
	margin: 0 auto ;
	display: block;
	width: calc(100% - 100px);
	text-align: center;
	padding: 22px 0;
	z-index: 5;
	font-weight: 500;
	font-size: .15rem;
	background-image: url("../img/bg_btn_schedule.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: 50% 50%;
	color: #ffffff;
	opacity: .4;
	pointer-events: none;
}
#schedule ul li .btn_sAccess{margin: 10px auto;}
#schedule ul li .btn_sAccess::after{
	position:absolute;
	top:0;
	right: 25px;
	display: block;
	content: '';
	height: 100%;
	width: 11px;
	transition: all .3s ease-out;
	background-image: url("../img/arrow01.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 50% 50%;
}
#schedule ul li .btn_sAccess.accessClose::after{transform: rotate(180deg);}
#schedule ul li .detail{
	position: relative;
	text-align: center;
	height: 0;
	overflow: hidden;
	opacity: 0;
	transition: all .5s ease-out;
}
#schedule ul li .detail.disp{height: auto;opacity: 1;padding: 0 0 20px 0;margin: 0 auto;}
#schedule ul li .detail ul{
	margin:0 auto;
	width: calc(100% - 40px);
}
#schedule ul li .detail ul li{
	margin: 0 0 20px 0;
	width: calc(50% - 5px);
	padding: 4px 0;
	background-color: #377399;
	box-shadow: none;
	background-image: none;
	background-repeat: no-repeat;
	border-left: none;
	border-right: none;
	border-bottom: none;
}
#schedule ul li .detail ul li a{
	color: #ffffff;
	font-weight: 500;
	font-size: .12rem;
}

/* goods */
#goods{
	position: relative;
	margin: 10px auto 40px auto;
}
#goods h3{padding: 30px 0 20px 0;}
#goods ul{
	position: relative;
	margin: 10px auto 0 auto;
	width: calc(100% - 20px);
}
#goods ul li{
	position: relative;
	margin: 0 0 20px 0;
	width: 50%;
}
#goods ul li .goodsTxt{
	position: relative;
	margin: -20px auto 0 auto;
	padding: 0 20px;
}
#goods ul li .price{
	position: relative;
	text-align: right;
	font-weight: 700;
	font-size: .16rem;
	padding-bottom: 10px;
}
#goods .caution{
	margin: 0 auto 20px auto;
	width: calc(100% - 40px);
}

/* FAQ */
#precautions{
	position: relative;
	margin: 10px auto 20px auto;
	text-align: center;
}
#precautions .ttl{
	position: relative;
	margin: 15px auto;
	width: calc(100% - 40px);
	padding: 20px 0 30px 0;
	color: #ffffff;
	text-shadow:1px 1px 0 #18305a, -1px -1px 0 #18305a,
              -1px 1px 0 #18305a, 1px -1px 0 #18305a,
              0px 1px 0 #18305a,  0-1px 0 #18305a,
              -1px 0 0 #18305a, 1px 0 0 #18305a;
	background-image: url("../img/bg_faq_ttl.png");
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-position: 50% 50%;
	font-size: .18rem;
	font-weight: 900;
	z-index: 50;
}
#precautions .ttl::after{
	position: absolute;
	top:0;
	right: 20px;
	width: 12px;
	height: 100%;
	content: '';
	display: block;
	background-image: url("../img/arrow01.png");
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: 50% 50%;
	transition: all .3s ease-out;
}
#precautions .ttl.disp::after{transform: rotate(-180deg);}
#precautions .faqWrap{
	position: relative;
	margin: 0 auto;
	padding: 0 20px;
	width: calc(100% - 60px);
	height: 0;
	overflow: hidden;
	transition: all .3s ease-out;
	z-index: 49;
	background-color: #ffffff;
}
#precautions .faqWrap.disp{height: auto !important;padding: 30px 20px; margin: -40px auto 0 auto; border: solid 2px #041b2d;}
#precautions .faqWrap dl{position: relative;}
#cautionlist dl dt, #precautions .catttl{
	position: relative;
	margin: 0 auto;
	padding: 30px 0 20px 0;
}
#cautionlist dl dt span, #precautions .catttl span{
	position: relative;
	font-size: .16rem;
	font-weight: 900;
	display: inline-block;;
	width: auto;
	padding: 12px 30px 5px 30px;
	background-image: url("../img/bg_ttl_faq_list.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: 0 0;
}
#precautions .faqWrap dl dd p{
	position: relative;
	padding-left: 1.2em;
	padding-bottom: .5em;
	text-align: left;
}
#precautions #limitlist dd p{padding-left: 0;}
#precautions #cautionlist.faqWrap dl dd p::before{
	position: absolute;
	content: '・';
	left: 0;
}
#precautions .faqWrap dl dd a{color: #b16ed8;text-decoration: underline;}
#precautions .faqWrap dl dd .caution{
	line-height: 1.4em;
	display: block;
	padding: 5px 0 0 0;
	text-align: left;
}
#precautions .faqWrap dl dd .strong.center{
	padding: 10px 0;
}
#precautions #limitlist dt{
	font-size: .13rem;
	width: calc(40% - 32px);
	padding: 15px;
	background-color: #c2ddff;
	border-top: solid 1px #c2ddff;
	border-left: solid 1px #c2ddff;
	border-bottom: solid 1px #ffffff;
	font-weight: 500;
}
#precautions #limitlist dd{
	font-size: .12rem;
	width: calc(60% - 32px);
	padding: 15px;
	border-top: solid 1px #c2ddff;
	border-right: solid 1px #c2ddff;
	text-align: left;
}
#precautions #limitlist dd .center{font-size: .14rem;}
#precautions #limitlist .border{border-bottom:solid 1px #c2ddff;}
#precautions #faqlist dt{
	font-size: .14rem;
	padding: 0 0 5px 0;
	text-align: left;
	color: #2a74cf;
	font-weight: 500;
}
#precautions #faqlist dd{text-align: left;padding: 0 0 20px 0;}
#precautions #faqlist dt::before{
	position: absolute;
	content: 'Q.';
	left: 0;
}
#precautions #faqlist dd, #precautions #faqlist dt{
	position: relative;
	padding-left: 1.2em;
}
#precautions #faqlist dd::before{
	position: absolute;
	content: 'A.';
	left: 0;
}

.btmPhoto{
	position: relative;
	margin: -15px auto 0 auto;
	transform: translateX(10px);
	z-index: 60;
	width: calc(100% + 10px);
}

.soldout{opacity: .4;}


/* ----- pc ----- */
@media screen and (min-width: 641px) {
	
	/* CMモーダル */
	.bgcm {width: 720px; }
	.bgcm .movieWrap{width: 720px !important;}
	.closecm{width: 90px;}
	.closecm:hover{cursor: pointer;}

	#bnrLinks ul li a img:hover, #howto .button:hover, #schedule .scheWrap ul li .button:hover{cursor: pointer; opacity: .8;transition: all .3s ease-out;}
	#covid19 .contetsWrap .btn_covid19:hover{cursor: pointer;transition: all .3s ease-out;}

	/* catch */
	#catch{
		padding: 10px;
		background-image: url("../img/bg_catch_pc.png");
		background-size: 100% auto;
	}
	#catch img{margin: 0 auto;}

	.closed{
		font-size: .18rem;
		padding:  20px;
	}
	
	/* ヘッダー */
	header #keyvisual{
		background-image: url("../img/main_pc.jpg");
		padding-top: 52.5%;
	}

	.eventtic img{width: 420px;}

	/* ストーリー */
	#story{
		padding: 20px 0 0 0;
		background-position: 50% 0;
		background-size: cover;
	}
	#story .storyWrap{
		margin:-20px auto 0 auto;
		padding: 0 0 80px 0;
		width: 1000px;
		background-position:0 100%, 50% 0;
		background-size: 170px auto, 100% 100%;
	}
	#story p{
		padding: 60px 20px 0 20px;
		line-height: 2.4em;
		font-size: .18rem;
	}
	#story .btn_more{
		margin: 50px auto;
		padding: 10px 0;
		width: 200px;
	}
	#story .btn_more::after{
		right: 15px;
		width: 12px;
	}

	/* 特徴 */
	#aboutgame{
		margin:-40px auto 0 auto;
		padding: 35px 0 20px 0;
		background-size: 120px auto;
		width: 960px;
	}
	#aboutgame .aboutgame{width: 960px;}
	#aboutgame .escape .ttl{width: 612px;}
	#aboutgame .escape .aboutImage{width: 500px;}
	#aboutgame .escape p{
		margin: 10px auto 0 auto;
		width: 500px;
		text-align: center;
	}

	/* 特徴 */
	#event{width: 960px;margin: -30px auto 0 auto;}
	#event::after{
		top: -370px;
		left: 0;
		width: 430px;
	}
	#event ul{
		margin: 20px auto 0 auto;
		width: 900px;
	}
	#event ul li{width: 33%;}
	#event ul li .pointImg{
		position: absolute;
		margin: 0;
		width: calc(100% + 30px);
	}
	#event ul li:nth-child(2) .pointImg{width: calc(100% + 40px);margin: -20px 0 0 5px;}
	#event ul li:nth-child(3) .pointImg{width: calc(100% + 80px);transform: translateX(-20px);}
	#event ul li .pointTxt{
		padding-top: 240px;
		width: calc(100% - 25px);
	}
	#event ul li .pointTxt .ttl{
		padding: 10px 25px 15px 25px;
		font-size: .24rem;
		background-size: 165px auto;
	}
	#event ul li:nth-child(2) .pointTxt .ttl{text-align: left;background-position:0 100%;}
	#event ul li:nth-child(3) .pointTxt .ttl{margin: -30px 0 0 0;}
	#event ul li .pointTxt .txt{padding: 10px 0 10px 25px;}

	/* about */
	#about .aboutWrap{
		padding: 35px 0 150px 0;
		background-size: 110% 100%;
	}
	#about ul{width: 390px;}
	#about ul li{padding: 25px 0 0 0;}
	#about ul li.btn{width: calc(50% - 7px);}

	/* キャラクター */
	#charactor .contetsWrap{width: 790px;}
	#charactor .chara .slick-dots{width: 680px;margin: 30px auto 0 auto;;}
	#charactor .chara .slick-dots li{ width: calc(20% - 20px);margin: 0 10px}

	/* プレイ形式 */
	#play{
		margin: 40px auto 0 auto;
		padding-bottom: 80px;
		width: 960px;
		background-position: 3% 0, 96% 22%;
		background-size: 44% auto, 40% auto;
	}
	#play ul li{width: 16% !important;}
	#play ul li:nth-child(2){margin: 55px 0 0 0;}
	#play ul li:nth-child(3){margin: 95px 0 0 0;}
	#play ul li:nth-child(4){margin:0;}
	#play ul li:nth-child(5){margin: 55px 0 0 0;}
	#play ul li:nth-child(6){margin: 95px 0 0 0;}
	#play .btn_howto{
		margin: 50px auto 0 auto;
		width: 380px;
	}

	/* ニュース */
	#news .newsBox{
		width: 820px;
		padding: 20px 40px;
	}
	#news .newsBox ul{height: 230px;}
	#news .newsBox ul li{margin:0 auto 15px auto;}


	/* チケット */
	#ticket .price{
		margin: -155px auto 0 auto;
		padding: 190px 0 100px 0;
		width: 1000px;
		background-size: 310px auto;
	}
	#ticket .price ul{width: 700px;}
	#ticket .price ul li{width: 650px;}
	#ticket .priceBox{margin: 40px auto 0 auto;}
	#ticket .priceBox table td{
		margin: 10px;
		padding:15px 0;
		font-size: .14rem;
	}
	#ticket .priceBox table td span{font-size: .32rem;}
	#ticket .price h4{
		padding-bottom: 10px;
		font-size: .20rem;
	}
	#ticket .u22{
		margin: 70px auto 0 auto;
		padding: 30px 80px;
		width: calc(100% - 200px);
	}
	#ticket .u22 img{
		margin: -65px auto 30px auto;
		width: 150px;
	}

	#ticket .release ul{
		margin: 40px auto 0 auto;
		padding: 50px;
		width: 560px;
		font-size: .18rem;
	}
	#ticket .release ul li .ttlS{
		font-size: .20rem;
		background-position: 50% 100%;
		background-size: 490px 34px;
	}
	#ticket .release .scraptantei{
		margin: 0 auto 70px auto;
		font-size: .18rem;
	}
	#ticket .release .ttlBnr{margin: 30px auto 5px auto;}
	#ticket .release .bnr_scrap{width: 360px;}

	/* covid19*/
	#covid19{margin: 60px auto;}
	#covid19 h3{
		width: 524px;
		padding:35px 0  40px 0;
		font-size: .24rem;
	}
	#covid19 p{
	width: 600px;
		text-align: center;
	}
	#covid19 .btn_covid19 img{
		width: 18px;
		right: 40px;
	}


	/* schedule */
	#schedule{margin: 80px auto 0 auto;}
	#schedule ul{
		margin: 55px auto 0 auto;
		width: 960px;
	}
	#schedule ul li{
		margin: 0 auto 65px auto;
		padding: 80px 0 10px 0;
		box-shadow: -12px 12px 0px -1px #D4DEE5;
		background-image: url("../img/top_shcedule_pc_gray.png");
	}
	#schedule ul li .areaWrap::before{
		width: 233px;
		height: 163px;
		left: -50px;
		top: -120px;
	}
	#schedule ul li .area{
		font-size: .30rem;
		padding: 3px 0 30px 0;
	}
	#schedule ul li .kikan p{
		padding: 25px 0 ;
		font-size: .19rem;
	}
	#schedule ul li .kikan p span{font-size: .24rem;	}
	#schedule ul li .kikan p.ttl{
		padding: 4px 0;
		width: 13em;
		font-size: .16rem;
	}
	#schedule ul li .btn_sAccess{
		margin: 20px auto 0 auto ;
		padding: 28px 0;
		font-size: .18rem;
		width: 300px;
	}
	#schedule ul li .btn_sAccess::after{
		right: 25px;
		width: 13px;
	}
	#schedule ul li .detail ul{width: 480px;}
	#schedule ul li .detail ul li{
		margin: 20px 0 30px 0;
		padding: 8px 0;
	}
	#schedule ul li .detail ul li a{font-size: .16rem;}

	/* goods */
	#goods{margin: 50px auto 40px auto;}
	#goods ul{
		margin: 30px auto 0 auto;
		width: 960px;
	}
	#goods ul li{
		margin: 0 10px 20px 10px;
		width: calc(33% - 20px);
	}
	#goods ul li .goodsTxt{
		margin: -40px auto 0 auto;
		padding: 0 40px;
	}
	#goods ul li .price{font-size: .22rem;}
	#goods .caution{
		margin: 0 auto 50px auto;
		width: 960px;
		text-align: center;
	}

	
	/* FAQ */
	#precautions{margin: 30px auto 20px auto;}
	#precautions .ttl{
		margin: 15px auto 25px auto;
		width: 960px;
		padding: 30px 0 40px 0;
		background-image: url("../img/bg_faq_ttl_pc.png");
		font-size: .28rem;
	}
	#precautions .ttl::after{
		right: 60px;
		width: 18px;
	}
	#precautions .faqWrap{
		padding: 0 40px;
		width: 880px;
	}
	#precautions .faqWrap.disp{padding: 30px 40px;margin: -60px auto 40px auto; }
	#cautionlist dl dt, #precautions .catttl{padding: 50px 0 30px 0;}
	#cautionlist dl dt span, #precautions .catttl span{font-size: .24rem;}
	#precautions .faqWrap dl dd .caution{font-size: .14rem;}
	#precautions .faqWrap dl dd .strong.center{padding: 20px 0;}
	#precautions #limitlist{width: 740px;}
	#precautions #limitlist dt{
		font-size: .16rem;
		padding: 25px 15px;
	}
	#precautions #limitlist dd{
		font-size: .14rem;
		padding: 15px;
	}
	#precautions #limitlist dd .center{font-size: .18rem;padding: 0 0 20px 0;}
	#precautions #faqlist dt{font-size: .16rem;}
	#precautions #faqlist dd{padding: 0 0 30px 0;}
	#precautions #faqlist dd, #precautions #faqlist dt{padding-left: 1.2em;}

	.btmPhoto{
		transform: translateX(0);
		width:650px;
	}
	
}