@import url("public.css");

/*----------头部banner------*/
.header-banner{width: 100%; height: 220px; position: relative;}

.swiper-container,.swiper-wrapper,.swiper-slide{
	width:100%;
	height: 540px;
}
.swiper-slide{background-position:50% 100%; position:relative;}
.slide1{background-image:url("../img/banner1.jpg"); background-size: cover;}
.slide2{background-image:url("../img/banner2.jpg");background-size: cover;}
.slide3{background-image:url("../img/banner3.png");background-size: cover;}

.pagination{
	position: absolute;
    z-index: 122200;
    margin-top: -81.5px;
    top: 50%;
	right:17px;
}
.swiper-pagination-switch{
	width:21px;
	height:21px;
	border:1px solid #fff;
	border-radius:50%;
	display:block;
	margin:7px 7px 20px;
	padding: 6px;
	background:rgba(255,255,255,.4);
	cursor:pointer;
}
.swiper-active-switch{
	background:#fff \9;
	background:rgba(255,255,255,1);
}
.swiper-pagination-switch:hover{
	background:rgba(255,255,255,.8);
	border:1px solid #ddd;
}

.ani{
	opacity:0;
}
.ani-slide .ani1-1{
	opacity:1;
	-webkit-animation: fadeInDown 0.5s both;
    animation: fadeInDown 0.5s both;
}
.ani-slide .ani1-2{
	opacity:1;
    -webkit-animation: fadeInDown 1s 0.5s both;
    animation: fadeInDown 1s 0.5s both;
}
.ani-slide .ani1-3{
	opacity:1;
    -webkit-animation: fadeInDown 1s 1s both;
    animation: fadeInDown 1s 1s both;
}
.ani-slide .ani2-1,.ani-slide .ani3-1,.ani-slide .ani4-1,.ani-slide .ani5-1{
    opacity: 1;
    -webkit-animation: fadeInUp 1s both;
    animation: fadeInUp 1s both;
}
.ani-slide .ani2-2,.ani-slide .ani3-2,.ani-slide .ani4-2,.ani-slide .ani5-2{
    opacity: 1;
    -webkit-animation: fadeInUp 1s 0.5s both;
    animation: fadeInUp 1s 0.5s both;
}



/*----------头部左边导航------*/

