@charset "utf-8";

/*==========================================================
	
==========================================================*/


@import url(//fonts.googleapis.com/earlyaccess/notosansjapanese.css);

html {
	background: #000000;
	font-family: 'Noto Sans Japanese', sans-serif;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	position: relative;
}
	body {
		line-height: 1;
		-webkit-text-size-adjust: 100%;
		margin: 0;
		width: 100%;
		position: relative;
		z-index: 1;
	}
		article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary {
			display: block
		}
		iframe { overflow-y: hidden; z-index: 1 !important; }
		.movie iframe, .movie object, .movie embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

		
#bikkuri_kousaku {
	position: relative;
	z-index: 1;
	overflow: hidden;
	max-width: 1600px;
	margin: 0 auto 0 auto;
}

/*-----------------------------------------------------------
	base setting
-----------------------------------------------------------*/
p { margin: 0 0 0 0; }

a { text-decoration: underline; color: #000000; word-break: break-all; }
	a:hover { text-decoration: none; }
	a:focus { outline: none; }
	
.pc { display: block !important; }
.sp { display: none !important; }


.fade:hover {
	opacity: 0.7;
}
					/*===================sp=*/@media screen and (max-width: 860px) {

.pc { display: none !important; }
.sp { display: block !important; }
.fade:hover {
	opacity: 1;
}

					}/*====================*/

/*-----------------------------------------------------------
	text setting
-----------------------------------------------------------*/

h2 img ,
h3 img ,
h4 img ,
.img img {
	pointer-events : none !important;
}

.flt {
	text-decoration: line-through;
}

.fcR { color: #e62a05; }
.fcG { color: #a4a4a4; }
.fcB { color: #abebef; }
.fcY { color: #ffa282; }

.note {
	color: #315b6d;
	font-size: 12px;
}

					/*===================sp=*/@media screen and (max-width: 860px) {

.note {
	font-size: 2.4vw;
}

					}/*====================*/

	
/*-----------------------------------------------------------
	header setting
-----------------------------------------------------------*/
#header {
	width: 100%;
	position: relative;
	margin: 0 0 0 0;
	top: 0;
	left: 0;
	z-index: 9;
	display: none;
	position: fixed;
	z-index: 2;
}
#header.fixed {
	position: fixed;
	display: block;
}
	.headerWrap {
		width: 100%;
		padding: 0 0 0 0;
		position: relative;
		z-index: 9;
	}
	
	/*----------------------------------#g_menu setting----------*/
	#g_navi {
		margin: 0;
		width: 100%;
		height: auto;
		text-align: center;
/* 		z-index: 9; */
		padding: 0 0 0 0;
		top: 0;
		position: absolute;
	}
		#header.fix #g_navi {
			top: 0;
			position: fixed;
		}
	
	#g_menu .hdBox {
		width: 100%;
		padding: 0 0 0 0;
		overflow: hidden;
		position: fixed;
		z-index: 9;
	}
	#g_menu .hdBox {
		width: 100%;
	}
	#g_navi .btn {
		width: 12.5%;
		float: left;
	}

	#g_navi #menuBtn {
		width: 40px;
		margin: 10px 3% 10px 0;
		float: right;
		line-height: 0;
	}
	.f #g_navi #menuBtn {
		display: none;
	}
	#g_navi #menuClose {
		width: 40px;
		margin: 10px 3% 0 0;
		float: right;
	}
	
	#g_navi .navi {
		position: relative;
		overflow: hidden;
		display: block;
		width: 100%;
		margin: 0 auto 0 auto;
		padding: 0 0 0 0;
	}
		#g_navi .nav .main {
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: justify;
			-ms-flex-pack: justify;
			justify-content: space-between;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
		}
		
	#g_navi .nav {
		width: 80%;
		margin: 25% auto 5% auto;
		font-size: 23px;
		color: #EEEEEE;
		overflow: hidden;
	}
	#g_navi .nav li {
		width: 48%;
		margin: 0 0 5px 0;
		height: auto;
		border-left: none;
		line-height: 0;
		font-weight: 900;
	}
	#g_navi .nav li.off {
		opacity: 0.7;
	}
	.hdBox {
		height: 55px;
		padding: 0 0 0 0;
		overflow: hidden;
		position: relative;
		z-index: 2;
	}
		#g_navi .nav li a {
			height: auto !important;
			display: block;
			line-height: 1.0;
		}
	#g_navi .nav li.txt {
		font-size: 6.0vw;
		padding: 10px 0 0 0;
		color: #e2007f;
	}
	#g_navi .nav li p {
		line-height: 1.0;
		padding: 3% 0 3% 0;
	}

	#g_menu{
		position: absolute;
		width: 100%;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		z-index: 1000;
		display: none;
		top: 0;
		bottom: 0;
	}
	.fix #g_menu {
		top: 0;
	}
	#g_navi .navBox {
		background: rgba(0, 156, 191, 0.94) url(../img/nav_bg.svg) no-repeat left top;
		background-size: 20% auto;
		background-position: 5% 10px;
		width: 100%;
		margin: 0 auto 0 auto;
		overflow: hidden;
		padding: 0 0 200vw 0;
	}
	
	#g_navi .nav li:hover,
	#g_navi .nav li.off:hover,
	#g_navi .nav li.off,
	#g_navi .nav li.navtit:hover {
		opacity: 1 !important;
		filter: alpha(opacity=100) !important;
		-ms-filter: "alpha(opacity=100)" !important;
		-moz-opacity: 1 !important;
		-khtml-opacity: 1 !important;
		
	}
	
					/*===================sp=*/@media (min-width: 860px) {
						
.inner #header.fixed {
}
						
		#header.fixed {
			position: fixed;
			top: 0;
			left: 0;
			margin-top: 0;
			
		}
		
	#g_navi #menuBtn {
		display: none;
	}
	#g_navi #menuClose {
		display: none;
	}
	#g_navi .navi {
		display: none;
	}
	
	
#header {
	width: 100%;
	position: relative;
	margin: 0 0 0 0;
	z-index: 9;
	display: block;
	top: 0;
	background: none;

}
	.headerWrap {
		width: 100%;
		background: none;
		padding: 0 0 0 0;
		margin: 0 auto 0 auto;
		position: absolute;
		z-index: 9999;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: center;
		-ms-flex-pack: center;
		justify-content: center;
		position: absolute;
		bottom: 0;
		margin: 0 auto -7% auto;
	}
	
	#g_navi {
		width: 55%;
		max-width: 700px;
		background: none;
		padding: 0 0 0 0;
		position: relative;
		top: 0;
	}
	.inner #g_navi {
		max-width: 700px;
	}
	#g_menu {
		padding: 0 0 0 0;
		width: 100%;
		background: none;
		position: relative;
		display: block !important;
		overflow: auto;
		overflow-x: auto;
		overflow-y: auto;
		top: 0;
	}
	
	#g_menu .hdBox {
		display: none;
	}
	#g_navi .navBox {
		width: 100%;
		margin: 0 0 0 0;
		padding: 0 0 0 0;
		overflow: auto;
		border: none;
		background: none;
	}
	#g_navi .nav {
		width: auto;
		border: none;
		margin: 0 0 0 0;
		padding-bottom: 10px;
	}
	
	.fixed .headerWrap {
		bottom: auto;
		top: 0;
		margin-top: -12px;
	}
	.fixed #g_navi .nav {
		padding-bottom: 10px;
	}
		#g_navi .nav .navtit {
			width: 70%;
			margin: 0 auto 15px auto;
			display: none;
		}
		#g_navi .nav .main,
		#g_navi .nav .sub {
			width: 100%;
			display: -webkit-flex;
			display: flex;
			-webkit-align-items: center;
			align-items:         center;
			-webkit-justify-content: space-between;
			justify-content:         space-between;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
		}
		#g_navi .nav .sub {
			width: 68%;
			margin: 10px auto 0 auto;
		}

		#g_navi .nav .main li {
			width: 24%;
			padding: 0 0 0 0;
			margin: 0 0 0 0;
			line-height: 0;
		}

		#g_navi .nav .sub li {
			width: 46%;
			padding: 10px 0 8px 0;
			margin: 0 0 0 0;
			line-height: 0;
		}
		#g_navi .nav .sub li.off {
			width: 46%;
			padding: 0 0 0 0;
			line-height: 0;
		}
			#g_navi .nav .sub li a {
				padding: 0 0 0 0;
			}

	#g_navi .nav li a {
		display: block;
	}
	
	#g_navi .nav li:hover {
		opacity: 0.5 !important;
		filter: alpha(opacity=50) !important;
		-ms-filter: "alpha(opacity=50)" !important;
		-moz-opacity: 0.5 !important;
		-khtml-opacity: 0.5 !important;
	}
	
		.fixed #g_navi .nav .navtit,
		.inner #g_navi .nav .navtit {
			display: none;
		}
		.fixed #g_navi .nav .main,
		.fixed #g_navi .nav .sub {
			width: 100%;
			margin: 0 auto 0 auto;
		}
		.fixed #g_navi .nav .main {
		}
		
			.top .fixed #g_navi .nav .main .nav_ticket img,
			.top .fixed #g_navi .nav .main .nav_nazo img,
			.top .fixed #g_navi .nav .main .nav_introduction img,
			.top .fixed #g_navi .nav .main .nav_goods img {
				display: block;
			}
			.top #g_navi .nav .main .nav_ticket img,
			.top #g_navi .nav .main .nav_nazo img,
			.top #g_navi .nav .main .nav_introduction img,
			.top #g_navi .nav .main .nav_goods img {
				display: none;
			}
			.top #g_navi .nav .main .nav_ticket a {
				width: 100%;
				padding-top: 69.3%;
				background: url(../img/nav_ticket_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .main .nav_nazo a {
				width: 100%;
				padding-top: 69.3%;
				background: url(../img/nav_nazo_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .main .nav_nazo p {
				width: 100%;
				padding-top: 69.3%;
				background: url(../img/nav_nazo_t_off.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .main .nav_introduction a {
				width: 100%;
				padding-top: 69.3%;
				background: url(../img/nav_introduction_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .main .nav_goods a {
				width: 100%;
				padding-top: 69.3%;
				background: url(../img/nav_goods_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .main .nav_goods.off p {
				width: 100%;
				padding-top: 69.3%;
				background: url(../img/nav_goods_t_off.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top .fixed #g_navi .nav .main .nav_ticket a,
			.top .fixed #g_navi .nav .main .nav_nazo a,
			.top .fixed #g_navi .nav .main .nav_nazo p,
			.top .fixed #g_navi .nav .main .nav_introduction a,
			.top .fixed #g_navi .nav .main .nav_goods a,
			.top .fixed #g_navi .nav .main .nav_goods p {
				background: none !important;
				padding: 0 0 0 0;
			}
			
			
		.inner #g_navi .nav .sub,
		.fixed #g_navi .nav .sub {
			width: 65%;
			padding: 0 5% 0 5%;
			margin-top: 8px;
			-ms-flex-wrap: nowrap;
			flex-wrap: nowrap;
			line-height: 0;
			background: url(../img/nav_sub_bg.png) no-repeat center top;
			background-size: 100% 100%;
		}
			.top .fixed #g_navi .nav .sub .nav_special img,
			.top .fixed #g_navi .nav .sub .nav_howto img,
			.top .fixed #g_navi .nav .sub .nav_faq img,
			.top .fixed #g_navi .nav .sub .nav_top img {
				display: block;
			}
			.top .fixed #g_navi .nav .sub .nav_special,
			.top .fixed #g_navi .nav .sub .nav_howto,
			.top .fixed #g_navi .nav .sub .nav_faq,
			.top .fixed #g_navi .nav .sub .nav_top {
				margin: 0 0 0 0 !important;
			}
			.top .fixed #g_navi .nav .sub .nav_special a,
			.top .fixed #g_navi .nav .sub .nav_special p,
			.top .fixed #g_navi .nav .sub .nav_howto a,
			.top .fixed #g_navi .nav .sub .nav_faq a,
			.top .fixed #g_navi .nav .sub .nav_top a {
				background: none !important;
				padding: 10px 0 8px 0;
			}
			
			.inner #g_navi .nav .sub .nav_special,
			.fixed #g_navi .nav .sub .nav_special,
			.top .fixed #g_navi .nav .sub .nav_special {
				width: 23.18%;
			}
			.inner #g_navi .nav .sub .nav_howto,
			.fixed #g_navi .nav .sub .nav_howto,
			.top .fixed #g_navi .nav .sub .nav_howto {
				width: 14.54%;
			}
			.inner #g_navi .nav .sub .nav_faq,
			.fixed #g_navi .nav .sub .nav_faq,
			.top .fixed #g_navi .nav .sub .nav_faq {
				width: 12.27%;
			}
			.inner #g_navi .nav .sub .nav_top,
			.fixed #g_navi .nav .sub .nav_top,
			.top .fixed #g_navi .nav .sub .nav_top {
				width: 26.8%;
			}
		
			.top #g_navi .nav .sub .nav_special img,
			.top #g_navi .nav .sub .nav_howto img,
			.top #g_navi .nav .sub .nav_faq img,
			.top #g_navi .nav .sub .nav_top img {
				display: none;
			}
			.top #g_navi .nav .sub .nav_special,
			.top #g_navi .nav .sub .nav_howto,
			.top #g_navi .nav .sub .nav_faq,
			.top #g_navi .nav .sub .nav_top {
				width: 48%;
				margin: 0 0 15px 0;
				padding: 0 0 0 0;
				line-height: 0;
			}
			.top #g_navi .nav .sub .nav_special a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_special_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .sub .nav_special p {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_special_t_off.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .sub .nav_howto a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_howto_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .sub .nav_faq a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_faq_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top #g_navi .nav .sub .nav_top a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_top_t.svg) no-repeat center top;
				background-size: 100% auto;
			}



					}/*====================*/
					

					/*===================sp=*/@media screen and (max-width: 860px) {
						
.inner #header {
	display: block !important;
}
.inner #header.fixed {
	margin-top: 0;
	top: 0;
}
#g_navi .nav .sub {
	width: 100%;
	margin: 20px auto 3px auto;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
	align-items:         center;
	-webkit-justify-content: space-between;
	justify-content:         space-between;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
	#g_navi .nav .sub li {
	}
	
#g_navi .nav li.navtit {
	display: none;
}

			.top .fixed #g_navi .nav .sub .nav_special img,
			.top .fixed #g_navi .nav .sub .nav_howto img,
			.top .fixed #g_navi .nav .sub .nav_faq img,
			.top .fixed #g_navi .nav .sub .nav_top img ,
			.inner #g_navi .nav .sub .nav_special img,
			.inner #g_navi .nav .sub .nav_howto img,
			.inner #g_navi .nav .sub .nav_faq img,
			.inner #g_navi .nav .sub .nav_top img {
				display: none;
			}
			.top .fixed #g_navi .nav .sub .nav_special a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_special_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top .fixed #g_navi .nav .sub .nav_special p {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_special_t_off.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top .fixed #g_navi .nav .sub .nav_howto a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_howto_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top .fixed #g_navi .nav .sub .nav_faq a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_faq_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.top .fixed #g_navi .nav .sub .nav_top a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_top_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			
			.inner  #g_navi .nav .sub .nav_special a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_special_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.inner  #g_navi .nav .sub .nav_special p {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_special_t_off.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.inner  #g_navi .nav .sub .nav_howto a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_howto_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.inner  #g_navi .nav .sub .nav_faq a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_faq_t.svg) no-repeat center top;
				background-size: 100% auto;
			}
			.inner  #g_navi .nav .sub .nav_top a {
				width: 100%;
				padding-top: 17.3%;
				background: url(../img/nav_top_t.svg) no-repeat center top;
				background-size: 100% auto;
			}

					}/*====================*/


