@charset 'UTF-8';
/* master mod */
*{box-sizing:border-box;-webkit-text-size-adjust:100%;}
html{width:100%;height:100%;margin:0;padding:0;overflow:hidden;}
body{
	color:#333;
	font-family:'Helvetica Neue','Helvetica','Arial',sans-serif;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	transform-style:preserve-3d;
	transform-origin:center center;
	background:#fff;
}
a{text-decoration:none;}

.wrapper{
	/*animation:pers .5s ease-out both;*/
	perspective:700px;
	overflow:hidden;
	width:100%;
	height:100%;
	background:#fff;
	z-index:0;
	margin:0;
}
@keyframes pers{
	0%{opacity:0;transform:scale(1.3);}
	100%{opacity:1;transform:scale(1);}
}

.base{
	position:absolute;
	left:50%;
	top:50%;
	width:1000px;
	height:1000px;
	transform-origin:center center 0;
	transform-style:preserve-3d;
	animation:rotator 120s linear both infinite;
	background:none;
	margin-top:-500px;
	margin-left:-500px;
	will-change:transform;
}

@keyframes rotator{
	0%{transform:translateZ(-700px) rotateX(10deg) rotateZ(0deg);}
	50%{transform:translateZ(500px) rotateX(185deg) rotateZ(180deg);}
	100%{transform:translateZ(-700px) rotateX(370deg) rotateZ(360deg);}
}
.h div{
	content:'';
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	opacity:0.6;
}

/* FF Quantum fix */
.h{
	transform-style:preserve-3d;
	height:100%;
	will-change:transform;
}

.h div:nth-of-type(1) {transform:translateY(-495px) rotateX(90deg) scale(.14);}
.h div:nth-of-type(2) {transform:translateY(-400px) rotateX(90deg) scale(.6);}
.h div:nth-of-type(3) {transform:translateY(-300px) rotateX(90deg) scale(.8);}
.h div:nth-of-type(4) {transform:translateY(-200px) rotateX(90deg) scale(.92);}
.h div:nth-of-type(5) {transform:translateY(-100px) rotateX(90deg) scale(.98);}
.h div:nth-of-type(6) {transform:translateY(0) rotateX(90deg) scale(1);}
.h div:nth-of-type(7) {transform:translateY(100px) rotateX(90deg) scale(.98);}
.h div:nth-of-type(8) {transform:translateY(200px) rotateX(90deg) scale(.92);}
.h div:nth-of-type(9) {transform:translateY(300px) rotateX(90deg) scale(.8);}
.h div:nth-of-type(10){transform:translateY(400px) rotateX(90deg) scale(.6);}
.h div:nth-of-type(11){transform:translateY(495px) rotateX(90deg) scale(.14);}
.h circle{cx:50%;cy:50%;r:50%;}
/*
	yellow:#fedb00, blue:#0072ce;
*/
.h svg{width:100%;height:100%;will-change:transform;border-radius:50%;fill:#fedb00;}
.h div:nth-of-type(1) svg {fill:#0072ce;}
.h div:nth-of-type(2) svg {fill:#0072ce;}
.h div:nth-of-type(3) svg {fill:#0072ce;}
.h div:nth-of-type(4) svg {fill:#0072ce;}
.h div:nth-of-type(5) svg {fill:#0072ce;}
.h div:nth-of-type(6) svg {fill:#0072ce;}
/*
.h div:nth-of-type(7) svg {fill:#060;}
.h div:nth-of-type(8) svg {fill:#060;}
.h div:nth-of-type(9) svg {fill:#060;}
.h div:nth-of-type(10) svg{fill:#060;}
.h div:nth-of-type(11) svg{fill:#aa0;}
*/

footer{
	position:fixed;
	left:0px;
	bottom:0;
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	padding:0 20px 20px;
	height:10vh;
	z-index:99;
}
footer .p53d{margin:0 1em 0 0;padding:0;line-height:0;}
footer .p53d img{display:block;width:24vw;max-width:110px;}
footer p{
	font-size:11px;
	line-height:130%;
	margin:0 20px 0 0;
	font-kerning:well-kerned;
	flex-basis:400px;
}
footer ul{margin:0;padding:0;list-style:none;display:flex;align-items:center;justify-content:space-between;flex-basis:400px;}
footer ul li{font-size:10px;color:#fff;background:rgba(128,128,128,.5);line-height:18px;text-align:center;padding:0;border-radius:4px;width:31%;margin:0;mix-blend-mode:hue;}


/* ----------------------------------------------------------------------------------------------------------- */
/* iPad */
/* ----------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:780px){
	footer p{font-size:10px;}
	footer ul{justify-content:space-between;}
	footer ul li{margin:0 5px 0 0;width:100%;}
	footer ul li:last-of-type{margin-right:0;}
}

/* ----------------------------------------------------------------------------------------------------------- */
/* iPhone */
/* ----------------------------------------------------------------------------------------------------------- */
@media screen and (max-width:480px){
	h1{width:14vw;margin-left:-7vw;padding-top:3vw;height:auto;border-radius:0 0 2vw 2vw;}
	h1 svg{width:4vw;}
	footer{
		display:block;height:auto;
	}
	footer h2{margin-bottom:6px;}
	footer p{margin-bottom:12px;}
}

/* ----------------------------------------------------------------------------------------------------------- */
/* iPhone X */
/* ----------------------------------------------------------------------------------------------------------- */
@supports(padding:max(0px)){
	footer{
		padding:0 max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom));
	}
	footer p{font-size:10px;}
}