@charset "utf-8";
/*=====滚屏背景=====*/
.section1 {background: url("../images/plant-01.png") no-repeat 80% center #fff;}
.section2 {background: url("../images/plant-03.png") no-repeat center center #b32626;}
.section3 {background: url("../images/plant-06.jpg") no-repeat center center #000;}
.section4 {background: url("../images/plant-08.jpg") no-repeat center center #b1b1b1;}
.section5 {background: url("../images/plant-10.jpg") no-repeat center center #dddddd;}
.section6 {background: #ca2c2d;}

/*=====元素定位=====*/
.bg01 { position: absolute; left: 55%; bottom: 15%; width: 550px; height: 355px; margin-left: 325px; margin-bottom: 80px; background: url("../images/plant-02.png") 0 0 no-repeat; transition: all 1s;  opacity: 0; margin-left: -1108px; }
.bg02 { position: absolute; left: 50%; bottom: 50%; width: 283px; height: 61px; margin-left: -400px; margin-bottom: -60px; background: url("../images/plant-04.png") 50% 0 no-repeat;opacity: 0; -webkit-transform:scale(0.5, 0.5); transform:scale(0.5, 0.5); transition: all 1s;}
.bg03 { position: absolute; right: 50%; bottom: 50%; width: 338px; height: 542px; margin-right: -800px; margin-bottom: -300px; background: url("../images/plant-05.png") 50% 0 no-repeat; opacity: 0; transition: all 1s;}
.bg04 { position: absolute; left: 55%; bottom: 50%; width: 400px; height: 200px; margin-left: 325px; margin-bottom: -100px; background: url("../images/plant-07.png") 0 0 no-repeat; transition: all 1s;  opacity: 0; margin-left: -1108px; }
.bg05 { position: absolute; right: 50%; bottom: 50%; width: 500px; height: 120px; margin-right: -850px; margin-bottom: -100px; background: url("../images/plant-09.png") 50% 0 no-repeat; opacity: 0; transition: all 1s;}
.bg06 { position: absolute; left: 55%; bottom: 50%; width: 500px; height: 190px; margin-left: 325px; margin-bottom: -100px; background: url("../images/plant-11.png") 0 0 no-repeat; transition: all 1s;  opacity: 0; margin-left: -1108px; }

.bg11 {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1200px;
	margin-left: -600px;
	margin-top: -235px;
}
.bg11 .row {
	margin: 25px 0;
}
.bg11 .bg11-more {
	display: inline-block;
	float: right;
	margin-top: -25px;
	padding-right: 25px;
	font-size: 18px;
	font-family: sans-serif;
	text-align: right;
	color: #fff;
}
.bg11 .bg11-more:hover {
	color: #fff;
}

/*===== CSS3过度及动画 =====*/
.active .bg01 { margin-left: -680px; opacity: 1; transition-delay: 0.7s;}
.active .bg02 { opacity: 1; -webkit-transform:scale(1, 1); transform:scale(1, 1); transition-delay: .8s;}
.active .bg03 { margin-right: -500px; opacity: 1; transition-delay: 1.5s;}
.active .bg04 { margin-left: -600px; opacity: 1; transition-delay: 0.7s;}
.active .bg05 { margin-right: -550px; opacity: 1; transition-delay: 0.8s;}
.active .bg06 { margin-left: -700px; opacity: 1; transition-delay: 0.7s;}
