@charset "UTF-8";
* {
	margin: 0;
	padding: 0;
}
html {
	overflow: hidden;
	height: 100%;
	width:100%;
}
body {
	background-color: rgba(0,204,228,1.00);
	overflow: hidden;
	height: 100%;
	width:100%;
}
#logo {
	width: 233px;
	height: 29px;
	background: url(../img/logo.svg) 0 0 no-repeat;
	position: absolute;
	bottom: 70px;
	right: 80px;
}
#bg {
	background-color: rgba(255,255,255,1.00);
	height: 2200px;
	width: 1000px;
	-moz-transform: skewX(-25deg);
	-ms-transform: skewX(-25deg);
	-o-transform: skewX(-25deg);
	-webkit-transform: skewX(-25deg);
	transform: skewX(-25deg);
	position: absolute;
	top: 0;
	left: -850px;
	z-index: 1;
}
#hello {
	position: absolute;
	top: 150px;
	left: 80px;
	background: url(../img/hello.svg) 0 0 no-repeat;
	height: 138px;
	width: 264px;
	z-index: 2;
}

@media only screen and (max-width : 1024px) {
#logo {
	width: 233px;
	height: 29px;
	background: url(../img/logo.svg) 0 0 no-repeat;
	position: absolute;
	bottom: 70px;
	left: 50%;
	margin-left:-117px;
}
#hello {
	position: absolute;
	top: 100px;
	left:50%;
	margin-left:-132px;
	background: url(../img/hello.svg) 0 0 no-repeat;
	height: 138px;
	width: 264px;
	z-index: 2;
}
#bg {
	height: 630px;
	width: 100%;
	top: -250px;
	left: 0;
	-moz-transform: skewY(-10deg);
	-ms-transform: skewY(-10deg);
	-o-transform: skewY(-10deg);
	-webkit-transform: skewY(-10deg);
	transform: skewY(-10deg);
}
}
