html,body{
  width:100%;height:100%;
}
.imgSize{
  width:258px;
  height:154px;
}
.box{
  width:100%;
  height:100%;
}
.header {
  position: relative;
  width: 100%;
  height:100%;
}
.outImg{
  width:100%;
  height:100%;
  background: url("../image/index/公司背景图.png");
  background-size: 100% 100%;
}
.outImg1{
  width:100%;
  height:100%;
  background: url("../image/index/banner.jpg");
  background-size: 100% 100%;
}
.outImg2{
  width:100%;
  height:100%;
  background: url("../image/index/banner2.jpg");
  background-size: 100% 100%;
}
.outImg3{

  
  width:100%;
  height:100%;
  background: url("../image/index/banner3.jpg");
  background-size: 100% 100%;
}
.outImg4{
  width:100%;
  height:100%;
  background: url("../image/index/banner4.jpg");
  background-size: 100% 100%;
}
.headertitle {
 
  position: absolute;
  width: 100%;
  height: 50px;
  color: #fff;
  font-size:16px;
  top: 0px;
  display: flex;
  justify-content: space-between;
}

.titleLeft {
  width: 33%;
  height: 50px;
  padding-left:50px;
  line-height: 50px;
  font-size: 16px;
}

.titleRight {
  width: 50%;
  height: 50px;
  line-height: 50px;
}
.navNameLi:hover .navName{
  color: #fff;
  font-weight: 800;
  
}
.navName:hover .nextBox{
  display: block;
}
.nextBox{

  /* padding: 5px; */
  /* margin-left: -10px; */
  /* margin-top: -10px; */
  font-weight: normal;
  font-size: 14px;
  color: #000;
  /* padding: 0 50px; */
  /* width: 130px; */
  /* height: 100px; */
  display: none;
  background: #fff;
  margin: 0 auto;
  /* margin-left: -15px; */
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  border-radius: 0 0 6px 6px;
}
.nextBox ul li {
  /* width: 130px; */
  height: 40px;
  line-height: 40px;
}
/* a:hover{
  color: #fff;
} */
.nextBox ul li:hover{
  /* width: 100%; */
  color: #fff;
  background-color: #c22222;
}
.nextBox ul li a:hover{
  /* width: 100%; */
  color: #fff;
  /* background-color: #c22222; */
}
.headerUl {
  list-style: none;
  width: 100%;
  height: 50px;
  line-height: 50px;
  padding: 0;
  margin: 0;
}
/* 
/* .headerUl a:hover {
  color:red;
} */ 
 .headerUl a:hover {
  color:#c22222;
} 

.headerUl>li {
  float: left;
  width: 14%;
  text-align: center;
}

.nav {
  width: 100%;
  height: 50px;
  background: #F7F7F7
}

.navbody {
  font-size: 16px;
  width: 72%;
  margin: 0 auto;
  height: 50px;
  line-height: 50px;
  display: flex;
  justify-content: space-between;
}

.navUl {
  
 
  list-style: none;
  /* width: 70%; */
  height: 50px;
  line-height: 50px;
  padding: 0;
  margin: 0;
}

.navUl li {
  font-size: 14px;
  float: left;
  margin-left: 10px;
  /* width: 30%; */
  /* text-align: center; */
}
.searcIcon{
  position: absolute;
  top: 30%;
  right: 3%;
  width:18px;
  height:18px;
  background: url("../image/index/search.png");
  background-size: 100% 100%;
}


/***************************************/



.kf {
  transition: .8s;
  z-index: 999999;
  background-color: transparent;
  position: fixed;
  top: 20%;
  right:5px;
  width: 50px;
  border-radius: 5px
}

.kf span {
  z-index: 1000001;
  transition: .5s;
  cursor: pointer;
  position: relative;
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 5px 0 0 5px;
  margin-bottom: 3px
}

.kf span:hover {
  background-color: #C22222;
}

.kf .zx {
  background-position: 0 0;
  background: #a7afb9 url(../image/kefu-zx.png)no-repeat center top 12px
}

.kf .back_top {
  border: none;
  background: #a7afb9 url(../image/kf-top.png)no-repeat center top 13px
}

.kf span a {
  transition: .5s;
  display: block;
  color: #fff;
  line-height: 24px;
  font-size: 14px;
  text-align: center;
  padding-top: 22px
}

.kfimgr {
  position: absolute;
  bottom: 23px;
  right: -9px
}

.kf span div i {
  display: block;
  position: absolute;
  width: 15px;
  height: 200px;
  right: -15px;
  top: 0
}

.kf .freetel {
  background: #a7afb9 url(../image/kefu_qq.png)no-repeat center
}

.kf .zxlya {
  background: #a7afb9 url(../image/kf-wx_03.png)no-repeat center
}

.kf span:nth-child(4) div {
  white-space: nowrap
}

.kf a {
  display: block;
  height: 68px;
  position: absolute;
  top: 0;
  right: 0;
  width: 100%
}

.nav_center div,
.index_nav_center div,
.shou,
.zhan {
  -webkit-box-shadow: 0 2px 18px rgba(0, 0, 0, 0.25);
  box-shadow: 0 2px 18px rgba(0, 0, 0, 0.25)
}

.kf .zxlya .erweima {
  display: none;
  right: 62px;
  position: absolute;
  top: -105px;
  width:130px;
  background: #fff;
  padding: 5px;
  text-align: center;
  box-shadow: 0 2px 13px rgba(0, 0, 0, 0.25);
  border-radius: 5px
}

.kf .zxzx {
  display: none;
  right: 86px;
  position: absolute;
  top: 6px;
  background: #fff;
  padding: 10px 20px;
  text-align: center;
  box-shadow: 0 2px 13px rgba(0, 0, 0, 0.25);
  border-radius: 5px;
  width: 110px;
  font-size: 14px;
  color: #333
}

.kfimgr {
  position: absolute;
  bottom: 23px;
  right: -9px
}

.kf-ly {
  background: #a7afb9 url(../image/kf-ly_03.png)no-repeat center
}

.shou {
  z-index: 1000000;
  cursor: pointer;
  width: 30px;
  height: 40px;
  top: 47%;
  margin-top: -15px;
  border-radius: 5px 0 0 5px;
  right: 62px;
  background: transparent url(../image/zk1.png)no-repeat center left;
  position: absolute;
  box-shadow: none
}

.shou:hover {
  background: transparent url(../image/zk.png)no-repeat center left
}

.kf-phone {
  background: #a7afb9 url(../image/kf-phone1.png)no-repeat center
}

.kf-phone1,
.zxwb {
  display: none;
  font-size: 15px;
  color: #333;
  background-color: #fff;
  position: absolute;
  right: 60px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
  padding: 10px 12px;
  background: #fff;
  border-radius: 5px;
  white-space: nowrap
}

.kf-phone1 .kfimgr,
.zxwb .kfimgr {
  bottom: 10px
}

.kf-shqi {
  width: 100%;
  height: 40px
}

.kf-shqi .m-icon {
  display: block;
  margin: 0 auto;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: #a7afb9 url(../image/kf-close.png) no-repeat center;
  background-size: 15px;
  cursor: pointer;
  transform: rotate(45deg);
  transition: all 0.3s
}

.kf-shqi .m-icon:hover {
  background-color: #C22222
}

.kf.show .m-icon {
  transform: rotate(0)
}