 .NyBigBox {
     padding: 0;
 }

 /* box1  */
 .box1 {
     padding-top: 150px;
     position: relative;
 }

 .box1 ::after {
     content: "";
     display: block;
     width: 50%;
     height: 100%;
     background: #F6F6F6;
     position: absolute;
     z-index: -1;
     right: 0;
     bottom: 0;
 }

 .box1 .container {
     display: flex;
     flex-wrap: wrap;
 }

 .box1 .container .imgBox {
     width: 65%;
     overflow: hidden;
 }

 .box1 .container .imgBox img {
     width: 100%;
     transition: 0.5s;
 }

 .box1 .container .imgBox:hover img {
     transform: scale(1.08);
 }

 .box1 .container .text {
     width: 35%;
     padding: 0 75px;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .box1 .container .text h1 {
     font-size: 38px;
     line-height: 1.5;
     font-weight: bold;
     color: #3C3B3B;
     text-transform: uppercase;
     position: relative;
     margin-bottom: 45px;
 }

 .box1 .container .text h1::after {
     content: "";
     display: block;
     width: 80%;
     height: 7px;
     background: var(--color);
     position: absolute;
     z-index: 1;
     left: 0;
     bottom: 0;
 }

 .box1 .container .text h2 {
     font-size: 16px;
     line-height: 1.5;
     color: #8A8A8A;
 }

 @media (max-width: 1600px) {
     .box1 .container .imgBox {
         width: 55%;
     }

     .box1 .container .text {
         width: 45%;
         padding: 0 45px;
     }
 }

 @media (max-width: 1200px) {
     .box1 .container .text h1 {
         font-size: 32px;
     }
 }

 @media (max-width: 992px) {
     .box1 {
         padding-top: 120px;
         position: relative;
     }

     .box1 .container {
         display: flex;
         flex-wrap: wrap;
         flex-direction: column-reverse;
     }

     .box1 .container .text {
         width: 100%;
         padding: 0;
         margin: 0 auto;
         align-items: center;
     }

     .box1 .container .text h1 {
         text-align: center;
         width: 100%;
         max-width: 360px;
     }

     .box1 .container .text h1::after {
         width: 100%;
     }

     .box1 .container .text h2 {
         width: 80%;
         text-align: center;
         margin-bottom: 60px;
     }

     .box1 .container .imgBox {
         width: 100%;
     }
 }

 @media (max-width:640px) {
     .box1 {
         padding-top: 60px;
     }

     .box1 ::after {
         display: none;
     }

     .box1 .container .text h1 {
         font-size: 26px;
         max-width: 300px;
         margin-bottom: 30px;
     }

     .box1 .container .text h2 {
         width: 95%;
         text-align: center;
         margin-bottom: 15px;
     }
 }

 /* box2 */
 .box2 {
     padding: 80px 0 150px;
 }

 .box2title {
     font-size: 16px;
     line-height: 1.5;
     color: #8A8A8A;
     max-width: 780px;
     text-align: center;
     margin: 0 auto;
     margin-bottom: 75px;
 }

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

 .box2Icon .icon {
     display: flex;
 }

 .box2Icon .icon .img {
     width: 100px;
 }

 .box2Icon .icon:hover .img {
     transform: rotateY(360deg);
     transition: 1s;
 }

 .box2Icon .icon .img img {
     width: 100%;
 }

 .box2Icon .icon .text {
     padding-left: 45px;
     display: flex;
     flex-direction: column;
     justify-content: center;
 }

 .box2Icon .icon .text h1 {
     font-size: 26px;
     color: var(--color);

 }

 .box2Icon .icon .text p {
     font-size: 16px;
     color: #000;
     margin: 0;
 }

 @media (max-width:992px) {
     .box2 {
         padding: 90px 0;
     }

     .box2title {
         margin-bottom: 45px;
     }

     .box2Icon .icon .img {
         width: 75px;
     }

     .box2Icon .icon .text {
         padding-left: 30px;
     }
 }

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

     .box2title {
         margin-bottom: 30px;
     }

     .box2Icon .icon {
         display: flex;
         width: 100%;
         margin: 10px 0;
     }

     .box2Icon .icon .img {
         width: 75px;
     }

     .box2Icon .icon .text {
         padding-left: 30px;
     }
 }

 /* box3 */
 .box3 {
     background: #F6F6F6;
     padding: 120px 0 240px;
 }

 .box3 .container {
     position: relative;
 }

 .box3 .title {
     color: #000;
     font-size: 36px;
     font-weight: 700;
     line-height: 1;
     text-transform: capitalize;
     margin-bottom: 60px;
 }

 .box3Img {
     position: relative;
     z-index: 1;
     width: 100%;
     padding-left: 40%;
 }

 .box3Swiper {
     position: relative;
     z-index: 2;
 }

 .box3Img::after {
     content: "";
     display: block;
     width: 1410px;
     height: 210px;
     background: url(https://ss-res-us.oss-us-west-1.aliyuncs.com/site_res/170/20231226092413_q58sPmSw.png) no-repeat center;
     background-size: 100% 100%;
     position: absolute;
     bottom: -210px;
     left: 25%;
 }

 .box3Swiper .swiper-wrapper {
     display: flex;
     align-items: flex-end;
 }

 .box3Slide img {
     width: 100%;
 }


 .box3Img .swiper-button-next,
 .box3Img .swiper-button-prev {
     width: 56px;
     height: 56px;
     background: var(--color);
     top: auto;
     bottom: 0;
     z-index: 3;
     opacity: 1;
 }

 .box3Img .swiper-button-next {
     left: 90px;

 }

 .box3Img .swiper-button-next:after,
 .box3Img .swiper-button-prev:after {
     font-size: 12px;
     color: #fff;
 }

 .box3Img .swiper-button-next:hover,
 .box3Img .swiper-button-prev:hover {
     opacity: 0.5
 }

 @media (max-width:992px) {
     .box3 {
         padding: 90px 0 160px;
     }
 }

 @media (max-width: 640px) {
     .box3 {
         padding: 60px 0 120px;
     }

     .box3 .title {
         font-size: 28px;
         margin-bottom: 30px;
         text-align: center;
     }

     .box3Img {
         padding: 0 30px;
     }

     .box3Img .swiper-button-next,
     .box3Img .swiper-button-prev {
         width: 20px;
         height: 50px;
         left: 0;
         bottom: calc(50% - 25px);
     }

     .box3Img .swiper-button-next {
         right: 0;
         left: auto;
     }

     .box3Img::after {
         height: 150px;
         bottom: -150px;
         left: -20%;
     }

     .box3 img.bottom {
         padding-top: 90px;
     }
 }


 /* 放大 */
 .bigimg {
     width: auto !important;
     height: auto !important;
     max-width: 70vw !important;
     max-height: 70vh !important;
     position: fixed;
     left: 0;
     top: 0;
     right: 0;
     bottom: 0;
     margin: auto;
     display: none;
     z-index: 9999;
     border: 20px solid #fff;
     object-fit: contain;
 }

 .mask {
     position: fixed;
     left: 0;
     top: 0;
     right: 0;
     bottom: 0;
     background-color: #000000cc;
     z-index: 9998;
     transition: all 1s;
     display: none
 }

 .mask img {
     width: 50px;
     height: 50px;
     background: #fff;
     padding: 15px;
     border-radius: 50%;
     position: fixed;
     bottom: 5vh;
     left: calc(50% - 25px);
 }

 @media (max-width: 640px) {
     .mask img {
         bottom: 10vh;
     }
 }