/*-----------------------------------------------------------
	#content setting
-----------------------------------------------------------*/
#content {
	font-family: 'Noto Sans Japanese', sans-serif;
	width: 100%;
	margin: 0 auto 0 auto;
	padding: 0 0 0 0;
	z-index: -1;
	position: relative;
	font-size: 16px;
	line-height: 1.8;
	color: #000000;
	z-index: 0;
}

	.contentWrap {
		width: 100%;
		margin: 0 auto 0 auto;
		position: relative;
	}
	
	.line {
		width: 120%;
		height: 15px;
		margin-left: -10%;
		background: url(../img/line_main.png) no-repeat center top;
		background-size: 100% 100%;
		z-index: 2;
		position: absolute;
		top: -6px;
		display: none;
	}
	
	.contentWrap.slanting00 {
		padding: 0 0 4vw 0;
	}
	.contentWrap.slanting00.tyB {
		padding: 0 0 4vw 0;
		margin-top: -11vw !important;
		z-index: 1;
 	}

	.contentWrap.slanting01 {
		padding: 3vw 0 11vw 0;
		margin-top: 0 !important;
		-webkit-transform: skewY(2.74deg);
		-ms-transform: skewY(2.74deg);
		transform: skewY(2.74deg);
		-webkit-transform-origin: top right;
		-ms-transform-origin: top right;
		transform-origin: top right;
		z-index: 1;
	}
	.contentWrap.slanting02 {
		padding: 3vw 0 10vw 0;
		margin-top: -11vw !important;
		-webkit-transform: skewY(176.77deg);
		-ms-transform: skewY(176.77deg);
		transform: skewY(176.77deg);
		-webkit-transform-origin: top right;
		-ms-transform-origin: top right;
		transform-origin: top right;
		z-index: 1;
	}
	
	.contentWrap.slanting03 {
		padding: 4vw 0 11vw 0;
		margin-top: 0 !important;
		-webkit-transform: skewY(3.23deg);
		-ms-transform: skewY(3.23deg);
		transform: skewY(3.23deg);
		-webkit-transform-origin: top right;
		-ms-transform-origin: top right;
		transform-origin: top right;
		z-index: 1;
	}
	
		/*lead*/
		.contentWrap.contenbg01 {
			background: #0671ff url(../img/bg01.png) no-repeat left top;
			background-size: cover;
		}
		/*news*/
		.contentWrap.contenbg02 {
			background: #ffffff;
		}
		/*special*/
		.contentWrap.contenbg03 {
			background: #ffce10;
		}
		/*point*/
		.contentWrap.contenbg04 {
			background: #ff4b42 url(../img/bg04.png) no-repeat left top;
			background-size: cover !important;
		}
		/*story*/
		.contentWrap.contenbg05 {
			background: url(../img/bg05.png) no-repeat center top;
			background-size: cover !important;
		}
		/*introduction*/
		.contentWrap.contenbg06 {
			background: #ffffff;
		}
		/*play*/
		.contentWrap.contenbg07 {
			background: #ff4b42 url(../img/bg07.png) no-repeat center top !important;
			background-size: 100% auto !important;
		}
		/*schedule*/
		.contentWrap.contenbg08 {
			background: #b7187c url(../img/bg08.png) no-repeat center top !important;
			background-size: 100% auto !important; 
		}
		/*sale*/
		.contentWrap.contenbg09 {
			background: url(../img/bg09.png) no-repeat center top !important;
			background-size: 100% auto !important;
		}

		
		
		.contentBox {
			max-width: 700px;
			margin: 0 auto 0 auto;
			padding: 5vw 0 5vw 0;
			position: relative;
			z-index: 12;
		}
		
		.slanting01 .contentBox {
			-webkit-transform: skewY(-2.74deg);
			-ms-transform: skewY(-2.74deg);
			transform: skewY(-2.74deg);
			-webkit-transform-origin: top right;
			-ms-transform-origin: top right;
			transform-origin: top right;
		}
		
		.slanting02 .contentBox {
			-webkit-transform: skewY(-176.77deg);
			-ms-transform: skewY(-176.77deg);
			transform: skewY(-176.77deg);
			-webkit-transform-origin: top right;
			-ms-transform-origin: top right;
			transform-origin: top right;
		}
		
		.slanting03 .contentBox {
			-webkit-transform: skewY(-3.23deg);
			-ms-transform: skewY(-3.23deg);
			transform: skewY(-3.23deg);
			-webkit-transform-origin: top right;
			-ms-transform-origin: top right;
			transform-origin: top right;
		}
		
#content h2 {
	width: 100%;
	max-width: 700px;
	margin: 0 auto 0 auto;
	text-align: center;
}
	#content h2 img {
		width: 100%;
	}
	
.inner #content h2 {
	width: 100%;
	max-width: 700px;
	margin: 0 auto 40px auto;
	text-align: center;
	position: relative;
	padding-top: 8.5%;
}
	.inner #content h2 img {
		position: absolute;
		top: -100%;
		left: 0;
	}
	
#content h3 {
	width: 100%;
	margin: 0 auto 0 auto;
	text-align: center;
}
	#content h3 img {
		width: 100%;
		max-width: 600px;
	}
	
.contentBox .bnr {
	width: 50%;
	max-width: 300px;
	margin: 30px auto 0 auto;
}
	.contentBox .bnr:hover {
		opacity: 0.7;
	}
	
.contentBox .bnrA {
	width: auto;
}
	.contentBox .bnrA img {
		display: block;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		box-shadow: 4px 4px 0 #f0884a;
	}
	.contentBox .bnrA:hover {
		opacity: 0.7;
	}

.contentBox .btn {
	width: 80%;
	max-width: 370px;
	margin: 0 auto 0 auto;
}

	.contentBox .btn.tyL {
		background: #46717a;
		text-align: center;
		width: 100%;
		max-width: 100%;
		margin: 40px auto 0 auto;
		padding: 15px 0 15px 0;
		display: block;
		font-size: 14px;

		border-radius: 3px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
	}
		.contentBox .btn.tyL:hover {
			opacity: 0.7;
		}
		
		.contentBox .btn.tyL a {
			color: #ffffff;
			font-weight: bold;
			display: block;
			text-decoration: none !important;
		}
			.contentBox .btn.tyL a:hover {
				text-decoration: none;
			}
			.contentBox .btn.tyL p {
				padding: 5% 5% 5% 5%;
			}

	.movie {
		margin: 0 auto 0 auto;
		position: relative; 
		padding-bottom: 34%; 
		height: 0; 
		overflow: hidden; 
		max-width: 100%;
	}
		.movie iframe, .movie object, .movie embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
	

.navArea { display: none; }


					/*===================sp=*/@media screen and (max-width: 860px) {


	.contentWrap {
		width: 100%;
		max-width: 960px;
		margin: 0 auto 0 auto;
		padding: 10vw 0 10vw 0;
		position: relative;
	}
		.contentBox {
			width: 90%;
			margin: 0 auto 0 auto;
			padding: 10vw 0 0 0;
		}
		.inner .contentBox {
			width: 90%;
			margin: 0 auto 0 auto;
			padding: 5vw 0 5vw 0;
		}
		
	.line {
		height: 8px;
		top: -3px;
	}
	
#content h2 {
	width: 100%;
	margin: 0 auto 0 auto;
	text-align: center;
}
	#content h2 img {
		width: 130%;
		margin-left: -15%;
	}
	.inner #content h2 img {
		width: 100%;
		margin-left: 0;
	}
	#content #news h2 img {
		width: 99%;
		margin-left: 0;
	}
	
.inner #content h2 {
	width: 100%;
	max-width: 700px;
	margin: 0 auto 0 auto;
	text-align: center;
	position: relative;
	padding-top: 17%;
}
	.inner #content h2 img {
		position: absolute;
		top: -50%;
		left: 0;
	}
					}/*====================*/
					


/*-----------------------------------------------------------
	mv setting
-----------------------------------------------------------*/
#main {
	width: 100%;
	height: 82%;
	margin: 0 auto 0 auto;
	padding: 0 0 0 0;
	position: relative;
	z-index: 4;
	background: #ff4b42;
}
	.ribbon {
		background: #019cbf;
		padding: 15px 0 15px 0;
		text-align: center;
		line-height: 0;
	}
	.inner .ribbon {
		padding: 10px 0 10px 0;
	}
		.ribbon img {
			width: 70%;
			max-width: 700px;
			margin: 0 auto 0 auto;
		}
		.inner .ribbon img {
			width: 70%;
			max-width: 350px;
			margin: 0 auto 0 auto;
		}
		
	#main .mainWrap {
		width: 100%;
		height: 82%;
		margin: 0 auto 0 auto;
		line-height: 0;
		z-index: 2;
		position: relative;
	}
		#main .bg {
			padding-top: 82%;
			background: url(../img/mv_bg.png) no-repeat center top;
			background-size: 100% auto;
			display: block;
		}
		
		#main .deco1 {
			position: absolute;
			top: 28%;
			right: 0;
			overflow: hidden;
			width: 24%;
			z-index: 5;
		}
			#main .deco1 p {
				background: url(../img/mv_deco1.png) no-repeat left top;
				background-size: 100% auto;
				width: 100%;
				padding-top: 178%;
			}
		#main .deco2 {
			position: absolute;
			bottom: 0;
			left: 0;
			overflow: hidden;
			width: 19.3%;
			z-index: 5;
		}
			#main .deco2 p {
				background: url(../img/mv_deco2.png) no-repeat left top;
				background-size: 100% auto;
				width: 100%;
				padding-top: 215%;
			}
			
	#main .mv {
		width: 100%;
		height: 100%;
		margin: 0 auto 0 auto;
		position: absolute;
		top: 0;
		left: 0;
		line-height: 0;
		z-index: 3;
	}
	
		#main .tit {
			width: 65.5%;
			height: 100%;
			margin: 0 17.25% 0 17.25%;
			position: absolute;
			top: 2.5%;
			left: 0;
			z-index: 2;
		}
			#main .tit p {
				padding-top: 79.6%;
				background: url(../img/mv_tit.svg) no-repeat;
				background-size: 100% auto;
			}
			
		#main .chara {
			width: 64.16%;
			position: absolute;
			bottom: 0;
			left: 16%;
			z-index: 3;
		}
			#main .chara p {
				padding-top: 123%;
				background: url(../img/mv_chara.png) no-repeat left top;
				background-size: 100% auto;
			}
			
		#main .lead {
			width: 7.8%;
			position: absolute;
			bottom: 5%;
			left: 17.25%;
			z-index: 6;
		}
			#main .lead p {
				padding-top: 388%;
				background: url(../img/mv_lead.png) no-repeat center top;
				background-size: 100% auto;
			}

		#main .logo {
			width: 10%;
			position: absolute;
			right: 3%;
			top: 3%;
			z-index: 2;
		}


					/*===================sp=*/@media screen and (max-width: 860px) {
							

	.ribbon {
		background: #019cbf;
		padding: 8px 0 8px 0;
		text-align: center;
		line-height: 0;
	}
	.inner .ribbon {
		padding: 10px 0 10px 0;
	}
		.ribbon img {
			width: 63%;
			max-width: 700px;
			margin: 0 auto 0 auto;
		}
		.inner .ribbon img {
			width: 70%;
			max-width: 350px;
			margin: 0 auto 0 auto;
			position: relative;
			z-index: 100;
		}
		
		#main .bg {
			padding-top: 127%;
		}

		#main .bg {
			background: url(../img/sp/mv_bg.png) no-repeat center top;
			background-size: 100% auto;
			display: block;
		}
		#main .tit {
			width: 90%;
			margin: 0 5% 0 5%;
		}
		#main .lead {
			width: 13%;
			left: 6%;
			bottom: 5%;
		}
		#main .chara {
			width: 93.6%;
			left: 0;
		}
			#main .chara p {
				padding-top: 127%;
				background: url(../img/sp/mv_chara.png) no-repeat left top;
				background-size: 100% auto;
			}
			
		#main .deco1 {
			width: 33%;
			top: 36%;
		}
		#main .logo {
			width: 20%;
			right: 4%;
			top: auto;
			bottom: 6%;
			z-index: 3;
		}


					}/*====================*/
				

		.inner #main .bg {
			padding-top: 30%;
			background: url(../img/mv_inner.png) no-repeat center bottom;
			background-size: 100% auto;
			display: block;
		}

		.inner #main .mainBox .chara {
			width: 80%;
			position: absolute;
			bottom: 0;
			left: 4.5%;
		}
		
		
	.inner #main .mv .mainBox {
		width: 26%;
		height: 94%;
		margin: 2.5% 37% 0 37%;
		display: block;
		position: relative;
	}
	
		
		.inner #main .cv {
			z-index: 5;
		}
		#main .cvl {
			width: 100%;
			height: 100%;
			background: #553636;
			position: absolute;
			left: 0;
			bottom: 0;
			z-index: 2;
			background: rgba(6, 33, 63, 0.60);
		}

					/*===================sp=*/@media screen and (max-width: 860px) {

		.inner #main .bg {
			padding-top: 50%;
			background: url(../img/sp/mv_inner.png) no-repeat center bottom;
			background-size: 100% auto;
			display: block;
		}
		
	.inner #main .mv .mainBox {
		width: 60%;
		height: 94%;
		margin: 2.5% 20% 0 20%;
		display: block;
		position: relative;
	}
		.inner #main .mainBox .chara {
			width: 70%;
			position: absolute;
			bottom: 0;
			left: 8%;
		}

					}/*====================*/
					

/*-----------------------------------------------------------
	#intro setting
-----------------------------------------------------------*/
#intro {
	
}
	#intro .contentBox {
		max-width: 100%;
		padding-top: 0;
	}



					/*===================sp=*/@media screen and (max-width: 860px) {

#intro .contentBox {
	width: 100%;
	max-width: 100%;
	padding-top: 1px;
}


					}/*====================*/
					
					

/*-----------------------------------------------------------
	#photo setting
-----------------------------------------------------------*/
#photo {
	width: 100%;
	height: 144px;
	overflow: hidden;
	position: relative;
	z-index: 2;
	padding-top: 10%;
}
	#photo .slideWrap {
		
	}	
	#photo .slideBox {
		width: 100%;
		position: relative;
	}
	#photo .slide {
		width: 100%;
		position: relative;
		height: 144px;
	}
	#photo ul {
		list-style: none;
		position: absolute;
		top: 0;
		left: 0;
		width: 2080px;
		height: 100%;
		margin-left: 0;
	}
	
		#photo ul li {
			width: 240px;
			line-height: 0;
			position: absolute;
			top: 0;
			left: 0;
		}
			#photo ul li img {
				width: 100%;
				height: auto;
			}
			
		#photo ul li:nth-child(1) { left: 0; }
		#photo ul li:nth-child(2) { left: 260px; }
/* 			#photo ul li:nth-child(2) { width: 135px; } */
		#photo ul li:nth-child(3) { left: 520px; }
		#photo ul li:nth-child(4) { left: 780px; }
