﻿.body .section1{width:100%;height:100vh;position:relative}.body .section1 .text{position:absolute;left:5rem;top:51.7%;transform:translateY(-50%)}.body .section1 .text .title{font-size:4.5vw;text-transform:capitalize;font-family:"PingFang SC", "Calibri", "opensans", "GothicArial", "Arial", "Microsoft YaHei", "San Francisco", 'Hiragino Sans GB', "Helvetica Neue";font-weight:600}.body .section1 .text .title span{display:inline-block;position:relative}.body .section1 .text .title span::after{content:'';display:block;background:#C9FF85;position:absolute;left:0;bottom:0;height:40%;width:100%;opacity:.8;z-index:-1}.body .section1 .text .des{color:#000;font-size:1vw;font-weight:300;width:25vw;margin:1vw 0;line-height:1.6}.body .section1 .banner{width:50%;max-width:40rem;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.body .section1 .banner .bg{width:640px;height:640px;display:flex;align-items:center;justify-content:center}.body .section1 .banner .bg span{border-radius:50%;background-color:#000;width:400px;height:400px}.body .section1 .banner .bg img{width:100%;display:block}.body .section1 .banner .swiper-container{width:100%;position:absolute;left:0;width:100%;top:0;height:100%}.body .section1 .banner .swiper-container .swiper-slide .pic{transition:all 600ms;transform:translateY(60px);opacity:0}.body .section1 .banner .swiper-container .swiper-slide-active .pic{transform:translateY(0);opacity:1}.body .section1 .banner .swiper-pagination{position:absolute;left:0;top:50%;transform:translateY(-50%);width:100%;display:flex}.body .section1 .banner .swiper-pagination .swiper-pagination-bullet{width:32%;height:2px;background:rgba(255,255,255,0.2);position:relative}.body .section1 .banner .swiper-pagination .swiper-pagination-bullet::after{content:'';display:block;width:0;height:100%;height:2px;background-color:#000;position:absolute;left:0;top:0}.body .section1 .banner .swiper-pagination .swiper-pagination-bullet-active::after{animation:long 4s forwards ease}@keyframes long{from{width:0}to{width:100%}}.body .section1 .rt{font-size:4.5vw;text-transform:capitalize;font-family:"PingFang SC", "Calibri", "opensans", "GothicArial", "Arial", "Microsoft YaHei", "San Francisco", 'Hiragino Sans GB', "Helvetica Neue";position:absolute;right:5%;bottom:25%;text-align:right;font-weight:600}.body .section1 .chose{position:absolute;left:0;bottom:8%;width:100%;display:flex;justify-content:center;z-index:100}.body .section1 .chose .item{width:25%;position:relative;margin:0  15px;cursor:pointer;z-index:100}.body .section1 .chose .item .d1{padding:1.2vw 25px;border:1px solid #000;width:100%;display:flex;align-items:center;font-size:.9vw}.body .section1 .chose .item .d1 .p1{color:rgba(0,0,0,0.4)}.body .section1 .chose .item .d1 .p2{color:#000}.body .section1 .chose .item .d1 .icon{position:absolute;right:5%;top:50%;transform:translateY(-50%)}.body .section1 .chose .item .d2{position:absolute;left:0;top:100%;width:100%;z-index:100;display:none;font-size:.8vw}.body .section1 .chose .item .d2 p{padding:15px;background-color:#000;color:white;transition:all 600ms}.body .section1 .chose .item .d2 p:hover{background-color:#fff;color:#000}.body .section2{width:90%;margin:0 auto  15vw auto}.body .section2 .cases{width:100%;display:flex;justify-content:space-between;flex-wrap:wrap}.body .section2 .cases a{width:49%;margin-bottom:4vw}.body .section2 .cases a .pic{width:100%;overflow:hidden}.body .section2 .cases a .pic img{width:100%;display:block;transition:all 600ms;object-fit:cover}.body .section2 .cases a .text{margin:30px 0}.body .section2 .cases a .text .p1{color:#000;font-size:1.8vw;font-weight:600}.body .section2 .cases a .text .des{color:#000;font-size:.9vw;font-weight:300;margin:15px 0;line-height:1.6;word-break:break-all;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.body .section2 .cases a .text .tag{display:flex}.body .section2 .cases a .text .tag p{display:inline-block;padding:4px 25px;border-radius:50px;background:#C9FF85;color:#000;margin-right:10px}.body .section2 .cases a:hover .pic img{transform:scale(1.05)}.body .section2 .pagination{margin:0 9.375vw 0;display:flex;align-items:center;justify-content:center}.body .section2 .pagination a{color:rgba(0,0,0,0.3);font-size:1.04167vw;font-weight:300;transition:all 600ms;display:block;width:40px;text-align:center;line-height:40px}.body .section2 .pagination a:hover{background-color:#000;color:white}.body .section2 .pagination a.on{background-color:#000;color:white}.body .section2 .pagination a:not(:last-child){margin:0 2.08333vw 0 0}@media screen and (max-width: 1024px){.body .section1{flex-direction:column;height:auto;padding-top:80px}.body .section1 .text{position:static;margin-left:5%;transform:translateY(0);width:90%}.body .section1 .text .title{font-size:32px}.body .section1 .text .des{font-size:16px;width:100%;margin:15px 0}.body .section1 .banner{position:static;max-width:100%;transform:translate(0);width:100%}.body .section1 .banner .bg{width:300px;height:300px;margin:0 auto}.body .section1 .banner .bg span{width:250px;height:250px}.body .section1 .banner .swiper-container .swiper-slide .pic img{width:300px;height:300px;display:block;margin:0 auto}.body .section1 .rt{position:static;margin-right:5%;font-size:32px}.body .section1 .chose{position:relative;width:90%;margin:30px auto;justify-content:space-between;gap:10px}.body .section1 .chose .item{width:50%;margin:0}.body .section1 .chose .item .d1{padding:10px 10px}.body .section1 .chose .item .d1 p{font-size:14px}.body .section1 .chose .item .d1 .icon svg{width:8px}.body .section1 .chose .item .d2 p{font-size:14px}.body .section2{margin:30px auto}.body .section2 .cases a{width:100%;margin-bottom:30px}.body .section2 .cases a .text{margin:15px 0}.body .section2 .cases a .text .p1{font-size:18px}.body .section2 .cases a .text .des{font-size:14px}.body .section2 .cases a .text .tag p{font-size:14px;padding:4px 15px}.body .section2 .pagination{margin:0 auto 60px auto}.body .section2 .pagination a{font-size:16px}}
.cases-process{
  margin: 0 0 9.114vw;
}
.cases-process-wrap{
  width: 90%;
  margin: 0 auto;
}
.cases-process-wrap .t1{
  font-size: 3.958vw;
  font-weight: 400;
  color: #000;
  margin-bottom: 5.208vw;
}

.cases-process .list{
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 3.229vw;
}
.cases-process .item .pic{
  width: 100%;
  aspect-ratio: 16/9;
  position: relative;
  overflow: hidden;
}
.cases-process .item .pic img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 600ms;
}  
.cases-process .item:hover .pic img{
  transform: scale(1.05);
}  
.cases-process .item .pic .bofang{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.cases-process .item .pic .bofang svg{
  width: 4.062vw;
  height: 4.062vw;
}
.cases-process .item .t2{
  color: #000;
  font-size: 1.875vw;
  font-weight: 700;
  margin: 1.25vw 0;
}

.cases-process .item .tag {
  display: flex
}

.cases-process .item .tag p {
  display: inline-block;
  padding: 0.208vw 1.302vw;
  border-radius: 50px;
  background: #C9FF85;
  color: #000;
  margin-right: 0.52vw
}

/* 视频弹框 */
.z_tanchuang {
position: fixed;
height: 100%;
width: 100%;
top: 0;
left: 0;
z-index: 130;
opacity: 0;
visibility: hidden;
pointer-events: none;
transition: all .4s cubic-bezier(.4, 0, .2, 1);
}

.z_tanchuang .tbox {
background: rgba(0, 0, 0, 0.8);
height: 100%;
width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.z_tanchuang .tbox .modal {
background: #C9FF85;
padding: 5px;
display: block;
border-radius: 5px;
position: relative;
width: 90%;
width: 1400px;
max-height: 90%;
margin: 0 auto;
transform: translateY(5%);
opacity: 0;
transition: all .4s cubic-bezier(.4, 0, .2, 1);
}

.z_tanchuang .tbox .modal .out {
position: absolute;
top: 0;
right: -50px;
width: 40px;
height: 40px;
background: #fff url('data:image/svg+xml;base64,PHN2ZyB0PSIxNzU2MjYyODQyMzU0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQ2MTMiIHdpZHRoPSIzMiIgaGVpZ2h0PSIzMiI+PHBhdGggZD0iTTgwOS45ODQgMjc0LjAwNTMzM2wtMjM3Ljk5NDY2NyAyMzcuOTk0NjY3IDIzNy45OTQ2NjcgMjM3Ljk5NDY2Ny01OS45ODkzMzMgNTkuOTg5MzMzLTIzNy45OTQ2NjctMjM3Ljk5NDY2Ny0yMzcuOTk0NjY3IDIzNy45OTQ2NjctNTkuOTg5MzMzLTU5Ljk4OTMzMyAyMzcuOTk0NjY3LTIzNy45OTQ2NjctMjM3Ljk5NDY2Ny0yMzcuOTk0NjY3IDU5Ljk4OTMzMy01OS45ODkzMzMgMjM3Ljk5NDY2NyAyMzcuOTk0NjY3IDIzNy45OTQ2NjctMjM3Ljk5NDY2N3oiIGZpbGw9IiMwMDAwMDAiIHAtaWQ9IjQ2MTQiPjwvcGF0aD48L3N2Zz4=') no-repeat center;
background-size: 20px;
color: #000;
border-radius: 50%;
cursor: pointer;
transition: all ease .3s;
}

.z_tanchuang .tbox .modal .img {
width: 100%;
margin: 0 auto;
}

.z_tanchuang .tbox .modal .img video {
display: block;
width: 100%;
max-width: 100%;
  max-height: 90vh;
}

.z_tanchuang .tbox .modal .img img {
display: block;
margin: 0 auto;
width: 100%;
max-width: 100%;
  max-height: 90vh;
}

.z_tanchuang .tbox .modal .out:hover {
transform: rotate(180deg);
}

.z_tanchuang.act {
visibility: visible;
pointer-events: visible;
opacity: 1;
}

.z_tanchuang.act .tbox .modal {
transform: translateY(0);
opacity: 1;
}


@media screen and (max-width:768px) {
  .cases-process{
      margin: 40px 0 88px;
  }
  .cases-process-wrap{
      width: 90%;
  }
  .cases-process-wrap .t1{
      font-size: 36px;
      margin-bottom: 50px;
  }

  .cases-process .list{
      grid-template-columns: repeat(1,1fr);
      gap: 31px;
  }
  .cases-process .item .pic{
      width: 100%;
  }
  .cases-process .item .pic img{
      width: 100%;
      height: 100%;
  }
  .cases-process .item .pic .bofang svg{
      width: 39px;
      height: 39px;
  }
  .cases-process .item .t2{
      font-size: 27px;
      margin: 12px 0;
  }

  .cases-process .item .tag {
      display: flex
  }

  .cases-process .item .tag p {
      padding: 2px 13px;
      border-radius: 25px;
      margin-right: 5px
  }

  .z_tanchuang .tbox .modal {
      width: 90%;
      padding: 5px;
  }

  .z_tanchuang .tbox .modal .out {
      right: 0;
      top: -50px;
  }
}