﻿body {
    position: relative;
    margin: 0;
    padding: 0;
    color: #FFFFFF;
    font-family: "微软雅黑", STHeiti Light, Helvetica, Arial, Tahoma;
    font-size: 14px;
}


a {
      cursor: pointer;
}

.swiper-slide {
    position: relative;
    height: 800px;
    overflow: hidden;
    background: rgb(255, 255, 255);
    text-align: center;
    font-size: 18px;
    display: flex;
}

.swiper-wrap {
    width: 100%;
    height: 100%;
    text-align: left;
    position: relative;
}


.arrow_top {
    background-color: #CCCCCC;
    border-radius: 100%;
    opacity: 0.2;
    margin: auto;
    left: 0px;
    width: 30px;
    height: 30px;
    right: 0px;
    bottom: 20px;
    display: block;
    position: fixed;
    z-index: 999;
    -webkit-animation: moveIconUp 1.5s ease infinite;
    -o-animation: moveIconUp 1.5s ease infinite;
    -moz-animation: moveIconUp 1.5s ease infinite;
    animation: moveIconUp 1.5s ease infinite;
}

    .arrow_top:after {
        border: solid #fff;
        border-width: 1px 1px 0 0;
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
        width: 8px;
        height: 8px;
        display: block;
        content: '';
        margin: 0px 0 0 10px;
    }

    .arrow_top:before {
        border: solid #fff;
        border-width: 1px 1px 0 0;
        -webkit-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        transform: rotate(-45deg);
        width: 8px;
        height: 8px;
        display: block;
        content: '';
        margin: 7px 0 0 10px;
    }

.home-page {
    overflow: hidden;
    position: relative;
    margin: 0;
    padding: 0;
}

.logo_all {
    margin: 0px auto 0px;
    top: 0;
    left: 15%;
    width: 210px;
    height: 88px;
    position: fixed;
    background: url(logo-bg.png) no-repeat center center;
    background-size: cover;
    z-index: 300;
}

/*第一种按钮
.bot_all {
	margin: 0px auto 0px;
	top:0;
	right:15%;
	width: 316px;
	height: 76px;
	position: fixed;
	background: url(bot.png) no-repeat center center;
	background-size:cover;
	z-index: 300;
	font-size:12px;
	color:#FFFFFF;
	text-align:center;
	font-weight:bold;
}
.bot-t{
	position: absolute;
	width:70px;
	top:40px;
	left:0;
	}
	
.bot-1 {
	background: url(bot-1.png) no-repeat center center;
	position: absolute;
	width:70px;
	height:34px;
	top:10px;
	left:16px;
	margin:0 0 0 0;
}
.bot-2 {
	background: url(bot-2.png) no-repeat center center;
	position: absolute;
	width:70px;
	height:34px;
	top:10px;
	left:88px;
	margin:0 0 0 0;
}
	
.bot-3 {
	background: url(bot-3.png) no-repeat center center;
	position: absolute;
	width:70px;
	height:34px;
	top:10px;
	left:158px;
	margin:0 0 0 0;
}
.bot-4 {
	background: url(bot-4.png) no-repeat center center;
	position: absolute;
	width:70px;
	height:34px;
	top:10px;
	left:228px;
	margin:0 0 0 0;
}*/
.bot_all {
    margin: 0px auto 0px;
    top: 0;
    right: 15%;
    width: 340px;
    height: 30px;
    position: fixed;
    background: url(bot.png) no-repeat center center;
    background-size: cover;
    z-index: 300;
    font-size: 12px;
    color: #FFFFFF;
    text-align: left;
}

.bot-t {
    position: absolute;
    width: 70px;
    top: 3px;
    left: 19px;
}

.bot-1 {
    background: url(bot-1s.png) no-repeat center left;
    position: absolute;
    width: 85px;
    height: 20px;
    top: 4px;
    left: 14px;
    margin: 0 0 0 0;
}

.bot-2 {
    background: url(bot-2s.png) no-repeat center left;
    position: absolute;
    width: 85px;
    height: 20px;
    top: 4px;
    left: 93px;
    margin: 0 0 0 0;
}

.bot-3 {
    background: url(bot-3s.png) no-repeat center left;
    position: absolute;
    width: 85px;
    height: 20px;
    top: 4px;
    left: 173px;
    margin: 0 0 0 0;
}

.bot-4 {
    background: url(bot-4s.png) no-repeat center left;
    position: absolute;
    width: 85px;
    height: 20px;
    top: 4px;
    left: 252px;
    margin: 0 0 0 0;
}
.bot-4 a {
    color: #fff !important;
}
/*第二种按钮*/



.logo {
    margin: 8px 0 0 7px;
    top: 0%;
    left: 15%;
    width: 185px;
    height: 60px;
    position: fixed;
    background-size: cover;
    z-index: 301;
}

.swiper-pagination-bullet-active {
    background-color: #ff9900;
}

.first.swiper-slide {
    background: url(1-bg.png) no-repeat center center;
    background-size: cover;
    background-color: #efefef;
}

.second.swiper-slide {
    background: url(1-bg.png) no-repeat center center;
    background-size: cover;
    background-color: #efefef;
}

