/*fullpage*/
.panel{ width: 100%;background-size: cover;}

.panelone{ background: url("../images/index_panel1.jpg") no-repeat;background-size: cover;}
.panelone .left{ float: left; width: 40%; padding-top:12%;}
.panelone .left img{  width: 100%;}
.panelone .right{ float: left; width: 50%; padding-top: 12%; margin:5% 0 0 6%;}
.panelone .right img{ width: 100%;}
.panelone .right .imgtwo{ width:40%; margin-top: 8%;}

.panelfive{ background: url("../images/index_panel5.png") no-repeat;background-size: cover;}
.panelfive .left{ float: left; width: 30%; padding-top:20%;padding-left: 6%}
.panelfive .left img{  width: 100%;}
.panelfive .right{ float: left; width: 50%; padding-top: 12%; margin:5% 0 0 6%;padding-left: 3%}
.panelfive .right img{ width: 63%;}
.panelfive .right .imgtwo{ width:68%; margin-top: 8%;}

.paneltwo{ background: url("../images/index_panel2.jpg") no-repeat;background-size: cover;}
.paneltwo .top{ width: 40%; margin: 0 auto; padding-top: 25vh;}
.paneltwo .top img{ width: 100%; }
.paneltwo .bot{ padding-left: 12%; margin-top: 7%;}
.paneltwo .bot li{ float: left; width: 13%; text-align: center; margin-right: 5%;}
.paneltwo .bot li p{ color: white; font-size: 22px; font-weight:400; line-height: 45px; font-family: "微软雅黑";}
.paneltwo .bot li img{ width: 100%;}

