*{
	box-sizing					: border-box;
	position						: relative;
	display							: block;
	margin							: 0px;
	padding							: 0px;
	font-family					: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"メイリオ","Meiryo UI","ＭＳ Ｐゴシック","MS PGothic",Arial,sans-serif;
	font-style					: normal;
	font-weight					: 400;
	text-decoration			: none;
	font-size						: 1.2rem;
	border							: none;
	/*-webkit-touch-callout		: none;*/
	/*-webkit-tap-highlight-color	: rgba(0,0,0,0);*/
	/*-webkit-font-smoothing		: antialiased;*/
	/*-webkit-overflow-scrolling	: touch*/
	touch-action				: manipulation;
}

html{
	font-size						: 10px;
}
head,script{
	display							: none;
}
body{
	width								: 100vw;
	min-width						: 1280px;
	height							: 100vh;
	height							: calc(var(--vh, 1vh) * 100);
	overflow						: hidden;
}
main{
	width								: 100%;
	min-height					: 100vh;
	min-height					: calc(var(--vh, 1vh) * 100);
}


[id='loader']{
	position						: fixed;
	top									: 0px;
	left								: 0px;
	width								: 100%;
	height							: 100vh;
	height							: calc(var(--vh, 1vh) * 100);
	backdrop-filter			: blur(4px);
  z-index							: 1000;
}
[id='loader'][class='hide']{
    transition					: opacity 300ms;
    opacity						: 0;
}
[id='loader'][class='off']{
	pointer-events				: none;
    opacity						: 0;
}
[id='loader']>p{
	position					: absolute;
	transform					: translate(-50%,-50%);
	width						: auto;
	height						: auto;
	opacity						: .8;
}
body[data-view='portrait'] [id='loader']>p{
	top							: 50%;
	left						: 50%;
	transform					: translate(-50%,-50%);
}
body[data-view='portrait'] [id='loader']>p[class='view']{
    animation-name				: view_p;
    animation-duration			: 1600ms;
}
body[data-view='portrait'] [id='loader']>p[class='move']{
    animation-name				: move_login_p;
    animation-duration			: 1000ms;
}
body[data-view='landscape'] [id='loader']>p{
    animation-name				: view_p;
    animation-duration			: 1600ms;
}
body[data-view='landscape'] [id='loader']>p[class='view']{
    animation-name				: view_l;
    animation-duration			: 1600ms;
}
body[data-view='landscape'] [id='loader']>p[class='move']{
    animation-name				: move_login_l;
    animation-duration			: 1000ms;
}
[id='loader']>p[class='loading']{
	will-change					: transform;
    animation-name				: loading;
    animation-duration			: 1000ms;
}
[id='loader']>p{
    animation-delay				: 0ms;
    animation-iteration-count	: infinite;
    animation-direction			: nomal;
    animation-fill-mode			: none;
	opacity						: 0;
}
[id='loader']>p>i{
	font-size					: 16rem;
}
@keyframes loading{
	0%		{
		transform				: translate(-50%,-50%) rotate(0deg);
		color					: var(--opacity3_5);
		opacity					: 60;
	}
	33%		{
		color					: var(--opacity3_b);
		opacity					: 80;
	}
	66%		{
		color					: var(--opacity3_gr);
		opacity					: 100;
	}
	100%	{
		transform				: translate(-50%,-50%) rotate(360deg);
		color					: var(--opacity3_5);
		opacity					: 60;
	}
}
@keyframes view_p{
	0%		{
		top						: 50%;
		opacity					: 0;
	}
	30%		{
		top						: 50%;
		opacity					: 0;
	}
	100%	{
		top						: 50%;
		opacity					: 1;
	}
}
@keyframes view_l{
	0%		{
		left					: calc(50% - 15px);
		opacity					: 0;
	}
	30%		{
		left					: calc(50% - 15px);
		opacity					: 0;
	}
	100%	{
		left					: calc(50% - 15px);
		opacity					: 1;
	}
}

@keyframes move_login_p{
	0%		{
		top				: 50%;
		opacity					: 1;
		
	}
	20%		{
		top				: 50%;
		opacity					: 1;
	}
	100%	{
		top				: calc(50% - 130px);
		opacity					: 1;
	}
}
@keyframes move_login_l{
	0%		{
		left				: calc(50% - 15px);
		opacity					: 1;
	}
	20%		{
		left				: calc(50% - 15px);
		opacity					: 1;
	}
	100%	{
		left				: calc(50% - 165px);
		opacity					: 1;
	}
}


[id='download_wall']{
	position						: fixed;
	top									: 50%;
	left								: 50%;
	transform						: translate(-50%,-50%);
	width								: 160vw;
	height							: 160vh;
	background					: rgba(48,73,89,.6);
	z-index							: 1000;
}
[id='download_wall']>svg{
	position						: absolute;
	top									: 50%;
	left								: 50%;
	transform						: translate(-50%,-50%);
	width								: 10vw;
	height							: 10vw;
	opacity							: .6;
}

[id='download_prg']{
	position						: absolute;
	top									: 50%;
	left								: 50%;
	transform						: translate(-50%,-50%);
	width								: 100%;
	max-width						: 800px;
	height							: 16px;
	border-radius				: 8px;
	background					: rgb(200,200,200);
	opacity							: .6;
}
[id='download_prg']>var{
	width								: 0%;
	height							: 16px;
	border-radius				: 8px;
	background					: rgb(0,150,255);
	opacity							: .9;
}



[class='loader_anime']{
	position						: absolute;
	top									: 50%;
	left								: 50%;
	transform						: translate(-50%,-50%);
	opacity							: .8;
	width								: 100px;
	height							: 100px;
}