.third.swiper-slide {
    background: url(1-bg.png) no-repeat center center;
    background-size: cover;
    background-color: #097bb1;
}

.fourth.swiper-slide {
    background: url(1-bg.png) no-repeat center center;
    background-size: cover;
    background-color: #00afa9;
}

.fifth.swiper-slide {
    background: url(1-bg.png) no-repeat center center;
    background-size: cover;
    background-color: #097bb1;
}

.sisth.swiper-slide {
    background: url(1-bg.png) no-repeat center center;
    background-size: cover;
    background-color: #097bb1;
}

.first-foot {
    background: url(1-foot.png) no-repeat center center;
    width: 187px;
    height: 59px;
    position: absolute;
    top: 91%;
    left: 50%;
    text-align: left;
    font-size: 14px;
    line-height: 58px;
    color: #fff;
    margin: 0px 0 0 284px;
    z-index: 15;
    letter-spacing: 2px;
}

.second-foot {
    background: url(2-foot.png) no-repeat center center;
    width: 187px;
    height: 59px;
    position: absolute;
    top: 91%;
    left: 50%;
    text-align: left;
    font-size: 14px;
    line-height: 58px;
    color: #fff;
    margin: 0px 0 0 284px;
    z-index: 15;
    letter-spacing: 2px;
}

.third-foot {
    background: url(3-foot.png) no-repeat center center;
    width: 187px;
    height: 59px;
    position: absolute;
    top: 91%;
    left: 50%;
    text-align: left;
    font-size: 14px;
    line-height: 58px;
    color: #fff;
    margin: 0px 0 0 284px;
    z-index: 15;
    letter-spacing: 2px;
}

.fourth-foot {
    background: url(4-foot.png) no-repeat center center;
    width: 187px;
    height: 59px;
    position: absolute;
    top: 91%;
    left: 50%;
    text-align: left;
    font-size: 14px;
    line-height: 58px;
    color: #fff;
    margin: 0px 0 0 284px;
    z-index: 15;
    letter-spacing: 2px;
}

.first-face {
    /*background:url(1-peple-1.png) no-repeat center center;*/
    background-size: cover;
    position: absolute;
    width: 200px;
    height: 200px;
    top: 9.2%;
    left: 50%;
    margin: 0 0 0 -100px;
    z-index: 20;
    opacity:0;
}



.swiper-slide-active.first .first-face {
    -webkit-animation: pop3 .2s ease-in-out forwards 1.5s 1;
    -o-animation: pop3 .2s ease-in-out forwards 1.5s 1;
    -moz-animation: pop3 .2s ease-in-out forwards 1.5s 1;
    animation: pop3 .2s ease-in-out forwards 1.5s 1;
}

.windmill {
    background-size: cover;
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    width: 200px;
    height: 200px;
    margin: 0 0 0 0px;
}



.swiper-slide-active.first .windmill {
    -webkit-animation: pop4 .3s ease-in-out forwards 1.8s 1;
    -o-animation: pop4 .3s ease-in-out forwards 1.8s 1;
    -moz-animation: pop4 .3s ease-in-out forwards 1.8s 1;
    animation: pop4 .3s ease-in-out forwards 1.8s 1;
}

.first-feng {
    background: url(1-feng.png) no-repeat center top;
    background-size: cover;
    position: absolute;
    width: 397px;
    height: 243px;
    top: 7%;
    left: 50%;
    margin: 0 0 0 -180px;
    opacity:0;
}



.swiper-slide-active.first .first-feng {
    opacity: 0.5;
    -webkit-transition: opacity 0s linear 1.7s;
    -o-transition: opacity 0s linear 1.7s;
    -moz-transition: opacity 0s linear 1.7s;
    transition: opacity 0s linear 1.7s;
}

.first-tex {
    position: relative;
    margin: 0 0 0 0px;
    z-index: 50;
}



.swiper-slide-active.first .first-tex {
    -webkit-transform: translate3d(0, 180px, 0);
    -o-transform: translate3d(0, 180px, 0);
    -moz-transform: translate3d(0, 180px, 0);
    -webkit-animation: enterUpBounce 1.8s ease forwards;
    -o-animation: enterUpBounce 1.8s ease forwards;
    -moz-animation: enterUpBounce 1.8s ease forwards;
    -webkit-animation-delay: 1s;
    -o-animation-delay: 1s;
    -moz-animation-delay: 1s;
}

.first-tit {
    position: absolute;
    left: 50%;
    top: 50%;
    text-align: center;
    font-size: 20px;
    color: #0a7cb2;
    font-weight: bold;
    margin: -25px 0 0 -110px;
    z-index: 50;
}



.first-quan {
    background:
    /*url(1-quan.png) no-repeat*/
    center center;
    background-size: cover;
    position: absolute;
    width: 913px;
    height: 336px;
    top: 4%;
    left: 50%;
    margin: 0 0 0 -455px;
    z-index: 5;
   
   
}

.quan01 {
    background-color: #000;
    opacity: 0.1;
    border-radius: 100%;
    position: absolute;
    margin: 0 0 0 4px;
    left: 50px;
    top: 92px;
    width: 60px;
    height: 60px;
     opacity:0;
}





