﻿html,
body {
  position: relative;
  height: 100%;
}

#menu{
  position: fixed;
  z-index: 99;
  top:45%;
  right:30px;
}
#menu li{
  display: block;
  border-radius: 50%;
  position: relative;
  width: 18px;
  height: 18px;
  margin-bottom:30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  cursor: pointer;
  background: none;
  opacity: 1;
}
#menu li.swiper-pagination-bullet-active:after{
  display: block;
  content: '';
  position: absolute;
  border:3px solid #fff;
  width: 12px;
  height: 12px;
  top:50%;
  left:50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  border-radius: 50%;
  -webkit-transition: 350ms 0s all linear;
  -moz-transition: 350ms 0s all linear;
  -ms-transition: 350ms 0s all linear;
  -o-transition: 350ms 0s all linear;
  transition: 350ms 0s all linear;
}
#menu li i{
  background: #fff;
  border-radius: 50%;
  width: 6px;
  height: 6px;
  position: absolute;
  top:50%;
  left:50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
}
#menu li i:after{
  display: block;
  content: '';
  -webkit-transition: 350ms 0s all linear;
  -moz-transition: 350ms 0s all linear;
  -ms-transition: 350ms 0s all linear;
  -o-transition: 350ms 0s all linear;
  transition: 350ms 0s all linear;
  width:0;
  height: 1px;
  background: #fff;
  position: absolute;
  top:50%;
  right:9px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
#menu li:hover i:after{
  width:13px;
}
#menu li span{
  position: absolute;
  right:100%;
  top:0;
  color: #fff;
  width: 56px;
  font-weight: lighter;
  -webkit-transition: 350ms 0s all linear;
  -moz-transition: 350ms 0s all linear;
  -ms-transition: 350ms 0s all linear;
  -o-transition: 350ms 0s all linear;
  transition: 350ms 0s all linear;
  opacity: 0;
}
#menu li:hover span{
  opacity: 1;
}

mian{
  width:100%;
}