.header-nav-wrap{ position: absolute;left: 0; top: 75px;  width: 100%; z-index: 1;}
.header-l-nav{width:200px;float: left;overflow: hidden;}
.header-l-nav .list{}
.header-l-nav .list li{ width:50%; float: left; animation: fadeInLeft 1s 0.5s both;}
.header-l-nav .list li .box{width: 90px; height:80px; background: #f9f9f9; text-align: center; border-radius: 4px; padding-top:14px; margin-bottom: 10px;}
.header-l-nav .list li .box:hover{background: #fff;opacity: .9}
.header-l-nav .list li .box img{ width:auto; height: 32px;}
.header-l-nav .list li .box p{ line-height: 2.1;}



.header-l-nav-v{float: left;overflow: hidden;}
.header-l-nav-v .list {width: 90px;  float: left;margin-right: 10px; overflow: hidden;}
.header-l-nav-v .list li{ width: 90px; float: left; animation: fadeInLeft 1s 0.5s both; }
.header-l-nav-v .list li .box{width: 90px; height:80px; background: #f9f9f9; text-align: center; border-radius: 4px; padding-top:14px; margin-bottom: 10px;}
.header-l-nav-v  .list li .box:hover{background: #fff;opacity: .9}
.header-l-nav-v  .list li .box img{ width:auto; height: 32px;}
.header-l-nav-v  .list li .box p{ line-height: 2.1;}



.header-btn{ position: relative; float: right;}
.header-btn .box{  float: right; overflow: hidden;
	margin-top: 400px;;}
.header-btn .box a.enter {
    position: relative;
    padding: 8px 16px;
	margin: 0 0 0 30px;
    color: #333;
	background: #fff \9;
	background: rgba(255,255,255,.87);
    font-weight: 500;
    border-radius: 4px;
    transition: all .4s;
	font-size: 14px;
	display: inline-block;
	float: right;
}
.header-btn .box a.enter i{ padding-right: 4px; color: #4564a8;}
.header-btn .box a.enter:hover {
	transform: scale(1.1);
}





/*----------主体------*/
@font-face {
  font-family: 'titlefont';
  src: url('../font/CharlemagneStd-Bold.otf');
  font-weight: normal;
  font-style: normal;
}


.project-list {
    margin: 0px 0px 0 0px;
    padding: 0px;
    list-style: none;
    width: 100%;
}

.project-list li {
        line-height: 1.6;
        margin: 0px;
        padding: 5px 0;
        word-break: keep-all;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.project-list li > .date {
            width: 10%;
            float: left;
            text-align: center;
            color: #999;
            font-size: 95%;
            border: 1px solid #ddd;
        }

.project-list li > .date a {
                color: #777
            }

.project-list li > a {
            width: 73%;
            margin: 0px;
            padding: 0px 0 0 10px;
            float: left;
            cursor: pointer;
            text-overflow: ellipsis;
            overflow: hidden;
 }

.project-list li > .subnav {
            width: 15%;
            float: right;
			overflow: hidden;
            text-align: center;
            color: #fff;
            font-size: 95%;
        }

.project-list li > .subnav a {
                color: #fff
            }
.project-list li > .subnav a:hover {
                opacity: .7
            }
.plat-box{
    width: 100%;
}
.plat-box-top{
    width: 100%;
    height: 150px;
}
.plat-box .txt {
    width: 100%;
    /*height: 150px;*/
    overflow: hidden;
    float: left;
    padding: .6em 1.5em .6em 0;
    text-indent: 2em;
    font-size: 16px;
    line-height: 2;
}
.plat-box .img {
    width: 100%;
    /*height: 150px;*/
    overflow: hidden;
    float: left;
}
.plat-box .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-box {
    width: 100%;
    background-color: #f6f8fc;
    overflow: hidden;
    /*height: 150px;*/
}

.news-box .img {
        width: 100%;
        /*height: 150px;*/
        overflow: hidden;
        /*float: left;*/
    }

.news-box .img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

.news-box .txt {
        width: 65%;
        height: 150px;
        overflow: hidden;
        float: left;
        padding: .6em 1.5em;
    }

 .news-box .txt h4 {
            line-height: 1.4;
	  		 width: 100%;
	 		margin-bottom: 6px;
        }

 .news-box .txt p {
	 font-size: 12px;
	color: #666;
	 height: 41px;
	 overflow: hidden;
	 margin-bottom: 5px;
        }

 .news-box .txt span {
            color: #999;
        }


.news-list {
    margin:10px 0px;
    padding: 0px;
    list-style: none;
    width: 99%;
}

.news-list li {
        line-height: 1.6;
        margin: 0px;
        padding: 5px 0;
        word-break: keep-all;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.news-list li > .date {
            width: 19%;
            float: left;
            text-align: center;
            color: #999;
            /*font-size: 95%;*/
            border: 1px solid #ddd;
    font-size: 15px;
        }

.news-list li > .date a {
                color: #777
            }

.news-list li > a {
            width: 80%;
            margin: 0px;
            padding: 0px 0 0 10px;
            float: left;
            cursor: pointer;
            text-overflow: ellipsis;
            overflow: hidden;
    font-size: 15px;
 }


.cases-wrap{ width: 100%;  position: relative;}

.cases-wrap li{ width: 33.33%; float: left;}
.cases-wrap li .box1{ width: 50%; overflow: hidden;float: left; padding-right: 10px; margin-bottom: 10px;}
.cases-wrap li .box2{ width: 100%; overflow: hidden;float: left; padding-right: 10px;margin-bottom: 10px;}
.cases-wrap li .box2:nth-child(n+2) .imgbox{ height: 280px;}

.cases-wrap .title{ color: #fff; padding: 5px; font-size:12px;position: absolute; top: 10px; left: 10px; margin-right: 10px; opacity: .9; font-weight: 300; text-align: justify}

 .cases-wrap .imageffect {
        position: relative;
    }

.cases-wrap .imageffect .imgbox {
            width: 100%;
            height: 180px;
            overflow: hidden;
            position: relative;
            border: 1px solid #eee;
			 -webkit-transform: rotateY(0);
		  -moz-transform: rotateY(0);
		  -ms-transform: rotateY(0);
		  -o-transform: rotateY(0);
		  transform: rotateY(0);
		  -webkit-transform-origin: 0% 50%;
		  -moz-transform-origin: 0% 50%;
		  -ms-transform-origin: 0% 50%;
		  -o-transform-origin: 0% 50%;
		  transform-origin: 0% 50%;
		  -webkit-transition: all 0.4s ease-in-out;
			  -moz-transition: all 0.4s ease-in-out;
			  transition: all 0.4s ease-in-out;
}

.cases-wrap .imageffect .imgbox img {
                width: 100%;
                height: 100%;
                object-fit: cover;
                transition: all 0.4s ease-in-out;
				 opacity: 1;
            }

.cases-wrap .imageffect .info {
    /*background: #0e9ea6;*/
    background: rgba(14, 158, 166,.5);
            padding: 15px 0;
            visibility: hidden;
            opacity: 0;
            transition: all 0.4s ease-in-out;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
			-webkit-transform: rotateY(-90deg);
		  -moz-transform: rotateY(-90deg);
		  -ms-transform: rotateY(-90deg);
		  -o-transform: rotateY(-90deg);
		  transform: rotateY(-90deg);
		  -webkit-transform-origin: 100% 50%;
		  -moz-transform-origin: 100% 50%;
		  -ms-transform-origin: 100% 50%;
		  -o-transform-origin: 100% 50%;
		  transform-origin: 100% 50%;
    text-align: center;
        }

.cases-wrap .imageffect .info h3 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 16px;
    padding: 10px;
    margin: 30px 0 0 0;
	line-height: 1.5;
}
.cases-wrap .imageffect .info p {
			  font-size: 12px;
			  position: relative;
			  color: #ddd;
			  padding: 0px 10px 0 15px;
			  text-align: center;
            }

.cases-wrap .imageffect .info p a:hover {
                    color: #fff580;
                    text-decoration: underline;
                }
.cases-wrap .imageffect:hover .imgbox {
  opacity: 0;
  visibility: hidden;
  -webkit-transform: rotateY(90deg);
  -moz-transform: rotateY(90deg);
  -ms-transform: rotateY(90deg);
  -o-transform: rotateY(90deg);
  transform: rotateY(90deg);
}
.cases-wrap .imageffect:hover .info {
            visibility: visible;
            opacity: 1;
            /*background: #0e9ea6;*/
              background: rgba(14, 158, 166,.5);
			 -webkit-transform: translateX(0);
			  -moz-transform: translateX(0);
			  -ms-transform: translateX(0);
			  -o-transform: translateX(0);
			  transform: translateX(0);
    text-align: center;

        }
.cases-wrap .imageffect:hover .info h3 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
    font-size: 16px;
    padding: 10px;
    margin: 30px 0 0 0;
}

.cases-wrap .imageffect:hover .info p {
                color: #ddd;
                padding: 0px 10px 0 15px;
				line-height: 1.5;
            }


.team dl {
    width: 100%;
	margin-top: -10px;
}

.team dl dt { float: left; border: 1px solid #ddd; padding: 29px 29px 26px 29px; width: 20.3%; margin-top: 10px; margin-right: 5px; -webkit-transition: all 0.3s linear; transition: all 0.3s linear;height: 406px; }
.team dl dt a { display: block; position: relative;width: 100%; height: 100%; }
.team dl dt a span.img { border-radius: 5px; height: 170px; background:#4564a8 url("../image/img18.jpg"); display: block; text-align: center; overflow: hidden;}
.team dl dt a span.img img { border-radius: 5px;border: 4px solid rgba(255, 255, 255, 0.7); margin:25px 20px; width: 70%; height: 70%; object-fit: cover}
.team dl dt a h4 { font-size: 16px; color: #333; line-height: 24px; padding-top: 10px; }
.team dl dt a h4 i { color: #fea71e; font-size: 16px;  }
.team dl dt a h5 {color: #999; font-size: 14px; padding: 2px 0 8px 0px; }
.team dl dt a h5:before,.team dl dd li a h5:before { font-family: 'fontello'; content: '\e849'; padding-right: 6px;color: #aaa; }
.team dl dt a h6 { width: 100%; margin-bottom: 27px; }
.team dl dt a h6 span { height: 24px; line-height: 24px; display: inline-block; background: #b2b2b2; margin-right: 3px; color: #fff; padding: 0 13px; margin-bottom: 3px; font-size: 12px; }
.team dl dt a p {position: absolute; bottom: -15px; width: 100% ;border-top: 1px solid #f1f1f1; padding-top: 12px; }
.team dl dt a p span { float: right; font-weight: 300;}
.team dl dt a p span i,.team dl dd li a p i{ padding-right: 6px;}
.team dl dt a p span:first-child { float: left; margin-top: -3px; }
.team dl dt:hover { border-color: #4564a8; -webkit-box-shadow: 0px 0px 3px #4564a8; -moz-box-shadow: 0px 0px 3px #4564a8; box-shadow: 0px 0px 3px #4564a8; }
.team dl dd { float: right; width: 79% }
.team dl dd * { -webkit-transition: all 0.3s linear; transition: all 0.3s linear; }
.team dl dd li { width: 33.33%; padding: 0 6px;height: 198px; float: left; margin-top: 10px; }
.team dl dd li a { display: block; width: 100%; height: 100%; border: 1px solid #ddd; padding: 14px 18px; }
.team dl dd li a div.img { height: 100px;width: 100px; border: 1px solid #f3f3f3; display: block; float: left; margin-top: 10px;  }
.team dl dd li a div.img img { width: 100%; height: 100%; object-fit: cover;border-radius: 5px;}
.team dl dd li a h4, .team dl dd li a h6 {  float: right; display: block; margin: 0px; width: 100% }
.team dl dd li a .txt{ width: 55%; margin-left: 15px; float: left;}
.team dl dd li a h4 { font-size: 16px; color: #333; line-height: 24px; padding-top: 14px;display: inline-block; float: left;overflow: hidden; height: 60px; }
.team dl dd li a h4 i { color: #fea71e; font-size: 16px; font-family: 'Iskoola Pota',arial; }
.team dl dd li a h5 { display: block;float: left; color: #bbb; font-size: 14px; padding: 0px; }
.team dl dd li a h6 { font-size: 14px; color: #999; line-height: 22px; }
.team dl dd li a p { border-top: 1px solid #f1f1f1; margin-top: 25px; width: 100%; float: left; padding-top: 12px; }
.team dl dd li a p span { float: right; }
.team dl dd li a p span:first-child { float: left;width: 80%;  word-break: keep-all; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.team dl dd li a:hover { border-color: #4564a8; -webkit-box-shadow: 0px 0px 3px #4564a8; -moz-box-shadow: 0px 0px 3px #4564a8; box-shadow: 0px 0px 3px #4564a8; }
.team dl dd li:hover h4 em { color: #4564a8; }



.team-list  li { width: 25%; padding: 0 6px;height: 190px; float: left; margin-top: 10px; }
.team-list   li a { display: block; width: 100%; height: 100%; border: 1px solid #ddd; padding: 14px 18px; }
.team-list   li a div.img { height: 100px;width: 100px; border: 1px solid #f3f3f3; display: block; float: left; margin-top: 10px;border-radius: 5px;  }
.team-list   li a div.img img { width: 100%; height: 100%; object-fit: cover;}
.team-list  li a h4, .team  li a h6 {  float: right; display: block; margin: 0px; width: 100% }
.team-list  li a .txt{ width: 59%; padding-left: 1em; ; float: left;height: 100px;}
.team-list   li a h4 { font-size: 16px; color: #333; line-height: 24px; padding-top: 14px;display: inline-block; float: left;overflow: hidden; height: 60px; }
.team-list   li a h4 i { color: #fea71e; font-size: 16px; font-family: 'Iskoola Pota',arial; }
.team-list   li a h5:before {
    font-family: 'fontello';
    content: '\e849';
    padding-right: 6px;
    color: #aaa;
}
.team-list   li a h5 { display: block;float: left; color: #bbb; font-size: 14px; padding: 0px;height: 44px;overflow: hidden;  }
.team-list   li a h6 { font-size: 14px; color: #999; line-height: 22px; }
.team-list   li a p { border-top: 1px solid #f1f1f1; margin-top: 15px; width: 100%; float: left; padding-top: 10px; }
.team-list   li a p span { float: right; }
.team-list   li a p span:first-child { float: left;width:78%;  word-break: keep-all; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
.team-list   li a p span i{ padding-right:5px;}
.team-list   li a:hover { border-color: #4564a8; -webkit-box-shadow: 0px 0px 3px #4564a8; -moz-box-shadow: 0px 0px 3px #4564a8; box-shadow: 0px 0px 3px #4564a8; }
.team-list   li:hover h4 em { color: #4564a8; }



.expert-wrap{ width: 100%; margin-top: 2em; background: #f6f6f6;}

.owl-expert {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
	margin-top: 5px;
	margin-bottom: 20px;
}
.owl-expert .item {
    display: block;
    margin: 6px;
	text-align: center;
	-webkit-transition: all 0.3s linear;
	transition: all 0.3s linear;
}

.owl-expert img {
    display: block;
    width: 100%;
	height:auto;
	/*object-fit: cover;
	filter: grayscale(100%);*/
}
.owl-expert .item .txt{padding: 10px 0 5px 0;}
.owl-expert .item  h4{ font-size: 16px; font-weight: 800;
}
.owl-expert .item:hover{ transform: translateY(-3px);color: #222;background: #fff;}
.owl-expert .item:hover img{filter: grayscale(0%) }



.search {
    background-color: #fff \9;
	background-color: rgba(255,255,255,.87);
    float: left;
    border-radius: 5px;
	 border:1px solid #ddd;
}

.search .keyword{ height:37px; width:100%;}
.search .keyword input{
	background-color: transparent;;width:77%;height:37px; float:left; border:0; line-height:32px; padding:0px;color:#888; font-size:14px; text-indent:.5em;	border-radius:3px;
}
.search_btn{width:20px; height:20px; border:0; background: url(../image/search.png) center center; margin:8px 12px 0 5px; float: right;}


@media screen and (max-width: 1440px) {
	.team dl dd li a .txt{ width: 52%; margin-left: 10px; float: left;}
	.team-list li a .txt{
 		width: 52%;
	}
}

@media screen and (max-width: 1200px) {
	.team dl dd li a div.img {
    height: 80px;
    width: 80px;
}
	.team-list   li a div.img { height: 80px;width: 80px;   }
	.team-list li a p {
    margin-top: 10px;
	}
}