.quan02 {
    background-color: #000;
    opacity: 0.1;
    border-radius: 100%;
    position: absolute;
    margin: 0 0 0 125px;
    left: 50px;
    top: 92px;
    width: 40px;
    height: 40px;
     opacity:0;
}





.quan03 {
    background-color: #000;
    opacity: 0.1;
    border-radius: 100%;
    position: absolute;
    margin: 0 164px 0 0px;
    right: 50px;
    top: 90px;
    width: 30px;
    height: 30px;
     opacity:0;
}





.quan04 {
    background-color: #000;
    opacity: 0.1;
    border-radius: 100%;
    position: absolute;
    margin: 0 188px 0 0px;
    right: 50px;
    bottom: 81px;
    width: 42px;
    height: 42px;
     opacity:0;
}





.quan05 {
    background-color: #000;
    opacity: 0.1;
    border-radius: 100%;
    position: absolute;
    margin: 0 -27px 0 0px;
    right: 50px;
    bottom: 67px;
    width: 57px;
    height: 57px;
     opacity:0;
}





.quan06 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 0px 0 366px;
    left: 50px;
    top: 12px;
    width: 40px;
    height: 40px;
     opacity:0;
}





.quan07 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 0px 0 229px;
    left: 50px;
    top: 167px;
    width: 30px;
    height: 30px;
     opacity:0;
}




.quan08 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 0px 0 -31px;
    left: 50px;
    top: 231px;
    width: 23px;
    height: 23px;
     opacity:0;
}





.quan09 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 0px 0 182px;
    left: 50px;
    top: 225px;
    width: 53px;
    height: 53px;
     opacity:0;
}





.quan10 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 0px 0 82px;
    left: 50px;
    bottom: 18px;
    width: 32px;
    height: 32px;
     opacity:0;
}





.quan11 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 -13px 0 0px;
    right: 50px;
    top: 49px;
    width: 25px;
    height: 25px;
     opacity:0;
}





.quan12 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 73px 0 0px;
    right: 50px;
    top: 147px;
    width: 28px;
    height: 28px;
     opacity:0;
}





.quan13 {
    background-color: #fff;
    border-radius: 100%;
    position: absolute;
    opacity: 0.3;
    margin: 0 116px 0 0px;
    right: 50px;
    bottom: 19px;
    width: 48px;
    height: 48px;
     opacity:0;
}





.first-cloud-1 {
    background-size: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 40px 0 0 0px;
   
}

