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

.panelone{ background: url("../images/gongchangbg.jpg") no-repeat;background-size: cover;}
.paneltwo{ background: url("../images/bowuguanbg.jpg") no-repeat;background-size: cover;}
.panelthree{ background: url("../images/yanglaoyuanbg.jpg") no-repeat;background-size: cover;}
.panelfour{ background: url("../images/youeryuanbg.jpg") no-repeat;background-size: cover; }
.panelfive{ background: url("../images/ershouchrbg.jpg") no-repeat;background-size: cover; }

.factory,.museum,.beadhouse,.kindergarten,.car{ padding-top: 25vh;}

.museum .pic{ width: 50%;}
.museum .lists ul{ width: 80%;}
.museum .lists ul li{ width: 20%;}

.beadhouse .lists ul{ width: 55%;}
.beadhouse .lists ul li{ width: 33.33%;}

.kindergarten .lists ul{ width: 55%;}
.kindergarten .lists ul li{ width: 33.33%;}

.car .pic{ width: 50%;}
.car .lists ul{ width: 55%;}
.car .lists ul li{ width: 33.33%;}

.pic{ width: 40%; margin: 0 auto;}
.pic img{ width: 100%;}

.lists ul{ width: 70%; margin: 5% auto 0;}
.lists li{ float: left; width: 25%; text-align: center;}
.lists li img{ width: 50%;}
.lists li span{ font-size: 20px; color: white; line-height: 50px; padding: 0 5px;}


#fp-nav{ z-index: 1;}/*右侧定位按钮颜色*/
#fp-nav ul li a span, .fp-slidesNav ul li a span{ background: darkgrey;}
.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;}

@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:1025px ){
    .lists ul{ width: 75%;}
    .lists li img{ width: 65%;}
}
@media screen and ( max-width:769px ){
    .lists li img{ width: 70%;}
    .factory .pic{ width: 55%;}
    .factory ul{ width: 80%;}
    .museum .pic{ width: 75%;}
    .museum .lists ul{ width: 85%;}
    .car .pic{ width: 70%;}
    .beadhouse .lists ul{ width: 70%;}
    .kindergarten .lists ul{ width: 70%;}
    .car .lists ul{ width: 70%;}
    .pic{ width: 52%;}
    .lists li span{ font-size: 22px;}
}
@media screen and ( max-width:415px ){
    .pic{ width: 60%; }
    .lists li span{ font-size: 15px; line-height: 28px;}
    .lists li img{ width: 75%;}
    .factory ul{ width: 72%;}
    .factory .pic{ width: 65%;}
    .factory ul li{ width: 50%;margin-bottom:10px;}
    .factory ul li img{ width: 65%;}
    .museum ul{ width: 90%;}
    .museum .lists ul{ width: 72%;}
    .museum .lists ul li{ width: 33%; margin-bottom:10px;}
    .museum .lists ul li.fourli{ padding-left: 16%;}
    .museum .lists ul li img{ width: 72%;}
    .museum .pic{ width: 80%;}
    .beadhouse .lists ul{ width: 75%;}
    .kindergarten .lists ul{ width: 75%;}
    .car .lists ul{ width: 75%;}
    .car .pic{ width: 77%;}
}
@media screen and ( max-width:376px ){
    .lists li span{ font-size: 14px; line-height: 23px;}
}
@media screen and ( max-width:321px ){
    .pic{ width: 55%; }
    .factory .pic{ width: 60%;}
    .museum .lists ul{ width: 75%;}
    .museum .pic{ width: 72%;}
    .lists li img{ width: 75%;}
    .car .pic{ width: 80%;}
    .lists li span{ font-size: 12px;}
}