.proContent {
  width: 80%;
  padding: 80px 10%;
  position: relative;
  height: 600px;
}

.ba1{
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    /*display: none;*/
}


.ba1 img{
    width: 100%;
    object-fit: cover;
}

.proContent>img {
  height: 100%;
  width: 100%;
}

.product {
  width: 70%;
  height: 500px;
  padding: 50px 5%;
  position: absolute;
  top: 80px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  z-index: 22;
}

.product>li {
  width: 200px;
  display: flex;
  align-items: center;
}

.product>li>a {
  display: flex;
  align-items: center;
}



.product>li:hover .yuan {
  background: #0015ff;
}


.product>li:hover .yuan::after {
  content: "";
  position: absolute;
  top: -8px;
  width: 86px;
  height: 86px;
  background: #0015ff2a;
  z-index: -1;
  border-radius: 100px;
}


.product>li:hover .tuyu {
  background: #ffffff;
  color: black;
}

.yuan {
  width: 70px;
  height: 70px;
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #414e64;
  z-index: 10;
  transition: all 0.6s;
  position: relative;
}

.tuyu {
  width: 130px;
  height: 45px;
  border-radius: 50px;
  background: #6b778c;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: -30px;
  z-index: 5;
  font-size: 15px;
  color: white;
  transition: all 0.6s;
  position: relative;
  padding-left: 10px;
}

.introduce {
  width: 44%;
  padding: 25px 3%;
  background: #0015ff;
  position: absolute;
  right: 0;
  bottom: 0;
  display: none;
  align-items: center;
  color: white;
}

.introduce .fontS13 {
  margin-top: 10px;
  line-height: 25px;
}

.introduce>a {
  width: 180px;
  border-radius: 3px;
  font-size: 14px;
  /*margin-left: 3%;*/
  margin-top: 20px;
  display: flex;
  height: 40px;
  align-items: center;
  justify-content: center;
  background: #f97111;
}

.proContend {
  width: 0;
  height: 0;
  overflow: hidden;
}

.proContendShow {
  width: 100%;
  height: 600px;
}

.proContend {
  width: 80%;
  padding: 0 10%;
}

.nieironga {
  width: 80%;
  height: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.neileft {
  width: 40%;
}

.neileft>.fontS14 {
  margin-top: 40px;
  color: #999999;
  line-height: 30px;
}


.neright {
  width: 50%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.neright>img {
  width: 50%;
}


@media (max-width: 1200px) {
  .proContent {
    overflow: hidden;
    height: 680px;
    margin-left: 10%;
    padding: 80px 0 !important;
  }
  .product {
    width: 90%;
    height: 600px !important;
    justify-content: flex-start;
  }

  .proContent>img {
    width: auto !important;
  }
  .introduce {
    width:94%;
    display: flex;
    flex-wrap: wrap;
  }
  .rightCe{
     width:100%;
  }
  .introduce>a{
      margin-top: 20px;
  }
  .product>li{
    margin-bottom: 20px;
  }
}


@media (max-width: 1000px) {
  .nieironga{
    flex-wrap: wrap;
  }
  .neileft{
    width: 100%;
  }
  .neright{
    width: 100%;
    height: 300px;
  }
  .navdao{
    top: -100px;
  }
}

@media (max-width: 800px) {
  .navigation{
    height: auto !important;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .navigation>li{
    height: 50px !important;
  }
}