.cloud01 {
    background: url(1-cloud-01.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 447px;
    height: 200px;
    top: 62.5%;
    left: 50%;
    margin: 0px 0 0 -300px;
    overflow: hidden;
    z-index: 17;

}

.cloud02 {
    background: url(1-cloud-02.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 191px;
    height: 87px;
    top: 73%;
    left: 50%;
    margin: 60px 0 0 -438px;
    z-index: 16;
}

.cloud03 {
    background: url(1-cloud-03.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 249px;
    height: 113px;
    top: 65%;
    left: 50%;
    margin: 0px 0 0 -364px;
    z-index: 15;
}

.cloud04 {
    background: url(1-cloud-04.png) no-repeat center top;
    position: absolute;
    width: 165px;
    height: 75px;
    margin: 0px 0 0 -187px;
    top: 57%;
    left: 50%;
    z-index: 14;
}

.cloud05 {
    background: url(1-cloud-05.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 90px;
    height: 40px;
    top: 57%;
    left: 50%;
    margin: -14px 0 0 25px;
    z-index: 13;
}

.cloud06 {
    background: url(1-cloud-06.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 55px;
    height: 25px;
    top: 62%;
    left: 50%;
    margin: 0px 0 0 -344px;
    z-index: 12;
}

.cloud07 {
    background: url(1-cloud-07.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 52px;
    height: 24px;
    top: 57%;
    left: 50%;
    margin: -17px 0 0 -187px;
    z-index: 11;
}

.first-cloud-2 {
    background-size: cover;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 40px 0 0 0px;
}

.cloud08 {
    background: url(1-cloud-08.png) no-repeat center top;
    background-size: cover;
    position: absolute;
    width: 340px;
    height: 153px;
    margin: 27px 0 0 56px;
    top: 68%;
    left: 50%;
    z-index: 14;
}

.cloud09 {
    background: url(1-cloud-09.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 143px;
    height: 65px;
    top: 62%;
    left: 50%;
    margin: 21px 0 0 86px;
    z-index: 13;
}

.cloud10 {
    background: url(1-cloud-10.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 111px;
    height: 52px;
    top: 60%;
    left: 50%;
    margin: 0px 0 0 320px;
    z-index: 50;
}

.cloud11 {
    background: url(1-cloud-11.png) no-repeat center center;
    background-size: cover;
    position: absolute;
    width: 51px;
    height: 23px;
    top: 59%;
    left: 50%;
    margin: 0px 0 0 182px;
    z-index: 11;
}



.name-tit {
    position: absolute;
    text-align: right;
    font-size: 18px;
    color: #fff;
    margin: 97px 0 0 85px;
    z-index: 30;
}

.name {
    position: absolute;
    font-size: 50px;
    color: #fff;
    font-weight: bold;
    margin: 55px 0 0 170px;
    z-index: 30;
    letter-spacing: 15px;
}

.name-zy {
    position: absolute;
    text-align: center;
    font-size: 16px;
    color: #fff;
    margin: 128px 0 0 202px;
    z-index: 30;
    letter-spacing: 2px;
}

.yx-tit {
    position: absolute;
    text-align: left;
    font-size: 14px;
    color: #fff000;
    margin: 33px 0 0 160px;
    z-index: 30;
    letter-spacing: 2px;
    opacity:0;
}



.yx {
    position: absolute;
    text-align: left;
    font-size: 14px;
    color: #fff;
    margin: 58px 0 0 120px;
    z-index: 30;
    letter-spacing: 2px;
    opacity:0;
}



.contact-1 {
    position: absolute;
    text-align: left;
    font-size: 14px;
    color: #fff;
    margin: 20px 0 0 12px;
    z-index: 35;
    letter-spacing: 1px;
    opacity:0;
}



.second-about-1 {
    position: absolute;
    background: url(2-about.png) no-repeat center center;
    background-size: cover;
    top: 11%;
    left: 50%;
    width: 214px;
    height: 214px;
    z-index: 15;
    margin: -20px 0 0 -335px;
}



.second-about-2 {
    position: absolute;
    left: 50%;
    top: 13%;
    text-align: left;
    font-size: 14px;
    line-height: 24px;
    color: #333;
    margin: -16px 0 0 -40px;
    z-index: 30;
    opacity:0;
}


.second-about-p {
    background: url(2-about-p1.png) no-repeat center top;
    position: absolute;
    width: 20px;
    height: 20px;
    top: 13.5%;
    left: 9%;
    margin: -18px 0 0 -72px;
    z-index: 15;
    opacity:0;
}



.second-skill-bg {
    background: url(2-bg.png) no-repeat center top;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 37%;
    left: 0%;
    margin: 0px 0 0 0px;
    z-index: 5;
}



.second-skill-p {
    background: url(2-about-p2.png) no-repeat center top;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0%;
    left: 0%;
    margin: 0px 0 0 -37px;
    z-index: 15;
    opacity:0;
}



.second-skill-1 {
    background: url(2-skill.png) no-repeat center center;
    position: absolute;
    background-size: cover;
    width: 214px;
    height: 214px;
    top: 150px;
    right: -50px;
    margin: 0px 0 0 0;
    z-index: 15;
    opacity:0;
}

.second-skill {
    width: 800px;
    position: relative;
    margin: auto;
}


.second-skill-2 {
    position: absolute;
    left: 10%;
    top: 200px;
    text-align: left;
    font-size: 14px;
    line-height: 24px;
    color: #fff;
    margin: 0px 0 0 0;
    z-index: 30;
    opacity:0;
}



.third-tit-bg {
    position: absolute;
    background: url(3-ed-bg.png) no-repeat center center;
    background-size: cover;
    top: 15%;
    left: 50%;
    width: 680px;
    height: 24px;
    z-index: 15;
    margin: 0 0 0 -340px;
    opacity:0;
}



.third-tit {
    position: relative;
    text-align: left;
    font-size: 15px;
    line-height: 24px;
    color: #fff;
    font-weight: bold;
    margin: 0px 0 0 42px;
    z-index: 30;
    
}

.third-tit-p {
    background-color: #fff;
    opacity: 0.3;
    border-radius: 100%;
    position: absolute;
    margin: -8px 0 0 -326px;
    left: 50%;
    top: 50%;
    width: 15px;
    height: 15px;
}

.third-tit-line {
    position: absolute;
    opacity: 0;
    top: 0%;
    left: 50%;
    width: 1px;
    height: 455px;
    margin: -96px 0 0 -340px;
    background-color: #FFFFFF;
    -webkit-transform: rotate(55deg);
    -o-transform: rotate(55deg);
    -moz-transform: rotate(55deg);
}



.third-ed-tex {
    position: absolute;
    left: 50%;
    top: 20%;
    text-align: left;
    font-size: 14px;
    line-height: 30px;
    color: #fff;
    margin: 0 0 0 -320px;
    z-index: 30;
    word-break: break-all;
    width: 440px;
    opacity:0;
}



.third-ed-man {
    position: absolute;
    background: url(3-ed3.png) no-repeat center center;
    background-size: cover;
    top: 22%;
    left: 50%;
    width: 140px;
    height: 140px;
    z-index: 15;
    margin: 0 0 0 150px;
}



.third-house1 {
    position: absolute;
    background: url(3-house1.png) no-repeat center center;
    background-size: cover;
    bottom: 11%;
    left: 50%;
    width: 750px;
    height: 238px;
    z-index: 15;
    margin: 0 0 0 -375px;
}



.third-house2 {
    position: absolute;
    background: url(3-house2.png) no-repeat center center;
    background-size: cover;
    bottom: 5%;
    left: 50%;
    width: 750px;
    height: 238px;
    z-index: 15;
    margin: 0 0 0 -375px;
}



.third-bg-1 {
    background: url(3-bg2.png) no-repeat center top;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 48%;
    left: 0%;
    margin: 0px 0 0 0px;
    z-index: 5;
}



.fourth-tit {
    position: absolute;
    width: 140px;
    top: 11%;
    left: 50%;
    margin: 0px 0 0 -70px;
    border: 1px solid #FFFFFF;
    z-index: 30;
    display: table;
    text-align: center;
    font-size: 20px;
    color: #fff;
    letter-spacing: 5px;
    font-weight: bold;
    padding: 3px;
}





.fourth-tex1-1 {
    position: absolute;
    top: 26%;
    left: 50%;
    text-align: right;
    font-size: 18px;
    line-height: 20px;
    color: #fff;
    margin: 0px 0 0 -276px;
}

.fourth-tex1-2 {
    position: absolute;
    top: 35%;
    left: 50%;
    text-align: right;
    font-size: 18px;
    line-height: 20px;
    color: #fff;
    margin: 0px 0 0 -191px;
    font-weight: bold;
    letter-spacing: 1px;
    opacity: 0.5;
}

.swiper-slide-active.fourth .fourth-tex1-2 {
    opacity: 0.5;
    -webkit-transition: opacity .2s linear 2s;
    -o-transition: opacity .2s linear 2s;
    -moz-transition: opacity .2s linear 2s;
    transition: opacity .2s linear 2s;
}

.fourth-tex2-1 {
    position: absolute;
    top: 43.5%;
    left: 50%;
    text-align: left;
    font-size: 18px;
    line-height: 20px;
    color: #fff;
    margin: 0px 0 0 40px;
}




.fourth-tex2-2 {
    position: absolute;
    top: 51.5%;
    left: 50%;
    text-align: left;
    font-size: 18px;
    line-height: 20px;
    color: #fff;
    margin: 0px 0 0 40px;
    font-weight: bold;
    letter-spacing: 1px;
    opacity: 0.5;
}





.fourth-work-line {
    position: absolute;
    top: 16%;
    left: 50%;
    width: 1px;
    height: 470px;
    background-color: #FFFFFF;
}

.fourth-p1 {
    position: absolute;
    border-radius: 100%;
    top: 28%;
    left: 50%;
    width: 10px;
    height: 10px;
    border: 2px #fff solid;
    background: #ffcc00;
    z-index: 15;
}





.fourth-p2 {
    position: absolute;
    border-radius: 100%;
    top: 36%;
    left: 50%;
    width: 8px;
    height: 8px;
    background: #ffcc00;
    z-index: 15;
}





.fourth-tit-p1 .fourth-p1 {
    margin: 0px 0 0 -6px;
}

.fourth-tit-p2 .fourth-p2 {
    margin: 0px 0 0 -3px;
}

.fourth-tit-p3 .fourth-p1 {
    margin: 122px 0 0 -6px;
}

.fourth-tit-p4 .fourth-p2 {
    margin: 117px 0 0 -3px;
}

.fourth-bg-1 {
    background: url(2-bg.png) no-repeat center top;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 58%;
    left: 0%;
    margin: 0px 0 0 0px;
    z-index: 5;
}




.fifth-tit {
    position: absolute;
    top: 16%;
    left: 50%;
    text-align: left;
    font-size: 16px;
    line-height: 24px;
    color: #fff;
    font-weight: bold;
    margin: 0px 0 0 -384px;
    letter-spacing: 2px;
    z-index: 30;
}





.fifth-me-tex {
    position: absolute;
    top: 16%;
    left: 50%;
    text-align: left;
    font-size: 14px;
    line-height: 24px;
    color: #fff;
    margin: 0px 0 0 -280px;
}




.fifth-tit-p1 {
    position: absolute;
    background: url(3-ed-1.png) no-repeat center center;
    top: 2%;
    left: 50%;
    width: 437px;
    height: 268px;
    z-index: 15;
    margin: 0 0 0 -668px;
}

.fifth-thx-bg {
     top: 54%;
    left: 0%;
    margin: 0px;
    background: transparent url("5-bg2.png") no-repeat scroll center top;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 0;
}




.fifth-thx {
    position: absolute;
    background: url(5-thk.png) no-repeat center center;
    bottom: 18%;
    left: 50%;
    width: 627px;
    height: 125px;
    z-index: 15;
    margin: 0 0 0 -314px;
}



.fifth-thx-p1 {
    background: url(5-thk-4.png) no-repeat center top;
    background-size: cover;
    position: absolute;
    width: 93px;
    height: 130px;
    bottom: 15%;
    left: 50%;
    margin: 0px 0 0 -430px;
    z-index: 15;
}





.fifth-thx-p2 {
    background: url(5-thk-5.png) no-repeat center top;
    background-size: cover;
    position: absolute;
    width: 93px;
    height: 130px;
    bottom: 28%;
    left: 50%;
    margin: 0px 0 0 340px;
    z-index: 15;
}




.fifth-thx-p3 {
    background: url(5-thk-p1.png) no-repeat center top;
    position: absolute;
    width: 20px;
    height: 20px;
    bottom: 12%;
    left: 50%;
    margin: 0px 0 0 32px;
    z-index: 15;
}





.fifth-thx-name {
    position: absolute;
    bottom: 12%;
    left: 50%;
    text-align: left;
    font-size: 16px;
    line-height: 20px;
    color: #097bb1;
    margin: 0px 0 0 64px;
    z-index: 15;
}



.fifth-thx-p4 {
    position: absolute;
    border-radius: 100%;
    bottom: 13%;
    left: 50%;
    width: 8px;
    height: 8px;
    background: #097bb1;
    margin: 0px 0 0 130px;
    z-index: 15;
}



.fifth-contact {
    position: absolute;
    bottom: 12%;
    left: 50%;
    text-align: left;
    font-size: 16px;
    line-height: 20px;
    color: #097bb1;
    margin: 0px 0 0 156px;
    z-index: 15;
}


.sisth-man-hi {
    position: absolute;
    background: url(6-hi.png) no-repeat center center;
    top: 12%;
    left: 50%;
    width: 77px;
    height: 55px;
    z-index: 15;
    margin: 0 0 0 -100px;
   

}


.sisth-man-m {
    position: absolute;
    top: 17%;
    left: 50%;
    width: 150px;
    height: 286px;
    margin: -40px 0 0 -75px;
}

.sisth-man-1 {
    position: absolute;
    background: url(6-p1.png) no-repeat center center;
    top: 17%;
    left: 50%;
    width: 150px;
    height: 286px;
    z-index: 15;
    margin: 0 0 0 -410px;
}

.sisth-man-2 {
    position: absolute;
    background: url(6-p2.png) no-repeat center center;
    top: 17%;
    left: 50%;
    width: 150px;
    height: 286px;
    z-index: 15;
    margin: 0 0 0 -240px;
}

.sisth-man-3 {
    position: absolute;
    background: url(6-p3.png) no-repeat center center;
    top: 17%;
    left: 50%;
    width: 150px;
    height: 286px;
    z-index: 15;
    margin: 0 0 0 -75px;
}

.sisth-man-4 {
    position: absolute;
    background: url(6-p4.png) no-repeat center center;
    top: 17%;
    left: 50%;
    width: 150px;
    height: 286px;
    z-index: 15;
    margin: 0 0 0 90px;
}

.sisth-man-5 {
    position: absolute;
    background: url(6-p5.png) no-repeat center center;
    top: 17%;
    left: 50%;
    width: 150px;
    height: 286px;
    z-index: 15;
    margin: 0 0 0 250px;
}


.sisth-logo {
    position: absolute;
    background: url(6-logo.png) no-repeat center center;
    top: 63%;
    left: 50%;
    width: 45px;
    height: 32px;
    z-index: 15;
    margin: 0 0 0 111px;
}



.sisth-logo-tex {
    position: absolute;
    top: 64%;
    left: 50%;
    text-align: right;
    font-size: 18px;
    line-height: 20px;
    color: #fff;
    margin: 0px 0 0 159px;
    z-index: 15;
    letter-spacing: 3px;
}



.sisth-metoobg {
    background: url(6-bg2.png) no-repeat center center;
    position: absolute;
    top: 70%;
    left: 0%;
    width: 100%;
    height: 622px;
    margin: 0 0 0 0px;
   
}

.sisth-metoo {
    position: absolute;
    background: url(6-metoo-bg.png) no-repeat center center;
    top: 11%;
    left: 50%;
    width: 355px;
    height: 64px;
    text-align: center;
    font-size: 28px;
    line-height: 57px;
    font-weight: bold;
    color: #fff;
    margin: 0px 0 0 -177px;
    z-index: 20;
    letter-spacing: 3px;
    vertical-align: middle;
     cursor: pointer;
}





/*动画*/
@-webkit-keyframes moveIconUp {
    0% {
        -webkit-transform: translateY(100%);
        opacity: 0;
    }

    50% {
        -webkit-transform: translateY(0%);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateY(-100%);
        opacity: 0;
    }
}

@keyframes moveIconUp {
    0% {
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0;
    }

    50% {
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        transform: translateY(0%);
        opacity: 1;
    }

    100% {
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0;
    }
}

@-webkit-keyframes moveIconUpp {
    0% {
        -webkit-transform: translateY(20%);
    }

    50% {
        -webkit-transform: translateY(50%);
    }

    100% {
        -webkit-transform: translateY(20%);
    }
}

@keyframes moveIconUpp {
    0% {
        -webkit-transform: translateY(20%);
        -moz-transform: translateY(20%);
        transform: translateY(20%);
    }

    50% {
        -webkit-transform: translateY(50%);
        -moz-transform: translateY(50%);
        transform: translateY(50%);
    }

    100% {
        -webkit-transform: translateY(20%);
        -moz-transform: translateY(20%);
        transform: translateY(20%);
    }
}

@-webkit-keyframes bounceInUp {
    0% {
        -webkit-transform: translateY(20%);
        opacity: 0;
    }

    50% {
        -webkit-transform: translateY(10%);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: translateY(0%);
        opacity: 1;
    }
}

@keyframes bounceInUp {
    0% {
        -webkit-transform: translateY(20%);
        -moz-transform: translateY(20%);
        transform: translateY(20%);
        opacity: 0;
    }

    50% {
        -webkit-transform: translateY(10%);
        -moz-transform: translateY(10%);
        transform: translateY(10%);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        transform: translateY(0%);
        opacity: 1;
    }
}

@-webkit-keyframes pop {
    0% {
        -webkit-transform: scale(0.5,0.5);
        opacity: 0;
    }

    50% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 1;
    }

    55% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 1;
    }

    80% {
        -webkit-transform: scale(0.95,0.95);
        opacity: 1;
    }

    90% {
        -webkit-transform: scale(1.1,1.1);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1,1);
        opacity: 1;
    }
}


@keyframes pop {
    0% {
        transform: scale(0.5,0.5);
        -moz-transform: scale(0.5,0.5);
        opacity: 0;
    }

    50% {
        transform: scale(1.5,1.5);
        -moz-transform: scale(1.5,1.5);
        opacity: 1;
    }

    55% {
        transform: scale(1.5,1.5);
        -moz-transform: scale(1.5,1.5);
        opacity: 1;
    }

    80% {
        transform: scale(0.95,0.95);
        -moz-transform: scale(0.95,0.95);
        opacity: 1;
    }

    90% {
        transform: scale(1.1,1.1);
        -moz-transform: scale(1.1,1.1);
        opacity: 1;
    }

    100% {
        transform: scale(1,1);
        -moz-transform: scale(1,1);
        opacity: 1;
    }
}


@-webkit-keyframes pop1 {
    0% {
        -webkit-transform: scale(0.5,0.5);
        opacity: 0;
    }

    50% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 0.02;
    }

    55% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 0.04;
    }

    80% {
        -webkit-transform: scale(0.95,0.95);
        opacity: 0.06;
    }

    90% {
        -webkit-transform: scale(1.1,1.1);
        opacity: 0.08;
    }

    100% {
        -webkit-transform: scale(1,1);
        opacity: 0.1;
    }
}

@keyframes pop1 {
    0% {
        transform: scale(0.5,0.5);
        -moz-transform: scale(0.5,0.5);
        opacity: 0;
    }

    50% {
        transform: scale(1.2,1.2);
        -moz-transform: scale(1.5,1.5);
        opacity: 0.02;
    }

    55% {
        transform: scale(1.2,1.2);
        -moz-transform: scale(1.5,1.5);
        opacity: 0.04;
    }

    80% {
        transform: scale(0.95,0.95);
        -moz-transform: scale(0.95,0.95);
        opacity: 0.06;
    }

    90% {
        transform: scale(1.1,1.1);
        -moz-transform: scale(1.1,1.1);
        opacity: 0.08;
    }

    100% {
        transform: scale(1,1);
        -moz-transform: scale(1,1);
        opacity: 0.1;
    }
}


@-webkit-keyframes pop2 {
    0% {
        -webkit-transform: scale(0.5,0.5);
        opacity: 0;
    }

    50% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 0.1;
    }

    55% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 0.18;
    }


    80% {
        -webkit-transform: scale(0.95,0.95);
        opacity: 0.26;
    }

    90% {
        -webkit-transform: scale(1.1,1.1);
        opacity: 0.34;
    }

    100% {
        -webkit-transform: scale(1,1);
        opacity: 0.42;
    }
}

@keyframes pop2 {
    0% {
        -moz-transform: scale(0.5,0.5);
        transform: scale(0.5,0.5);
        opacity: 0;
    }

    50% {
        -moz-transform: scale(1.5,1.5);
        transform: scale(1.2,1.2);
        opacity: 0.1;
    }

    55% {
        -moz-transform: scale(1.5,1.5);
        transform: scale(1.2,1.2);
        opacity: 0.18;
    }

    80% {
        -moz-transform: scale(0.95,0.95);
        transform: scale(0.95,0.95);
        opacity: 0.26;
    }

    90% {
        -moz-transform: scale(1.1,1.1);
        transform: scale(1.1,1.1);
        opacity: 0.34;
    }

    100% {
        -moz-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 0.42;
    }
}

@-webkit-keyframes pop3 {
    0% {
        -webkit-transform: scale(5,5);
        opacity: 0;
    }

    15% {
        -webkit-transform: scale(3.5,3.5);
        opacity: 1;
    }

    30% {
        -webkit-transform: scale(2.5,2.5);
        opacity: 1;
    }

    40% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(1,1);
        opacity: 1;
    }

    60% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 1;
    }

    70% {
        -webkit-transform: scale(1,1);
        opacity: 1;
    }

    80% {
        -webkit-transform: scale(0.75,0.75);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1,1);
        opacity: 1;
    }
}

