/* 移动自适应 */


@media screen and (max-width:48rem) {

    section,
    footer {
        margin: 0 0;
    }

    header {
        position: -webkit-sticky;
        /* 针对Safari浏览器的兼容性 */
        position: sticky;
        z-index: 10000;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 auto;
    }


    /* 导航 */

    .nav {
        width: 100%;
        height: 2.8125rem;
        line-height: 2.8125rem;
        background: #ffffff;
    }

    .container {
        width: 100vw;
        margin: 0 auto;
        display: flex;
        justify-content: space-between
    }

    .nav .logo {
        width: 7.5rem;
        height: 2.0625rem;
        font-family: 'font-ph-b';
        font-size: 1rem;
        margin-left: 1.5625rem;
        /* margin-right: 150px; */
    }

    .nav-list {
        display: none;
    }

    .nav-item {
        width: 140px;
        height: 80px;
        margin-right: 20px;
        line-height: 80px;
        text-align: center;
    }

    .nav-item i {
        width: 7.3504px;
        height: 3.64px;
        margin-left: 8px;
    }

    .n-active {
        color: #173F95;
        font-weight: bold;
    }

    .n-active::before {
        content: "";
        display: inline;
        border-left: 4px solid #173F95;
        height: 30px;
    }


    .serach-bar {
        display: none;
    }

    .serach-bar input {
        width: 100%;
        height: 100%;
        border: none;
        outline: none;
        background-color: #F8F8F8 !important;
        font-family: 'font-ph-r';
    }

    .swiper-slide img {
        height: 9.375rem;
    }

    .swiper-container .swiper-label {
        position: absolute;
        top: 1.25rem;
        right: 1rem;
        height: 1.375rem;
        width: 2.5rem;
        background: rgba(0, 0, 0, 0.3);
        border-radius: .625rem;
        color: #ffffff;
        font-size: .875rem;
        font-family: 'font-py-r';
        z-index: 99999999;
        text-align: center;
        line-height: 1.375rem;
        font-weight: 100;
    }

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

    .swiper-button-prev {
        margin-left: 100px;
    }

    .swiper-button-next {
        margin-right: 100px;
    }

    /* 搜索bar */
    .serach-main-bar {
        width: 21.25rem;
        height: 2.5rem;
        margin: 0 auto;
        position: relative;
        top: -1.25rem;
        z-index: 9999;
    }

    .serach-main-bar input {
        width: 21.25rem;
        height: 2.5rem;
        line-height: 2.5rem;
        font-size: .875rem;
        font-family: 'font-ph-r';
        padding-left: 2rem
    }


    .serach-main-bar i {
        position: absolute;
        left: .625rem;
        top: .625rem;
        width: 1.25rem;
        height: 1.25rem;
        line-height: 1.25rem;
        text-align: center;
        font-size: .875rem;
        color: #B6B6B6;
    }

    .serach-main-bar .line {
        width: 0rem;
        height: 1rem;
        border: .0313rem solid #C7C7C7;
        margin-top: .75rem;
    }

    /* 前景优势 */

    .advantage-box {
        /* margin: 40px 0; */

    }

    .advantage-box .title {
        width: 11.5625rem;
        height: 2.1875rem;
        /* background-image: url(../images/advantage-title.png); */
        background-size: cover;
    }

    .advantage-box .swiper-box {
        width: 100vw;
        margin-top: 1.25rem;
    }


    .advantage-box .swiper-box .swiper-slide img {
        width: 9.8125rem !important;
        height: 7.3125rem !important;
        border-radius: 10px;
        display: block;
    }

    .advantage-box .swiper-box .swiper-slide {
        width: 9.8125rem !important;
        /* box-shadow: 0px 0px 10px 1px rgba(145,191,203,0.38); */
    }


    .advantage-box .swiper-box .swiper-slide .advantage-desc {
        position: relative;
        top: -20px;
        width: 9.8125rem !important;
        height: 9.0625rem !important;
        border-radius: 10px;
        background-color: rgba(255, 255, 255, .9);
        padding: 1.125rem;
    }

    .advantage-box .swiper-box .swiper-slide .advantage-desc .advantage-name {
        font-size: .875rem;
        font-family: 'font-ph-b';
        margin-bottom: .5rem;
    }

    .advantage-box .swiper-box .swiper-slide .advantage-desc .advantage-intro {
        font-size: .75rem;
        font-family: 'font-ph-r';
    }

    .advantage-box .swiper-box .swiper-buttons {
        width: 100vw;
        margin-bottom: 20px;
    }

    .advantage-box .swiper-box .swiper-buttons .swiper-button-prev1 {
        width: 1rem;
        height: 1.25rem;
        border-bottom: .125rem solid #173F95;
    }

    .advantage-box .swiper-box .swiper-buttons .swiper-button-next1 {
        width: 1rem;
        height: 1.25rem;
        border-bottom: .125rem solid #65D9FF;
    }


    .advantage-box .swiper-box .swiper-buttons>div {
        /* margin: 0 22px; */
        cursor: pointer;
    }

    .advantage-box .swiper-box .swiper-buttons img {
        display: none;
    }

    /* 关于 */
    .about-box {
        width: 100%;
        /* height: 31.25rem; */
    }

    .about-box .about-area {
        background-image: url('../images/about-bg-m.png');
        background-size: 100% 14.0625rem;
        background-repeat: no-repeat;
    }

    .about-box .about-area .about-block {
        margin: 0 auto;

    }

    .my-video-dimensions {
        height: auto !important;
    }

    .about-box .about-area .about-block video {
        width: 100%;
        min-height: 8.75rem;
    }

    /* 播放器 覆写 */
    #my-video {
        width: 20.625rem;
        min-height: 8.75rem;
        margin-top: 2.5rem;
        border-radius: .5rem;
        overflow: hidden;
        box-sizing: content-box;
    }

    .video-js .vjs-big-play-button {
        height: 2.5rem;
        width: 2.5rem;
        line-height: 2.5rem;
        border-radius: 2.5rem;
        transition: all 0.4s;
        font-size: 1rem;
        border: none;
    }

    .vjs-poster img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover !important;
        object-fit: unset !important;
        border-radius: .625rem;
    }

    #about-video_html5_api {
        border-radius: .625rem;
    }

    .about-box .about-intro {
        margin-top: .625rem;
        width: 22.1875rem !important;
        /* height: 15.625rem; */
        background-color: rgba(255, 255, 255, .7);
        border-radius: 10px;
        padding: .625rem;
    }

    .about-box .about-intro .about-intro-title {
        font-family: 'font-ph-b';
        font-size: 1rem;
        margin-bottom: .625rem;
    }

    .about-box .about-intro .about-intro-desc {
        font-family: 'font-ph-r';
        font-size: 14px;
        margin-bottom: .625rem;
    }

    .about-box .about-intro .about-intro-btn {
        width: 160px;
        height: 40px;
        background-color: rgba(255, 255, 255, .1);
        border-radius: 6px;
        line-height: 40px;
        border: .0625rem solid #173F95;
        text-align: center;
        cursor: pointer;
        font-family: 'font-ph-b';
        color: #173F95;
        font-size: .875rem;
    }

    .about-box .about-intro .about-intro-btn:hover {
        background-color: #173F95;
        color: #ffffff;
    }

    .about-contact {
        background-image: url('../images/m-contact-bar-bg.png') !important;
        background-size: 100% 100% !important;
    }

    /* 证书 */

    .certificate-box {
        width: 100vw;
        background-image: url('../images/certificate-bg.png');
        background-size: 100% 100%;
        padding-bottom: 1.875rem;
    }

    .certificate-box .title {
        width: 11.5625rem;
        height: 2.1875rem;
        background-size: cover;
        margin-top: 20px;
        background-image: url('../images/certificate-title.png');
    }


    .certificate-list {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
        padding-left: 1.25rem;
        padding-right: 1.25rem;



    }

    .certificate-list ul {
        width: 100vw;

    }

    .certificate-list .certificate-item {}

    .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 11.875rem;
        height: 14.6875rem;
        background: linear-gradient(180deg, #173F95 0%, #6F92DE 100%);
        opacity: 0;
        z-index: 99999;
        border-radius: 10px;
        display: none !important;
    }

    .certificate-list .certificate-item:hover .overlay {
        display: block;
        opacity: 0.9;
    }

    .certificate-list .certificate-item img {
        /* width: 49%; */
        /* height: 14.6875rem; */
        border-radius: 10px;
    }

    .certificate-list .certificate-item .certificate-info {
        /* width: 100%; */
        /* width: 11.875rem; */
        height: 2.8125rem;
        top: -2.8125rem;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0.8), rgba(249, 250, 202, 0.8));
        backdrop-filter: blur(1.25rem);
        /* 控制模糊程度 */
        background-size: cover;
        background-position: center;
        text-align: center;
        border-radius: 10px;
        line-height: 1rem;
    }

    .certificate-list .certificate-item .certificate-title {
        font-family: 'font-ph-b';
        font-weight: bold;
        font-size: 16px;
    }

    .certificate-list .certificate-item .certificate-desc {
        font-family: 'font-ph-r';
        font-size: 14px;
    }

    .certificate-box .more-btn {
        margin-top: .625rem;
        width: 19.6875rem;
        height: 2.75rem;
        background-color: #173F95;
        color: #ffffff;
        border-radius: 6px;
        line-height: 2.75rem;
        border: .0625rem solid #173F95;
        text-align: center;
        cursor: pointer;
        font-family: 'font-ph-b';
        color: #ffffff;
        font-size: .875rem;
    }

    .certificate-box .more-btn:hover {
        background-color: rgba(255, 255, 255, .1);
        color: #173F95;
    }


    /* 产品 */

    .product-box {
        width: 100%;
    }

    .product-box .tabs .btn1 {
        color: #173F95;
        font-family: 'font-py-b';
        font-size: .875rem;
        width: 10.3125rem;
        height: 2.1875rem;
        line-height: 2.1875rem;
        text-align: center;
        border-radius: 4px 0rem 0rem 4px;
        background-image: url(../images/notselected-bg-l.png);
        background-size: 100% 100%;
        cursor: pointer;
        position: relative;
        padding-bottom: .625rem;
        /* 为三角形留出空间 */
    }



    .product-box .tabs .btn2 {
        background-color: #fff;
        /* border: .0625rem solid #173F95; */
        color: #173F95;
        font-family: 'font-py-b';
        font-size: .875rem;
        width: 10.3125rem;
        height: 2.5625rem;
        line-height: 2.5625rem;
        text-align: center;
        border-radius: 0rem 4px 4px 0rem;
        background-image: url(../images/notselected-bg-r.png);
        background-size: 100% 100%;
        cursor: pointer;
        position: relative;
        padding-bottom: .625rem;
        /* 为三角形留出空间 */


    }



    .product-box .tabs .active {
        color: #fff;
        background-color: #173F95;
    }

    .product-box .tabs .active::after {
        content: '';
        position: absolute;
        left: calc(50% - 6px);
        right: 0;
        bottom: -6px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 6px 6px 0 6px;
        /* 上三角形的大小 */
        border-color: #173F95 transparent transparent transparent;
    }

    .product-box .product-list {
        width: 100vw;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1.25rem;
        margin-top: 1.875rem;
        padding: .625rem;

    }

    .product-box .product-list:after {
        content: "";
        width: 6.25rem;
    }

    .product-box .product-list .product-item {
        /* width: 49%; */
        height: 18.4375rem;
        background-color: #ffffff;
        cursor: pointer;
        /* margin-bottom: 1.375rem; */
    }

    .product-box .product-list .product-item .product-img {
        width: 100%;
        height: 6.25rem;
        border-radius: .625rem;
    }


    .product-box .product-list .product-item .product-name {
        height: .875rem;
        font-size: .875rem;
        margin-left: .5rem;
        margin-top: .5rem;
    }

    .product-box .product-list .product-item .product-name img {
        width: .875rem !important;
        height: 1.125rem !important;
    }

    .product-box .product-list .product-item .product-desc {
        font-family: 'font-ph-r';
        font-size: .6875rem;
        margin-left: .5rem;
        margin-top: .5rem;
    }

    .product-box .product-list .product-item .product-brand {
        font-family: 'font-ph-b';
        font-size: .75rem;
        margin-left: .5rem;
        margin-top: .5rem;
    }

    .product-box .product-list .product-item .product-button {
        background-color: #E6F1FF;
        color: #173F95;
        font-family: 'font-py-b';
        font-weight: 700;
        font-size: 14px;
        width: auto;
        height: 1.875rem;
        line-height: 1.875rem;
        text-align: center;
        border-radius: .375rem;
        cursor: pointer;
        margin-left: .5rem;
        margin-right: .5rem;
        margin-top: .5rem;
    }

    .product-box .product-list .product-item:hover .product-button {
        background-color: #173F95;
        color: #fff;
    }




    /* 产品 */

    .brand-box {
        width: 100%;
        /* background-image: url('../images/brand-bg.png'); */
        /* background-size: cover; */
        /* padding-top: .625rem; */
    }

    .brand-box .tabs .btn1 {
        color: #173F95;
        font-family: 'font-py-b';
        font-size: .875rem;
        width: 10.3125rem;
        height: 2.1875rem;
        line-height: 2.1875rem;
        text-align: center;
        border-radius: 4px 0rem 0rem 4px;
        background-image: url(../images/notselected-bg-l.png);
        background-size: 100% 100%;
        cursor: pointer;
        position: relative;
        padding-bottom: .625rem;
        /* 为三角形留出空间 */
    }


    .brand-box .tabs .btn2 {
        background-color: #fff;
        /* border: .0625rem solid #173F95; */
        color: #173F95;
        font-family: 'font-py-b';
        font-size: .875rem;
        width: 10.3125rem;
        height: 2.5625rem;
        line-height: 2.5625rem;
        text-align: center;
        border-radius: 0rem 4px 4px 0rem;
        background-image: url(../images/notselected-bg-r.png);
        background-size: 100% 100%;
        cursor: pointer;
        position: relative;
        padding-bottom: .625rem;
        /* 为三角形留出空间 */

    }

  

    .brand-box .tabs .active {
        color: #fff;
        background-color: #173F95;
    }

    .brand-box .tabs .active::after {
        content: '';
        position: absolute;
        left: calc(50% - 6px);
        right: 0;
        bottom: -6px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 6px 6px 0 6px;
        /* 上三角形的大小 */
        border-color: #173F95 transparent transparent transparent;
    }

    .brand-box .brand-list {
        width: 100vw;
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(28%, 1fr));
        gap: 20px;
        padding: 10px;
    }

    .brand-box .agent {
        display: none;
    }

    .brand-box .brand-list .brand-item {

        cursor: pointer;
        text-align: center;
    }

    .brand-box .brand-list .brand-item .brand-img {
        width: 100%;
        height: 3.75rem;
        border-radius: .3125rem;
    }

    .brand-box .brand-list .brand-item .brand-name {

        font: 16px 'font-py-r';
        color: #1C1C1C;
        font-size: .875rem;
        font-weight: 400;
        line-height: 1.875rem;

    }

    /* footer */
    .footer {
        background-color: #ffffff;
        /* height: 640px; */
        /* padding-top: 80px; */
        margin-bottom: 0 !important;
    }

    .footer-content {
        width: 100vw;
        margin: 0 auto;
        padding: 0 10.3125rem;
        display: flex;
        justify-content: space-between;
    }

    .footer-content .arrow {
        color: #3E3E3E;
        transform: scale(0.6, 0.6) rotate(270deg);
    }

    .footer-item {
        width: 350px;
        display: flex;
    }

    .footer-item-content-li {
        margin-bottom: 20px;
    }

    .footer-item .text {
        margin-bottom: 36px;
    }

    .footer-item .text>.footer-item-info {
        margin-left: 8px;
    }


    .footer-item .footer-item-content-li img {
        width: 2.875rem;
        height: 2.875rem;
    }

    .footer-item-name {
        margin: 1.25rem 0;
        font-size: 1.25rem;
        font-family: 'font-py-r';
        text-align: center;
    }

    .footer-item-info {
        font-size: .875rem;
        font-family: 'font-py-r';
        color: #3E3E3E;
        margin-left: 1.125rem;
    }

    .copy-right {
        width: 100vw;
        margin: 0 auto;
        text-align: center;
        height: 3.125rem;
        line-height: 3.125rem;
        font-family: 'font-py-r';
        font-size: .75rem;
        color: #3E3E3E;
        background-color: #fff;
    }

    .horizontal-line {
        border-top: .0625rem solid #E5E5E5;
        font-size: 0;
        height: 0;
        line-height: 0;
    }

    .case-desc {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        text-overflow: ellipsis;
    }
}