.panelthree{ background: url("../images/index_panel3.jpg") no-repeat;background-size: cover;}
.panelthree .top{ width: 15%; margin: 0 auto; padding-top: 7%;}
.panelthree .top img{ width: 100%;}
.panelthree .bot{ margin:0 0 0 15%;}
.panelthree .bot li{ width: 20%; float: left; border-right:1px solid #d7d7d7;}
.panelthree .bot li img{ width: 100%;}

.panelfour{ background: url("../images/index_panel4.jpg") no-repeat;background-size: cover; text-align: center;
    color: #333333;}
.panelfour h3{  font-size: 32px; font-weight: 100; line-height: 50px; padding-top: 14vh;}
.panelfour span{ font-size: 14px; line-height: 30px;}
.panelfour h5{ font-size: 15px; line-height: 30px; font-weight: 400;}
.panelfour h5>img{ width: 1%; margin-right: 10px; padding-top: 10px;}
.panelfour .erweima{ width: 10%; margin:1% 0 5px;}

#fp-nav{ z-index: 1;}/*右侧定位按钮颜色*/
#fp-nav ul li a span, .fp-slidesNav ul li a span{ background: white;}
.fp-tableCell{ vertical-align: top;}

.allowDown{ position: fixed; left: 47%; bottom: 3%; transition: opacity 0.1s ease;}
.allowDown.hide{ opacity: 0;}

/*footer*/
.footer{ position: absolute; bottom: 0;}
.footer span{ font-size: 12px !important;}

@keyframes allowdown{
    0%{ transform: translateY(0px)}
    0%{ transform: translateY(-10px)}
    100%{ transform: translateY(0px)}
}
.run{ animation: allowdown 0.8s linear infinite;  -webkit-animation-direction:alternate;  animation-direction:alternate;}


@media screen and ( max-width:1200px ){
    .panelone .left{ padding-top:14%;}
    .panelone .right{ padding-top: 14%;}
    .panelfive .left{ padding-top:22%;}
    .panelfive .right{ padding-top: 14%;}
    .panelthree .top{ padding-top: 14%;}
}
@media screen and ( max-width:1100px ){
    .panelone .left{ padding-top:15%;}
    .panelone .right{ padding-top: 15%;}
    .panelfive .left{ padding-top:23%;}
    .panelfive .right{ padding-top: 15%;}
    .panelthree .top{ padding-top: 15%;}
    .panelfour h3{ font-size: 28px;}
}
@media screen and ( max-width:1025px ){
    .panelone .left{ padding-top:20%;}
    .panelone .right{ padding-top: 20%;}
    .panelfive .left{ padding-top:28%;}
    .panelfive .right{ padding-top:20%;}
    .panelthree .top{ padding-top: 20%;}
    .panelfour .erweima{ width: 13%;}
}
@media screen and ( max-width:1000px ){
    .panelone .left{ padding-top:17%;}
    .panelone .right{ padding-top: 17%;}
    .panelfive .left{ padding-top:25%;}
    .panelfive .right{ padding-top: 17%;}
    .panelthree .top{ padding-top: 17%;}
}
@media screen and ( max-width:950px ){
    .panelone .left{ padding-top:21.5%;}
    .panelone .right{ padding-top: 21.5%;}
    .panelfive .left{ padding-top:29.5%;}
    .panelfive .right{ padding-top: 21.5%;}
    .panelthree .top{ padding-top: 16%;}
    .panelfour h3{ font-size: 26px;}
}
@media screen and ( max-width:900px ){
    .panelone .left{ padding-top:23%;}
    .panelone .right{ padding-top: 23%;}
    .panelfive .left{ padding-top:30%;}
    .panelfive .right{ padding-top: 23%;}
    .panelthree .top{ padding-top: 20%;}
}
@media screen and ( max-width:800px ){
    .panelone .left{ padding-top:25%;}
    .panelone .right{ padding-top: 25%;}
    .panelfive .left{ padding-top:32%;}
    .panelfive .right{ padding-top: 25%;}
    .panelthree .top{ padding-top: 25%;}
    .panelfour h3{ font-size: 24px;}
}
@media screen and ( max-width:769px ){
    .panelone .left{ display: none;}
    .panelone .right{ width: 80%; padding-top: 35%;}
    .panelone .right .imgtwo{ width:60%; margin-top: 8%;}
    .panelfive .left{ display: none;}
    .panelfive .right{ width: 80%; padding-top: 28%;}
    .panelfive .right .imgtwo{ width:95%; margin-top: 8%;}
    .paneltwo .top{ width: 50%;}
    .paneltwo .bot li p{ font-size: 24px;}
    .paneltwo .bot li{ width: 23%;margin:0 8% 2% 0;}
    .paneltwo .bot li.fiveli{ margin-left: 15%;}

    .panelthree .top{ width: 22%; padding-top: 28%;}
    .panelthree .bot{ margin:2% 0 0 7%;}
    .panelthree .bot li{ width: 22%;}

    .panelfour h3{  font-size: 32px; font-weight: 100; line-height: 50px;}
    .panelfour span{ font-size: 14px; line-height: 30px;}
    .panelfour h5{ font-size: 15px; line-height: 30px; font-weight: 400;}
    .panelfour h5>img{ width: 3%; margin-right: 10px; padding-top: 10px;}
    .panelfour .erweima{ width: 13%; margin:1% 0 5px;}
}
@media screen and ( max-width:415px ){
    .panelone .right{ padding-top: 55%;}
    .panelfive .right{ padding-top: 55%;}

    .paneltwo .top{ width: 53%;}
    .paneltwo .bot{ margin-top: 10%;}
    .paneltwo .bot li p{ font-size: 16px;}

    .panelthree .top{ width: 27%; padding-top: 50%;}
    .panelthree .bot{ margin:5% 0 0 6%;}
    .panelthree .bot li{ width: 23%;}

    .panelfour h3{  font-size: 26px;}
    .panelfour .erweima{ width: 20%;}

    .footer{ width: 90%; padding: 1% 5%;}
    .footer span{ line-height: 0px;}
}
@media screen and ( max-width:376px ){
    .panelone .right{ padding-top: 55%;}
    .panelfive .right{ padding-top: 55%;}

    .paneltwo .bot li p{ font-size: 14px;}

    .panelthree .top{ padding-top: 50%;}

    .panelfour h3{  font-size: 26px;}
    .panelfour h3{  font-size: 18px; }
    .panelfour span{ font-size: 12px;}
    .panelfour h4{ font-size: 14px;}
    .panelfour h5{ font-size: 14px;}
}
@media screen and ( max-width:321px ){
    .panelone .right{ padding-top: 57%;}
    .panelfive .right{ padding-top: 57%;}

    .paneltwo .bot{ padding-left: 10%;}
    .paneltwo .bot li p{ font-size: 12px;}

    .panelthree .top{ width: 22%; padding-top: 50%;}
    .panelthree .bot{ margin:4% 0 0 5%;}

    .panelfour h3{  font-size: 26px;}
    .panelfour h3{  font-size: 16px; }
    .panelfour span{ font-size: 12px;}
    .panelfour h4{ font-size: 13px;}
    .panelfour h5{ font-size: 13px;}
}