@keyframes pop3 {
    0% {
        -moz-transform: scale(5,5);
        transform: scale(5,5);
        opacity: 0;
    }

    15% {
        -moz-transform: scale(3.5,3.5);
        transform: scale(3.5,3.5);
        opacity: 1;
    }

    30% {
        -moz-transform: scale(2.5,2.5);
        transform: scale(2.5,2.5);
        opacity: 1;
    }

    40% {
        -moz-transform: scale(1.5,1.5);
        transform: scale(1.5,1.5);
        opacity: 1;
    }

    50% {
        -moz-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1;
    }

    60% {
        -moz-transform: scale(1.5,1.5);
        transform: scale(1.5,1.5);
        opacity: 1;
    }

    70% {
        -moz-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1;
    }

    80% {
        -moz-transform: scale(0.75,0.75);
        transform: scale(0.75,0.75);
        opacity: 1;
    }

    100% {
        -moz-transform: scale(1,1);
        transform: scale(1,1);
        opacity: 1;
    }
}

@-webkit-keyframes pop4 {
    0% {
        -webkit-transform: scale(5,5);
        opacity: 0;
    }

    25% {
        -webkit-transform: scale(3.5,3.5);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(2.5,2.5);
        opacity: 1;
    }

    75% {
        -webkit-transform: scale(1.5,1.5);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1,1);
        opacity: 1;
    }
}