/* 			#photo ul li:nth-child(4) { width: 135px; } */
		#photo ul li:nth-child(5) { left: 1040px; }
		#photo ul li:nth-child(6) { left: 1300px; }
		#photo ul li:nth-child(7) { left: 1560px; }
		#photo ul li:nth-child(8) { left: 1820px; }
		
		#photo .loop {
			-webkit-animation: loop01 60s linear infinite;
			animation: loop01 50s linear infinite;
		}
		@-webkit-keyframes loop01 {
			0%{ transform: translateX(0%); }
			100%{ transform: translateX(-2080px); }
		}
		@keyframes loop01 {
			0%{ transform: translateX(0%); }
			100%{ transform: translateX(-2080px); }
		}


					/*===================sp=*/@media screen and (max-width: 860px) {

#photo {
	width: 100%;
	height: 144px;
	overflow: hidden;
	position: relative;
	z-index: 2;
	margin-top: 0;
	padding-top: 6%;
/* 	margin-top: -20%; */
}


					}/*====================*/
					
					
/*-----------------------------------------------------------
	#lead setting
-----------------------------------------------------------*/
#lead {
	margin: 0 auto 0 auto;
	text-align: center;
	line-height: 0;
}
	#lead .txt01 {
		width: 100%;
		max-width: 700px;
		margin: 60px auto 0 auto;
		padding: 25px 0 25px 0;
		background: url(../img/lead_bg.png) no-repeat center center;
		background-size: 100% 100%;
	}
	#lead .txt02 {
		width: 100%;
		max-width: 700px;
		margin: 20px auto 0 auto;
		padding: 20px 0 20px 0;
		background: #000000;
	}
		
					/*===================sp=*/@media screen and (max-width: 860px) {
	
	#lead .txt01 {
		width: 90%;
		margin: 30px auto 0 auto;
	}
	#lead .txt02 {
		width: 90%;
		margin: 15px auto 0 auto;
	}


					}/*====================*/


/*-----------------------------------------------------------
	#news setting
-----------------------------------------------------------*/
#news {
}

	#news .contentBox {
		padding-top: 30px;
		padding-bottom: 0;
	}
	
	#news .newsBox {
		width: 100%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
		margin: 0 auto 0 auto;
	}

	#news h2 {
		width: 12%;
		margin: 0 0 0 0;
	}
	#news .list {
		width: 84%;
		margin: 15px 0 0 0;
		padding-right: 1%;
		
		height: 17em;
		overflow-y: scroll;
	}
	
	/*スクロールバー全体*/
	#news .list::-webkit-scrollbar {
	    width: 10px;
	}
	
	/*スクロールバーの軌道*/
	#news .list::-webkit-scrollbar-track {
	  border-radius: 0;
	  box-shadow: inset 0 0 6px rgba(0, 0, 0, .1);
	}
	
	/*スクロールバーの動く部分*/
	#news .list::-webkit-scrollbar-thumb {
	  background-color: #000a14;
	  border-radius: 0;
	  box-shadow:0 0 0 1px rgba(255, 255, 255, .3);
	}
		#news .list li {
			width: auto;
			font-size: 20px;
			position: relative;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			
			text-align: left;
			font-weight: bold;
			margin: 0 0 1em 0;
			padding: 0 0 0 1em;
			color: #06213f;
			border-bottom: 5px solid #000a14;
			border-right: 5px solid #000a14;
		}
			#news .list li .date {
				width: 10em;
				padding: .5em 0 .5em 0;
			}
			#news .list li .txt {
				padding: .5em 1em .5em 0;
				width: 100%;
			}
			#news .list li .txt a {
				color: #06213f;
			}
			#news .list li:before {
				content: "";
				background: #000a14;
				width: 6px;
				height: 6px;
				position: absolute;
				right: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			#news .list li:after {
				content: "";
				background: #000a14;
				width: 6px;
				height: 6px;
				position: absolute;
				right: 10px;
				bottom: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			
			
		#news .flow {
			width: 100%;
			max-width: 700px;
			margin: 0 auto 0 auto;
			background: #e5e5e5;
			position: relative;
		}
			#news .flow:after {
				content: "";
				width: 127%;
				height: 20px;
				background: url(../img/flow_bg.png) repeat center top;
				background-size: 25% auto;
				position: absolute;
				top: 6px;
				left: -15%;
			}
			#news .flow:before {
				content: "";
				width: 96%;
				height: 50px;
				background: url(../img/flow_bg_b.png) no-repeat center top;
				background-size: 100% auto;
				position: absolute;
				bottom: 12px;
				left: 2%;
			}
			
		#news .flowBox {
			padding: 4% 4% 0% 4%;
			position: relative;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			-webkit-box-pack: center;
			-ms-flex-pack: center;
			justify-content: center;
			border: 6px solid #000a14;
		}
			#news .flowBox:after {
				content: "";
				width: 98%;
				height: 100%;
				background: url(../img/flow_bg_c.png) no-repeat center center;
				background-size: 100% auto;
				position: absolute;
				top: 6px;
				left: 1%;
			}
			#news .flowBox li {
				width: 23%;
				margin: 0 5% 30px 5%;
				text-align: center;
				position: relative;
				
			}
				#news .flowBox li .img {
					width: 100%;
					height: auto;
					line-height: 0;
				}
				#news .flowBox li .txt {
					width: 100%;
					margin: 15px auto 0 auto;
					line-height: 0;
				}
				

		
					/*===================sp=*/@media screen and (max-width: 860px) {

#news {

}
	#news .newsBox {
		margin: 0 auto 0 auto;
	}
	
	#news h2 {
		width: 11%;
		margin: 0 0 0 0;
	}
	#news .list {
		width: 84%;
		margin: 10px 0 40px 0;
		padding-right: 1%;
		
		height: 10em;
	}
	
	/*スクロールバー全体*/
	#news .list::-webkit-scrollbar {
	    width: 6px;
	}
	
	/*スクロールバーの軌道*/
	#news .list::-webkit-scrollbar-track {
	  border-radius: 0;
	  box-shadow: inset 0 0 6px rgba(0, 0, 0, .1);
	}
	
	/*スクロールバーの動く部分*/
	#news .list::-webkit-scrollbar-thumb {
	  background-color: #000a14;
	  border-radius: 0;
	  box-shadow:0 0 0 1px rgba(255, 255, 255, .3);
	}


		#news .list li {
			font-size: 3.2vw;
			margin: 0 0 .5em 0;
			padding-left: 2%;
				border-bottom: 3px solid #000a14;
				border-right: 3px solid #000a14;
		}
			#news .list li .date {
				width: 10em;
				font-size: 2.6vw;
				padding: 5px 0 10px 0;
			}
			#news .list li .txt {
				padding: 5px 6% 10px 0;
				width: 90%;
				background: url(../img/line_02_b.png) no-repeat right bottom;
				background-size: 4px 100%;
			}

			#news .list li:before {
				content: "";
				width: 4px;
				height: 4px;
				right: 8px;
				top: 8px;
			}
			#news .list li:after {
				content: "";
				width: 4px;
				height: 4px;
				right: 8px;
				bottom: 8px;
			}
			
		#news .flowBox {
			padding: 5% 4% 5% 4%;
			border: 3px solid #000a14;
		}
			#news .flowBox li {
				width: 28%;
				margin: 0 2% 20px 2%;
				
			}
				#news .flowBox li .txt {
					margin: 10px auto 0 auto;
				}
				
			#news .flow:before {
				content: "";
				width: 96%;
				height: 12%;
				background: url(../img/flow_bg_b.png) no-repeat center top;
				background-size: 100% auto;
				position: absolute;
				bottom: 0;
				left: 2%;
			}
	
					}/*====================*/


/*-----------------------------------------------------------
	past setting
-----------------------------------------------------------*/
.past {
	width: 100%;
	max-width: 400px;
	margin: 4% auto 2% auto;
	background: #000000;
	border: 4px solid #000000;

}
	.past p.txt {
		text-align: center;
		font-size: 18px;
		color: #ffffff;
		line-height: 1.4;
		font-weight: bold;
		padding: .4em 0 .4em 0;
	}	
	.past .bnr {
		width: 100%;
		max-width: 100%;
		margin: 0 auto 0 auto;
		line-height: 0;
	}	
	
					/*===================sp=*/@media screen and (max-width: 860px) {

.past {
	width: 70%;
	margin-bottom: 10%;
}
	.past p.txt {
		text-align: center;
		font-size: 3.6vw;
		color: #ffffff;
		line-height: 1.4;
		font-weight: bold;
		padding: 6px 0 10px 0;
	}	

					}/*====================*/
					

/*-----------------------------------------------------------
	#special setting
-----------------------------------------------------------*/
#special {
	
}
	#special .contentBox {
/* 		padding: 10vw 0 2vw 0; */
		padding-bottom: 0;
	}
		#special .contentBox .txt {
			margin: 110px 0 0 0;
			
		-webkit-transform: skewY(1deg);
		-ms-transform: skewY(1deg);
		transform: skewY(1deg);
		}
		#special .contentBox .btnBox {
			margin: 60px 0 0 0;
		}
		#special .contentBox .btnBox .btn {
			width: 100%;
			max-width: 600px;
			height: auto;
			margin: 0 auto 35px auto;
			position: relative;
			cursor: pointer;
		}
			#special .contentBox .btnBox .btn:last-child {
				margin-bottom: 10px;
			}
		#special .contentBox .btnBox .btn.icon_new:before {
			content: "";
			position: absolute;
			right: -40px;
			top: -40px;
			width: 90px;
			height: 100%;
			background: url(../img/icon_new.png) no-repeat right top;
			background-size: 100% auto;
		}
				

					/*===================sp=*/@media screen and (max-width: 860px) {
#special {

}
	#special .contentBox .btnBox {
		margin-top: 10%;
	}
		#special .contentBox .btnBox .btn {
			width: 90%;
			max-width: 90%;
			margin-bottom: 15px;
		}
	#special .contentBox {
		padding: 17vw 0 5vw 0;
	}
		#special .contentBox .btnBox .btn.icon_new:before {
			content: "";
			position: absolute;
			right: -5%;
			top: -1em;
			width: 12%;
			height: 100%;
			background: url(../img/icon_new.png) no-repeat right top;
			background-size: 100% auto;
		}


					}/*====================*/

#cm {
	padding-top: 100px;
}
#cm .movieWrap {
	width: 100%;
	max-width: 600px;
	margin: 60px auto 0 auto;
}
#cm .movieBox {
  position:relative;
  width:100%;
  padding-top:56.25%;
}
#cm .movieBox iframe {
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

					/*===================sp=*/@media screen and (max-width: 860px) {

#cm {
	padding-top: 12%;
}
#cm .movieWrap {
	width: 90%;
	max-width: 600px;
	margin: 30px auto 0 auto;
}



					}/*====================*/

/*-----------------------------------------------------------
	#point setting
-----------------------------------------------------------*/
#point {
	
}
	#point .pointBox {
		width: 100%;
		margin: 30px auto 25px auto;
	}
		#point .pointBox .point {
			line-height: 0;
		}
		#point .pointBox .txt {
			opacity: 0;
		}
		#point .pointBox .point01 {
			padding-top: 28.5%;
			background: url(../img/point_01.png) no-repeat center top;
			background-size: 100% auto;
		}
		#point .pointBox .point02 {
			padding-top: 28.5%;
			background: url(../img/point_02.png) no-repeat center top;
			background-size: 100% auto;
		}
		#point .pointBox .point03 {
			padding-top: 28.5%;
			background: url(../img/point_03.png) no-repeat center top;
			background-size: 100% auto;
			position: relative;
		}
		#point .pointBox .point03 .btn {
			position: absolute;
			right: 0;
			bottom: 0;
			width: 47%;
		}

	#lead .introBox {
		width: 100%;
		max-width: 700px;
		margin: 30px auto 0 auto;
		padding: 20px 0 0 0;
		line-height: 0;
	}

					/*===================sp=*/@media screen and (max-width: 860px) {
	
	#point .contentBox {
		padding: 13vw 0 10vw 0;
	}
		#point .pointBox {
			width: 100%;
			margin: 30px auto 30px auto;
		}
		
	#lead .introBox {
		padding: 10px 0 0 0;
		margin-bottom: 10vw;
		margin-top: 20px
	}


					}/*====================*/

/*-----------------------------------------------------------
	#story setting
-----------------------------------------------------------*/
#story {
	margin: 0 auto 0 auto;
	text-align: center;
}
	#story .contentBox {
		padding-bottom: 0;
	}
	#story h2 {
		margin-top: 40px;
	}
	#story .txtBox {
		font-size: 20px;
		font-weight: bold;
		color: #ffffff;
		line-height: 1.8;
		margin: 50px auto 0 auto;
		padding: 0 25px 0 25px;
		position: relative;
	}
		#story .txtBox .txt {
			position: relative;
			margin: 50px 0 0 0;
		}
		
		
					/*===================sp=*/@media screen and (max-width: 860px) {

	#story .contentBox {
		padding: 8vw 0 10vw 0;
	}
	#story .txtBox {
		width: 106%;
		font-size: 3.2vw;
		line-height: 2;
		margin: 40px auto 0 -3%;
		padding: 0 0 0 0;
		position: relative;
		letter-spacing: -0.02em;
	}
		#story .txtBox .txt {
			position: relative;
			margin: 25px 0 0 0;
		}
		#story .txtBox .img {
			width: 84%;
			margin: 30px auto 0 auto;
		}


					}/*====================*/


/*-----------------------------------------------------------
	#introduction setting
-----------------------------------------------------------*/
#introduction {
	margin: 100px auto 0 auto;
	position: relative;
}
	#introduction .name {
		margin: 60px auto 0 auto;
	}
	#introduction .txtBox {
		font-size: 18px;
		color: #06213f;
		font-weight: bold;
		line-height: 2.2;
		margin: 40px auto 0 auto;
		padding: 0 0 0 0;
		position: relative;
	}
	#introduction .signature {
		max-width: 200px;
		margin: 50px auto 0 auto;
	}
	
#introduction .item {
	width: 23%;
	position: absolute;
	bottom: 0.5vw;
	left: 0;
	z-index: 12;
}
#introduction .item p {
	width: 100%;
	background: url(../img/introduction_deco.png) no-repeat left top;
	background-size: 100% auto;
	padding-top: 108%;
}

.hwWrap {
	position: relative;
}
.hwWrap label {
	width: 100%;
	padding-top: 40%;
	display: block;
	text-align: center;
	background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50%);
	position: absolute;
	z-index: 1;
	bottom: 0;
	cursor: pointer;

}
.hwWrap .hwBox {
	overflow: hidden;
	height: 700px;
	transition: all 0.5s;
}
.hwWrap input:checked + label {
	background: none;
}
.hwWrap label:after {
	content: "続きを読む";
	width: 54%;
	color: #ffffff;
	padding: 20px 0 20px 0;
	background: #0771f9;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-size: 18px;
	font-weight: bold;
	position: absolute;
	margin-left:-27%;
	bottom: 0;
	left: 50%;
	z-index: 2;
	
	background: #0771f9 url(../img/arrow_02_w.svg) no-repeat;
	background-position-x: 90%;
	background-position-y: center;
}
.hwWrap input:checked + label {
}
.hwWrap input:checked + label:after {
	content: "閉じる";
	background: #0771f9 url(../img/arrow_03_w.svg) no-repeat;
	background-position-x: 90%;
	background-position-y: center;
	
}
.hwWrap input:checked ~ .hwBox {
	height: auto;
	padding-bottom: 120px;
	transition: all 0.8s;
}
.hwWrap input { display: none !important; }
		


