.row-a1 {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 50px 0;
}

.row-a1 .text {
  width: 49%;
}

.row-a1 .text .title {
  font-size: 24px;
  font-weight: 700;
  position: relative;
  z-index: 3;
  margin-bottom: 15px;
}

.row-a1 .text .title::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 90px;
  height: 7px;
  z-index: -1;
  background: #6be8de;
  content: "";
  display: block;
}

.row-a1 .text .desc p {
  line-height: 24px;
  margin-bottom: 15px;
}


.row-a1 .pic {
  width: 49%;
  overflow: hidden;
}
.row-a1 .pic:hover img{
  transform: scale(1.05);
  transition: all .3s;
}
.row-a2{
  padding: 50px 0;
  background: url("../images/pic018.png") center;
}
.row-a2 .con{
  flex-direction: row;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.row-a2 .text {
  width: 49%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-around;
}
.row-a2 .pic{
  overflow: hidden;
  width: 49%;
} 
.row-a2 .pic:hover img{
  transform: scale(1.05);
  transition: all .3s;
}
.row-a2 .text .desc{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 10px;
}
.row-a2 .text .desc .tit{
  background: url("../images/icon014.png") no-repeat center;
  line-height: 40px;
  text-align: center;
  width: 120px;color: #fff;
  font-size: 18px;
  font-weight: 700;
  position: relative;
  z-index: 20;
}
.row-a2 .text .desc .tit:hover::after{
  opacity: .6;
}
.row-a2 .text .desc .tit:hover::before{
  opacity: .8;
}
.row-a2 .text .desc .tit::before{
  content:"";
  display: block;
  background: url("../images/icon014.png") no-repeat center;
  width: 120px;
  height: 40px;
  left: 10px;
  top: 50%;
  position: absolute;
  transform: translate(0%,-50%);
  z-index: -1;
  opacity: .5;
}

.row-a2 .text .desc .tit::after{
  content:"";
  display: block;
  background: url("../images/icon014.png") no-repeat center;
  width: 120px;
  height: 40px;
  left: 20px;
  top: 50%;
  position: absolute;
  transform: translate(0%,-50%);
  z-index: -1;
  opacity: .3;
}

.row-a2 .text .desc:nth-child(2) .tit{
  background: url("../images/icon015.png") no-repeat center;
}
.row-a2 .text .desc:nth-child(2) .tit::before{
  background: url("../images/icon015.png") no-repeat center;
}
.row-a2 .text .desc:nth-child(2) .tit::after{
  background: url("../images/icon015.png") no-repeat center;
}
.row-a2 .text .desc:nth-child(3) .tit{
  background: url("../images/icon016.png") no-repeat center;
}
.row-a2 .text .desc:nth-child(3) .tit::before{
  background: url("../images/icon016.png") no-repeat center;
}
.row-a2 .text .desc:nth-child(3) .tit::after{
  background: url("../images/icon016.png") no-repeat center;
}
.row-a2 .text .desc .txt{
  margin: 20px 0;
}


@media only screen and (max-width: 959px) {
  .row-a2 .text .desc{
    margin: 0;
  }
}
@media only screen and (max-width: 769px) {
  .row-a1{
    flex-direction: column;
  }
  .row-a1 .pic{
    width: 85%;
  }
  .row-a1 .text{
    width: 85%;
    margin-bottom: 20px;
  }
  .row-a2 .con{
    flex-direction: column;
  }
  .row-a2 .con .pic{
    width: 85%;
    margin-bottom: 20px;
  }
  .row-a2 .con .text{
    width: 85%;
  }
}
@media only screen and (max-width: 500px) {
  .row-a1{
    flex-direction: column;
  }
  .row-a1 .pic{
    width: 95%;
  }
  .row-a1 .text .desc .tit:hover::after{
    opacity: .3;
  }
  .row-a1 .text .desc .tit:hover::before{
    opacity: .5;
  }
  .row-a2 .text .desc .tit:hover::after{
    opacity: .3;
  }
  .row-a2 .text .desc .tit:hover::before{
    opacity: .5;
  }
  .row-a1 .pic:hover img{
    transform: scale(1);
    transition: all .3s;
  }
  .row-a2 .pic:hover img{
    transform: scale(1);
    transition: all .3s;
  }
  .row-a1 .text{
    width: 95%;
    margin-bottom: 20px;
  }
  .row-a2 .con{
    flex-direction: column;
  }
  .row-a2 .con .pic{
    width: 95%;
    margin-bottom: 20px;
  }
  .row-a2 .con .text{
    width: 95%;
  }
}