.banner4{
    width: 100%;
    height: 4rem;
    position: relative;
}
.banner4 img{
    width: 100%;
    height: 100%;
}
.banner4title{
    position: absolute;
    left: 2.06rem;
    top: 50%;
        transform: translateY(-50%);
}
.b4tone{
    font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: bold;
font-size: 0.4rem;
color: #FFFFFF;
line-height: 0.37rem;
}
.b4ttwo{
    margin-top: 0.18rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
font-weight: 400;
font-size: 0.18rem;
color: #FFFFFF;
line-height: 0.37rem;
}
.pro4-warp{
    display: flex;
     width: 15rem;
    margin: 0 auto;
        align-items: center;
}
.pro4w-left{
    width: 6.42rem;
    height: 4.68rem;
   position: relative;
}
.caseSwiper {
    height: 100%;
}
/*.caseSwiper {*/
/*     padding: 0 0.36rem;*/
/*}*/
.pro4w-right{
    padding-right: 0.06rem;
    width: 7.5rem;
    margin-left: 1.09rem;
    height: 4.19rem;
    overflow-y: scroll;
    scrollbar-width:thin;
}
.pro4w-right:-webkit-scrollbar-button {
  display: none; /* 这在WebKit浏览器中通常不工作，但可以作为参考 */
}
.pro4w-right::-webkit-scrollbar-track {
    background: #F2F2F2;
}
.pro4w-righ::-webkit-scrollbar-thumb {
    background-color: #D9D9D9;
    /*border-radius: 10px;*/
    border-radius: 1rem 1rem 1rem 1rem;
    width: 0.05rem;
height: 0.5rem;
}

.pro4w-left .swiper-button-next:after, .pro4w-left .swiper-button-prev:after{
        font-size: 0.3rem;
    font-weight: bold;
}
.pro4w-left .swiper-button-next, .pro4w-left .swiper-rtl .swiper-button-prev{
    right: -0.36rem;
}
.pro4w-left .swiper-button-prev, .pro4w-left .swiper-rtl .swiper-button-next{
    left: -0.36rem;
}
.pro4w-left .swiper-button-next, .pro4w-left .swiper-button-prev{
    color: #12A3FD;
}
 .pro4w-left .swiper-button-next.swiper-button-disabled,.pro4w-left .swiper-button-prev.swiper-button-disabled{
    color: #AAAAAA;
    opacity: 100%;
}
.p4wr-title{
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: bold;
    font-size: 0.4rem;
    color: #000000;
    line-height: 0.37rem;
}
.p4wr-time{
    margin-top: 0.18rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.18rem;
    color: #000000;
    line-height: 0.37rem;
}
.p4wr-detail{
    margin-top: 0.52rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.18rem;
    color: #000000;
    line-height: 0.35rem;
}
.pro1 {
    width: 100%;
    background: linear-gradient(180deg, #F2F2F2 0%, #FDFDFD 100%);
    padding-top: 0.95rem;
    padding-bottom: 0.71rem;
}

.pro1 .pro1_con {
    display: flex;
    justify-content: space-between;
    width: 15rem;
    margin: 0 auto;
}

.pro1 .pro1_menu {
    width: 4.16rem;
    background: #FFFFFF;
    border-radius: 0.1rem;
    padding: 0.26rem 0.36rem 0.29rem 0.37rem;
    box-sizing: border-box;
}

.pro1 .pro1_menu .menu_item {
    margin-bottom: 0.12rem;
}

.pro1_menu .menu_item .menu_one {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 0.21rem;
    padding-right: 0.24rem;
    box-sizing: border-box;
    width: 100%;
    height: 0.49rem;
    border-radius: 0.05rem;
    transition: all 0.3s;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.18rem;
    color: #000000;
}

.pro1_menu .menu_item .menu_one:hover {
    background: #12A3FD;
    color: #FFFFFF;
    font-weight: bold;
}

.pro1_menu .menu_item .menu_one.active {
    background: #12A3FD;
    color: #FFFFFF;
    font-weight: bold;
}

.menu_one img {
    display: block;
    width: 0.12rem;
    height: 0.12rem;
}

.pro1_menu .menu_item .menu_two {
    display: none;
    width: 100%;
    box-sizing: border-box;
    padding-left: 0.21rem;
    padding-top: 0.17rem;
    padding-bottom: 0.13rem;
}

.menu_two a {
    transition: all 0.3s;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.16rem;
    color: #505050;
    line-height: 0.35rem;
}

.menu_two a:hover {
    color: #12A3FD;
}

.menu_two a.active {
    color: #12A3FD;
}

.pro1_con .pro1_list {
    width: 10.12rem;
}

.pro1_con .pro1_list .pro1_item {
    display: flex;
    justify-content: space-between;
    width: 100%;
    height: 2.7rem;
    background: #FFFFFF;
    box-shadow: 0 0 0.2rem 0.01rem rgba(0, 0, 0, 0.02);
    border-radius: 0.1rem;
    padding-left: 0.55rem;
    box-sizing: border-box;
    margin-bottom: 0.39rem;
}

.pro1_item .pro1_left {
    width: 5rem;
    padding-top: 0.81rem;
}

.pro1_item .pro1_left .pro1_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0.15rem;
    border-bottom: 0.01rem solid #E2E2E2;
    transition: all 0.3s;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: bold;
    font-size: 0.25rem;
    color: #000000;
    line-height: 0.32rem;
}