@keyframes pop4 {
    0% {
        -webkit-transform: scale(5,5);
        -moz-transform: scale(5,5);
        opacity: 0;
    }

    25% {
        -webkit-transform: scale(3.5,3.5);
        -moz-transform: scale(3.5,3.5);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(2.5,2.5);
        -moz-transform: scale(2.5,2.5);
        opacity: 1;
    }

    75% {
        -webkit-transform: scale(1.5,1.5);
        -moz-transform: scale(1.5,1.5);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1,1);
        -moz-transform: scale(1,1);
        opacity: 1;
    }
}

@-webkit-keyframes enterUpBounce {
    0% {
        -webkit-transform: translateY(-220px);
        opacity: 0;
    }

    50% {
        -webkit-transform: translateY(300px);
    }

    70% {
        -webkit-transform: translateY(-50px);
    }

    100% {
        -webkit-transform: translateY(0);
        opacity: 1;
    }
}

@keyframes enterUpBounce {
    0% {
        -webkit-transform: translateY(-220px);
        -moz-transform: translateY(-220px);
        opacity: 0;
    }

    50% {
        -webkit-transform: translateY(300px);
        -moz-transform: translateY(300px);
    }

    70% {
        -webkit-transform: translateY(-50px);
        -moz-transform: translateY(-50px);
    }

    100% {
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        opacity: 1;
    }
}

