html, body {
	height: 100%;
}

body {
	background: #000;
	margin: 0;
}

body.no-scroll {
	overflow: hidden;
}

#download-frame {
	display: none;
}

.background {
	background-image: url(../images/bg.png);
	height: 100%; 

	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	
	 filter: blur(50px);
	-webkit-filter: blur(50px);
}

.layout {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", Helvetica, Arial, Ubuntu, sans-serif;
	color: #FFF;
	background: rgba(0, 0, 0, 0.5);
	width: calc(100% - 4em * 2);
	padding: 4em;
	text-align: center;
	position: absolute;
	top: 0;
	z-index: 2;
}

.layout.not-index {
	text-align: left;
}

	.layout .top-layout {
		display: flex;
		align-items: center;
		justify-content: center;
		flex-direction: column;
		max-width: 1050px;
		margin: 0 auto;
	}

	.layout .top-layout h1 {
		font-size: 3em;
		font-weight: 900;
		margin: 0;
	}
	
	.layout .top-layout h3 {
		font-weight: 400;
		font-size: 1.5em;
		margin-bottom: 1.5em;
	}
	
	.layout .top-layout .more {
		font-weight: 700;
		font-size: 1.5em;
		margin-top: 2.25em;
		color: #B0B0AF;
		cursor: pointer;
	}
	
		.layout .top-layout .more:hover {
			color: #FFF;
		}

	.contents {
		margin: 0 auto;
		margin-top: 7.5em;
		max-width: 1050px;
	}
	
	.not-index .contents {
		margin-top: 0;
	}
	
		.contents .icon {
			width: 128px;
			height: 128px;
			background-size: 128px 128px;
			background-image: url(../images/icon.png);
			background-repeat: no-repeat;
			margin: 4em auto;
			margin-bottom: 64px;
		}
		
		.contents .text {
			font-size: 3em;
		}
		
		.not-index .contents .text {
			margin-top: 64px;
			word-break: break-word;
			font-weight: 700;
		}
		
		.contents .text-note {
			font-size: 2em;
			margin-top: 64px;
			word-break: break-word;
		}
		
		.not-index .contents .text-note {
			margin-top: 32px;
		}
		
			 .text-note a {
				color: #FFF;
			}
		
		.contents .download-layout {
			margin: 4em 0;
			text-align: center;
		}
		
			.cta-button {
				background-image: linear-gradient(145deg,#F5AF19,#F12711) , linear-gradient(35deg,rgba(1,239,146,.25),rgba(0,216,251,.25));
				border: 0;
				border-radius: 11px;
				color: #fff;
				padding: 24px 48px;
				min-width: 400px;
				display: block;
				font-family: -apple-system,BlinkMacSystemFont,"Helvetica Neue",Helvetica,Arial,Ubuntu,sans-serif;
				font-size: 22px;
				font-weight: 700;
				cursor: pointer;
				outline: none;
				text-align: center;
				text-transform: uppercase;
				transition: all 250ms cubic-bezier(.23,1,.32,1);
				text-overflow: ellipsis;
				white-space: nowrap;
				overflow: hidden;
				margin: 0 auto;
			}
			
			.download-layout .cta-note, .download-layout .cta-note a {
				margin-top: 16px;
				font-size: 16px;
				color: #B0B0AF;
			}
			
		.contents .video {
			margin: 4em 0;
		}
		
		.contents .in-action {
		}
		
			.contents .in-action img {
				display: none;
			}
		
			.contents .in-action .see-in-action {
				font-size: 17px;
				text-transform: uppercase;
				font-weight: 700;
				margin-bottom: 24px;
				color: #B0B0AF;
				cursor: pointer;
			}
			
				.contents .in-action .see-in-action:hover {
					color: #FFF;
				}
			
		.contents .testimonials {
			
		}
		
			.contents .testimonials .t-head {
				margin-bottom: 1em;
				margin-top: 2.5em;
				font-size: 1.5em;
				font-weight: 700;
			}
			
			.contents .testimonials .testimonial {
				margin-bottom: 1em;
			}
			
				.contents .testimonials .testimonial .t-text {
					font-size: 2em;
					font-style: italic;
				}
				
				.contents .testimonials .testimonial .t-author, .contents .testimonials .testimonial .t-author a {
					font-size: 1em;
					color: #B0B0AF;
					margin-top: 10px;
				}
		
		.contents .footer, .contents .footer a {
			color: #B0B0AF;
			font-size: 1em;
		}
		
		.not-index .footer {
			margin-top: 3em;
		}

@media only screen and (max-width: 680px) {
	.contents .video iframe {
		width: 100%;
	}
	
	.contents .in-action img {
		width: 100%;
	}
}

@media only screen and (max-width: 1070px) {
	.layout .top-layout h1 {
		font-size: 3em;
	}
}
		
@media only screen and (max-height: 820px) and (max-width: 805px) {
	.layout {
		padding: 1em;
		width: calc(100% - 1em * 2);
	}
	
	.layout .top-layout h1 {
		font-size: 3em;
	}
	
	.layout .top-layout h3 {
		font-size: 2em;
	}
	
	.layout .top-layout .cta-button {
		display: none;
	}
	
	.layout .top-layout .more {
		display: none;
	}
	
	.download-layout .cta-button {
		min-width: calc(100% - 1em * 2);
	}
}