html{ font-size: 16px; overflow-x: hidden; max-width: 100vw; }
body{ max-width: 100vw; margin:0; color: #000; stroke: #000; background-color: #6b19db;font-family: "OsnovaPro"; overflow-x: hidden; text-align: center; font-size: 18px;}
body.no-scroll{ overflow: hidden; }
img{ border:0; max-width: 100%; }
input::-moz-focus-inner, select::-moz-focus-inner{ border:0; }
input{ padding:0; margin:0; border:0; }
button{ border: 0; background-color: transparent; }
a{ text-decoration: none; color: inherit; }
a:hover, a:visited{ text-decoration: none; cursor: pointer; opacity: 0.8;}
:focus, :active{ outline: none; }
ul, ol{ margin: 0; padding: 0; list-style: none; }
li{list-style: none;}
hr{ border-top: 1px solid #8eacb7; margin-top: 20px; margin-bottom: 20px; }
body{
	color: #fff;
	font-family: "OsnovaPro";
	background-color: #6b19db;
}
.bg{
	min-height: 100vh;
}
header{
	min-height: 55vh;
	background-image: url('/images/top_image.jpg?v=1');
	background-repeat: no-repeat;
	background-position: top;	
	background-size:  auto 100%;
}
header .logo{
	display: none;
}
header .logo img{
	margin: 15px auto;
	max-width: 200px;
}
.wrapper{
	max-width: 420px;
	margin: 0 auto;
	padding: 0 15px;
}
.text{
	margin-top: -8vh;
}
header .slogan{
	color: #2e1a6d;
	font-weight: bold;
}
.desc{
	line-height: 20px;
	padding: 0 10%;
}
.title{
	margin: 15px 0 10px;
	text-transform: uppercase;
	font-family:OsnovaProMedium;
}
.wrapper ul{
	display: flex;
	align-items: center;
	justify-content: center;
}
.wrapper ul li{
	padding: 0 1.5%;
	width: 34%;
}
ul.www li{
    width:50%;
}
ul.www .rocs a, ul.www .www-spec a{
	background-size: 100%;
	background-repeat: no-repeat;
	font-size: 11px;
	padding: 22px 0;
	line-height: 15px;
	display: block;
}
ul.www .rocs a{
	background-image: url('/images/www.png');
}
ul.www .www-spec a{
	background-image: url('/images/spec.png');
	padding: 15px 0;
}
ul.www .rocs a span, ul.www .www-spec a span{
	text-decoration: underline;
}
ul.www .rocs a:hover span, ul.www .www-spec a:hover span{
	text-decoration: none;
}
footer{
	padding: 20px 0 50px;
}
footer img{
	max-width: 200px;
}
@media only screen and (min-width: 800px) {
	header .logo img{
		margin: 50px auto;
	}
	.title{
		margin: 30px 0 10px;
	}
}

@media only screen and (max-width: 550px) {
	body{
		background-image: url('/images/top_image_mobile.jpg?v=1');
		background-repeat: no-repeat;
		background-position: top;	
		background-size:  160%;
	}
	header, .bg{
		background-image: none;
	}
	header{
		min-height: 50vh;
	}
	.text{
		margin-top: 0;
	}	
	header .logo{
		display: block;
	}
	header .logo img{
		max-width: 90px;
	}
}