.swiper-pagination-bullet-active {
    background-color: #FF9900;
}

.swiper-pagination span {
    width: 80px;
    height: 80px;
    background: url(pp1.png) no-repeat center center;
    background-size: cover;
    display: block !important;
}

    .swiper-pagination span + span {
        width: 80px;
        height: 80px;
        background: url(pp2.png) no-repeat center center;
        background-size: cover;
        display: block !important;
    }

        .swiper-pagination span + span + span {
            width: 80px;
            height: 80px;
            background: url(pp3.png) no-repeat center center;
            background-size: cover;
        }

            .swiper-pagination span + span + span + span {
                width: 80;
                height: 80px;
                background: url(pp4.png) no-repeat center center;
                background-size: cover;
            }

                .swiper-pagination span + span + span + span + span {
                    width: 80px;
                    height: 80px;
                    background: url(pp5.png) no-repeat center center;
                    background-size: cover;
                }

                    .swiper-pagination span + span + span + span + span + span {
                        width: 80px;
                        height: 80px;
                        background: url(pp6.png) no-repeat center center;
                        background-size: cover;
                    }

                        .swiper-pagination span + span + span + span + span + span + span {
                            display: none !important;
                        }


.windmill: after {
    background: transparent url(1-peple-2.png) no-repeat -115px 0;
    width: 200px;
    background-size: cover;
    height: 200px;
    bottom: 0;
    left: 0;
    position: absolute;
    content: '';
}

