@charset "utf-8";


/******************************************************************************
	Fonts
******************************************************************************/
@font-face {
	font-family: Roboto;
	src: local("Roboto"),
		 local("Roboto-Regular"),
		 url("../fonts/Roboto-Regular.woff") format("woff");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: Roboto;
	src: local("Roboto-Bold"),
		 url("../fonts/Roboto-Bold.woff") format("woff");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/******************************************************************************
	Reset
******************************************************************************/



*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
ul, ol{
	list-style: none;
}
html{
	height: 100%;
	font-size: 1px;
	scroll-behavior: smooth;
}
body{
	position: relative;
	height: auto !important;
	height: 100%;
	min-height: 100%;
}
input,
input:hover,
input:focus,
input:active,
button,
button:hover,
button:focus,
button:active{
	outline: none;
}


/******************************************************************************
	Global
******************************************************************************/
body{
	min-width: 320rem;
	font-family: Roboto, sans-serif;
	font-weight: 400;
	color: #282828;
	overflow-x: hidden;
	background: #FBFBFB;
}
.wrapper{
	width: 100%;
	max-width: 1920px;

	margin: 0 auto;
	padding: 44rem 128rem 132rem;
}



/******************************************************************************
	Redirect page
******************************************************************************/
.header{
	width: 100%;
	height: 80rem;
	background: #fff;
	box-shadow: 0rem 0rem 24rem rgba(0, 0, 0, 0.06);
}
.redirect-wrapper{
	display: flex;
	flex-flow: column nowrap;
	justify-content: flex-start;
	align-items: center;

	width: 100%;
	padding-top: 88rem;
}
.redirect-wrapper__name{
	font-weight: 900;
	font-size: 40rem;
	line-height: 48rem;
	color: #000000;
	text-align: center;
}
.redirect-wrapper__desc{
	margin-top: 12rem;
	font-weight: 400;
	font-size: 24rem;
	line-height: 29rem;
	color: #000000;
	text-align: center;
}
.progressbar{
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;

	width: 264rem;
	margin: 54rem auto 0;
}
.progressbar__item{
	display: inline-block;
	width: 30rem;
	height: 30rem;
	border: 4rem solid #0084FF;
	border-radius: 50%;
	background: #0084FF;
}
.progressbar__item:nth-child(1){animation: progressbar-1 1.25s steps(1, end) infinite;}
.progressbar__item:nth-child(2){animation: progressbar-2 1.25s steps(1, end) infinite;}
.progressbar__item:nth-child(3){animation: progressbar-3 1.25s steps(1, end) infinite;}
.progressbar__item:nth-child(4){animation: progressbar-4 1.25s steps(1, end) infinite;}
@keyframes progressbar-1{
	0%	{background: transparent;}
	25% {background: #0084FF;}
	50% {background: #0084FF;}
	75% {background: #0084FF;}
	100%{background: #0084FF;}
}
@keyframes progressbar-2{
	0%	{background: #0084FF;}
	25% {background: transparent;}
	50% {background: #0084FF;}
	75% {background: #0084FF;}
	100%{background: #0084FF;}
}
@keyframes progressbar-3{
	0%	{background: #0084FF;}
	25%	{background: #0084FF;}
	50% {background: transparent;}
	75% {background: #0084FF;}
	100%{background: #0084FF;}
}
@keyframes progressbar-4{
	0%	{background: #0084FF;}
	25%	{background: #0084FF;}
	50%	{background: #0084FF;}
	75%{background: transparent;}
	100%{background: #0084FF;}
}



/******************************************************************************
	Adaptive 1920
******************************************************************************/
@media (max-width: 1920px) {
	html{
		font-size: calc(100vw / 1920);
	}
}



/******************************************************************************
	Adaptive 767
******************************************************************************/
@media (max-width: 767px) {

html{
	font-size: 1px;
}
body{
	padding-bottom: 182rem;
}
.wrapper{
	max-width: 100%;
	padding: 72rem 0 0 0;
}


/*** Header ***/
body.redirect .header{
	display: none;
}



/*** Redirect page***/
.redirect-wrapper{
	padding-top: 112rem;
}
.redirect-wrapper__name{
	width: 300rem;

	font-size: 24rem;
	line-height: 29rem;
}
.redirect-wrapper__desc{
	margin-top: 4rem;
	font-size: 16rem;
	line-height: 19rem;
}
.progressbar{
	width: 150rem;
	margin: 24rem auto 0;
}
.progressbar__item{
	width: 20rem;
	height: 20rem;
	border: 2rem solid #0084FF;
}


}