* {
    margin: 0;
    padding: 0;
}

body {
    font: 16px/1.8 "Microsoft Yahei", verdana;
}

.section {
    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;
    top: 0;
    right: 30px;
    width: 10%;
    transition: all 1s;
}
.bg11 img{
    width: 100%;
    height: auto;
}

.bg12 {
    position: absolute;
    bottom: -10px;
    width: 100%;
    padding: 0 65px;
    opacity: 0;
    transition: all 1.7s;
    font-size: 14px;
    color: #666666;
    box-sizing: border-box;
}
.s1_box{
    position: absolute;
    width: 1054px; 
    left: 50%;
    top: 50%;
    margin: -270px 0 0 -527px;
}
.hgroup {
    height: 451px;
    background: url(../images/s1_top.png) no-repeat center top;
    opacity: 0;
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    transition: all 1s;
}

.p11 {
    width: 800px;
    font-size: 20px;
    color: #fff;
    margin:0 auto;
    margin-top: 35px;
    opacity: 0;
    transition: all 0.5s;
}
.p12 {
    font-size: 20px;
    color: #fff;
    margin:0 auto;
    margin-top: 50px;
    opacity: 0;
    transition: all 0.5s;
    text-align:center;
}
.p13 {
    clear:both;
    color: #fff;
    margin:0 auto;
    padding-top: 50px;
    opacity: 0;
    transition: all 0.5s;
    text-align:center;
}


.s2_box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 913px;
    margin-top: -300px;
}

.bg23 {
    height: 447px;
    margin-left: -913px;
    background: url(../images/s2_top.png) 0 0 no-repeat;
    opacity: 0;
    transition: all 1s;
}
.s3_box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 958px;
    margin:-445px 0 0 -479px;
}
.p3 {
    width: 720px;
    font-size: 20px;
    color: #000000;
    opacity: 0;
    margin-top: 35px;
    transition: all 1s;
}
.bg31{
    width: 958px;
    height: 500px;
    background: url(../images/s3_top.png?v=0424) no-repeat center top;
    opacity: 0;
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    transition: all 1s;
}
.bg32{
    width: 292px;
    height: 295px;
    margin: 0 auto;
    margin-top: -158px;
    margin-left: -450px;
    background: url(../images/s3_center.png) no-repeat center top;
    opacity: 1;
    transition: all 1s;
}
.s4_box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1038px;
    margin:-284px 0 0 -519px;
}

.bg41 {
    height: 251px;
    background: url(../images/s4_top.png?v=0522) 50% 0 no-repeat;
    margin-top: -500px;
    transition: all 1s;
}
.s4_nr{
    width: 670px;
    height: 250px;
    background: #fff;
    border-radius: 10px;
    border:5px solid #00adef;
    margin: 0 auto;
    margin-top: 1500px;
    padding: 10px;
    transition: all 1s;
}
.s4_nr table{
    margin:0 auto;
}
.s4_nr table tr td{
    height: 45px;
    line-height: 45px;
    text-align: left;
    font-size: 14px;
    color: #333333;
    padding: 0 10px;
}
.s4_nr table tr.bt td{
    color:#00adef;
    font-weight: bold;
}
.s4_nr table tr:nth-of-type(even){
    background:#d8f4ff;
}

.bg42 {
    width: 205px;
    height: 267px;
    background: url(../images/s4_bottom.png) no-repeat center top;
    margin:-165px 0 0 1500px;
    transition: all 1s;
}

.bg43 {
    position: absolute;
    bottom: -449px;
    width: 100%;
    height: 449px;
    margin-bottom: -130px;
    background: url(../images/bg43.png) 50% 0 no-repeat;
    transition: all 1s;
}

.s5_box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1008px;
    margin:-260px 0 0 -504px;
    background:url(../images/s5_bg.png) no-repeat center top;

}

.s5_box_left{
    width: 668px;
    margin-left: 1500px;
    transition: all 1s;
    float:left;
}

.s5_box_left_top{
    text-align:left;
    color:#000000;
    font-size:18px;
}
.s5_box_left_bottom{
    width: 630px;
    height: 430px;
    background:#fff;
    overflow:hidden;
    padding:20px 5px 20px 20px;
    border:3px solid #efc067;
    border-radius:10px;
}

.s5_box_left_bottom_list{
    height: auto;
    overflow: hidden;
    border-bottom:1px solid #e5e5e5;
    padding:10px 0;
}
.s5_box_left_bottom_list h3{
    background:url(../images/q.jpg) no-repeat left top;
    font-size:16px;
    color:#000;
    line-height:24px;
    padding-left:30px;
    font-weight:bold;
}
.s5_box_left_bottom_list_1{
    background:url(../images/a.jpg) no-repeat left top;
    font-size:14px;
    text-align:left;
    padding-left:30px;
    line-height:24px;
    margin-top: 10px;
}

