@charset "UTF-8";
/* CSS Document */
/*
-----------------------------首页样式start-----------------------------
*/

/*头部开始*/
.topBox{ height: 100px;position:fixed;top: 0;left: 0;width:100%;z-index:999}
.top{ width: 100%; height: 100px; background: #FFF; position: fixed; left: 0px; top: 0px; z-index: 10000; box-shadow: 0px 0px 20px rgba(0,0,0,0.1);}
.logo{ height: 70px; overflow: hidden; margin-top: 15px;}
.logo a{display: block;width:500px;margin:0 auto}
.logo img{ height: 70px;}
.topR{ position: relative;}
.topRBtn{ overflow: hidden; margin-left: 35px; width: 86px;}
.topRBtn a{ display: block; padding-top: 16px; height: 84px; background: #4ba371; transition: all .2s;-webkit-transition: all .2s;}
.topRBtn a .icn{ display: block; height: 48px; background: url(../images/icn1.png) no-repeat center center;}
.topRBtn a span{ display: block; height: 25px; line-height: 25px; text-align: center; font-size: 14px; color: #ffffff;}
.topRBtn a:hover{ opacity: .95;}

.ba{ margin-top:80px}












#warp {
    width: 100%;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;

}






/*头部结束*/
/*menu开始*/
.menu dd{flex:1; float:left; display:inline; position:relative; padding: 0 20px;}
@media only screen and (max-width:1600px) {
	.menu dd{padding:0 10px;}
}
@media only screen and (max-width:1440px) {
	.menu dd{padding:0 5px;}
}
@media only screen and (max-width:1366px) {
	.menu dd{padding:0;}
}
.menu dd .yj a{ display:block; height:100px; line-height:100px; padding: 0 9px; text-align:center; font-size:16px; position: relative; color: #333333;transition: all 0.1s;-webkit-transition: all 0.1s;}
.menu dd .yj a:before{ display: block; content: ''; position: absolute; left: 50%; margin-left: 0;transition: all 0.5s;-webkit-transition: all 0.5s; top: 0px; width: 0%; border-top: 3px solid #428a7b;}
.menu dd .ej{ position: absolute; left: 0px; top: 100px; width: 100%; padding-top: 10px; visibility: hidden; opacity: 0; transform: translateY(20px);-webkit-transform: translateY(20px); transition: all 0.5s;-webkit-transition: all 0.5s;}
.menu dd .ej:before{ display: block; width: 13px; height: 5px; content: ''; background: url(../images/icn2.png) no-repeat center center; position: absolute; left: 50%; margin-left: -6px; top: 5px;}
.menu dd .ej .ejC{ background: rgba(255, 255, 255, 1); border-radius: 5px; padding: 8px 0; box-shadow: 0px 0px 20px rgba(0,0,0,0.2);}
.menu dd .ej .ejC a{ display: block; padding: 8px 5px; line-height: 20px; font-size: 15px; color: #333333; text-align: center; transition: all 0.5s;-webkit-transition: all 0.5s;}
.menu dd .ej .ejC a:hover{ color: #428a7b;}
.menu dd .ej .ejC a.hover{ color: #428a7b;}
.menu dd .ej.active{ visibility: visible; opacity: 1; transform: translateY(0px);-webkit-transform: translateY(0px);}
.menu dd.hover .yj a{ color: #428a7b;}
.menu dd.hover .yj a:before{width: 100%; margin-left: -50%;}
/*menu结束*/
.topSearch{ height: 30px; line-height: 30px; width:40px; border-radius: 30px; margin-left: 10px; transition: all 0.3s; -webkit-transition: all 0.3s; position: absolute; right: 0;top: 35px;}
.topSearch input{ float: left; display: inline; width: 0; height: 30px; background: none; border: none; color: #666; transition: all 0.3s; -webkit-transition: all 0.3s;}
.topSearch a{ float: left; display: inline; width: 40px; height: 30px; background: url(../images/search.png) no-repeat center center;}
.topSearch.active{ background: #e1e1e1; width:230px;}
.topSearch.active input{ width:175px; padding-left: 15px; color: #666;}
.topSearch.active a{ background-image: url(../images/searchh.png); background-size: auto 20px;}
/*indexBanner开始*/
.indexBanner{overflow:hidden;width:100%;position:relative;margin-top:100px;}
.indexBanner .myslide{ 
	background-position: center center; 
	background-repeat: no-repeat; 
	background-size: cover; 
	position: relative; 
	height: 710px;
}
.indexBanner .slick-dots{ position: absolute; bottom: 50px; width: 100%; text-align: center;}
.indexBanner .slick-dots li{ width:9px; height: 9px; line-height: 9999px; text-align: center;color: #ffffff; display: inline-block; margin: 0 5px; cursor: pointer;overflow: hidden;border:1px solid #fff;border-radius:100%}
.indexBanner .slick-dots li.slick-active{background: #fff;}
.indexBanner .con1{ position: absolute; left:50%; top: 50%; margin-top: -143px;}
/* 云 */
.cloudWave{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(../images/banner/cloudWave1.png) left top no-repeat;
    background-size: contain;
    -webkit-animation: cloud 100s linear infinite;
    -moz-animation: cloud 100s linear infinite;
    -o-animation: cloud 100s linear infinite;
    animation: cloud 100s linear infinite;
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    

}
.cloudWave.cloudWave2{
    background: url(../images/banner/cloudWave2.png) center center no-repeat;
    background-size: contain;
}
@keyframes cloud {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(1920px);
  }
}