.pro1_item:hover .pro1_left .pro1_title {
    color: #12A3FD;
}

.pro1_item .pro1_left .pro1_title img {
    display: block;
    width: 0.3rem;
    height: 0.3rem;
    object-fit: contain;
}

.pro1_item .pro1_left .pro1_title .img2 {
    display: none;
}

.pro1_item:hover .pro1_left .pro1_title .img1 {
    display: none;
}

.pro1_item:hover .pro1_left .pro1_title .img2 {
    display: block;
}

.pro1_item .pro1_left .pro1_text {
    margin-top: 0.18rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.14rem;
    color: #707070;
    line-height: 0.25rem;
}

.pro1_item .pro1_right {
    position: relative;
    width: 4.21rem;
    height: 2.7rem;
    overflow: hidden;
}

.pro1_item .pro1_right .right_img1 {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    transition: all 0.3s;
}

.pro1_item:hover .pro1_right .right_img1 {
    transform: scale(1.1);
}

.pro1_item .pro1_right .right_bg {
    opacity: 0;
    position: absolute;
    right: 0.19rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.98rem;
    height: 1.98rem;
    transition: all 0.3s;
}

.pro1_item:hover .pro1_right .right_bg {
    opacity: 1;
}

.det_top {
    width: 100%;
    height: 6.74rem;
    background: url('../img/product/detail.png') no-repeat;
    background-size: 100% 100%;
    padding-top: 0.51rem;
    box-sizing: border-box;
}

.home_nav {
    display: flex;
    width: 15rem;
    margin: 0 auto;
}

.home_nav .nav_icon {
    display: block;
    width: 0.14rem;
    height: 0.14rem;
    margin-right: 0.09rem;
}

.home_nav .nav_icon img {
    display: block;
    width: 100%;
    height: 100%;
}


.home_nav .nav_item {
    display: block;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.14rem;
    color: #898989;
    line-height: 0.19rem;
}

.home_nav .nav_item:last-child {
    color: #0F0F0F;
}

.top_sw {
    position: relative;
    width: 100%;
    margin-top: 1.41rem;
}

.top_sw .top_swiper {
    width: 9.94rem;
    height: 4.49rem;
    margin-left: 5.07rem;
}

.top_sw .top_swiper img {
    width: 100%;
    height: 100%;
}

.top_sw .swiper-button-next:after,
.top_sw .swiper-button-prev:after {
    display: none;
}

.top_sw .swiper-button-next,
.top_sw .swiper-button-prev {
    position: absolute;
    bottom: 2.26rem;
    top: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 0.51rem;
    height: 0.51rem;
    border: 0.01rem solid #BABABA;
    transition: all 0.3s;
    border-radius: 50%;
}

