.f {
	width:120px; 
	height:50px; 
	background:#fff; 
	position:fixed; 
	right:30px; 
	top:180px; 
	margin:0px;
	border-radius:20px;
	box-shadow: 1px 1px 5px rgba(0,0,0,.5);
}
.f:hover{
	background:#618ccc; 
	cursor:pointer;
	transform: scale(1.1);
	transition: all 0.5s ease-in-out;
}
input[type="button"] {
	font-size: 16px;
	z-index: 1;
}
.intro .text{
	width: 40%;
	position: absolute;
	color: #fff;
	top: 30%;
	right: 2%;
	text-shadow: 1px 1px 5px #000
}
.intro img{
	width: 100%;
	animation: showup 1s;
}
.clone{
	background: linear-gradient(-269deg, #294960 2%, #182e41 48%);
	color: #fff;
}
.clone .row{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
}
.clone .text{
	width: 50%;
	padding: 16px;
	margin: 0 auto;
}
.clone .video{
	margin: 5px;
	position: relative;
}
.clone .video:hover{
	background: linear-gradient(to right, rgba(0,0,0,0) 0, rgba(255,255,255,0.05) 20%);
}
.clone .video img{
	width: 100%;
	max-width: 960px;
	box-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.clone .video::before{
	content: url(/images/global-common/play.svg);
	width: 60px;
	height: 60px;
	position: absolute;
	left: calc(100% / 2 - 30px);
	top: calc(100% / 2 - 30px);
}
.clone_effect{
	background: #1b3a50;
}
.clone_effect .row{
	width: 100%;
	max-width: 1260px;
	margin: 0 auto;
	display: flex;
	align-items: center;
}
.clone_effect .row img{
	width: 33%;
	max-width: 620px;
}
.clone_effect .text{
	color: #fff;
	padding: 0 16px 16px 16px;
}
.clone_show .text{
	width: 100%;
	position: absolute;
	z-index: 1;
	background: linear-gradient(180deg, #262626 0, rgba(0,0,0,0) 100%);
	padding-top: 6vw;
	padding-bottom: 50px;
	text-align: center;
}
.clone_show h1{
	line-height: 0px;
	color: #fff;
}
.clone_show h2{
	color: #ffffff;
}
.play{
	background: rgba(255,255,255,0.25);
	color: #fff;
	height: 40px;
	border-radius: 20px;
	margin: 0 auto;
	position: relative;
	padding: 0 8px 0 46px;
	line-height: 40px;
	display: inline-block;
	cursor: pointer;
	transition: all 0.25s;
}
@keyframes showup{
	from{opacity: 0; transform: scale(0.95);}
	to{opacity: 1; transform: scale(1);}
}
.play:hover{
	background: #fff;
	color: #000;
}
.play::before{
	content: url(/images/global-common/play.svg);
	width: 36px;
	height: 36px;
	position: absolute;
	top: 2px;
	left: 2px;
}
.scenes {
	background: #fff;
}
.scenes .text{
	padding: 64px;
	width: 75%;
}
.scenes img{
	padding-top: calc(288px - 20vw);
	background: #EAEAEA;
}
.virtualhuman{
	background: linear-gradient(-269deg, #294960 2%, #182e41 48%);
	color: #fff;
}
.virtualhuman .row{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
}
.virtualhuman .text{
	width: 50%;
	padding: 16px;
	margin: 0 auto;
}
.virtualhuman .video{
	margin: 5px;
	position: relative;
}
.virtualhuman .video:hover{
	background: linear-gradient(to right, rgba(0,0,0,0) 0, rgba(255,255,255,0.05) 20%);
}
.virtualhuman .video img{
	width: 100%;
	max-width: 960px;
	box-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.virtualhuman .video::before{
	content: url(/images/global-common/play.svg);
	width: 60px;
	height: 60px;
	position: absolute;
	left: calc(100% / 2 - 30px);
	top: calc(100% / 2 - 30px);
}
.model{
	background: #fff;
	padding: 10px;
}
.model .roll{
	background-image: url(/images/products/u-gemini/roll.jpg);
	background-size: cover;
	height: 30vw;
	max-height: 450px;
	width: 100%;
	animation: backgroundshift 50s infinite linear;
}
@keyframes showup{
	from{opacity: 0; transform: scale(0.95);}
	to{opacity: 1; transform: scale(1);}
}
@keyframes backgroundshift
{
	from {background-position: 0px 0;}
	to {background-position: -4045px 0;}
}
.model .text{
	padding: 6px;
}
.virtualhuman_show{
	background: linear-gradient(-269deg, #ffffff 2%, #ffffff 48%);
	color: #fff;
}
.virtualhuman_show .row{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0 auto;
}
.virtualhuman_show .text{
	color: #000;
	width: 50%;
	padding: 16px;
	margin: 0 auto;
}
.virtualhuman_show .video{
	margin: 5px;
	width: 100%;
	position: relative;
}
.virtualhuman_show .video:hover{
	background: linear-gradient(to right, rgba(0,0,0,0) 0, rgba(255,255,255,0.05) 20%);
}
.virtualhuman_show .video img{
	width: 100%;
	box-shadow: 0 0 15px rgba(0,0,0,0.5);
}
.virtualhuman_show .video::before{
	content: url(/images/global-common/play.svg);
	width: 60px;
	height: 60px;
	position: absolute;
	left: calc(100% / 2 - 30px);
	top: calc(100% / 2 - 30px);
}
.characteristic {
	background: #fff;
}
.characteristic .text{
	padding: 64px;
	width: 75%;
}
.characteristic img{
	padding-top: calc(288px - 20vw);
	background: #EAEAEA;
}
.application{
	background: #fff;
	padding: 16px;
}
.application img{
	width: 100%;
	max-width: 1600px;
	display: block;
	margin: 0 auto;
}
.application .text{
	color: #000000;
}
@media(min-width: 1440px){
	.clone_show .text{
		padding-top: calc(1440px * 0.06);
	}
}
@media(min-width:800px){
	.intro .box{
		position: absolute;
		width: calc(100% - 0px);
		height: calc(100% - 0px);
		background: linear-gradient(
                    to left,
                    rgba(44, 44, 44, 0.719),
                    rgba(0, 0, 0, 0)75%
                    );
		display: flex;
		align-items: center;
	}
	.virtualhuman .box{
		position: absolute;
		width: calc(70% - 8px);
		height: calc(100% - 0px);
		background: linear-gradient(
                    to right,
                    rgba(255, 255, 255, 0.74)55%,
                    rgba(0, 0, 0, 0)
                    );
		display: flex;
		align-items: center;
	}
	.characteristic .box{
		position: absolute;
		width: calc(70% - 8px);
		height: calc(100% - 0px);
		background: linear-gradient(
                    to right,
                    rgba(255, 255, 255, 0.74)55%,
                    rgba(0, 0, 0, 0)
                    );
		display: flex;
		align-items: center;
	}
} 
@media(max-height: 50vw){
	.clone .image{
		width: 1440px;
	}
	.virtualhuman .image{
		width: 1440px;
	}
	.virtualhuman_show .image{
		width: 1440px;
	}
}
@media(max-width:800px){
	.intro{
		background: #333;
	}
	.intro .text{
		width: 100%;
		position: static;
		text-shadow: none;
		padding: 16px;
		text-align: center;
		margin-top: -20px;
	}
	.clone .row{
		flex-wrap: wrap;
		text-align: center;
	}
	.clone .text{
		margin: 0 auto;
		width: 100%;
	}
	.clone_effect .row{
		display: block;
	}
	.clone_effect .row img{
		margin: 0 auto;
		width: 100%;
	}
	.scenes .text{
		width: 100%;
	}
	.virtualhuman .row{
		flex-wrap: wrap;
		text-align: center;
	}
	.virtualhuman .text{
		margin: 0 auto;
		width: 100%;
	}
	
	.virtualhuman_show .row{
		flex-wrap: wrap;
		text-align: center;
	}
	.virtualhuman_show .row img{
		margin: 0 auto;
		width: 100%;
	}
	.characteristic .text{
		width: 100%;
	}
}