/*screen01*/
.screen01{
  width:100%;
  height: 100%;
  display:flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
.screen01_text{
  text-align: center;
  color: #fff;
}
.screen01_text>h4{
  font-size: 67px;
  line-height: 47px;
  font-style: italic;
  font-family: AlegreyaSans;
  text-transform: uppercase;
}
.screen01_text>p{
  font-size: 48px;
  font-family: hkjgh;
  line-height: 48px;
  margin-top: 25px;
  margin-bottom: 35px;
}
.screen01_text>small{
  font-size: 24px;
  font-family: hkjgh;
}
.scrolldown{
  position: absolute;
  text-align: center;
  bottom:30px;
  cursor: pointer;
}
.scrolldown b {
  display:block;
  margin:0 auto;
  width: 14px;
  height: 13px;
  position: relative;
}
.scrolldown b:after,.scrolldown b:before{
  display: block;
  content: '';
  width:100%;
  height: 7px;
  position: absolute;
  background: url(../images/downjt.png) no-repeat center;
}
.scrolldown b:after{
  opacity: 0.4;
  top:0;
  -webkit-animation: mouse-down 1s linear 0s infinite alternate;
  animation:  mouse-down 1s linear 0s infinite alternate;
}

.scrolldown b:before{
  bottom:0;
  -webkit-animation:  mouse-down 1s linear 400ms infinite alternate;
  animation:  mouse-down 1s linear 400ms infinite alternate;
}

@keyframes mouse-down {
  from { opacity: 0.2; }
  to { opacity: 1; }
}
@-webkit-keyframes mouse-down {
  from { opacity: 0.2; }
  to { opacity: 1; }
}


.scrolldown span {
  border: 2px solid #344f94;
  width: 20px;
  height: 32px;
  display: block;
  margin: 0px auto 14px;
  border-radius: 16px;
  position: relative;
}
.scrolldown span:after {
  display: block;
  content: '';
  width: 3px;
  height: 7px;
  border-radius: 1px;
  background-color: #344f94;
  position: absolute;
  left: 50%;
  margin-left: -1px;
  top: 5px;
  -webkit-animation: mouse-dot 1.5s cubic-bezier(0.23, 1, 0.32, 1) infinite;
  animation: mouse-dot 1.5s cubic-bezier(0.23, 1, 0.32, 1) infinite;
}
@keyframes mouse-dot {
  from { opacity: 0; }
  33% { opacity: 1; }
  to { transform: translateY(15px); -webkit-transform: translateY(15px); opacity: 0; }
}
@-webkit-keyframes mouse-dot {
  from { opacity: 0; }
  33% { opacity: 1; }
  to { transform: translateY(15px); -webkit-transform: translateY(15px); opacity: 0; }
}
.scrolldown b{
  color: #fff;
  font-size: 16px;
  font-weight: normal;
}

.scrolldown p{
  color: #fff;
  font-size: 16px;
  margin-bottom: 26px;
  margin-top:5px;
  font-weight: lighter;
}
main,.swiperbody {
  width: 100%;
  height: 100%;
}
.swiperbody>.swiper-wrapper>.swiper-slide{
  display:flex;
  align-items: center;
  width:100%;
  overflow: hidden;
}

.swiperbody .slide-inner {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-size: cover;
  background-position: center;
}




/*banner*/
.img_jz{
  position: relative;
  overflow: hidden;
  display: block;
}
.img_jz>img{
  position: absolute;
  top:50%;
  left:50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}

/*company*/
.company{
  background: url("../images/companybg.jpg") no-repeat center 0;
  background-size:inherit;
  width: 100%;
  height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-top:calc(5% + 90px);
}
.com_left{
  width: 46%;
}
.title{
  position: relative;
  z-index: 55;
}
.title b{
  position: relative;
  color: #fff;
  font-size: 22px;
  text-transform: uppercase;
}
.title i{
  position: absolute;
  top:6px;
  left:0;
  display:block;
  background: #fff;
  background:-moz-linear-gradient(-90deg, #fff, rgba(255, 255, 255, 0));
  background:-webkit-linear-gradient(-90deg,#fff, rgba(255, 255, 255, 0));
  background:-o-linear-gradient(-90deg, #fff, rgba(255, 255, 255, 0));
}
.title i:before{
  display: block;
  content: '';
  width: 70px;
  height: 70px;
  position: absolute;
  left:50%;
  top:50%;
  border-radius: 50%;
  -webkit-transform: translate(-50%,-50%);
  -moz-transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
  -o-transform: translate(-50%,-50%);
  transform: translate(-50%,-50%);
  background:#4275b0; /* 一些不支持背景渐变的浏览器 */
  background:-moz-linear-gradient(317deg, rgba(255, 255, 255, 0.21), rgba(255, 255, 255, 0));
  background:-webkit-linear-gradient(317deg,rgba(255, 255, 255, 0.21), rgba(255, 255, 255, 0));
  background:-o-linear-gradient(317deg, rgba(255, 255, 255, 0.21), rgba(255, 255, 255, 0));

}
.title h3{
  font-size: 36px;
  color: #fff;
}
.company .title h3{
  text-shadow: rgb(187, 187, 187) 0px 1px 0px,
  rgb(181, 181, 181) 0px 1px 0px,
  rgb(172, 172, 172) 1px 2px 0px,
  rgb(160, 160, 160) 2px 2px 0px,
  rgb(145, 145, 145) 3px 3px 0px,
  rgb(127, 127, 127) 4px 3px 0px,
  rgba(0, 0, 0, 0.2) 5px 4px 1px,
  rgba(0, 0, 0, 0.3) 6px 5px 6px;
}
.com_right{
  float:right;
  width:54%;
}

.com_right>small{
  font-size: 18px;
  color: #fff;
  line-height: 36px;
}
.com_right>ul{
  margin-top: 2vw;
  margin-bottom: 2vw;
}
.com_right>ul li{
  width: 50%;
  height: 105px;
  display:flex;
  justify-content: center;
  align-items:center;
  background: #fff;
  position: relative;
  overflow: hidden;
  float:left;
}
.com_right>ul li:before{
  display: block;
  content: '';
  background: #8dd448;
  position: absolute;
  left:0;
  bottom:0;
  height: 100%;
  width: 100%;
  -webkit-transform: scaleX(0);
  -moz-transform: scaleX(0);
  -ms-transform: scaleX(0);
  -o-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transition: -webkit-transform .6s cubic-bezier(.4,0,.2,1);
  transition: -webkit-transform .32s cubic-bezier(.4,0,.2,1);
  transition: transform .6s cubic-bezier(.4,0,.2,1);
  transition: transform .6s cubic-bezier(.4,0,.2,1),-webkit-transform .6s cubic-bezier(.4,0,.2,1);
  transform-origin:100%;
}
.com_right>ul li:hover:before{
  -webkit-transform: scaleX(1);
  -moz-transform: scaleX(1);
  -ms-transform: scaleX(1);
  -o-transform: scaleX(1);
  transform: scaleX(1);
  transform-origin:0;
}


.com_right>ul li:nth-of-type(2){
  background: #344f94;
}
.com_right>ul li a{
  display: block;
  width:76%;
  position: relative;
}
.com_right>ul li a:after{
  display:block;
  content: '';
  position: absolute;
  right:0;
  top:50%;
  width: 27px;
  height: 28px;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  background: url("../images/css_sprites.png") no-repeat -58px -10px;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.com_right>ul li:first-of-type:hover a:after{
  background-position: -10px -10px;
}
.com_right>ul li:nth-of-type(2) a:after{
  background: url("../images/css_sprites.png") no-repeat -57px -58px;
}
.com_right>ul li:nth-of-type(2):hover a:after{
  background-position: -10px -58px;
}

.com_right>ul li a span{
  font-size: 20px;
  color: #fff;
}
.com_right>ul li a p{
  font-size: 14px;
  color: #fff;
  text-transform: uppercase;
}
.com_right>ul li:first-of-type a span,.com_right>ul li:first-of-type a p{color: #344f94;}
.com_right>ul li:first-of-type:hover a span,.com_right>ul li:first-of-type:hover a p{color: #fff;}

/*yewu */
.yewu{
  background: url("../images/ywbg.jpg") no-repeat center;
  background-size:cover;
}
.yw_cont{
  height: 73.6vh;
  position: relative;
  top:calc(50% - 36.8vh + 45px);
}
.yw_left{
  float:left;
  width: 75%;
  height: 100%;
  border-radius: 0 0 0 60px;
  overflow: hidden;
}
.yw_left .swiper-slide,.yw_left .swiper-wrapper{
  width:100%;
  height: 100%;
}
.yw_left .swiper-slide a{
  display: block;
  width:100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.yw_left .swiper-slide a img{
  height: 100%;
}
.yw_text{
  width: 100%;
  position: absolute;
  left:0;
  bottom:0;
  background:transparent; /* 一些不支持背景渐变的浏览器 */
  background:-moz-linear-gradient(-90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
  background:-webkit-linear-gradient(-90deg, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
  background:-o-linear-gradient(-90deg, rgba(0, 0, 0, 0),  rgba(0, 0, 0, 0.8));
  padding-bottom: 1.8vw;
  display:flex;
  align-items: center;
}
.yw_text>b{
  position: relative;
  width: 20%;
  height: 103px;
}
.yw_text>b span{
  font-size: 120px;
  line-height: 103px;
  font-family: Impact;
  position: absolute;
  left:0;
  top:0;
  width:100%;
  text-align: center;
  color: transparent;
  -webkit-text-stroke:1px rgba(255, 255, 255, 0.2);
}
.yw_text>b i{
  text-align: center;
  font-size: 30px;
  color: #fff;
  position: absolute;
  width:100%;
  line-height: 103px;
}
.yw_text>small{
  display: block;
  width:80%;
  color: #fff;
  font-size: 14px;
  font-weight: lighter;
}


.ywrightbg{
  float:right;
  background: #fff;
  width: 25%;
  height: 100%;
  border-radius: 0 60px 0 0;
  overflow: hidden;
}
.ywrightbg .title{
  padding-left: 20%;
  padding-top: 5vh;
  padding-bottom: 5vh;
}
.tit_style02>b{
  color: #8dd448;
}
.tit_style02>h3{
  color: #33363b;
}
.tit_style02 i:before{
  background: #8dd448;
  background: -moz-linear-gradient(317deg, rgba(141, 212, 72, 0.2), rgba(141, 212, 72, 0));
  background: -webkit-linear-gradient(317deg, rgba(141, 212, 72, 0.2), rgba(141, 212, 72, 0));
  background: -o-linear-gradient(317deg,  rgba(141, 212, 72, 0.2), rgba(141, 212, 72, 0));
}
.tit_style02 i{
  background: #8dd448;
  background: -moz-linear-gradient(-90deg, #8dd448, rgba(255, 255, 255, 0));
  background: -webkit-linear-gradient(-90deg,#8dd448, rgba(255, 255, 255, 0));
  background: -o-linear-gradient(-90deg, #8dd448, rgba(255, 255, 255, 0));
}
.yw_right{
  height: 67.5%;
  width: 92%;
  margin-left: 0;
}
.yw_r_text{
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-left:58px;
  width: 100%;
  height: 84px;
  display: flex;
  align-items: center;
}
.yw_r_text:before{
  display: block;
  content: '';
  background: #8dd448;
  position: absolute;
  left:0;
  top:0;
  height: 100%;
  border-radius: 0 84px 84px 0;
  transition: width .6s cubic-bezier(.4,0,.2,1);
  width:0;
}
.yw_r_text:hover:before,.yw_right .swiper-wrapper .swiper-slide-thumb-active .yw_r_text:before{
  width:100%;
}
.yw_r_text>img{
  float:left;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.yw_r_text>div{
  float:left;
  margin-left: 18px;
  position: relative;
}
.yw_r_text>div>p{
  font-size: 12px;
  color: #6a7176;
  font-weight: lighter;
  text-transform: uppercase;
  -webkit-transition: 350ms 100ms all ease;
  -moz-transition: 350ms 100ms all ease;
  -ms-transition: 350ms 100ms all ease;
  -o-transition: 350ms 100ms all ease;
  transition: 350ms 100ms all ease;
}
.yw_r_text>div>small{
  font-size: 20px;
  color: #6a7176;
  -webkit-transition: 350ms 100ms all ease;
  -moz-transition: 350ms 100ms all ease;
  -ms-transition: 350ms 100ms all ease;
  -o-transition: 350ms 100ms all ease;
  transition: 350ms 100ms all ease;
}
.yw_r_text:hover>img,.yw_right .swiper-wrapper .swiper-slide-thumb-active .yw_r_text>img{
  filter: grayscale(100%) brightness(1000%)
}
.yw_r_text:hover>div>small, .yw_r_text:hover>div>p,.yw_right .swiper-wrapper .swiper-slide-thumb-active .yw_r_text>div>small,.yw_right .swiper-wrapper .swiper-slide-thumb-active .yw_r_text>div>p{
  color: #fff;
}

/*server*/
.server{
  background: url("../images/serbg.jpg") no-repeat center;
  background-size:cover;
  display:flex;
  align-items: center;
}
.mt{
  margin-top: 90px;
}
.server_cont{
  display:flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 4vh;
  background: url("../images/ser_line.png") no-repeat center 80%;
  background-size:100%;
}
.server_cont li{
  height: 52.6vh;
  width: 16.8%;
}
.server_cont li>div{
  height: 80%;
  position: relative;
}
.server_cont li>div i{
  display: block;
  position: absolute;
  top:88.4%;
  left:50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
  border-left:10px solid transparent;
  border-right:10px solid transparent;
  border-top:10px solid #fff;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.server_cont li:hover>div i {
  border-top:10px solid #8dd448;
}
.server_cont li>div b{
  width: 100%;
  height: 88.4%;
  text-align: center;
  border-radius: 20px;
  background: #fff;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.server_cont li:hover>div b{
  background: #8dd448;
}
.server_cont li>div b span{
  font-size: 24px;
  color: #344f94;
  font-style: italic;
  font-weight: bold;
  text-transform: uppercase;
  position: absolute;
  bottom: 0;
  text-align: center;
  width: 100%;
  line-height: 78px;
  left: 0;
}
.server_cont li>div b img{
  width: 100%;
}
.server_cont li>p{
  height: 20%;
  width: 100%;
  display:flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.server_cont li>p:before{
  display: block;
  content: '';
  position: absolute;
  top:-8px;
  width: 16px;
  height: 16px;
  background: url("../images/step.png") no-repeat center;
  background-size:100%;
  left:50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
.server_cont li>p span{
  font-size: 20px;
  text-align: center;
  color: #fff;
  width: 63%;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}



/*news*/
.news{
  background:#dfe2e9 url("../images/newsbg.jpg") no-repeat center;
  background-size:cover;
 
}
.news .warpper{
  display:flex;
  align-items: center;
  flex-wrap: wrap;
  height: 100%;
  margin-top: 45px;
}
.newscont{
  width:100%;
}
.news_top>.title{
  float:left;
}
.news_top>a{
  float:right;
  margin-top: 43px;
}
.news_bom{
  position: relative;
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding:0 7%;
}
.swipernews{
  margin-top: 4vh;
  width: 100%;
  height: 64vh;
}
.swipernews .swiper-slide{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-bottom: 7px;
}
.swipernews .swiper-slide a{
  display: block;
  width:100%;
  height: 100%;
  border-radius:20px;
  background: #fff;
  overflow: hidden;
  box-shadow: 0 5px 5px #e4e4e4;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.swipernews .swiper-slide a:hover{
  box-shadow: 0 5px 5px #ddd;
}
.swipernews .swiper-slide a>b{
  width:100%;
  height: 51.7%;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.swipernews .swiper-slide a:hover>b{
  height: 38.4%;
}
.swipernews .swiper-slide a>b img{
  max-width:120%;
  min-height: 100% ;
}
.news_text{
  height: 27.1%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding:7%;
  padding-bottom: 0;
  border-bottom: 1px solid #eeeeee;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.swipernews .swiper-slide a:hover .news_text{
  height: 50.4%;
}
.news_text>div>p{
  background: url("../images/dateicon.png") no-repeat left center;
  padding-left:36px;
  font-size: 18px;
  color: #6a7176;
  float:left;
}
.news_text>div>p>span{
  font-size: 30px;
  color: #40434a;
}
.news_text>div>small{
  float:right;
  font-size: 16px;
  margin-top: 13px;
  color: #29538a;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.swipernews  a:hover .news_text>div>small{  color: #8dd448;}

.news_text>p{
  font-size: 20px;
  color: #40434a;
  line-height: 30px;
  margin-top: 2vh;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.news_text>small{
  font-size: 16px;
  color: #808487;
  opacity: 0;
  height: 0;
  overflow: hidden;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.news_more{
  text-align: center;
  width: 100%;
  height: 11.2%;
  display:flex;
  align-items: center;
  justify-content: center;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
  position: relative;
  overflow: hidden;
}
.news_more:before{
  content: '';
  position: absolute;
  height: 100%;
  width: 100%;
  bottom: 100%;
  left: 0;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
  background: #a7e56b;
}
.news_more:after{
  content: '';
  position: absolute;
  height: 100%;
  width: 100%;
  bottom: 100%;
  left: 0;
  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  -webkit-transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
  transition-timing-function: cubic-bezier(0.75, 0, 0.125, 1);
  background: #8dd448;
  transform-origin: 100%;
}

.swipernews a:hover .news_more:before{
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
}
.swipernews a:hover .news_more:after{
  -webkit-transform: translate3d(0, 100%, 0);
  transform: translate3d(0, 100%, 0);
  -webkit-transition-delay: 0.175s;
  transition-delay: 0.175s;
  transform-origin: 0%;
}
.news_more i{
  position: relative;
  display:inline-block;
  background: url("../images/morejt.png") no-repeat right center;
  padding-right:27px;
  color: #29538a;
  font-size: 16px;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
  z-index: 10;
}
.swipernews a:hover .news_text>small{
  height: initial;
  opacity: 1;
}
.swipernews a:hover .news_more i{
  color: #fff;
  background: url("../images/morejts.png") no-repeat right center;
}

.news_bom>.swiper-button-next,.news_bom>.swiper-button-prev{
  background: #fff;
  border-radius: 50%;
  width: 60px;
  height: 60px;
  opacity: 1;
  box-shadow: 0 0 5px #ddd;
    -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.news_bom>.swiper-button-next:after,.news_bom>.swiper-button-prev:after{
  font-size: 18px;
  color: #bcbdbf;
  font-weight: bold;
    -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
.news_bom>.swiper-button-next:hover,.news_bom>.swiper-button-prev:hover{
  background: #8dd448;
}
.news_bom>.swiper-button-next:hover:after,.news_bom>.swiper-button-prev:hover:after{
  color: #fff;
}

/*indexform*/
.indexform{
  background: url("../images/msgbg.jpg") no-repeat center;
  display:flex;
  justify-content: center;
  align-items: center;
}
.form_left>form,.form_right>div{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding:25px;
  background: rgba(255, 255, 255, 0.1);
  border:1px solid #fff;
  border-radius: 20px;
}
.form_cont{
  margin-top: 7vh;
}
.form_cont>div>p{
  color: #fff;
  font-size: 18px;
  font-weight: lighter;
  margin-bottom: 2vh;
}
.form_left{
  float:left;
  width: 47%;
}
.form_right{
  float:right;
  width: 47%;
}
#indexform>div:after{
  display: block;
  content: '';
  clear: both;
}
#indexform>div{
  float:left;
  width: 49%;
}
#indexform>div:nth-of-type(2){
  float:right;
}
#indexform>div label{
  float:left;
  color: #fff;
  line-height: 38px;
  font-size: 16px;
  font-weight: lighter;
  width: 80px;
  text-align: right;
}
#indexform>div input,.index_textarea>textarea{
  float:left;
  width:calc(100% - 80px);
  line-height: 38px;
  background: rgba(255, 255, 255, 0.1);
  border:1px solid #fff;
  font-size: 16px;
  color: #fff;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  padding-left:2%;
}
#indexform .index_textarea label,#indexform>div.code label{
  width: 80px;
}
#indexform .index_textarea{
  margin-top: 16px;
  margin-bottom: 16px;
  width: 100%;
}
#indexform .index_textarea textarea{
  width: calc(100% - 80px);
  height: 161px;
}
#indexform>div.code{
  width: 100%;
}
#indexform>div.code input{
  width: 34.8%;
  margin-right: 2.5%;
}
#indexform .code .verify{
  float:left;
  width: 23%;
  background:#f3fbfe;
  height: 40px;
  overflow: hidden;
}
#indexform .code .verify img{
  width: 100%;
  height: 100%;
}
#indexform .code span{
  font-size: 14px;
  font-weight: lighter;
  color: #fff;
  line-height: 40px;
  margin-left:2.5%;
  float:left;
  cursor: pointer;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
#indexform .code span:hover{
  text-decoration: underline;
}
#indexform .indexsub{
  width: 100%;
  margin-top:3%;
}
#indexform .indexsub a{
  float:left;
  font-size: 14px;
  font-weight: lighter;
  color: #325192;
  text-align: center;
  width:23%;
  margin-right: 2%;
  background: #fff;
  line-height: 38px;
  margin-left:80px;
  border:1px solid #fff;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
#indexform .indexsub input{
  color: #fff;
  width:23%;
  font-size: 14px;
  font-weight: lighter;
  background:none;
  padding-left: 0;
  -webkit-transition: 350ms 0s all ease;
  -moz-transition: 350ms 0s all ease;
  -ms-transition: 350ms 0s all ease;
  -o-transition: 350ms 0s all ease;
  transition: 350ms 0s all ease;
}
#indexform .indexsub input:hover,#indexform .indexsub a:hover{
  background: #8dd448;
  border:1px solid #8dd448;
  color: #fff;
}
.form_right>div>p{
  color: #fff;
  font-size: 16px;
  margin-bottom: 16px;
  font-weight: lighter;
  float:left;
  width: 50%;
}
.form_right>div>p:nth-of-type(3){
  width: 100%;
}
.form_right>div>p span{
  font-weight: bold;
}
#indexmap{
  border-radius: 10px;
  margin-left:13.25%;
  width: 86%;
  height: 254px;
  float:left;
}



























.pro-sider {
  float: left;
  width: 260px;
}
.pro-sider .in-title {
  height: 80px;
  background: url(../images/i-pro-title.jpg) no-repeat center;
  text-align: center;
  line-height: 1;
  overflow: hidden;
}
.pro-sider .in-title h3 {
  margin-top: 20px;
  font-size: 22px;
  color: #fff;
  margin-bottom: 5px;
}
.pro-sider .in-title em {
  font-size: 13px;
  color: #728dbc;
}
.pro-sider .pro-sider-ul {
  border: 1px solid #ededed;
  background: #fff;
  border-top: none;
  overflow: hidden;
}
.pro-sider .pro-sider-ul .ul-li {
  padding: 0 15px;
  height: 59px;
}
.pro-sider .pro-sider-ul .ul-li a {
  position: relative;
  height: 58px;
  line-height: 58px;
  font-size: 14px;
  color: #595959;
  display: block;
  padding-left: 10px;
  padding-right: 30px;
  border-bottom: 1px dashed #ededed;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pro-sider .pro-sider-ul .ul-li a h2{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pro-sider .pro-sider-ul .ul-li a div.icon {
  position: absolute;
  width: 16px;
  height: 16px;
  text-align: center;
  line-height: 16px;
  background: #ededed url(../images/sider-bg-01.png) no-repeat center;
  border-radius: 50%;
  right: 8px;
  top: 50%;
  margin-top: -8px;
  font-size: 12px;
}
.pro-sider .pro-sider-ul .ul-li:hover,
.pro-sider .pro-sider-ul .ul-li.active {
  background: #268ae7;
}
.pro-sider .pro-sider-ul .ul-li:hover a,
.pro-sider .pro-sider-ul .ul-li.active a {
  border: none;
  color: #fff;
}
.pro-sider .pro-sider-ul .ul-li:hover div.icon,
.pro-sider .pro-sider-ul .ul-li.active div.icon {
  background: #0058b1 url(../images/sider-bg-02.png) no-repeat center;
}
.pro-sider .pro-sider-ul .ul-li:last-child a {
  border-bottom: none;
}
.pro-sider .pro-sider-tel {
  overflow: hidden;
  height: 100px;
  line-height: 1;
  font-size: 20px;
  color: #0058b1;
  border: 1px solid #ededed;
  border-top: none;
  padding-left: 80px;
  background: url(../images/sider-tel.png) no-repeat 25px center;
}
.pro-sider .pro-sider-tel span {
  display: block;
  margin: 30px 0 8px;
  font-size: 14px;
  color: #808080;
}
.pro-sider .pro-sider-tel em {
  letter-spacing: 2px;
  font-weight: bold;
}


.m-column-t {
  position: relative;
  text-align: center;
  font-size: 0;
}
.m-column-t .center {
  display: inline-block;
  font-size: 0;
}
.m-column-t .center h3 {
  color: #333;
  font-size: 30px;
}
.m-column-t .center p {
  color: #d2d2d2;
  font-size: 30px;
}
.m-column-t span {
  position: absolute;
  width: 415px;
  top: 50%;
  margin-top: -5px;
  height: 5px;
  border-bottom: 1px solid #d2d2d2;
  z-index: 1;
}
.m-column-t span.mcl {
  left: 0;
}
.m-column-t span.mcl em {
  float: right;
}
.m-column-t span.mcr {
  right: 0;
}
.m-column-t span em {
  display: block;
  height: 11px;
  border-left: 1px solid #d2d2d2;
}
.textLine {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.textLine3 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.textHidden {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.domHidden {
  overflow: hidden;
}
.about-main {
  padding: 20px 0 70px;
  min-height: 170px;
}
.about-main .ab-content {
  float: right;
  width: 925px;
}
.about-main .ab-content .title {
  line-height: 50px;
}
.about-main .ab-content .title a {
  color: #333;
  padding: 0 5px;
}
.about-main .ab-content .title span.icon-home {
  color: #535353;
}
.about-main .ab-content .title em {
  color: #999;
}
.about-main .ab-content .ab-conBox {
  overflow: hidden;
  background: #fff;
  min-height: 55px;
  padding: 30px 45px 40px;
}
.about-main .ab-content .ab-conBox .de-title {
  text-align: center;
  font-size: 20px;
  color: #333;
  line-height: 25px;
  margin-bottom: 8px;
}

.pro-center {
  background: #fff;
  padding-bottom: 25px;
}
.pro-center .pro-list {
  overflow: hidden;
  padding: 25px 18px 10px;
}
.pro-center .pro-list ul li {
  float: left;
  width: 200px;
  margin: 0 10px 20px;
  border: 1px solid #fff;
}
.pro-center .pro-list ul li:hover {
  border-color: #f3c04b;
}
.pro-center .pro-list ul li .img {
  overflow: hidden;
  width: 200px;
  height: 200px;
  line-height: 200px;
  text-align: center;
  font-size: 0;
  background: #eee;
}
.pro-center .pro-list ul li .img img {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
}
.pro-center .pro-list ul li .title {
  background: #f7f8fc;
  height: 40px;
  line-height: 40px;
  padding: 0 5px;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  color: #333;
}
.pro-center .pro-list ul li .title:hover {
  color: #f3c04b;
}
.page {
  font-size: 0;
  text-align: center;
}
.page .center {
  display: inline-block;
  overflow: hidden;
}
.page .center .page-span {
  float: left;
  font-size: 14px;
  color: #c3c3c3;
  line-height: 32px;
  margin-right: 30px;
}
.page .center .page-list {
  float: left;
  overflow: hidden;
}
.page .center .page-list ul li {
  float: left;
  width: auto;
  min-width: 30px;
  height: 32px;
  text-align: center;
  line-height: 30px;
  font-size: 14px;
  margin: 0 4px;
  padding: 0;
  border: none;
  background: transparent;
}
.page .center .page-list ul li a {
  min-width: 20px;
  padding: 0 5px;
  border: 1px solid #eee;
  display: block;
  color: #333;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.page .center .page-list ul li:hover a {
  color: #f3c04b;
}
.page .center .page-list ul li.active a {
  background: #f3c04b;
  color: #fff;
}
.news-center {
  background: #fff;
  padding-bottom: 25px;
}
.news-center .new-list {
  padding: 45px 45px 0px;
}
.news-center .new-list ul li {
  margin-bottom: 35px;
  border-bottom: 1px solid #eee;
}
.news-center .new-list ul li a {
  overflow: hidden;
  display: block;
  height: 90px;
  padding-bottom: 30px;
}
.news-center .new-list ul li a .img {
  float: left;
  width: 130px;
  height: 90px;
  background: #eee;
  line-height: 90px;
  font-size: 0;
  text-align: center;
}
.news-center .new-list ul li a .img img {
  display: inline-block;
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
}
.news-center .new-list ul li a .info {
  float: right;
  width: 690px;
}
.news-center .new-list ul li a .info h3 {
  font-size: 14px;
  font-weight: bold;
  line-height: 24px;
  color: #333;
}
.news-center .new-list ul li a .info em {
  display: block;
  font-size: 12px;
  color: #999;
  line-height: 16px;
  margin-bottom: 10px;
}
.news-center .new-list ul li a .info p {
  font-size: 14px;
  line-height: 22px;
  color: #999;
  max-height: 44px;
  overflow: hidden;
}
.news-center .new-list ul li a:hover h3 {
  color: #f3c04b;
}
.message-c {
  background: #fff;
  padding: 40px 50px;
  overflow: hidden;
}
.message-c .p {
  font-size: 16px;
  line-height: 30px;
  color: #666;
  margin-bottom: 35px;
}
.message-c .from input {
  display: block;
  height: 38px;
  line-height: 38px;
  padding: 0 5px;
  border: 1px solid #d2d2d2;
  margin-bottom: 10px;
  font-size: 14px;
  color: #333;
}
.message-c .from input[name=user],
.message-c .from input[name=phone] {
  width: 348px;
}
.message-c .from textarea {
  font-size: 14px;
  color: #333;
  line-height: 20px;
  display: block;
  width: 728px;
  height: 130px;
  border: 1px solid #d2d2d2;
  padding: 5px;
  margin-bottom: 10px;
}
.message-c .from .code {
  overflow: hidden;
}
.message-c .from .code input[name=code] {
  width: 258px;
  float: left;
}
.message-c .from .code a {
  display: block;
  float: left;
  width: 80px;
  height: 38px;
  padding: 1px 0;
  margin-left: 10px;
}
.message-c .from .code a img {
  width: 80px;
  height: 38px;
}
.message-c .from .btn {
  padding-top: 25px;
}
.message-c .from .btn a {
  display: block;
  width: 362px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  color: #fff;
  font-size: 16px;
  background: #8fa4de;
}
.message-c .from .btn a:hover {
  background: #8397d0;
}
.contact-o {
  background: #fff;
  overflow: hidden;
  padding: 40px 0;
  text-align: center;
}
.contact-o iframe {
  width: 830px;
  height: 500px;
  margin: 0 auto;
}