.top_sw .swiper-button-next img,
.top_sw .swiper-button-prev img {
    width: 0.16rem;
    height: 0.07rem;
}

.top_sw .swiper-button-prev {
    left: 2.1rem;
}

.top_sw .swiper-button-next {
    right: 2.1rem;
}

.top_sw .swiper-button-prev .img1 {
    transform: scaleX(-1);
}

.top_sw .swiper-button-next .img2 {
    transform: scaleX(-1);
}

.top_sw .swiper-button-next .img2,
.top_sw .swiper-button-prev .img2 {
    display: none;
}

.top_sw .swiper-button-next:hover .img1,
.top_sw .swiper-button-prev:hover .img1 {
    display: none;
}

.top_sw .swiper-button-next:hover,
.top_sw .swiper-button-prev:hover {
    background: #12A3FD;
    border: 0.01rem solid #12A3FD;
}

.top_sw .swiper-button-next:hover .img2,
.top_sw .swiper-button-prev:hover .img2 {
    display: block;
}

.det_con {
    width: 15rem;
    margin: 0 auto;
    padding-top: 0.4rem;
    padding-bottom: 0.95rem;
}

.det_title {
    margin-bottom: 0.94rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: bold;
    font-size: 0.35rem;
    color: #000000;
    line-height: 0.47rem;
    text-align: center;
}

.det_text {
    margin-bottom: 0.94rem;
}

.det_text .det_text1 {
    margin-bottom: 0.14rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: bold;
    font-size: 0.25rem;
    color: #000000;
    line-height: 0.33rem;
}

.det_text .det_text2 {
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.16rem;
    color: #080808;
    line-height: 0.3rem;
}

.det_text .det_list {
    display: flex;
flex-wrap: wrap;
    grid-column-gap: 5%;
    row-gap: 0.3rem;
}

.det_text .det_list .det_item {
    
    position: relative;
    /*width: 4.2rem;*/
    overflow: initial;
    /*width: 30%;*/
    padding-left: 0.2rem;
    padding-bottom: 0.14rem;
    border-bottom: 0.01rem solid #E3E3E3;
    box-sizing: border-box;

    transition: all 0.3s;
    cursor: pointer;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.16rem;
    color: #2E2E2E;
    line-height: 0.21rem;

}

.det_text .det_list .det_item:hover {
    border-bottom: 0.01rem solid #12A3FD;
}

.det_text .det_list .det_item:last-child {
    margin-right: 0;
}

.det_text .det_list .det_item::after {
    position: absolute;
    left: 0;
    top: 0.06rem;
    content: "";
    width: 0.07rem;
    height: 0.07rem;
    border-radius: 50%;
    background: #12A3FD;
}

.pro3 {
    width: 100%;
    padding-top: 0.66rem;
    background: url('../img/about/about4bg.png') no-repeat;
    background-size: 100% auto;
    padding-bottom: 0.81rem;
}

.pro3 .pro3_list {
    width: 15rem;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
}

.pro3 .pro3_list .pro3_item {
    display: block;
    width: 4.73rem;
    margin-right: 0.4rem;
    margin-bottom: 0.43rem;
}

.pro3 .pro3_list .pro3_item:nth-child(3n) {
    margin-right: 0;
}

.pro3_list .pro3_item .pro3_img {
    position: relative;
    display: block;
    width: 100%;
    height: 2.95rem;
    overflow: hidden;
}
.mengbanp{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.mengbanp img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.jb{
    position: absolute;
    top: 0.14rem;
    right: 0.12rem;
    width: 0.8rem;
    height: 0.26rem;
}
.jb img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.pro3_img img {
    display: block;
    width: 100%;
    height: 100%;
    transition: all 0.3s;
}

.pro3 .pro3_list .pro3_item:hover .pro3_img>img {
    transform: scale(1.1);
}

.pro3_list .pro3_item .pro3_bot {
    width: 100%;
    /*height: 2.15rem;*/
    /*background: #F8F8F8;*/
    padding: 0.21rem 0 0;
    box-sizing: border-box;
    transition: all 0.3s;
}

.pro3_bot .pro3_title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 0.14rem;
    transition: all 0.3s;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: bold;
    font-size: 0.18rem;
    color: #000000;
    line-height: 0.24rem;
}
.p3t-left{
    max-width: 60%;
}
.pro3_item:hover .pro3_bot .pro3_title {
    color: #12A3FD;
}

