 .section2 {
     padding: 100px 0;
 }



 .box2 {
     width: 100%;
     overflow: hidden;
     display: flex;
     justify-content: space-between;
 }

 .box2Swiper {
     width: 100%;

 }

 .box2Slide {
     background: #F6F6F6;
     display: flex;
     flex-wrap: wrap;
 }

 .box2Slide .yy {
     width: calc(100% - 600px);
     overflow: hidden;
 }

 .box2Slide .yy img {
     width: 100%;
     transition: 0.5s;
 }

 .box2Slide .yy:hover img {
     transform: scale(1.08);
 }


 .box2Slide .cp {
     width: 350px;
     padding: 0 50px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
 }

 .box2Slide .cp h1 {
     color: #000;
     font-family: DIN;
     font-size: 28px;
     font-weight: 500;
     line-height: 1;
     text-transform: uppercase;
     margin-bottom: 20px;
     position: relative;
 }

 .box2Slide .cp h1::after {
     content: "";
     display: block;
     background: var(--color);
     height: 4px;
     width: calc(100% + 10px);
     position: absolute;
     left: -5px;
     bottom: 0;
 }

 .box2Slide .cp .img {
     width: 100%;
     background: #F1F1F1;
     padding: 20px;
     overflow: hidden;
 }

 .box2Slide .cp .img img {
     width: 100%;
     transition: 0.5s;
 }

 .box2Slide .cp:hover .img img {
     transform: scale(1.08);
 }

 .box2Slide .next {
     width: 200px;
     margin-left: 50px;
     padding: 0 5px;
     margin-top: 120px;
     display: flex;
     justify-content: space-between;
 }

 .box2Slide .next h1 {
     color: #6C6C6C;
     font-family: DIN;
     font-size: 16px;
     font-weight: 500;
     line-height: 1;
     text-transform: uppercase;
     writing-mode: vertical-rl;
 }

 .box2Slide .next span {
     width: 150px;
     height: 240px;
     background: var(--color);
 }

 .box2Slide .next span img {
     width: 85px;
     height: 240px;
     margin-top: 75px;
     margin-left: 30px;
     object-fit: cover;
 }


 .box2Pagination {
     background: #fff;
     width: 250px;
     height: 120px;
     right: 600px;
     left: auto;
     bottom: 0;
     display: flex;
     justify-content: flex-end;
     align-items: flex-end;
     padding: 15px 45px;
     color: #000;
     font-family: DIN;
     font-size: 16px;
     font-weight: 500;
     line-height: 1;
     letter-spacing: 5px;
 }

 .box2Pagination .swiper-pagination-current {
     color: var(--color);
     font-family: DIN;
     font-size: 48px;
     font-weight: 500;
     line-height: 1;
     margin-bottom: -3px;
 }

 .box2Pagination .swiper-pagination-total {
     color: #000;
     font-family: DIN;
     font-size: 16px;
     font-weight: 500;
     line-height: 1;
 }


 .box2Swiper .aniu {
     width: 200px;
     height: 45px;
     position: absolute;
     z-index: 9;
     right: 0;
     top: 500px;
     display: flex;
     justify-content: center;
     align-items: center;
 }

 .box2Prev {
     width: 30px;
     height: 8px;
     background: url(/assets/images/prve.png) no-repeat;
     background-size: 100% 100%;
     opacity: 1;
     position: relative;
     left: auto;
     right: auto;
     top: auto;
     bottom: auto;
     transform: rotate(90deg) rotateX(180deg);
     margin: 0;
     margin-right: -5px;
     margin-top: -15px;
 }

 .box2Next {
     width: 30px;
     height: 8px;
     background: url(/assets/images/next.png) no-repeat;
     background-size: 100% 100%;
     opacity: 1;
     position: relative;
     left: auto;
     right: auto;
     top: auto;
     bottom: auto;
     transform: rotate(90deg);
     margin: 0;
     margin-left: -5px;
     margin-bottom: -15px;
 }

 .box2Next:after,
 .box2Prev:after {
     display: none;
 }

 @media (max-width: 1600px) {
     .box2Slide .next {
         margin-top: 60px;
     }

     .box2Swiper .aniu {
         top: 400px;
     }
 }

 @media (max-width: 1440px) {
     .box2Slide .yy {
         width: calc(100% - 500px);
     }

     .box2Slide .cp {
         width: 300px;
     }

     .box2Slide .next {
         margin-top: 45px;
         margin-left: 0;
     }

     .box2Pagination {
         width: 180px;
         height: 90px;
         right: 500px;
     }
 }

 @media (max-width: 1200px) {
     .box2Swiper {
         width: 100%;
         max-width: 700px;
     }

     .box2Slide {
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between;
     }

     .box2Slide .yy img {
         height: 400px;
         object-fit: cover;
     }

     .box2Slide .yy {
         width: 100%;
     }

     .box2Slide .cp {
         width: 400px;
         height: 500px;
     }

     .box2Slide .cp .img {
         padding: 45px;
     }

     .box2Swiper .aniu {
         top: auto;
         bottom: 30px;
     }

     .box2Pagination {
         width: 200px;
         right: 0;
         bottom: 500px;
     }
 }

 @media (max-width: 992px) {}

 @media (max-width: 640px) {
     .section2 {
         padding: 45px 0;
     }

     .box2Swiper {
         width: 100%;
         max-width: 350px;
     }

     .box2Slide {
         display: flex;
         flex-wrap: wrap;
         justify-content: space-between;
     }

     .box2Slide .yy img {
         height: 170px;
         object-fit: cover;
     }

     .box2Slide .cp {
         width: 200px;
         height: 320px;
         padding: 0 10px;
         display: flex;
         flex-direction: column-reverse;
         justify-content: space-around;
     }

     .box2Slide .cp h1 {
         font-size: 18px;
         line-height: 1;
     }

     .box2Slide .cp .img {
         padding: 30px;
     }

     .box2Slide .cp h1::after {
         height: 3px;
     }

     .box2Slide .next {
         width: 120px;
         margin-top: 0;
         padding: 0;
     }

     .box2Slide .next h1 {
         font-size: 14px;
         margin-top: 45px;
     }

     .box2Slide .next span {
         width: 90px;
         height: 140px;
         display: flex;
         justify-content: center;
     }

     .box2Slide .next span img {
         width: 54px;
         height: 144px;
         margin-top: 75px;
         object-fit: cover;
         margin-left: 0;
     }

     .box2Swiper .aniu {
         width: 90px;
     }

     .box2Pagination {
         width: 90px;
         height: 30px;
         right: 0;
         bottom: 320px;
         padding: 4px 0;
         font-size: 14px;
         display: flex;
         align-items: baseline;
         justify-content: center;
     }

     .box2Pagination .swiper-pagination-current {
         font-size: 22px;
     }

     .box2Pagination .swiper-pagination-total {
         font-size: 14px;
     }
 }