#story .hwWrap .hwBox {
	overflow: hidden;
	height: 300px;
	transition: all 0.5s;
}
#story .hwWrap label {
	width: 100%;
	padding-top: 40%;
	display: block;
	text-align: center;
	background: none;
	position: absolute;
	z-index: 1;
	bottom: 0;
	cursor: pointer;
}
#story .hwWrap input:checked ~ .hwBox {
	height: auto;
	padding-bottom: 120px;
	transition: all 0.8s;
}

					/*===================sp=*/@media screen and (max-width: 860px) {


	#introduction .contentBox {
		padding: 14vw 0 27vw 0;
	}

	#introduction .name {
		margin: 30px auto 0 auto;
	}
	#introduction .name img {
		width: 130%;
		margin-left: -15%;
	}
	#introduction .txtBox {
		font-size: 3.4vw;
		margin: 20px auto 0 auto;
	}
	#introduction .signature {
		margin: 50px auto 0 auto;
	}

.hwWrap .hwBox {
	height: 350px;
}
.hwWrap label:after {
	content: "続きを読む";
	width: 60%;
	padding: 8px 0 8px 0;
	font-size: 3.4vw;
	position: absolute;
	margin-left:-30%;
	bottom: 0;
	left: 50%;
	z-index: 2;
	
	background: #0771f9 url(../img/arrow_02_w.svg) no-repeat;
	background-size: 5% auto;
	background-position-x: 90%;
	background-position-y: center;
}

#introduction .item {
	width: 42%;
	position: absolute;
	bottom: -11vw;
	left: -12%;
	z-index: 12;
}
#introduction .item p {
	width: 100%;
	background: url(../img/introduction_deco.png) no-repeat left top;
	background-size: 100% auto;
	padding-top: 129%;
}

#story .hwWrap .hwBox {
	height: 55vw;
}

#story .hwWrap input:checked ~ .hwBox {
	padding-bottom: 20vw;
}
	
					}/*====================*/
					

					
/*-----------------------------------------------------------
	#howto setting
-----------------------------------------------------------*/
#howto {
}
	#howto .contentBox {
		max-width: 1000px;
		padding-top: 10vw;
	}
	#howto h2 {
		margin-bottom: 50px;
	}
	
		#howto .howtoBox {
			width: 100%;
			margin: 30px auto 5vw auto;
			
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-pack: justify;
			-ms-flex-pack: justify;
			justify-content: space-between;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			
		}
			#howto .howtoBox li {
				width: 48%;
				margin: 0 0 40px 0;
				background: #fff6f5;
				text-align: center;
				position: relative;
				
			}

			#howto .howtoBox li:before {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				right: 10px;
				bottom: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			#howto .howtoBox li:after {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				left: 10px;
				bottom: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			#howto .howtoBox li .txtBox:before {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				right: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			#howto .howtoBox li .txtBox:after {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				left: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			
				#howto .howtoBox li .txtBox {
					padding: 10px 6% 10px 6%;
					position: relative;
				}
				#howto .howtoBox li .txtBox .tit {
					font-size: 20px;
					color: #06213f;
					font-weight: bold;
				}
				#howto .howtoBox li .txtBox .img {
					line-height: 0;
					margin-top: 20px;
				}
				#howto .howtoBox li .txtBox .txt {
					font-size: 16px;
					color: #06213f;
					margin-top: 15px;
					font-weight: bold;
				}
				#howto .howtoBox li .txtBox .spe {
					height: 40px;
				}
			#howto .howtoBox li .btn {
				width: 70%;
				font-size: 20px;
				color: #ffffff;
					background: #0771f9;
					position: absolute;
					display: block;
					bottom: -25px;
					left: 50%;
					margin-left: -35%;
					border-radius: 3px;
					-webkit-border-radius: 3px;
					-moz-border-radius: 3px;
			}
				#howto .howtoBox li .btn a {
					display: block;
					padding: 10px 0 10px 0;
					color: #ffffff;
					text-decoration: none;
							
				}
				

		#howto .firstBox {
			width: 90%;
			max-width: 700px;
			margin: 70px auto 0 auto;
			padding: 30px 0 30px 0;
			background: #fffcf2;
			text-align: center;
			
		}
			#howto .firstBox .icon {
				width: 16%;
				margin: 0 auto 0 auto;
			}
			#howto .firstBox .tit {
				color: #06213f;
				font-size: 30px;
			}
			#howto .firstBox .txt {
				color: #06213f;
				font-size: 16px;
			}



					/*===================sp=*/@media screen and (max-width: 860px) {

	#howto .contentBox {
		padding: 3vw 0 0 0;
	}

	#howto h2 {
		margin-bottom: 0;
	}
		#howto .howtoBox {
			width: 80%;
			margin: 20px auto 0 auto;
			display: block;
			
		}
			#howto .howtoBox li {
				width: 100%;
				margin: 0 0 40px 0;
			}
				#howto .howtoBox li .txtBox {
					padding: 10px 6% 10px 6%;
				}
				#howto .howtoBox li .txtBox .tit {
					font-size: 3.4vw;
				}
				#howto .howtoBox li .txtBox .txt {
					font-size: 3.4vw;
					margin-top: 15px;
				}
				#howto .howtoBox li .txtBox .spe {
					height: 5vw;
				}
			#howto .howtoBox li .btn {
				width: 70%;
				font-size: 3.4vw;
					bottom: -15px;
					left: 50%;
					margin-left: -35%;
			}
				#howto .howtoBox li .btn a {
					padding: 5px 0 5px 0;
				}
				


		#howto .firstBox {
			width: 100%;
			margin: 50px auto 0 auto;
			padding: 20px 0 20px 0;
			background: #fffcf2;
			text-align: center;
			
		}
			#howto .firstBox .icon {
				width: 25%;
				margin: 0 auto 0 auto;
			}
			#howto .firstBox .tit {
				width: 93%;
				margin: 0 auto;
				font-size: 4vw;
				font-weight: bold;
			}
			#howto .firstBox .txt {
				width: 93%;
				margin: 10px auto 0 auto;
				font-size: 3.4vw;
			}

					}/*====================*/
					

					
/*-----------------------------------------------------------
	#ticket setting
-----------------------------------------------------------*/
#ticket {
	
}
/*
	#ticket .contentWrap.slanting01 {
		padding-bottom: 5vw
	}
*/
	#ticket #sale .contentBox {
		padding-top: 5vw;
		padding-bottom: 3vw;
	}
	#ticket .txtBox {
		margin-bottom: 0;
	}
	
	#ticket .txtBox .txt2 {
		padding: 20px 5% 20px 5%;
		margin: 40px auto 0 auto;
		background: rgba(255, 255, 255, 0.30);
	}
		#ticket .txtBox .txt2 .note {
		}
	
	#ticket .btnbox {
		margin: 40px auto 0 auto;
	}
	#ticket .btn {
		width: 90%;
		max-width: 564px;
		margin-bottom: 15px;
	}
	
			#ticket .privilegeWrap .btn {
				width: 20em;
				max-width: 100%;
				font-size: 20px;
				color: #ffffff;
				text-align: center;
					background: #0771f9;
					display: block;
					margin: 20px auto 40px auto;
					border-radius: 3px;
					-webkit-border-radius: 3px;
					-moz-border-radius: 3px;
					font-weight: bold;
			}
				#ticket .privilegeWrap .btn a {
					display: block;
					padding: 10px 0 10px 0;
					color: #ffffff;
					text-decoration: none;
							
				}

#ticket .ticketlistBox {
	position: relative;
	margin: 20px auto 0 auto;
	padding: 8% 0 0 0;
}
#ticket .ticketlistBox.v02 {
	margin-top: 0;
	padding-top: 8%;
}
#ticket .ticketlistBox .tit {
	position: absolute;
	left: -5%;
	top: 0;
	width: 32%;
}
#ticket table {
	margin: 0 auto 20px auto;
	width: 100%;
	border-collapse: separate;
	border-spacing: 0;
	border-right: 3px solid #ff4b42;
	border-bottom: 3px solid #ff4b42;
/* 	font-weight: bold; */
}
#ticket .ticketlistBox.v02 table {
	margin-bottom: 50px;
}
#ticket table tbody {
}
#ticket table tr {
}
#ticket table th,
#ticket table td {
	text-align: center;
	vertical-align: middle;
	background: #ffd9d7;
/* 	padding: 18px 0 18px 0; */
	padding: 0.5em 0 0.5em 0;
	font-size: 16px;
	line-height: 1.2;
	color: #000000;
	border-top: 3px solid #ff4b42;
	border-left: 3px solid #ff4b42;
	font-weight: normal;
}
	#ticket table th span,
	#ticket table td span {
		font-size: 12px;
	}
	#ticket table .txt {
		width: 25%;
	}
	#ticket table th.cl,
	#ticket table td.cl {
		background: #ffffff;
		border: none;
	}
	#ticket table .w01 {
		width: 14.5%;
	}
	#ticket table .w02 {
		width: 28.5%;
	}
	
	#ticket table .c01 {
		background: #ffd9d7;
	}
	#ticket table .c02 {
		background: #ffffff;
	}
	#ticket table .c03 {
		background: #ff624d;
		color: #fffbe0;
		line-height: 1;
	}
	#ticket table .c04 {
		background: #fffbe0;
	}
	
	#ticket table .l01 {
		border-left: 3px solid #ff4b42;
	}
	#ticket table thead th,
	#ticket .ticketBox li table .txt {
		color: #000000;
		font-size: 16px;
	}
	#ticket table th.f02, #ticket table td.f02 {
		color: #000000;
		font-size: 22px;
		font-weight: 400;
/* 		padding: 30px 0 30px 0; */
	}

#ticket .systemBox {
	margin: 40px auto 0 auto;
	border: 3px solid #0671ff;
	padding: 40px 5% 5px 5%;
	text-align: left;
	font-weight: bold;
}
	#ticket .systemBox .txt {
		color: #06213f;
		font-size: 15px;
		margin-bottom: 35px;
	}
	#ticket .systemBox .txt span {
		color: #06213f;
		font-size: 13px;
	}
	#ticket .systemBox .txt span.note {
		color: #375e8a;
		font-size: 13px;
	}


#ticket #sale h3 {
	color: #fffbe0;
	font-size: 30px;
	text-align: center;
	margin-bottom: 40px;
}

#ticket #sale h4 {
	color: #ffffff;
	font-size: 25px;
	text-align: center;
	margin-bottom: 40px;
}

	#ticket #sale .txtBox {
		max-width: 600px;
		border: 3px solid #ffffff;
		color: #ffffff;
		margin: 30px auto 0 auto;
		background: #000000;
	}
		#ticket #sale .txtBox .tit {
			padding: 5px 0 8px 0;
			background: #ffffff;
			font-size: 18px;
			color: #000000;
			font-weight: bold;
			text-align: center;
		}
		#ticket #sale .txtBox .txt {
			padding: 12px 0 10px 0;
			font-size: 18px;
			color: #e49516;
			font-weight: bold;
			text-align: center;
		}
			#ticket #sale .txtBox .txt a {
				color: #e49516;
			}
		#ticket #sale .txtBox .btn {
			padding: 7px 0 5px 0;
			font-size: 18px;
			color: #e49516;
			font-weight: bold;
			text-align: center;
		}
		
#ticket .info {
	width: 100%;
	margin: 0 auto 30px auto;
}
	#ticket .info div {
		padding: 20px 5% 20px 5%;
		margin: 0 auto 0 auto;
		border: 3px solid #e62a05;
	}
	#ticket .info .h3 {
		font-size: 22px;
		font-weight: 700;
		color: #e00000;
		text-align: center;
	}
	#ticket .info .txt {
		margin-top: 10px;
		font-size: 14px;
		font-weight: bold;
	}
	
	#ticket .info.infoate div {
		border: 3px solid #ff6b00;
	}
	#ticket .info.infoate .h3 {
		font-size: 22px;
		font-weight: 700;
		color: #ff6b00;
	}
	#ticket .info.infoate .txt span {
		color: #ff6b00;
	}
	
	#ticket .info.infogp div {
		border: 3px solid #0671ff;
	}
	#ticket .info.infogp .h3 {
		font-size: 22px;
		font-weight: 700;
		color: #0671ff;
	}
	
	#ticket .info.infogoto div {
		border: 3px solid #ff4b42;
	}
	#ticket .info.infogoto .h3 {
		font-size: 22px;
		font-weight: 700;
		color: #ff4b42;
	}
	#ticket .info.infogoto .note {
		color: #000000;
	}
	
	#ticket .info.premium div {
		border: 3px solid #c01b85;
	}
	#ticket .info.premium .h3 {
		font-size: 22px;
		font-weight: 700;
		color: #c01b85;
	}
	#ticket .info.premium span {
		color: #c01b85;
		font-size: 18px;
	}
	#ticket .info.premium table {
		margin-bottom: 20px;
	}
	#ticket .info.premium .note {
		color: ;
	}
	#ticket .info.premium .img {
		margin-top: 1em;
	}

#ticket .note {
	margin: 30px auto 30px auto;
	width: 100%;

}

#ticket .privilegeWrap {
	margin: 80px auto 0 auto;
	width: 100%;

}
#ticket .privilegeWrap h3 {
	font-size: 30px;
}
#ticket .privilegeWrap p {
	margin-top: 20px;
}

#ticket .ticketWrap .detailsBox .details h4 {
	line-height: 1.8;
	overflow: hidden;
}
#ticket .ticketWrap .detailsBox .details a.scrap {
position: relative;
/* top: 0; */
/* right: 0; */
padding-right: 15px;
color: #0e70bb;
font-size: 15px;
margin-left: 1em;
margin-top: 0px;
float: right;
}
#ticket .ticketWrap .detailsBox .details ul li .scheduleBox .state {
	font-size: 80%;
}
	
					/*===================sp=*/@media screen and (max-width: 860px) {
						
#ticket .contentWrap.slanting01 {
	padding-bottom: 15vw;
}

#ticket #sale h3 {
	font-size: 5vw;
}
#ticket #sale h4 {
	margin-top: 6vw;
	font-size: 4.4vw;
}

#ticket .ticketlistBox {
	position: relative;
	margin: 30px auto 0 auto;
	padding: 10% 0 0 0;
}
#ticket .ticketlistBox .tit {

}
#ticket table {
	margin: 0 auto 30px auto;
	width: 100%;
	border-right: 2px solid #ff4b42;
	border-bottom: 2px solid #ff4b42;
}
#ticket table th,
#ticket table td {
	text-align: center;
	vertical-align: middle;
	background: #ffd9d7;
/* 	padding: 12px 0 12px 0; */
	font-size: 2.8vw;
	line-height: 1.2;
	color: #000000;
	border-top: 2px solid #ff4b42;
	border-left: 2px solid #ff4b42;
}
	#ticket table th span,
	#ticket table td span {
		font-size: 2.8vw;
	}
	#ticket table .txt {
		width: 28%;
	}
	#ticket table th.cl,
	#ticket table td.cl {
		background: #ffffff;
		border: none;
	}
	#ticket table .l01 {
		border-left: 3px solid #ff4b42;
	}
	#ticket table thead th,
	#ticket table thead td {
		padding: 5px 0 5px 0;
	}
	#ticket table thead th,
	#ticket .ticketBox li table .txt {
		color: #000000;
		font-size: 2.8vw;
/* 		font-weight: bold; */
	}
#ticket table th.f02, #ticket table td.f02 {
	font-size: 3.6vw
}
	
#ticket .systemBox {
	margin: 20px auto 0 auto;
	border: 2px solid #0671ff;
	padding: 30px 5% 5px 5%;
	text-align: left;
	font-weight: bold;
}
	#ticket .systemBox .txt {
		color: #06213f;
		font-size: 3.4vw;
		margin-bottom: 35px;
	}
	#ticket .systemBox .txt span {
		font-size: 2.6vw;
	}
	#ticket .systemBox .txt span.note {
		font-size: 2.6vw;
	}
	 
