﻿
body {
	font:"Open Sans", sans-serif;
}
div.burger {
	width:0.8rem;
	height: 0.6rem;
	cursor: pointer;
	overflow: hidden;
	float: right;
	margin-top:0.4rem ;
	position: relative;
}
div.x,
div.y,
div.z {
	background: #fff;
	border-radius:0.6rem;
	margin-top: 0.1rem;
	transition: all 200ms ease-out;
}
div.x, div.y, div.z {
	width: 0.6rem;
	height: 0.06rem;
}
div.collapse{
	top:1rem;
	transition: all 70ms ease-out;
}
div.open{
}
div.open div.x{
	position: absolute;
	top: 0.06rem;
	left: 0.05rem;
	margin-top:0.2rem;
}
div.open div.z{
	position: absolute;
	top: 0.06rem;
	left: 0.05rem;
	margin-top: 0.2rem;
}
div.rotate30{
	transform: rotate(30deg);
	transition: all 50ms ease-out;
}
div.rotate150{

	transform: rotate(150deg);
	transition: all 50ms ease-out;
}

div.rotate45{
	transform: rotate(45deg);
	transition: all 100ms ease-out;
}
div.rotate135{
	transform: rotate(135deg);
	transition: all 100ms ease-out;
}

div.menucon{
	width: 100%;
	position: absolute;
	top: 1.4rem;
	padding-bottom: 0.5rem;
	background: rgba(28,76,160,0.9);
	transition: transform 1s;
	opacity: 0;
	height: 5.5rem;

}

div.menucon.animate{
	opacity: 1;
	z-index: 4;
	position: absolute;
}
div.menu {
	height:5.5rem;
	width: 320px;
	transition: transform 1s;
	opacity: 0;
	overflow: hidden;
	position: relative;
	z-index: 9999;
}
div.menu.animate{
	display: block;
	opacity: 1;
}
.menu-splitL, .menu-splitR{
	overflow:hidden;
	position: absolute;
	top: 10px;
	left: 0px;
	width:160px;
}
.menu-splitR{
	left:160px;
}

div.menu ul li {
	width:320px;
	margin-top:0.4rem;
	text-align:center;
	font-size:0.32rem;
	transition: all 150ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
}
div.menu ul li a {
	color:#fff;
	display: block !important;
	text-decoration:none;
	letter-spacing:3px;
}
section > div {
	transition: transform 1s;
	transform: translateX(0px);
}

div.menu li.animate{
	font-size:0.32rem;
	opacity:1;
	transition: all 200ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
}

.menu-splitL li:nth-of-type(1){	margin-left:44px;transition-delay: 0.12s;}
.menu-splitL li.animate:nth-of-type(1){	margin-left:0;	transition-delay: 0.0s;	}

.menu-splitL li:nth-of-type(2){	margin-left:41px;	transition-delay: 0.09s;}
.menu-splitL li.animate:nth-of-type(2){	margin-left:0;	transition-delay: 0.05s;}

.menu-splitL li:nth-of-type(3){	margin-left:57px;	transition-delay: 0.046s;}
.menu-splitL li.animate:nth-of-type(3){	margin-left:0;	transition-delay: 0.1s;}

.menu-splitL li:nth-of-type(4){	margin-left:61px;transition-delay: 0.03s;}
.menu-splitL li.animate:nth-of-type(4){	margin-left:0;	transition-delay: 0.15s;}

.menu-splitL li:nth-of-type(5){	margin-left:59px;	transition-delay: 0.0s;	}
.menu-splitL li.animate:nth-of-type(5){	margin-left:0;	transition-delay: 0.2s;	}

.menu-splitL li:nth-of-type(6){	margin-left:59px;	transition-delay: 0.0s;	}
.menu-splitL li.animate:nth-of-type(6){	margin-left:0;	transition-delay: 0.2s;	}

.menu-splitL li:nth-of-type(7){	margin-left:59px;	transition-delay: 0.0s;	}
.menu-splitL li.animate:nth-of-type(7){	margin-left:0;	transition-delay: 0.2s;	}



.menu-splitR li:nth-of-type(1){	margin-left:-201px;transition-delay: 0.12s;}
.menu-splitR li.animate:nth-of-type(1){	margin-left:-160px;	transition-delay: 0.0s;	}

.menu-splitR li:nth-of-type(2){	margin-left:-203px;	transition-delay: 0.069s;}
.menu-splitR li.animate:nth-of-type(2){	margin-left:-160px;	transition-delay: 0.05s;}

.menu-splitR li:nth-of-type(3){	margin-left:-214px;	transition-delay: 0.06s;}
.menu-splitR li.animate:nth-of-type(3){	margin-left:-160px;	transition-delay: 0.1s;}

.menu-splitR li:nth-of-type(4){	margin-left:-217px;transition-delay: 0.03s;}
.menu-splitR li.animate:nth-of-type(4){	margin-left:-160px;	transition-delay: 0.15s;}

.menu-splitR li:nth-of-type(5){	margin-left:-217px;	transition-delay: 0.0s;	}
.menu-splitR li.animate:nth-of-type(5){	margin-left:-160px;	transition-delay: 0.2s;	}

.menu-splitR li:nth-of-type(6){	margin-left:-217px;	transition-delay: 0.0s;	}
.menu-splitR li.animate:nth-of-type(6){	margin-left:-160px;	transition-delay: 0.2s;	}

.menu-splitR li:nth-of-type(7){	margin-left:-217px;	transition-delay: 0.0s;	}
.menu-splitR li.animate:nth-of-type(7){	margin-left:-160px;	transition-delay: 0.2s;	}