﻿.main-intro{ height: 580px; overflow: hidden; }
.main-intro-title{ margin-top: 45px; overflow: hidden; text-align: center; }
.main-intro-title img{ width: 525px; max-width: 525px; overflow: hidden; }
.main-intro-box{ margin-top: 40px; }  
.main-intro-info{ width: 48%; margin-top: 15px; }
.main-intro-info img{ width:100%; }
.main-intro-info a.more{background:url(../img/more-bj.png) no-repeat; width: 164px; padding-left: 20px; font-size: 18px; height: 43px; line-height: 43px; margin: 30px 0px 0px 193px; display: inline-block; }
.mian-intro-bar{ width: 48%;}
.mian-intro-bar img{ width: 100%; overflow: hidden;}
.fast-pass{ width: 100%; overflow: hidden; }
.fast-pass img{ width: 100%;}
.swiper-slide img{ width: 100%; }




@keyframes lefteaseinAnimate{
    0%{ transform: translateX(-2000px); opacity: 0;}   /*在0%时设置文字在想X轴-2000px位移处（左边），透明度为0，也就是看不见文字*/
    100%{ transform: translateX(0px); opacity: 1;}         /*在100%时设置文字在想X轴0px位移处，也就是原始布局的位置，透明度为1，也就是文字可以看见了*/
}
@-webkit-keyframes lefteaseinAnimate{
    0%{ -webkit-transform: translateX(-2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
@-o-keyframes lefteaseinAnimate{
    0%{ -webkit-transform: translateX(-2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
@-ms-keyframes lefteaseinAnimate{
    0%{ -webkit-transform: translateX(-2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
@-moz-keyframes lefteaseinAnimate{
    0%{ -webkit-transform: translateX(-2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
.main-intro-info{
    animation: lefteaseinAnimate 1s ease 1;    /*调用已定义好的动画lefteaseinAnimate，全程运行时间1S，进入的速度曲线为ease，只播放一次*/
    -webkit-animation: lefteaseinAnimate 1s ease 1;
    -ms-animation: lefteaseinAnimate 1s ease 1;
    -o-animation: lefteaseinAnimate 1s ease 1;
    -moz-animation: lefteaseinAnimate 1s ease 1;

    /*规定动画的最后状态为结束状态*/
    animation-fill-mode:forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
}

/*定义一个名字为righteaseinAnimate动画，实现从页面的右边淡入页面效果*/
@keyframes righteaseinAnimate{
    0%{ transform: translateX(2000px); opacity: 0;}   /*在0%时设置文字在想X轴2000px位移处（右边），透明度为0，也就是看不见文字*/
    100%{ transform: translateX(0px); opacity: 1;}      /*在100%时设置文字在想X轴0px位移处，也就是原始布局的位置，透明度为1，也就是文字可以看见了*/
}
@-webkit-keyframes righteaseinAnimate{
    0%{ -webkit-transform: translateX(2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
@-o-keyframes righteaseinAnimate{
    0%{ -webkit-transform: translateX(2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
@-ms-keyframes righteaseinAnimate{
    0%{ -webkit-transform: translateX(2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
@-moz-keyframes righteaseinAnimate{
    0%{ -webkit-transform: translateX(2000px); opacity: 0;}
    100%{ -webkit-transform: translateX(0px); opacity: 1;}
}
.mian-intro-bar{
    animation: righteaseinAnimate 1s ease 1;    /*调用已定义好的动画righteaseinAnimate，全程运行时间1S，进入的速度曲线为ease，只播放一次*/
    -webkit-animation: righteaseinAnimate 1s ease 1;
    -moz-animation: righteaseinAnimate 1s ease 1;
    -ms-animation: righteaseinAnimate 1s ease 1;
    -o-animation: righteaseinAnimate 1s ease 1;

    /*规定动画的最后状态为结束状态*/
    animation-fill-mode:forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
}

.service-wrap{ background: #b9e9fd; height: 686px; }
.service-box{ padding-top: 40px; }
.service-box .service-title{ text-align: center; }
.service-box .service-title img{ width: 288px; max-width: 288px; overflow: hidden; }
.service-box .service-item{ position: relative; overflow: hidden; height: 515px; } 
.service-box .service-item li{ float: left; width: 290px; height: 250px; line-height: 250px; text-align: center; position: absolute; }
.service-box .service-item li a{ font-size: 30px; color: #ffffff;
	display:block;transform:rotateY(0deg);
    -moz-transform:rotateY(0deg);
    -webkit-transform:rotateY(0deg);
    -o-transform:rotateY(0deg);
    -ms-transform:rotateY(0deg);

    transition:all 0.5s ease-out 0s;
    -webkit-transition:all 0.5s ease-out 0s;
    -moz-transition:all 0.5s ease-out 0s;
    -ms-transition:all 0.5s ease-out 0s;
    -o-transition:all 0.5s ease-out 0s;}
.service-box .service-item li:hover a{
    transform:rotateY(360deg);
    -moz-transform:rotateY(360deg);
    -webkit-transform:rotateY(360deg);
    -o-transform:rotateY(360deg);
    -ms-transform:rotateY(360deg);}
.service-box .service-item li.item01{ top:140px; left:0; }
.service-box .service-item li.item01 a{ background: url(../img/s01.png) no-repeat; background-size: 100%;} 
.service-box .service-item li.item02{ top:10px; left:225px;}
.service-box .service-item li.item02 a{ background: url(../img/s02.png) no-repeat; background-size: 100%;}
.service-box .service-item li.item03{ top:270px; left:225px; }
.service-box .service-item li.item03 a{ background: url(../img/s03.png) no-repeat; background-size: 100%;} 
.service-box .service-item li.item04{ top:140px; left:454px;}
.service-box .service-item li.item04 a{ background: url(../img/s04.png) no-repeat; background-size: 100%;}
.service-box .service-item li.item05{ top:10px; left:680px; }
.service-box .service-item li.item05 a{ background: url(../img/s05.png) no-repeat; background-size: 100%;} 
.service-box .service-item li.item06{ top:270px; left:680px;}
.service-box .service-item li.item06 a{ background: url(../img/s06.png) no-repeat; background-size: 100%;}
.service-box .service-item li.item07{ top:140px; left:911px; }
.service-box .service-item li.item07 a{ background: url(../img/s07.png) no-repeat; background-size: 100%; }  


.advantage-wrap{ background: url(../img/adv-bj.jpg) center top no-repeat; height: 700px; }
.advantage-main{ padding-top: 40px; }
.advantage-main .advantage-title{ padding: 30px; text-align: center;}
.advantage-main .advantage-title img{ width: 453px; max-width: 453px; overflow: hidden; } 
.advantage-main .advantage-box{ margin: 20px 0; overflow: hidden; }
.advantage-main .advantage-img,.news-box-left{ animation: lefteaseinAnimate 1s ease 1;    /*调用已定义好的动画lefteaseinAnimate，全程运行时间1S，进入的速度曲线为ease，只播放一次*/
    -webkit-animation: lefteaseinAnimate 1s ease 1;
    -ms-animation: lefteaseinAnimate 1s ease 1;
    -o-animation: lefteaseinAnimate 1s ease 1;
    -moz-animation: lefteaseinAnimate 1s ease 1;

    /*规定动画的最后状态为结束状态*/
    animation-fill-mode:forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards; }
.advantage-main .advantage-img img{ width: 454px; height: 372px; max-width: 454px; overflow: hidden; }
.advantage-main .advantage-list,.news-box-right{ margin-right: 50px; animation: righteaseinAnimate 1s ease 1;    /*调用已定义好的动画righteaseinAnimate，全程运行时间1S，进入的速度曲线为ease，只播放一次*/
    -webkit-animation: righteaseinAnimate 1s ease 1;
    -moz-animation: righteaseinAnimate 1s ease 1;
    -ms-animation: righteaseinAnimate 1s ease 1;
    -o-animation: righteaseinAnimate 1s ease 1;

    /*规定动画的最后状态为结束状态*/
    animation-fill-mode:forwards;
    -webkit-animation-fill-mode: forwards;
    -o-animation-fill-mode: forwards;
    -ms-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards; }
.advantage-main .advantage-list ul{ margin-top: 15px; padding: 0; width: 512px; }
.advantage-main .advantage-list li{ height: 65px;  width: 512px; line-height: 65px; overflow: hidden; margin: 5px 0px 5px 0px; font-size: 22px; font-weight: bold; }
.advantage-main .advantage-list li span{ float: left; background: url(../img/odd.png) no-repeat; width: 36px; height: 36px; color: #fff; font-size: 16px; font-weight: normal; margin: 14px 10px 0 10px; text-align: center; line-height: 36px;  font-weight: bold;  }
.advantage-main .advantage-list li:nth-child(2n){ background: #e7942c; border-radius: 8px; color: #ffffff; }
.advantage-main .advantage-list li:nth-child(2n) span{ background: url(../img/even.png) no-repeat; color: #333333; }

.news-wrap{/* height: 790px;*/}
.news-title{ text-align: center; margin-top: 40px; }
.news-title img{ width: 206px; max-width: 206px; overflow: hidden; }
.news-box{ margin: 20px 0; overflow: hidden; }
.news-box .news-box-left,.news-box .news-box-right{ width: 590px; margin: 0; }
.news-box .news-col{  margin: 7px; border: 1px solid #e5e5e4; padding: 10px 25px 0px 25px; }
.news-box .news-col h1{ margin: 0; border-bottom: 1px solid #dddddd; height: 45px; line-height: 45px;}
.news-box .news-col h1 span{ font-size: 18px; font-weight: bold;  margin: 0;  padding-left: 40px;  background: url(../img/n01.png) left center no-repeat;  }
.news-box .news-col h1 span.hydt{ background: url(../img/n02.png) left center no-repeat;}
.news-box .news-col h1 span.mtgz{ background: url(../img/n03.png) left center no-repeat; }
.news-box .news-col h1 span.cszc{  background: url(../img/n02.png) left center no-repeat; }
.news-box .news-col h1 a.more{ background: url(../img/more.jpg) no-repeat; width: 18px; height: 18px; display: block; margin-top: 15px;}
.news-box .news-col ul{ padding: 0;  padding-top: 20px;}
.news-box .news-col li{ line-height: 35px; margin-bottom: 5px;}
.news-box .news-col li span{ float:right; color: #5b5b5b; font-size: 12px;}
.news-box .news-col li a:hover span{ color: #e7942c;}
.news-box .news-col li a{  background: url(../img/d01.png) left center no-repeat; padding-left: 20px; display: block;  }
.news-box .news-col li a:hover{ background: url(../img/d02.png) left center no-repeat; color: #e7942c; }

.why-wrap{ background: url(../img/choose-bj.jpg) center top no-repeat; height: 575px; }
.why-wrap .why-title{ padding-top: 40px; text-align: center; }
.why-wrap .why-title img{ width: 610px; max-width: 610px; overflow: hidden; }
.why-wrap .why-box{ padding-top: 30px; }
.why-wrap .why-box img{  width:100%; overflow: hidden; }

.link{ margin-top: 40px; }
.link h1{ background: url(../img/link-title.png) left center no-repeat; height: 50px; display: block; }
.link ul{ margin: 20px 0px; padding: 0; }
.link li{ float: left; font-size: 14px;  margin-right: 10px; line-height: 30px; }
.link li a:hover,.link li a:focus{ color: #e7942c; }


.contact-warp{ background: #ebebeb; height: 410px;}
.contact-title{ padding-top: 40px; display: block; text-align: center; }
.contact-title img{ width: 394px; max-width: 394px; overflow: hidden;}
.contact-box{ margin-top: 50px; }
.contact-box ul.address{ border: 1px solid #d7d7d7; padding: 20px; width: 465px; overflow: hidden; }
.contact-box ul.address li{ line-height: 40px; font-size: 18px; display: block; }
.contact-box .hot-line{ width: 263px; margin: 0px 0px 0 50px; display: inline-block;}
.contact-box .hot-line ul{ margin: 0; padding: 0; }
.contact-box .hot-line li{ background: #0e8aca url(../img/c01.png) 20px 10px no-repeat; height: 77px; line-height: 77px; font-size: 24px; font-weight: bold; padding-left: 80px; margin-bottom: 30px; color: #ffffff; }
.contact-box .hot-line li p{ font-size: 14px; margin: 0; padding: 0; line-height: 25px; padding-top: 5px; font-weight: normal; }
.contact-box .hot-line li h4{ margin: 0; padding: 0; line-height: 35px; font-size: 24px; font-weight: bold; color: #ffffff; }
.contact-box .hot-line li a{ color: #ffffff;} 
.contact-box .wx-list{}
.contact-box .wx-list ul{ margin: 0; padding: 0; }
.contact-box .wx-list li{ float: left;  width: 146px;  margin-left: 20px; }
.contact-box .wx-list li img{ width:100%; overflow: hidden; display: block;   }
.contact-box .wx-list li p{ margin: 10px 0 0 0px; background: url(../img/icon01.png) 20px center no-repeat; padding-left: 55px; font-size: 14px; height: 30px; line-height: 30px; display: block;  }
.contact-box .wx-list li p.g-wx{ background: url(../img/icon02.png) 20px center no-repeat; }



@media (min-width: 768px) and (max-width: 1000px)  {
 	 .main-intro{ height:auto; }
 	 .service-box .service-item li{ width: 236.928px; height: 204.248px; line-height: 204.248px; }
 	 .service-box .service-item li.item02,.service-box .service-item li.item03{ left:183.823px;}
 	 .service-box .service-item li.item04{ left:370.915px; }
 	 .service-box .service-item li.item05,.service-box .service-item li.item06{  left:555.555px; }
 	 .service-box .service-item li.item07{ left:744.288px; }
 	 .service-wrap,.advantage-wrap,.news-wrap,.why-wrap,.contact-warp{ height: auto; }
 	 .advantage-main .advantage-img img{ width: 370.915px; height: 303.921px; }
 	 .news-box .news-box-left, .news-box .news-box-right{ width: 482.026px;}
 	 .contact-box ul.address{ width: 379.901px;}
 	 .contact-box .hot-line{ width: 214.869px; }
 	 .contact-box .wx-list{ width:271.241px }
 	 .contact-box .wx-list li{ width: 119.281px; margin-left: 10px; }
 	 .contact-box .hot-line li h4{ font-size: 18px; color: #ffffff; }
 }