#ticket #sale .contentBox {
	padding-top: 8vw;
	margin-bottom: 8vw;
}
#ticket #sale h3 {
	margin-bottom: 0;
	font-size: 5vw;
}
	#ticket #sale .txtBox {
		margin-top: 20px;
	}
		#ticket #sale .txtBox .tit {
			padding: 5px 0 8px 0;
			background: #ffffff;
			font-size: 3.4vw;
			color: #06213f;
			font-weight: bold;
			text-align: center;
		}
		#ticket #sale .txtBox .txt {
			padding: 7px 0 10px 0;
			font-size: 3.6vw;
		}
		
#ticket .note {
	margin-top: 0;
}

#ticket .info {
	width: 100%;
	margin: 0 auto 30px auto;
}
	#ticket .info .h3 {
		font-size: 3.6vw;
	}
	#ticket .info p {
		font-size: 3.4vw;
/*
		padding: 30px 5% 30px 5%;
		margin: 0 auto 0 auto;
		border: 3px solid #e62a05;
*/
	}
	#ticket .info span {
		font-size: 3.4vw;
		font-weight: 700;
		color: #e00000;
	}
	#ticket .info.infogoto .h3 {
		font-size: 3.8vw;
	}
	#ticket .info.premium .h3 {
		font-size: 4.0vw;
	}
	#ticket .info.infoate .h3 {
		font-size: 4.0vw;
	}
	#ticket .info.premium span {
		font-size: 14px;
		font-weight: 700;
		color: #c01b85;
	}
	#ticket .info .txt {
		font-size: 3.4vw;
	}
#ticket .privilegeWrap {
	margin: 70px auto 50px auto;
	width: 100%;

}
#ticket .privilegeWrap h3 {
	font-size: 5vw;
}
#ticket .privilegeWrap p {
	margin-top: 15px;
}

			#ticket .privilegeWrap .btn {
				font-size: 3.4vw;

				margin: 20px auto 40px auto;
			}
				#ticket .privilegeWrap .btn a {
					padding: 8px 0 8px 0;
				}
				
#ticket .ticketWrap .naviBox ul li .scheduleBox {
	width: 100%;
}

#ticket #sale .txtBox .btn {
	width: 90%;
}
#ticket .ticketWrap .detailsBox .details ul li .scheduleBox .state {
	font-size: 2vw;
}
.ticketWrap .detailsBox .details ul li .scheduleBox .time {
	font-size: 2vw;
}
					}/*====================*/
					
/*-----------------------------------------------------------
	#schedule setting
-----------------------------------------------------------*/
#schedule {
	
}
	#schedule .contentBox {
		max-width: 750px;
	}

#ticket #schedule h3 {
	color: #ffffff;
	font-size: 30px;
	text-align: center;
	margin-bottom: 40px;
}
		#ticket #schedule .adBox {
			position: relative;
		}
		#ticket #schedule .icon:before {
			content: "";
			position: absolute;
			right: -30px;
			top: -20px;
			width: 90px;
			height: 100%;
			background: url(../img/icon_new.png) no-repeat right top;
			background-size: 100% auto;
			z-index: 10;
		}
		#ticket #schedule .icon_hold:before {
			content: "";
			position: absolute;
			right: -30px;
			top: -20px;
			width: 90px;
			height: 100%;
			background: url(../img/icon_hold.png) no-repeat right top;
			background-size: 100% auto;
			z-index: 10;
		}
		#ticket #schedule .icon_sale:before {
			content: "";
			position: absolute;
			right: -30px;
			top: -20px;
			width: 90px;
			height: 100%;
			background: url(../img/icon_sale.png) no-repeat right top;
			background-size: 100% auto;
			z-index: 10;
		}
		#ticket #schedule .icon_end:before {
			content: "";
			position: absolute;
			right: -30px;
			top: -20px;
			width: 90px;
			height: 100%;
			background: url(../img/icon_end.png) no-repeat right top;
			background-size: 100% auto;
			z-index: 10;
		}

#schedule .place {
	color: #000000;
	font-size: 22px;
	line-height: 1.4;
	font-weight: bold;
}
	#schedule .place span {
		color: #e90000;
	}
#schedule .date {
	color: #000000;
	font-size: 16px;
	font-weight: bold;
/* 	line-height: 1.2; */
}
#schedule .date .del {
	background: url(../img/delbg.png) repeat-x  left center;
	background-size: auto 30%;
}

#schedule .date.date2 {
	line-height: 1.2;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

#schedule .scheduledBox {
	width: 86%;
	margin: 0 auto 0 auto;
	padding: 0 0 30px 0;
	color: #000000;
}

	#schedule .scheduledBox .mapBox {
	}
	#schedule .scheduledBox .maptxt {
		margin: 18px auto 0 auto;
		text-align: left;
		line-height: 1.3;
		font-size: 12px;
		padding-bottom: 20px;
		border-bottom: 2px solid #000000;
	}
		#schedule .scheduledBox .maptxt a {
			color: #000000;
		}
	#schedule .ticketbuyBox {
		padding: 20px 0 0 0;
	}
		#schedule .ticketbuyBox .tictit,
		#schedule .ticketbuyBox2 .tictit {
			color: #000000;
			font-size: 18px;
			text-align: center;
			font-weight: bold;
		}
		#schedule .ticketbuyBox .note {
			color: #000000;
			font-size: 12px;
			text-align: left;
			margin: 10px 0 10px 0;
		}
		
	#schedule .ticketbuyBox2 {
		padding: 20px 0 0 0;
	}
	
	#schedule .scheduledBox .creditBox {
		margin: 20px auto 0 auto;
		text-align: left;
		line-height: 1.3;
		font-size: 12px;
	}
	
					/*===================sp=*/@media screen and (max-width: 860px) {

#schedule {
	margin-top: 0 !important;
	background-image: url(../img/bg08.png) !important;
	background-size: 100% auto;
}

#ticket #schedule h3 {
	font-size: 5vw;
	margin-bottom: 20px;
}
#schedule .place {
	font-size: 4.4vw;
	font-weight: bold;
}
#schedule .date {
	color: #000000;
	font-size: 3.4vw;
	font-weight: bold;
}


	#schedule .scheduledBox .maptxt {
		margin: 18px auto 0 auto;
		text-align: left;
		line-height: 1.3;
		font-size: 3.4vw;
		padding-bottom: 20px;
		border-bottom: 2px solid #000000;
	}
		#schedule .scheduledBox .maptxt a {
			text-decoration: underline;
		}
	#schedule .ticketbuyBox {
		padding: 16px 0 0 0;
	}
		#schedule .ticketbuyBox .tit,
		#schedule .ticketbuyBox2 .tit {
			font-size: 4.4vw;
		}
		#schedule .ticketbuyBox .note {
			font-size: 3.0vw;
			margin: 10px 0 10px 0;
		}
		
	#schedule .scheduledBox .creditBox {
		margin: 20px auto 0 auto;
		text-align: left;
		line-height: 1.3;
		font-size: 3.4vw;
	}
	.mapBox iframe {
		 height: 150px;
	 }
	 
		#ticket #schedule .icon:before {
			content: "";
			position: absolute;
			right: -20px;
			top: -20px;
			width: 60px;
			height: 100%;
			background: url(../img/icon_new.png) no-repeat right top;
			background-size: 100% auto;
		}
		#ticket #schedule .icon_hold:before {
			content: "";
			position: absolute;
			right: -20px;
			top: -20px;
			width: 60px;
			height: 100%;
			background: url(../img/icon_hold.png) no-repeat right top;
			background-size: 100% auto;
		}
		#ticket #schedule .icon_sale:before {
			content: "";
			position: absolute;
			right: -20px;
			top: -20px;
			width: 60px;
			height: 100%;
			background: url(../img/icon_sale.png) no-repeat right top;
			background-size: 100% auto;
		}

					}/*====================*/
					

/*----------------------------------tab setting----------*/
.tabWrap {
	width: 100%;
	height: auto;
}

input[type="submit"] {
-webkit-appearance: none;
border-radius: 0;
}

	.tabbtn {
		width: auto;
		font-size: 20px;
/* 		transition: all 0.2s ease; */
	}
	input[name="tabbtn"] { display: none !important; }
	
	.tabBox {
		width: 100%;
		background: #ffffff;
		display: none;
	}
	#area01:checked ~ #area01Box,
	#area02:checked ~ #area02Box,
	#area03:checked ~ #area03Box,
	#area04:checked ~ #area04Box {
		display: block;
	}
	.tabWrap input:checked + .tabbtn {
		background: #000000;
		color: #ffffff;
	}

/*----------------------------------adWrap setting----------*/
.adWrap {
	text-align: center;
}
	.adWrap .adBox {
		margin: 0 0 30px 0;
		background: #ffc300;
/*
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
*/
/* 		overflow: hidden; */
	}
	
	.adWrap .adBoxEnd {
		margin: 0 0 30px 0;
		background: #999;
		position: relative;
/*
		border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
*/
/* 		overflow: hidden; */
	}
			
	.adWrap .adBtn {
		cursor: pointer;
		padding: 14px 10px 10px 10px;
		position: relative;
	}
	
	.adWrap .adBoxEnd .adBtn {
		cursor: default;
		padding: 14px 10px 0 10px;
		position: relative;
	}

			.adWrap .adBtn:before {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				right: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			.adWrap .adBtn:after {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				left: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			
	.adWrap .adopBox {
		display: none;
		padding: 10px 0;
		position: relative;
	}
	.adWrap .arrow {
		position: relative;
		cursor: pointer;
		background: #cda10a;
		padding: 5px 0 5px 0;
/*
		border-radius: 0 0 10px 10px;
		-webkit-border-radius: 0 0 10px 10px;
		-moz-border-radius: 0 0 10px 10px;
*/
	}
	
	.adWrap .adBoxEnd .arrow {
		position: relative;
		cursor: default;
		background: none;
		padding: 5px 0 5px 0;
/*
		border-radius: 0 0 10px 10px;
		-webkit-border-radius: 0 0 10px 10px;
		-moz-border-radius: 0 0 10px 10px;
*/
	}
			.adWrap .arrow:before {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				right: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			.adWrap .arrow:after {
				content: "";
				background: #000a14;
				width: 8px;
				height: 8px;
				position: absolute;
				left: 10px;
				top: 10px;
				border-radius: 50%;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
			}
			
		.adWrap .arrow p {
		-webkit-transform: rotate(-180deg);
		-moz-transform: rotate(-180deg);
		filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
			background: url(../img/arrow_01_w.svg) no-repeat center center;
			padding-top: 20px;
		}
		
		.adWrap .adBoxEnd .arrow p {
			-webkit-transform: rotate(-180deg);
			-moz-transform: rotate(-180deg);
			filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
				background: none;
				padding-top: 20px;
			}
		
	.adWrap .arrow.op {
		-webkit-transform: rotate(-180deg);
		-moz-transform: rotate(-180deg);
		filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);	
/*
		border-radius: 10px 10px 0 0 ;
		-webkit-border-radius: 10px 10px 0 0;
		-moz-border-radius: 10px 10px 0 0;
*/
	}
	
	
	.adWrap .adBox.tyB {
		margin: 0 0 30px 0;
		background: none;
		border-radius: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		overflow: hidden;
	}
	
	.adWrap .adBox.tyB .adBtn {
		width: 20em;
		cursor: pointer;
		padding: 10px;
		color: #ffffff;
		font-size: 20px;
		margin: 0 auto 0 auto;
		
		padding: 15px 0 15px 0;
		
		font-weight: bold;
		border-radius: 0px;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		background: #0671ff url(../img/arrow_02_w.svg) no-repeat;
		background-size: 5% auto;
		background-position-x: 95%;
		background-position-y: center;
	}
		.adWrap .adBox.tyB .adBtn:before,
		.adWrap .adBox.tyB .adBtn:after {
			display: none;
		}
	.adWrap .adBox.tyB .adBtn.op {
		background: #0671ff url(../img/arrow_03_w.svg) no-repeat;
		background-size: 5% auto;
		background-position-x: 95%;
		background-position-y: center;
	}
		.adWrap .adBox.tyB .adBtn p {
			margin-right: 2em
		}


					/*===================sp=*/@media screen and (max-width: 860px) {


.adWrap {
	text-align: center;
}
	.adWrap .adBox {
		margin: 0 0 30px 0;
	}
	.adWrap .adBtn {
		cursor: pointer;
		padding: 10px;

	}
	.adWrap .adopBox {
		display: none;
		padding: 10px 0;
		position: relative;
	}
	.adWrap .arrow {
		cursor: pointer;
		padding: 2px 0 2px 0;
	}

	#ticket .btnbox {
		margin: 20px auto 0 auto;
	}
	#ticket .btn {
		width: 100%;
		max-width: 100%;
		margin-top: 10px;
		margin-bottom: 0;
	}

	.adWrap .adBox.tyB .adBtn {
		width: 20em;
		cursor: pointer;
		padding: 10px;
		color: #ffffff;
		font-size: 3.4vw;
		margin: 0 auto 0 auto;
		padding: 10px 0 10px 0;
		background: #0671ff url(../img/arrow_02_w.svg) no-repeat;
		background-size: 5% auto;
		background-position-x: 95%;
		background-position-y: center;
	}
		
					}/*====================*/
					

/*-----------------------------------------------------------
	#event setting
-----------------------------------------------------------*/

#schedule #ticket_api .contentBox {
	width: 100%;
	padding: 0 0 0 0;
}

#schedule #ticket_api .date {
	color: #000000;
}

#schedule #ticket_api {
	color: #000000;
}
/*
#event {
}

._scheduler_container ._calendar_container ._calendar_main .preMonth {
	color: #2975e2 !important;
}
._scheduler_container ._calendar_container ._calendar_main .nextMonth {
	color: #2975e2 !important;
}
._scheduler_container ._scheduler_event_wrapper ._scheduler_event_timeSet_pc {
	margin-bottom: 15px;
}
._scheduler_container {
	margin-bottom: 60px !important;
}
*/
					/*===================sp=*/@media screen and (max-width: 860px) {

/*
._scheduler_container {
	margin-bottom: 30px !important;
}
*/

					}/*====================*/
					
					
/*-----------------------------------------------------------
	.faq setting
-----------------------------------------------------------*/

#question,
#limit {
	position: relative;
}
.faq .contentBox {
	padding-top: 4%;
	padding-bottom: 8%;
}
#limit .contentBox {
	padding-top: 0;
}
#attention .contentBox {
}

.faq.contentWrap.slanting00 {
	padding-bottom: 0;
	padding-top: 10%;
}
.faq .contentBox h2 {
	margin-bottom: 0;
}

