.topwrap {
	height: 94vh;
	padding-bottom: 46%;
	overflow: hidden;
	position: relative;
	background: #f38400;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s
}
.topwrap .box1 {
	position: absolute;
	width: 1000px;
	height: 1500px;
	background: #FFF;
	top: -400px;
	left: -64rem;
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	-webkit-animation: go .5s 1 forwards;
	animation: go .5s 1 forwards;
	-webkit-transform-origin: right left;
	-ms-transform-origin: right left;
	transform-origin: right left
}
.topwrap .box2 {
	position: absolute;
	width: 800px;
	height: 800px;
	background: #fff100;
	top: 100%;
	left: 0rem;
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	-webkit-animation: go2 .5s .3s 1 forwards;
	animation: go2 .5s .3s 1 forwards;
	-webkit-transform-origin: left top;
	-ms-transform-origin: left top;
	transform-origin: left top;
	opacity: 0
}
.topwrap .box3 {
	position: absolute;
	width: 1200px;
	height: 1500px;
	background: #f1c826;
	top: 95%;
	left: -43rem;
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	-webkit-animation: go3 .5s .5s 1 forwards;
	animation: go3 .5s .5s 1 forwards;
	-webkit-transform-origin: right bottom;
	-ms-transform-origin: right bottom;
	transform-origin: right bottom;
	opacity: 0
}
@media screen and (min-width: 960px) {
.topwrap {
	height: 65vh;
	padding-bottom: 52%
}
}
@media screen and (min-width: 1080px) {
.topwrap {
	height: 80vh;
	padding-bottom: 51%
}
.topwrap .box1 {
	width: 900px
}
}
@media screen and (min-width: 1366px) {
.topwrap {
	height: 85vh;
	padding-bottom: 50%
}
.topwrap .box1 {
	width: 960px
}
}
@media screen and (min-width: 1600px) {
.topwrap {
	height: 98vh;
	padding-bottom: 48%
}
}
@media screen and (min-width: 1900px) {
.topwrap {
	height: 96vh;
	padding-bottom: 47%
}
}
@media screen and (max-width: 1024px) {
.topwrap {
	height: 530px
}
}
@media screen and (max-width: 768px) {
.topwrap {
	height: 54vh
}
.topwrap .box1 {
	width: 400px;
	height: 900px;
	top: -400px;
	left: -13rem
}
.topwrap .box2 {
	width: 400px;
	height: 400px;
	top: 120%
}
.topwrap .box3 {
	width: 1200px;
	height: 800px;
	top: 98%
}
}

.kv {
	width: 100%;
	position: absolute;
	top: 125px;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	transition: all .5s;
	opacity: 0;
	-webkit-animation: go4 2s 1s 1 forwards;
	animation: go4 2s 1s 1 forwards
}
@media screen and (max-width: 768px) {.kv {
	top: 110px
}}
@media screen and (max-width: 414px) {
.kv {
	top: 80px
}
.topwrap {
	height: 260px
}
.topwrap .box1 {
	left: -23rem
}
.topwrap .box3 {
	width: 800px
}
}
@media screen and (max-width: 375px) {
.kv {
	top: 70px
}
.topwrap {
	height: 226px
}
}
@-webkit-keyframes go {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
opacity:0
}
100% {
-webkit-transform:rotate(24deg);
transform:rotate(24deg);
opacity:1
}
}
@keyframes go {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
opacity:0
}
100% {
-webkit-transform:rotate(24deg);
transform:rotate(24deg);
opacity:1
}
}
@-webkit-keyframes go2 {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
opacity:0
}
100% {
-webkit-transform:rotate(-36deg);
transform:rotate(-36deg);
opacity:1
}
}
@keyframes go2 {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
opacity:0
}
100% {
-webkit-transform:rotate(-36deg);
transform:rotate(-36deg);
opacity:1
}
}
@-webkit-keyframes go3 {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
opacity:0
}
100% {
-webkit-transform:rotate(15deg);
transform:rotate(15deg);
opacity:1
}
}
@keyframes go3 {
0% {
-webkit-transform:rotate(0deg);
transform:rotate(0deg);
opacity:0
}
100% {
-webkit-transform:rotate(15deg);
transform:rotate(15deg);
opacity:1
}
}
@-webkit-keyframes go4 {
0% {
right:-50%;
opacity:0
}
100% {
right:0px;
opacity:1
}
}
@keyframes go4 {
0% {
right:-50%;
opacity:0
}
100% {
right:0px;
opacity:1
}
}
.menu {
	position: absolute;
	z-index: 999;
	width: 100%
}
.navbar-nav li a {
	color: #FFF
}
