.banner {
    width: 100%;
    height: 749px;
    background-image: url("../images/banner.jpg");
}


.blue-bg {
    position: relative;
    width: 100%;
    height: 995px;
    background: #f6fafd;
}
.about {
    position: absolute;
    top: -125px;
    left: 50%;
    width: 1145px;
    margin-left: -572.5px;
}
.about .item {
    position: relative;
    width: 362px;
    /*height: 450px;*/
    /*background: #fff;*/
    border-radius: 20px 20px 0 0;
    box-shadow: 0 0 20px rgba(var(--bs-body-color-rgb),.1)!important;
    overflow: hidden;
}
.about .item .icon {
    width: 90px;
    position: absolute;
    bottom: 100px;
    left: -25px;
    background: #f39c11;
    border-radius: 50px;
}
.about .item .icon img {
    width: 40px;
    padding: 5px;
    margin-left: 35px;
}
.about .item .wrap {
    color: #455066;
    font-size: 16px;
    padding: 30px 20px;
    text-align: center;
    font-family: 'avant-book';
}
.experience {
    width: 1460px;
    position: absolute;
    top: 460px;
    left: 50%;
    margin-left: -590px;
}
.experience .txt {
    width: 937px;
    height: 475px;
    background: url("../images/p_05.jpg") no-repeat;
    color: #455066;
    font-size: 18px;
    padding: 40px 70px;
    line-height: 2;
    font-family: 'avant-book';
}
.experience .txt h1 {
    font-weight: bold;
    font-family: 'avant-lt';
    margin-bottom: 30px;
}



#carousel {
    position: relative;
    height: 610px;
    background-color: #f6fafd;
    background-image: url("../images/carousel_bg_03.jpg");
    padding: 40px 0;
}

#carousel .swiper-pagination {
    width: 100%;
    bottom: 20px;
}
#carousel .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: transparent;
    border: 2px solid #b9bcc2;
    margin-right: 3px;
}
#carousel .swiper-pagination-bullet.swiper-pagination-bullet-active{
    border: 2px solid #f6a631;
}
.swiper-button-prev {
    width: 51px;
    height: 42px;
    background: url("../images/prev.png") no-repeat;
    background-size: cover;
    top: 180px;
    left: 50px;
}
.swiper-button-next {
    width: 51px;
    height: 42px;
    background: url("../images/next.png") no-repeat;
    background-size: cover;
    top: 180px;
    right: 50px;
}
.swiper-button-prev::after,.swiper-button-next::after{
    content:''
}
.whatSwiper .swiper-slide-active img {
    border: 3px solid #f69a13;
    border-radius: 50%;
}
.whatSwiper .swiper-slide,.whatSwiper .swiper-slide img {
    width: 100px;
    margin: 20px 0;
}


.recommend {
    width: 1100px;
    margin: 50px auto;
}
.recommend .product-box {
    position: relative;
    width: 330px;
    text-align: center;
    font-size: 14px;
    font-family: 'avant-book';
    margin-top: 75px;
    padding: 20px 30px;
    cursor: pointer;
}
.recommend .product-box .mask {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.6);
}
.recommend .product-box .mask img {
    margin-top: 40%;
}
.recommend .product-box img {
    margin-bottom: -75px;
}
.recommend .btn-click {
    display: block;
    margin: 10px auto;
}
.recommend .tips {
    color: rgba(69,80,102,.3);
    font-size: 12px;
}