.windmill .spinning-wing {
    background: transparent url(1-peple-2.png) no-repeat 0px 0;
    width: 182px;
    height: 182px;
    background-size: cover;
    margin: 0;
    top: -6px;
    left: -6px;
    position: absolute;
    z-index: 1;
}

    .windmill .spinning-wing: hover {
        -webkit-animation: rotate2 .3s linear infinite;
        -moz-animation: rotate2 .3s linear infinite;
        -o-animation: rotate2 .3s linear infinite;
        animation: rotate2 .3s linear infinite;
    }

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes rotate {
    from {
        -moz-transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(359deg);
    }
}

@-o-keyframes rotate {
    from {
        -o-transform: rotate(0deg);
    }

    to {
        -o-transform: rotate(359deg);
    }
}

@keyframes rotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg);
    }
}

@-webkit-keyframes rotate2 {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes rotate2 {
    from {
        -moz-transform: rotate(0deg);
    }

    to {
        -moz-transform: rotate(359deg);
    }
}

@-o-keyframes rotate2 {
    from {
        -o-transform: rotate(0deg);
    }

    to {
        -o-transform: rotate(359deg);
    }
}

@keyframes rotate2 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg);
    }
}




.wordDiv {
    margin: auto;
    width: 740px;
    margin-top: 20px;
    text-align: left;
    font-size: 14px;
    position: absolute;
    top:14%;
    left:50%;
    margin-left:-400px;
    color:white;
    line-height: 30px;
    opacity:0;
}

.gundong {
    position: absolute;
    margin-left: 73%;
    margin-top: -200px;
    height: 200px;
    width: 49px;
    float: left;
    z-index: 700;
}
