﻿@import url(style.css);
@import url(share.min.css);
@import url(swiper.min.css);
/*首页*/
.main {width: 100%; height: 100%;position: fixed;z-index: 1; top: 0;left: 0;right: 0;bottom: 0;}
.main .banner .swiper-container,
.main .banner { width: 100%; height: 100%; position: absolute; z-index: 1; top: 0;left: 0; right: 0;bottom: 0;}
.main .banner .lzpic1,
.main .banner .lzpic2 { width: 100%;height: 100%; background: no-repeat center; background-size: cover;-moz-background-size: cover;-webkit-background-size: cover;}
.main .banner .text { max-width: 1440px; width: 100%; position: absolute; left: 50%; top: 40%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); z-index: 10; font-size: 50px;font-weight: bold; color: #fff; -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=45, Color=#989898)"; text-shadow: -2px 2px 6px rgba(152, 152, 152, 0.8); filter: progid:DXImageTransform.Microsoft.Shadow(Strength=6, Direction=135, Color=#989898); padding: 0 20px;}
.main .banner .text .small { font-size: 30px;}
.main .banner .swiper-pagination { width: 100%;bottom: 206px; transition-duration: 0.4s;-webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s-ms-transition-duration: 0.4s;-o-transition-duration: 0.4s;}
.main .banner .swiper-pagination.gao {bottom: 380px;}
.main .banner .swiper-pagination .swiper-pagination-bullet { width: 25px; height: 2px; background: #fff;opacity: 1; margin: 0 6px; border-radius:0;}
.main .banner .swiper-pagination .swiper-pagination-bullet-active { background: #558a79; }
.lzpic2 { display: none;}
.i_foot{ position:fixed; bottom:0; left:0; width:100%; z-index:2;}
.i_bg{ background:rgba(0,0,0,0.85); height:114px; width:100%;}
.i_bg ul li{ float:left; width:25%; text-align:center; font-weight:lighter;  color:#ffffff; position:relative;}
.i_bg ul li .a{ color:#fff; display:inline-block; padding-left:63px; height:114px; line-height:114px; overflow:hidden; vertical-align:top; background-repeat:no-repeat; background-position:left center; background-size:57px 57px; background-image:url(../images/i_pic1.png);transition:all 0.3s;white-space:nowrap;text-overflow:ellipsis;font-size:20px;}
.i_bg ul li:hover .a{opacity:0;filter:Alpha(opacity=0);}
.i_bg ul li:nth-child(2){ text-align:center;}
.i_bg ul li:nth-child(2) .a{ text-align:left; padding-left:65px;background-image:url(../images/i_pic2.png);}
.i_bg ul li:nth-child(3){ text-align:center;}
.i_bg ul li:nth-child(3) .a{ text-align:left; padding-left:70px;background-image:url(../images/i_pic4.png);}
.i_bg ul li:nth-child(4) .a{ text-align:center; padding-left:70px;background-image:url(../images/i_pic3.png);}
.i_bg ul li .boxs{ position:absolute; left:2%; bottom:0; width:96%; height:0; background:rgba(0,0,0,0.85); overflow:hidden;transition:all 0.3s; text-align:center;}
.i_bg ul li:hover .boxs{ height:325px;}
.i_bg ul li .boxs img{ height:73px; display:block; margin:0 auto; margin-top:38px;}
.i_bg ul li .boxs .h3{ height:52px; line-height:52px; overflow:hidden; color:#fff; font-size:20px; font-weight:lighter;white-space:nowrap;text-overflow:ellipsis; width:94%; margin:0 auto; margin-top:2px;}
.i_bg ul li .boxs .p{ width:94%; margin:0 auto; max-width:296px; overflow:hidden; line-height:26px; height:52px; margin-top:4px; color:#878787; font-size:14px;text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}
.i_bg ul li .boxs .mores{ display:block; margin:0 auto; margin-top:25px; width:76px; height:28px; line-height:28px; overflow:hidden; background:#558a79; border-radius:20px; color:#fff; text-align:center; text-transform:uppercase; font-size:12px; font-family:Arial; font-style:normal;transition:all 0.3s;}
.i_bg ul li .boxs .mores:hover{opacity:0.8;filter:Alpha(opacity=80);}
@media screen and (max-width: 1400px) {
.main .banner .swiper-pagination {bottom: 180px;}
.i_bg{ height:100px;}
.i_bg ul li:hover .boxs{ height:280px;}
.i_bg ul li .a{ font-size:18px; height:100px; line-height:100px; background-size:auto 50px; padding-left:58px;}
.i_bg ul li:nth-child(2) .a{ padding-left:60px;}
.i_bg ul li:nth-child(3) .a{ padding-left:65px;}
.i_bg ul li .boxs img{ height:60px;}
.i_bg ul li .boxs .h3{font-size:18px; height:46px; line-height:46px;}
.i_bg ul li .boxs .p{font-size:13px; line-height:22px; height:44px;}
}

@media screen and (max-width: 1260px) {
.main .banner .swiper-pagination {bottom: 160px;}
.i_bg{ height:80px;}
.i_bg ul li:hover .boxs{ height:260px;}
.i_bg ul li .a{ font-size:16px;height:80px; line-height:80px; background-size:auto 46px; padding-left:52px;}
.i_bg ul li:nth-child(2) .a{ padding-left:54px;}
.i_bg ul li:nth-child(3) .a{ padding-left:59px;}
.i_bg ul li .boxs img{ height:50px; margin-top:30px;}
.i_bg ul li .boxs .h3{font-size:16px; height:42px; line-height:42px;}

}
@media screen and (max-width: 1200px) {

}
@media screen and (max-width: 1100px) {


}
@media screen and (max-width: 960px) {
.lzpic2{display: block;}
.lzpic1{display: none;}
.main .banner .swiper-pagination {bottom: 256px;}
.main .banner .swiper-pagination .swiper-pagination-bullet {width: 20px;margin: 0 5px;}

.i_bg{ height:auto;}
.i_bg ul li:hover .boxs{ height:0px;}
.i_bg ul li:hover .a{opacity:1.0;filter:Alpha(opacity=100);}
.i_bg ul li{ float:none; width:100%; text-align:center; border-bottom:1px solid #666;}
.i_bg ul li:nth-child(4){ text-align:center; border-bottom:0;}
.i_bg ul li .a{ height:50px; line-height:50px;background-size:auto 36px; padding-left:47px;}
.i_bg ul li .a:hover{opacity:0.8;filter:Alpha(opacity=80);}
.i_bg ul li:nth-child(2) .a{ padding-left:47px;}
.i_bg ul li:nth-child(3) .a{ padding-left:47px;}
}

@media screen and (max-width: 780px) {


}
@media screen and (max-width: 640px) {
.main .banner .swiper-pagination {bottom: 240px;}
.i_bg ul li .a{ height:48px; line-height:48px;background-size:auto 30px; padding-left:40px; font-size:16px;}
.i_bg ul li:nth-child(2) .a{ padding-left:40px;}
.i_bg ul li:nth-child(3) .a{ padding-left:40px;}
.i_bg ul li:nth-child(4) .a{ padding-left:40px;}

}

@media screen and (max-width: 480px) {
.main .banner .swiper-pagination {bottom: 210px;}
.i_bg ul li .a{ height:46px; line-height:46px;background-size:auto 26px; padding-left:36px; font-size:15px;}
.i_bg ul li:nth-child(2) .a{ padding-left:36px;}
.i_bg ul li:nth-child(3) .a{ padding-left:36px;}
}
@media screen and (max-width: 360px) {

}