.faq .contentBox h3 {
	width: 100%;
	padding-top: 40px;
}

	.faq .faqWrap {
		width: 100%;
		max-width: 700px;
		padding: 0 0 30px 0;
		text-align: left;
		margin: 0 auto 0 auto;
		background: #dcf2ea;
		border: 3px solid #dcf2ea;
	}

		.faq .faqWrap .faqBox {
			width: 90%;
			max-width: 660px;
			margin: 30px auto 0 auto;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
		}
		.faq .faqWrap .head {
			width: 25%;
			font-size: 16px;
			color: #000000;
			font-weight: bold;
			border-right: 2px solid #000000;
		}
		.faq .faqWrap ul {
			width: 72%;
			margin-left: 3%;
			color: #000000;
			
		}
			.faq .faqWrap ul li {
				width: 100%;
				padding: 0 0 30px 0;
				font-weight: bold;
			}
			.faq .faqWrap ul li .tit {
				color: #000000;
				font-size: 16px;
				margin-bottom: 15px;
			}
			.faq .faqWrap ul li .q {
				font-size: 16px;
				display: block;
				padding-left: 2em;
				margin: 0 0 2% 0;
			}
			.faq .faqWrap ul li .q::before {
				content: "Q：";
				display: block;
				float: left;
				margin-left: -2em;
				width: 2em;
				text-align: center;
				color: #ff2b04;
				font-weight: bold;
			}
			.faq .faqWrap ul li .a {
				font-size: 16px;
				line-height: 1.8;
				display: block;
				padding-left: 2em;
			}
			.faq .faqWrap ul li .a::before {
				content: "A：";
				font-size: 16px;
				display: block;
				float: left;
				margin-left: -2em;
				width: 2em;
				text-align: center;
				color: #000000;
				font-weight: bold;
			}
			.faq .faqWrap ul li .n {
				font-size: 16px;
				line-height: 1.8;
				color: #000000;
				display: block;
				padding-left: 1.5em;
				margin: 0 0 0 0;
				font-weight: bold;
				margin-bottom: 20px;
			}
			.faq .faqWrap ul li .n::before {
				content: "・";
				font-size: 16px;
				font-weight: bold;
				display: block;
				float: left;
				margin-left: -1.5em;
				width: 1em;
				text-align: center;
			}
			.faq .faqWrap ul li .n:last-child {
				margin-bottom: 0;
			}
				.faq .faqWrap .bnr {
					width: 100%;
					max-width: 250px;
					margin: 0 auto 0 auto;
				}
				.faq .faqWrap .note {
					font-size: 14px;
					color: #444444;
				}
				.faq .faqWrap a {
					color: #000000;
					text-decoration: underline;
				}
				.faq .faqWrap a:hover {
					text-decoration: none;
				}
				
				
		.faq #question .faqWrap .faqBox ul {
			width: 100%;
			margin: 0 0 0 0;
		}
		.faq #question .faqWrap .faqBox ul li {
			border-bottom: 2px solid #000000;
			margin-bottom: 30px;
		}
		.faq #question .faqWrap .faqBox ul li:last-child {
			border-bottom: none;
			margin-bottom: 0;
		}
		.faq #limit .faqWrap .faqBox {
			display: block;
		}
		.faq #limit .faqWrap .head {
			width: 100%;
		}

	.faq .faqWrap .faqlist {
		width: 100%;
		margin: 20px auto 0 auto;
	}
		.faq .faqWrap .faqlist li {
			width: 100%;
			margin: 0 0 0 0;
			padding: 0 0 10px 0;
			display: flex;
			justify-content: space-between;
			text-align: left;
		}
		.faq .faqWrap .faqlist li:last-child {
			margin-bottom: 0;
		}
			.faq .faqWrap .faqlist .tit {
				width: 24%;
				padding: 15px 3% 15px 3%;
				color: #000000;
				font-size: 16px;
				background: #ffffff;
				margin: 0 0 0 0;
			}
			.faq .faqWrap .faqlist .txt {
				width: 62.5%;
				margin-left: 1.5%;
				font-size: 16px;
				font-weight: bold;
				padding: 15px 3% 15px 3%;
				background: #ffffff;
				color: #000000;
			}
			.faq .faqWrap .faqlist .txt span {
				font-size: 14px;
				color: #444444;
			}

	
					/*===================sp=*/@media screen and (max-width: 860px) {

.faq {
	margin: 0 auto 0 auto;
	padding: 5vw 0 0 0;
}
.faq .contentBox {
	margin-top: 0;
}
v h2 img {
	width: 100%;
	margin-left: 0;
}
.faq .contentBox h3 {
	margin-top: 0;
}
.faq .contentBox h3 img {
	width: 120%;
	margin-left: -10%;
}
	.faq .faqWrap {
		padding: 0 0 20px 0;
	}

		.faq .faqWrap .faqBox {
			width: 90%;
			max-width: 660px;
			margin: 25px auto 0 auto;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			display: block;
		}
		
		.faq .faqWrap .head {
			width: 100%;
			margin-bottom: 3%;
			margin-top: 15px;
			font-size: 4vw;
			text-align: center;
			border-right: none;
			border-bottom: 2px solid #000000;
		}
		.faq .faqWrap ul {
			width: 100%;
			margin-left: 0;
		}
		
			.faq .faqWrap ul li {
				width: 100%;
				padding: 0 0 10px 0;
			}
			.faq .faqWrap ul li .tit {
				font-size: 3.4vw;
				font-weight: bold;
				margin-bottom: 10px;
			}
			.faq .faqWrap ul li .q {
				font-size: 3.4vw;
				display: block;
				padding-left: 2em;
				margin: 0 0 2% 0;
			}
			.faq .faqWrap ul li .q::before {
				content: "Q：";
				display: block;
				float: left;
				margin-left: -2em;
				width: 2em;
				text-align: center;
			}
			.faq .faqWrap ul li .a {
				font-size: 3.4vw;
				line-height: 1.8;
				display: block;
				padding-left: 2em;
			}
			.faq .faqWrap ul li .a::before {
				content: "A：";
				font-size: 3.4vw;
				display: block;
				float: left;
				margin-left: -2em;
				width: 2em;
				text-align: center;
			}
			.faq .faqWrap ul li .n {
				font-size: 3.4vw;
				line-height: 1.8;
				display: block;
				padding-left: 1.5em;
				margin: 0 0 0 0;
				margin-bottom: 20px;
			}
			.faq .faqWrap ul li .n::before {
				content: "・";
				font-size: 3.4vw;
				font-weight: bold;
				display: block;
				float: left;
				margin-left: -1.5em;
				width: 1em;
				text-align: center;
			}
				.faq .faqWrap .note {
					font-size: 3.4vw;
				}
			
	.faq .faqWrap .faqlist {
		width: 100%;
		margin: 20px auto 0 auto;
	}
		.faq .faqWrap .faqlist li {
			width: 100%;
			margin: 0 0 0 0;
			padding: 0 0 10px 0;
			display: flex;
			justify-content: space-between;
			text-align: left;
		}
		.faq .faqWrap .faqlist li:last-child {
			margin-bottom: 0;
		}
			.faq .faqWrap .faqlist .tit {
				width: 24%;
				padding: 15px 3% 15px 3%;
				font-size: 3.4vw;
				margin: 0 0 0 0;
			}
			.faq .faqWrap .faqlist .txt {
				width: 62.5%;
				margin-left: 1.5%;
				font-size: 3.4vw;
				padding: 15px 3% 15px 3%;
			}
			.faq .faqWrap .faqlist .txt span {
				font-size: 3.4vw;
			}
			
					}/*====================*/


/*-----------------------------------------------------------
	.goods setting
-----------------------------------------------------------*/
.goods.contentWrap.slanting00 {
	padding-bottom: 0;
	padding-top: 10%;
}
.goods .contentBox h3 {
	width: 100%;
	margin-top: 10px;
}
.goods .contentBox {
	padding-top: 4%;
	padding-bottom: 8%;
}

	.goods .goodsWrap {
		width: 100%;
		max-width: 700px;
		padding: 0 0 50px 0;
		text-align: left;
		margin: 0 auto 0 auto;
		background: #dcf2ea;
		border: 3px solid #dcf2ea;
	}

		.goods .goodsWrap .goodsBox {
			width: 90%;
			margin: 0 auto 0 auto;
			position: relative;
			padding: 5% 0 4% 0;
		}
			.goods .goodsWrap .goodsBox.goods01 .img {
				width: 40%;
				position: absolute;
				top: -3%;
				right: 0;
			}
			.goods .goodsWrap .goodsBox.goods02 .img {
				width: 40%;
				position: absolute;
				top: 15%;
				right: 0;
			}
			.goods .goodsWrap .goodsBox.goods03 .img {
				width: 40%;
				position: absolute;
				top: 5%;
				right: 0;
			}
			.goods .goodsWrap .goodsBox.goods04 {
				margin-top: 30px;
			}
			.goods .goodsWrap .goodsBox.goods04 .img {
				width: 40%;
				position: absolute;
				top: 13%;
				right: -2%;
			}

			.goods .goodsWrap .goodsBox .txtBox {
				width: 85%;
				margin: 0 0 0 0;
			}
				.goods .goodsWrap .goodsBox .txtBox .price {
					margin: 20px auto 0 auto;
				}
				.goods .goodsWrap .goodsBox .txtBox .txt {
					margin: 20px auto 0 auto;
				}
				.goods .goodsWrap .goodsBox .txtBox .link {
					width: 57%;
					margin: 20px 0 0 0;
					font-weight: 700;
					background: #0771f9;
					text-align: center;
					color: #ffffff;
					line-height: 0;
					cursor: pointer;
				}
					.goods .goodsWrap .goodsBox .txtBox .link a {
						display: block;
					}
				
			.goods .goodsWrap .goodsBox .note {
				width: 100%;
				margin: 20px 0 0 0;
			}
	

					/*===================sp=*/@media screen and (max-width: 860px) {
.goods {
	padding-top: 5vw;
	padding-bottom: 8vw;
}
.goods .goodsWrap {
	padding-bottom: 3vw;
}
		
			.goods .goodsWrap .goodsBox.goods01 .img,
			.goods .goodsWrap .goodsBox.goods02 .img,
			.goods .goodsWrap .goodsBox.goods03 .img,
			.goods .goodsWrap .goodsBox.goods04 .img {
				width: 60%;
				padding-right: 0;
				margin: 5px auto 15px auto;
				position: relative;
				right: auto;
				top: auto;
			}

			.goods .goodsWrap .goodsBox.goods03 .txt .sp {
				width: 70%;

			}
			
			.goods .goodsWrap .goodsBox.goods01,
			.goods .goodsWrap .goodsBox.goods02,
			.goods .goodsWrap .goodsBox.goods03,
			.goods .goodsWrap .goodsBox.goods04 {
				display: -webkit-box;
				display: -ms-flexbox;
				display: flex;
				-webkit-box-orient: vertical;
				-webkit-box-direction: normal;
				-ms-flex-direction: column;
				flex-direction: column;
			}
				.goods .goodsWrap .goodsBox.goods01 .img {
					-webkit-box-ordinal-group: 1;
					-ms-flex-order: 1;
					order: 1;
					margin-top: 20px;
					margin-bottom: 0;
				}
				.goods .goodsWrap .goodsBox.goods02 .img {
					-webkit-box-ordinal-group: 2;
					-ms-flex-order: 2;
					order: 2;
					margin-top: 20px;
					margin-bottom: 0;
				}
				.goods .goodsWrap .goodsBox.goods03 .img {
					-webkit-box-ordinal-group: 2;
					-ms-flex-order: 2;
					order: 2;
					margin-top: 20px;
					margin-bottom: 0;
				}
				.goods .goodsWrap .goodsBox.goods04 .img {
					-webkit-box-ordinal-group: 2;
					-ms-flex-order: 2;
					order: 2;
					margin-top: 40px;
					margin-bottom: 0;
				}
				
				.goods .goodsWrap .goodsBox.goods02 .note {
					-webkit-box-ordinal-group: 3;
					-ms-flex-order: 3;
					order: 3;
				}
			
			.goods .goodsWrap .goodsBox .txtBox {
				width: 120%;
				margin: 0 0 0 0;
			}
				.goods .goodsWrap .goodsBox .txtBox .price {
					margin: 10px auto 0 auto;
				}
				.goods .goodsWrap .goodsBox .txtBox .txt {
					width: 110%;
					margin: 10px auto 0 auto;
				}
			.goods .goodsWrap .goodsBox .note {
				width: 100%;
				margin: 0 auto 4% auto;
			}

				.goods .goodsWrap .goodsBox .txtBox .link {
					width: 62%;
					margin: 20px 0 0 0;
					padding: 0 10% 0 10%;
					font-weight: 700;
					text-align: center;
				}
					
					}/*====================*/
					
					
					
					
/*-----------------------------------------------------------
	#nazo setting
-----------------------------------------------------------*/
#nazo {
}

