.wrap{background: #f8f8f8;}
.wrap > .wrap{padding-top: 0;}
.banner{height: 39.48vw; width: 100%;}
.banner .swiper-slide{background-repeat: no-repeat; background-position: center; background-size: cover;}
.swiper-container,
.swiper-wrapper,
.swiper-slide{height: 100%;}
.banner-swiper-pag .swiper-pagination-bullet{background: #fff; width: 18px; height: 18px; border: 2px solid #FFFFFF; border-radius: 4px;}
.banner-swiper-pag .swiper-pagination-bullet-active{background: #f7f7f7 !important;}
.wrap-item1,
.wrap-item2,
.wrap-item3{width: 1200px; margin: 60px auto;}
.wrap-title{width: 100%; height: auto; margin-bottom: 40px;}
.wrap-title h5{font-size: 22px; color: #000000; text-align: center; margin-bottom: 15px;}
.wrap-title hr{width: 60px; height: 6px; background: #fe433f; margin: 0 auto; border: none;}
.item1-ul{width: 100%; height: auto;}
.item1-ul li{width: calc((100% - 42px) / 4); height: 470px; float: left; margin-right: 14px; margin-bottom: 14px; background: #FFF; box-shadow: 0 0 10px #CCCCCC; padding: 46px 20px 0; position: relative;}
.item1-ul li:nth-of-type(4n){margin-right: 0;}
.item1-ul li i{font-size: 32px; color: #ff1106; display: block; position: absolute; left: 0; top: 0;}
.item1-ul li img{width: 100%; min-height: 180px; display: block;}
.item1-ul li p{font-size: 14px; line-height: 20px; width: 100%; margin-top: 20px;display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.item1-ul li .category{display: none;}
.dea > a{color: #666666;}
.price{color: #ff1106;}
.item1-ul li > a:last-of-type{display: block; margin-top: 30px; font-size: 14px; color: #2b85e4;}
.item2-ul{width: 100%; height: auto;}
.item2-ul li{width: calc((100% - 42px) / 4); height: 300px; float: left; margin-right: 14px; margin-bottom: 50px;}
.item2-ul li:nth-of-type(4n){margin-right: 0;}
.item2-ul li > div{width: 100%; height: 234px; padding: 26px; background: #fff; position: relative;}
.item2-ul li > div:hover .layer-red{display: block;}
.layer-red{width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: rgba(255, 100, 100, 0.8); display: none;}
.layer-red a{display: block; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff;}
.layer-red a i{font-size: 42px; cursor: pointer;}
.item2-ul li div img,
.item2-ul li p{padding-top: 20px; width: 90%; margin: 0 auto; text-align: center; font-size: 14px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;}
.item2-ul li p > a{color: #000;}
.item3-ul{width: 100%; height: auto;}
.item3-ul li{width: calc((100% - 120px) / 4); height: 80px; float: left; margin-right: 40px; margin-bottom: 18px;}
.item3-ul li:nth-of-type(4n){margin-right: 0;}
.item3-ul li img{width: 100%; height: 100%;}
.item3-ul .swiper-wrapper{flex-wrap: wrap;}
.item3-ul .swiper-slide img{display: block;width: 100%;height: auto;}
.item3-ul .swiper-slide{display:-webkit-box;display:-ms-flexbox;display:-webkit-flex;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;align-items:center;width: 25%;}

.pag{display: none;width: 180px; height: 40px; margin: 30px auto;}
.pag a{text-align: center; line-height: 40px; width: 50%; height: 100%; display: block; float: left; color: #da251d; font-size: 24px;border: 1px solid #da251d;}
.pag a:hover{color: #fff; background: #da251d;}
.pag a.swiper-button-disabled{opacity: .5;}


/*移动端*/
@media only screen and (max-width: 1024px){

  .main > .wrap{padding-top: 4rem;}
  .banner-swiper-pag .swiper-pagination-bullet{background: #fff;width: 1rem;height: 1rem;border: 2px solid #FFFFFF;border-radius: 4px;}
  .wrap-item1, .wrap-item2, .wrap-item3{width: 95%;margin: 2rem auto;}
  .item1-ul li{width: calc((100% - 1.2rem) / 3);height: auto;margin-right: .6rem;margin-bottom: .6rem;padding: 1rem .5rem;}
  .item1-ul li:nth-of-type(3n){margin-right: 0;}
  .item1-ul li:nth-of-type(4n){margin-right: .6rem;}
  .item1-ul li i{font-size: 1rem;}
  .item1-ul li img{min-height: auto;}
  .item1-ul li p{font-size: .625rem;line-height: 1rem;width: 100%;margin-top: .5rem;text-align: center;}
  .item1-ul li p.dea{height: 3rem;}
  /*.item1-ul li > a:last-of-type{ display: none;}*/
  .wrap-title{margin-bottom: 2rem;}
  .wrap-title h5{font-size: 1rem;margin-bottom: .6rem;}
  .wrap-title hr{width: 3rem;height: .2rem;}
  .item2-ul li{width: calc((100% - 1.2rem) / 3);height: auto;float: left;margin-right: .6rem;margin-bottom: 1.8rem;overflow: hidden;}
  .item2-ul li:nth-of-type(4n){margin-right: .6rem;}
  .item2-ul li:nth-of-type(3n){margin-right: 0;}
  .item2-ul li > div{width: 100%;height: auto;padding: 1rem;background: #fff;position: relative;}
  .item2-ul li p{padding-top: 0;width: 90%;margin: 0 auto;text-align: center;font-size: .625rem;line-height: 1rem;height: 3rem;}
  .item3-ul li{width: calc((100% - .5rem) / 2);height: auto;float: left;margin-right: .5rem;margin-bottom: 1rem;}
  .item3-ul li:nth-of-type(2n){margin-right: 0;}
  .pag{width: 8rem;height: 2.5rem;/*border: 1px solid #da251d;*/margin: 2rem auto;}
  .pag a{text-align: center;line-height: 2.5rem;font-size: 1.5rem;}

}

@media only screen and (max-width: 768px){


  .item1-ul li > a:last-of-type{margin-top: 0;}


}



/*移动端*/
@media only screen and (max-width: 750px){

  .main > .wrap{padding-top: 3rem;}

  .banner-swiper-pag .swiper-pagination-bullet{width: .5rem;height: .5rem;}

  .item1-ul li{width: calc((100% - .5rem) / 2);margin-right: .5rem;margin-bottom: .5rem;}
  .item1-ul li:nth-of-type(3n){margin-right: .5rem;}
  .item1-ul li:nth-of-type(4n){margin-right: .5rem;}
  .item1-ul li:nth-of-type(2n){margin-right: 0rem;}
  .item2-ul li{width: calc((100% - .5rem) / 2);margin-right: .5rem;margin-bottom: 1.5rem;}
  .item2-ul li:nth-of-type(4n){margin-right: .5rem;}
  .item2-ul li:nth-of-type(2n){margin-right: 0;}

  .item3-ul .swiper-slide{width: 50%;}
}