.s5_box_right{
    width:162px;
    height: 492px;
    background:url(../images/s5_right.png) no-repeat left bottom;
    float:left;
    margin-left:1550px;
    transition: all 1s;
}

.s6_box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 900px;
    margin:-320px 0 0 -450px;
}

.s6_box h3{
    font-size:40px;
    font-weight:bold;
    color:#000;
    text-align:center;
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    transition: all 1s;
}

.bg61 {
    height: 399px;
    background: url(../images/s6_top.png) no-repeat center top;
    -webkit-transform: scale(0.5, 0.5);
    transform: scale(0.5, 0.5);
    transition: all 1s;
}

.bg62 {
    width: 144px;
    height: 249px;
    margin:0 auto;
    background: url(../images/s6_bottom.png) no-repeat center top;
    margin-top: 1000px;
    transition: all 1s;
}
.s7_box{
    position: absolute;
    left: 50%;
    top: 50%;
    width: 950px;
    margin:-250px 0 0 -475px;
    background:url(../images/s7_bg.png) no-repeat center top;
    padding-top:120px;
}

.s7_box_left{
    width: 310px;
    float:left;
    margin:1000px 0 0 170px;
    text-align:left;
    transition: all 1s;
}
.s7_box_left p{
    font-size:20px;
    line-height:1.7;
    font-size:20px;
}
.s7_box_left img{
    margin-top: 20px;
    border:none;
}
.s7_box_right{
    width: 367px;
    height: 376px;
    background:url(../images/s7_bottom.png) no-repeat;
    float:left;
    margin:1000px 0 0 40px;
    transition: all 1s;
}


/* CSS3过度及动画 */

.active .p1 {
    opacity: 1;
    transition-delay: 1.7s;
}
.active .bg12 {
    bottom: 10px;
    opacity: 1;
    transition-delay: 0.7s;
}

.active .bg13 {
    bottom: 0;
    opacity: 1;
    transition-delay: 0.7s;
}

.active .hgroup {
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.active .p11,.active .p12,.active .p13 {
    opacity: 1;
    transition-duration: 1s;
    transition-delay: 2s;
}


.active .bg23 {
    margin-left: -456.5px;
    opacity: 1;
    transition-delay: 0.7s;
}
.active .p3 {
    margin-left: -350px;
    opacity: 1;
    transition-delay: 0.7s;
}

.active .bg31 {
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.active .bg32 {
    margin-left:340px;
    opacity: 1;
    transition-delay: 0.7s;
}

.active .bg41 {
    margin-top: 0;
    transition-delay: 0.7s;
}
.active .s4_nr{
    margin-top: -110px;
    transition-delay: 0.7s;
}

.active .bg42 {
    margin-left: 850px;
    transition-delay: 1.1s;
}

.active .bg43 {
    bottom: 15%;
    transition-delay: 0.9s;
}

.active .s5_box_left {
    margin-left:157px;
    opacity: 1;
    transition-delay: 0.7s;
}
.active .s5_box_right{
    margin-left:-10px;
    opacity: 1;
    transition-delay: 0.7s;
}
.active .s6_box h3{
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.active .bg61 {
   -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.active .bg62 {
    margin-top: -80px;
    opacity: 1;
    transition-delay: 0.7s;
}
.active .s7_box_left{
    margin-top:0;
    opacity: 1;
    transition-delay: 0.7s;
}
.active .s7_box_right{
    margin-top:-20px;
    opacity: 1;
    transition-delay: 1.4s; 
}

/* 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 .bg12 {
    bottom: 10px;
    opacity: 1;
    transition-delay: 0.7s;
}

.ltie10 .bg13 {
    bottom: 0;
    opacity: 1;
    transition-delay: 0.7s;
}

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

.ltie10 .mail {
    top: 25px;
    transition-delay: 0.7s;
}

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

.ltie10 .bg21 {
    opacity: 1;
    margin-left: -608px;
    transition-delay: 0.7s;
}

.ltie10 .bg23 {
    margin-left: -456.5px;
    opacity: 1;
    transition-delay: 0.7s;
}

.ltie10 .bg22 {
    margin-left: -280px;
    opacity: 1;
    transition-delay: 0.7s;
}

.ltie10 .p3 {
    margin-left: -350px;
    opacity: 1;
    transition-delay: 0.7s;
}
.ltie10 .bg31 {
    opacity: 1;
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.ltie10 .bg32 {
    margin-left:340px;
    opacity: 1;
    transition-delay: 0.7s;
}

.ltie10 .bg41 {
    margin-top: 0;
    transition-delay: 0.7s;
}
.ltie10 .s4_nr{
    margin-top: -110px;
    transition-delay: 0.7s;
}
.ltie10 .bg42 {
    margin-left: 850px;
    transition-delay: 1.1s;
}

.ltie10 .bg43 {
    bottom: 15%;
    transition-delay: 0.9s;
}

.ltie10 .s5_box_left {
    margin-left:157px;
    opacity: 1;
    transition-delay: 0.7s;
}

.ltie10 .s5_box_right{
    width:162px;
    height: 492px;
    background:url(../images/s5_right.png) no-repeat left bottom;
    float:left;
    margin-left:-8px;
    transition: all 1s;
}

.ltie10 .s6_box h3{
    opacity: 1;
    -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.ltie10 .bg61 {
   -webkit-transform: scale(1, 1);
    transform: scale(1, 1);
    transition-delay: 0.7s;
}

.ltie10 .bg62 {
    margin-top: -80px;
    opacity: 1;
    transition-delay: 0.7s;
}

.ltie10 .s7_box_left{
    margin-top:0;
    opacity: 1;
    transition-delay: 0.7s;
}
.ltie10 .s7_box_right{
    margin-top:-20px;
    opacity: 1;
    transition-delay: 1.4s; 
}

/*右侧导航*/

#menu {
    position: fixed;
    right: 30px;
    top: 200px;
    width: 90px;
    /*margin: -160px 0 0;*/
    padding: 0;
    list-style-type: none;
    z-index: 70;
}
#menu li {
    margin-top: 10px;
    font: 14px "Microsoft Yahei";
}

#menu a {
    display: block;
    padding: 10px 0;
    background-color: #fff;
    color: #07b1f1;
    text-align: center;
    text-decoration: none;
}

#menu .active a {
    color: #fff;
    background-color: #07b1f1;
}