.contentWrap.nazobg01 {
	padding-top: 10%;
	padding-bottom: 4%;
}
.contentWrap.nazobg02 {
	background: #ffffff url(../img/bgnazo.png) no-repeat center bottom;
	background-size: 100% 100%;
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 0;
}
#nazo .contentWrap.slanting00 {
	padding-bottom: 0;
}
#nazo .contentBox {
	padding-top: 4%;
	padding: 4%;
}

	#nazo .crctWrap {
		width: 100%;
		max-width: 700px;
		padding: 0 0 30px 0;
		text-align: left;
		margin: 0 auto 0 auto;
		border: 3px solid #dcdcdc;
	}
		#nazo .crctWrap .img {
			width: 70%;
			max-width: 270px;
			margin:  0 auto 0 auto;
		}
		#nazo .crctWrap .question {
			width: 100%;
			max-width: 500px;
			margin: 40px auto 0 auto;
			line-height: 0;
			background: rgba(248, 190, 2, 1);
		}
			#nazo .crctWrap .question p {
				padding: 20px;
				margin: 0 auto 0 auto;
			}
			
		#nazo .crctWrap .txt {
			width: 80%;
			padding: 2em 5% 5em 5%;
			font-size: 18px;
			line-height: 2.0;
			font-weight: 700;
			text-align: left;
			color: #000000;
			margin: 50px auto 0 auto;
			background: url(../img/nazo_comm_bg.png) no-repeat center top;
			background-size: 100% 100%;
		}
		#nazo .crctWrap .txt p {
			margin: 0 0 20px 0;
		}
		#nazo .crctWrap .txt.bgn {
			background: none;
			padding: 0 0 0 0;
			text-align: center;
		}
		#nazo .nazobg02 .crctWrap .txt {
			width: 100%;
			color: #ffffff;
			text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.73);
			margin: 50px auto 0 auto;
		}
	
	#nazo .nazoWrap {
		width: 100%;
		max-width: 700px;
		padding: 0 0 40px 0;
		text-align: left;
		margin: 0 auto 0 auto;
		background: #ffffff;
		border: 3px solid #dcdcdc;
	}
	#nazo #nazo02 {
		padding-top: 30px;
	}
	#nazo .nazobg02 .nazoWrap {
		width: 100%;
		max-width: 700px;
		padding: 40px 0 40px 0;
		text-align: left;
		margin: 0 auto 0 auto;
		border: 3px solid #dcdcdc;
	}
		.nazoWrap .answerBox {
			width: 100%;
			max-width: 760px;
			margin: 0 auto 0 auto;
			padding: 0 0 20px 0;
			
		}
			.nazoWrap .answerBox .inputBox {
				width: 100%;
				margin: 0 auto 0 auto;
			}
				.nazoWrap .answerBox .inputBox .img {
					width: 80%;
					color: #e6e5e5;
					font-size: 30px;
					line-height: 1.4;
					font-weight: 600;
					margin: 0 auto 0 auto;
				}
				.nazoWrap .answerBox .inputBox .txt {
					width: 80%;
					color: #000000;
					font-size: 24px;
					line-height: 1.8;
					font-weight: 600;
					margin: 20px auto 15px auto;
					text-align: center;
				}

			.nazoWrap .answerBox .inputBox form {
				margin-top: 40px;
				padding: 2px;
				text-align: center;
			}
			.nazoWrap .answerBox .inputBox form .formBox {
				display: -webkit-flex;
				display: flex;
				width: 90%;
				max-width: 380px;
				margin: 0 auto 20px auto;
				text-align: left;
			}
					.nazoWrap .answerBox .inputBox form .formBox div {
						width: 22%;
						font-size: 20px;
						border-right: 1px solid #000000;
						padding: 0 0 0 3%;
						display: -webkit-box;
						display: -ms-flexbox;
						display: flex;
						-webkit-box-align: center;
						-ms-flex-align: center;
						align-items: center;
						-ms-flex-wrap: wrap;
						flex-wrap: wrap;
						-ms-flex-line-pack: center;
						align-content: center;
					}
					.nazoWrap .answerBox .inputBox form .formBox div p {
						width: 100%;
						line-height: 1;
					}
					.nazoWrap .answerBox .inputBox form .formBox div .note {
						font-size: 12px;
						margin-top: 10px;
					}

					
					 #nazo input[type="text"] {
						width: 100%;
						border: 0;
						margin: 0 0 0 0;
						padding: 20px 3% 20px 3%;
						font-size: 25px;
						font-weight: bold;
						outline: none;
						text-align: center;
						color: #000000;
						background: #ffffff;
						border: 3px solid #0671ff;
					}
					#nazo .inbtn {
						width: 90%;
						max-width: 380px;
						height: 60px;
						color: #ffffff;
						cursor: pointer;
						font-size: 18px;
						font-weight: bold;
						padding: 0 0 0 0;
						margin: 0 auto 0 auto;
						background: #0771f9;
						border-radius: 0;
						-webkit-border-radius: 0;
						-moz-border-radius: 0;
						position: relative;

					}
					#nazo input[type="submit"] {
						border: none;
						outline: none;
						width: 100%;
						height: 100%;
						color: #ffffff;
						text-align: center;
						cursor: pointer;
						font-size: 18px;
						font-weight: bold;
						padding: 0 0 0 0;
						margin: 0 auto 0 auto;
						background: #0771f9;
						border-radius: 0;
						-webkit-border-radius: 0;
						-moz-border-radius: 0;
						position: relative;

					}
						#nazo .inbtn:after {
							content: "";
							position: absolute;
							top: 0;
							right: 5%;
							width: 12px;
							height: 100%;
							background: url(../img/arrow_04_w.svg) no-repeat right center;
							background-size: 100% auto;
						}
					#nazo input[type="submit"]:hover {
						opacity: 0.7;
					}
	
	#nazo .btn  {
		width: 90%;
		margin-top: 50px;
		
	}
	
	#nazo .schedulebtn {
		margin: 50px auto 20px auto;
	}
	#nazo .schedulebtn a {
		width: 90%;
		max-width: 380px;
		color: #ffffff;
		cursor: pointer;
		font-size: 18px;
		font-weight: bold;
		padding: 20px 0 20px 0;
		margin: 0 auto 0 auto;
		background: #0771f9;
		border-radius: 0;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		position: relative;
		display: block;
		text-decoration: none;
		text-align: center;
	}
		#nazo .schedulebtn a:before {
			content: "";
			position: absolute;
			top: 0;
			right: 5%;
			width: 12px;
			height: 100%;
			background: url(../img/arrow_04_w.svg) no-repeat right center;
			background-size: 100% auto;
		}
					#nazo .schedulebtn a:hover {
						color: rgba(255, 255, 255, 0.70);
					}

	#nazo .ochara  {
		width: 56%;
		margin: -100px auto 0 auto;
		
	}

	#nazo .share  {
		width: 55%;
		margin: -30px auto 0 auto;
		padding: 2em 5% 2em 5%;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
  -webkit-box-pack: center;
     -ms-flex-pack: center;
   justify-content: center;

  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
		background: url(../img/nazo_share_bg.png) no-repeat left top;
		background-size: 100% 100%;
		z-index: 1;
		position: relative;
		
	}
		#nazo .share .tit {
			width: 80%;
			margin: 0 10% 10px 10%;
		}
		
	#nazo #nazo02crct .share  {
		margin: 80px auto 0 auto;
		
	}
		#nazo .share div {
			width: 15%;
			margin: 0 6% 0 6%;
		}
		#nazo .share div a {
			width: 100%;
			line-height: 0;
			font-size: 18px;
			text-decoration: none;
		}
		#nazo .share div.tit:hover {
			opacity: 1;
		}
		#nazo .share div:hover {
			opacity: 0.7;
		}

	
					/*===================sp=*/@media screen and (max-width: 860px) {

#nazo .contentBox {

}
	#nazo .share  {
		width: 70%;
		padding: 1em 5% 1em 5%;
/* 		display: block; */
	}
	#nazo .share div {
/*
		width: 45%;
		margin: 0 auto 20px auto;
*/
	}
	
		#nazo .crctWrap .txt {
			background: url(../img/nazo_comm_bg_l.png) no-repeat center top;
			background-size: 100% 100%;
			margin-top: 20px;
		}
		#nazo .crctWrap .txt {
			font-size: 3.2vw;
			padding-bottom: 5em;
		}
		#nazo .crctWrap .txt p {
			margin-bottom: 1em;
		}
		#nazo .nazobg02 .crctWrap .txt {
		}
		#nazo .ochara {
			margin: -4.5em auto 0 auto;
		}

	#nazo .schedulebtn {
		margin: 30px auto 0 auto;
	}

.contentWrap.nazobg01 {
	padding-top: 10%;
	padding-bottom: 10%;
}

.contentWrap.nazobg02 {
	padding-bottom: 0;
}
#nazo .nazoWrap {
	width: 100%;
}

		#nazo .share div a:hover {
			opacity: 1;
		}
		
		#nazo input[type="text"] {
			font-size: 4.4vw;
		}
		
				.nazoWrap .answerBox .inputBox .img {
					width: 90%;
				}
		

					}/*====================*/
					
					
