@import url(common.css);
@import url(nav-top.css);
.page2 .animated,.page3 .animated,.page4 .animated,.page5 .animated,.footer {display: none;}
#head .head-ad{background: #095ec6;}
.main .row {max-width: 1200px; margin: 0px auto;}
.main h2{ color: #fff;font-size:48px; text-align:center;padding:10% 0 25px 0 }
.main .hr{ font-size:18px; text-align:center;color: #fff; width: 100%;  }

.page1{background: url(../images/bot.png) no-repeat center; background-size:cover}
.page1 .hr{ text-shadow: 2px 2px 1px #333; }
.page1 .box{    width: 100%;
    float: left;
    margin-top: 5%;}
.page1 .box ul li{ background-color: rgba(112,126,196,0.5); text-align: center; margin: 2.5% 7px; font-size: 2rem; color: #fff;padding: 3.5% 0;width: 15.3% }

.page2 .box{    width: 100%;
    float: left;
    margin-top: 5%;}
.page2 h2{color: #463c57}
.page2 .hr{color:#888888 }
.page2 .box li{ padding: 20px 0;  text-align: center; 
	border-radius: 8px;
    margin:15px 2.7% 0 2.7%;
    border: 1px solid #fff;
    box-shadow: #e5e7f6 0px 0px 10px 5px;
    background: #FFFFFF;
     max-width: 325px;}
.page2 .box li img{max-height: 260px;}
.page2 .box li:nth-child(1) img{padding: 20px 0;}
    .page2 .box li h4 {
        font-size: 24px;
        line-height: 60px;
        margin: 0px;
    }
.page2 .box li span{display: block;margin: 0px 10%; font-size: 16px; color: #888;line-height: 26px;}


.page3{background: url(../images/bot.png) no-repeat center; background-size:cover}
.page3 h2{padding-top:10%;}
.page3 .hr{ text-shadow: 2px 2px 1px #333; }
.page3 .box{    width: 100%;
    float: left; text-align: center; margin-top:8%;
    }


.page4 h2{padding-top:15%; color:#463c57 }
.page4  .hr{line-height: 30px; color:#888888}
.page4 .box{width: 100%;  float: left; padding:  0; margin: 30px 0 0 0;}
.page4 .box ul li{padding: 0px 45px; margin-bottom: 20px;}
.page4 .box ul li img{width: 100%;min-height: 200px;max-height: 240px;}
    .page4 .box ul span.title {
        display: block;
        line-height: 45px;
        height: 45px;
        font-size: 16px;
        color: #333333;
        border-bottom: 1px solid #ccc;
        overflow: hidden;
        text-overflow: ellipsis;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        line-clamp: 1;
        -webkit-box-orient: vertical;
    }
.page4  .box ul span.des{ display: block; line-height: 26px; font-size: 14px; color: #888;margin: 5px 0; 
	text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    -webkit-box-orient: vertical;
}

.page5{background: url(../images/bot.png) no-repeat center; background-size:cover}
.page5 h2{padding-top:0%;}
.page5 .hr{ text-shadow: 2px 2px 1px #333; }
.page5 .box{ width: 100%;float: left; overflow: hidden;margin-top:5%; }
.page5 .box ul li{text-align: center; padding: 40px 0;}
.page5 .box ul li i{width: 40px; height: 40px; color: #fff; font-size: 40px;}
.page5 .box ul li span{font-size: 18px; color: #fff; display: block;width: 100%; padding: 15px 0;}




/*联系我们*/
.laxw .left{padding: 0px;}
.laxw .right {    background: #fff;
    padding: 10% 0 0 0px;
    box-shadow: #888 0px 0px 10px 5px;
    position: fixed;
    right: 0;
    height: 100%;}
.laxw .right h3{color: #463c57;font-size:32px; text-align:center;padding: 0 0 45px 0 }
.laxw .right ul{padding: 0 5%;}
.laxw .right ul li{height: 40px; line-height: 40px;color: #333;font-size: 16px;}
.laxw .right .right2{width: 100%; float: left;margin-top:10%;}

/*底部*/
.footer{background-color: rgba(50,64,139,0.5); position:absolute;bottom: 0px;width: 100%;height: 178px;color: #fff; font-size: 16px;line-height: 40px;}
.footer .row{ width: 100%;max-width: 1200px; margin: 0px auto; overflow:hidden;}
.footer .row .footer-a{overflow:hidden; padding:20px 0;}
.footer .row .ewm{ text-align: right; }
.footer .row .footer-b{height:50px; line-height: 50px; text-align:center; border-top: 1px solid #ccc}


.page2 h2.active,.page2 .hr.active,.page2 .li1.active,.page2 .li2.active,.page2 .li3.active,
.page3 h2.active,.page3 .hr.active,.page3 .box.active,
.page4 h2.active,.page4 .hr.active,.page4 .box.active,
.page5 h2.active,.page5 .hr.active,.page5 .box.active,.footer.active
{display: block;}
@media (max-width: 1400px) {

}

@media (max-width: 1200px) {
.page1 .box ul li{width: 15%}
}
@media (max-width: 1100px) {
.page1 .box ul li{width: 17.3%}
.page2 .box li{margin-left: 1.2%; margin-right: 1.2%}



}
@media (max-width: 1024px) {

.page2 .box li{max-width: 30.9%;}
.page2 .box li img { max-height: 220px; width: 100%;}


}

@media (max-width: 1023px) {

   

}

@media (max-width: 991px) {
.page4 .box ul li{padding: 0px 12px;}

}
@media (max-width: 768px) {
.main h2{font-size: 24px; padding: 10% 0 5px 0;}
.main .hr{font-size: 13px;}
.page1 .box ul li{font-size:1.5rem;}
.page3 .box img{width: 100%}

	.page2 .box li {max-width: 47%;}
    .page2 .box li:nth-child(1) img {padding: 0px 0;}
.page2 .box li h4 {font-size: 18px; line-height: 30px; }
.page2 .box li span{font-size:14px; line-height: 22px; text-overflow: -o-ellipsis-lastline;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;}
.page2 .box li:nth-child(2){float: right;}
.page2 .box li:nth-child(3){ max-width: 100% }
.page2 .box li img{max-height: 180px;}
.page4 .box ul li{padding: 0 15px; width: 33%;}
.page4 .box ul li img {
    width: 100%;
    min-height: 120px;
    max-height: 160px;}
.laxw .right{display: none;}
.laxw .right{height: 28%}
.laxw .right h3{font-size: 28px;}
.laxw .right ul li{height: 30px; line-height: 30px; }
.laxw .right ul.right2{display: none;}

}

@media (max-width: 580px) {
	.page1 .box ul li{width: 28%;}
	.page2 h2{padding-top:20%;}

.page2 .box li img{max-height: 75px;}
.page2 .box li h4{margin-bottom: 0px;font-size: 14px;}
.page2 .box li span{font-size: 12px;}
    .page4 h2 {
    padding-top:22%}
    .page4 .box ul li {
        padding: 0 5px;
        width: 50%;
    }
    .page4 .box ul li .des {
    display:none}
    .page4 .box ul li img {
        width: 100%;
        min-height: 60px;
        max-height: 160px;
    }
    .page4 .box ul span.title{font-size: 14px;height: 30px; line-height: 30px;}
    .page4 .box ul span.des{font-size: 12px;line-height: 20px; color: #888}

    .page5 h2{margin-top:-35%;}
.page5 .box{ width: 100%;float: left; overflow: hidden;margin-top:5%; }
.page5 .box ul li{text-align: center; padding: 10px 0;}
.page5 .box ul li i{width: 25px; height: 25px; color: #fff; font-size: 25px;}
.page5 .box ul li span{font-size: 14px; color: #fff; display: block;width: 100%; padding: 5px 0;}
.laxw .right {height: 34%;padding-top: 18%;}
.laxw .right h3 {  font-size: 24px;padding: 0 0 12px 0;}

.footer{font-size: 14px;line-height: 30px;}
.footer .row .ewm,.footer .row .footer-b{display: none;}
}
@media (max-width: 415px) {
   

}
@media (max-width: 400px) {
  
}