.section{
  width: 100%;
  background: #F6F6F6;
  overflow: hidden;
}
.section .warp{
  width: 1386px;
  margin: 166px auto 75px;
  background: #FFFFFF;
  padding-bottom: 90px;
}
.section .warp .title{
  display: flex;

}
.section .warp .title .images{
  width: 673px;
  height: 491px;
  overflow: hidden;
  cursor: pointer;
}
.section .warp .title .images img{
  width: 100%;
  height: 100%;
  transition: 5s;
}
.section .warp .title .images img:hover{
  transform: scale(1.1);
}
.section .warp .title .introduce{
  width: 564px;
  margin: 45px 0 0 63px;
}
.section .warp .title .introduce span{
  font-size: 26px;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #323232;
}
.section .warp .title .introduce .line{
  display: flex;
  margin: 23px 0 36px -63px;
}
.section .warp .title .introduce .line div:first-child{
  width: 99px;
  height: 2px;
  background: #C42F2F;
  margin-right: 3px;
}
.section .warp .title .introduce table{
    max-width: 100%;
    display: block;
}
.section .warp .title .introduce tbody{
    max-width: 100%;
    display: block;
}
.section .warp .title .introduce .line div:last-child{
  width: 5px;
  height: 2px;
  background: #C42F2F;
}
.section .warp .title .introduce p{
  font-size: 14px;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #323232;
  line-height: 28px;
}
.section .warp .title .introduce p img{
    max-width: 100%;
}
.section .warp .content{
  width: 1235px;
  margin: 81px auto 0;
}
.section .warp .content p{
  font-size: 14px;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #323232;
  line-height: 28px;
}
.section .warp .content h1{
  color: #212121;
  font-size: 18px;
  margin-bottom: 10px;
}

@media screen and (max-width: 1856px) {
  .section .warp{
    width: 90%;
  }
  .section .warp .content{
    width: 90%;
  }
}

@media screen and (max-width: 1510px) {
  .section .warp .title .introduce {

        margin: 45px 60px 0 60px;
    }
}
.section .warp .title .introduce p img{
   
        height: auto;
    }
@media screen and (max-width: 1024px) {
    .section .warp .title .introduce p img{
   
        height: auto;
    }
    .section .warp .title .introduce table td img{
        width: 120px;
        height: auto;
    }
  .section .warp{
    width: 90%;
    margin: 84px auto 20px;
    background: transparent;
  }
  .section .warp .title{
    flex-direction: column;
  }
  .section .warp .title .images{
    width: 100%;
    height: auto;
  }
  .section .warp .title .introduce .line{
    display: none;
  }
  .section .warp .title .introduce{
    width: 100%;
    margin: 25px 0 0 0;
  }
  .section .warp .title .introduce span{
    font-size: 28px;
    font-weight: bold;
    margin: 0 0 15px 0;
    display: block;
  }
  .section .warp .title .introduce p{
    font-size: 12px;
  }
  .section .warp .content{
    width: 100%;
    margin: 20px 0 0 0;
  }
  .section .warp .content p{
    font-size: 12px;
  }
  .section .warp{
      padding-bottom: 10px;
  }
  .section .warp .content table img{
      max-width: 150px;
      height: auto;
      width: 90%;
      margin: auto;
  }
}