/*-----------------------------------------------------------
	.postermaker setting
-----------------------------------------------------------*/
.postermaker::before {
	content: "";
	width: 38.91%;
	height: 50%;
	background: url(../img/deco_01.png) no-repeat center top;
	background-size: 100% auto;
	position: absolute;
	top: 2%;
	left: 0;
}
.postermaker::after {
	content: "";
	width: 18.33%;
	height: 50%;
	background: url(../img/deco_02.png) no-repeat center bottom;
	background-size: 100% auto;
	position: absolute;
	bottom: 0;
	right: 0;
}
.postermaker.contentWrap.slanting00 {
	padding-bottom: 0;
	padding-top: 10%;
}
.postermaker .contentBox h3 {
	width: 100%;
	margin-top: 10px;
}
.postermaker .contentBox {
	padding-top: 4%;
	padding-bottom: 8%;
}

	.postermaker .postermakerWrap {
		width: 100%;
		max-width: 700px;
		padding: 0 0 50px 0;
		text-align: left;
		margin: 0 auto 0 auto;
		background: #dcf2ea;
/* 		border: 3px solid #dcf2ea; */
	}
	.postermaker .postermakerWrap.complete {
		background: #dcf2ea url(../img/postermaker_bg.png) no-repeat center top;
		background-size: 100% auto;
		
	}
		.postermaker .postermakerWrap .postermakerBox {
			
		}
			.postermaker .postermakerWrap .postermakerBox .txtBox {
				display: block;
			}
			.postermaker .postermakerWrap.complete .postermakerBox .txtBox {
				display: none;
			}
			.postermaker .postermakerWrap .postermakerBox .txtBox.complete {
				display: none;
			}
			.postermaker .postermakerWrap.complete .postermakerBox .txtBox.complete {
				display: block;
			}
				.postermaker .postermakerWrap.complete .postermakerBox .txtBox.complete .txt02{
					padding: 18px 0;
				}
			.postermaker .postermakerWrap .postermakerBox .makeBox {
				width: 100%;
				display: block;
			}
				.postermaker .postermakerWrap .postermakerBox .makeBox .make01,
				.postermaker .postermakerWrap .postermakerBox .makeBox .make02 {
					display: block;
				}
				.postermaker .postermakerWrap.complete .postermakerBox .makeBox .make01,
				.postermaker .postermakerWrap.complete .postermakerBox .makeBox .make02 {
					display: none;
				}
			
				.postermaker .postermakerWrap .postermakerBox .makeBox .canvas {
					width: 90%;
					margin: 20px auto 0 auto;
					padding: 0 5% 0 5%;
					background: #dcf2ea url(../img/postermaker_canvas_bg.png) no-repeat center top;
					background-size: 100% auto;
					line-height: 0;
				}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas div {
						border: 8px solid #dcf2ea;
						position: relative;
						line-height: 0;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas div:after {
						content: "";
						width: 6%;
						height: 12%;
						position: absolute;
						right: 25%;
						bottom: 28%;
						background: url(../../postermaker/img/make01.svg) no-repeat center center;
						background-size: 100% auto;
						z-index: 2;
						display: block;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas div:before {
						content: "";
						width: 6%;
						height: 12%;
						position: absolute;
						right: 25%;
						bottom: 60%;
						background: url(../../postermaker/img/make02.svg) no-repeat center center;
						background-size: 100% auto;
						z-index: 2;
						display: block;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas .comm {
						width: 100%;
						height: 100%;
						position: absolute;
						right: 0;
						bottom: 0;
						background: url(../../postermaker/img/make03.svg) no-repeat center center;
						background-size: 40% auto;
						z-index: 2;
						display: block;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas #poster_canvas {
						background: #ffffff;
						margin: 0 auto 0 auto;
						width: 100%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas #img_download {
						position: absolute;
						top: 0;
						left: 0;
					}
					
				.postermaker .postermakerWrap.complete .postermakerBox .makeBox .canvas {
					background: none;
				}
					.postermaker .postermakerWrap.complete .postermakerBox .makeBox .canvas div {
						border: 8px solid #dcf2ea;
						position: relative;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .makeBox .canvas div:after {
						display: none;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .makeBox .canvas div:before {
						display: none;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .makeBox .canvas .comm {
						display: none;
					}
					
					
				.postermaker .postermakerWrap .postermakerBox .makeBox .make01 {
					width: 70%;
					margin: 40px 0 0 12%;
					display: -webkit-box;
					display: -ms-flexbox;
					display: flex;
				}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make01 .tit {
						width: 1.5em;
						margin-top: 0.5em;
						margin-right: 3%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make01 .texts {
						width: 100%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make01 textarea {
						width: 94%;
						padding: 3%;
						border-radius: 0;
						border: none;
						appearance: none;
						-webkit-appearance: none;
						-moz-appearance: none;
					}
				.postermaker .postermakerWrap .postermakerBox .makeBox .make02 {
					width: 70%;
					margin: 0 0 0 12%;
					display: -webkit-box;
					display: -ms-flexbox;
					display: flex;
					line-height: 0;
					position: relative;
				}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .tit {
						width: 1.5em;
						margin-top: 0.5em;
						margin-right: 3%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn {
						width: 100%;
						display: -webkit-box;
						display: -ms-flexbox;
						display: flex;
						-webkit-box-align: start;
						-ms-flex-align: start;
						align-items: flex-start;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn .preview {
						overflow: hidden;
						width: 317px;
						height: 179px;
						background-position: center center;
						background-size: contain;
						background: #ffffff;
						display: flex;
						justify-content: center;
						align-items: center;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn .upload {
						width: 27%;
						margin-left: 3%;
					}

					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn .upload label {
						width: 100%;
						font-size: 11px;
						height: 3.6em;
						line-height: 0;
						background: #0771f9;
						color: #ffffff;
						text-align: center;
						display: -webkit-box;
						display: -ms-flexbox;
						display: flex;
						-webkit-box-pack: center;
						-ms-flex-pack: center;
						justify-content: center;
						-webkit-box-align: center;
						-ms-flex-align: center;
						align-items: center;
					}
						.movienote {
							width: 70%;
							padding-left: 4%;
							font-size: 12px;
							margin: 5px auto 0 auto;
						}
						.complete .movienote {
							display: none;
						}
						.move_btns{
							position: absolute;
							right: 0;
							bottom: 0;
							/* display: none; */
							width: 123px;
							display: flex;
							align-items: center;
							justify-content: center;
							flex-wrap: wrap;
						}
							.move_btns.show{
								display: block;
							}
							.move_btns div{
								position: relative;
								width: 42px;
								height: 42px;
								display: flex;
								align-items: center;
								justify-content: center;
								background-color: gray;
								color: #FFFFFF;
								cursor: pointer;
								border-radius: 20%;
								
								background-position: center center;
								background-size: cover;
							}
								.move_btns div.off{
								/*	opacity: 0.5;
									cursor: default;	*/
								}
									.move_btns .move_up{
										margin-left: 40px;
										margin-right: 40px;
										background-image: url(../../postermaker/img/btn_arrow_up.png);
									}
									.move_btns .move_left{
										margin-right: 39px;
										background-image: url(../../postermaker/img/btn_arrow_left.png);
									}
									.move_btns .move_right{
										background-image: url(../../postermaker/img/btn_arrow_right.png);
									}
									.move_btns .move_down{
										background-image: url(../../postermaker/img/btn_arrow_down.png);
									}
					
				.postermaker .postermakerWrap .postermakerBox .btnBox {
					width: 45%;
					margin: 30px auto 0 auto;
				}
					.postermaker .postermakerWrap .postermakerBox .btnBox #btn_submit {
						display: block;
					}
					.postermaker .postermakerWrap .postermakerBox .btnBox #save {
						display: none;
					}
					.postermaker .postermakerWrap .postermakerBox .btnBox #result {
						display: none;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .btnBox #btn_submit {
						display: none;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .btnBox #save {
						display: block;
						margin-top: 35px;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .btnBox #result {
						display: block;
						margin-top: 10px;
					}
					
				.postermaker .postermakerWrap .postermakerBox .howto {
					width: 90%;
					margin: 20px auto 0 auto;
					display: -webkit-box;
					display: -ms-flexbox;
					display: flex;
					-ms-flex-wrap: wrap;
					flex-wrap: wrap;
				}
					.postermaker .postermakerWrap .postermakerBox .howto .tit {
						width: 13%;
						margin-left: 2%;
						margin-right: 5%;
						font-size: 16px;
						font-weight: 600;
						position: relative;
					}
						.postermaker .postermakerWrap .postermakerBox .howto .tit:after {
							content: "";
							width: 2px;
							height: 100%;
							position: absolute;
							right: 2px;
							top: 0;
							display: block;
							background: #000000;
						}
					.postermaker .postermakerWrap .postermakerBox .howto .txt {
						width: 80%;
						font-size: 16px;
						font-weight: 600;
					}
					
					.postermaker .postermakerWrap.complete .postermakerBox .howto .txt {
						display: none;
					}
					.postermaker .postermakerWrap .postermakerBox .howto .txt.complete {
						display: none;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .howto .txt.complete {
						display: block;
					}
					 
					
				.postermaker .postermakerWrap .postermakerBox .notice {
					width: 90%;
					margin: 40px auto 0 auto;
					background: #ffffff;
					border: 3px solid #ff6b00;
				}
					.postermaker .postermakerWrap .postermakerBox .notice .tit {
						text-align: center;
						font-size: 22px;
						font-weight: 800;
						color: rgba(255, 107, 0, 0.90);
					}
					.postermaker .postermakerWrap .postermakerBox .notice .txt {
						width: 92%;
						margin: 15px auto 15px auto;
						font-size: 14px;
						font-weight: 600;
					}
					.postermaker .postermakerWrap .postermakerBox .notice .txt p {
						font-size: 14px;
						line-height: 1.8;
						display: block;
						padding-left: 1.5em;
						margin-bottom: 5px;
					}
					.postermaker .postermakerWrap .postermakerBox .notice .txt p::before {
						content: "■";
						display: block;
						float: left;
						margin-left: -1.5em;
						width: 1.5em;
						text-align: center;
					}
					
				.postermaker .postermakerWrap .postermakerBox .makingEffect {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					z-index: 3;
					pointer-events: none;
				}
					.postermaker .postermakerWrap .postermakerBox .makingEffect div{
						position: absolute;
						opacity: 0;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo1{
						top: 200px;
						left: 0%;
						width: 40%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo2{
						top: 214px;
						left: 32%;
						width: 30%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo3{
						top: 180px;
						left: 50%;
						width: 50%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo4{
						top: 340px;
						left: 0;
						width: 50%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo5{
						top: 390px;
						left: 20%;
						width: 50%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo6{
						top: 430px;
						left: 60%;
						width: 40%;
					}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type1{
							animation: effectAnimation 3s 0s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type2{
							animation: effectAnimation 2.8s 0.3s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type3{
							animation: effectAnimation 3s 0.6s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type4{
							animation: effectAnimation 3.2s 0.9s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type5{
							animation: effectAnimation 3.2s 0s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type6{
							animation: effectAnimation 3.2s 0.3s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type7{
							animation: effectAnimation 2.8s 0.6s forwards;
						}
						.postermaker .postermakerWrap .postermakerBox .makingEffect div.effect_type8{
							animation: effectAnimation 2.8s 0.9s forwards;
						}
					
						@keyframes effectAnimation{
							0%{
								animation-timing-function: ease-out;
								opacity: 0;
								transform: scale(0.5) rotate(0deg);
							}
							5%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(0.9) rotate(10deg);
							}
							10%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.5) rotate(15deg);
							}
							20%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.2) rotate(20deg);
							}
							30%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.5) rotate(25deg);
							}
							40%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.2) rotate(30deg);
							}
							50%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.5) rotate(35deg);
							}
							60%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.2) rotate(40deg);
							}
							70%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.5) rotate(45deg);
							}
							80%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.2) rotate(50deg);
							}
							90%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(1.5) rotate(55deg);
							}
							95%{
								animation-timing-function: linear;
								opacity: 1;
								transform: scale(0.9) rotate(60deg);
							}
							100%{
								animation-timing-function: ease-in;
								opacity: 0;
								transform: scale(0.5) rotate(70deg);
							}
						}
				



					/*===================sp=*/@media screen and (max-width: 860px) {
						
.postermaker {
	padding-top: 5vw;
	padding-bottom: 8vw;
}
.postermaker .postermakerWrap {
	padding-bottom: 3vw;
}

	.postermaker .postermakerWrap {
		width: 100%;
		padding: 0 0 30px 0;
		background: #dcf2ea;
	}
			.postermaker .postermakerWrap .postermakerBox .txtBox {
				width: 120%;
				margin-left: -10%;
			}
			.postermaker .postermakerWrap .postermakerBox .makeBox {
				width: 100%;
				display: block;
			}
			
				.postermaker .postermakerWrap .postermakerBox .makeBox .canvas {
					width: 95%;
					margin: 15px auto 0 auto;
					padding: 0 2.5% 0 2.5%;
				}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas div {
						border: 4px solid #dcf2ea;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas div:after {
						content: "";
						width: 6%;
						height: 12%;
						position: absolute;
						right: 25%;
						bottom: 30%;
						background: url(../../postermaker/img/make01.svg) no-repeat center center;
						background-size: 100% auto;
						z-index: 2;
						display: block;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas div:before {
						content: "";
						width: 6%;
						height: 12%;
						position: absolute;
						right: 25%;
						bottom: 63%;
						background: url(../../postermaker/img/make02.svg) no-repeat center center;
						background-size: 100% auto;
						z-index: 2;
						display: block;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas #poster_canvas {
						background: #ffffff;
						margin: 0 auto 0 auto;
						width: 100%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .canvas #img_download {
						position: absolute;
						top: 0;
						left: 0;
					}
					
				.postermaker .postermakerWrap .postermakerBox .makeBox .make01 {
					width: 92%;
					margin: 20px 0 0 3%;
				}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make01 .tit {
						width: 1.5em;
						margin-top: 0.5em;
						margin-right: 3%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make01 textarea {
						width: 94%;
						padding: 3%;
						font-size: 16px;
					}
				.postermaker .postermakerWrap .postermakerBox .makeBox .make02 {
					width: 92%;
					margin: 0 0 0 3%;
				}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .tit {
						width: 1.5em;
						margin-top: 0.5em;
						margin-right: 3%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn {
						width: 100%;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn .preview {
						overflow: hidden;
						width: 52.4vw;
						height: 29.2vw;
						background-position: center center;
						background-size: contain;
						background: #ffffff;
						display: flex;
						justify-content: center;
						align-items: center;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn .upload {
						width: 27%;
						margin-left: 3%;
						font-size: 11px;
						height: 3.6em;
						line-height: 0;
					}
					.postermaker .postermakerWrap .postermakerBox .makeBox .make02 .upbtn .upload label {
						font-size: 2.0vw;
						height: 3.6em;
						line-height: 0;
					}
						.movienote {
							width: 92%;
							padding-left: 10%;
							font-size: 2.8vw;
							margin: 5px auto 0 auto;
						}
						.complete .movienote {
							display: none;
						}
						.move_btns{
							position: absolute;
							right: 0;
							bottom: 0;
							/* display: none; */
							width: 23.6%;
							display: flex;
							align-items: center;
							justify-content: center;
							flex-wrap: wrap;
						}
							.move_btns.show{
								display: block;
							}
							.move_btns div{
								position: relative;
								width: 35%;
								height: 6.5vw;
								display: flex;
								align-items: center;
								justify-content: center;
								background-color: gray;
								color: #FFFFFF;
								cursor: pointer;
								border-radius: 20%;
							}
								.move_btns div.off{
								/*	opacity: 0.5;
									cursor: default;	*/
								}
									.move_btns .move_up{
										margin-left: 22%;
										margin-right: 22%;
									}
									.move_btns .move_left{
										margin-right: 30%;
									}
					
				.postermaker .postermakerWrap .postermakerBox .btnBox {
					width: 60%;
					margin: 20px auto 0 auto;
				}
					.postermaker .postermakerWrap.complete .postermakerBox .btnBox #save {
						display: block;
						margin-top: 20px;
					}
					.postermaker .postermakerWrap.complete .postermakerBox .btnBox #result {
						display: block;
						margin-top: 15px;
					}
					
				.postermaker .postermakerWrap .postermakerBox .howto {
					width: 90%;
					margin: 20px auto 0 auto;
					display: block;
				}
					.postermaker .postermakerWrap .postermakerBox .howto .tit {
						width: 100%;
						margin-left: auto;
						margin-right: auto;
						font-size: 4vw;
						padding-bottom: 5px;
					}
						.postermaker .postermakerWrap .postermakerBox .howto .tit:after {
							content: "";
							width: 100%;
							height: 2px;
							right: 0;
							top: auto;
							bottom: 0;
						}
					.postermaker .postermakerWrap .postermakerBox .howto .txt {
						width: 100%;
						margin: 15px auto 0 auto;
						font-size: 3.4vw;
					}
					
				.postermaker .postermakerWrap .postermakerBox .notice {
					width: 90%;
					margin: 40px auto 0 auto;
					background: #ffffff;
					border: 3px solid #ff6b00;
				}
					.postermaker .postermakerWrap .postermakerBox .notice .tit {
						text-align: center;
						font-size: 4.0vw;
					}
					.postermaker .postermakerWrap .postermakerBox .notice .txt {
						width: 92%;
						margin: 15px auto 15px auto;
						font-size: 3.0vw;
						font-weight: 600;
					}
					.postermaker .postermakerWrap .postermakerBox .notice .txt p {
						font-size: 3.0vw;
						line-height: 1.8;
						display: block;
						padding-left: 1.5em;
						margin-bottom: 5px;
					}
					.postermaker .postermakerWrap .postermakerBox .notice .txt p::before {
						content: "■";
						display: block;
						float: left;
						margin-left: -1.5em;
						width: 1.5em;
						text-align: center;
					}
				
				.postermaker .postermakerWrap .postermakerBox .makingEffect {
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					z-index: 3;
					pointer-events: none;
				}
					.postermaker .postermakerWrap .postermakerBox .makingEffect div{
						position: absolute;
						opacity: 0;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo1{
						top: 32vw;
						left: 0%;
						width: 40%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo2{
						top: 31vw;
						left: 32%;
						width: 30%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo3{
						top: 30vw;
						left: 50%;
						width: 50%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo4{
						top: 44vw;
						left: 0;
						width: 50%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo5{
						top: 53vw;
						left: 20%;
						width: 50%;
					}
					.postermaker .postermakerWrap .postermakerBox .makingEffect .making_kumo6{
						top: 57vw;
						left: 60%;
						width: 40%;
					}
					
					}/*====================*/
					

					
/*-----------------------------------------------------------
	#pagetopBtn setting
-----------------------------------------------------------*/

#pagetopBtn {
	width: 100%;
	background: #ff9300 url(../img/top_btn.png) no-repeat center center;
	background-size: auto 100%;
	display: block;
	position: relative;
	z-index: 2;
	margin-top: -6vw;
}
	#pagetopBtn p {
		width: 100%;
		padding-top: 19%;
		background: url(../img/top_btn.svg) no-repeat center center;
		background-size: auto 40%;
	}

					/*===================sp=*/@media screen and (max-width: 860px) {

#pagetopBtn {
	width: 100%;
	background: #ff9300 url(../img/top_btn.png) no-repeat center bottom;
	background-size: auto 80%;
	display: block;
	position: relative;
	z-index: 2;
	margin-top: -4%;
}

	#pagetopBtn p {
		padding-top: 30%;
	}
					}/*====================*/

/*-----------------------------------------------------------
	#footer setting
-----------------------------------------------------------*/
#footer {
	width: 100%;
	text-align: center;
	margin: 0 auto 0 auto;
	padding: 80px 0px 80px 0px;
	position: relative;
	line-height: 1.6;
	color: #e5e5e4;
	background: #000000;
	z-index: 2;
}
	.footerWrap {
		max-width: 960px;
		margin: 0 auto 0 auto;
	}
	
		#footer .logoBox {
			width: 90%;
			margin: 40px auto 30px auto;
			
		}
			#footer .logoBox .logo {
				width: 40%;
				max-width: 180px;
				margin: 0 auto 20px auto;
				font-size: 22px;
				color: #ffffff;
			}

		#footer .copyright {
			font-size: 15px;
			margin: 30px auto 0 auto;
			color: #ffffff;
		}


					/*===================sp=*/@media screen and (max-width: 860px) {
						
#footer {
	width: 100%;
	margin: 0 auto 0 auto;
	padding: 15vw 0 45vw 0;
}
	.footerWrap {
		width: 90%;
		margin: 0 auto 0 auto;
	}
	#footer .copyright {
		margin-top: 0px;
		font-size: 12px;
	}
		#footer .logoBox {
			width: 80%;
		}
			#footer .logoBox .logo01 {
			}
				
						
					}/*====================*/


/*-----------------------------------------------------------
	mailmagazine setting
-----------------------------------------------------------*/
.mailmagazine {
	margin: 0 auto 0 auto;
}
	.mailmagazine .bnr {
		width: 90%;
		max-width: 400px;
		margin: 0 auto 0 auto;
	}

					/*===================sp=*/@media screen and (max-width: 860px) {

	.mailmagazine .bnr {
		width: 80%;
	}

					}/*====================*/
					

/*----------------------------------#popup setting----------*/
#popup {
	display: none;
}
	#popupBtn a {
		display: block;
		cursor: pointer;
	}
	#popupBtn {
		width: 17%;
		max-width: 200px;
		position: fixed;
		right: 0;
		bottom: 0;
		z-index: 100;
		cursor: pointer;
	}
		#popupBtn img {
			width: 100%;
			border-style:none;
		}
		#popupBtn p.pchaa {
			width: 90%;
			margin-left: 10%;
			margin-bottom: 10%;
		}
		#popupBtn p.pbtn {
			position: absolute;
			bottom: 0;
			right: 0;
		}
		#popupBtn:hover {
			opacity: 0.7;
		}


					/*===================sp=*/@media screen and (max-width: 860px) {
					
#popupBtn {
	width: 27%;
	right: 0;
	bottom: 0;
}
#popupBtn img {
	width: 100%;
	border-style:none;
}

		#popupBtn:hover {
			opacity: 1;
		}
					
					}/*====================*/


/*----------------------------------#popup setting----------*/
#share {
	width: 75px;
	line-height: 0;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	position: fixed;
	bottom: 37%;
	left: 20px;
	z-index: 15;
}
		#share ul {
			width: 100%;
			margin: 20px 0 0 0;
		}
		#share ul li {
			width: 100%;
			margin: 0 0 5px 0 ;
		}
		#share ul li img {
			width: 100%;
			height: auto;
		}

					/*===================sp=*/@media screen and (max-width: 860px) {
					
#share {
	width: 10%;
	left: auto;
	right: 1%;
	bottom: 40%;
}
					
					}/*====================*/

/*----------------------------------deco setting----------*/

.dcp {
	position: relative;
}
.decoBox {
	z-index: 10;

}
	.decoBox div {
		position: absolute;
		width: 100%;
		z-index: 5;
	}
		.decoBox div p {
			background-position: left top !important;
			background-size: 100% auto !important;
		}
		
	.decoBox .deco01 {
		width: 18%;
		right: 0;
		top: -10%;
	}
		.decoBox .deco01 p {
			background: url(../img/item_01.png) no-repeat left top;
			padding-top: 178%;
		}

	.decoBox .deco02 {
		width: 13%;
		left: 0;
		top: -5%;
	}
		.decoBox .deco02 p {
			background: url(../img/item_02.png) no-repeat left top;
			padding-top: 132%;
		}
		
	.decoBox .deco03 {
		width: 18.5%;
		right: 0;
		bottom: 2%;
	}
		.decoBox .deco03 p {
			background: url(../img/item_03.png) no-repeat left top;
			padding-top: 167%;
		}

	.decoBox .deco04 {
		width: 11%;
		left: 0;
		top: -6%;
	}
		.decoBox .deco04 p {
			background: url(../img/item_04.png) no-repeat left top;
			padding-top: 147%;
		}

	.decoBox .deco05 {
		width: 18.3%;
		right: 0;
		top: -4%;
		display: none;
	}
		.decoBox .deco05 p {
			background: url(../img/item_05.png) no-repeat left top;
			padding-top: 183%;
		}
				
		

					/*===================sp=*/@media screen and (max-width: 860px) {
					
.decoBox {
	display: none;
}
					
					}/*====================*/	


/*----------------------------------btn animation----------*/
.pchaa{
	transform: translateY(10px);
	animation: koujouchou_anime 4s infinite;
}

@keyframes koujouchou_anime{
	0%{
		transform: translateY(10px);
	}
	5%{
		transform: translateY(0px);
	}
	10%{
		transform: translateY(10px);
	}
	100%{
		transform: translateY(10px);
	}
}


#sapporo,
#yokohama,
#fukuoka {
	padding-top: 180px;
	margin-top: -180px;
}
					/*===================sp=*/@media screen and (max-width: 860px) {
					
#sapporo,
#yokohama,
#fukuoka {
	padding-top: 0;
	margin-top: -0;
}

					}/*====================*/