@charset "utf-8";
/* CSS Document */ 
ul,li{ list-style:none;}  
.section { text-align: center; font: 50px "Microsoft Yahei"; position: relative; overflow: hidden;}
.section .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.section .bg img { display: block; width: 100%; height: 100%;}
.bg11 {  position: absolute; bottom: 0; width: 961px; left:50%; margin-left:-480px; height: 528px; background: url(../images/bg11.png)no-repeat;}
.bg21 { position: absolute; top: 25%; left:12%; margin-left:22px; width: 532px; opacity:0; transition: all 1s; color:#000; z-index:1;}  
.bg22 { position: absolute; bottom:0; width: 100%; height: 633px;background: url(../images/page2_bg.jpg) center bottom no-repeat #f6f6f6;opacity:0;}
.bg22 ul{ width:1100px; margin:0 auto;}
.bg22 ul li{ float:left; border:1px solid #fff; font-size:16px; color:#fff; padding: 28px; margin: 22px;}

.abzx{ width:198px; margin:0 auto; background:#40a5f1; padding:20px 0; text-align:center; font-size:16px; color:#fff; }
.section2 h3 { background-image: url(../images/t2.png);}
.section h3 { position: absolute; left: 50%; top: 15%; z-index: 10; width: 713px; height: 58px; margin-left: -356px; margin-top: 60px; text-indent: -9999px; background-repeat: no-repeat; opacity: 0; -webkit-transform:scale(0.5, 0.5); transform:scale(0.5, 0.5); transition: all 1s;}
.p1 { position: absolute; left: 50%; top: 15%; width: 562px; margin-left: -255px; margin-top: 130px; font-size: 16px; color: #727F8C; opacity: 0; transition: all 1s;}
.p21 {  font-size: 30px; color: #0b0b0b; opacity: 0; }
.p22 { position: absolute; left:30%; width:680px; top:25%; font-size: 14px; color: #0b0b0b; opacity:0; text-align:left; margin:0; line-height:22px; z-index:1;} 
.p23 { position: absolute; left:30%; width:680px; top:65%; font-size: 14px; color: #0b0b0b; opacity:0; text-align:left; margin:0; line-height:22px; z-index:1;}
.bg23{position: absolute; left:30%; width:680px; top:34%; font-size: 14px; color: #0b0b0b; opacity:0; text-align:left; margin:0; line-height:22px; z-index:1;}
.bg23 li{ background:#686868; color:#fff; margin:5px 0; padding:4px 22px; display:inline-block;}
.bg23 .one{ background:#ff6600;}
.b21 { position: absolute; left:12%; top: 25%; width:354px; height:192px; margin-top:59px; opacity: 0; transition: all 0.5s;}
.section3 h3 { left:40%; width:444px; margin-left:-222px; background-image:url(../images/t3.png);}
.bg31 { position: absolute; top: 30%; left:45%; width: 681px; height: 529px; background: url(../images/bg31.png) 50% 0 no-repeat; opacity:0; transition: all 1s;}
.p31 { position: absolute; left: 40%; top: 15%; width: 444px; margin-left: -222px; margin-top: 130px; line-height:35px; text-align:left; font-size: 16px; color: #fff; opacity: 0; transition: all 1s;}
 
.bg41 { position: absolute; top: 15%; left: 50%; margin-left:72px; width: 323px; height: 282px; background: url(../images/bg41.png) no-repeat; opacity: 0; transition: all 0.5s; z-index:1;}
.bg42 { position: absolute; top: 21%; left: 50%; margin-left:-158px; width: 316px; height:236px; padding-top:55px; background: url(../images/bg42.png) no-repeat; opacity: 0; transition: all 0.5s; font-size:14px; line-height:24px;}
.bg43 {position: absolute;top: 56%;left: 36%; width:134px; color:#ff6600; border:#ff6600 solid 2px; height:45px; line-height:45px; font-size:16px; text-align:center;}
.p52 { position: absolute; top:38%; right:20%; width:244px;height:71px;background-image: url(../images/t5.png);  }
.p51 { position: absolute; top:30%; left:15%; width:700px;  opacity:0; transition: all 1s;}
.section6 h3 { width: 413px; height: 71px; margin-left: -207px;  background-image: url(../images/t6.png); top:5%; margin-top:0;}
.xyhj{ width:1130px; margin:0 auto; position:absolute; top:15%; left:50%; margin-left:-605px;}
.xyhj li{ width:360px; float:left; margin:8px; }
.xyhj li img { width:360px; height:222px;}
/* CSS3过度及动画 */
.active strong, .active h3 { opacity: 1; -webkit-transform:scale(1, 1); transform:scale(1, 1); transition-delay: 0.7s;}
.active .p1 { opacity: 1; transition-delay: 1.7s;}
.active .p11 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.active .bg21{ margin-top:0;margin-left:22px;opacity:1; transition-duration: 2s; transition-delay: 0.7s;}
.active .bg22{ opacity:1;}
.active .p21 { opacity: 1; transition-duration: 1s; transition-delay: 0.5s;}
.active .p22 { left: 40%;opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.active .bg23{left: 40%;opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.active .p23 { left: 40%;opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.active .b21 { opacity: 1; transition-duration: 1s; transition-delay: 1s;}
.active .b22 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}

.active .p31 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.active .bg31{ opacity:1; transition-duration: 2s; transition-delay: 0.7s;}

.active .bg41{ opacity:1; transition-duration:2s; transition-delay:0.7s;}
.active .bg42{ opacity:1; transition-duration:2s; transition-delay:0.7s;}
.active .bg43{ opacity:1; transition-duration:2s; transition-delay:0.7s;}

.active .p51{ opacity:1; transition-duration:2s; transition-delay:0.7s;}

@keyframes myfirst
{
0%   {transform: rotate(0deg);}
100%  { transform: rotate(10deg);}
}
/* for lt ie 10 */
.ltie10 strong, .ltie10 h3 { opacity: 1; transform:scale(1, 1); transition-delay: 0.7s;}
.ltie10 .p1 { opacity: 1; transition-delay: 1.7s;}


.ltie10 .hgroup { opacity: 1; transform:scale(1, 1); transition-delay: 0.7s;}
.ltie10 .p11 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}

.ltie10 .bg21{ margin-top:0;margin-left:0;opacity:1; transition-duration: 2s; transition-delay: 0.7s;}
.ltie10 .bg22{ opacity:1; }
.ltie10 .p21 { opacity: 1; transition-duration: 1s; transition-delay: 0.5s;}
.ltie10 .p22 {  left: 40%;opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.ltie10 .bg23{left: 40%;opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.ltie10 .p23 {  left: 40%;opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.ltie10 .b21 { opacity: 1; transition-duration: 1s; transition-delay: 1s;}
.ltie10 .b22 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}

.ltie10 .p31 { opacity: 1; transition-duration: 1s; transition-delay: 2s;}
.ltie10 .bg21{ opacity:1; transition-duration: 2s; transition-delay: 0.7s;}
.ltie10 .bg41{ opacity:1; transition-duration:2s; transition-delay:0.7s;}
.ltie10 .bg42{ opacity:1; transition-duration:2s; transition-delay:0.7s;}
.ltie10 .bg43{ opacity:1; transition-duration:2s; transition-delay:0.7s;}

.ltie10 .p51{ opacity:1; transition-duration:2s; transition-delay:0.7s;}


@media (max-width: 1366px){
	.section h3 {top:0;margin-top:10px;}
	.hgroup{ top: 40px;}
	.p11 { top:400px;}
	.p21 { top:70px; margin-top:20px;}
	.b21 { top:25%;}
	.p22 { top:35%;}
	.p31 { top:0;}
	.p51 { top:70px;}
	.bg62 { top:100px; width:70%;height:70%;background-size:100% 100%; margin-left:-30%}
	}