@import "init.css";


section {
   width: 100%;
   padding-left: 5%;
}

.scroll-point {
   scroll-margin-top: 300px;
}

.ptitle {
   display: flex;
   justify-content: space-between;
   align-items: flex-end;
   margin: 110px 0 30px;
}

.ptitle .enname {
   font-size: clamp(44px, 3vw, 50px);
   text-transform: uppercase;
}

.ptitle .cnname {
   font-size: clamp(16px, 1.2vw, 19px);
   margin-left: 10px;
}

.swiperbtn {
   margin-right: 5%;
}

.list-item {
   position: relative;
   display: block;
   overflow: hidden;
   cursor: pointer;
}

.list-item img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   transition: scale 0.6s;
}

.list-item .cover {
   width: 100%;
   position: relative;
}

.list-item:hover .cover img {
   scale: 1.1;
}

.list-title {
   position: relative;
   color: white;
}

.list-title .left {
   position: absolute;
   left: 20px;
   bottom: 20px;
   font-size: clamp(14px, 1vw, 16px);
   line-height: 1.25;
   /*text-shadow: 2px 2px 3px rgba(0, 0, 0, 0.6);*/
}

.list-title .left .enname {
   font-size: clamp(18px, 1.5vw, 24px);
}

.list-title .right {
   position: absolute;
   right: 20px;
   bottom: 20px;
   font-size: clamp(12px, 1vw, 14px);
   line-height: 1.25;
}

.list-title .left p {
   opacity: 0;
   transform: translateX(-40px);
   transition: opacity 0.6s ease, transform 0.6s ease;
}

.list-title .left p:nth-child(1) {
   transition-delay: 0.1s;
}

.list-title .left p:nth-child(2) {
   transition-delay: 0.15s;
}

.list-title .left p:nth-child(3) {
   transition-delay: 0.2s;
   height: 18px;
   overflow: hidden;
}

.list-title .right {
   opacity: 0;
   transition: opacity 0.6s ease 0.3s;
}

.list-item:hover .left p {
   opacity: 1;
   transform: translateX(0);
}

.list-item:hover .right {
   opacity: 1;
}

.icon-youjiantou {
   font-size: 12px;
}

.blank {
   width: 100%;
   height: 260px;
}


/* 响应式布局 */
@media (max-width: 1366px) {
   .list-title .left p {
      opacity: 1;
      transform: translateX(0px);

   }

   .list-title .right {
      opacity: 0;
      transform: translateX(0px);
   }
}

@media (max-width: 767px) {
   .banner-text .enbannertext {
      font-size: 0.8rem;
   }

   .list-item:hover .cover img {
      scale: 1;
   }

   .ptitle {
      margin: 1.6rem 0 20px;
   }

   .ptitle .pname {
      display: flex;
      flex-direction: column;

   }

   .ptitle .enname {
      font-size: 0.5rem;

   }

   .ptitle .cnname {
      font-size: 14px;
      margin-left: 0px;
      padding-top: 6px;

   }

   .list-title .left {
      left: 15px;
      bottom: 10px;
   }
   .list-title .right {
      bottom: 10px;
   }

   .list-title .left .enname {
      font-size: 0.3rem;
   }

.list-item:hover .right {
    opacity: 0;
}

   .blank {
      height: 2.5rem;
   }

}