.pro3_bot .pro3_icon {
    display: flex;
    align-items: center;
    margin-bottom: 0.01rem;
    transition: all 0.3s;
    font-family: Poppins, Poppins;
    font-weight: 400;
    font-size: 0.15rem;
    color: #333333;
    line-height: 0.25rem;
}

.pro3_bot .pro3_icon img {
    display: block;
    width: 0.1rem;
    height: 0.13rem;
    margin-right: 0.05rem;
}

.pro3_bot .pro3_more {
    display: flex;
    align-items: center;
    transition: all 0.3s;
    margin-top: 0.33rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: 400;
    font-size: 0.15rem;
    color: #666666;
    line-height: 0.2rem;
}

.pro3_item:hover .pro3_bot .pro3_more {
    color: #12A3FD;
}

.pro3_bot .pro3_more img {
    display: block;
    width: 0.09rem;
    height: 0.09rem;
    margin-left: 0.18rem;
}

.pro3_item:hover .pro3_bot {
    /*background: #FFFFFF;*/
    /*box-shadow: 0 0 0.2rem 0.01rem rgba(0, 0, 0, 0.16);*/
}

.pro3_list .pub_page {
    padding-top: 0.32rem;
}

.pro4 {
    width: 100%;
    padding-top: 0.51rem;
    padding-bottom: 1.01rem;
}

.pro4 .pro4_title {
    width: 15rem;
    margin: 0 auto;
    margin-top: 0.71rem;
    margin-bottom: 0.38rem;
    font-family: Microsoft YaHei, Microsoft YaHei;
    font-weight: bold;
    font-size: 0.3rem;
    color: #000000;
    line-height: 0.4rem;
}

.pro4 .pro4_con {
    position: relative;
    display: flex;
    align-items: center;
    width: 15rem;
    margin: 0 auto;
}

.pro4 .gallery-top {
    width: 12.09rem;
    height: 7.57rem;
    overflow: hidden;
    margin-right: 0.26rem;
}

.pro4 .gallery-top img {
    display: block;
    width: 100%;
    height: 100%;
}

.gallery-thumbs {
    width: 2.65rem;
    height: 7rem;
    overflow: hidden;
}

.gallery-thumbs img {
    width: 100%;
    height: 1.66rem;
}

.pro4 .pro4_con .swiper-button-prev::after,
.pro4 .pro4_con .swiper-button-next::after {
    display: none;
}

.pro4 .pro4_con .swiper-button-prev,
.pro4 .pro4_con .swiper-button-next {
    position: absolute;
    right: 1.16rem;
    width: 0.24rem;
    height: 0.14rem;
    left: unset;
    height: 0.14rem;
}

.pro4 .pro4_con .swiper-button-prev {
    top: -0.07rem;
}

.pro4 .pro4_con .swiper-button-next {
    bottom: 0;
    top: unset;
}

.pro4 .pro4_con .swiper-button-prev img,
.pro4 .pro4_con .swiper-button-next img {
    width: 0.24rem;
    height: 0.14rem;
}

.pro4 .pro4_con .swiper-button-prev .img1 {
    transform: rotate(180deg);
}

.pro4 .pro4_con .swiper-button-next .img2 {
    transform: rotate(180deg);
}

.pro4 .pro4_con .swiper-button-prev .img2,
.pro4 .pro4_con .swiper-button-next .img2 {
    display: none;
}

.pro4 .pro4_con .swiper-button-prev:hover .img2,
.pro4 .pro4_con .swiper-button-next:hover .img2 {
    display: block;
}

.pro4 .pro4_con .swiper-button-prev:hover .img1,
.pro4 .pro4_con .swiper-button-next:hover .img1 {
    display: none;
}