@media screen and (max-width: 350px) {
    /* styles for mobile devices */
    .phone-box>.phone-main {
        top: 25%;
    }
}
@media screen and (max-width: 451px) {
    .txt-container-btn {
        margin-top: 15%;
    }
    .sanjiao-bottom {
        display: none !important;
    }

    .main-container {
        height: 69  0px;
    }

    .spanbox {
        width: 100%;
        padding: 0 40px;
        margin: 0;
        justify-content: flex-start;
    }

    .span-img {
        width: 95%;
        padding: 5% 0;
    }
    div.phone-container .container{
        height: 600px;
        flex-direction: column;
    }
    .phone-box{
        width: auto;
    }
    .phone-box .phone {
        max-width:120px;
    }

    div.gray-container {
        padding-top: 0;
        margin-top: 60px;
    }

    .div.gray-container div.partner-title strong {
        font-size: .65rem;
    }

    .spanbox>div>a,
    div.gray-container div.partner-title p,
    div.gray-container div.partner-title-item a {
        font-size: .35rem;
    }

    div.gray-container div.partner-icon {
        justify-content: space-evenly;
        padding: 0;
    }

    div.gray-container div.partner-icon div.partner-icon-item {
        width: 30%;
        margin-top: 0.3rem;
        margin-left: 0;
    }

    div.case-container div.case-container-list,
    .case-list {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    div.case-container-list>div:nth-child(n+3) {
        margin-top: 5%;
    }

    div.case-container div.case-container-item {
        width: 48%;
        position: relative;
        margin-left: 0;
    }

    /* title */
    .bt-box>p,
    .spanbox>p,
    div.nav-title {
        font-size: 0.6rem;
        color: #4C4C4C;
        text-align: center;
        margin-top: .2rem;
        margin-bottom: .4rem;

    }

    .bt-box {
        flex-direction: column;
    }

    .case-bottom {
        visibility: hidden;
    }

    .bt-img {
        margin: auto;
        width: 95%;
    }

    .bt-text {
        width: 100%;
        margin-top: .2rem;
    }

    .bt-text>p:first-child,
    .spanbox>div>p:nth-child(2) {
        font-size: .35rem;
        line-height: 25px;
        font-weight: normal;

    }

    .spanbox>div>p:nth-child(n+3) {
        font-size: .35rem;
        color: #333;
        line-height: 0.6rem;
        font-weight: 600;
    }

    div.nav-title,
    div.case-container-title p,
    .bt-box>p,
    .spanbox>p {
        padding-bottom: 10px;
        border-bottom: 1px double rgba(0, 0, 0, .1);
    }

    .Tel-container>div>div {
        left: 5%;
    }

    .Tel-container {
        padding-top: 0px;
    }
}

@media (min-width:450px) and (max-width:767px) {
    div.nav-item {
        width: 30%;
    }

}

@media screen and (max-width:767px) {
    .video-list ul li {
        padding: 10px 5px;
        margin: 5px;
        color: #fff;
        background-color: #3074F1;
        display: flex;
        justify-content: center;
        border-radius: 30px;
        font-size: .4rem;
        ;
        width: 45%;
    }

    .video-list ul {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        margin: 10px 0;
    }

    .video-item {
        display: flex;
        justify-content: center;
        margin: 40px 0;
    }

    .video-item video {
        width: 90%;
    }

    .nav-container {
        height: 18rem;
    }

    .container {
        height: 100%;
    }

    div.nav-list {
        flex-wrap: wrap;
        justify-content: space-around;
    }

    div.nav-item {
        width: 45%;
        height: 30%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin: .2rem 0;
    }

    div.nav-item>.front,
    div.nav-item>p {
        position: static;
        margin-top: 10px;
    }

    div.front {
        height: 70%;
    }

    .partner-icon {
        margin: 10px 0;
    }

    .case-container-item>.case-container-itemTitle {
        width: 100%;
        height: 35px;
        border-radius: 20px;
        flex-direction: column;
        left: 0;

    }

    div.case-container div.case-container-itemTitle a {
        color: #000;
        font-size: 14px;
    }

    video:hover {
        transform: scale(1.1);
        transition: transform 0.3s ease;
    }
}

@media (min-width:768px) and (max-width: 1119px) {
    div.nav-item p {
        font-size: 12px;
    }
}


@media screen and (min-width: 768px) {
    .navbar-login {
        border-right: solid 2.5px #838383b9;
        line-height: 50%;
        display: flex;
        align-items: center;
        font-size: 14px;
    }
    .front {
        position: relative;
        height: auto;
    }
    div.nav-item p {
        position: relative;
    }
}

@media screen and (max-width:991px) {
    div.nav-item:nth-child(n+2) {
        margin-left: 0;
    }

    .partner-title>.partner-more {
        margin-left: auto;
        margin-right: auto;
    }

    .partner-title-list {
        justify-content: center;
    }
}

@media (max-width:729px) {

    .sanjiao-bottom {
        display: none;
    }

    div.container>.phone-box {
        width: 100%;
    }

    .phone-box>.phone-main {
        top: 15%;
    }

    div.phone-container .container {
        flex-direction: column;
    }

    div.phone-container div.phone-container-introduction {
        top: 0 !important;
        right: 0 !important;
        height: 265px !important;
    }
}









/* mobile 设备 350px */
@media screen and (max-width: 350px) {
    /* styles for mobile devices */
}

/* mobile 设备 451px */
@media screen and (max-width: 451px) {
    /* styles for mobile devices */
}

/* 平板设备 768px */
@media screen and (max-width: 768px) {
    /* styles for tablets and small screens */
}

/* 台式电脑、笔记本电脑 992px */
@media screen and (max-width: 992px) {
    /* styles for desktop and larger tablets */
}

/* 大尺寸显示器 993px */
@media screen and (min-width: 993px) {
    /* styles for larger screens */
}