@charset "UTF-8";
body{
	text-align:center;
	background-color: #000;
	width:100%;
	height: 100%;
	margin:0;
}
/* スキップボタンの位置 */	
.skip
{
	width:5.2%;
	height: 3.5%;
	display: inline-block;
	border-radius: 38%;                  /* 角丸 */
	cursor: pointer;              /* カーソル形状 */
	transition : 0.3s;                  /* なめらか変化 */
	cursor: pointer;
	cursor: hand;
	position: absolute;
	top:1.6%;
	right:6.2%;
	z-index: 1;
}
#tendan50{
	height:100%;
}
.tendan50{
	display: inline-block;
	position: relative;
}
/* .box{
	text-align: center;
	content:'';
	display:block;
	width:100%;
  	max-width: 5616px;
  	height:100%;
  	padding-bottom:75%;
  	background: gold; 
	  position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
} */
@media screen and (max-width:780px) { 
	#tendan50{
		display: inline-block;
		width:100%;
	}
	.tendan50{
		display: inline-block;
		position: relative;
	}
	.skip{

		top: 28.5% ;
		left: 88% ;
		width:6.5%;
		height: 3.5%;
		z-index: 1;
		-webkit-appearance: none;
	}
}
@media screen and (max-width:440px) { 
	#tendan50{
		width:100%;
	}
	.tendan50{
		display: inline-block;
		position: relative;
	}
	.skip{
		
		top: 34.5% ;
		left: 89% ;
		width:6.5%;
		height: 3.7%;
		z-index: 1;
		-webkit-appearance: none;
	}
}
@media (orientation: landscape) and (max-width: 820px){
	#tendan50{
		height:100%;
	}
	.tendan50{
		display: inline-block;
		position: relative;
	}
	.skip{
		
		top: 1.5% ;
		left: 89% ;
		width:6.5%;
		height: 3.7%;
		z-index: 1;
		-webkit-appearance: none;
	}
	}