ul.scroll-pane {
    width:100%;
    height:420px;
    overflow: hidden;
}

ul.scroll-pane li{
    width:95%;
}

ul.scroll-pane .jspTrack,.s4_nr .jspTrack {
    width:4px;
    background:url(../images/scrollBg.png) center top repeat-y;
}

ul.scroll-pane .jspDrag,.s4_nr .jspDrag {
    width:10px;
    margin-left:-2px;
    background: url(../images/scrollDroBg.png) center top repeat-y;
}

.modal-body::-webkit-scrollbar{
    width: 10px;
    background:#f1f1f1;
}
.modal-body::-webkit-scrollbar-thumb{
    background-color:#c5c5c5;
}
.jspContainer {
    outline: 0;
}
.pll-img{
    position: absolute;
    top:109px;
    border:none;
    animation:myScale 1s linear 0s infinite alternate;
}
.pll-0{
    top:208px;
    left: 30px;
}
.pll-1{
    left:120px;
}
.pll-2{
    top:208px;
    left:200px;
}
.pll-3{
    left:290px;
}
.pll-4{
    top:208px;
    left:365px;
}
.pll-5{
    left:450px;
}
.pll-img img{
    border:none;
}
.close{
    display: inline-block;
    width:25px;
    height: 25px;
    font-size: 25px;
    position: absolute;
    top:0;
    right:10px;
    cursor: pointer;
}
.modal {
    position: fixed;
    width:100%;
    height:100%;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    background-color: rgba(0,0,0,0.6);
}
.modal-content{
    position: absolute;
    width:50%;
    height:50%;
    top:0;
    left:0;
    margin:10% 25%;
    padding:20px;
    background:#FFEDC9;
}
.modal-header{
    position: relative;
    padding-left: 20px;
    width:100%;
    height:10%;
}
.modal-body{
    box-sizing: border-box;
    width:100%;
    height:90%;
    padding:20px;
    overflow: auto;
    background:#FFEDC9;
}
.modal-body p{
    padding-top: 10px;
    text-indent: 2em;
    text-align: justify;
    text-justify: inter-word;
}

@keyframes myScale{
    0%{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -o-transform:scale(1);
        transform:scale(1);
    }
    50%{
        -webkit-transform:scale(1.1);
        -ms-transform:scale(1.1);
        -moz-transform:scale(1.1);
        -o-transform:scale(1.1);
        transform:scale(1.1);
    }
    100%{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -o-transform:scale(1);
        transform:scale(1);
    }
}
@-webkit-keyframes myScale{
    0%{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -o-transform:scale(1);
        transform:scale(1);
    }
    50%{
        -webkit-transform:scale(1.1);
        -ms-transform:scale(1.1);
        -moz-transform:scale(1.1);
        -o-transform:scale(1.1);
        transform:scale(1.1);
    }
    100%{
        -webkit-transform:scale(1);
        -ms-transform:scale(1);
        -moz-transform:scale(1);
        -o-transform:scale(1);
        transform:scale(1);
    }
}